完善收付款管理

src/views/payment/bill-payment-form.vue

@@ -75,51 +75,7 @@
       </section-card>
 
       <section-card title="附件信息">
-        <el-table :data="form.attachments" border>
-          <el-table-column type="index" label="序号" width="64" align="center" />
-          <el-table-column label="文件名" min-width="220">
-            <template #default="{ row }">
-              <el-link
-                v-if="row.url || row.link"
-                type="primary"
-                :href="row.url || row.link"
-                target="_blank"
-              >
-                {{ row.originalName || row.name || '附件' }}
-              </el-link>
-              <span v-else>{{ row.originalName || row.name || '-' }}</span>
-            </template>
-          </el-table-column>
-          <el-table-column label="附件描述" min-width="240">
-            <template #default="{ row }">
-              <el-input v-model="row.description" :disabled="readonly" maxlength="200" />
-            </template>
-          </el-table-column>
-          <el-table-column label="文件大小" width="120" align="center">
-            <template #default="{ row }">{{ fileSize(row) }}</template>
-          </el-table-column>
-          <el-table-column prop="uploadUserName" label="上传人" width="130" align="center" />
-          <el-table-column prop="uploadTime" label="上传时间" width="170" align="center" />
-          <el-table-column label="操作" width="100" align="center">
-            <template #default="{ $index }">
-              <el-link v-if="!readonly" type="danger" @click="form.attachments.splice($index, 1)"
-                >删除</el-link
-              >
-            </template>
-          </el-table-column>
-        </el-table>
-        <vehicle-attachment-upload
-          v-if="!readonly"
-          v-model="form.attachments"
-          class="bill-payment-form-page__uploader"
-          :multiple="true"
-          :limit="20"
-          :max-size="500"
-          :file-types="attachmentFileTypes"
-          :show-file-list="false"
-          button-text="上传"
-          @change="normalizeAttachments"
-        />
+        <vehicle-attachment-table v-model="form.attachments" :readonly="readonly" />
       </section-card>
 
       <div class="bill-payment-form-page__actions">
@@ -163,6 +119,11 @@
           <template #default="{ row }">{{ formatMoney(row.availableBalance) }}</template>
         </el-table-column>
         <el-table-column prop="maturityDate" label="到期日期" min-width="120" />
+        <el-table-column label="操作" width="100" fixed="right" align="center">
+          <template #default="{ row }">
+            <el-link type="primary" @click.stop="selectBill(row)">选择</el-link>
+          </template>
+        </el-table-column>
       </el-table>
       <template #footer>
         <el-button @click="billDialog.visible = false">取消</el-button>
@@ -177,6 +138,7 @@ import { Search } from '@element-plus/icons-vue';
 import { mapGetters } from 'vuex';
 import * as api from '@/api/payment/billPayment';
 import * as billLedgerApi from '@/api/payment/billLedger';
+import VehicleAttachmentTable from '@/components/vehicle-attachment-table/main.vue';
 
 const emptyForm = () => ({
   id: null,
@@ -194,6 +156,7 @@ const emptyForm = () => ({
 
 export default {
   name: 'BillPaymentForm',
+  components: { VehicleAttachmentTable },
   data() {
     return {
       Search,