Merge branch 'dev' of http://www.baoxianzhanggui.com:8090/sxzgd/vue-insagent-pc into dev

src/assets/css/common.css

@@ -31,6 +31,10 @@
 }
 .flex{
 	display: flex;
+
+}
+.f-wrap{
+  flex-wrap: wrap;
 }
 .j-s{
 	justify-content: space-between;

src/http/moudules/task.js

@@ -307,7 +307,7 @@ export const findPageAccount = (data) => {
 }
 export const findPageAccountPro = (data) => {
   return axios({
-    url: '/sysUserAccount/queryPage',
+    url: '/sysUserAccount/queryPageList',
     method: 'post',
     data
   })

src/store/modules/menu.js

@@ -1,28 +1,47 @@
 export default {
-    state: {
-        navTree: [],  // 导航菜单树
-        leftTree: [], //左侧菜单树
-    },
-    getters: {
+  state: {
+    navTree: [],  // 导航菜单树
+    leftTree: [], //左侧菜单树
+    filterList: [
+      "agreementManage/carInsurance/agreementHistoryRecord",
+      "agreementManage/carInsurance/agreementProductFee",
+      "agreementManage/carInsurance/agreementUnderwritingRule",
+      "agreementManage/carInsurance/agreementNonVehicleConfig",
+      "letter/wallet/amountManagement"
+    ]
+  },
+  getters: {
 
-    },
-    mutations: {
-        setNavTree(state, navTree) {  // 设置导航菜单树
-            state.navTree = navTree;
-            if (Array.isArray(navTree) && navTree.length > 0) {
-                state.leftTree = navTree[0].children;
-            }
-        },
-        changeLeftTree(state, id) {
-            for (let i = 0; i < state.navTree.length; i++) {
-                if (state.navTree[i].id === id) {
-                    state.leftTree = state.navTree[i].children;
-                    break;
-                }
+  },
+  mutations: {
+    setNavTree(state, navTree) {  // 设置导航菜单树
+      function filterTree(tree, filterList) {
+        return tree
+          .filter(item => !filterList.includes(item.url))
+          .map(item => {
+            // 如果项目有子项目，则递归过滤子树
+            if (item.children && item.children.length) {
+              return { ...item, children: filterTree(item.children, filterList) };
             }
+            return item;
+          });
+        };
+        const filteredNavTree = filterTree(navTree, state.filterList);
+        state.navTree = filteredNavTree;
+        if (Array.isArray(filteredNavTree) && filteredNavTree.length > 0) {
+          state.leftTree = filteredNavTree[0].children;
+        }
+      },
+      changeLeftTree(state, id) {
+        for (let i = 0; i < state.navTree.length; i++) {
+          if (state.navTree[i].id === id) {
+            state.leftTree = state.navTree[i].children;
+            break;
+          }
         }
+      }
     },
     actions: {
 
     }
-}
+  }

src/views/Core/KtCommonTable.vue

@@ -1,46 +1,162 @@
 <template>
   <div style="position: relative" ref="commonTable">
     <!--表格栏-->
-    <el-table id="commonTable" ref="doLayout" :data="data.content" :highlight-current-row="highlightCurrentRow"
-      @selection-change="selectionChange" @row-click="rowClick" @current-change="handleCurrentChange"
-      :element-loading-text="$t('action.loading')" :border="border" :stripe="stripe" :show-summary="showSummary"
-      :summary-method="getSummaries" :show-overflow-tooltip="showOverflowTooltip" :height="tableHeights? tableHeights:tableHeight" :size="size"
-      :align="align" :header-cell-style="{
+    <el-table
+      id="commonTable"
+      ref="doLayout"
+      :data="data.content"
+      :highlight-current-row="highlightCurrentRow"
+      @selection-change="selectionChange"
+      @row-click="rowClick"
+      @current-change="handleCurrentChange"
+      :element-loading-text="$t('action.loading')"
+      :border="border"
+      :stripe="stripe"
+      :show-summary="showSummary"
+      :summary-method="getSummaries"
+      :show-overflow-tooltip="showOverflowTooltip"
+      :height="tableHeights ? tableHeights : tableHeight"
+      :size="size"
+      :align="align"
+      :header-cell-style="{
         background: '#F2F7FC',
         fontWeight: '900',
         color: '#606266',
-      }" style="width: 100%" :row-class-name="tableRowClassName">
-      <el-table-column type="selection" width="50" fixed align="center"
-        v-if="showBatchDelete || showBatchSettled || showBatchPrint || customToolseletted"></el-table-column>
-      <el-table-column v-if="SerialShow" label="序号" type="index" width="50" align="center"></el-table-column>
+      }"
+      style="width: 100%"
+      :row-class-name="tableRowClassName"
+    >
+      <el-table-column type="expand" v-if="showSysUserAccountCardList" style="display: flex;">
+        <template slot-scope="scope">
+          <el-table
+            :data="scope.row.sysUserAccountCardList"
+            size="small"
+            :header-cell-style="{
+              background: '#ccc',
+              fontWeight: '900',
+              color: '#606266',
+            }"
+            style="width: 55%"
+          >
+            <el-table-column
+              type="index"
+              width="50"
+              align="center"
+              label="序号"
+            >
+            </el-table-column>
+            <el-table-column prop="bankAccount" label="银行" style="flex: 1">
+            </el-table-column>
+            <el-table-column prop="bankAddress" label="开户行" style="flex: 1">
+            </el-table-column>
+            <el-table-column prop="bankNumber" label="银行卡号" style="flex: 1">
+            </el-table-column>
+          </el-table>
+        </template>
+      </el-table-column>
+      <el-table-column
+        type="selection"
+        width="50"
+        fixed
+        align="center"
+        v-if="
+          showBatchDelete ||
+          showBatchSettled ||
+          showBatchPrint ||
+          customToolseletted
+        "
+      ></el-table-column>
+      <el-table-column
+        v-if="SerialShow"
+        label="序号"
+        type="index"
+        width="50"
+        align="center"
+      ></el-table-column>
+
       <template v-for="column in columns">
-        <el-table-column header-align="center" align="center" :prop="column.prop" :label="column.label"
-          :width="column.width" :min-width="column.minWidth" :fixed="column.fixed" :key="column.prop" :type="column.type"
-          :formatter="column.formatter" :sortable="column.sortable ? column.sortable : false"
-          v-if="column.signIcon || column.isImg || column.isBtn">
+        <el-table-column
+          header-align="center"
+          align="center"
+          :prop="column.prop"
+          :label="column.label"
+          :width="column.width"
+          :min-width="column.minWidth"
+          :fixed="column.fixed"
+          :key="column.prop"
+          :type="column.type"
+          :formatter="column.formatter"
+          :sortable="column.sortable ? column.sortable : false"
+          v-if="column.signIcon || column.isImg || column.isBtn"
+        >
           <template slot-scope="scope">
-            <el-switch :disabled="column.isDisabled" v-if="column.signIcon" v-model="scope.row[column.prop]"
-              active-value="1" inactive-value="0" @change="signStateChanged(scope.$index, scope.row)"></el-switch>
-            <img v-if="column.isImg" :width="column.imgWidth" :height="column.imgHeight" :src="scope.row[column.prop]" />
-            <kt-button v-if="column.isBtn" icon="fa fa-edit" :label="column.btnName" :size="size"
-              :perms="column.permsEdit" @click="handleBtnEdit(scope.$index, scope.row)" />
+            <el-switch
+              :disabled="column.isDisabled"
+              v-if="column.signIcon"
+              v-model="scope.row[column.prop]"
+              active-value="1"
+              inactive-value="0"
+              @change="signStateChanged(scope.$index, scope.row)"
+            ></el-switch>
+            <img
+              v-if="column.isImg"
+              :width="column.imgWidth"
+              :height="column.imgHeight"
+              :src="scope.row[column.prop]"
+            />
+            <kt-button
+              v-if="column.isBtn"
+              icon="fa fa-edit"
+              :label="column.btnName"
+              :size="size"
+              :perms="column.permsEdit"
+              @click="handleBtnEdit(scope.$index, scope.row)"
+            />
           </template>
         </el-table-column>
-        <el-table-column header-align="center" align="center" :prop="column.prop" :label="column.label"
-          :width="column.width" :min-width="column.minWidth" :fixed="column.fixed" :key="column.prop" :type="column.type"
-          :formatter="column.formatter" :sortable="column.sortable ? column.sortable : false" v-else>
+        <el-table-column
+          header-align="center"
+          align="center"
+          :prop="column.prop"
+          :label="column.label"
+          :width="column.width"
+          :min-width="column.minWidth"
+          :fixed="column.fixed"
+          :key="column.prop"
+          :type="column.type"
+          :formatter="column.formatter"
+          :sortable="column.sortable ? column.sortable : false"
+          v-else
+        >
           <template v-for="columnchildren in column.children">
-            <el-table-column v-if="columnchildren" header-align="center" align="center" :prop="columnchildren.prop"
-              :label="columnchildren.label" :width="columnchildren.width" :min-width="columnchildren.minWidth"
-              :fixed="columnchildren.fixed" :key="columnchildren.prop" :type="columnchildren.type"
-              :formatter="columnchildren.formatter" :sortable="columnchildren.sortable == null ? true : columnchildren.sortable
-                ">
+            <el-table-column
+              v-if="columnchildren"
+              header-align="center"
+              align="center"
+              :prop="columnchildren.prop"
+              :label="columnchildren.label"
+              :width="columnchildren.width"
+              :min-width="columnchildren.minWidth"
+              :fixed="columnchildren.fixed"
+              :key="columnchildren.prop"
+              :type="columnchildren.type"
+              :formatter="columnchildren.formatter"
+              :sortable="
+                columnchildren.sortable == null ? true : columnchildren.sortable
+              "
+            >
             </el-table-column>
           </template>
         </el-table-column>
       </template>
-      <el-table-column :label="$t('action.operation')" :width="operationWidth" fixed="right" v-if="showOperation"
-        header-align="center" align="center">
+      <el-table-column
+        :label="$t('action.operation')"
+        :width="operationWidth"
+        fixed="right"
+        v-if="showOperation"
+        header-align="center"
+        align="center"
+      >
         <template slot-scope="scope">
           <kt-button
             type="primary"
@@ -121,20 +237,57 @@
     <!--分页栏-->
     <!-- 底部分页 -->
     <div class="bottomFixed" ref="bottomFixed">
-      <kt-button  :label="customToolName" :perms="permscustomTool" :size="size" type="danger"
-        @click="customToolMethod()" :disabled="selections.length === 0" style="float: left"
-        v-if="customToolseletted" />
-      <kt-button class="debutton" :label="deleteName" :perms="permsDelete" :size="size" type="danger"
-        @click="handleBatchDelete()" :disabled="selections.length === 0" style="float: left"
-        v-if="showBatchDelete & showOperation" />
-      <kt-button :label="settledName" :perms="permsSettled" :size="size" type="danger" @click="handleBatchSettled()"
-        :disabled="selections.length === 0" style="float: left" v-if="showBatchSettled" />
-      <kt-button label="导出Excel"  :perms="permsExcel" :size="size" type="danger" @click="handleBatchPrint()"
-        style="float: left" v-if="showBatchPrint" />
-      <el-pagination @size-change="handleSizeChange" layout="total, sizes, prev, pager, next, jumper"
-        @current-change="refreshPageRequest" :current-page="data.pageNum" :page-size="data.pageSize"
-        :page-sizes="[10, 20, 50, 100, 200, 300, 400, 500]" :total="data.totalSize" style="float: left; margin-left: 20px"
-        v-if="isshowpagination">
+      <kt-button
+        :label="customToolName"
+        :perms="permscustomTool"
+        :size="size"
+        type="danger"
+        @click="customToolMethod()"
+        :disabled="selections.length === 0"
+        style="float: left"
+        v-if="customToolseletted"
+      />
+      <kt-button
+        class="debutton"
+        :label="deleteName"
+        :perms="permsDelete"
+        :size="size"
+        type="danger"
+        @click="handleBatchDelete()"
+        :disabled="selections.length === 0"
+        style="float: left"
+        v-if="showBatchDelete & showOperation"
+      />
+      <kt-button
+        :label="settledName"
+        :perms="permsSettled"
+        :size="size"
+        type="danger"
+        @click="handleBatchSettled()"
+        :disabled="selections.length === 0"
+        style="float: left"
+        v-if="showBatchSettled"
+      />
+      <kt-button
+        label="导出Excel"
+        :perms="permsExcel"
+        :size="size"
+        type="danger"
+        @click="handleBatchPrint()"
+        style="float: left"
+        v-if="showBatchPrint"
+      />
+      <el-pagination
+        @size-change="handleSizeChange"
+        layout="total, sizes, prev, pager, next, jumper"
+        @current-change="refreshPageRequest"
+        :current-page="data.pageNum"
+        :page-size="data.pageSize"
+        :page-sizes="[10, 20, 50, 100, 200, 300, 400, 500]"
+        :total="data.totalSize"
+        style="float: left; margin-left: 20px"
+        v-if="isshowpagination"
+      >
       </el-pagination>
     </div>
   </div>
@@ -148,7 +301,7 @@ export default {
     KtButton,
   },
   props: {
-    tableHeights:{
+    tableHeights: {
       type: Number,
     },
     operationWidth: {
@@ -180,8 +333,8 @@ export default {
       //批量按钮name
       type: String,
     },
-    deleteName:{
-      type:String,
+    deleteName: {
+      type: String,
     },
     showBatchPrint: {
       //显示批量导出
@@ -290,14 +443,14 @@ export default {
       type: Boolean,
       default: true,
     },
-    showSummaryFieldList: Array,//自定义合计列配置
+    showSummaryFieldList: Array, //自定义合计列配置
     keyName: String, //主键字段名
     columns: Array, // 表格列配置
     data: {}, // 表格分页数据
     permsEdit: String, // 编辑权限标识
     permsDelete: String, // 底部按钮标识
-    permsSettled:String,// 底部按钮标识
-    permsExcel:String,// 底部按钮标识
+    permsSettled: String, // 底部按钮标识
+    permsExcel: String, // 底部按钮标识
     size: {
       // 尺寸样式
       type: String,
@@ -346,7 +499,11 @@ export default {
       type: Boolean,
       default: false,
     },
-
+    showSysUserAccountCardList: {
+      // 是否显示二级列组件
+      type: Boolean,
+      default: false,
+    },
   },
   data() {
     return {
@@ -356,15 +513,15 @@ export default {
       pageRequest: {
         pageNum: 1,
         pageSize: 20,
-    }
-  }
+      },
+    };
   },
   methods: {
-    tableRowClassName( row, rowIndex ) {
+    tableRowClassName(row, rowIndex) {
       // if (!!row.fieldName24 && row.fieldName24.indexOf("未") >= 0) {
       //   return "warningRow";
       // } else if (!!row.fieldName24 && row.fieldName24.indexOf("已") >= 0) {
-        // return "successRow";
+      // return "successRow";
       // }
       this.$emit("tableRowClassName", row);
       // return '';
@@ -437,12 +594,12 @@ export default {
     refreshPageRequest: function (pageNum) {
       this.pageRequest.pageNum = pageNum;
       this.pageRequest.pageSize = 20;
-      this.findPage()
+      this.findPage();
     },
     // 每页条数发生改变
     handleSizeChange(pageSize) {
       this.pageRequest.pageSize = pageSize;
-      this.findPage()
+      this.findPage();
     },
     signStateChanged(index, row) {
       this.$emit("signStateChanged", {
@@ -568,7 +725,7 @@ export default {
       this.$emit("handleDelete", idlist);
     },
     //自定义批量操作按钮
-    customToolMethod(){
+    customToolMethod() {
       let idlist = [];
       this.selections.map((item) => idlist.push(item.id));
       this.$emit("customTool", idlist);
@@ -611,7 +768,7 @@ export default {
             callback: callback,
           });
         })
-        .catch(() => { });
+        .catch(() => {});
     },
     //批量结算
     handleBatchSettled: function () {

src/views/FinancialManagement/AcountWithdrawal/AcountBalance.vue

@@ -58,6 +58,7 @@
         </div>
         <kt-common-table
           :showBatchDelete="false"
+          :showSysUserAccountCardList = "true"
           :showBatchPrint="false"
           :showOperation="true"
           :data="pageResult"
@@ -176,6 +177,7 @@ export default {
         { prop: "handlingFee", label: "手续费", minWidth: 100 },
         { prop: "documentary", label: "非跟单费", minWidth: 100 },
         { prop: "promotion", label: "分销费 （推广费）", minWidth: 100 },
+        { prop: "zgCoin", label: "掌柜币", minWidth: 100 },
         {
           prop: "handlingAmountWithdrawal",
           label: "手续费提现总金额",
@@ -222,6 +224,17 @@ export default {
           minWidth: 120,
         },
       ],
+      secondarycolumn:[
+        {
+          prop: "bankAccount", label: "银行", minWidth: 160
+        },
+        {
+          prop: "银行", label: "开户行", minWidth: 160
+        },
+        {
+          prop: "bankNumber", label: "银行卡号", minWidth: 160
+        }
+      ]
     };
   },
   created() {
@@ -299,6 +312,7 @@ export default {
         .then((res) => {
           if (res.code == 200) {
             this.pageResult = res.data;
+            console.log(this.pageResult);
           }
         });
     },

src/views/Letter/Appletter.vue

@@ -1,60 +0,0 @@
-<template>
-  <div>
-    <div class="iframe-wrap">
-      <iframe :src="this.global.h5BaseUrl" allowtransparency="true" frameborder="0"   scrolling="auto"  width="420" class="iframe" ref="homePage"></iframe>
-    </div>
-  </div>
-</template>
-<script>
-export default {
-  data() {
-    return {
-      clientHeight: "",
-    
-    };
-  },
-  mounted() {
-    // 获取浏览器可视区域高度
-    this.clientHeight = `${document.documentElement.clientHeight}`; //document.body.clientWidth;
-    //console.log(self.clientHeight);
-    window.onresize = function temp() {
-      this.clientHeight = `${document.documentElement.clientHeight}`;
-    };
-  },
-  watch: {
-    // 如果 `clientHeight` 发生改变，这个函数就会运行
-    clientHeight: function () {
-      this.changeFixed(this.clientHeight);
-    },
-  },
-  created() { },
-  methods: {
-    changeFixed(clientHeight) {
-      //动态修改样式
-      this.$refs.homePage.style.height = clientHeight - 120 + "px";
-
-    },
-  },
-};
-</script>
-<style scoped  lang="scss">
-.iframe-wrap {
-  display: flex;
-  justify-content: center;
-  align-items: center;
-}
-.demo-table-expand {
-    font-size: 0;
-    padding: 20px;
-    box-sizing: border-box;
-  }
-  .demo-table-expand label {
-    width: 90px;
-    color: #99a9bf;
-  }
-  .demo-table-expand .el-form-item {
-    margin-right: 0;
-    margin-bottom: 0;
-    width: 50%;
-  }
-</style>

src/views/Letter/Wallet/AmountManagement.vue

@@ -0,0 +1,833 @@
+<!-- 模板区域 -->
+<template>
+  <div id="body">
+    <!-- 模板内容 -->
+    <div class="flex a-c">
+      <el-button size="small" type="primary" icon="el-icon-arrow-left" @click="back">
+        返回
+      </el-button>
+      <h2 style="display: inline-block;margin-left: 20px;">{{ pageTitle }}</h2>
+    </div>
+    <div class="content">
+      <div class="header flex a-c j-s">
+        <template v-if="formQuery.amountStatus == '1'">
+          <div class="flex a-end j-s sum">
+            <div class="flex f-c a-start j-s" style="height:100%;">
+              <span>可提现（元）</span>
+              <span v-if="MoneyData.handlingFee" style="font-size: 28px;font-weight: bold;color: #333;">{{
+                MoneyData.handlingFee }}</span>
+              <span v-else>0.00</span>
+            </div>
+            <el-button type="primary" size="small" @click="withdrawalVisible = true">立即提现</el-button>
+          </div>
+          <div class="flex f-c a-c j-s">
+            <span>预收金额（元）</span>
+            <span v-if="MoneyData.willHalding">{{ MoneyData.willHalding }}</span>
+            <span v-else>0.00</span>
+          </div>
+          <div class="flex f-c a-c j-s">
+            <span>提现中（元）</span>
+            <span v-if="MoneyData.withdrawalHalding">{{ MoneyData.withdrawalHalding }}</span>
+            <span v-else>0.00</span>
+          </div>
+          <div class="flex f-c a-c j-s">
+            <span>已提现（元）</span>
+            <span v-if="MoneyData.approvedHalding">{{ MoneyData.approvedHalding }}</span>
+            <span v-else>0.00</span>
+          </div>
+        </template>
+        <template v-if="formQuery.amountStatus == '2'">
+          <div class="flex a-end j-s sum">
+            <div class="flex f-c a-start j-s">
+              <span>可提现（元）</span>
+              <span v-if="MoneyData.documentary" style="font-size: 28px;font-weight: bold;color: #333;">{{
+                MoneyData.documentary }}</span>
+              <span v-else>0.00</span>
+            </div>
+            <el-button type="primary" size="small" @click="withdrawalVisible = true">立即提现</el-button>
+          </div>
+          <div class="flex f-c a-c j-s">
+            <span>预收金额（元）</span>
+            <span v-if="MoneyData.willDocumentary">{{ MoneyData.willDocumentary }}</span>
+            <span v-else>0.00</span>
+          </div>
+          <div class="flex f-c a-c j-s">
+            <span>提现中（元）</span>
+            <span v-if="MoneyData.withdrawalDocumentary">{{ MoneyData.withdrawalDocumentary }}</span>
+            <span v-else>0.00</span>
+
+          </div>
+          <div class="flex f-c a-c j-s">
+            <span>已提现（元）</span>
+            <span v-if="MoneyData.approvedDocumentary">{{ MoneyData.approvedDocumentary }}</span>
+            <span v-else>0.00</span>
+
+          </div>
+        </template>
+        <template v-if="formQuery.amountStatus == '3'">
+          <div class="flex a-end j-s sum">
+            <div class="flex f-c a-start j-s">
+              <span>可提现（元）</span>
+              <span v-if="MoneyData.promotion" style="font-size: 28px;font-weight: bold;color: #333;">{{
+                MoneyData.promotion }}</span>
+              <span v-else>0.00</span>
+
+            </div>
+            <el-button type="primary" size="small" @click="withdrawalVisible = true">立即提现</el-button>
+          </div>
+          <div class="flex f-c a-c j-s">
+            <span>预收金额（元）</span>
+            <span v-if="MoneyData.willPromotion">{{ MoneyData.willPromotion }}</span>
+            <span v-else>0.00</span>
+
+          </div>
+          <div class="flex f-c a-c j-s">
+            <span>提现中（元）</span>
+            <span v-if="MoneyData.withdrawalPromotion">{{ MoneyData.withdrawalPromotion }}</span>
+            <span v-else>0.00</span>
+
+          </div>
+          <div class="flex f-c a-c j-s">
+            <span>已提现（元）</span>
+            <span v-if="MoneyData.approvedPromotion">{{ MoneyData.approvedPromotion }}</span>
+            <span v-else>0.00</span>
+          </div>
+        </template>
+      </div>
+      <el-form :inline="true" :model="formQuery" class="demo-form-inline" size="small" style="margin: 15px 0;">
+        <el-row>
+          <el-col :span="8">
+            <el-form-item label="订单状态:">
+              <el-radio-group v-model="formQuery.auditingStatus" @input="radioinput">
+                <el-radio v-for="val in statusList" :key="val.value" :label="val.value">{{ val.label
+                }}</el-radio>
+              </el-radio-group>
+            </el-form-item>
+          </el-col>
+
+          <el-col :span="8">
+            <el-form-item label="日期查询:">
+              <el-date-picker v-model="datetime" type="date" value-format="yyyy-MM-dd" placeholder="选择日期">
+              </el-date-picker>
+            </el-form-item>
+            <el-form-item>
+              <el-button type="primary" @click="onSubmit">查询</el-button>
+            </el-form-item>
+          </el-col>
+        </el-row>
+      </el-form>
+      <el-table size="small" :data="[2, 3].includes(formQuery.auditingStatus) ? pageResult : preReceivedPageResult"
+        height="500" border highlight-current-row stripe :header-cell-style="{
+          background: '#F2F7FC',
+          fontWeight: '700',
+          color: '#606266',
+        }">
+        <template v-if="[2, 3].includes(formQuery.auditingStatus)">
+          <el-table-column prop="id" label="订单号" align="center"></el-table-column>
+          <el-table-column prop="createTime" label="提现时间" align="center"></el-table-column>
+          <el-table-column prop="paytime" label="到账时间" align="center"></el-table-column>
+          <el-table-column prop="amount" label="金额" align="center"></el-table-column>
+        </template>
+        <template v-else>
+          <el-table-column prop="id" label="订单号" align="center"></el-table-column>
+          <el-table-column prop="signingTime" label="签单时间" align="center"></el-table-column>
+          <el-table-column prop="licenseno" label="车牌号" align="center"></el-table-column>
+          <el-table-column prop="willAmount" label="金额" align="center"></el-table-column>
+        </template>
+        <el-table-column label="操作" align="center" width="200" fixed="right">
+          <template slot-scope="scope">
+            <el-button v-if="[0, 1].includes(formQuery.auditingStatus) && ['1', '2'].includes(formQuery.amountStatus)"
+              size="small" type="primary" @click="OrderDetails(scope.$index, scope.row)">详情</el-button>
+            <el-button size="small" type="primary" @click="regularDetails(scope.$index, scope.row)">详情</el-button>
+          </template>
+        </el-table-column>
+      </el-table>
+    </div>
+    <!-- 车辆报价新页面 -->
+    <detailsDialog ref="detailsDialog" :orderInfo.sync="orderInfo" :Feepermissions="false"></detailsDialog>
+    <el-dialog title="账单详情" :visible.sync="detailsVisible" width="28%">
+      <div class="dialogCentent flex f-c j-s">
+        <template v-if="[2, 3].includes(formQuery.auditingStatus)">
+          <span v-if="orderDetail.id">交易编号： <span style="color: #333;">{{ orderDetail.id }}</span> </span>
+          <span v-if="orderDetail.createTime">申请时间： <span style="color: #333;">{{ orderDetail.createTime }}</span> </span>
+          <span v-if="formQuery.auditingStatus == '3' && orderDetail.paytime">到账时间： <span style="color: #333;">{{
+            orderDetail.paytime }}</span> </span>
+          <span v-if="orderDetail.bankNumber">提现账户： <span style="color: #333;">{{ orderDetail.bankNumber }}</span> </span>
+          <span v-if="orderDetail.bankAccount">提现银行 <span style="color: #333;">{{ orderDetail.bankAccount }}</span>
+          </span>
+          <span>交易编号： <span style="color: #333;">{{ orderDetail.id }}</span> </span>
+          <span>交易编号： <span style="color: #333;">{{ orderDetail.id }}</span> </span>
+        </template>
+        <template v-if="formQuery.amountStatus == '3' && [0, 1].includes(formQuery.auditingStatus)">
+          <div class="totalsum flex f-c a-c">
+            <span>金额</span>
+            <span>{{ tuiguangDetails.willAmount }}</span>
+          </div>
+          <span v-if="tuiguangDetails.subOrderId">订单编号： <span style="color: #333;">{{ tuiguangDetails.subOrderId }}</span>
+          </span>
+          <span v-if="tuiguangDetails.signingTime">承保时间： <span style="color: #333;">{{ tuiguangDetails.signingTime
+          }}</span> </span>
+          <span v-if="tuiguangDetails.licenseNo">车牌号： <span style="color: #333;">{{ tuiguangDetails.licenseNo }}</span>
+          </span>
+          <span v-if="tuiguangDetails.jypremium">驾意险： <span style="color: #333;">{{ tuiguangDetails.jypremium }}</span>
+          </span>
+          <span v-if="tuiguangDetails.jqpremium">交强险： <span style="color: #333;">{{ tuiguangDetails.jqpremium }}</span>
+          </span>
+          <span v-if="tuiguangDetails.sypremium">商业险： <span style="color: #333;">{{ tuiguangDetails.sypremium }}</span>
+          </span>
+          <span v-if="tuiguangDetails.agentName">代理人姓名： <span style="color: #333;">{{ tuiguangDetails.agentName }}</span>
+          </span>
+          <span v-if="tuiguangDetails.agentLevel">代理人级别： <span style="color: #333;">{{ tuiguangDetails.agentLevel
+          }}</span> </span>
+        </template>
+      </div>
+      <span slot="footer" class="dialog-footer">
+        <el-button size="small" @click="detailsVisible = false">取 消</el-button>
+      </span>
+    </el-dialog>
+    <el-dialog title="提现" :visible.sync="withdrawalVisible" width="50%">
+      <div class="flex j-s a-start">
+        <div class="dialoglist">
+          <div class="data flex  a-c j-start" v-for="val in cardPackList" :key="val.id" @click="bankselection(val)">
+            <div class="checked">
+              <img v-if="val.id == bankCardInfo.id" src="../../../../static/bankchecked.png" alt="">
+            </div>
+            <div class="logo flex j-c a-c">
+              <img :src="val.logo" alt="">
+            </div>
+            <div class="flex f-c j-s">
+              <span style="font-size: 16px;color: #333;">{{ val.bankAccount }}储蓄卡({{ val.bankNumber.slice(-4) }})</span>
+              <span style="font-size: 14px;color: rgba(51,51,51,0.6);">72小时到账</span>
+            </div>
+          </div>
+        </div>
+        <div class="dialoginput">
+          <h3>提现金额</h3>
+          <div style="border-bottom: 1px solid #999;" class="flex ">
+            <span style="font-size: 45px;font-weight: bold;color: #333;">￥</span>
+            <input type="text" class="no-border" @input="suminput">
+          </div>
+          <div class="" style="padding:10px">
+            <span v-if="is_out" style="color: red;">输入金额超过可提现金额，账户余额{{ MoneyData.handlingFee }}元</span>
+            <span v-else-if="is_lowest" style="color: red;">最低{{ lowest }}元起提现，账户余额{{ MoneyData.handlingFee }}元</span>
+            <template v-else>
+              <span class="amountHint">当前可提现余额{{ MoneyData.handlingFee }}元</span>
+              <span class="allHint" @click="">全部提现</span>
+            </template>
+
+          </div>
+        </div>
+      </div>
+      <span slot="footer" class="dialog-footer">
+        <el-button size="small" @click="withdrawalVisible = false">取 消</el-button>
+        <el-button size="small" type="danger" :disabled="!is_post" @click="withdrawalRequest">确 定</el-button>
+      </span>
+    </el-dialog>
+  </div>
+</template>
+<!-- 行为区域 -->
+<script>
+import KtCommonTable from "@/views/Core/KtCommonTable.vue"; //表格组件
+import detailsDialog from "@/views/Core/components/detailsDialog.vue";
+
+export default {
+  components: {
+    KtCommonTable,
+    detailsDialog
+  },
+  // 数据存放区域
+  data() {
+    return {
+      is_out: false,
+      is_lowest: false,
+      is_post: false,
+      lowest: 20,
+      extract: 0,
+      bankCardInfo: {},
+      withdrawalVisible: false,//提现弹窗
+      detailsVisible: false,//详情弹窗
+      pageResult: [],
+      preReceivedPageResult: [],
+      orderDetail: {},//提现详情
+      tuiguangDetails: {},//推广预收/实收详情
+      datetime: '',
+      Columns: [
+        //数据列
+        { prop: "id", label: " 订单号", minWidth: 160 },
+        { prop: "createTime", label: "提现时间", minWidth: 160 },
+        { prop: "paytime", label: "到账时间", minWidth: 160 },
+        { prop: "amount", label: "金额", minWidth: 160 },
+      ],
+      preReceivedColumns: [
+        //数据列
+        { prop: "id", label: " 订单号", minWidth: 160 },
+        { prop: "signingTime", label: "签单时间", minWidth: 160 },
+        { prop: "licenseno", label: "车牌号", minWidth: 160 },
+        { prop: "willAmount", label: "金额", minWidth: 160 },
+      ],
+      activeName: 'first',
+      formQuery: {
+        pageNum: 1,
+        pageSize: 20,
+        auditingStatus: 2,
+        amountStatus: '',
+      },
+      searchType: "",
+      amountType: "1",
+      statusList: [{
+        label: '预收',
+        value: 0,
+        searchType: 1,
+      },
+      {
+        label: '实收',
+        value: 1,
+        searchType: 2,
+      },
+      {
+        label: '提现中',
+        value: 2,
+      },
+      {
+        label: '已提现',
+        value: 3,
+      },
+      ],
+      MoneyData: {},
+      pageTitle: "",
+      orderInfo: {
+        //选中的订单
+        ownerinfo: {},
+        carinfo: {},
+        applyinfo: {},
+        insureinfo: {},
+        kindinfo: [],
+        riskinfo: [],
+        ownerinfo: {},
+        orderCommissionVo: {},
+        extendInfo: {}
+      },
+      cardPackList: [],//银行卡数据
+      bankList: [{
+        bankName: "中国邮政储蓄银行",
+        logo: "../../../../static/bankLogo/youzheng.png",
+        background: "linear-gradient(90deg, rgba(79, 136, 69, 0.7) 0%, #4f8845 100%)"
+      },
+      {
+        bankName: "中国工商银行",
+        logo: "../../../../static/bankLogo/gongshang.png",
+        background: "linear-gradient(90deg, rgba(177, 0, 13, 0.7) 0%, #b1000d 100%)"
+      },
+      {
+        bankName: "中国农业银行",
+        logo: "../../../../static/bankLogo/nongye.png",
+        background: "linear-gradient(90deg, rgba(86,152, 130, 0.7) 0%, #569882 100%)"
+      },
+      {
+        bankName: "中国银行",
+        logo: "../../../../static/bankLogo/zhongguo.png",
+        background: "linear-gradient(90deg, rgba(157, 32, 40, 0.7) 0%, #9d2028 100%)"
+      },
+      {
+        bankName: "中国建设银行",
+        logo: "../../../../static/bankLogo/jianshe.png",
+        background: "linear-gradient(90deg, rgba(6, 89, 159, 0.7) 0%, #06569F 100%)"
+      },
+      {
+        bankName: "招商银行",
+        logo: "../../../../static/bankLogo/zhaoshang.png",
+        background: "linear-gradient(90deg, rgba(197, 0, 25, 0.7) 0%, #c50019 100%)"
+      },
+      {
+        bankName: "中国民生银行",
+        logo: "../../../../static/bankLogo/minsheng.png",
+        background: "linear-gradient(90deg, rgba(84,149, 92, 0.7) 0%, #54955c 100%)"
+      },
+      {
+        bankName: "中国光大银行",
+        logo: "../../../../static/bankLogo/guangda.png",
+        background: "linear-gradient(90deg, rgba(93, 30, 131, 0.7) 0%, #5d1e83 100%)"
+      },
+      {
+        bankName: "中信银行",
+        logo: "../../../../static/bankLogo/zhongxin.png",
+        background: "linear-gradient(90deg, rgba(184, 0,22, 0.7) 0%, #b80016 100%)"
+      },
+      {
+        bankName: "华夏银行",
+        logo: "../../../../static/bankLogo/huaxia.png",
+        background: "linear-gradient(90deg, rgba(216, 12, 24, 0.7) 0%, #d80c18 100%)"
+      },
+      {
+        bankName: "中国交通银行",
+        logo: "../../../../static/bankLogo/jiaotong.png",
+        background: "linear-gradient(90deg, rgba(33, 58, 120, 0.7) 0%, #213a78 100%)"
+      },
+      {
+        bankName: "晋商银行",
+        logo: "../../../../static/bankLogo/jinshang.png",
+        background: "linear-gradient(90deg, rgba(224, 150, 165, 0.7) 0%, #e096a5 100%)"
+      },
+      ],
+    }
+  },
+  // 生命周期函数
+  created() {
+    this.formQuery.amountStatus = this.$route.query.type;
+    switch (this.formQuery.amountStatus) {
+      case 1:
+        this.pageTitle = "手续金额"
+        break;
+      case 2:
+        this.pageTitle = "跟单金额"
+
+        break;
+      case 3:
+        this.pageTitle = "推广金额"
+
+        break;
+    }
+    this.amountType = this.$route.query.type;
+    this.datetime = this.transformTime();
+    this.allamount();
+    this.FindPage();
+    this.banklist();
+  },
+  // 方法函数
+  methods: {
+    withdrawalRequest() {
+      let params = {
+        amount: this.extract,
+        amountStatus: this.formQuery.amountStatus,
+        fromBankCardId: this.bankCardInfo.id,
+      }
+      this.$api.letter.withdrawalRequest(params).then((res) => {
+        if (res.code == '200') {
+          this.$message({
+            type: 'success',
+            message: "提现成功",
+          });
+          this.allamount();
+          this.FindPage();
+          this.withdrawalVisible=false;
+        } else {
+          this.$message({
+            type: 'error',
+            message: res.msg,
+          });
+        }
+      });
+    },
+    suminput(e) {
+      if (e.data) {
+        this.extract = this.extract * 10 + parseInt(e.data);
+        console.log(this.extract)
+        this.checkMoney();
+      } else {
+        if (this.extract && this.extract > 0) {
+          let val = parseInt(this.extract / 10);
+          this.extract = val;
+          console.log(this.extract)
+          this.checkMoney();
+        }
+      }
+
+    },
+    checkMoney() {
+      if (!this.extract || this.extract < this.lowest) {
+        this.is_lowest = true;
+        this.is_post = false;
+      } else if (this.extract > this.MoneyData.handlingFee) {
+        this.is_out = true;
+        this.is_lowest = false;
+        this.is_post = false;
+      } else {
+        this.is_out = false;
+        this.is_lowest = false;
+        this.is_post = true;
+      }
+      if (parseFloat(this.extract).toString() == 'NaN') {
+        this.is_post = false;
+        this.$message({
+            type: 'error',
+            message: '输入金额不合法',
+          });
+      }
+    },
+    bankselection(data) {
+      this.bankCardInfo = data;
+    },
+    banklist() {
+      this.$api.letter.getUserBankList().then((res) => {
+        if (res.code == '200') {
+          this.bankList.map(val => {
+            res.data.map(ele => {
+              if (val.bankName == ele.bankAccount) {
+                ele.logo = val.logo;
+                return ele;
+              }
+            })
+          })
+          this.cardPackList = res.data;
+          let bankinfo = res.data.find(val => val.isDefault == 1)
+          if (bankinfo) {
+            this.bankCardInfo = bankinfo;
+          } else {
+            this.bankCardInfo = res.data[0]
+          }
+        } else {
+          this.$message({
+            type: 'error',
+            message: res.msg,
+          });
+        }
+      });
+    },
+    regularDetails(index, row) {
+      if (this.formQuery.amountStatus == "3" && [1, 2].includes(this.searchType)) {
+        this.$api.letter.getSubOrderDetails(row.id).then((res) => {
+          if (res.code == '200') {
+            this.tuiguangDetails = res.data;
+            this.tuiguangDetails.willAmount = row.willAmount;
+            this.detailsVisible = true;
+          } else {
+            this.$message({
+              type: 'error',
+              message: res.msg,
+            });
+          }
+        });
+      } else {
+        let obj = Object.assign({}, row);
+        this.orderDetail = obj;
+        this.detailsVisible = true;
+      }
+
+    },
+    OrderDetails(index, row) {
+      for (let i = 0; i < this.global.insureList.length; i++) {
+        this.global.insureList[i].coveragePremium = "";
+        this.global.insureList[i].amount = 0;
+      }
+      let params = {
+        companyId: row.id
+      };
+      this.$api.letter.getByCompanyId(params).then(res => {
+        if (res.code == 200) {
+          this.licenseNo = res.data.licenseno; //车牌号
+          this.inscompany = res.data.inscompany; //保险公司
+          // res.data.carinfo.carnature = this.natureOfVehicleUseCap(
+          //   res.data.carinfo.carnature
+          // );
+          if (res.data.accidentInfo) {
+            res.data.accidentInfo.constructor === Object
+              ? [res.data.accidentInfo]
+              : res.data.accidentInfo;
+          }
+          Object.assign(this.orderInfo, res.data);
+          if (this.orderInfo.riskinfo && this.orderInfo.riskinfo.length > 0) {
+            for (let i = 0; i < this.orderInfo.riskinfo.length; i++) {
+              if (this.orderInfo.riskinfo[i].riskCode == "0510") {
+                for (let j = 0; j < this.orderInfo.kindinfo.length; j++) {
+                  for (let m = 0; m < this.global.insureList.length; m++) {
+                    if (
+                      this.orderInfo.kindinfo[j].kindCode ==
+                      this.global.insureList[m].kindCode
+                    ) {
+                      this.global.insureList[
+                        m
+                      ].coveragePremium = this.orderInfo.kindinfo[
+                        j
+                      ].coveragePremium;
+                      if (this.orderInfo.kindinfo[j].kindCode == "B") {
+                        this.global.insureList[9].amtList[0].value = this.orderInfo.kindinfo[
+                          j
+                        ].amount;
+                      }
+                      if (this.orderInfo.kindinfo[j].kindCode == "A") {
+                        this.global.insureList[m].amount = "1";
+                      } else if (this.global.insureList[m].kindCode == "D4") {
+                        this.global.insureList[
+                          m
+                        ].amount = this.orderInfo.kindinfo[j].unitAmount;
+                      } else if (
+                        this.global.insureList[m].isMainRisk ||
+                        this.global.insureList[m].kindCode == "BD" ||
+                        this.global.insureList[m].kindCode == "L"
+                      ) {
+                        this.global.insureList[
+                          m
+                        ].amount = this.orderInfo.kindinfo[j].amount;
+                      } else {
+                        this.global.insureList[
+                          m
+                        ].amount = this.orderInfo.kindinfo[j].deductibleRate;
+                      }
+                    }
+                  }
+                }
+              }
+            }
+          }
+
+
+          this.$refs.detailsDialog.setBackupVisible(true);
+        } else {
+          this.$message.error("订单获取失败");
+        }
+      });
+    },
+
+    ordersUpdate(index, row) {
+      console.log(row)
+    },
+    radioinput(id) {
+      let info = this.statusList.find(val => val.value == id)
+      this.searchType = info.searchType;
+    },
+    onSubmit() {
+      switch (this.formQuery.auditingStatus) {
+        case 0:
+        case 1:
+          let param = {
+            timeFiltering: this.datetime,
+            amountType: this.amountType,
+            searchType: this.searchType,
+          }
+          this.$api.letter.sysUsergetInsOrders(param).then((res) => {
+            if (res.code == '200') {
+              this.preReceivedPageResult = res.data.insFeeOrderNewList;
+            } else {
+              this.$message({
+                type: 'error',
+                message: res.msg,
+              });
+            }
+          });
+          break;
+        case 2:
+        case 3:
+          this.FindPage();
+          break;
+      }
+    },
+    allamount() {
+      this.$api.letter.getSysAllAmount().then((res) => {
+        if (res.code == '200') {
+          this.MoneyData = res.data;
+        } else {
+          this.$message({
+            type: 'error',
+            message: res.msg,
+          });
+        }
+      });
+    },
+    productUpdate() {
+
+    },
+    preReceivedFindPage(data) {
+
+    },
+    //产品分页json
+    FindPage(data) {
+      if (data && data.pageRequest) {
+        this.formQuery.pageNum = data.pageRequest.pageNum;
+        this.formQuery.pageSize = data.pageRequest.pageSize;
+      } else {
+        this.formQuery.pageNum = 1;
+        this.formQuery.pageSize = 20;
+      }
+      let params = {
+        [this.formQuery.auditingStatus == 2 ? "withdrawalTime" : "timeFiltering"]: this.datetime,
+      }
+      this.$api.letter.queryAppPage({ ...params, ...this.formQuery }).then((res) => {
+        if (res.code == '200') {
+          this.pageResult = res.data.content;
+        } else {
+          this.$message({
+            type: 'error',
+            message: res.msg,
+          });
+        }
+      });
+    },
+    back() {
+      this.$router.push({
+        path: "fundsWallet",
+      });
+    },
+    handleClick(tab, event) {
+      console.log(tab.label);
+      switch (tab.label) {
+        case "手续金额":
+
+          break;
+        case "车险金额":
+
+          break;
+        case "推广金额":
+
+          break;
+      }
+    },
+    transformTime(day) {
+      var date = new Date();
+      date.setFullYear(date.getFullYear());
+      date.setTime(date.getTime());
+      var strYear = date.getFullYear();
+      var strDay = day ? date.getDate() - day : date.getDate();
+      var strMonth = date.getMonth() + 1;
+      if (strMonth < 10) {
+        strMonth = "0" + strMonth;
+      }
+      if (strDay < 10) {
+        strDay = "0" + strDay;
+      }
+      var datastr = strYear + "-" + strMonth + "-" + strDay;
+      return datastr;
+    },
+  },
+  // 计算属性
+  computed: {
+  }
+}
+</script>
+<!-- 样式区域 -->
+<style lang='scss' scoped>
+/deep/ {
+  .el-dialog__body {
+    background: #F2F2F2;
+  }
+
+  .el-dialog__footer {
+    padding: 10px;
+  }
+}
+
+.withdrawalinput {
+  border: none;
+}
+
+#body {
+  padding: 0 24px;
+}
+
+.dialoglist {
+  width: 40%;
+  padding: 20px;
+  height: 300px;
+  overflow-y: auto;
+  cursor: pointer;
+
+  .checked {
+    width: 20px;
+    height: 20px;
+    border-radius: 4px 4px 4px 4px;
+    border: 1px solid #D7DBE7;
+  }
+
+  .data {
+    margin: 10px;
+    border-bottom: 1px solid #f2f2f2;
+    padding: 10px;
+  }
+
+  .logo {
+    width: 50px;
+    height: 50px;
+
+    >img {
+      width: 40px;
+      height: 40px;
+
+    }
+  }
+}
+
+.dialoginput {
+  width: 50%;
+
+  .amountHint {
+    font-size: 16px;
+    color: rgba(51, 51, 51, 0.6);
+  }
+
+  .allHint {
+    font-size: 16px;
+    color: #2D4D89;
+    margin-left: 10px;
+    cursor: pointer;
+  }
+
+  input.no-border {
+    border: none;
+    outline: none;
+    background: transparent;
+    font-size: 45px;
+    font-weight: bold;
+  }
+}
+
+.dialogCentent,
+.dialoglist,
+.dialoginput {
+  background: #FFFFFF;
+  border-radius: 4px 4px 4px 4px;
+  padding: 10px;
+
+  >span {
+    font-family: PingFang SC, PingFang SC;
+    font-weight: 500;
+    font-size: 13px;
+    margin-bottom: 10px;
+    color: rgba(51, 51, 51, 0.8);
+  }
+
+  .totalsum {
+    span:nth-child(2) {
+      font-size: 30px;
+      color: red;
+      font-weight: bold;
+    }
+  }
+}
+
+.content {
+  padding: 5px 24px 20px 24px;
+
+  .header {
+    width: 100%;
+    height: 108px;
+    background: #F5F6F8;
+    border-radius: 12px 12px 12px 12px;
+    padding: 15px 40px;
+    box-sizing: border-box;
+
+    >div {
+      width: 25%;
+      height: 100%;
+
+      span:nth-child(2) {
+        font-family: DIN, DIN;
+        font-size: 28px;
+        font-weight: bold;
+      }
+
+    }
+
+    .sum {
+      border-right: 1px solid #D7DBE7;
+      box-sizing: border-box;
+      padding-right: 80px;
+
+      span:nth-child(1) {
+        font-family: DIN, DIN;
+        font-size: 20px;
+        color: rgba(51, 51, 51, 0.8);
+      }
+
+    }
+  }
+}
+</style>

src/views/Letter/Wallet/BankCard.vue

@@ -0,0 +1,410 @@
+<!-- 模板区域 -->
+<template>
+  <div id="body" class="flex f-wrap  a-c">
+    <!-- 模板内容 -->
+    <div class="bankClass " @click="bankAddVisible = true">
+      <div class="add flex j-c a-c">
+        <img src="../../../../static/bankadd.png" alt="">
+        <span>添加银行卡提现</span>
+      </div>
+    </div>
+    <div class="bankdata flex f-c j-s" :style="{ background: item.stylelist.background }"
+      v-for="(item, index) in cardPackList" :key="index">
+      <img class="Backgroundimage" src="../../../../static/bankLogo/img1.png" alt="">
+      <div class="flex j-s a-start">
+        <div class="flex">
+          <div class="logo">
+            <img :src="item.stylelist.logo" mode="">
+          </div>
+          <div class="banktitle flex f-c">
+            <span>{{ item.bankAccount }}</span>
+            <span>储蓄卡</span>
+          </div>
+        </div>
+        <img src="../../../../static/bankdel.png" mode="" style="width: 24px;height: 24px;" @click="bankdel(item.id)"
+          v-loading.fullscreen.lock="Loading">
+      </div>
+      <div class="bank flex j-s a-c">
+        <div>****</div>
+        <div>****</div>
+        <div>****</div>
+        <span>{{ item.bankNumber.slice(-4) }}</span>
+      </div>
+    </div>
+    <el-dialog title="添加银行卡" :visible.sync="bankAddVisible" width="28%">
+      <div class="dialogCentent">
+        <el-form ref="form" :model="bankAddform" label-width="80px">
+          <el-form-item label="选择银行">
+            <el-select v-model="bankAddform.bankAccount" placeholder="点击选择银行卡">
+              <el-option :label="item.label" :value="item.label" v-for="(item, index) in list " :key="index"></el-option>
+            </el-select>
+          </el-form-item>
+          <el-form-item label="银行卡">
+            <el-input v-model="bankAddform.bankNumber" placeholder="请输入银行卡号"></el-input>
+          </el-form-item>
+          <el-form-item label="开户行">
+            <el-input v-model="bankAddform.bankAddress" placeholder="请输入开户行"></el-input>
+          </el-form-item>
+
+        </el-form>
+      </div>
+      <span slot="footer" class="dialog-footer">
+        <el-button size="small" @click="bankAddVisible = false">取 消</el-button>
+        <el-button size="small" type="primary" @click="bankAdd">确 定</el-button>
+      </span>
+    </el-dialog>
+  </div>
+</template>
+<!-- 行为区域 -->
+<script>
+export default {
+  // 数据存放区域
+  data() {
+    return {
+      bankAddform: {
+        "bankNumber": "",
+        "bankAccount": "",
+        "bankAddress": "",
+        "isDefault": 0,
+      },
+      bankAddVisible: false,
+      Loading: false,
+      cardPackList: [],
+      list: [{
+        value: '1',
+        label: '中国工商银行'
+      },
+      {
+        value: '2',
+        label: '中国农业银行'
+      },
+      {
+        value: '3',
+        label: '中国银行'
+      },
+      {
+        value: '4',
+        label: '中国建设银行'
+      },
+      {
+        value: '5',
+        label: '交通银行'
+      },
+      {
+        value: '6',
+        label: '中国邮政储蓄银行'
+      },
+      {
+        value: '7',
+        label: '招商银行'
+      },
+      {
+        value: '8',
+        label: '中信银行'
+      },
+      {
+        value: '9',
+        label: '中国光大银行'
+      },
+      {
+        value: '10',
+        label: '华夏银行'
+      },
+      {
+        value: '11',
+        label: '中国民生银行'
+      },
+      {
+        value: '12',
+        label: '广发银行'
+      },
+      {
+        value: '13',
+        label: '平安银行'
+      },
+      {
+        value: '14',
+        label: '上海浦东发展银行'
+      },
+      {
+        value: '15',
+        label: '兴业银行'
+      },
+      {
+        value: '16',
+        label: '浙商银行'
+      },
+      {
+        value: '17',
+        label: '渤海银行'
+      },
+      {
+        value: '18',
+        label: '恒丰银行'
+      },
+      {
+        value: '19',
+        label: '北京银行'
+      },
+      {
+        value: '20',
+        label: '上海银行'
+      },
+      ],
+      bankList: [{
+        bankName: "中国邮政储蓄银行",
+        logo: "../../../../static/bankLogo/youzheng.png",
+        background: "linear-gradient(90deg, rgba(79, 136, 69, 0.7) 0%, #4f8845 100%)"
+      },
+      {
+        bankName: "中国工商银行",
+        logo: "../../../../static/bankLogo/gongshang.png",
+        background: "linear-gradient(90deg, rgba(177, 0, 13, 0.7) 0%, #b1000d 100%)"
+      },
+      {
+        bankName: "中国农业银行",
+        logo: "../../../../static/bankLogo/nongye.png",
+        background: "linear-gradient(90deg, rgba(86,152, 130, 0.7) 0%, #569882 100%)"
+      },
+      {
+        bankName: "中国银行",
+        logo: "../../../../static/bankLogo/zhongguo.png",
+        background: "linear-gradient(90deg, rgba(157, 32, 40, 0.7) 0%, #9d2028 100%)"
+      },
+      {
+        bankName: "中国建设银行",
+        logo: "../../../../static/bankLogo/jianshe.png",
+        background: "linear-gradient(90deg, rgba(6, 89, 159, 0.7) 0%, #06569F 100%)"
+      },
+      {
+        bankName: "招商银行",
+        logo: "../../../../static/bankLogo/zhaoshang.png",
+        background: "linear-gradient(90deg, rgba(197, 0, 25, 0.7) 0%, #c50019 100%)"
+      },
+      {
+        bankName: "中国民生银行",
+        logo: "../../../../static/bankLogo/minsheng.png",
+        background: "linear-gradient(90deg, rgba(84,149, 92, 0.7) 0%, #54955c 100%)"
+      },
+      {
+        bankName: "中国光大银行",
+        logo: "../../../../static/bankLogo/guangda.png",
+        background: "linear-gradient(90deg, rgba(93, 30, 131, 0.7) 0%, #5d1e83 100%)"
+      },
+      {
+        bankName: "中信银行",
+        logo: "../../../../static/bankLogo/zhongxin.png",
+        background: "linear-gradient(90deg, rgba(184, 0,22, 0.7) 0%, #b80016 100%)"
+      },
+      {
+        bankName: "华夏银行",
+        logo: "../../../../static/bankLogo/huaxia.png",
+        background: "linear-gradient(90deg, rgba(216, 12, 24, 0.7) 0%, #d80c18 100%)"
+      },
+      {
+        bankName: "中国交通银行",
+        logo: "../../../../static/bankLogo/jiaotong.png",
+        background: "linear-gradient(90deg, rgba(33, 58, 120, 0.7) 0%, #213a78 100%)"
+      },
+      {
+        bankName: "晋商银行",
+        logo: "../../../../static/bankLogo/jinshang.png",
+        background: "linear-gradient(90deg, rgba(224, 150, 165, 0.7) 0%, #e096a5 100%)"
+      },
+      ],
+    }
+  },
+  // 生命周期函数
+  created() {
+    this.banklist();
+  },
+  // 方法函数
+  methods: {
+    bankAdd() {
+      this.$api.letter.insertByBankNumber(this.bankAddform).then((res) => {
+        if (res.code == '200') {
+          this.bankAddVisible = false;
+          this.banklist();
+          this.$message({
+            type: 'success',
+            message: "添加成功",
+          });
+        } else {
+          this.$message({
+            type: 'error',
+            message: res.msg,
+          });
+        }
+      });
+    },
+    bankdel(id) {
+      this.$confirm('是否删除银行卡?', '提示', {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+        type: 'warning'
+      }).then(() => {
+        this.loading = true;
+        this.$api.letter.Bankdelete(id).then((res) => {
+          if (res.code == '200') {
+            this.banklist();
+            this.$message({
+              type: 'success',
+              message: '删除成功!'
+            });
+            this.loading = false;
+          } else {
+            this.$message({
+              type: 'error',
+              message: res.msg,
+            });
+          }
+        });
+      }).catch(() => {
+        this.$message({
+          type: 'info',
+          message: '已取消删除'
+        });
+      });
+
+    },
+    banklist() {
+      const loading = this.$loading({
+        lock: true,
+        text: 'Loading',
+        spinner: 'el-icon-loading',
+        background: 'rgba(0, 0, 0, 0.7)'
+      });
+      this.$api.letter.getUserBankList().then((res) => {
+        if (res.code == '200') {
+          res.data.map(val => {
+            let name = this.bankList.find(ele => ele.bankName === val.bankAccount)
+            if (name) {
+              val.stylelist = {
+                ...name
+              };
+            } else {
+              val.stylelist = {
+                logo: "/static/image/bindBank/img1.png",
+                background: 'linear-gradient(90deg, rgba(229, 166,0,0.7) 0%, #e5a600 100%)',
+              }
+            }
+          })
+          this.cardPackList = res.data;
+          loading.close();
+        } else {
+          this.$message({
+            type: 'error',
+            message: res.msg,
+          });
+        }
+      });
+    },
+  },
+  // 计算属性
+  computed: {
+  }
+}
+</script>
+<!-- 样式区域 -->
+<style lang='scss' scoped>
+/deep/ {
+  .el-dialog__body {
+    background: #F2F2F2;
+  }
+
+  .el-dialog__footer {
+    padding: 10px;
+  }
+}
+
+.dialogCentent {
+  background: #FFFFFF;
+  border-radius: 4px 4px 4px 4px;
+  padding: 10px;
+}
+
+#body {
+  padding: 24px;
+}
+
+.bankClass,
+.bankdata {
+  width: 322px;
+  height: 178px;
+  background: linear-gradient(90deg, rgba(45, 77, 137, 0.7) 0%, #2D4D89 100%);
+  border-radius: 12px 12px 12px 12px;
+  font-size: 16px;
+  color: #fff;
+  padding: 14px;
+  margin: 10px 40px;
+  box-sizing: border-box;
+  position: relative;
+  cursor: pointer;
+
+  .Backgroundimage {
+    width: 117px;
+    height: 107px;
+    position: absolute;
+    right: 0;
+    bottom: 0;
+  }
+
+  .banktitle {
+    margin-left: 12px;
+
+    span:first-child {
+      color: #fff;
+      font-weight: 600;
+      font-size: 16px;
+    }
+
+    span:last-child {
+      color: #fff;
+      font-size: 12px;
+    }
+  }
+
+  .bank {
+    font-size: 20px;
+    color: #fff;
+    margin-bottom: 30px;
+
+    span {
+      font-size: 20px;
+    }
+  }
+
+  .add {
+    width: 100%;
+    height: 100%;
+    border-radius: 8px 8px 8px 8px;
+    border: 1px dashed #fff;
+    background: transparent;
+
+    img {
+      width: 28px;
+      height: 28px;
+      margin-right: 16px;
+    }
+  }
+
+  .logo {
+    width: 40px;
+    height: 40px;
+    background: #FFFFFF;
+    border-radius: 8px 8px 8px 8px;
+
+    >img {
+      width: 100%;
+      height: 100%;
+    }
+  }
+
+
+
+}
+
+.bankClass:hover {
+  background: linear-gradient(90deg, rgba(88, 113, 161, 0.7) 0%, #5871A1 100%);
+}
+</style>

src/views/Letter/Wallet/FundsWallet.vue

@@ -0,0 +1,236 @@
+<!-- 模板区域 -->
+<template>
+  <div id="body">
+    <!-- 模板内容 -->
+    <div class="header flex a-c j-s">
+      <div class="flex f-c a-c j-s" @click="toBillDetails(1)">
+        <span>手续金额（元）</span>
+        <span class="color1" v-if="MoneyData.handlingFee">{{ MoneyData.handlingFee.toFixed(2) }}</span>
+        <span class="color1" v-else>0.00</span>
+      </div>
+      <div class="flex f-c a-c j-s center" @click="toBillDetails(2)">
+        <span>车险金额（元）</span>
+        <span class="color2" v-if="MoneyData.documentary">{{ MoneyData.documentary.toFixed(2) }}</span>
+        <span class="color2" v-else>0.00</span>
+      </div>
+      <div class="flex f-c a-c j-s" @click="toBillDetails(3)">
+        <span>推广金额（元）</span>
+        <span class="color3" v-if="MoneyData.promotion">{{ MoneyData.promotion.toFixed(2) }}</span>
+        <span v-else class="color3">0.00</span>
+      </div>
+    </div>
+    <div class="content flex f-wrap j-s a-c">
+      <div class="flex f-c a-c j-s">
+        <span>手续金额预收（元）</span>
+        <span v-if="MoneyData.willHalding">{{ MoneyData.willHalding }}</span>
+        <span v-else>0.00</span>
+      </div>
+      <div class="flex f-c a-c j-s">
+        <span>跟单金额预收（元）</span>
+        <span v-if="MoneyData.willDocumentary">{{ MoneyData.willDocumentary }}</span>
+        <span v-else>0.00</span>
+      </div>
+      <div class="flex f-c a-c j-s">
+        <span>推广金额预收（元）</span>
+        <span v-if="MoneyData.willPromotion">{{ MoneyData.willPromotion }}</span>
+        <span v-else>0.00</span>
+      </div>
+      <div class="flex f-c a-c j-s">
+        <span>手续金额提现中（元）</span>
+        <span v-if="MoneyData.withdrawalHalding">{{ MoneyData.withdrawalHalding }}</span>
+        <span v-else>0.00</span>
+      </div>
+      <div class="flex f-c a-c j-s">
+        <span>跟单金额提现中（元）</span>
+        <span v-if="MoneyData.withdrawalDocumentary">{{ MoneyData.withdrawalDocumentary }}</span>
+        <span v-else>0.00</span>
+      </div>
+      <div class="flex f-c a-c j-s">
+        <span>推广金额提现中（元）</span>
+        <span v-if="MoneyData.withdrawalPromotion">{{ MoneyData.withdrawalPromotion }}</span>
+        <span v-else>0.00</span>
+      </div>
+      <div class="flex f-c a-c j-s">
+        <span>手续金额已提现（元）</span>
+        <span v-if="MoneyData.approvedHalding">{{ MoneyData.approvedHalding }}</span>
+        <span v-else>0.00</span>
+      </div>
+      <div class="flex f-c a-c j-s">
+        <span>跟单金额已提现（元）</span>
+        <span v-if="MoneyData.approvedDocumentary">{{ MoneyData.approvedDocumentary }}</span>
+        <span v-else>0.00</span>
+      </div>
+      <div class="flex f-c a-c j-s">
+        <span>推广金额已提现（元）</span>
+        <span v-if="MoneyData.approvedPromotion">{{ MoneyData.approvedPromotion }}</span>
+        <span v-else>0.00</span>
+      </div>
+    </div>
+  </div>
+</template>
+
+<!-- 行为区域 -->
+<script>
+export default {
+  // 数据存放区域
+  data() {
+    return {
+      MoneyData: {},//数据对象
+    }
+  },
+  // 生命周期函数
+  created() {
+    this.allamount();
+  },
+  // 方法函数
+  methods: {
+    toBillDetails(type) {
+      this.$router.push({
+        path: "amountManagement",
+        query: { type: type },
+      });
+    },
+    allamount() {
+      const loading = this.$loading({
+          lock: true,
+          text: 'Loading',
+          spinner: 'el-icon-loading',
+          background: 'rgba(0, 0, 0, 0.7)'
+        });
+      this.$api.letter.getSysAllAmount().then((res) => {
+        if (res.code == '200') {
+          this.MoneyData = res.data;
+          loading.close();
+        } else {
+          this.$message({
+            type: 'error',
+            message: res.msg,
+          });
+        }
+      });
+    }
+  },
+  // 计算属性
+  computed: {
+  }
+}
+</script>
+<!-- 样式区域 -->
+<style lang='scss' scoped>
+#body {
+  padding: 20px 24px;
+}
+
+.color1 {
+  color: #0052FF;
+}
+
+.color2 {
+  color: #FF5600;
+}
+
+.color3 {
+  color: #229805;
+}
+
+.header {
+  width: 100%;
+  height: 108px;
+  background: #F2F5FD;
+  border-radius: 12px 12px 12px 12px;
+  padding: 16px;
+  box-sizing: border-box;
+
+  div {
+    width: 33.33%;
+    height: 100%;
+
+    span:nth-child(1) {
+      font-size: 20px;
+      color: rgba(51, 51, 51, 0.8);
+    }
+
+    span:nth-child(2) {
+      font-family: DIN, DIN;
+      font-size: 28px;
+      font-weight: bold;
+    }
+  }
+
+  .center {
+    border: 1px solid #D7DBE7;
+    border-top: none;
+    border-bottom: none;
+  }
+}
+
+.content {
+  width: 100%;
+  height: 283px;
+  background: #F5F6F8;
+  border-radius: 12px 12px 12px 12px;
+  padding: 28px;
+  box-sizing: border-box;
+  margin-top: 18px;
+
+  div {
+    width: 33.33%;
+    text-align: left;
+
+    span:nth-child(2) {
+      margin-top: 12px;
+      font-family: DIN, DIN;
+      font-size: 28px;
+      font-weight: bold;
+    }
+  }
+
+  :nth-child(1),
+  :nth-child(4),
+  :nth-child(7) {
+    span:nth-child(1) {
+      &::before {
+        content: "";
+        display: inline-block;
+        width: 10px;
+        height: 10px;
+        background: #0052FF;
+        margin-right: 6px;
+        border-radius: 50%;
+      }
+    }
+  }
+
+  :nth-child(2),
+  :nth-child(5),
+  :nth-child(8) {
+    span:nth-child(1) {
+      &::before {
+        content: "";
+        display: inline-block;
+        width: 10px;
+        height: 10px;
+        background: #FF5600;
+        margin-right: 6px;
+        border-radius: 50%;
+      }
+    }
+  }
+
+  :nth-child(3),
+  :nth-child(6),
+  :nth-child(9) {
+    span:nth-child(1) {
+      &::before {
+        content: "";
+        display: inline-block;
+        width: 10px;
+        height: 10px;
+        background: #229805;
+        margin-right: 6px;
+        border-radius: 50%;
+      }
+    }
+  }
+}
+</style>