fix 佣金统计弹窗详情不请求接口的问题

src/views/finance/commission/commission-detail.vue

@@ -5,6 +5,7 @@
         v-model="visible"
         title="佣金获取详情"
         @open="handleOpen"
+        body-style="padding: 0px 10px;"
     >
         <common-table
             ref="pageRef"
@@ -19,59 +20,27 @@
 </template>
 
 <script setup>
-import { ref, reactive, nextTick, watch } from 'vue';
+import { ref, reactive, nextTick } from 'vue';
 import CommonTable from '@/components/CommonPage/CommonTable.vue';
 
-const props = defineProps({
-    modelValue: {
-        type: Boolean,
-        default: false
-    },
-    rowData: {
-        type: Object,
-        default: null
-    }
-});
-
-const emit = defineEmits(['update:modelValue']);
-
-const pageRef = ref(null);
-
 /** 弹窗是否打开 */
-const visible = ref(false);
+const visible = defineModel({ type: Boolean });
 
-// 监听modelValue变化
-watch(() => props.modelValue, (newVal) => {
-    visible.value = newVal;
-});
-
-// 监听visible变化
-watch(visible, (newVal) => {
-    emit('update:modelValue', newVal);
-});
+const pageRef = ref(null);
 
 /** 关闭弹窗 */
 const handleCancel = () => {
     visible.value = false;
 };
 
-/** 弹窗打开事件 */
-const handleOpen = () => {
-    if (props.rowData && props.rowData.beInviteUserId) {
-        pageConfig.params.inviteUserId = props.rowData.beInviteUserId;
-        nextTick(() => {
-            pageRef.value?.reload();
-        });
-    }
-};
 
 /** 表格列配置 */
 const columns = ref([
-    { label: "UID", prop: "beInviteUserId", align: "center", width: 120 },
-    { label: "昵称", prop: "nickName", align: "center", minWidth: 120 },
-    { label: "联系方式", prop: "mobile", align: "center", minWidth: 140 },
+    { label: "UID", prop: "beInviteUserId", align: "center" },
+    { label: "昵称", prop: "nickName", align: "center" },
+    { label: "联系方式", prop: "mobile", align: "center" },
     { label: "邀请时间", prop: "createTime", align: "center", width: 180 },
-    { label: "获得佣金", prop: "settlementMoney", align: "center", width: 120 },
+    { label: "获得佣金", prop: "settlementMoney", align: "center" },
 ]);
 
 const pageConfig = reactive({
@@ -82,4 +51,22 @@ const pageConfig = reactive({
         inviteUserId: null
     }
 });
+
+// 打开弹窗并请求数据
+function handleOpen(row) {
+    console.log(row);
+    if (row && row.inviteUserId) {
+        pageConfig.params.inviteUserId = row.inviteUserId;
+        console.log(pageConfig.params);
+
+        visible.value = true;
+        nextTick(() => {
+            pageRef.value?.reload();
+        });
+    }
+}
+
+defineExpose({
+    handleOpen
+});
 </script>

src/views/finance/commission/index.vue

@@ -1,6 +1,6 @@
 <template>
     <ele-page flex-table>
-        <page-search @search="reload" :status="useStatus"></page-search>
+        <page-search @search="reload" ></page-search>
 
         <common-table ref="pageRef" :pageConfig="pageConfig" :columns="columns">
             <template #toolbar>
@@ -49,10 +49,10 @@
                     v-model="useStatus"
                 >
                     <el-radio-button label="全部" value="" />
-                    <el-radio-button label="待结算" value="1" />
-                    <el-radio-button label="已结算" value="2" />
-                    <el-radio-button label="已到账" value="3" />
-                    <el-radio-button label="已作废" value="4" />
+                    <el-radio-button label="待结算" :value="1" />
+                    <el-radio-button label="已结算" :value="2" />
+                    <el-radio-button label="已到账" :value="3" />
+                    <el-radio-button label="已作废" :value="4" />
                 </el-radio-group>
             </template>
 
@@ -67,7 +67,7 @@
             </template>
         </common-table>
 
-        <commissionDetail v-model="commissionDetailVisible" :rowData="currentRowData" />
+        <commissionDetail ref="commissionDetailRef" />
     </ele-page>
 </template>
 
@@ -101,11 +101,9 @@ async function fetchStatistics() {
     }
 }
 
-const commissionDetailVisible = ref(false);
-const currentRowData = ref(null);
+const commissionDetailRef = ref(null);
 const handleOrderId = (row) => {
-    currentRowData.value = row;
-    commissionDetailVisible.value = true;
+    commissionDetailRef.value?.handleOpen(row);
 };
 
 onMounted(() => {
@@ -159,6 +157,9 @@ const pageConfig = reactive({
 
 //刷新表格
 function reload(where) {
+    if (where.status) {
+        useStatus.value = where.status;
+    }
     pageRef.value?.reload(where);
 }
 </script>