对接问题知识库

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

@@ -14,14 +14,15 @@
         <a-col :span="24">
           <div class="box-title-text">
             <div class="title-text">
-              <span class="Required">*</span>
               <span class="title-text-text"
                     :title="$t('applicableMarket')">{{$t('applicableMarket')}}</span>
             </div>
             <a-form-model-item class="itemModel" prop="applicableMarket">
-              <a-input class="box-input"
-                       v-model="formInline.applicableMarket"
-                       :placeholder="$t('PleaseEnter')+$t('applicableMarket')"/>
+              <j-dict-select-tag class="box-input" v-model="formInline.applyMarket"
+                                 :disabled="true"
+                                 :placeholder="$t('PleaseSelect')+$t('applicableMarket')"
+                                 :type="'select'"
+                                 :triggerChange="false" :dictCode="'region'"/>
             </a-form-model-item>
           </div>
         </a-col>
@@ -34,15 +35,24 @@
               <span class="title-text-text" :title="$t('comparisonMarket')+(index+1)">{{$t('comparisonMarket')+(index+1)}}</span>
             </div>
             <a-form-model-item class="itemModel" style="width: calc(100% - 220px)" prop="comparisonMarket">
-              <a-input class="box-input"
-                       v-model="formInline.comparisonMarket"
-                       :placeholder="$t('PleaseEnter')+$t('comparisonMarket')"/>
+              <a-select :placeholder="$t('PleaseSelect')+$t('applicableMarket')"
+                        :disabled="false"
+                        @change="applyMarketChange"
+                        v-model="item.applyMarket">
+                <a-select-option v-for="(item, key) in item.applyMarketList"
+                                 :key="key"
+                                 :value="item.applyMarket">
+                     <span style="display: inline-block;width: 100%" :title=" item.applyMarket_dictText ">
+                           {{ item.applyMarket_dictText}}
+                     </span>
+                </a-select-option>
+              </a-select>
             </a-form-model-item>
 
             <a-icon class="icon-size"
                     style="margin-left: 8px"
                     @click="addData"
-                    v-if="(formInline.dataList.length-1) == index"
+                    v-if="(formInline.dataList.length-1) == index && formInline.dataList.length < 5"
                     type="plus-circle"/>
             <a-icon class="icon-size"
                     @click="deleteData"
@@ -65,6 +75,10 @@
         visible: false,
         confirmLoading: false,
         formInline: {},
+        applyMarketList: [],
+        url: {
+          getInfoList: '/problemKnowledgeBase/countryCardManageReleaseEO/list'
+        },
         rules: {
           personChargeName: [
             {
@@ -101,9 +115,11 @@
         this.visible = true
         this.$nextTick(() => {
           this.formInline = {}
+          this.formInline.applyMarket = this.$route.query.applyMarket
           this.formInline.dataList = [{
             relatedSection: ''
           }]
+          this.getList()
           this.formInline = { ...this.formInline }
           this.$refs.ruleForm.clearValidate()
         })
@@ -124,18 +140,71 @@
       },
       addData() {
         this.formInline.dataList.push({
-          relatedSection: ''
+          applyMarket: ''
         })
+        this.consolidateData()
         this.formInline = { ...this.formInline }
       },
       deleteData() {
         this.formInline.dataList.pop()
+        this.consolidateData()
         this.formInline = { ...this.formInline }
+      },
+      getList() {
+        let query = {
+          releaseStatus: 'Have released'
+        }
+        getAction(this.url.getInfoList, query).then((res) => {
+          if (res.success) {
+            this.applyMarketList = res.result
+            this.consolidateData()
+          } else {
+            this.applyMarketList = []
+          }
+        })
+      },
+      consolidateData() {
+        let content = []
+        content.push(this.$route.query.applyMarket)
+        content = content.join(',')
+        this.applyMarketList = this.applyMarketList.filter(res => {
+          return !content.includes(res.applyMarket)
+        })
+        let contentIndex = []
+        if (this.formInline.dataList && this.formInline.dataList.length > 0) {
+          this.formInline.dataList.forEach(res => {
+            contentIndex.push(res.applyMarket)
+            res.applyMarketList = []
+            this.applyMarketList.forEach(val => {
+              res.applyMarketList.push(val)
+            })
+          })
+        }
+        contentIndex = contentIndex.join(',')
+        for (let i = 0; i < this.formInline.dataList.length; i++) {
+          for (let j = 0; j < this.formInline.dataList[i].applyMarketList.length; j++) {
+            if (contentIndex.includes(this.formInline.dataList[i].applyMarketList[j].applyMarket)
+              && this.formInline.dataList[i].applyMarket != this.formInline.dataList[i].applyMarketList[j].applyMarket) {
+              console.log(111)
+              console.log(j)
+              this.formInline.dataList[i].applyMarketList.splice(j, 1)
+              j--
+            }
+          }
+        }
+        this.formInline = { ...this.formInline }
+      },
+      applyMarketChange() {
+        this.consolidateData()
       }
     }
   }
 </script>
-
+<style>
+  .ant-select-disabled {
+    color: rgba(0, 0, 0, 0.65) !important;
+  }
+</style>
 <style scoped>
   .box-title-text {
     line-height: 1.4;