资金管理

src/components/process/ContractAlteration.vue

@@ -10,7 +10,7 @@
           </el-form-item>
           <el-row style="margin-top: 20px; width: 100%">
             <el-col :span="8">
-              <el-form-item label="地址" prop="sellCountryName">
+              <el-form-item label="地址" prop="sellCountryName" class="dizhi">
                 <el-input v-model="formData.data.sellCountryName" placeholder="请输入国家" />
               </el-form-item>
             </el-col>

src/views/finance/fundManage/fundsStatement/index.vue

@@ -9,33 +9,35 @@
       </el-form-item>
       <el-form-item label="时间">
         <!-- 选单月 -->
-        <el-date-picker v-model="req.dateBetween" type="month" format="YYYY/MM" value-format="YYYY-MM" placeholder="选择日期"></el-date-picker>
+        <el-date-picker v-model="req.dateBetween" type="month" format="YYYY/MM" value-format="YYYY-MM"
+          placeholder="选择日期"></el-date-picker>
       </el-form-item>
       <el-form-item>
         <el-button type="primary" @click="getList">搜索</el-button>
       </el-form-item>
     </el-form>
-    <el-table :data="tableData" style="width: 100%" :span-method="objectSpanMethod">
+    <el-table :data="tableData" style="width: 100%" :span-method="objectSpanMethod" :height="tableHiehgt"
+      :cell-style="cellStyle">
       <el-table-column prop="accountManagementAlias" label="账户信息" width="400" fixed>
         <template #default="{ row }">
           <div class="account-box">
             <div class="text">
-              <div class="account">账户名称：{{ row.accountManagementAlias }}</div>
-              <div class="company">{{ row.corporationName }}</div>
+              <img src="@/assets/images/account-icon.png" alt="">
+              <div class="account">账户类型：{{ row.accountManagementAlias }}</div>
             </div>
-            <div class="img"></div>
+            <div class="corporation">{{ row.corporationName }}</div>
           </div>
         </template>
       </el-table-column>
-      <el-table-column prop="currencyType" label="币种" width="150" fixed>
+      <el-table-column prop="currencyType" label="币种" width="220" fixed>
         <template #default="{ row }">
-          {{ dictDataEcho(row.currencyType, dictsData.account_currency) }}
+          {{ dictDataEcho(row.currencyType, dictsData.account_currency) }}{{ row.currencyType }}（{{ row.balanceTotal }}）
         </template>
       </el-table-column>
-      <el-table-column :label="index + '日'" v-for="index of dayNum" :key="index">
-        <el-table-column :prop="index + 'income'" label="收入" />
-        <el-table-column :prop="index + 'expenditure'" label="支出" />
-        <el-table-column :prop="index + 'balance'" label="余额" />
+      <el-table-column :label="(dayNum - i + 1) + '日'" v-for="i of dayNum" :key="i">
+        <el-table-column :prop="(dayNum - i + 1) + 'income'" label="收入" width="120" />
+        <el-table-column :prop="(dayNum - i + 1) + 'expenditure'" label="支出" width="120" />
+        <el-table-column :prop="(dayNum - i + 1) + 'balance'" label="余额" width="120" />
       </el-table-column>
     </el-table>
   </div>
@@ -46,6 +48,8 @@ const { proxy } = getCurrentInstance();
 const loading = ref(false);
 let tableData = ref([]);
 const dayNum = ref(0);
+const tableHiehgt = ref(0);
+tableHiehgt.value = document.documentElement.clientHeight - 250;
 const objectSpanMethod = ({ rowIndex, columnIndex }) => {
   if (columnIndex === 0) {
     const _row = flitterData(tableData.value).one[rowIndex];
@@ -79,15 +83,27 @@ const flitterData = (arr) => {
   };
 };
 let req = ref({
-	dateBetween: formatDate(new Date(), 'yyyy-MM'),
-	managementId:null,
+  dateBetween: formatDate(new Date(), 'yyyy-MM'),
+  managementId: null,
 })
 let dictsData = {}
 proxy
-	.getDict(['account_currency'])
-	.then((res) => {
-		dictsData = res
-	})
+  .getDict(['account_currency'])
+  .then((res) => {
+    dictsData = res
+  })
+const cellStyle = ({ row, column, rowIndex, columnIndex }) => {
+  // 状态列字体颜色
+  // columnIndex 列下标
+  // rowIndex 行下标
+  // row 行
+  // column 列
+  if (columnIndex === 0) {
+    return { background: "#F9F9F9",color:'#666' };
+  } else if (columnIndex === 1) {
+    return { background: "#F9F9F9",color:'#666' };
+  }
+}
 
 const getList = async () => {
   loading.value = true;
@@ -113,12 +129,19 @@ const getList = async () => {
             obj[lelement.day + "balance"] = lelement.balance;
             obj[lelement.day + "income"] = lelement.income;
             obj[lelement.day + "expenditure"] = lelement.expenditure;
+            console.log(kelement.flowingWaterList.length + 'gggg' + l)
+            if (l === 0) {
+              console.log(kelement.flowingWaterList.length)
+              obj.balanceTotal = lelement.balance;
+            }
           }
           dayNum.value = kelement.flowingWaterList.length;
-          arr.push(obj);
+          //往前插入
+          arr.unshift(obj);
         }
       }
     }
+    console.log(arr);
     tableData.value = arr;
   });
 };
@@ -136,57 +159,52 @@ getAccountManagement();
   padding: 20px;
   margin: 20px;
   background: #fff;
+
   .account-box {
-    width: 360px;
-    height: 102px;
-    background: #eff6ff;
-    display: flex;
-    justify-content: space-between;
-    padding: 20px 10px 20px 33px;
-    margin: 20px 10px;
-    box-shadow: 0px 2px 10px 1px rgba(153, 153, 153, 0.1);
-    border-radius: 10px;
-    overflow: hidden;
-    position: relative;
-    .img {
-      width: 60px;
-      height: 60px;
-      background: url(../../../../assets/images/icon_zhangh1.png) no-repeat;
-    }
+    padding: 40px 20px;
+
     .text {
-      padding-top: 10px;
-      .account {
-        color: #333;
-        font-size: 20px;
-        font-weight: bold;
-      }
-      .company {
-        color: #999;
-        font-weight: 400;
-        font-size: 14px;
-        margin-top: 10px;
+      display: flex;
+      color: #333;
+      font-size: 14px;
+      font-weight: bold;
+      margin-bottom: 10px;
+
+      img {
+        width: 30px;
+        height: 22px;
+        background: linear-gradient(138deg, #1B67FF 0%, #9F63FB 72%, #EA76FB 100%);
+        border-radius: 5px;
+        opacity: 1;
+        margin-right: 10px;
       }
     }
   }
-  .account-box:before {
-    content: "";
-    width: 10px;
-    height: 102px;
-    background: #0084ff;
-    position: absolute;
-    left: 0;
-    top: 0;
-  }
+
   //修改tabletr边框颜色
   .is-group {
     tr {
-      .el-table_1_column_1 {
-        background: #eeeeee !important;
-      }
       th {
         border-color: #fff !important;
+        background: #eeeeee !important;
+      }
+
+
+    }
+
+    tr:first-child {
+
+      //选择第一个th
+      th:first-child {
+        background: #EFF6FF !important;
+      }
+
+      //选择第二个th
+      th:nth-child(2) {
+        background: #EFF6FF !important;
       }
     }
   }
-}
-</style>
+
+  .el-table__row {}
+}</style>