feat:CN-1522 插件管理界面与接口调试

src/components/table/system/PluginTable.vue

@@ -28,25 +28,28 @@
         <div class="col-resize-area"></div>
       </template>
       <template #default="scope" :column="item">
-        <template v-if="item.prop === 'status'">
+        <template v-if="item.prop === 'triggerStatus'">
           <el-switch
-              v-model="scope.row.status"
+              v-model="scope.row.triggerStatus"
               active-value="1"
               inactive-value="0"
               @change="()=>{statusChange(scope.row)}">
           </el-switch>
         </template>
         <template v-else-if="item.prop === 'type'">
-          <span class="type-tag">{{tagSourceText(scope.row[item.prop])}}</span>
+          <span class="type-tag">{{typeText(scope.row['id'])}}</span>
         </template>
         <template v-else-if="item.prop === 'name'">
           <div class="plugin-name">
-            <div class="icon-background"><img class="plugin-name-icon" :src="getIconUrl(scope.row['knowledgeId'])"/></div>
+            <div class="icon-background"><img class="plugin-name-icon" :src="getIconUrl(scope.row['id'])"/></div>
-            {{scope.row[item.prop] || '-'}}
+            {{getName(scope.row['id'])}}
           </div>
         </template>
         <template v-else-if="item.prop === 'description'">
-          <div class="two-line" :title="getDescription(scope.row['knowledgeId'])">{{getDescription(scope.row['knowledgeId'])}}</div>
+          <div class="two-line" :title="getDescription(scope.row['id'])">{{getDescription(scope.row['id'])}}</div>
+        </template>
+        <template v-else-if="item.prop === 'schedule'">
+          <div class="two-line" >{{scheduleText(scope.row['id'])}}</div>
         </template>
         <span v-else>{{scope.row[item.prop] || '-'}}</span>
       </template>
@@ -62,7 +65,8 @@
 <script>
 import table from '@/mixins/table'
 import axios from 'axios'
