leromro-web/src/views/finance/settlement/index.vue

<template>
    <div>
        <ListPage :column="listPageData.tableColumn" :tableApi="listPageData.tableApi" :isSelect="listPageData.isSelect"
            :scopeBtns="listPageData.scopeBtns" :searchBtns="listPageData.searchBtns" ref="userTableRef"
             />
        <DialogForm ref="dialogFormRef" :title="title" :column="dialogData.column" @submit="submitForm" />
    </div>
</template>

<script setup>
import { ref } from 'vue';
import ListPage from '@/views/components/ListPage/index.vue';
import { settlementOrderList } from "@/api/finance/settlement.js";
import DialogForm from '@/views/components/DialogForm/index.vue';

const { proxy } = getCurrentInstance();
const { lrr_service_status } = proxy.useDict("lrr_service_status");
const router = useRouter();
const userTableRef = ref();
const dialogFormRef = ref(null);
const listPageData = reactive({
    tableColumn: [
        {
            label: '订单ID',
            prop: 'mainOrderId',
            type: 'input',
            isSearch: true,
        },
        {
            label: '申请方类型',
            prop: 'applicantType',
        },
        {
            label: '结算金额',
            prop: 'serviceTotalPrice',
        },
        {
            label: '申请时间',
            prop: 'createTime',
        },
        {
            label: '收款方式',
            prop: 'payeeMethod',
        },
        {
            label: '收款账号',
            prop: 'payeeAccount',
        },
        {
            label: '收款银行名称',
            prop: 'payeeBankName',
        },

        {
            label: '收款人姓名',
            prop: 'clientName',
        },
        {
            label: '收款人手机号',
            prop: 'clientTelephone',
        },
        {
            label: '收款申请备注',
            prop: 'payeeRemark',
        },
        {
            label: '审核时间',
            prop: 'auditorTime',
        },
        {
            label: '审核状态',
            prop: 'auditorStatus',
            type: 'dict',
            dict: lrr_service_status
        },
        {
            label: '审核结果说明',
            prop: 'auditorRemark',
        },
    ],
    searchBtns: [
        // {
        //     label: '批量结算',
        //     func: () => {
        //         const ids = userTableRef.value.ids;
        //         console.log('批量删除', ids)
        //         handleDelete(ids);
        //     },
        //     key: 'deletes',
        //     hasPermi: ['system:role:query'],
        //     type: 'danger'
        // },
        // {
        //     label: '导出',
        //     func: (parmas) => {
        //         exportFile(parmas);
        //     },
        //     key: 'deletes',
        //     hasPermi: ['system:role:query'],
        //     type: 'danger'
        // },
    ],
    tableApi: settlementOrderList,//接口地址
    isSelect: true,//是否勾选
    scopeBtns: [
        // {
        //     label: '结算',
        //     type: 'primary',
        //     hasPermi: ['manage:examine'],
        //     key: 'examine',
        //     func: (row) => {
        //         console.log(row)
        //         openDialog(row, 'examine')
        //     },
        //     show: (row) => {
        //         return row.appStatus == 1
        //     }
        // },
        // {
        //     label: '查看',
        //     type: 'primary',
        //     hasPermi: ['manage:details'],
        //     key: 'details',
        //     func: (row) => {
        //         console.log(row)
        //         // router.push("/order/order-details/" + row.mainOrderId);
        //         // openDialog(row)
        //     }
        // },
        // {
        //     label: '删除',
        //     type: 'danger',
        //     hasPermi: ['manage:delete'],
        //     key: 'delete',
        //     func: (row) => {
        //         console.log(row)
        //         handleDelete([row.id])
        //     }
        // }
    ]
})
const dialogData = reactive({
    title: '',
    column: [
        {
            label: '姓名',
            prop: 'name',
            type: 'input',

        },
        {
            label: '年龄',
            prop: 'age',
            type: 'input',

        },
        {
            label: '电话',
            prop: 'phonenumber',
            type: 'input',

        },
        {
            label: '家庭地址',
            prop: 'address',
            type: 'input',

        },
        // {
        //     label: '服务项目/类别',
        //     prop: 'businessManagementId',
        //     type: 'cascader',
        //     isSearch: true,
        //     options: options,
        //     props: { label: 'businessName', value: 'id', checkStrictly:true },

        // },
        {
            label: '身份证件',
            prop: 'idCardPicture',
            type: 'img',

        },
        {
            label: '职业证书',
            prop: 'certificationPicture',
            type: 'img',

        },
        {
            label: '技能简介',
            prop: 'skillDescribe',
            type: 'textarea',
        },
        {
            label: '审核状态',
            prop: 'appStatus',
            type: 'radio',
            rules: [
                { required: true, message: '请选择审核状态', trigger: 'blur' }
            ],
            options: [
                {
                    label: '通过',
                    value: '2'
                },
                {
                    label: '不通过',
                    value: '3'
                }
            ]
        },
    ]
})
const { title } = toRefs(dialogData);
const parentId = ref(0);

const openDialog = (row, type) => {
    console.log('row', row);
    try {
        const disabledData = {
            name: true,
            age: true,
            phonenumber: true,
            address: true,
            skillDescribe: true,
            businessManagementId: true,
        }

        if (type) {
            //审核
            title.value = '审核'

        } else {
            disabledData['appStatus'] = true;
            //查看详情
            title.value = '查看详情'
        }

        dialogFormRef.value.initForm(row, disabledData)

    } catch (error) {
        console.log('error', error);
    } finally {
        console.log('dialogFormRef.value', dialogFormRef.value);

        dialogFormRef.value.handleDialog(true);
    }
}
const handleDelete = (ids) => {
    proxy.$modal.confirm('是否确认删除角色编号为"' + ids + '"的数据项?').then(function () {
        return true
    }).then(() => {
        userTableRef.value.resetForm();
        proxy.$modal.msgSuccess("删除成功");
    }).catch(() => { });
}

const submitForm = async (parmas) => {

    try {
        console.log('submit', parmas);
        // if (title.value === '审核') {
        //     const res = await approval({
        //         volunteerInfoId: parmas.volunteerInfoId,
        //         appStatus: parmas.appStatus,
        //         rejectReason: parmas.rejectReason
        //     })
        //     if (up_res.code === 200) {
        //         proxy.$modal.msgSuccess("审核成功");
        //         return;
        //     }
        //     proxy.$modal.msgSuccess(res.msg);
        // }
    } catch (error) {
        console.log('error', error);

    } finally {
        userTableRef.value.resetForm();
        dialogFormRef.value.handleDialog(false);
    }

}

const exportFile = async(parmas) => { 
	console.log("TCL: exportFile -> parmas", parmas)
    try {
        proxy.download("core/orderSettlementApplication/export",{
            ...queryParams.value,
        }, `订单费用结算_${new Date().getTime()}.xlsx`);
    } catch (error) {
        
    }
}

</script>

<style lang='scss' scoped></style>