/* 故障报修
* @Author: Li Hanlin
* @Date: 2022-12-02 11:41:03
* @Last Modified by: Li Hanlin
* @Last Modified time: 2023-02-10 17:58:21
*/
import * as React from 'react';
import { useState, useMemo, useRef } from 'react';
import DrawerPro from '@/components/DrawerPro';
import AutoTable from '@/components/AutoTable';
import FormTable from "@/components/AutoTable/mtable";
import PremButton from '@/components/PremButton';
import getcolumns from './columns';
import { useRequest } from 'ahooks';
import { doFetch } from '@/utils/doFetch';
import Addform from '@/components/Addform';
import Detail from '@/components/RepaireDetail/Detail';
import dayjs from 'dayjs';
import Details from "./Details";
import Devices from "./Devices";
const formCommonColumns = [
{
title: '是否可操作',
dataIndex: 'isFinish',
key: 'isFinish',
editable: false,
hideInTable: true
},
{
title: '设备编号',
dataIndex: 'equipmentNo',
key: 'equipmentNo',
colProps: {
sm: 3,
},
editable: false
},
{
title: '设备名称',
dataIndex: 'equipmentName',
key: 'equipmentName',
colProps: {
sm: 3,
},
editable: false
},
{
title: '设备型号',
dataIndex: 'equipmentModelName',
key: 'equipmentModelName',
colProps: {
sm: 3,
},
editable: false
},
{
title: '每期单价（元）',
dataIndex: 'unitPrice',
key: 'unitPrice',
colProps: {
sm: 2,
},
editable: false
},
{
title: '押金（元）',
dataIndex: 'deposit',
key: 'deposit',
editable: false,
colProps: {
sm: 2,
},
},
{
title: '结束租赁时间',
dataIndex: 'endLeaseDate',
key: 'endLeaseDate',
editable: false,
colProps: {
sm: 3,
},
},
{
title: '采集状态',
dataIndex: 'collectStatusName',
key: 'collectStatusName',
editable: false,
colProps: {
sm: 2,
},
}
];
function Contract(props) {
let actionRef = useRef(),
formRef = useRef();
const [drawer, setdrawer] = useState({
open: false,
}),
[activeTabKey, setactiveTabKey] = useState('1'),
[amount, camount] = useState(0),
[intelligenceList, cil] = useState([]);
const { run, loading, runAsync } = useRequest(doFetch, {
manual: true,
onSuccess: (res, params) => {
if (res?.code == '0000') {
actionRef?.current?.reload();
setdrawer((s) => ({
...s,
open: false,
}));
}
},
});
const rightExtra = (text, row, _, action) => {
//1未开始 2进行中 3已到期 4待押金退还
let ifs = row.status == 1,
ifsa = row.status == 2,
ifsb = row.status == 3,
ifsc = row.status == 4;
return [
ifs && <PremButton
key='start'
btn={{
size: 'small',
onClick: async () => {
let res = await doFetch({ url: '/lease/umContractEquipment/queryBeforeStart', params: { contractId: row.id } });
cil(res?.data?.dataList ?? []);
setdrawer((s) => ({
...s,
open: true,
item: { ...row, intelligenceList: res?.data?.dataList ?? [] },
val: 'start',
title: '开始',
fields: [
{
title: '合同起租日',
dataIndex: 'startLeaseDate',
key: 'startLeaseDate',
valueType: 'date',
formItemProps: { rules: [{ required: true, message: '此项为必填项' }] },
colProps: { span: 8 },
},
{
title: '合同终止日',
dataIndex: 'endLeaseDate',
key: 'endLeaseDate',
valueType: 'date',
fieldProps: {
disabled: true
},
colProps: { span: 8 },
formItemProps: { rules: [{ required: true, message: '此项为必填项' }] }
},
{
title: '第一期回款形式',
dataIndex: 'firstCollection',
key: 'firstCollection',
valueType: 'select',
options: [
{ label: '现金', value: 1 },
{ label: '银行承兑', value: 2 },
],
colProps: { span: 8 },
formItemProps: { rules: [{ required: true, message: '此项为必填项' }] },
},
{
title: '租赁设备',
dataIndex: 'intelligenceList',
key: 'intelligenceList',
valueType: 'formList',
initialValue: [
{
state: 'all',
title: '标题',
},
],
colProps: {
xs: 24,
sm: 24,
},
columns: [
{
title: '设备ID',
dataIndex: 'equipmentId',
key: 'equipmentId',
colProps: {
sm: 6,
},
editable: false,
hideInTable: true
},
{
title: '是否绑定智能单元',
dataIndex: 'isBindUnit',
key: 'isBindUnit',
colProps: {
sm: 6,
},
editable: false,
hideInTable: true
},
{
title: '设备编号',
dataIndex: 'equipmentNo',
key: 'equipmentNo',
colProps: {
sm: 6,
},
editable: false
},
{
title: '设备名称',
dataIndex: 'equipmentName',
key: 'equipmentName',
colProps: {
sm: 6,
},
editable: false
},
{
title: '设备型号',
dataIndex: 'equipmentModelName',
key: 'equipmentModelName',
colProps: {
sm: 6,
},
editable: false
},
{
title: '关联智能单元',
dataIndex: 'ledgerEquipmentId',
key: 'ledgerEquipmentId',
valueType: 'select',
fieldProps: {
placeholder: '请选择',
},
formItemProps: {
rules: [
{
required: true,
message: '此项为必填项',
},
],
},
colProps: {
sm: 6,
},
options: {
path: '/lease/umLeaseLedger/intelligentUnitSelectbox',
linkParams: {
equipmentId: 'id',
},
},
hideInForm: {
isBindUnit: [1]
},
hideInFormShowKey: 'intelligentUnitNo'
},
],
creatorButtonProps: false,
deleteIconProps: false,
},
{
title: '起租单上传',
dataIndex: 'startLeaseFileList',
key: 'startLeaseFileList',
valueType: 'uploadBtn',
fieldProps: {
limit: 1,
},
colProps: { span: 24 },
},
{
title: '发用单文件',
dataIndex: 'hairuseFileList',
key: 'hairuseFileList',
valueType: 'uploadBtn',
fieldProps: {
limit: 1,
},
colProps: { span: 24 },
},
{
title: '租赁物交付确认单文件',
dataIndex: 'leaseDeliverFileList',
key: 'leaseDeliverFileList',
valueType: 'uploadBtn',
fieldProps: {
limit: 1,
},
colProps: { span: 24 },
}
]
}));
},
}}
>
开始
</PremButton>,
ifs && <PremButton
key='edit'
btn={{
size: 'small',
onClick: async () => {
let res1 = await doFetch({ url: pathconfig.detail, params: { id: row.id } }),
res2 = await doFetch({ url: "/lease/umContractEquipment/queryByContractId", params: { contractId: row.id } });
let details = { ...(res1?.data?.data ?? {}), contractEquipmentList: res2?.data?.dataList ?? [] }
camount(row.amount);
setdrawer((s) => ({
...s,
open: true,
item: details,
val: 'edit',
title: '编辑'
}));
},
}}
>
修改
</PremButton>,
ifs && <PremButton
key='remove'
pop={{
title: '是否删除该合同?',
okText: '确认',
cancelText: '取消',
onConfirm: async () => {
runAsync({ url: pathconfig.delete, params: { id: row.id, } });
},
}}
btn={{
size: 'small',
type: 'danger',
}}
>
删除
</PremButton>,
ifsa && <PremButton
key='out'
btn={{
size: 'small',
onClick: async () => {
let res = await doFetch({ url: '/lease/umContractEquipment/queryBeforeRentout', params: { contractId: row.id } });
setdrawer((s) => ({
...s,
open: true,
item: { ...row, deviceList: res?.data?.dataList ?? [] },
val: 'out',
title: '退租',
fields: [
{
title: '',
dataIndex: 'deviceList',
key: 'deviceList',
valueType: 'formList',
initialValue: [
{
state: 'all',
title: '标题',
},
],
colProps: {
xs: 24,
sm: 24,
},
columns: [
...formCommonColumns,
{
title: '实际结束时间',
dataIndex: 'realEndDate',
key: 'realEndDate',
valueType: 'date',
colProps: {
sm: 3,
},
hideInForm: {
isFinish: [2]
},
hideInFormShowKey: 'realEndDate'
},
{
title: '违约金（元）',
dataIndex: 'violatePrice',
key: 'violatePrice',
colProps: {
sm: 3,
},
valueType: 'digit',
precision: 2,
hideInForm: {
isFinish: [2]
},
hideInFormShowKey: 'violatePrice'
},
],
creatorButtonProps: false,
deleteIconProps: false,
}
]
}));
},
}}
>
退租
</PremButton>,
ifsb && <PremButton
key='break'
btn={{
size: 'small',
onClick: async () => {
let res = await doFetch({ url: '/lease/umContractEquipment/queryBeforeEndOrHandle', params: { contractId: row.id } });
setdrawer((s) => ({
...s,
open: true,
item: { ...row, deviceList: res?.data?.dataList ?? [] },
val: 'break',
title: '结束',
fields: [
{
title: '返程运费',
dataIndex: 'returnFreight',
key: 'returnFreight',
colProps: { span: 8 },
valueType: 'digit',
precision: 2,
formItemProps: { rules: [{ required: true, message: '此项为必填项' }] }
},
{
title: '返程运费承担方',
dataIndex: 'returnBear',
key: 'returnBear',
valueType: 'select',
options: [
{ label: '客户', value: '1' },
{ label: '平台', value: '2' },
],
colProps: { span: 8 },
formItemProps: { rules: [{ required: true, message: '此项为必填项' }] }
},
]
}));
},
}}
>
结束
</PremButton>,
ifsc && <PremButton
key='handle'
btn={{
size: 'small',
onClick: async () => {
let res = await doFetch({ url: '/lease/umContractEquipment/queryBeforeEndOrHandle', params: { contractId: row.id } });
setdrawer((s) => ({
...s,
open: true,
item: { ...row, deviceList: res?.data?.dataList ?? [] },
val: 'handle',
title: '处理',
fields: [
{
title: '退还押金',
dataIndex: 'refund',
key: 'refund',
colProps: { span: 8 },
valueType: 'digit',
precision: 2,
formItemProps: { rules: [{ required: true, message: '此项为必填项' }] }
},
{
title: '租赁物归还确认单上传',
dataIndex: 'leaseReturnFileList',
key: 'leaseReturnFileList',
valueType: 'uploadBtn',
fieldProps: {
limit: 1,
},
colProps: { span: 24 },
},
{
title: '押金归还确认单上传',
dataIndex: 'refundFileList',
key: 'refundFileList',
valueType: 'uploadBtn',
fieldProps: {
limit: 1,
},
colProps: { span: 24 },
},
]
}));
},
}}
>
处理
</PremButton>
]
}
const columns = useMemo(() => {
let defcolumn = getcolumns(setdrawer, drawer).filter((it) => it.key == activeTabKey)[0]?.columns;
let defpath = getcolumns(setdrawer, drawer).filter((it) => it.key == activeTabKey)[0]?.pathconfig ?? {};
if (activeTabKey == 1) {
return defcolumn.concat({
title: '操作',
valueType: 'option',
width: 150,
render: (text, row, _, action) => rightExtra(text, row, _, action),
});
} else {
return defcolumn;
}
}, [activeTabKey, drawer]);
const pathconfig = useMemo(() => {
let defpath = getcolumns(setdrawer).filter((it) => it.key == activeTabKey)[0]?.pathconfig ?? {};
return defpath;
}, [activeTabKey]);
const calculateContractAmount = (list = [], month = 0) => {
const sum = list?.reduce((prev, next) => {
if (Number(prev + next)) {
return Number((prev + next).toFixed(2));
}
}, 0);
camount(month == 0 || month ? ((sum ?? 0) * 100) * month / 100 : 0);
};
const changeList = (list = []) => {
list.forEach(it => {
if (it.unitPrice && it.zxPrice) {
it.rebatePrice = Number(((it.unitPrice ?? 0) - (it.zxPrice ?? 0)).toFixed(2))
} else {
it.rebatePrice = ''
}
});
return list;
};
const getEndLeaseDate = (start) => {
let end = dayjs(start).add(drawer.item.tenancy, 'months').subtract(1, 'day');
return end;
};
function getOnlyDom() {
switch (drawer.type) {
case 'detail':
return <Details drawer={drawer} />;
case 'device':
return <Devices drawer={drawer} />;
}
}
return (
<div style={{ position: 'relative' }}>
<AutoTable
pagetitle={<h3 className="page-title">租赁合同</h3>}
columns={columns}
path={pathconfig?.list}
actionRef={actionRef}
pageextra={pathconfig?.enableadd ? 'add' : null}
resizeable={false}
addconfig={{
// access: 'sysDepartment_save',
name: '新增',
btn: {
disabled: false,
type: 'primary',
onClick: () => {
setdrawer((s) => ({
...s,
open: true,
item: {
registrationDate: dayjs().format('YYYY-MM-DD'),
contractEquipmentList: [
{
equipmentId: '',
unitPrice: '',
zxPrice: '',
rebatePrice: '',
deposit: '',
remark: ''
}
]
},
title: '新增',
val: 'add'
}));
},
},
}}
tabList={getcolumns()}
activeTabKey={activeTabKey}
onTabChange={(key) => {
setactiveTabKey(key);
}}
/>
<DrawerPro
{...drawer}
fields={(drawer.val != 'add' && drawer.val != 'edit') ? drawer.fields : columns}
detailpath={drawer.val == 'only' ? pathconfig?.detail : null}
detailData={drawer?.item}
defaultFormValue={drawer?.item}
params={{ id: drawer?.item?.id }}
formRef={formRef}
placement="right"
onClose={() => {
setdrawer((s) => ({
...s,
open: false,
}));
}}
onFinish={async (vals) => {
let newVals = JSON.parse(JSON.stringify(vals));
if (drawer?.val == 'add') {
await runAsync({ url: pathconfig?.add, params: { ...newVals, amount } });
} else if (drawer?.val == 'edit') {
await runAsync({ url: pathconfig?.edit, params: { ...newVals, id: drawer?.item?.id, amount } });
} else if (drawer?.val == 'start') {
delete newVals.intelligenceList;
await runAsync({ url: '/lease/umContract/start', params: { ...newVals, id: drawer?.item?.id } });
} else if (drawer?.val == 'out') {
let contractEquipmentList = newVals.deviceList?.filter(it => {
if (it.isFinish == 1) {
return {
id: it.id,
realEndDate: it.realEndDate,
violatePrice: it.violatePrice
}
}
})
await runAsync({ url: '/lease/umContract/rentout', params: { contractEquipmentList, id: drawer?.item?.id } });
} else if (drawer?.val == 'break') {
await runAsync({ url: '/lease/umContract/end', params: { ...newVals, id: drawer?.item?.id } });
} else if (drawer?.val == 'handle') {
await runAsync({ url: '/lease/umContract/handle', params: { ...newVals, id: drawer?.item?.id } });
}
}}
onValuesChange={(changedValues, allValues) => {
for (let i in changedValues) {
if (i == 'contractEquipmentList' || i == 'tenancy') {
calculateContractAmount(allValues['contractEquipmentList']?.map(it => it.unitPrice ?? 0), allValues['tenancy']);
}
if (i == 'contractEquipmentList') {
let newList = changeList(allValues['contractEquipmentList']);
formRef?.current?.setFieldsValue({ ['contractEquipmentList']: newList });
setdrawer((s) => {
return {
...s,
item: { ...s.item, contractEquipmentList: newList }
}
})
}
if (i == 'startLeaseDate') {
let end = getEndLeaseDate(changedValues[i]);
formRef?.current?.setFieldsValue({ ['endLeaseDate']: end });
setdrawer((s) => {
return {
...s,
item: { ...s.item, endLeaseDate: end }
}
})
}
if (i == 'intelligenceList') {
let params = changedValues[i], equipmentId = params.length > 0 ? intelligenceList[params.length - 1]?.equipmentId : "";
params = params.length > 0 ? params[params.length - 1] : {};
doFetch({ url: '/lease/umLeaseLedger/bound', params: { ...params, id: equipmentId } });
}
}
}}
submitter={{
render: (props, doms) => {
return [
<div key='render' className='spread' style={{ position: 'fixed', bottom: 12, width: 'calc(100% - 62px)' }}>
{
(drawer.val == 'add' || drawer.val == 'edit') && <div key='amount' style={{ color: 'red', fontSize: 16, fontWeight: 500 }}>
<span>合同金额（单位：元）：</span>
<span>{amount}</span>
</div>
}
<div>
<PremButton
key='rest'
btn={{
onClick: () => {
props.form?.resetFields()
},
style: { marginRight: 8 }
}}
>
重置
</PremButton>
<PremButton
key='submit'
btn={{
type: "primary",
onClick: () => {
props.form?.submit?.()
},
}}
>
提交
</PremButton>
</div>
</div>
];
},
}}
childrenposition={(drawer.val == 'break' || drawer.val == 'handle') ? 'top' : ''}
>
{
drawer.val == 'only' && getOnlyDom()
}
{
(drawer.val == 'break' || drawer.val == 'handle') && <FormTable columns={[
...formCommonColumns,
{
title: '实际结束时间',
dataIndex: 'realEndDate',
key: 'realEndDate',
colProps: {
sm: 3,
},
editable: false
},
{
title: '违约金（元）',
dataIndex: 'violatePrice',
key: 'violatePrice',
colProps: {
sm: 3,
},
editable: false
},
]}
dataSource={drawer?.item?.deviceList}
resizeable={false}
pageextra="none"
/>
}
</DrawerPro>
</div>
);
}
export default Contract;