-import { storageKey, knowledgeBaseSource, builtInKnowledgeBaseBasicInfo } from '@/utils/constants'
+import { api } from '@/utils/api'
+import { storageKey, pluginBasicInfo,pluginSchedule } from '@/utils/constants'
 
 export default {
   name: 'pluginTable',
@@ -99,7 +103,7 @@ export default {
           minWidth: 150
         }, {
           label: this.$t('overall.status'),
-          prop: 'status',
+          prop: 'triggerStatus',
           show: true,
           minWidth: 200
         }
@@ -107,37 +111,51 @@ export default {
     }
   },
   computed: {
-    tagSourceText () {
+    typeText () {
+      return function (id) {
+        const t = pluginBasicInfo.find(t => t.id === id)
+        return t ? t.type : 'Unknown Tag'
+      }
+    },
+    scheduleText () {
       return function (type) {
-        const t = knowledgeBaseSource.find(t => t.value === type)
+        return this.$t(pluginSchedule.always)
-        return t ? t.name : 'Unknown Tag'
       }
     },
     getIconUrl () {
-      return function (knowledgeId) {
+      return function (id) {
-        const basicInfo = builtInKnowledgeBaseBasicInfo.find(bi => bi.knowledgeId === knowledgeId)
+        const basicInfo = pluginBasicInfo.find(bi => bi.id === id)
         return basicInfo ? basicInfo.iconUrl : ''
       }
     },
     getDescription () {
-      return function (knowledgeId) {
+      return function (id) {
-        const basicInfo = builtInKnowledgeBaseBasicInfo.find(bi => bi.knowledgeId === knowledgeId)
+        const basicInfo = pluginBasicInfo.find(bi => bi.id === id)
         return basicInfo ? this.$t(basicInfo.desc) : '-'
       }
+    },
+    getName () {
+      return function (id) {
+        const basicInfo = pluginBasicInfo.find(bi => bi.id === id)
+        return basicInfo ? this.$t(basicInfo.name) : '-'
+      }
     }
   },
   methods: {
     statusChange (plugin) {
-      let status = plugin.status
+      let triggerStatus = plugin.triggerStatus
-      let statusUrl = status === 0 ? api.pluginStatusEnable : api.pluginStatusDisable
+      let statusUrl = triggerStatus === '1' ? api.pluginStatusEnable : api.pluginStatusDisable
-
+      statusUrl = statusUrl.replace('{{id}}', plugin.id)
-      axios.put(statusUrl,{id:plugin.id}).then(response => {
+      axios.post(statusUrl).then(response => {
         if (response.status === 200) {
           this.$message({ duration: 1000, type: 'success', message: this.$t('tip.saveSuccess') })
         } else {
           this.$message.error(response.data.message)
         }
         this.$emit('reload')
+      }).catch(e => {
+        console.error(e)
+        this.$message.error(this.errorMsgHandler(e))
       })
     }
   }

src/utils/api.js

@@ -44,10 +44,10 @@ export const api = {
   updateKnowledgeUrl: apiVersion + '/knowledgeBase/items/batch',
   knowledgeBaseLog: apiVersion + '/knowledgeBase/audit/log',
   knowledgeBaseTimedistribution: apiVersion + '/knowledgeBase/{{knowledgeId}}/{{type}}/timedistribution',
-  //插件
+  // 插件
   pluginList: apiVersion + '/plugin/intelligence-learning/list',
-  pluginStatusEnable: apiVersion + '/plugin/intelligence-learning/{id}/start',
+  pluginStatusEnable: apiVersion + '/plugin/intelligence-learning/{{id}}/start',
-  pluginStatusDisable: apiVersion + '/plugin/intelligence-learning/{id}/stop',
+  pluginStatusDisable: apiVersion + '/plugin/intelligence-learning/{{id}}/stop',
 
   // 报告相关
   reportJob: '/report/job',

src/utils/constants.js

@@ -465,6 +465,10 @@ export const knowledgeSourceValue = {
   appTag: 'cn_app_tag_user_defined'
 }
 
+export const pluginSchedule = {
+  always: 'plugin.always'
+}
+
 export const knowledgeBaseSource = [
   {
     name: 'FQDN Category',
@@ -1881,6 +1885,23 @@ export const performanceMetricMapping = {
   'high dns response time': 'DNS Response Latency'
 }
 
+export const pluginBasicInfo = [
+  {
+    id: 108,
+    name: '',
+    type: '',
+    desc: '',
+    iconUrl: ''
+  },
+  {
+    id: 109,
+    name: 'Psiphon3 VPN',
+    type: 'ip',
+    desc: 'knowledgeBase.desc.psiphon3',
+    iconUrl: 'images/knowledge-base-logo/psiphon3-vpn.png'
+  }
+]
+
 export const builtInKnowledgeBaseBasicInfo = [
   {
     knowledgeId: 10,

src/views/system/Plugin.vue

@@ -32,13 +32,13 @@
   </div>
 </template>
 <script>
-import cnDataList from '@/components/table/CnDataList'
+  import cnDataList from '@/components/table/CnDataList'
-import dataListMixin from '@/mixins/data-list'
+  import dataListMixin from '@/mixins/data-list'
-import pluginTable from '@/components/table/system/PluginTable'
+  import pluginTable from '@/components/table/system/PluginTable'
-import { api } from '@/utils/api'
+  import { api } from '@/utils/api'
-import axios from 'axios'
+  import axios from 'axios'
 
-export default {
+  export default {
     name: 'Plugin',
     mixins: [dataListMixin],
     components: {
@@ -70,7 +70,7 @@ export default {
           this.searchLabel = { ...this.searchLabel, ...params }
         }
         //this.searchLabel = { ...this.searchLabel, ...this.pageObj }
-      //this.searchLabel = {...this.searchLabel,jobGroup:3}
+        this.searchLabel = {...this.searchLabel,jobGroup:3}
         this.isNoData = false
         this.toggleLoading(true)
         delete this.searchLabel.total
@@ -82,10 +82,9 @@ export default {
         axios.get(listUrl, { params: this.searchLabel }).then(response => {
           if (response.status === 200) {
             for (let i = 0; i < response.data.data.list.length; i++) {
-            response.data.data.list[i].status = response.data.data.list[i].status + ''
+              response.data.data.list[i].triggerStatus = response.data.data.list[i].triggerStatus + ''
             }
             this.tableData = response.data.data.list
-          this.pageObj.total = response.data.data.total
           } else {
             console.error(response.data)
             this.isNoData = true
@@ -104,5 +103,5 @@ export default {
     unmounted () {
       this.isNoData = false
     }
-}
+  }
 </script>