调整代码

src/components/upload/upload.vue

 <template>
     <el-row :gutter="20">
         <el-col :span="6"></el-col>
-        <el-col :span="16" v-if="filetype == 'file'">
+        <el-col :span="16">
             <el-upload class="upload-demo" drag action="https://jsonplaceholder.typicode.com/posts/" multiple
                 :on-preview="handlePreview" :on-remove="handleRemove" :before-remove="beforeRemove" :limit="3"
                 :on-exceed="handleExceed" :file-list="fileList" :on-success="uploadSuc">
                 </template>
             </el-upload>
         </el-col>
-        <el-col :span="16" v-if="filetype == 'img'">
+        <!--<el-col :span="16" v-if="filetype == 'img'">
             <el-upload action="https://jsonplaceholder.typicode.com/posts/" list-type="picture-card"
                 :on-preview="handlePictureCardPreview" :on-remove="handleRemove" :file-list="fileList" :limit="limit" :before-remove="beforeRemove" 
                 :on-exceed="handleExceed" :on-success="uploadSuc">
             <el-dialog v-model="dialogVisible">
                 <img w-full :src="dialogImageUrl" alt="Preview Image" />
             </el-dialog>
-        </el-col>
+        </el-col>-->
         <el-col :span="6">
 
         </el-col>

src/mock/fcc/replenishment.js

 import Mock from "mockjs";
 const Random = Mock.Random;
 const arr = ['蓝色','白色','黄色','白色','绿色']
+const phoneArr= ["139","182","152"]
+
+Mock.Random.extend({
+    phone:function(){
+        return this.pick(phoneArr)+Mock.mock(/\d{8}/)
+    }
+})
+
 let newList = Mock.mock({
     'list|5': [
         {
             small: "@dataImage(300x200,电影图片)",
             cardId: "@id()",
             name:"@cname()",
+            phone:"@phone",
             cardColor:Random.pick(arr),
             cardNumber:/^[京津沪渝冀豫云辽黑湘皖鲁新苏浙赣鄂桂甘晋蒙陕吉闽贵粤青藏川宁琼使领A-Z]{1}[A-Z]{1}(([A-Z0-9]{4}[A-Z0-9挂学警港澳]{1}$)|([0-9]{5}[DF]$)|([DF][A-HJ-NP-Z0-9][0-9]{4}$))/,
             "accountCardBalance|1-200.1-10": 1.00,
             'needByHandle|0-1': 0,
             'status|0-2': 0
         }
-    ],
+    ]
 })
 
-
+   
 Mock.mock(/\/csms\/finance\/supplybalance\/querysupply/, "post", (options) => {
     //console.log("ope",options,'---',newList);
     //var pageNo = getparams(options.body, 'pageNo');

src/mock/fcc/resubmissions.js

 import Mock from "mockjs";
 const Random = Mock.Random;
 const arr = ['黔通', '湘通', '青通'];
+const startarr = ["贵阳西","贵阳南","贵阳北","经开","花溪","白云"]
+Mock.Random.extend({
+    station:function(){
+        return this.pick(startarr)+"主线站"
+    }
+})
+
 let newList = Mock.mock({
     'list|5': [
         {
+            cardId: "@id()",
             paymentId: "@increment(1)",
-            //title: '@ctitle',
             paymentDate: '@date(yyyy-MM-dd hh:mm:ss)',
             paymentTime: '@date(yyyy-MM-dd hh:mm:ss)',
-            //info: '@cparagraph(5,10)',
-            //small: "@dataImage(300x200,电影图片)",
-            cardId: "@id()",
-            //name:"@cname()",
             cardchannel: Random.pick(arr),
             //cardNumber:/^[京津沪渝冀豫云辽黑湘皖鲁新苏浙赣鄂桂甘晋蒙陕吉闽贵粤青藏川宁琼使领A-Z]{1}[A-Z]{1}(([A-Z0-9]{4}[A-Z0-9挂学警港澳]{1}$)|([0-9]{5}[DF]$)|([DF][A-HJ-NP-Z0-9][0-9]{4}$))/,
             "fee|-1-200.1-10": -1.00,
             'status|0-2': 0
         }
     ],
+    'accaunt|5': [
+        {
+            station:"@station",
+            paymentId: "@increment(1)",
+            paymentDate: '@date(yyyy-MM-dd hh:mm:ss)',
+            cardId: "@id()",
+            cardchannel: Random.pick(arr),
+            cardNumber:/^[京津沪渝冀豫云辽黑湘皖鲁新苏浙赣鄂桂甘晋蒙陕吉闽贵粤青藏川宁琼使领A-Z]{1}[A-Z]{1}(([A-Z0-9]{4}[A-Z0-9挂学警港澳]{1}$)|([0-9]{5}[DF]$)|([DF][A-HJ-NP-Z0-9][0-9]{4}$))/,
+            "fee|-1-200.1-10": -1.00,
+            "postBalance|1-200.1-10": 1.00,
+            "refundBalance|1-200.1-10": 1.00,
+            'needByHandle|0-1': 0,
+            'status|0-2': 0
+        }
+    ],
 })
 
 Mock.mock(/\/csms\/finance\/balancepayment\/querydetails/, "post", (options) => {
             pageCount: 15,
             pageSize: 1,
             totalCount: 15,
-            cardBalance:card.cardBalance,
-            cardId: '',
-            handleTime: ''
+
         }
     }
 })
     }
 })
 
