组件样式统一

src/components/app-department-personnel/app-department-personnel.less

+.app-department-personnel{
+    position: relative;
+    .ivu-select-selection{
+        position: relative;
+        padding: 0;
+        .ivu-select-selected-value{
+            padding-left: 15px;
+            font-size: 13px;
+        }
+        .ivu-tag.ivu-tag-checked{
+            top: 1px;
+            font-size: 12px;
+            height: 24px;
+            line-height: 22px;
+            margin: 2px 0px 2px 6px;
+            padding: 0 3px 0 8px;
+            background-color: #f4f4f5;
+            border-color: #e9e9eb;
+            color: #909399;
+            .ivu-tag-text{
+                padding: 0 8px 0 0;
+            }
+        }
+        .ivu-icon.ivu-icon-ios-close{
+            position: absolute;
+            width: 10px;
+            line-height: 10px;
+            height: 10px;
+            top: 6px;
+            margin-left: 8px;
+            font-size: 4px;
+            color: #909399;
+            background-color: #c0c4cc;
+            border-radius: 50%;
+        }
+        .ivu-icon.ivu-icon-ios-close:hover{
+            color: #fff;
+            background-color: #909399;
+        }
+        .ivu-icon-ios-close:before {
+            position: absolute;
+            left: -1px;
+        }
+    }
+    .el-icon-search{
+        position: absolute;
+        top: 10px;
+        right: 27px;
+        color: #c0c4cc;
+    }
+}
\ No newline at end of file

src/components/app-department-personnel/app-department-personnel.vue

 <template>
     <div class="app-department-personnel">
         <i-select :multiple="multiple" :transfer="true" transfer-class-name="app-department-personnel-select" :value="selectsLabel" :disabled="disabled" :clearable="true" @on-open-change="onClick" @on-change="change">
-            <i-option v-for="(item, index) in items" :key="index" :value="item.id" :label="item.label">
-                {{item.label}}
-            </i-option>
+            <i-option v-for="(item, index) in items" :key="index" :value="item.id" :label="item.label"></i-option>
         </i-select>
         <template>
             <i v-if="!disabled" class="el-icon-search" @click="openView"></i>
@@ -434,13 +432,5 @@ export default class AppDepartmentPersonnel extends Vue {
 
 </script>
 <style lang="less">
-.app-department-personnel{
-    position: relative;
-    .el-icon-search{
-        position: absolute;
-        top: 10px;
-        right: 27px;
-        color: #c0c4cc;
-    }
-}
+@import './app-department-personnel.less';
 </style>
\ No newline at end of file

src/components/app-group-select/app-group-select.less

+.ibiz-group-select {
+    width: 100%;
+    display: flex;
+    border: 1px solid #DCDFE6;
+    height: 32px;
+    border-radius: 4px;
+    .ibiz-group-content {
+        flex-grow: 1;
+        height: 32px;
+        .group-item-text{
+            padding-left: 15px;
+            font-size: 13px;
+        }
+        .ibiz-group-item {
+            display: inline-block;
+            border: 1px solid #bbb;
+            border-radius: 5px;
+            font-size: 12px;
+            height: 24px;
+            line-height: 22px;
+            margin: 2px 0px 2px 6px;
+            padding: 1px 3px 0 8px;
+            background-color: #f4f4f5;
+            border-color: #e9e9eb;
+            color: #909399;
+            .group-item-multiple{
+                margin: 0 8px 0 0;
+            }
+            .el-icon-close{
+                color: #909399;
+                background-color: #c0c4cc;
+                border-radius: 50%;
+                top: 0;
+            }
+            .el-icon-close:hover{
+                color: #fff;
+                background-color: #909399;
+            }
+        }
+    }
+    .ibiz-group-open {
+        display: flex;
+        text-align: center;
+        align-items: center;
+        padding: 0 5px;
+    }
+}
+.ibiz-group-select:hover {
+    border-color: #108cee;
+}
\ No newline at end of file

src/components/app-group-select/app-group-select.vue

 <template>
     <div class="ibiz-group-select">
         <div class="ibiz-group-content">
-            <span v-if="!multiple">
+            <span class="group-item-text" v-if="!multiple">
                 {{ selectName }}
             </span>
             <template v-else v-for="(select, index) of selects">
                 <div :key="index" class="ibiz-group-item">
-                    {{ select.label }}
+                    <span class="group-item-multiple">{{ select.label }}</span>
                     <i v-if="!disabled" class="el-icon-close" @click="remove(select)"></i>
                 </div>
             </template>
         </div>
         <div v-if="!disabled" class="ibiz-group-open">
             <i v-if="!disabled && !multiple && selects.length > 0" class="el-icon-close" @click="remove(selects[0])"></i>
-            <i class="el-icon-search" @click="openView"></i>
+            <i class="el-icon-search" @click="openView" style="color: #c0c4cc;"></i>
         </div>
     </div>
 </template>
@@ -328,32 +328,5 @@ export default class AppGroupSelect extends Vue {
 </script>
 
 <style lang="less">
-.ibiz-group-select {
-    width: 100%;
-    display: flex;
-    border: 1px solid #DCDFE6;
-    min-height: 32px;
-    border-radius: 4px;
-    .ibiz-group-content {
-        flex-grow: 1;
-        padding: 0 16px;
-        .ibiz-group-item {
-            display: inline-block;
-            border: 1px solid #bbb;
-            line-height: 24px;
-            border-radius: 5px;
-            margin-right: 5px;
-            padding: 0 5px;
-        }
-    }
-    .ibiz-group-open {
-        display: flex;
-        text-align: center;
-        align-items: center;
-        padding: 0 5px;
-    }
-}
-.ibiz-group-select:hover {
-    border-color: #108cee;
-}
+@import './app-group-select.less';
 </style>
\ No newline at end of file