updates

src/components/base/CardList.vue

@@ -4,14 +4,15 @@
     <el-card class="box_card">
       <div slot="header" class="clearfix">
         <span>{{ cardList.cardTitle }}</span>
-        <img
-          src="https://webapp-pub.ezijing.com/x-training-new/bg_add.png"
-          alt=""
-          @click="handleAdd"
-          class="box_card_add"
-          style="float: right; padding: 3px 0"
-        />
-        <!-- <el-button @click="handleAdd" type="text" icon="el-icon-circle-plus-outline" class="box_card_add"></el-button> -->
+        <div style="display: flex" class="box_card_add">
+          <img
+            src="https://webapp-pub.ezijing.com/x-training-new/bg_add.png"
+            alt=""
+            @click="handleAdd"
+            class="box_card_add_btn"
+          />
+          <div class="box_card_add_text">添加</div>
+        </div>
       </div>
       <div class="optionList">
         <div class="optionList_left">
@@ -55,7 +56,10 @@
                 </el-select>
               </el-form-item>
               <el-form-item>
-                <el-button type="text" @click="handleDelete(item, indexB)" icon="el-icon-close"></el-button>
+                <img
+                  src="https://webapp-pub.ezijing.com/x-training-new/btn_del.png"
+                  @click="handleDelete(item, indexB)"
+                />
               </el-form-item>
             </div>
           </el-form>
@@ -117,6 +121,20 @@ export default {
   justify-content: space-around;
 
   .box_card {
+    .box_card_add {
+      float: right;
+      padding-right: 104px;
+
+      .box_card_add_text {
+        font-size: 14px;
+        font-weight: 400;
+        color: #707070;
+        text-align: center;
+        line-height: 20px;
+        margin-left: 8px;
+      }
+    }
+
     .optionList {
       display: flex;
       .optionList_left {

src/modules/market-tools/components/mail/StepTodoList.vue

 <template>
   <div class="main_con">
-    <div class="optionList">
-      <div @click="handleAdd" style="float: right; padding: 0 130px">添加</div>
-
+    <div class="main_con_add" @click="handleAdd">
+      <img src="https://webapp-pub.ezijing.com/x-training-new/bg_add.png" alt="" />
+      添加
+    </div>
+    <div class="main_con_optionList">
       <div class="optionList_left">
-        <div>
+        <div v-for="item in form.triggerList.length - 1" :key="item">
           <div class="optionList_left_line"></div>
           <div class="optionList_left_text">且</div>
         </div>
@@ -96,47 +98,48 @@ export default {
 </script>
 
 <style lang="scss" scoped>
-.main_content {
+.main_con {
   display: flex;
-  justify-content: space-around;
-
-  .box_card {
-    .optionList {
+  flex-direction: column;
+  .main_con_add {
+    align-self: flex-end;
+    padding: 0 130px 30px 0;
+  }
+  .main_con_optionList {
+    display: flex;
+    .optionList_left {
+      position: relative;
       display: flex;
-      .optionList_left {
-        position: relative;
-        display: flex;
-        flex-direction: column;
-        .optionList_left_line {
-          width: 0px;
-          height: 85px;
-          border: 1px solid #c5c5c5;
-          opacity: 1;
-        }
-        .optionList_left_text {
-          border-radius: 50%;
-          width: 25px;
-          height: 25px;
-          background: #fff;
-          border: 1px solid #c5c5c5;
-          text-align: center;
-          font-size: 14px;
-          font-weight: 400;
-          line-height: 25px;
-          color: #49bba2;
-          margin-left: -12px;
-          margin-top: -60px;
-        }
+      flex-direction: column;
+      .optionList_left_line {
+        width: 0px;
+        height: 85px;
+        border: 1px solid #c5c5c5;
+        opacity: 1;
       }
-      .optionList_right {
-        margin-left: 16px;
-        .el-form-item {
-          padding-top: 0;
-          .optionList_right_del {
-            width: 12px;
-            height: 12px;
-            opacity: 1;
-          }
+      .optionList_left_text {
+        border-radius: 50%;
+        width: 25px;
+        height: 25px;
+        background: #fff;
+        border: 1px solid #c5c5c5;
+        text-align: center;
+        font-size: 14px;
+        font-weight: 400;
+        line-height: 25px;
+        color: #49bba2;
+        margin-left: -12px;
+        margin-top: -60px;
+      }
+    }
+    .optionList_right {
+      margin-left: 16px;
+      .el-form-item {
+        padding-top: 0;
+        .optionList_right_del {
+          width: 12px;
+          height: 12px;
+          opacity: 1;
         }
       }
     }