调整样式

src/view/memberGroup/memberGroupEdit.vue

@@ -6,7 +6,7 @@
         <div class="memberGroupEdit-wrap__body">
           <el-form :model="ruleForm" :rules="rules" ref="ruleForm" class="demo-ruleForm">
             <el-form-item label="" prop="selectedTag">
-              <div>
+              <div class="label-title">
                 已选标签
                 <span class="color-909399 font-14">（同一个输入框内标签关系为且）</span>
               </div>
@@ -22,12 +22,12 @@
 
             </el-form-item>
             <el-form-item label="" prop="groupName" class="w-220">
-              <div>分组名称</div>
+              <div class="label-title">分组名称</div>
               <el-input class="w-220" v-model="ruleForm.groupName" :maxlength="10" placeholder="请输入分组名称"> </el-input>
               <label class="input-label">{{ ruleForm.groupName.length }}/10</label>
             </el-form-item>
             <el-form-item label="" prop="effectiveDateTmp">
-              <div class="effective">
+              <div class="effective label-title">
                 分组有效期
                 <el-tooltip content="分组有效期需早于所用标签的最早有效期，且最长不超过365天">
                   <i class="form-tip-icon">i</i>
@@ -37,12 +37,12 @@
               </el-date-picker>
             </el-form-item>
             <el-form-item label="" prop="describle" class="w-548">
-              <div>分组描述</div>
-              <el-input class="w-548" type="textarea" v-model="ruleForm.describle" :maxlength="200" style="height: 96px;"> </el-input>
-              <label class="input-label textarea-label">{{ ruleForm.describle.length }}/200</label>
+              <div class="label-title">分组描述</div>
+              <el-input class="w-548" type="textarea" v-model="ruleForm.describle" :maxlength="200" rows="4"> </el-input>
+              <label class="textarea-label">{{ ruleForm.describle.length }}/200</label>
             </el-form-item>
             <el-form-item label="" prop="updateDay" v-show="ruleForm.isActive == 0">
-              <div>更新频率 <span class="form-tip-text">(更新时间预计选择日期的凌晨0点至6点)</span></div>
+              <div class="label-title">更新频率 <span class="form-tip-text">(更新时间预计选择日期的凌晨0点至6点)</span></div>
               <el-select class="w-200" v-model="ruleForm.updateType" placeholder="请选择" @change="ruleForm.updateDay = ''">
                 <el-option v-for="(item, index) in rateData" :key="item.label" :label="item.label" :value="index + 1"></el-option>
               </el-select>
@@ -579,6 +579,10 @@ export default {
     display: flex;
     align-items: center;
   }
+  .label-title {
+    font-size: 14px;
+    color: #606266;
+  }
 
   .form-tip-text {
     margin-top: 8px;
@@ -612,7 +616,7 @@ export default {
   .textarea-label {
     position: absolute;
     right: 10px;
-    top: 96px;
+    top: 126px;
     font-size: 12px;
     color: #909399;
   }

src/view/memberGroup/tags-group.vue

@@ -25,8 +25,8 @@
               <span class="tags-group__tag-name">【选择:{{ item.newTagVal }}】</span>
               <div style="max-width: 350px; font-size: 14px;" slot="content">【选择:{{ item.newTagVal }}】</div>
             </el-tooltip>
-            <i class="iconfont icon-bianji edit" @click="editTags(index)"></i>
-            <i class="el-icon-error" @click="delTags(index)"></i>
+            <i class="iconfont icon-bianji1 edit" @click="editTags(index)"></i>
+            <i class="iconfont icon-guanbi" @click="delTags(index)"></i>
           </div>
         </draggable>
       </div>
@@ -180,10 +180,11 @@ export default {
     position: relative;
     display: inline-block;
     vertical-align: top;
-    padding: 6px 40px 6px 10px;
+    padding: 0 50px 0 10px;
     margin-right: 8px;
     margin-bottom: 8px;
     max-width: 100%;
+    height: 32px;
     background: #f3f6f9;
     border-radius: 2px;
     font-size: 14px;
@@ -194,11 +195,11 @@ export default {
       color: #303133;
       background: #e6e8ed;
 
-      i.edit {
+      i.icon-bianji1 {
         color: #1890ff;
       }
 
-      i.el-icon-error {
+      i.icon-guanbi {
         color: #f56c6c;
       }
     }
@@ -223,12 +224,12 @@ export default {
       color: #999;
       cursor: pointer;
     }
-    i.edit {
-      right: 18px;
+    i.icon-bianji1 {
+      right: 25px;
       color: #c0c4cc;
     }
-    i.el-icon-error {
-      right: 0;
+    i.icon-guanbi {
+      right: 5px;
     }
 
     .tags-group__tag-name {