对接问题知识库

jero-web/src/views/businessSupport/problemKnowledgeBase/components/problemKnowledgeBaseList.vue

@@ -13,13 +13,15 @@
     </div>
     <div class="box-content">
       <div class="box-content-left">
-        <span class="box-content-left-text">{{$t('recentHotSpots')}}</span>
-        <span class="box-content-left-text">{{$t('disseminationMaterials')}}</span>
-        <span class="box-content-left-text">{{$t('informationSafety')}}</span>
-        <span class="box-content-left-text">{{$t('blueBook')}}</span>
-        <span class="box-content-left-text">{{$t('invoiceCollection')}}</span>
-        <span class="box-content-left-text">{{$t('productHighlights')}}</span>
-        <span class="box-content-left-text">{{$t('financialReimbursement')}}</span>
+        <template v-for="tag in tagList">
+          <a-checkable-tag
+            :key="tag.id"
+            :checked="selectedTags.indexOf(tag.id) > -1"
+            @change="checked => handleChange(tag.id, checked)"
+          >
+            {{ tag.problemLabel }}
+          </a-checkable-tag>
+        </template>
       </div>
       <div class="box-content-right">
         <div @click="classificationClick" class="operator-text" v-has="'virtual:set:creater'">
@@ -91,9 +93,12 @@
         searchContent: '',
         checkboxText: [],
         conList: [],
+        searchStr: '',
         total: 0,
+        selectedTags: [],
         loading: false,
         pageSize: 10,
+        tagList: [],
         downLoadFileUrl: window._CONFIG['domianPreviewURL'] + '/sys/common/download',
         pageNo: 1,
         url: {
@@ -103,12 +108,29 @@
     },
     mounted() {
       this.getList()
+      this.replacePage()
     },
     methods: {
+      replacePage() {
+        getAction('/problemKnowledgeBase/problemKnowledgeBaseClassifyEO/list', {}).then((res) => {
+          if (res.success) {
+            this.tagList = res.result
+          } else {
+            this.tagList = []
+          }
+        })
+      },
       onSearch() {
         this.pageNo = 1
         this.getList()
       },
+      handleChange(tag, checked) {
+        const { selectedTags } = this
+        const nextSelectedTags = checked
+          ? [...selectedTags, tag]
+          : selectedTags.filter(t => t !== tag)
+        this.selectedTags = nextSelectedTags
+      },
       ResetSearch() {
         this.searchStr = ''
         this.pageNo = 1
@@ -128,11 +150,6 @@
         this.$router.push({
           path: '/problemKnowledgeBaseAdd'
         })
-        // let newUrl = this.$router.resolve({
-        //   path: '/problemKnowledgeBaseAdd',
-        //   query: {}
-        // })
-        // window.open(newUrl.href, '_blank')
       },
       pageOnChange(page, pageSize) {
         this.pageNo = page
@@ -323,4 +340,19 @@
     text-align: center;
     line-height: 10;
   }
+</style>
+<style>
+  .box-content-left .ant-tag {
+    font-size: 14px;
+    font-weight: 400;
+    color: #040B29;
+  }
+
+  .box-content-left .ant-tag-checkable {
+    padding: 3px 8px;
+  }
+
+  .box-content-left .ant-tag-checkable-checked {
+    color: #fff;
+  }
 </style>