From 1d922e2cd32532fc149fac86cd63e318431d22a4 Mon Sep 17 00:00:00 2001
From: zhengyiming <540361168@qq.com>
Date: 星期五, 05 九月 2025 14:39:33 +0800
Subject: [PATCH] Merge branch 'master' of http://120.26.58.240:8888/r/flexJobAdminBClient

---
 src/views/ServiceChargeManage/ServiceChargeDetail.vue |  289 +++++++++++++++++++++++++++++++++++++++++++++++++++++++--
 1 files changed, 275 insertions(+), 14 deletions(-)

diff --git a/src/views/ServiceChargeManage/ServiceChargeDetail.vue b/src/views/ServiceChargeManage/ServiceChargeDetail.vue
index 5d19a9e..f10c238 100644
--- a/src/views/ServiceChargeManage/ServiceChargeDetail.vue
+++ b/src/views/ServiceChargeManage/ServiceChargeDetail.vue
@@ -1,46 +1,307 @@
 <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">
+                <ProFormText v-model="form.settlementAmount"> </ProFormText>
+              </ProFormItemV2>
+            </ProFormColItem>
+            <ProFormColItem :span="8">
+              <ProFormItemV2 label="瀹炲彂閲戦:" prop="actualSettlementAmount">
+                <ProFormText v-model="form.actualSettlementAmount"> </ProFormText>
+              </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: '400px',
+          }"
+        >
+        </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,
+} 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: '',
+  actualSettlementAmount: '',
+  code: '',
+  settlementOrderName: '',
+  settlementOrderTime: '',
 });
 
 const { isLoading } = useQuery({
-  queryKey: ['flexTaskServices/getFlexTaskDetail', id],
+  queryKey: ['taskServices/getSettlementTask', id],
   queryFn: async () => {
-    return await flexTaskServices.getFlexTaskDetail(
+    return await taskServices.getSettlementTask(
       { id: id },
       {
         showLoading: false,
       }
     );
   },
-  onSuccess(data) {},
+  placeholderData: () => ({} as API.GetSettlementTaskQueryResult),
+  onSuccess(data) {
+    form.name = data.name;
+    form.settlementAmount = toThousand(data.settlementAmount);
+    form.actualSettlementAmount = toThousand(data.actualSettlementAmount);
+    form.code = data.code;
+    form.settlementOrderName = setOssFileName(data.settlementOrderName);
+    form.settlementOrderTime = data.settlementOrderTime ?? '';
+  },
   enabled: !!id,
 });
 
-onMounted(() => {});
+const {
+  getDataSource: getList,
+  proTableProps,
+  paginationState,
+  extraParamState,
+  reset,
+} = useTable(
+  async ({ pageIndex, pageSize }, extraParamState) => {
+    try {
+      let params: API.APIgetSettlementTaskUsersParams = {
+        taskInfoId: id,
+        settlementOrderUrl: url,
+      };
+      let res = await taskUserServices.getSettlementTaskUsers(params);
+      if (extraParamState.keywords) {
+        res.data = res.data?.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: res.data.length,
+        },
+        data: paginateList(res.data, 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',
+  });
+}
+
+onMounted(() => {
+  getList();
+});
 </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