Prechádzať zdrojové kódy

Merge remote-tracking branch 'remotes/origin/zhangxc' into dev

Luolei 6 rokov pred
rodič
commit
64edbaf79c

+ 0 - 1
src/api/config.js

@@ -99,6 +99,5 @@ export default {
 		'LT-GRZX': 'el-icon-news'
   },
   controlType:{
-
   }
 }

+ 1 - 0
src/components/icss/NoiseTemplate.vue

@@ -14,6 +14,7 @@
     <div class="main">
       <p class="title"> <i>*</i> 标签明细:</p>
       <PubTagPartDetail :pool="dataPub.tagPool" :type="dataPub.region1" :sign="dataPub.region2" v-show="dataPub.region2 == 2"></PubTagPartDetail>
+      <SymptomTagGroup v-if="dataPub.region2 == 4" :dataPub ="this.dataPub"></SymptomTagGroup>
       <div class="btn">
         <el-button
           type="primary"

+ 2 - 1
src/components/icss/PubTagGroup.vue

@@ -176,7 +176,7 @@ export default {
       ],
       form: {
         region1: '',    //归属
-        region2: '2',     //填写单类型
+        region2: '',     //填写单类型
         region3: '',      //系统名称
         region4: '',      //界面名称
         region5: '',      //选项之间的链接
@@ -226,6 +226,7 @@ export default {
       labelTypes: [],
       labelTypesList: [],
       tagTypes: [],        //标签池数据
+      type:'',
       systom:null,      //标签系统名称存在与否
     }
   },

+ 179 - 10
src/components/icss/SymptomTagGroup.vue

@@ -1,29 +1,198 @@
 <template>
-    <div class="symptomTagGroupWrapper">
-      
+    <div class="symptomTagGroupWrapper clearfix">
+    <div class="bottomPartLeft fl">
+      <p class="poolTitle">标签池</p>
+      <div class="pool">
+        <input class="search" @input="searchTag"/>
+        <ul class="tagList">
+            <li class = "tagItem"
+                v-for="item in leftTagsList" 
+                :key='item.id'
+                @click='selectLeftTag(item)'
+            >
+                <p class="tagName">{{item.tagName}} </p>
+            </li>
+        </ul>
+      </div>
     </div>
+    <div class="bottomPartMid fl">
+      <p><span class="el-icon-arrow-left" @click="toLeftList"></span></p>
+      <p><span class="el-icon-arrow-right" @click="toRightList"></span></p>
+    </div>
+    <div class="bottomPartRight fr">
+      <p class="poolTitle">操作池</p>
+      <ul class="tagList">
+            <li class = "tagItem"
+                v-for="item in rightTagsList" 
+                :key='item.id'
+                @click='selectRightTag(item)'
+            >
+                <p class="tagName">{{item.tagName}} </p>
+            </li>
+        </ul>
+    </div>
+  </div>
 </template>
 <script>
