From 2fbbdc506bb7be74532e4f875cee89e42ea63347 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E9=99=88=E8=A3=95=E8=B4=A2?= <cyc58469@163.com>
Date: Thu, 21 Jul 2022 17:36:22 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BC=98=E5=8C=96?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/DictField/index.vue  | 18 ++++++++++++---
 src/components/DictSelect/index.vue |  6 +++++
 src/components/DictTag/index.vue    | 36 ++++++++++++++++++++++++++---
 3 files changed, 54 insertions(+), 6 deletions(-)

diff --git a/src/components/DictField/index.vue b/src/components/DictField/index.vue
index 337e8c0b..70eb91d1 100644
--- a/src/components/DictField/index.vue
+++ b/src/components/DictField/index.vue
@@ -1,11 +1,11 @@
 <template>    
     
 						<div class="field-box">  
-							<el-avatar class="avater" :icon="getMyIcon(currentItem)" :style="{backgroundColor:getMyColor(currentItem)}">{{currentItem && currentItem.icon?'':currentItem.name}}</el-avatar> 
+							<el-avatar class="avater" :icon="getMyIcon(currentItem)" :style="{backgroundColor:getMyColor(currentItem)}">{{getMyAvaterInfo(currentItem)}}</el-avatar> 
 							
               <div class="field-info">
                 <slot name="field-info" :dict="dict" :item="currentItem">
-								<span class="field-value">{{currentItem.name}} </span>
+								<span class="field-value">{{currentItem?currentItem.name:''}} </span>
                 <slot name="label" :dict="dict" :item="currentItem">
 								  <span class="field-label">{{label}}</span>
                 </slot>
@@ -73,8 +73,17 @@
       } ,
     },
     methods: { 
-        
+        getMyAvaterInfo(item){
+          if(!item){
+            return ""
+          }else{
+            return item.icon?"":item.name
+          }
+        },
         getMyColor(item){
+          if(!item){
+            return ""
+          }
             if(this.getColor){
                 return this.getColor(item.id)
             }
@@ -84,6 +93,9 @@
             return ""
         },
         getMyIcon(item){
+          if(!item){
+            return ""
+          }
             if(this.getIcon){
                 return this.getIcon(item.id)
             }
diff --git a/src/components/DictSelect/index.vue b/src/components/DictSelect/index.vue
index f12f12b0..42949f84 100644
--- a/src/components/DictSelect/index.vue
+++ b/src/components/DictSelect/index.vue
@@ -69,6 +69,9 @@
             
         },
         getMyColor(item){
+            if(!item){
+                return "";
+            }
             if(this.getColor){
                 return this.getColor(item.id)
             }
@@ -78,6 +81,9 @@
             return ""
         },
         getMyIcon(item){
+            if(!item){
+                return "";
+            }
             if(this.getIcon){
                 return this.getIcon(item.id)
             }
diff --git a/src/components/DictTag/index.vue b/src/components/DictTag/index.vue
index 02486adb..b3cf4f5d 100644
--- a/src/components/DictTag/index.vue
+++ b/src/components/DictTag/index.vue
@@ -1,11 +1,19 @@
 <template>    
-    <el-tag v-if="currentItem"  :type="currentItem.className" :closable="closable" :effect="effect">{{currentItem.name}}</el-tag>
+    <div class="item-box">
+        <div class="item-info">
+            <el-tag v-if="currentItem"  :type="currentItem.className" :closable="closable" :effect="effect">{{currentItem.name}}</el-tag>
+        </div>
+        <div class="item-select">
+            <dict-select :dict="dict" v-model="myVal" @change="onChange"></dict-select>
+        </div>
+    </div>
+    
   </template>
   
-  <script>  
+  <script> 
   export default {
     name: 'dict-tag',
-    components: {   },
+    components: {  },
     computed: {
        currentItem(){
         if(this.dict){
@@ -45,9 +53,14 @@
       value: {
         
       },   
+      
+        
     },
     methods: { 
         
+        onChange(data){  
+          this.$emit('change',data)
+        },
         initData(){
              this.myVal=this.value
             
@@ -60,5 +73,22 @@
   </script>
   
   <style rel="stylesheet/scss" lang="scss" scoped> 
+    .item-box{
+        display: flex;
+        cursor: pointer;
+        .item-info{
+            display:inherit; 
+            height: 60px;
+        }
+        .item-select{
+            display: none;
+        }  
+    }
+    .item-box:hover .item-info{
+       display: none;
+    }
+    .item-box:hover .item-select{
+        display:inherit;
+    }
   </style>
   
\ No newline at end of file