From 289f3b2ae5b39b63f1c57daa6c771c0214161363 Mon Sep 17 00:00:00 2001 From: zhengyiming <540361168@qq.com> Date: 星期二, 09 九月 2025 15:51:13 +0800 Subject: [PATCH] fix: bug --- src/views/ServiceChargeManage/ServiceChargeDetail.vue | 343 ++++++++++++++++++++++++++++++++++++++++++++++++++++++-- 1 files changed, 328 insertions(+), 15 deletions(-) diff --git a/src/views/ServiceChargeManage/ServiceChargeDetail.vue b/src/views/ServiceChargeManage/ServiceChargeDetail.vue index 5d19a9e..f608798 100644 --- a/src/views/ServiceChargeManage/ServiceChargeDetail.vue +++ b/src/views/ServiceChargeManage/ServiceChargeDetail.vue @@ -1,46 +1,359 @@ <template> <LoadingLayout :loading="isLoading"> - <AppScrollContainer> - <ChunkCell title="缁撶畻鍗曡鎯�"> </ChunkCell> - <ChunkCell title="缁撶畻娴佺▼"> </ChunkCell> - <ChunkCell title="缁撶畻鍚嶅崟"> </ChunkCell> - </AppScrollContainer> + <AppContainer> + <ChunkCell title="缁撶畻鍗曡鎯�"> + <ProForm :model="form" ref="formRef" label-width="120px" :is-read="true"> + <ProFormCol> + <ProFormColItem :span="8"> + <ProFormItemV2 label="鎵�灞炰换鍔�:" prop="name"> + <ProFormText v-model="form.name"> </ProFormText> + </ProFormItemV2> + </ProFormColItem> + <ProFormColItem :span="8"> + <ProFormItemV2 label="浠诲姟缂栧彿:" prop="code"> + <ProFormText v-model="form.code"> </ProFormText> + </ProFormItemV2> + </ProFormColItem> + </ProFormCol> + <ProFormCol> + <ProFormColItem :span="8"> + <ProFormItemV2 label="缁撶畻鍗曞悕绉�:" prop="settlementOrderName"> + <ProFormText v-model="form.settlementOrderName"> </ProFormText> + </ProFormItemV2> + </ProFormColItem> + <ProFormColItem :span="8"> + <ProFormItemV2 label="涓婁紶鏃堕棿:" prop="settlementOrderTime"> + <ProFormDatePicker + v-model="form.settlementOrderTime" + type="date" + format="YYYY-MM-DD HH:mm" + ></ProFormDatePicker> + </ProFormItemV2> + </ProFormColItem> + </ProFormCol> + <ProFormCol> + <ProFormColItem :span="8"> + <ProFormItemV2 label="缁撶畻閲戦:" prop="settlementAmount"> + <ProFormInputNumber v-model="form.settlementAmount" format-value="money"> + </ProFormInputNumber> + </ProFormItemV2> + </ProFormColItem> + <ProFormColItem :span="8"> + <ProFormItemV2 label="瀹炲彂閲戦:" prop="actualSettlementAmount"> + <ProFormInputNumber v-model="form.actualSettlementAmount" format-value="money"> + </ProFormInputNumber> + </ProFormItemV2> + </ProFormColItem> + </ProFormCol> + </ProForm> + </ChunkCell> + <!-- <ChunkCell title="缁撶畻娴佺▼"> + <div class="step-wrapper"> + <el-steps :active="1" align-center finish-status="process"> + <el-step title="缁撶畻鍗曚笂浼�" :icon="Edit"> + <template #description> + <div>鍒涘缓浜�:{{ form.name }}</div> + <div>鏃堕棿:{{ form.name }}</div> + <TextOverTooltip>澶囨敞:{{ form.name }}</TextOverTooltip> + </template> + </el-step> + <el-step title="缁撶畻浠樻" :icon="Upload"> + <template #description> + <div>鍒涘缓浜�:{{ form.name }}</div> + <div>鏃堕棿:{{ form.name }}</div> + <TextOverTooltip + >澶囨敞:{{ 'form.nameform.nameform.eform.nameform.nameform.name' }}</TextOverTooltip + > + </template> + </el-step> + </el-steps> + </div> + </ChunkCell> --> + <ChunkCell title="缁撶畻鍚嶅崟" style="flex: 1"> + <ProTableQueryFilterBar @on-reset="reset"> + <template #query> + <QueryFilterItem> + <SearchInput + v-model="extraParamState.keywords" + style="width: 300px" + placeholder="濮撳悕/鎵嬫満/韬唤璇佸彿/瀹㈡埛" + @on-click-search="getList" + > + </SearchInput> + </QueryFilterItem> + </template> + </ProTableQueryFilterBar> + <ProTableV2 + v-bind="proTableProps" + :columns="SettlementListColumns" + :show-operation-column="false" + :auto-height="false" + ref="proTable" + :tableProps="{ + maxHeight: '250px', + }" + > + </ProTableV2> + <div class="chuck-add-or-edit-actions"> + <el-button class="chuck-add-or-edit-actions" @click="handleBack">鍙栨秷</el-button> + <el-button + v-if="!isDetail" + class="chuck-add-or-edit-actions" + type="primary" + @click="handleSubmit" + >纭</el-button + > + </div> + </ChunkCell> + </AppContainer> + <EditAccountInfoDialog v-bind="dialogProps"></EditAccountInfoDialog> </LoadingLayout> </template> <script setup lang="ts"> -import { LoadingLayout, AppScrollContainer, ChunkCell } from '@bole-core/components'; -import {} from '@/constants'; -import * as flexTaskServices from '@/services/api/FlexTask'; +import { + LoadingLayout, + AppContainer, + AppScrollContainer, + ChunkCell, + ProForm, + ProFormItemV2, + ProFormText, + ProFormCol, + ProFormColItem, + ProFormDatePicker, + ProFormInputNumber, + useTable, + ProTableV2, + defineOperationBtns, + SearchInput, + QueryFilterItem, + ProTableQueryFilterBar, + useFormDialog, + XLSXUtils, +} from '@bole-core/components'; +import { SettlementListColumns } from './constants'; import { useQuery } from '@tanstack/vue-query'; +import * as taskServices from '@/services/api/task'; +import * as taskUserServices from '@/services/api/taskUser'; +import EditAccountInfoDialog from './components/EditAccountInfoDialog.vue'; +import { Message } from '@bole-core/core'; +import { paginateList, setOssFileName, toThousand } from '@/utils'; defineOptions({ name: 'ServiceChargeDetail', }); +const { closeViewPush } = useRouteView(); +const eventContext = useGlobalEventContext(); +const operationBtns = defineOperationBtns([ + { + data: { + enCode: 'editBtn', + name: '缂栬緫', + }, + emits: { + onClick: (role) => openDialog(role), + }, + }, +]); + const route = useRoute(); const id = (route.params.id as string) ?? ''; +const url = (route.query.url as string) ?? ''; -const state = reactive({ - loading: true, +const isDetail = computed(() => !url); + +const form = reactive({ + name: '', + settlementAmount: 0, + actualSettlementAmount: 0, + code: '', + settlementOrderName: '', + settlementOrderTime: '', + settlementTaskUsers: [] as API.GetSettlementTaskUsersQueryResultItem[], }); +const BaseState = { + loading: true, +}; + +const state = reactive({ ...BaseState }); + +// onMounted(async () => { +// await getList(); +// state.loading = false; +// }); + +// const { isLoading } = useQuery({ +// queryKey: ['taskServices/getSettlementTask', id], +// queryFn: async () => { +// return await taskServices.getSettlementTask( +// { id: id }, +// { +// showLoading: false, +// } +// ); +// }, +// placeholderData: () => ({} as API.GetSettlementTaskQueryResult), +// onSuccess(data) { +// form.name = data.name; +// form.settlementAmount = data.settlementAmount ?? 0; +// form.actualSettlementAmount = data.actualSettlementAmount ?? 0; +// form.code = data.code; +// form.settlementOrderName = setOssFileName(data.settlementOrderName); +// form.settlementOrderTime = data.settlementOrderTime ?? ''; +// }, +// enabled: !!id, +// }); const { isLoading } = useQuery({ - queryKey: ['flexTaskServices/getFlexTaskDetail', id], + queryKey: ['taskUserServices/getSettlementTaskUsers', id, url], queryFn: async () => { - return await flexTaskServices.getFlexTaskDetail( - { id: id }, + return await taskUserServices.getSettlementTaskUsers( + { taskInfoId: id, settlementOrderUrl: url }, { showLoading: false, } ); }, - onSuccess(data) {}, + placeholderData: () => ({} as API.GetSettlementTaskUsersQueryResult), + onSuccess(res) { + form.settlementTaskUsers = res?.data ?? []; + if (res?.detail) { + form.name = res?.detail?.name; + form.settlementAmount = res?.detail?.settlementAmount ?? 0; + form.actualSettlementAmount = res?.detail?.actualSettlementAmount ?? 0; + form.code = res?.detail?.code; + form.settlementOrderName = setOssFileName(res?.detail?.settlementOrderName); + form.settlementOrderTime = res?.detail?.settlementOrderTime ?? ''; + } + if (res?.errors?.length > 0) { + Message.tipMessage('瀛樺湪瀵煎叆閿欒鐨勬暟鎹紝鏄惁瀵煎嚭锛�').then(() => { + XLSXUtils.exportToXLSX({ + workbookDataList: res.errors, + fileName: '缁撶畻瀵煎叆-閿欒鏁版嵁', + workbookHeaderMap: { + name: '濮撳悕', + identity: '韬唤璇佸彿', + taskName: '浠诲姟鍚嶇О', + settlementAmount: '缁撶畻閲戦', + actualSettlementAmount: '瀹炲彂閲戦', + receiveAccount: '鏀舵璐︽埛', + bank: '鎵�灞為摱琛�', + bankBranch: '寮�鎴锋敮琛屽悕绉�', + errorMessage: '閿欒淇℃伅', + }, + }); + }); + } + getList(); + }, enabled: !!id, }); -onMounted(() => {}); +const { + getDataSource: getList, + proTableProps, + paginationState, + extraParamState, + reset, +} = useTable( + async ({ pageIndex, pageSize }, extraParamState) => { + try { + let list = [...form.settlementTaskUsers]; + if (extraParamState.keywords) { + list = list?.filter((item) => { + return ( + item.name.includes(extraParamState.keywords) || + item.contactPhoneNumber.includes(extraParamState.keywords) || + item.identity.includes(extraParamState.keywords) + ); + }); + } + + return Promise.resolve({ + pageModel: { + rows: pageSize, + page: pageIndex, + totalCount: list.length, + }, + data: paginateList(list, pageIndex, pageSize), + }); + } catch (error) { + console.log('error: ', error); + } + }, + { + defaultExtraParams: { + keywords: '', + orderInput: [{ property: 'id', order: EnumPagedListOrder.Desc }], + }, + queryKey: ['taskUserServices/getSettlementTaskUsers'], + columnsRenderProps: { + settlementTime: { type: 'date' }, + settlementAmount: { type: 'money' }, + actualSettlementAmount: { type: 'money' }, + }, + } +); + +const { dialogProps, handleAdd, handleEdit, editForm } = useFormDialog({ + onConfirm: handleAddOrEdit, + defaultFormParams: { + id: '', + name: '', + }, +}); + +function openDialog(row?) { + if (row) { + handleEdit({ + id: row?.id, + name: row?.name, + }); + } +} + +async function handleAddOrEdit() {} + +async function handleSubmit() { + try { + let params: API.SureTaskSettlementOrderCommand = { + taskInfoId: id, + settlementOrderUrl: url, + taskInfoUsers: + proTableProps.value.tableData?.length > 0 + ? proTableProps.value.tableData.map( + (x) => ({ ...x } as API.SureTaskSettlementOrderCommandUser) + ) + : [], + }; + let res = await taskServices.sureTaskSettlementOrder(params); + if (res) { + Message.successMessage('鎿嶄綔鎴愬姛'); + eventContext.emit('sureTaskSettlementOrder'); + handleBack(); + } + } catch (error) {} +} + +function handleBack() { + closeViewPush(route, { + name: 'ServiceChargeManageList', + }); +} </script> <style lang="scss" scoped> @use '@/style/common.scss' as *; + +.step-wrapper { + margin: 0 auto; + padding: 24px 0; +} +</style> +<style lang="scss"> +.text-over-tooltip-content { + max-width: 600px; + word-break: break-all; +} </style> -- Gitblit v1.9.1