fix: 资金流水记录、优化订单详情模态框

apps/web-antd/src/views/business/order/product-order/components/detail.vue

@@ -5,7 +5,7 @@ import { useVbenModal } from '@vben/common-ui';
 
 import { Card, Descriptions, Image, Tag, Timeline } from 'ant-design-vue';
 
-import { expressDetailByOrderId } from '../api';
+import {expressDetailByOrderId, getOrderInfo} from '../api';
 
 defineOptions({
   name: 'DetailModal',
@@ -13,7 +13,7 @@ defineOptions({
 
 const gridApi = ref();
 // 订单信息
-const data = ref({});
+const data = ref();
 // 快递信息
 const expressDetail = ref({});
 // 订单发货方式
@@ -31,7 +31,14 @@ const [Modal, modalApi] = useVbenModal({
   onOpenChange(isOpen: boolean) {
     gridApi.value = isOpen ? modalApi.getData()?.gridApi : null;
     if (isOpen) {
-      const { values } = modalApi.getData<Record<string, any>>();
+      const { values, id } = modalApi.getData<Record<string, any>>();
+      if (id) {
+        getOrderInfo(id).then((res) => {
+          data.value = res;
+          deliveryMethod.value = data.value.delivery_method;
+          getExpressDetail();
+        });
+      }
       if (values) {
         data.value = values;
         deliveryMethod.value = data.value.delivery_method;
@@ -73,7 +80,7 @@ function getColor(status: any) {
 </script>
 <template>
   <Modal class="w-[80%]" title="订单详情">
-    <div class="flex flex-col gap-4">
+    <div v-if="data" class="flex flex-col gap-4">
       <h3 class="mt-4">订单信息</h3>
       <Descriptions
         :column="{ xxl: 2, xl: 2, lg: 2, md: 1, sm: 1, xs: 1 }"

apps/web-antd/src/views/finance/fund-water/index.vue

@@ -1,19 +1,17 @@
 <script lang="ts" setup>
-import type { VxeGridListeners } from '#/adapter/vxe-table';
 
-import { ref } from 'vue';
+import {ref} from 'vue';
 
-import { Page } from '@vben/common-ui';
+import {Page, useVbenModal} from '@vben/common-ui';
 
-import { Button, Tag } from 'ant-design-vue';
+import {Button, Tag} from 'ant-design-vue';
 
-import { useVbenVxeGrid } from '#/adapter/vxe-table';
-import { TableAction } from '#/components/table-action';
+import {useVbenVxeGrid} from '#/adapter/vxe-table';
+import {TableAction} from '#/components/table-action';
 
-import { formOptions } from './config/search';
-import { gridOptions } from './config/table';
+import {formOptions} from './config/search';
+import {gridOptions} from './config/table';
 import DetailModal from '#/views/business/order/product-order/components/detail.vue';
-import { getChargeCashPayRecordListApi } from '#/views/finance/charge-cash-pay-record/api';
 import StatisticsReconciliation from "#/views/finance/reconciliation/components/statistics.vue";
 
 const [Grid, gridApi] = useVbenVxeGrid({
@@ -22,10 +20,23 @@ const [Grid, gridApi] = useVbenVxeGrid({
 });
 
 const statistics = ref();
+
+const [OrderDetailModal, OrderDetailModalApi] = useVbenModal({
+  connectedComponent: DetailModal,
+})
+
+const infoModal = (id) => {
+  OrderDetailModalApi.setData({
+    // 表单值
+    id,
+  });
+  OrderDetailModalApi.open();
+};
 </script>
 
 <template>
   <Page auto-content-height title="订单管理">
+    <OrderDetailModal/>
     <StatisticsReconciliation
       v-if="statistics"
       :statistics="statistics"
@@ -39,7 +50,7 @@ const statistics = ref();
           <template #more>
             <Button style="margin-left: 16px">
               批量操作
-              <Icon icon="ant-design:down-outlined" />
+              <Icon icon="ant-design:down-outlined"/>
             </Button>
           </template>
         </TableAction>
@@ -61,7 +72,16 @@ const statistics = ref();
       <template #toolbar-tools></template>
       <template #action="{ row }">
         <TableAction
-          :actions="[]"
+          :actions="[
+            {
+              label: '详情',
+              type: 'link',
+              icon: 'uil:edit',
+              size: 'small',
+              // auth: ['order', 'sys:role:detail'],
+              onClick: infoModal.bind(null, row.order_id),
+            },
+            ]"
         />
       </template>
     </Grid>