Update index.vue

src/views/equipment/passenger/index.vue

@@ -2,10 +2,10 @@
   <div class="app-container">
     <el-form :model="queryForm" inline size="small">
       <el-form-item label="点位分布">
-        <select-base-bz-data v-model="queryForm.placeBaseInfoId" :multiple="false" />
+        <select-base-bz-data v-model="queryForm.placeBaseInfoId" :multiple="false"/>
       </el-form-item>
       <el-form-item label="备注说明">
-        <el-input v-model="queryForm.brief" placeholder="备注说明" />
+        <el-input v-model="queryForm.brief" placeholder="备注说明"/>
       </el-form-item>
       <el-form-item label="时间维度">
         <el-date-picker
@@ -36,29 +36,37 @@
       <div style="font-size: 14px;text-overflow: ellipsis;overflow: hidden;white-space: nowrap;width:200px ">
         {{ item.brief }}
       </div>
-      <div class="clearfix">
+      <div class="clearfix" style="text-align: center">
         <el-row :gutter="16">
           <el-col :span="12">
             <p>
-              {{ item.inPeopleCount || 0 }}
+              <span style="color: #45CA9D;font-size: 18px">{{ item.inPeopleCount || 0 }}</span>
               <span style="color: gray;font-size: 12px;display: block">流入数量</span>
             </p>
           </el-col>
           <el-col :span="12">
             <p>
-              {{ item.outPeopleCount || 0 }}
+              <span style="color: #F37868;font-size: 18px">{{ item.outPeopleCount || 0 }}</span>
               <span style="color: gray;font-size: 12px;display: block">流出数量</span>
             </p>
           </el-col>
         </el-row>
       </div>
-      <div class="clearfix action-btns">
-        <el-button v-permission="['equipment.passenger.edit']" type="text" @click="$refs.dialogForm.open(item)">编辑</el-button>
-        <el-button v-permission="['equipment.passenger.delete']" type="text" @click="deleteByIds([item.id])">删除</el-button>
-        <el-button type="text" @click="goToDetail(item.id)">详情</el-button>
+      <div class="clearfix action-btns" style="text-align: center;font-size: 13px;margin-top: 10px">
+        <el-row :gutter="16">
+          <el-col :span="8">
+            <a v-permission="['equipment.passenger.edit']" type="text" @click="$refs.dialogForm.open(item)">编辑</a>
+          </el-col>
+          <el-col :span="8">
+            <a v-permission="['equipment.passenger.delete']" type="text" @click="deleteByIds([item.id])">删除</a>
+          </el-col>
+          <el-col :span="8">
+            <a type="text" @click="goToDetail(item.id)">详情</a>
+          </el-col>
+        </el-row>
       </div>
     </el-card>
-    <div style="clear: both" />
+    <div style="clear: both"/>
     <el-pagination
       class="pagination-container"
       background
@@ -67,7 +75,7 @@
       :page-size="pageData.pageSize"
       @current-change="paginationChange"
     />
-    <dialog-form ref="dialogForm" @ok="fetchData" />
+    <dialog-form ref="dialogForm" @ok="fetchData"/>
   </div>
 </template>
 <style type="text/css">