优化：资金流水显示内容优化

src/filters/commFilter.js

@@ -337,7 +337,9 @@ export function transactionTypeFilter(type) {
     'brokerage_two': '二级分佣',
     'refund_brokerage_one': '返还一级分佣',
     'refund_brokerage_two': '返还二级分佣',
-    'order': '订单支付'
+    'order': '订单支付',
+    'supplier_mer': '供应商提成',
+    'province_mer': '省公司门店提成'
   }
   return typeMap[type]
 }

src/views/accounts/capitalFlow/index.vue

@@ -47,35 +47,57 @@
         </div>
         <cards-data :card-lists="cardLists" />
       </div>
-      <el-table
+      <el-table v-loading="listLoading" :data="tableData.data" style="width: 100%" size="mini" class="table" highlight-current-row>
-        v-loading="listLoading"
+        <el-table-column label="订单号" min-width="170" align="center">
-        :data="tableData.data"
-        style="width: 100%"
-        size="mini"
-        class="table"
-        highlight-current-row
-      >
-        <el-table-column label="订单号" min-width="200">
           <template slot-scope="scope">
             <span v-if="scope.row.financial_type != 'sys_accoubts'">{{ scope.row.order_sn }}</span>
             <span v-else>{{ scope.row.financial_record_sn }}</span>
           </template>
         </el-table-column>
-        <el-table-column prop="financial_record_sn" label="交易流水号" min-width="200" />
+        <el-table-column prop="financial_record_sn" label="交易流水号" min-width="170" align="center" />
-        <el-table-column prop="create_time" label="交易时间" min-width="150" sortable />
+        <el-table-column prop="create_time" label="交易时间" min-width="130" sortable align="center" />
-        <el-table-column prop="user_info" label="对方信息" min-width="150" />
+        <el-table-column label="交易用户" min-width="280" align="center">
-        <el-table-column label="交易类型" min-width="100">
+          <template slot-scope="scope">
+            <div class="user-content">
+              <div class="user-avatar">
+                <img :src="scope.row.user.avatar || moren" />
+              </div>
+              <div class="user-info">
+                <div class="nickname">{{ scope.row.user.nickname }}</div>
+                <div class="agent-type-text">
+                  <el-tag type="info" effect="dark" size="small">{{ scope.row.user.uid }}</el-tag>
+                </div>
+              </div>
+            </div>
+          </template>
+        </el-table-column>
+        <el-table-column label="交易类型" min-width="120" align="center">
           <template slot-scope="scope">
             <span>{{ scope.row.financial_type | transactionTypeFilter }}</span>
           </template>
         </el-table-column>
-        <el-table-column label="收支金额（元）" min-width="150" >
+        <el-table-column label="收支金额（元）" min-width="100" align="center">
           <template slot-scope="scope">
             <span>{{ scope.row.financial_pm === 1 ? scope.row.number : -scope.row.number }}</span>
           </template>
         </el-table-column>
-        <el-table-column label="操作" min-width="150" fixed="right">
+        <el-table-column label="归属商户" min-width="280" align="center">
           <template slot-scope="scope">
+            <div class="user-content">
+              <div class="user-avatar">
+                <img :src="scope.row.merchant.mer_avatar || moren" />
+              </div>
+              <div class="user-info">
+                <div class="nickname">{{ scope.row.merchant.mer_name }}</div>
+                <div class="agent-type-text">
+                  <el-tag type="info" effect="dark" size="small">{{ scope.row.merchant.mer_id }}</el-tag>
+                </div>
+              </div>
+            </div>
+          </template>
+        </el-table-column>
+        <el-table-column label="操作" min-width="100" fixed="right">
+          <template slot-scope="scope" v-if="scope.row.financial_type != 'supplier_mer' && scope.row.financial_type != 'province_mer'">
             <router-link v-if="scope.row.financial_type == 'sys_accoubts'" :to=" { path:`${roterPre}` + '/accounts/reconciliation?reconciliation_id='+scope.row.order_id } ">
               <el-button type="text" size="small" class="mr10">详情</el-button>
             </router-link>
@@ -118,6 +140,7 @@ export default {
   components: { fileList, cardsData },
   data() {
     return {
+      moren: require("@/assets/images/f.png"),
       timeVal: [],
       tableData: {
         data: [],
@@ -244,8 +267,79 @@ export default {
 }
 </script>
 
-<style scoped>
+<style scoped lang="scss">
 .selWidth {
   width: 320px;
 }
+/deep/ .cell{
+  padding: 0!important;
+}
+.user-content{
+  --user-content-height-: 80px;
+
+  height: var(--user-content-height-);
+  width: 100%;
+  display: inline-flex;
+  flex-direction: row;
+  flex-wrap: nowrap;
+  justify-content: flex-start;
+  align-items: center;
+  .user-avatar{
+    height: var(--user-content-height-);
+    width: var(--user-content-height-);
+    display: inline-flex;
+    flex-direction: row;
+    flex-wrap: nowrap;
+    justify-content: center;
+    align-items: center;
+    img{
+      height: 80%!important;
+      width: 80%!important;
+      border-radius: 50% !important;
+    }
+  }
+  .user-info{
+    max-width: calc(100% - var(--user-content-height-));
+    height: var(--user-content-height-);
+    display: inline-flex;
+    flex-direction: column;
+    flex-wrap: nowrap;
+    justify-content: center;
+    align-items: flex-start;
+    .nickname{
+      width: 100%;
+      height: 25px;
+      line-height: 25px;
+      text-align: left;
+      font-size: 15px;
+      font-weight: bold;
+      white-space: nowrap;
+      overflow: hidden;
+      text-overflow: ellipsis;
+      display: inline-flex;
+      flex-direction: row;
+      flex-wrap: nowrap;
+      justify-content: flex-start;
+      align-items: center;
+      .user-id{
+        color: #fff;
+        background-color: #409eff;
+        border-color: #409eff;
+        height: 18px;
+        line-height: 20px;
+        font-size: 13px;
+        padding: 0 5px;
+        border-radius: 5px;
+        margin-left: 10px;
+        width: max-content!important;
+      }
+    }
+    .user-id{
+      width: 100%;
+      text-align: left;
+      font-size: 13px;
+      line-height: calc(var(--user-content-height- * 35%));
+    }
+  }
+}
 </style>