173 lines
3.4 KiB
173 lines
3.4 KiB
import React, { useState, useRef, useEffect } from "react";
|
|
import {
|
|
message,
|
|
Pagination,
|
|
Table,
|
|
Space,
|
|
Modal,
|
|
Button,
|
|
Tabs,
|
|
Descriptions,
|
|
Input,
|
|
Steps,
|
|
Select,
|
|
Image,
|
|
Timeline,
|
|
Popover
|
|
} from "antd";
|
|
import { dictionary } from "@/config/common";
|
|
import ajax from "@/services";
|
|
import { TableModule } from "@/components";
|
|
import "./index.scss";
|
|
|
|
const { TextArea } = Input;
|
|
|
|
function OrderRuleMgm() {
|
|
// 详情弹窗
|
|
const [detailVisible, setDetailVisible] = useState(false);
|
|
// 列表数据
|
|
const [tableData, setTableData] = useState([]);
|
|
// 数据总数
|
|
const [total, setTotal] = useState(0);
|
|
// 详情数据
|
|
const [detailData, setDetailData] = useState({});
|
|
// 初始搜索条件
|
|
const initFormData = {
|
|
operator: "0",
|
|
rule_name: "",
|
|
};
|
|
|
|
const columns = [
|
|
{
|
|
title: "运营商名称",
|
|
dataIndex: "operator",
|
|
key: "operator",
|
|
align: "center",
|
|
},
|
|
{
|
|
title: "规则名称",
|
|
dataIndex: "plate",
|
|
key: "plate",
|
|
align: "center",
|
|
},
|
|
{
|
|
title: "规则编码",
|
|
dataIndex: "plate_color",
|
|
key: "plate_color",
|
|
align: "center",
|
|
},
|
|
{
|
|
title: "创建人",
|
|
dataIndex: "berth_id",
|
|
key: "berth_id",
|
|
width: 100,
|
|
align: "center",
|
|
},
|
|
{
|
|
title: "创建时间",
|
|
dataIndex: "in_time",
|
|
key: "in_time",
|
|
align: "center",
|
|
},
|
|
{
|
|
title: "操作",
|
|
dataIndex: "operation",
|
|
key: "operation",
|
|
align: "center",
|
|
fixed: "right",
|
|
width: 100,
|
|
render: (text, record, index) => {
|
|
return (
|
|
<>
|
|
<Button type="primary" onClick={() => openModal(index, record)}>
|
|
详情
|
|
</Button>
|
|
</>
|
|
)
|
|
|
|
},
|
|
},
|
|
];
|
|
|
|
const formSearch = [
|
|
{
|
|
name: "operator",
|
|
type: "Select",
|
|
label: "商户名称",
|
|
defaultValue: "0",
|
|
placeholder: "请选择商户名称",
|
|
},
|
|
{
|
|
name: "rule_name",
|
|
type: "Input",
|
|
label: "规则名称",
|
|
placeholder: "请输入出场收费员",
|
|
},
|
|
{
|
|
name: "timePeriod",
|
|
type: "RangePicker",
|
|
label: "时间段",
|
|
},
|
|
];
|
|
|
|
// 打开弹窗
|
|
const openModal = (index, record) => {
|
|
setDetailData(record)
|
|
setDetailVisible(true);
|
|
}
|
|
|
|
// 检索
|
|
const search = (params) => {
|
|
ajax.getParkingList(params).then((res) => {
|
|
if (res.status === 20000) {
|
|
setTableData(res.data.list);
|
|
setTotal(res.data.total);
|
|
} else {
|
|
message.error(res.message)
|
|
}
|
|
});
|
|
}
|
|
|
|
const handelAdd = () => {
|
|
setDetailVisible(true)
|
|
}
|
|
|
|
return (
|
|
<>
|
|
<TableModule
|
|
showSerial={true}
|
|
isExport={false}
|
|
diyButton={
|
|
<Button
|
|
type="primary"
|
|
onClick={handelAdd}
|
|
>
|
|
新增
|
|
</Button>
|
|
}
|
|
columns={columns}
|
|
tableData={tableData}
|
|
formSearch={formSearch}
|
|
pagename="停车记录查询"
|
|
pageName={'orderRuleMgm'}
|
|
initFormData={initFormData}
|
|
total={total}
|
|
search={search}
|
|
exportUrl="/api/bpm/record/get_record_export"
|
|
/>
|
|
<Modal
|
|
open={detailVisible}
|
|
width={1500}
|
|
className="totalModal"
|
|
onCancel={() => {
|
|
setDetailVisible(false);
|
|
}}
|
|
destroyOnClose
|
|
>
|
|
|
|
</Modal>
|
|
</>
|
|
);
|
|
}
|
|
|
|
export default OrderRuleMgm;
|