录入列表样式调整1

src/style/followup/element-reset.css

@@ -15,3 +15,9 @@
 .el-select .el-input__inner:focus {
   border-color: #449284;
 }
+.el-button--text{
+  color: #606266;
+}
+.el-button--text:focus, .el-button--text:hover{
+  color: #449284;
+}

src/style/followup/followup-common.scss

@@ -33,5 +33,8 @@ $picaGreen: #449284; //主色调
     padding: 30px 0 30px 0;
 
   }
+  .btn-right-class{
+    margin-right: 10px;
+  }
 }
 

src/views/followup/record-manage/record-list.vue

@@ -7,10 +7,10 @@
           <div class="search-input">
             <el-form ref="serchForm" :model="searchData" :inline="true" label-suffix=":" label-width="125px">
               <el-form-item label="随访计划名称">
-                <el-input v-model="searchData.planName" placeholder="请输入关键词" style="width: 250px"></el-input>
+                <el-input v-model="searchData.planName" placeholder="请输入关键词" style="width: 250px" clearable></el-input>
               </el-form-item>
               <el-form-item label="随访时间范围">
-                <el-select v-model="searchData.timeRange" placeholder="请选择时间范围" style="width: 250px">
+                <el-select v-model="searchData.timeRange" placeholder="请选择时间范围" style="width: 250px" clearable>
                   <el-option
                     v-for="(item,index) in timeRangeList"
                     :key="index"
@@ -20,10 +20,10 @@
                 </el-select>
               </el-form-item>
               <el-form-item label="姓名">
-                <el-input v-model="searchData.name" placeholder=""></el-input>
+                <el-input v-model="searchData.name" placeholder="请输入姓名" clearable></el-input>
               </el-form-item>
               <el-form-item label="手机号">
-                <el-input v-model="searchData.phoneNumber" placeholder="请输入手机号"></el-input>
+                <el-input v-model="searchData.phoneNumber" placeholder="请输入手机号" clearable></el-input>
               </el-form-item>
             </el-form>
           </div>
@@ -32,7 +32,7 @@
             <el-button class="button-white" plain @click="reseat">重置</el-button>
           </div>
         </div>
-        <div class="teble-content">
+        <div class="table-content">
           <el-radio-group v-model="activeName">
             <el-radio-button label="all">全部（{{allNum}}）</el-radio-button>
             <el-radio-button label="finished">已完成（{{finishedNum}}）</el-radio-button>
@@ -49,13 +49,24 @@
           </el-table-column>
           <el-table-column prop="createdName" label="随访状态" min-width="100" align="center"></el-table-column>
           <el-table-column label="操作" fixed="right" align="center" min-width="200">
-          <template slot-scope="scope">
-          <el-button type="primary" size="small" @click="editRow(scope.row)">随访录入 </el-button>
-          <el-button type="primary" size="small" @click="changeStatusRow(scope.row)">| 变更随访状态 </el-button>
-          <el-button type="primary" size="small" @click="sendRow(scope.row)">| 发送患教</el-button>
-          </template>
+            <template slot-scope="scope">
+              <el-button class="btn-right-class" type="text" size="small" @click="editRow(scope.row)">随访录入</el-button>|
+              <el-button class="btn-right-class" type="text" size="small" @click="changeStatusRow(scope.row)"> 变更随访状态</el-button>|
+              <el-button type="text" size="small" @click="sendRow(scope.row)">发送患教</el-button>
+            </template>
           </el-table-column>
           </el-table>
+          <el-pagination
+            background
+            v-if="allData.length"
+            @size-change="handleSizeChangePre"
+            @current-change="handleCurrentChangePre"
+            layout="total, sizes, prev, pager, next, jumper"
+            :current-page="paginationSet.pageNum"
+            :page-sizes="paginationSet.pageSizes"
+            :page-size="paginationSet.pageSize"
+            :total="paginationSet.total">
+          </el-pagination>
         </div>
       </div>
     </div>
@@ -88,9 +99,17 @@
         allNum: 300,
         finishedNum: 100,
         unfinishNum: 200,
-        allData: [],
+        allData: [{
+          name: '云晓雀'
+        }],
         finishedData: [],
         unfinishData: [],
+        paginationSet: {
+          pageNum: 1,
+          pageSize: 10,
+          total: null,
+          pageSizes: [10,20,50,100]
+        }
       }
     },
     methods: {
@@ -104,6 +123,8 @@
       editRow(){},
       changeStatusRow(){},
       sendRow(){},
+      handleSizeChangePre(){},
+      handleCurrentChangePre(){},
     },
   }
 </script>
@@ -113,15 +134,13 @@
   $input: 205px;
   $searchDiv: 160px;
   @import '../../../style/followup/followup-common';
+  @import '../../../style/followup/element-reset.css';
 .record-list-wrapper{
   .record-list-content{
     .search-input{
       max-width: none;
       flex: 1;
     }
-    .teble-content{
-      padding: 20px 0;
-    }
   }
 }
 </style>