147 lines
5.1 KiB
TypeScript
147 lines
5.1 KiB
TypeScript
import { connect } from "umi";
|
|
import type { ConnectState } from "@/models/connect";
|
|
import ProTable, { ActionType } from "@ant-design/pro-table";
|
|
import { useRef, useState } from "react";
|
|
import { Drawer, FormInstance } from "antd";
|
|
import ContractDetailDrawer from "@/pages/contract/components/detail"
|
|
import ProjectDetail from '@/pages/BussinessProject/detail'
|
|
import { handleGetBusinessProjectList } from "../service";
|
|
import moment from 'moment'
|
|
|
|
type DetailProps = {
|
|
tableData: any
|
|
detail: any
|
|
}
|
|
const ContractDetail = ({ tableData, detail }: DetailProps) => {
|
|
const actionRef = useRef<ActionType>();
|
|
const tableFormRef = useRef<FormInstance>();
|
|
|
|
// 合同详情抽屉
|
|
const [contractDrawer, setContractDrawer] = useState<boolean>(false)
|
|
// 项目详情抽屉
|
|
const [projectDrawer, setProjectDrawer] = useState<boolean>(false)
|
|
// 点击行的数据详情
|
|
const [currentRow, setCurrentRow] = useState<any>()
|
|
|
|
|
|
const columns: any = [
|
|
{
|
|
title: '项目名称',
|
|
dataIndex: 'BUSINESSPROJECT_NAME',
|
|
width: 300,
|
|
ellipsis: true,
|
|
render: (_, record) => {
|
|
return <a style={{ display: 'inline-block', width: '270px', whiteSpace: 'nowrap', textOverflow: 'ellipsis', overflow: 'hidden' }} onClick={() => {
|
|
setCurrentRow(record)
|
|
setProjectDrawer(true)
|
|
}}>
|
|
{record?.BUSINESSPROJECT_NAME || ''}
|
|
</a>
|
|
}
|
|
},
|
|
{
|
|
title: '合同名称',
|
|
dataIndex: 'COMPACT_NAME',
|
|
width: 300,
|
|
render: (_, record) => {
|
|
return <a style={{ display: 'inline-block', width: '270px', whiteSpace: 'nowrap', textOverflow: 'ellipsis', overflow: 'hidden' }} onClick={() => {
|
|
setCurrentRow(record)
|
|
setContractDrawer(true)
|
|
}}>
|
|
{record?.COMPACT_NAME || ''}
|
|
</a>
|
|
}
|
|
},
|
|
{
|
|
title: '项目开始时间',
|
|
width: 120,
|
|
dataIndex: 'PROJECT_STARTDATE',
|
|
render: (_, record) => {
|
|
return record?.PROJECT_STARTDATE ? moment(record?.PROJECT_STARTDATE).format('YYYY-MM-DD') : ''
|
|
}
|
|
},
|
|
{
|
|
title: '项目结束时间',
|
|
width: 120,
|
|
dataIndex: 'PROJECT_ENDDATE',
|
|
render: (_, record) => {
|
|
return record?.PROJECT_ENDDATE ? moment(record?.PROJECT_ENDDATE).format('YYYY-MM-DD') : ''
|
|
}
|
|
},
|
|
// {
|
|
// title: '有效状态',
|
|
// dataIndex: 'PROJECT_VALID',
|
|
// valueType: 'select',
|
|
// valueEnum: {
|
|
// 1: '有效',
|
|
// 0: '无效',
|
|
// }
|
|
// }
|
|
]
|
|
|
|
return (
|
|
<div>
|
|
<ProTable
|
|
actionRef={actionRef}
|
|
formRef={tableFormRef}
|
|
columns={columns}
|
|
search={false}
|
|
request={async () => {
|
|
console.log('detail', detail);
|
|
let req: any = {
|
|
SearchParameter: {
|
|
SERVERPARTSHOP_ID: detail?.SERVERPARTSHOP_ID || detail?.PropertyShop.SERVERPARTSHOP_ID,
|
|
PROJECT_VALID: 1
|
|
},
|
|
PageIndex: 1,
|
|
PageSize: 999999
|
|
}
|
|
const data = await handleGetBusinessProjectList(req)
|
|
console.log('data', data);
|
|
if (data && data.length > 0) {
|
|
return { data, success: true }
|
|
}
|
|
return { data: [], success: true }
|
|
}}
|
|
// dataSource={tableData}
|
|
/>
|
|
|
|
|
|
|
|
{/* 跳转到合同详情 */}
|
|
<Drawer
|
|
width={'80%'}
|
|
visible={contractDrawer}
|
|
onClose={() => {
|
|
setCurrentRow(undefined);
|
|
setContractDrawer(false);
|
|
}}
|
|
bodyStyle={{ backgroundColor: "#f9f9f9", padding: 16 }}
|
|
closable={false}
|
|
destroyOnClose
|
|
>
|
|
<ContractDetailDrawer contractId={currentRow?.REGISTERCOMPACT_ID} currentRow={currentRow}></ContractDetailDrawer>
|
|
</Drawer>
|
|
|
|
{/* 跳转到项目详情 */}
|
|
<Drawer
|
|
width={'80%'}
|
|
visible={projectDrawer}
|
|
onClose={() => {
|
|
setCurrentRow(undefined);
|
|
setProjectDrawer(false);
|
|
}}
|
|
bodyStyle={{ backgroundColor: "#f9f9f9", padding: 16 }}
|
|
closable={false}
|
|
destroyOnClose
|
|
>
|
|
<ProjectDetail id={currentRow?.BUSINESSPROJECT_ID} businessType={currentRow?.businessType} showType={'Nooperate'}></ProjectDetail>
|
|
</Drawer>
|
|
</div>
|
|
)
|
|
}
|
|
|
|
export default connect(({ user, }: ConnectState) => ({
|
|
currentUser: user.currentUser,
|
|
}))(ContractDetail);
|