+import api from '@api/icss.js';
 export default {
     name: "SymptomTagGroup",
     props: {
-        tagPool: {
-            default: ()=>{return[]},
-            type: Array
-        }
+        dataPub: {},
     },
     data() {
         return {
+            leftTagsList: [],
+            selectLeftTagsList: [],
+            rightTagsList: [],
+            selectRightTagsList: [],
 
         }
+    },
+    mounted() {
+        this.leftTagsList = this.dataPub.tagPool
+        console.log('TAGPOOL', this.dataPub)
+    },
+    methods: {
+        selectLeftTag(tag) {
+            const hasTag = this.isHasTag(tag, this.selectLeftTagsList)
+            console.log(hasTag)
+            if (hasTag) {
+                this.selectLeftTagsList = this.selectLeftTagsList.filter(item => item.id !== tag.id)
+            } else {
+                this.selectLeftTagsList.push(tag);
+            }
+            console.log(this.selectLeftTagsList)
+            // this.isSelectTag(tag, this.selectLeftTagsList)
+            
+        },
+        selectRightTag(tag) {
+            const hasTag = this.isHasTag(tag, this.selectRightTagsList)
+            console.log(hasTag)
+            if (hasTag) {
+                this.selectRightTagsList = this.selectRightTagsList.filter(item => item.id !== tag.id)
+            } else {
+                this.selectRightTagsList.push(tag);
+            }
+            console.log(this.selectRightTagsList)
+            // this.isSelectTag(tag, this.selectRightTagsList)
+            
+        },
+        isHasTag(item, arr) {
+            for ( let i = 0; i <arr.length; i++) {
+                if(arr[i].id === item.id) {
+                    return true;
+                }
+            }
+            return false;
+        },
+        isSelectTag(tag, arr) {
+            const hasTag = this.isHasTag(tag, arr)
+            console.log(hasTag)
+            if (hasTag) {
+                // arr = arr.filter(item => item.id !== tag.id)
+                arr = arr.filter((item) => {console.log('aaa',item.id === tag.id); return item.id !== tag.id})
+            } else {
+                arr.push(tag);
+            }
+            console.log(arr)
+        },
+        toLeftList() {
+            this.leftTagsList = this.tagPool
+            for (let i = 0; i < this.selectRightTagsList.length; i++) {
+                this.rightTagsList = this.rightTagsList.filter(item => item.id !== this.selectRightTagsList[i].id)
+            }
+            for (let i = 0; i < this.rightTagsList.length; i++) {
+                this.leftTagsList = this.leftTagsList.filter(item => item.id !== this.rightTagsList[i].id)
+            }
+            this.selectRightTagsList = []
+        },
+        toRightList() {
+            this.rightTagsList.push(...this.selectLeftTagsList);
+            for (let i = 0; i < this.rightTagsList.length; i++) {
+                this.leftTagsList = this.leftTagsList.filter(item => item.id !== this.rightTagsList[i].id)
+            }
+            console.log(this.rightTagsList)
+            this.selectLeftTagsList = []
+        },
+        searchTag(value) {
+            console.log('value', value)
+            let notIds = []
+            for (let i = 0; i < this.rightTagsList.length; i++) {
+                notIds.push(rightTagsList[i].id)
+            }
+            console.log(this.dataPub)
+            let param = {
+                "tagName": value.data,
+                "tagType": [
+                    4
+                ],
+                "type": this.dataPub.region1 || ''
+            }
+            api.searchTagList(param).then((res) => {
+                if (res.data.code === '0') {
+                    this.leftTagsList = res.data.data
+                }
+            })
+           
+        }
+
     }
 }
 </script>
 
 <style lang="less" scoped>
-    .tagPool {
-        width: 300px;
-        height: 500px;
-        border: 1px solid #000;
+@import '../../less/common.less';
+.symptomTagGroupWrapper {
+    .bottomPartLeft {
+        width: 30%;
+        box-sizing: border-box;
+    }
+    .poolTitle {
+        // border-bottom: 1px solid @icssBorder;
+        box-sizing: border-box;
+        margin-bottom: 20px;
+    }
+    .pool {
+        border:1px solid @icssBorder;
+    
+    }
+    .search {
+        width: 100%;
+        border-bottom: 1px solid @icssBorder;
+        box-sizing: border-box;
+        height: 30px;
     }
+    .tagList {
+        padding: 10px 10px;
+        height: 300px;
+        overflow-y: auto;
+    }
+    .tagItem {
+        line-height: 20px;
+    }
+    .tagName:before {
+        content: '['
+    }
+    .tagName::after {
+        content: ']'
+    }
+    .bottomPartMid {
+        width: 10%;
+    p {
+        width: 100%;
+        text-align: center;
+        span {
+            display: inline-block;
+            width: 50px;
+            height: 30px;
+            line-height: 30px;
+            margin: 0 auto;
+        }
+    }
+    }
+    .bottomPartRight {
+        width: 60%;
+    }
+}
 </style>