<template>
    <PageWrapper dense>
        <!--引用表格-->
        <BasicTable @register="registerTable">
            <template #action="{ record }">
                <!-- <TableAction :actions="getTableAction(record)" /> -->
                <TableAction :actions="getTableAction(record)" />
            </template>
            <template #tableTitle>
                <el-button type="primary" @click="handleAddcontract" v-if="isShowByRoles('projectContact,owner')">
                    新增项目合同</el-button>
            </template>
        </BasicTable>
        <ProjectinfoComponent @register="registerProjectinfo" @openChildModal="openModalProjectr">
            <template #default>
                <BasicModal @register="registerSubmitprojectContract" title="项目合同信息详情" width="1200px"
                    :showOkBtn="false">
                    <projectContract :projectid="projectid" :isModify="isModify" @close="closeModel" />
                </BasicModal>
            </template>
        </ProjectinfoComponent>
        <!-- <projectContract @register="registerSubmitprojectContract" @close="closeModel" /> -->
        <BasicModal @register="registerSubmitprojectContract" title="项目合同信息详情" width="1200px" :showOkBtn="false">
            <projectContract :projectid="projectid" :isModify="isModify" @close="closeModel" />
        </BasicModal>
        <DetailTable @register="registerDetailTable" @close="closeModel" />

    </PageWrapper>
</template>

<script lang="ts" name="system-user" setup>
//ts语法
import { ref } from "vue"
import { ActionItem, BasicTable, TableAction, useTable } from '@/components/Table';
import { useModal } from '@/components/Modal';
import { PageWrapper } from '@/components/Page';
import { BasicModal } from '@/components/Modal';

import projectContract from "./projectContract.vue"
import DetailTable from '@/views/projectLib/projectContract/DetailTable.vue'
import { huzhouContractinfoPageList, deleteContractinfo, getContractProjectPageList } from './projectContract.api';
import { isShowByRoles } from '@/views/projectLib/projectInfo/projectInfo.api';
import { searchFormSchema } from '../projectInfo/projectInfo.data';
import { contractTablecolumns } from './projectContract.data';
import ProjectinfoComponent from '@/views/ProcessApprovalSubPage/component/ProjectinfoComponent.vue'

const [registerSubmitprojectContract, { openModal: openModalprojectContract, closeModal: closeModalprojectContract }] = useModal();
const [registerProjectinfo, { openModal: openModalProjectinfo, closeModal: closeModalProjectinfo }] = useModal();
const [registerDetailTable, { openModal: openModalDetailTable }] = useModal();

let projectid = ref()
let isModify = ref(false)
const [registerTable, { reload }] = useTable({
    title: '合同信息',
    api: huzhouContractinfoPageList,
    columns: contractTablecolumns,
    useSearchForm: true,
    rowKey: "id",
    showIndexColumn: false,
    actionColumn: {
        width: 140,
        title: '操作',
        dataIndex: 'action',
        slots: { customRender: 'action' },
    },
    //表单查询项设置
    formConfig: {
        schemas: searchFormSchema,

    },
});


function getTableAction(record): ActionItem[] {
    return [
        {
            label: '详情',
            ifShow: () => {
                return record.children == null || record.projectId != null
            },
            onClick: handledetail.bind(null, record),
        },
        {
            label: '修改',
            ifShow: () => {
                return isShowByRoles("projectContact") && (record.children == null || record.projectId != null) && record.contractStatus == "2"
            },
            onClick: handleModify.bind(null, record),
        },

        // {
        //     label: '删除',
        //     ifShow: () => {
        //         return isShowByRoles("projectContact") && (record.children == null || record.projectId != null)
        //     },
        //     popConfirm: {
        //         title: '确定删除吗?',
        //         confirm: handleDelete.bind(null, record),
        //     },
        // }

    ];
}
function handledetail(record) {
    openModalDetailTable(true, { projectid: record.id })
}
/**
 * 修改
 */
function handleModify(record) {
    console.log(record, projectid.value)
    projectid.value = record.id
    isModify.value = true
    openModalprojectContract()

}
/**
 * 新增
 */
function openModalProjectr(value) {
    console.log("proidproid", value)
    projectid.value = value.id
    isModify.value = false
    openModalprojectContract()
}
async function handleDelete(record) {
    await deleteContractinfo({ projectId: record.id })
    reload()
}

function closeModel() {
    closeModalprojectContract()
    closeModalProjectinfo()
    reload()
}
function handleAddcontract(record) {
    openModalProjectinfo(true, { title: "新增项目合同", api: getContractProjectPageList })
}
</script>

<style scoped></style>