修改标签属性删除

src/components/icss/SymptomTagGroup.vue

@@ -37,7 +37,7 @@
                 :style="getStyle2(item)?styles:null"
                 @click='selectRightTag(item)'
             >   
-                <div>
+                <div class="inputBox">
                     <el-input
                         v-if="item.type === 'input'"
                         placeholder=""
@@ -47,8 +47,8 @@
                 </div>
                 <p v-if="item.tagName" class="tagName">{{item.tagName}} </p>
                 <div class="attributeBox">
-                    <p v-if="item.symptomType === 1" class="tagAttribute">跟主症状</p>
-                    <p v-if="item.symptomType === 2" class="tagAttribute">跟伴随症状</p>
+                    <p v-if="item.symptomType === 1" class="tagAttribute" @click.stop>跟主症状 <span @click="closeTagAttribute(item)" class="closeTagAttribute"><i class="el-icon-error"></i></span></p>
+                    <p v-if="item.symptomType === 2" class="tagAttribute" @click.stop>跟伴随症状<span  @click="closeTagAttribute(item)" class="closeTagAttribute"><i class="el-icon-error"></i></span></p>
                 </div>
             </li>
         </ul>
@@ -274,13 +274,21 @@ export default {
                 })
             }
             this.selectRightTagsList = []
+        },
+        closeTagAttribute(tag) {
+            this.rightTagsList2 = this.rightTagsList2.filter((item) =>{
+                    if(item.id === tag.id) {
+                        item.symptomType = 3
+                    }
+                    return item
+                })
         }
 
     }
 }
 </script>
 
-<style lang="less" scoped>
+<style lang="less" >
 @import '../../less/common.less';
 .symptomTagGroupWrapper {
     .bottomPartLeft {
@@ -314,7 +322,7 @@ export default {
     .attributeBox {
         position: absolute;
         right: -100px;
-        top: 5px;
+        top: 2px;
     }
     .tagItem {
         position: relative;
@@ -366,8 +374,24 @@ export default {
     }
     .tagAttribute {
        border: 1px solid @icssBorder;
-       height: 20px;
-       line-height: 20px;
+       height: 17px;
+       line-height: 17px;
+       padding: 3px 5px;
+       border-radius: 10px;
+    }
+    .inputBox {
+        width: 120px;
+        .el-input {
+            .el-input__inner {
+                height: 30px;
+                background: rgb(234, 231, 231);
+            }
+        }
+    }
+    .closeTagAttribute {
+        position: absolute;
+        top: -5px;
+        right: -5px;
     }
     .active {
         color: #aBcdef;