添加基本逻辑

src/server/api.js

@@ -202,5 +202,6 @@ export default {
   get_month_check: 'service-documents-ddd/dashboard/house/month',
 
   GET_LABEL_LIST: MOCK_URL + '/service-customkey-ddd/label/tree', // 获取标签列表
-  GET_LABEL_DETAIL: MOCK_URL + '/service-customkey-ddd/label/{id}' // 查看标签详情
+  GET_LABEL_DETAIL: MOCK_URL + '/service-customkey-ddd/label/{id}', // 查看标签详情
+  DELETE_SINGLE_LABEL: MOCK_URL + '/service-customkey-ddd/label/{id}', // 根据id删除某个标签
 }

src/views/label/labelList.vue

@@ -23,6 +23,7 @@
         <a-col :span='1'></a-col>
         <a-col :span='18' class="layoutMargin layoutPadding">
           <RightPanel v-if="currentState == 'create'" :trigger-type='currentState' />
+          <RightPanel v-else-if="currentState == 'loadChildLabel'" :trigger-type='currentState' :label-id='labelId' />
           <EmptyRightPanel v-else />
         </a-col>
       </a-row>
@@ -52,7 +53,8 @@ export default {
         key: 'id'
       },
       selectedKeys: [],
-      currentState: null
+      currentState: null,
+      labelId: null
     }
   },
   mounted() {
@@ -72,14 +74,27 @@ export default {
     backPage(){ // 返回按钮
       this.$router.back()
     },
-    onSelect(selectedKeys, info) {
-      console.log('selected', selectedKeys, info)
+    onSelect(selectedKeys) {
+      this.$ajax.get({
+        url: this.$api.GET_LABEL_DETAIL.replace('{id}', selectedKeys[0]),
+      }).then(res => {
+        if (res.code == 200) {
+          let result = this.$com.confirm(res, 'data.content', [])
+          this.labelId = selectedKeys[0]
+          if(!!result.parentId) { // 为二级菜单
+            this.currentState = 'loadChildLabel'
+          } else { // 为一级菜单
+            this.currentState = 'loadParentLabel'
+          }
+        }
+      })
     },
     onCheck(checkedKeys, info) {
       console.log('onCheck', checkedKeys, info)
     },
     addLabel() {
       this.currentState = 'create'
+      console.log('add')
     }
   },
 }

src/views/label/labelRightSide.vue

 <template>
   <div class="routerWapper">
 		<div>
+      {{triggerType}} - {{labelId}}
       <a-row>
         <a-col :span='1' v-if="triggerType == 'create'">
-          <a-button type='default'>返回</a-button>
+          <a-button type='default' @click="backPage()">返回</a-button>
         </a-col>
         <a-col :span='1' v-else>
-          <a-button type='default'>删除</a-button>
+          <a-button type='default' @click="deleteLabel(labelId)">删除</a-button>
         </a-col>
-        <a-col :span='1' :offset='1'>
+        <!-- <a-col :span='1' :offset='1'>
           <a-button type='default'>编辑</a-button>
-        </a-col>
+        </a-col> -->
         <a-col :span='1' :offset='1'>
           <a-button type='primary' @click="save()">保存</a-button>
         </a-col>
@@ -46,15 +47,15 @@
         <a-form-item v-else style="margin-left: 120px"></a-form-item>
 
         <a-form-item>
-          <a-select style="width: 120px" placeholder='请选择业务属性' v-decorator="['businessProperty' + index,{initialValue: item.businessProperty, validateTrigger:'blur',rules: [{required: true, message: '请至少选择一项！'}]}]">
+          <a-select style="width: 120px" placeholder='请选择业务属性' v-decorator="['key' + index,{initialValue: item.key, validateTrigger:'blur',rules: [{required: true, message: '请至少选择一项！'}]}]">
             <a-select-option value='sx1'>属性一</a-select-option>
             <a-select-option value='sx2'>属性二</a-select-option>
           </a-select>
         </a-form-item>
 
         <a-form-item>
-          <a-select style="width: 120px" placeholder='区间' v-decorator="['range' + index,{validateTrigger:'blur',rules: [{required: true, message: '请至少选择一项！'}]}]">
-            <a-select-option value='equals'>等于</a-select-option>
+          <a-select style="width: 120px" placeholder='区间' v-decorator="['codition' + index,{initialValue: item.codition, validateTrigger:'blur',rules: [{required: true, message: '请至少选择一项！'}]}]">
+            <a-select-option value='equels'>等于</a-select-option>
             <a-select-option value='gt'>大于</a-select-option>
             <a-select-option value='gte'>大于等于</a-select-option>
             <a-select-option value='lt'>小于</a-select-option>
@@ -66,16 +67,27 @@
         <a-form-item>
           <a-input placeholder='请输入' v-decorator="['inputOne' + index,{initialValue: item.inputOne, validateTrigger:'blur',rules: [],}]"></a-input>
         </a-form-item>
-        <a-form-item v-if="infoSettingForm.getFieldValue('range'+index) == 'btw'">
+        <a-form-item v-if="infoSettingForm.getFieldValue('codition'+index) == 'btw'">
           <a-input placeholder='请输入' v-decorator="['inputTwo' + index,{initialValue: item.inputTwo, validateTrigger:'blur',rules: []}]"></a-input>
         </a-form-item>
 
+        <a-form-item>
+          <a-select style="width: 120px" placeholder='查询方式' v-decorator="['selMet' + index,{initialValue: item.selMet, validateTrigger:'blur',rules: [{required: true, message: '请至少选择一项！'}]}]">
+            <a-select-option value='equels'>精确</a-select-option>
+            <a-select-option value='like'>模糊</a-select-option>
+          </a-select>
+        </a-form-item>
+        {{loopContent.data.length}}
+        {{index}}
         <a-form-item>
           <a-icon v-if="index+1 == loopContent.data.length" theme='filled' style="color:lightgreen;" type="plus-circle" @click="addRow()" />
           <a-icon v-if="index+1 == loopContent.data.length" theme='filled' style="color:red; margin-left: 5px" type="minus-circle" @click="deleteRow(index)" />
         </a-form-item>
       </div>
     </a-form>
+    <a-modal :visible='deleteVisible' @ok='handleDeleteOk' @cancel='handleCancelOk'>
+      确定删除该标签吗?
+    </a-modal>
   </div>
 </template>
 
@@ -87,26 +99,66 @@ export default {
       infoSettingForm: this.$form.createForm(this),
       loopContent: {
         data: [{
-          businessProperty: '',
-          range: 'equals',
-          inputOne: ''
+          key: '',
+          codition: 'equels',
+          val: '',
+          selMet: ''
         }]
       },
-      jsonData: []
+      jsonData: [],
+      deleteVisible: false
     }
   },
   mounted() {
+    console.log('得到的' + this.labelId)
+    this.getLabelDetail()
   },
   props: [
-    'triggerType'
+    'triggerType',
+    'labelId'
   ],
