|
|
@@ -6,25 +6,27 @@
|
|
|
|
|
|
<el-table v-loading="loading" :data="tableData" border style="width: 100%">
|
|
|
<el-table-column prop="billNo" label="对账编号" min-width="130" align="center" />
|
|
|
- <el-table-column prop="billDate" label="对账日期" min-width="110" align="center" />
|
|
|
+ <el-table-column prop="billDate" label="对账日期" min-width="110" align="center">
|
|
|
+ <template #default="{ row }">{{ parseTime(row.billDate, '{y}-{m}-{d}') }}</template>
|
|
|
+ </el-table-column>
|
|
|
<el-table-column prop="amount" label="对账单金额" min-width="110" align="center">
|
|
|
<template #default="{ row }">¥{{ row.amount.toFixed(2) }}</template>
|
|
|
</el-table-column>
|
|
|
<el-table-column prop="billStatus" label="对账状态" min-width="90" align="center">
|
|
|
<template #default="{ row }">
|
|
|
- {{ billStatusMap[row.billStatus] || '-' }}
|
|
|
+ {{ getDictLabel(statement_status, row.billStatus) }}
|
|
|
</template>
|
|
|
</el-table-column>
|
|
|
<el-table-column prop="invoiceStatus" label="开票状态" min-width="90" align="center">
|
|
|
<template #default="{ row }">
|
|
|
- <span :style="{ color: row.invoiceStatus === '1' ? '#e60012' : '' }">
|
|
|
- {{ invoiceStatusMap[row.invoiceStatus] || '-' }}
|
|
|
+ <span :style="{ color: row.invoiceStatus === '0' ? '#e60012' : '' }">
|
|
|
+ {{ getDictLabel(invoice_issuance_status, row.invoiceStatus) }}
|
|
|
</span>
|
|
|
</template>
|
|
|
</el-table-column>
|
|
|
<el-table-column prop="payStatus" label="支付状态" min-width="90" align="center">
|
|
|
<template #default="{ row }">
|
|
|
- {{ payStatusMap[row.payStatus] || '-' }}
|
|
|
+ {{ getDictLabel(payment_status, row.payStatus) }}
|
|
|
</template>
|
|
|
</el-table-column>
|
|
|
<el-table-column label="操作" width="100" align="center">
|
|
|
@@ -42,44 +44,49 @@
|
|
|
</template>
|
|
|
|
|
|
<script setup lang="ts">
|
|
|
-import { reactive, ref, onMounted, watch } from 'vue'
|
|
|
-import { ElMessage, ElMessageBox } from 'element-plus'
|
|
|
-import { PageTitle, SearchBar, TablePagination } from '@/components'
|
|
|
-import { getStatementList, confirmStatement } from '@/api/pc/enterprise/statement'
|
|
|
-import type { StatementOrder } from '@/api/pc/enterprise/statementTypes'
|
|
|
-import { getDictByType } from '@/api/pc/system/dict'
|
|
|
+import { reactive, ref, onMounted, watch } from 'vue';
|
|
|
+import { ElMessage, ElMessageBox } from 'element-plus';
|
|
|
+import { PageTitle, SearchBar, TablePagination } from '@/components';
|
|
|
+import { getStatementList, confirmStatement } from '@/api/pc/enterprise/statement';
|
|
|
+import type { StatementOrder } from '@/api/pc/enterprise/statementTypes';
|
|
|
+import { getDictByType } from '@/api/pc/system/dict';
|
|
|
+
|
|
|
+const { proxy } = getCurrentInstance() as ComponentInternalInstance;
|
|
|
+const { invoice_issuance_status, statement_status, payment_status } = toRefs<any>(
|
|
|
+ proxy?.useDict('invoice_issuance_status', 'statement_status', 'payment_status')
|
|
|
+);
|
|
|
|
|
|
const searchForm = reactive({
|
|
|
- keyword: '', // 对账编号
|
|
|
+ keyword: '', // 对账编号
|
|
|
dateRange: [],
|
|
|
billStatus: '',
|
|
|
invoiceStatus: '',
|
|
|
payStatus: ''
|
|
|
-})
|
|
|
+});
|
|
|
|
|
|
-const billStatusOptions = ref([{ label: '全部', value: '' }])
|
|
|
-const invoiceStatusOptions = ref([{ label: '全部', value: '' }])
|
|
|
-const payStatusOptions = ref([{ label: '全部', value: '' }])
|
|
|
+const billStatusOptions = ref([{ label: '全部', value: '' }]);
|
|
|
+const invoiceStatusOptions = ref([{ label: '全部', value: '' }]);
|
|
|
+const payStatusOptions = ref([{ label: '全部', value: '' }]);
|
|
|
|
|
|
// 状态值到文本的映射
|
|
|
-const billStatusMap = ref<Record<string, string>>({})
|
|
|
-const invoiceStatusMap = ref<Record<string, string>>({})
|
|
|
-const payStatusMap = ref<Record<string, string>>({})
|
|
|
+const billStatusMap = ref<Record<string, string>>({});
|
|
|
+const invoiceStatusMap = ref<Record<string, string>>({});
|
|
|
+const payStatusMap = ref<Record<string, string>>({});
|
|
|
|
|
|
const filters = ref([
|
|
|
{ field: 'billStatus', label: '对账状态', options: billStatusOptions.value },
|
|
|
{ field: 'invoiceStatus', label: '开票状态', options: invoiceStatusOptions.value },
|
|
|
{ field: 'payStatus', label: '支付状态', options: payStatusOptions.value }
|
|
|
-])
|
|
|
+]);
|
|
|
|
|
|
-const pagination = reactive({ page: 1, pageSize: 5, total: 0 })
|
|
|
-const tableData = ref<any[]>([])
|
|
|
-const loading = ref(false)
|
|
|
+const pagination = reactive({ page: 1, pageSize: 5, total: 0 });
|
|
|
+const tableData = ref<any[]>([]);
|
|
|
+const loading = ref(false);
|
|
|
|
|
|
// 加载对账单列表
|
|
|
const loadStatementList = async () => {
|
|
|
try {
|
|
|
- loading.value = true
|
|
|
+ loading.value = true;
|
|
|
const res = await getStatementList({
|
|
|
pageNum: pagination.page,
|
|
|
pageSize: pagination.pageSize,
|
|
|
@@ -87,7 +94,7 @@ const loadStatementList = async () => {
|
|
|
statementStatus: searchForm.billStatus,
|
|
|
isInvoiceStatus: searchForm.invoiceStatus,
|
|
|
isPaymentStatus: searchForm.payStatus
|
|
|
- })
|
|
|
+ });
|
|
|
|
|
|
if (res.code === 200 && res.rows) {
|
|
|
tableData.value = res.rows.map((item: StatementOrder) => ({
|
|
|
@@ -98,101 +105,122 @@ const loadStatementList = async () => {
|
|
|
billStatus: item.statementStatus,
|
|
|
invoiceStatus: item.isInvoiceStatus,
|
|
|
payStatus: item.isPaymentStatus
|
|
|
- }))
|
|
|
- pagination.total = res.total || 0
|
|
|
+ }));
|
|
|
+ pagination.total = res.total || 0;
|
|
|
}
|
|
|
} catch (error) {
|
|
|
- console.error('加载对账单列表失败:', error)
|
|
|
- ElMessage.error('加载对账单列表失败')
|
|
|
+ console.error('加载对账单列表失败:', error);
|
|
|
+ ElMessage.error('加载对账单列表失败');
|
|
|
} finally {
|
|
|
- loading.value = false
|
|
|
+ loading.value = false;
|
|
|
}
|
|
|
-}
|
|
|
+};
|
|
|
|
|
|
// 监听分页变化
|
|
|
-watch(() => [pagination.page, pagination.pageSize], () => {
|
|
|
- loadStatementList()
|
|
|
-})
|
|
|
+watch(
|
|
|
+ () => [pagination.page, pagination.pageSize],
|
|
|
+ () => {
|
|
|
+ loadStatementList();
|
|
|
+ }
|
|
|
+);
|
|
|
|
|
|
// 监听搜索条件变化
|
|
|
-watch(() => [searchForm.keyword, searchForm.billStatus, searchForm.invoiceStatus, searchForm.payStatus], () => {
|
|
|
- pagination.page = 1
|
|
|
- loadStatementList()
|
|
|
-})
|
|
|
+watch(
|
|
|
+ () => [searchForm.keyword, searchForm.billStatus, searchForm.invoiceStatus, searchForm.payStatus],
|
|
|
+ () => {
|
|
|
+ pagination.page = 1;
|
|
|
+ loadStatementList();
|
|
|
+ }
|
|
|
+);
|
|
|
+
|
|
|
+const getDictLabel = (dictOptions: any[], value: string) => {
|
|
|
+ if (!dictOptions || !value) return value;
|
|
|
+ const dict = dictOptions.find((item) => item.value === value);
|
|
|
+ return dict ? dict.label : value;
|
|
|
+};
|
|
|
|
|
|
// 加载字典数据
|
|
|
const loadDictData = async () => {
|
|
|
try {
|
|
|
// 加载对账状态
|
|
|
- const statementRes = await getDictByType('statement_status')
|
|
|
+ const statementRes = await getDictByType('statement_status');
|
|
|
if (statementRes.data) {
|
|
|
billStatusOptions.value = [
|
|
|
{ label: '全部', value: '' },
|
|
|
- ...statementRes.data.map(item => ({
|
|
|
+ ...statementRes.data.map((item) => ({
|
|
|
label: item.dictLabel,
|
|
|
value: item.dictValue
|
|
|
}))
|
|
|
- ]
|
|
|
- filters.value[0].options = billStatusOptions.value
|
|
|
+ ];
|
|
|
+ filters.value[0].options = billStatusOptions.value;
|
|
|
|
|
|
// 构建状态值到文本的映射
|
|
|
- billStatusMap.value = statementRes.data.reduce((map, item) => {
|
|
|
- map[item.dictValue] = item.dictLabel
|
|
|
- return map
|
|
|
- }, {} as Record<string, string>)
|
|
|
+ billStatusMap.value = statementRes.data.reduce(
|
|
|
+ (map, item) => {
|
|
|
+ map[item.dictValue] = item.dictLabel;
|
|
|
+ return map;
|
|
|
+ },
|
|
|
+ {} as Record<string, string>
|
|
|
+ );
|
|
|
}
|
|
|
|
|
|
// 加载开票状态
|
|
|
- const invoiceRes = await getDictByType('invoice_issuance_status')
|
|
|
+ const invoiceRes = await getDictByType('invoice_issuance_status');
|
|
|
if (invoiceRes.data) {
|
|
|
invoiceStatusOptions.value = [
|
|
|
{ label: '全部', value: '' },
|
|
|
- ...invoiceRes.data.map(item => ({
|
|
|
+ ...invoiceRes.data.map((item) => ({
|
|
|
label: item.dictLabel,
|
|
|
value: item.dictValue
|
|
|
}))
|
|
|
- ]
|
|
|
- filters.value[1].options = invoiceStatusOptions.value
|
|
|
+ ];
|
|
|
+ filters.value[1].options = invoiceStatusOptions.value;
|
|
|
|
|
|
// 构建状态值到文本的映射
|
|
|
- invoiceStatusMap.value = invoiceRes.data.reduce((map, item) => {
|
|
|
- map[item.dictValue] = item.dictLabel
|
|
|
- return map
|
|
|
- }, {} as Record<string, string>)
|
|
|
+ invoiceStatusMap.value = invoiceRes.data.reduce(
|
|
|
+ (map, item) => {
|
|
|
+ map[item.dictValue] = item.dictLabel;
|
|
|
+ return map;
|
|
|
+ },
|
|
|
+ {} as Record<string, string>
|
|
|
+ );
|
|
|
}
|
|
|
|
|
|
// 加载支付状态
|
|
|
- const payRes = await getDictByType('payment_status')
|
|
|
+ const payRes = await getDictByType('payment_status');
|
|
|
if (payRes.data) {
|
|
|
payStatusOptions.value = [
|
|
|
{ label: '全部', value: '' },
|
|
|
- ...payRes.data.map(item => ({
|
|
|
+ ...payRes.data.map((item) => ({
|
|
|
label: item.dictLabel,
|
|
|
value: item.dictValue
|
|
|
}))
|
|
|
- ]
|
|
|
- filters.value[2].options = payStatusOptions.value
|
|
|
+ ];
|
|
|
+ filters.value[2].options = payStatusOptions.value;
|
|
|
|
|
|
// 构建状态值到文本的映射
|
|
|
- payStatusMap.value = payRes.data.reduce((map, item) => {
|
|
|
- map[item.dictValue] = item.dictLabel
|
|
|
- return map
|
|
|
- }, {} as Record<string, string>)
|
|
|
+ payStatusMap.value = payRes.data.reduce(
|
|
|
+ (map, item) => {
|
|
|
+ map[item.dictValue] = item.dictLabel;
|
|
|
+ return map;
|
|
|
+ },
|
|
|
+ {} as Record<string, string>
|
|
|
+ );
|
|
|
}
|
|
|
} catch (error) {
|
|
|
- console.error('加载字典数据失败:', error)
|
|
|
+ console.error('加载字典数据失败:', error);
|
|
|
}
|
|
|
-}
|
|
|
+};
|
|
|
|
|
|
// 页面加载时获取数据
|
|
|
onMounted(() => {
|
|
|
- loadDictData()
|
|
|
- loadStatementList()
|
|
|
-})
|
|
|
+ loadDictData();
|
|
|
+ loadStatementList();
|
|
|
+});
|
|
|
|
|
|
const handleView = (row: any) => {
|
|
|
- ElMessage.info(`查看对账单:${row.billNo}`)
|
|
|
-}
|
|
|
+ ElMessage.info(`查看对账单:${row.billNo}`);
|
|
|
+};
|
|
|
|
|
|
const handleConfirm = async (row: any) => {
|
|
|
try {
|
|
|
@@ -200,19 +228,19 @@ const handleConfirm = async (row: any) => {
|
|
|
confirmButtonText: '确定',
|
|
|
cancelButtonText: '取消',
|
|
|
type: 'warning'
|
|
|
- })
|
|
|
+ });
|
|
|
|
|
|
- await confirmStatement({ id: row.id })
|
|
|
- row.billStatus = '2'
|
|
|
- ElMessage.success('确认成功')
|
|
|
- loadStatementList()
|
|
|
+ await confirmStatement({ id: row.id });
|
|
|
+ row.billStatus = '2';
|
|
|
+ ElMessage.success('确认成功');
|
|
|
+ loadStatementList();
|
|
|
} catch (error) {
|
|
|
if (error !== 'cancel') {
|
|
|
- console.error('确认对账单失败:', error)
|
|
|
- ElMessage.error('确认对账单失败')
|
|
|
+ console.error('确认对账单失败:', error);
|
|
|
+ ElMessage.error('确认对账单失败');
|
|
|
}
|
|
|
}
|
|
|
-}
|
|
|
+};
|
|
|
</script>
|
|
|
|
|
|
<style scoped>
|