From 8ab333f837fce5710568cf2fbfa19e00522a77a9 Mon Sep 17 00:00:00 2001
From: sen <sen@qq.com>
Date: 星期四, 25 十二月 2025 12:22:45 +0800
Subject: [PATCH] 修改图标
---
ui/admin-ui3/src/components/DetailModal/index.vue | 165 ++++++++++++++++++++++++++++++++++--------------------
1 files changed, 104 insertions(+), 61 deletions(-)
diff --git a/ui/admin-ui3/src/components/DetailModal/index.vue b/ui/admin-ui3/src/components/DetailModal/index.vue
index bdd8a9e..9ac912f 100644
--- a/ui/admin-ui3/src/components/DetailModal/index.vue
+++ b/ui/admin-ui3/src/components/DetailModal/index.vue
@@ -1,90 +1,125 @@
<template>
- <el-dialog
- v-model="visible"
- title="璐圭敤璇︽儏"
- width="1000px"
- destroy-on-close
- @closed="handleClosed"
- >
+ <el-dialog v-model="visible" :title="type === 'receivable' ? '搴旀敹璐圭敤璇︽儏' : '搴斾粯璐圭敤璇︽儏'" width="1000px" destroy-on-close
+ @closed="handleClosed">
<div class="modal-content">
<section class="detail-section">
- <h3 class="section-title">搴旀敹璐圭敤鏄庣粏</h3>
+ <h3 class="section-title">{{ type === 'receivable' ? '搴旀敹璐圭敤鏄庣粏' : '搴斾粯璐圭敤鏄庣粏' }}</h3>
+
<el-descriptions :column="3" border class="margin-top">
<el-descriptions-item label="绯荤粺缂栧彿">{{ detailData.systemNo }}</el-descriptions-item>
<el-descriptions-item label="鍏宠仈璐﹀崟缂栧彿">{{ detailData.relatedBillNo }}</el-descriptions-item>
- <el-descriptions-item label="鏉ユ簮绯荤粺">{{ detailData.sourceSystem }}</el-descriptions-item>
-
- <el-descriptions-item label="涓氬姟鏉垮潡">{{ detailData.businessSector }}</el-descriptions-item>
- <el-descriptions-item label="鍗曟嵁绫诲瀷">{{ detailData.documentType }}</el-descriptions-item>
+ <el-descriptions-item label="鏉ユ簮绯荤粺">{{ dictFormat(sys_system, detailData.sourceSystem)
+ }}</el-descriptions-item>
+
+ <el-descriptions-item label="涓氬姟鏉垮潡">{{ dictFormat(sys_business, detailData.businessSector)
+ }}</el-descriptions-item>
+ <el-descriptions-item label="鍗曟嵁绫诲瀷">{{ dictFormat(sys_receipts, detailData.documentType)
+ }}</el-descriptions-item>
<el-descriptions-item label="鍗曟嵁缂栧彿">{{ detailData.documentNo }}</el-descriptions-item>
-
- <el-descriptions-item label="瀹㈡埛鍚嶇О">{{ detailData.customerName }}</el-descriptions-item>
+
+ <el-descriptions-item :label="type === 'receivable' ? '瀹㈡埛鍚嶇О' : '渚涘簲鍟嗗悕绉�'">
+ {{ type === 'receivable' ? detailData.customerName : detailData.supplierName }}
+ </el-descriptions-item>
+
<el-descriptions-item label="椤圭洰鍚嶇О">{{ detailData.projectName }}</el-descriptions-item>
<el-descriptions-item label="涓氬姟鍙戠敓鏃堕棿">{{ detailData.businessTime }}</el-descriptions-item>
-
- <el-descriptions-item label="搴旀敹纭鏃堕棿">{{ detailData.receivableConfirmTime }}</el-descriptions-item>
- <el-descriptions-item label="搴旀敹閲戦" :span="2">
- <span class="amount-text">{{ detailData.receivableAmount }}</span>
+
+ <el-descriptions-item :label="type === 'receivable' ? '搴旀敹纭鏃堕棿' : '搴斾粯纭鏃堕棿'">
+ {{ type === 'receivable' ? detailData.receivableConfirmTime : detailData.payableConfirmTime }}
+ </el-descriptions-item>
+
+ <!-- <el-descriptions-item :label="type === 'receivable' ? '搴旀敹閲戦' : '搴斾粯閲戦'" :span="2">
+ <span class="amount-text">{{ detailData.receivableAmount || detailData.payableAmount }}</span>
+ </el-descriptions-item> -->
+
+ <el-descriptions-item :label="type === 'receivable' ? '搴旀敹閲戦' : '搴斾粯閲戦'" :span="2">
+ <span>{{ type === 'receivable' ? detailData.receivableAmountStr : detailData.payableAmountStr}}</span>
</el-descriptions-item>
</el-descriptions>
</section>
<section class="table-section">
- <h3 class="section-title" style="margin-top: 10px;" >璐圭敤鏄庣粏</h3>
- <avue-crud
- :option="tableOption"
- :data="detailData.feeList || []"
- >
- </avue-crud>
+ <h3 class="section-title" style="margin-top: 20px;">璐圭敤鏄庣粏</h3>
+ <el-table :data="detailData.feeList || []" border stripe style="width: 100%"
+ :header-cell-style="{ backgroundColor: '#f5f7fa', color: '#606266' }">
+ <el-table-column label="璐圭敤绫诲瀷" align="center">
+ <template #default="scope">
+ {{ dictFormat(fee_type, scope.row.feeType) }}
+ </template>
+ </el-table-column>
+
+ <el-table-column label="璐圭敤鍚嶇О" prop="feeName" align="center" />
+
+ <el-table-column label="璁¤垂鍗曚綅" align="center">
+ <template #default="scope">
+ {{ dictFormat(sys_unit, scope.row.billingUnit) }}
+ </template>
+ </el-table-column>
+
+ <el-table-column label="璁¤垂鍗曚环" prop="unitPrice" align="center" />
+ <el-table-column label="璁¤垂閲戦" prop="billingAmount" align="center" />
+
+ <el-table-column :label="type === 'receivable' ? '瀹炴敹閲戦' : '瀹炰粯閲戦'" prop="actualAmount" align="center" />
+
+ <el-table-column label="甯佸埗" align="center" prop="currency">
+ <template #default="scope">
+ {{ dictFormat(sys_currency, scope.row.currency) }}
+ </template>
+ </el-table-column>
+
+ <el-table-column label="璐圭敤鐧昏鏃堕棿" prop="createTime" width="160" align="center" />
+ </el-table>
</section>
</div>
<template #footer>
- <span class="dialog-footer">
- <el-button @click="visible = false">鍏� 闂�</el-button>
- </span>
+ <el-button @click="visible = false">鍏� 闂�</el-button>
</template>
</el-dialog>
</template>
<script setup lang="ts">
-import { ref, reactive } from 'vue';
+import { ref } from 'vue';
+import useCurrentInstance from "@/utils/useCurrentInstance";
+
+const { proxy } = useCurrentInstance();
+
+const {
+ sys_system,
+ sys_business,
+ sys_receipts,
+ sys_currency,
+ fee_type,
+ sys_unit
+} = proxy.useDict('sys_system', 'sys_business', 'sys_receipts', 'sys_currency', 'fee_type', 'sys_unit');
+
+const dictFormat = (dict: any, value: any) => {
+ return proxy.selectDictLabel(dict, value);
+};
const visible = ref(false);
const detailData = ref<any>({});
+const type = ref<'receivable' | 'payable'>('receivable'); // 鏍囪鏄簲鏀惰繕鏄簲浠�
-// 琛ㄦ牸閰嶇疆
-const tableOption = {
- tip: false,
- header: false, // 闅愯棌澶撮儴鎸夐挳
- addBtn: false,
- editBtn: false,
- delBtn: false,
- menu: false, // 闅愯棌鎿嶄綔鏍�
- column: [
- { label: '璐圭敤绫诲瀷', prop: 'feeType' },
- { label: '璐圭敤鍚嶇О', prop: 'feeName' },
- { label: '璁¤垂鍗曚綅', prop: 'unit' },
- { label: '璁¤垂鍗曚环', prop: 'price' },
- { label: '璁¤垂閲戦', prop: 'totalAmount' },
- { label: '瀹炴敹閲戦', prop: 'actualAmount' },
- { label: '甯佸埗', prop: 'currency' },
- { label: '璐圭敤鐧昏鏃堕棿', prop: 'createTime', width: 160 },
- ]
-};
-
-// 鏆撮湶缁欑埗缁勪欢鐨勬柟娉�
-const open = (data: any) => {
+/**
+ * 鏆撮湶缁欑埗缁勪欢鐨勬柟娉�
+ * @param data 鏁版嵁瀵硅薄
+ * @param mode 妯″紡锛�'receivable' (搴旀敹) 鎴� 'payable' (搴斾粯)
+ */
+const open = (data: any, mode: 'receivable' | 'payable' = 'receivable') => {
+ type.value = mode;
detailData.value = data || {};
+
+ // 缁熶竴鏄庣粏鍒楄〃鐨勫彇鍊奸�昏緫锛堟牴鎹悗绔瓧娈靛悕璋冩暣锛�
+ if (data) {
+ detailData.value.feeList = data.receivableFeeDetailList || data.payableFeeDetailList || [];
+ }
+
visible.value = true;
};
const handleClosed = () => {
detailData.value = {};
-};
-
-const handleConfirm = () => {
- visible.value = false;
};
defineExpose({ open });
@@ -94,26 +129,34 @@
.modal-content {
padding: 10px;
}
+
.section-title {
font-size: 16px;
font-weight: bold;
- margin: 20px 0 10px 0;
+ margin: 10px 0;
color: #333;
+ padding-left: 10px;
+ border-left: 4px solid #409eff;
}
-.section-title:first-child {
- margin-top: 0;
-}
+
.amount-text {
color: #f56c6c;
font-weight: bold;
}
+
:deep(.el-descriptions__label) {
width: 120px;
background-color: #f5f7fa;
}
+
::v-deep .el-descriptions__body .el-descriptions__table.is-bordered .el-descriptions__cell {
- border: var(--el-descriptions-table-border);
- padding: 8px 11px;
- width: 100px;
+ border: var(--el-descriptions-table-border);
+ padding: 8px 11px;
+}
+
+::v-deep .el-descriptions__body .el-descriptions__table.is-bordered .el-descriptions__cell {
+ border: var(--el-descriptions-table-border);
+ padding: 8px 11px;
+ width: 200px;
}
</style>
\ No newline at end of file
--
Gitblit v1.8.0