+  watch: {
+    triggerType: {
+      handler: function(newV, oldV) {
+        this.resetFormFields()
+        this.getLabelDetail()
+      },
+      immediate: true
+    },
+    labelId: {
+      handler: function(newV, oldV) {
+        this.resetFormFields()
+        this.getLabelDetail()
+      },
+      immediate: true
+    }
+  },
   methods: {
+    getLabelDetail() {
+      // console.log('得到的' + this.labelId)
+      if(!!this.labelId && this.labelId !== 'undefined') {
+        this.$ajax.get({
+          url: this.$api.DELETE_SINGLE_LABEL.replace('{id}', this.labelId),
+        }).then(res => {
+          if (res.code == 200) {
+            this.loopContent.data = res.data.content.selParams
+            console.log(res.data.content.selParams)
+          }
+        })
+      } else {
+        this.resetFormFields()
+      }
+    },
+    backPage(){ // 返回按钮
+      this.$router.back()
+    },
     addRow() {
       this.loopContent.data.push({
-        businessProperty: '',
-        range: 'equals',
-        inputOne: '',
-        relation: 'and'
+        key: '',
+        codition: 'equels',
+        val: '',
+        relation: 'and',
+        selMet: ''
       })
       console.log(this.loopContent)
     },
@@ -116,6 +168,25 @@ export default {
       this.loopContent.data.splice(index, 1)
       console.log(JSON.stringify(this.loopContent.data))
     },
+    deleteLabel(id) {
+      // 查询该标签是否是一级标签，是一级标签直接删除。
+      this.deleteVisible = !this.deleteVisible
+    },
+    handleDeleteOk() {
+      this.$message.success('标签【'+ this.labelId + '】已删除!')
+      this.deleteVisible = !this.deleteVisible
+    },
+    handleCancelOk() {
+      this.deleteVisible = !this.deleteVisible
+    },
+    resetFormFields() {
+      this.loopContent.data = [{
+        key: '',
+        codition: 'equels',
+        val: '',
+        selMet: ''
+      }]
+    },
     save() {
       this.jsonData = []
       this.infoSettingForm.validateFields((err, values) => {
@@ -125,16 +196,19 @@ export default {
 
           for(let i = 0; i < loopCounts; i++) {
             this.jsonData.push({
-              key: formData['businessProperty'+i],
+              key: formData['key'+i],
               val: !formData['inputTwo' + i] ? formData['inputOne' + i] : formData['inputOne' + i] + ',' + formData['inputTwo' + i],
-              condition: formData['range'+i],
+              condition: formData['codition'+i],
               relation: formData['relation' + i],
+              selMet: formData['selMet' + i]
             })
           }
 
           console.log(JSON.stringify(this.jsonData))
+          this.$message.success('保存成功!')
         }
       })
+      this.resetFormFields()
     },
   },
 }