import React, { useEffect, useState } from "react";
import {
Card,
Table,
DatePicker,
Row,
message,
Input,
Button,
Modal,
} from "antd";
import * as API from "./api";
import { PageHeaderWrapper } from "@ant-design/pro-layout";
import { history } from "umi";
import moment, { Moment } from "moment";
import useInitial from "@/hooks/useInitail";
import { Provider, useStore } from "./store";
import ApprovalProgressModal from "@/pages/stock/AdvanceProgress/components/ApproveModal";
import EntryTaskPreview from "./components/EntryTaskPreview";
import { OrderTaskApprovalType } from "./entity";
import AdviserTaskPreview from "./components/AdviserTaskPreview";
import SeriesTaskPreview from "./components/SeriesTaskPreview";
import ApproveModal from "@/pages/order3/Common/ApproveModal";
import SaleTaskAutoAssign from "./components/SaleTaskAutoAssign";
import SaleTaskBatchSet from "./components/SaleTaskBatchSet";
import { ColumnsType } from "antd/es/table";
export default () => (
);
function SaleTaskList() {
const { isReadOnly, setShopTaskItem, setIsReadOnly } = useStore();
const [approve, setApprove] = useState({ visible: false, orderNo: "" });
const [approveOpen, setApproveOpen] = useState(false);
const [targetMonth, setTargetMonth] = useState(moment());
const [etpVisible, setEtpVisible] = useState(false);
const [previewTaskParams, setPreviewTaskParams] = useState({});
const [atpVisible, setAtpVisible] = useState(false);
const [adviserTaskParams, setAdviserTaskParams] = useState({});
const [stpVisible, setStpVisible] = useState(false);
const [seriesTaskParams, setSeriesTaskParams] = useState({});
const [autoVisible, setAutoVisible] = useState(false);
const [batchVisible, setBatchVisible] = useState(false);
const { data, loading, setParams } = useInitial(
API.getSaleTaskApi,
{} as API.GetSaleTaskApiRes,
{
taskDate: targetMonth.valueOf(),
}
);
useEffect(() => {
setIsReadOnly(!data.canModified);
}, [data]);
const handleChangeMonth = (date: Moment | null) => {
setTargetMonth(moment(date));
setParams({ taskDate: moment(date).valueOf() }, true);
};
const goToEditPage = (record: API.ShopTaskItem) => {
setShopTaskItem(record);
history.push({
pathname: "/order3/saleTask/edit",
query: {
readOnly: isReadOnly ? "1" : "0",
shopId: String(record.shopId),
taskDate: String(targetMonth.valueOf()),
},
});
};
// 查看销顾任务
const goToAdviserPage = (record: API.ShopTaskItem) => {
history.push({
pathname: "/order3/saleTask/edit",
query: {
readOnly: isReadOnly ? "1" : "0",
shopId: String(record.shopId),
taskDate: String(targetMonth.valueOf()),
currTab: "2",
},
});
};
// 查看流程进度
const viewProcess = () => {
setApprove({
visible: true,
orderNo: data.approvalNumber,
});
};
const cancelSaleTask = () => {
Modal.confirm({
title: "提示",
content: `确认撤销【${targetMonth.format("YYYY-MM")}】零售任务审批吗?`,
zIndex: 1002,
onOk: () => {
API.cancelSaleTask({
id: data.id,
})
.then((res) => {
message.success("撤销成功");
})
.catch((error: any) => {
message.error(error.message ?? "请求失败");
})
.finally(() => {
setParams({}, true);
});
},
});
};
const submitSaleTask = (parmas: any) => {
const hide = message.loading("提交中", 0);
API.submitSaleTask({
id: data.id,
...parmas,
})
.then((res) => {
message.success("提交成功");
})
.catch((error: any) => {
message.error(error.message ?? "请求失败");
})
.finally(() => {
hide();
setParams({}, true);
});
};
const handlePreviewTask = () => {
const params: any = {
id: data.id,
orderTaskApprovalType: OrderTaskApprovalType.门店维度,
};
setPreviewTaskParams(params);
setEtpVisible(true);
};
// 销顾任务
const showAdviserModal = (
record: API.TaskListItem,
type: OrderTaskApprovalType
) => {
const params: any = {
id: data.id,
taskId: record.id,
orderTaskApprovalType: OrderTaskApprovalType.门店维度, // 只有门店有查看销顾任务
};
switch (type) {
case OrderTaskApprovalType.门店维度:
params.shopId = record.dataId;
break;
case OrderTaskApprovalType.销售顾问维度:
params.staffId = record.dataId;
break;
case OrderTaskApprovalType.新车一级管理维度:
params.firstManageId = record.dataId;
break;
case OrderTaskApprovalType.新车二级管理维度:
params.secondManageId = record.dataId;
break;
case OrderTaskApprovalType.新车三级管理维度:
params.thirdManageId = record.dataId;
break;
default:
break;
}
setAdviserTaskParams(params);
setAtpVisible(true);
};
// 销顾任务--查看车系任务
const showSeriesModalByAdviser = (record: API.TaskListItem) => {
const params = { ...adviserTaskParams } as any;
params.taskId = record.id;
params.orderTaskApprovalType = OrderTaskApprovalType.车系;
params.staffId = record.dataId;
setSeriesTaskParams(params);
setStpVisible(true);
};
// 车系任务
const showSeriesModal = (
record: API.TaskListItem,
type: OrderTaskApprovalType
) => {
const params: any = {
id: data.id,
taskId: record.id,
orderTaskApprovalType: OrderTaskApprovalType.车系,
};
switch (type) {
case OrderTaskApprovalType.门店维度:
params.shopId = record.dataId;
break;
case OrderTaskApprovalType.销售顾问维度:
params.staffId = record.dataId;
break;
case OrderTaskApprovalType.新车一级管理维度:
params.firstManageId = record.dataId;
break;
case OrderTaskApprovalType.新车二级管理维度:
params.secondManageId = record.dataId;
break;
case OrderTaskApprovalType.新车三级管理维度:
params.thirdManageId = record.dataId;
break;
default:
break;
}
setSeriesTaskParams(params);
setStpVisible(true);
};
const handleAutoAssignRefresh = () => {
setAutoVisible(false);
setParams({}, true);
};
const handleBatchSetRefresh = () => {
setBatchVisible(false);
setParams({}, true);
};
const columns: ColumnsType = [
{
title: "门店",
width: 150,
dataIndex: "shopName",
},
{
title: "零售任务(台)",
children: [
{
title: "合计",
dataIndex: "taskCount",
key: "taskCount",
},
{
title: "新能源车",
dataIndex: "newEnergyTaskCount",
key: "newEnergyTaskCount",
},
{
title: "传统燃油车",
dataIndex: "fuelVehicleTaskCount",
key: "fuelVehicleTaskCount",
},
],
},
{
title: "毛利任务(元)",
children: [
{
title: "合计",
dataIndex: "grossProfitTaskTotal",
key: "grossProfitTaskTotal",
render: (text: string, record: API.ShopTaskItem) => {
return (record.taskCount * record.vehicleGrossProfitTask).toFixed(
2
);
},
},
{
title: "单车",
dataIndex: "vehicleGrossProfitTask",
key: "vehicleGrossProfitTask",
},
],
},
{
title: "线索到店成交(台)",
width: 100,
dataIndex: "clueDealTaskCount",
key: "clueDealTaskCount",
},
{
title: "首客试驾成交(台)",
width: 100,
dataIndex: "testDriveTaskCount",
key: "testDriveTaskCount",
},
{
title: "攻坚车任务(台)",
width: 100,
dataIndex: "tackCarTaskCount",
key: "tackCarTaskCount",
},
{
title: "车系任务(台)",
width: 100,
dataIndex: "seriesTaskCount",
key: "seriesTaskCount",
},
{
title: "销顾任务",
render: (text: string, record: API.ShopTaskItem) => {
return (
{
goToAdviserPage(record);
}}
>
查看
);
},
},
{
title: "操作",
render: (text: string, record: API.ShopTaskItem) => {
return (
{
goToEditPage(record);
}}
>
{isReadOnly ? "查看" : "编辑"}
);
},
},
];
return (
{
setParams({ shopName: v }, true);
}}
/>
{!isReadOnly && (
)}
{
if (!data || !data.shopTaskList || data.shopTaskList.length <= 0) {
return null;
}
return (
合计
{data.totalTaskCount}
{data.newEnergyTaskCount}
{data.fuelVehicleTaskCount}
-
-
{data.clueDealTaskCount}
{data.testDriveTaskCount}
{data.tackCarTaskCount}
{data.seriesTaskCount}
);
}}
/>
{data.revoke ? (
) : (
{!isReadOnly && (
)}
)}
setEtpVisible(false)}
destroyOnClose
footer={null}
>
{/* {
// todo setParams({ shopName: v }, true);
}}
/> */}
setAtpVisible(false)}
destroyOnClose
footer={null}
>
setStpVisible(false)}
destroyOnClose
footer={null}
>
setAutoVisible(false)}
destroyOnClose
footer={null}
maskClosable={false}
>
setAutoVisible(false)}
onRefresh={handleAutoAssignRefresh}
/>
setBatchVisible(false)}
destroyOnClose
footer={null}
maskClosable={false}
>
setBatchVisible(false)}
onRefresh={handleBatchSetRefresh}
/>
setApprove({ visible: false, orderNo: "" })}
/>
);
}