优化

src/components/DateField/index.vue

@@ -8,14 +8,14 @@
 								<span class="field-value">{{myVal?formatDate( new Date(myVal),format):'' }} </span>
                 <slot name="label">
 								  <span class="field-label">{{label}}</span> 
-                </slot>
-                </slot>
-							</div>   
                   <div v-if="disabled!==true" class="my-select" name="select" :value="myVal">
                     <el-date-picker    v-model="myVal" :value-format="valueFormat" :format="format"   
                     @change="onChange"
                     :picker-options="pickerOptions"></el-date-picker>
                   </div>
+                </slot>
+                </slot>
+							</div>   
 						</div> 
   </template>
   
@@ -150,6 +150,7 @@
             font-size: 16px;  
         } 
         .field-label{   
+          height: 40px;
           font-size: 14px;
           color: #C0C4CC;
         }
@@ -172,10 +173,11 @@
 }
  .field-box:hover .my-select{
   
+    height: 40px;
     margin-left: 5px;
     display: inline;
 } 
- .field-box:hover .field-info{ 
+ .field-box:hover .field-label{ 
     display: none;
 } 
 </style>

src/components/DateRangeField/index.vue

@@ -7,9 +7,7 @@
 								<span class="field-value">{{formatDateRange(dateRange) }} </span>
                 <slot name="label">
 								  <span class="field-label">{{label}}</span>
-                </slot>
-                </slot>
-							</div>   
+                  
                   <div v-if="disabled!==true" class="my-select" name="select" :value="dateRange">
                     
                   <el-date-picker :type="type" :style="styleObj"  v-model="dateRange" :value-format="valueFormat" :format="format" 
@@ -22,6 +20,9 @@
                       :picker-options="pickerOptions"   
                       ></el-date-picker>  
                   </div>
+                </slot>
+                </slot>
+							</div>   
 						</div>  
 </template>
 
@@ -224,6 +225,7 @@ export default {
             font-size: 16px;  
         } 
         .field-label{   
+          height: 40px;
           font-size: 14px;
           color: #C0C4CC;
         }
@@ -247,8 +249,9 @@ export default {
 
     margin-left: 5px;
     display: inline;
+    height: 40px;
 } 
- .field-box:hover .field-info{ 
+ .field-box:hover .field-label{ 
     display: none;
 } 
 </style>

src/components/DictField/index.vue

@@ -8,12 +8,12 @@
 								<span class="field-value">{{currentItem?currentItem.name:''}} </span>
                 <slot name="label" :dict="dict" :item="currentItem">
 								  <span class="field-label">{{label}}</span> 
-                </slot>
-                </slot>
-							</div>   
                 <slot v-if="disabled!==true" class="my-select" name="select" :dict="dict" :value="myVal">
                   <dict-select  :dict="dict" v-model="myVal" @change="onChange" :get-icon="getIcon" :get-color="getColor"></dict-select>
                 </slot>
+                </slot>
+                </slot>
+							</div>   
 						</div> 
   </template>
   
@@ -158,6 +158,7 @@
             font-size: 16px; 
         } 
         .field-label{   
+          height: 40px;
           font-size: 14px;
           color: #C0C4CC;
         }
@@ -167,21 +168,17 @@
     margin-left: 5px;
     margin-right:5px;
     max-width: 120px;
-		visibility:hidden;  
-	}
-	.btn{
-		margin-top: 0px;
-		visibility:hidden; 
+    display: none;
 	} 
 	 
 }
- .field-box:hover .btn{
-		visibility: visible !important;
+ .field-box:hover .field-label{
+  display: none;
 }
  .field-box:hover .my-select{
-  
+    height: 40px;
     margin-left: 5px; 
-		visibility: visible !important;
+    display: inline;
 } 
 </style>
   

src/components/UserField/index.vue

@@ -8,9 +8,6 @@
 								<span class="field-value">{{showMyValue( myVal )}} </span>
                 <slot name="label">
 								  <span class="field-label">{{label}}</span> 
-                </slot>
-                </slot>
-							</div>   
                   <div v-if="disabled!==true" class="my-select" name="select" :value="myVal">
                     <el-select v-model="myVal" @change="onSelectChange" :clearable="clearable">  
                           <el-option disabled value="" style="margin-bottom:5px;">
@@ -27,6 +24,9 @@
                           </el-option> 
                       </el-select> 
                   </div>
+                </slot>
+                </slot>
+							</div>   
 						</div> 
             <el-dialog :visible.sync="deptUserVisible" append-to-body top="20px" width="60%">
                <users-select :visible="deptUserVisible" :isSingleUser="true"  :isSelectByDept="true" @confirm="onConfirmUsers"></users-select>
@@ -258,6 +258,7 @@
             font-size: 16px;  
         } 
         .field-label{   
+          height: 40px;
           font-size: 14px;
           color: #C0C4CC;
         }
@@ -275,11 +276,11 @@
 	} 
 	 
 }
- .field-box:hover .btn{
-		visibility: visible !important;
+ .field-box:hover .field-label{
+  display: none;
 }
  .field-box:hover .my-select{
-  
+    height: 40px;
     margin-left: 5px;
     display: inline;
 } 

src/views/xm/core/components/XmUserField/index.vue

@@ -9,8 +9,6 @@
                 <slot name="label" >
 								  <span class="field-label">{{label}}</span> 
                 </slot>
-                </slot>
-							</div>   
                   <div v-if="disabled!==true" class="my-select" name="select" :value="myVal">
                     <el-select v-model="myVal" @change="onSelectChange" :clearable="clearable" filterable>  
                           
@@ -31,6 +29,9 @@
                           </el-option>
                       </el-select> 
                   </div>
+                
+                </slot>
+							</div>  
 						</div> 
             <el-dialog v-if="disabled!==true" :visible.sync="deptUserVisible" append-to-body top="20px" width="60%">
                <users-select :visible="deptUserVisible" :isSingleUser="true"  :isSelectByDept="true" @confirm="onConfirmUsers"></users-select>
@@ -254,6 +255,7 @@
             font-size: 16px;  
         } 
         .field-label{   
+          height: 40px;
           font-size: 14px;
           color: #C0C4CC;
         }
@@ -271,11 +273,11 @@
 	} 
 	 
 }
- .field-box:hover .btn{
-		visibility: visible !important;
+ .field-box:hover .field-label{
+		display: none;
 }
  .field-box:hover .my-select{
-  
+    height: 40px;
     margin-left: 5px;
     display: inline;
 }