+Mock.mock(/\/csms\/finance\/balancepayment\/cardAccountDetil/, "post", (options) => {
+    console.log("ope", options);
+    //var pageNo = getparams(options.body, 'pageNo');
+    var pageSize = getparams(options.body, 'pageSize');
+    //console.log(pagenum, pagesize)
+    return {
+        code: 200,
+        message: '请求列表成功！',
+        data: {
+            currentPage: 1,
+            pageCount: 15,
+            pageSize: 1,
+            totalCount: 15,
+            accounts:[...newList.account],
+            cardBalance:card.cardBalance
+        }
+    }
+})
+
 
 const getparams = (option, agrument) => {
     //console.log(JSON.parse(option))

src/views/fancongcong/addsupplyCardBalance/addsupplyCardBalance.vue

             <el-button type="primary" @click="getquerydetails(scope.row)">补交明细</el-button>
           </el-tooltip>
           <el-tooltip content="卡帐名细" placement="top">
-            <el-button type="primary" @click="dialogFormVisible = true">卡帐名细</el-button>
+            <el-button type="primary" @click="cardAccountDetil">卡帐名细</el-button>
           </el-tooltip>
         </template>
       </el-table-column>
         @update:current-page="pagechange" />
     </div>
 
-    <el-dialog v-model="dialogFormVisible" title="卡账明细">
+    <el-dialog v-model="dialogFormVisible" title="卡账明细" width="93%">
       <el-table :data="CardDetil" style="width: 100%">
         <el-table-column prop="balance" label="当前卡内余额" width="150" />
         <el-table-column prop="balances" label="总消费金额" width="150" />
 const tableData = ref([
 
 ])
-const CardDetil = [
+const CardDetil = ref([
   {
     balance: '-72.98元', //当前卡内余额
     balances: '231.35元', //总消费金额
     licenseNumber: '贵JTH159', //车牌号
     Money: '0.0元', //金额
   },
-]
+])
+
 let cardBalance = ref(-1)
 
 //事件处理
   formInline.value.cardNumber = '';
 }
 
-
 onMounted(() => {
   search()
 })
     })
 }
 
+//卡帐明细
+const cardAccountDetil = ()=>{
+  dialogFormVisible.value = true
+   proxy.$request.post('/csms/finance/balancepayment/cardAccountDetil/', {}, {
+    baseURL: 'http://localhost:8085',
+  })
+    .then((res: any) => {
+      console.log(res)
+      if (res.data.code == 200) {
 
+      }
+    })
+    .catch((err: any) => {
+      console.log(err)
+    })
+}
 
 </script>