feat(mkmjArea): 新增封闭区域管理功能
parent
b15c8696b7
commit
3045b714db
|
|
@ -49,6 +49,6 @@
|
|||
<noscript>此网页需要开启JavaScript功能。</noscript>
|
||||
<!-- MAIN -->
|
||||
<% const { root } = $element; %>
|
||||
<div id="<%= root.id %>" style="width: 100%; height: 100%; position: relative"></div>
|
||||
<div id="<%= root.id %>" style="width: 100%; height: 100%; position: relative;overflow-y: auto;"></div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
|
|||
|
|
@ -23,3 +23,8 @@ export const mkmjAreaBatchDelete = declareRequest(
|
|||
export const mkmjAreaInfo = declareRequest('mkmjAreaLoading', 'Get > /primeport/mkmjArea/{id}');
|
||||
|
||||
export const getStatistics = declareRequest('mkmjAreaLoading', 'Post > @/primeport/mkmjArea/statistics');
|
||||
|
||||
export const getCorpInfoList = declareRequest(
|
||||
'fireresourcesLoading',
|
||||
'Get > /basicInfo/corpInfo/listAll?inType=0,1'
|
||||
);
|
||||
|
|
@ -10,3 +10,4 @@ export const NS_MKMJAREAGATE = defineNamespace("mkmjAreaGate");
|
|||
export const NS_MKMJGATELOG = defineNamespace("mkmjGateLog");
|
||||
export const NS_MKMJGATEVIDEO = defineNamespace("mkmjGateVideo");
|
||||
export const NS_MKMJPASSAGE = defineNamespace("mkmjPassage");
|
||||
export const NS_ENCLOSEDAREA = defineNamespace("enclosedArea");
|
||||
|
|
|
|||
|
|
@ -1,281 +0,0 @@
|
|||
import {Connect} from "@cqsjjb/jjb-dva-runtime";
|
||||
import {Button, Form, message, Modal, Space, Descriptions} from "antd";
|
||||
import {useEffect, useState} from "react";
|
||||
import FormBuilder from "zy-react-library/components/FormBuilder";
|
||||
import Search from "zy-react-library/components/Search";
|
||||
import Table from "zy-react-library/components/Table";
|
||||
import {FORM_ITEM_RENDER_ENUM} from "zy-react-library/enum/formItemRender";
|
||||
import useTable from "zy-react-library/hooks/useTable";
|
||||
import {NS_MKMJAREA} from "~/enumerate/namespace";
|
||||
import AddIcon from "zy-react-library/components/Icon/AddIcon";
|
||||
import DeleteIcon from "zy-react-library/components/Icon/DeleteIcon";
|
||||
import LocationIcon from "zy-react-library/components/Icon/LocationIcon";
|
||||
import DictionarySelect from "zy-react-library/components/Select/Dictionary";
|
||||
import Map from "zy-react-library/components/Map";
|
||||
import MapSelector from "zy-react-library/components/Map/MapSelector";
|
||||
|
||||
const AREA_TYPE = [
|
||||
{name: "人行口门", bianma: "1"},
|
||||
{name: "车行口门", bianma: "2"},
|
||||
{name: "综合口门", bianma: "3"},
|
||||
]
|
||||
|
||||
const AREA_STATUS = [
|
||||
{name: "停用", bianma: "0"},
|
||||
{name: "正常", bianma: "1"},
|
||||
{name: "暂时关闭", bianma: "2"},
|
||||
]
|
||||
|
||||
function MkmjArea(props) {
|
||||
const [addModalVisible, setAddModalVisible] = useState(false);
|
||||
const [infoModalVisible, setInfoModalVisible] = useState(false);
|
||||
const [currentId, setCurrentId] = useState("");
|
||||
const [selectedRowKeys, setSelectedRowKeys] = useState([]);
|
||||
const [form] = Form.useForm();
|
||||
const {tableProps, getData} = useTable(props["mkmjAreaList"], {
|
||||
form,
|
||||
params: {
|
||||
eqAreaLevel: 1,
|
||||
}
|
||||
});
|
||||
return (
|
||||
<div style={{padding: 10}}>
|
||||
<Search
|
||||
form={form}
|
||||
onFinish={getData}
|
||||
options={[
|
||||
{name: "likeAreaName", label: "口门名称"},
|
||||
{name: "eqAreaStatus", label: "口门状态",render: FORM_ITEM_RENDER_ENUM.SELECT, items: AREA_STATUS},
|
||||
{name: "eqAreaType", label: "口门类型",render: FORM_ITEM_RENDER_ENUM.SELECT, items: AREA_TYPE},
|
||||
{name: "eqAreaParentId", label: "所属区域",render: <DictionarySelect dictValue="primeport_area" />},
|
||||
]}
|
||||
/>
|
||||
<Table
|
||||
rowSelection={{
|
||||
selectedRowKeys,
|
||||
onChange: selectedRowKeys => setSelectedRowKeys(selectedRowKeys),
|
||||
}}
|
||||
toolBarRender={() => (
|
||||
<Space>
|
||||
<Button type="primary" icon={<AddIcon/>} onClick={() => setAddModalVisible(true)}>新增</Button>
|
||||
<Button
|
||||
icon={<DeleteIcon/>}
|
||||
type="primary"
|
||||
danger
|
||||
onClick={() => {
|
||||
if (!selectedRowKeys.length)
|
||||
return message.warning("请选择要删除的行");
|
||||
Modal.confirm({
|
||||
title: "确定删除吗?",
|
||||
onOk: async () => {
|
||||
await props["mkmjAreaBatchDelete"]({ids: selectedRowKeys});
|
||||
message.success("删除成功");
|
||||
getData();
|
||||
},
|
||||
});
|
||||
}}
|
||||
>
|
||||
批量删除
|
||||
</Button>
|
||||
</Space>
|
||||
)}
|
||||
columns={[
|
||||
{dataIndex: "areaParentName", title: "所属区域"},
|
||||
{dataIndex: "areaName", title: "口门名称"},
|
||||
{dataIndex: "areaType", title: "口门类型",render:(_,record)=>{
|
||||
return record.areaType === 1 ? "人行口门" : record.areaType === 2 ? "车行口门" : "综合口门";
|
||||
}},
|
||||
{dataIndex: "location", title: "地理位置",render:(_,record)=>{
|
||||
return `${record.latitude || ""}--${record.longitude || ""}`;
|
||||
}},
|
||||
{dataIndex: "videoNum", title: "视频个数",render:(_,record)=>{
|
||||
return record.videoNum || 0;
|
||||
}},
|
||||
{
|
||||
title: "操作",
|
||||
align: "center",
|
||||
width: 200,
|
||||
render: (_, record) => (
|
||||
<Space>
|
||||
<Button
|
||||
type="link"
|
||||
onClick={() => {
|
||||
setCurrentId(record.id);
|
||||
setInfoModalVisible(true);
|
||||
}}
|
||||
>
|
||||
查看
|
||||
</Button>
|
||||
<Button
|
||||
type="link"
|
||||
onClick={() => {
|
||||
setCurrentId(record.id);
|
||||
setAddModalVisible(true);
|
||||
}}
|
||||
>
|
||||
编辑
|
||||
</Button>
|
||||
<Button
|
||||
type="link"
|
||||
danger
|
||||
onClick={() => {
|
||||
Modal.confirm({
|
||||
title: "确定删除吗?",
|
||||
onOk: async () => {
|
||||
await props["mkmjAreaDelete"]({id: record.id});
|
||||
message.success("删除成功");
|
||||
getData();
|
||||
},
|
||||
});
|
||||
}}
|
||||
>
|
||||
删除
|
||||
</Button>
|
||||
<Button
|
||||
type="link"
|
||||
onClick={() => {
|
||||
props.history.push(`./MkmjPassage?areaId=${record.areaId}`)
|
||||
}}
|
||||
>
|
||||
添加通道
|
||||
</Button>
|
||||
<Button
|
||||
type="link"
|
||||
onClick={() => {
|
||||
props.history.push(`./MkmjGateVideo?areaGateId=${record.areaId}&deviceType=1`)
|
||||
}}
|
||||
>
|
||||
添加摄像头
|
||||
</Button>
|
||||
</Space>
|
||||
),
|
||||
},
|
||||
]}
|
||||
{...tableProps}
|
||||
/>
|
||||
<AddModal
|
||||
visible={addModalVisible}
|
||||
currentId={currentId}
|
||||
onCancel={() => {
|
||||
setAddModalVisible(false);
|
||||
setCurrentId("");
|
||||
}}
|
||||
getData={getData}
|
||||
/>
|
||||
|
||||
<InfoModal
|
||||
visible={infoModalVisible}
|
||||
currentId={currentId}
|
||||
onCancel={() => {
|
||||
setInfoModalVisible(false);
|
||||
setCurrentId("");
|
||||
}}
|
||||
getData={getData}
|
||||
/>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
function AddModalComponent(props) {
|
||||
const [form] = Form.useForm();
|
||||
useEffect(() => {
|
||||
if (props.currentId) {
|
||||
props["mkmjAreaInfo"]({id: props.currentId}).then((res) => {
|
||||
form.setFieldsValue({...res.data,
|
||||
areaType: res.data.areaType + "",
|
||||
areaStatus: res.data.areaStatus + "",
|
||||
});
|
||||
});
|
||||
}
|
||||
}, [props.currentId]);
|
||||
const onCancel = () => {
|
||||
form.resetFields();
|
||||
props.onCancel();
|
||||
};
|
||||
const submit = async (values) => {
|
||||
await props[!props.currentId ? "mkmjAreaAdd" : "mkmjAreaEdit"]({...values, areaLevel:1, id: props.currentId});
|
||||
onCancel();
|
||||
props.getData();
|
||||
};
|
||||
return (
|
||||
<Modal
|
||||
open={props.visible}
|
||||
onCancel={onCancel}
|
||||
onOk={form.submit}
|
||||
title={props.currentId ? "编辑" : "新增"}
|
||||
loading={props.mkmjArea.loading}
|
||||
width={800}
|
||||
>
|
||||
<FormBuilder
|
||||
labelCol={{ span: 6 }}
|
||||
form={form}
|
||||
span={24}
|
||||
onFinish={submit}
|
||||
showActionButtons={false}
|
||||
options={[
|
||||
{name: "areaName", label: "口门名称"},
|
||||
{name: "areaType", label: "口门类型",render: FORM_ITEM_RENDER_ENUM.SELECT, items: AREA_TYPE},
|
||||
{name: "areaParentId", label: "所属区域",render: <DictionarySelect dictValue="primeport_area" onGetLabel={(label) => form.setFieldValue("areaParentName",label)}/>},
|
||||
{name: "areaParentName", label: "所属区域",onlyForLabel:true},
|
||||
{name: "areaRange", label: "口门位置"},
|
||||
{name: "areaStatus", label: "口门状态",render: FORM_ITEM_RENDER_ENUM.SELECT, items: AREA_STATUS},
|
||||
{key:"map",customizeRender:true,render:<Map/>}
|
||||
|
||||
]}
|
||||
/>
|
||||
</Modal>
|
||||
);
|
||||
}
|
||||
|
||||
function InfoModalComponent(props) {
|
||||
const [info, setInfo] = useState({});
|
||||
const [mapVisible, setMapVisible] = useState(false);
|
||||
|
||||
useEffect(() => {
|
||||
if (props.currentId) {
|
||||
props["mkmjAreaInfo"]({id: props.currentId}).then((res) => {
|
||||
setInfo(res.data);
|
||||
});
|
||||
}
|
||||
}, [props.currentId]);
|
||||
|
||||
return (
|
||||
<Modal
|
||||
open={props.visible}
|
||||
onCancel={props.onCancel}
|
||||
footer={<Button onClick={props.onCancel}>关闭</Button>}
|
||||
title="查看"
|
||||
loading={props.mkmjArea.loading}
|
||||
>
|
||||
<Descriptions
|
||||
labelStyle={{width: 200}}
|
||||
column={1}
|
||||
bordered
|
||||
items={[
|
||||
{children: info.areaParentName, label: "所属区域"},
|
||||
{children: info.areaName, label: "口门名称"},
|
||||
{children: info.areaRange, label: "口门位置"},
|
||||
{children: info.areaLevel===1?"一级":info.areaLevel===2?"二级":"三级", label: "区域级别"},
|
||||
{children: info.areaType===1?"人行口门":info.areaType===2?"车行口门":"综合口门", label: "口门类型"},
|
||||
{children: info.areaStatus===0?"停用":info.areaStatus===1?"正常":"暂时关闭", label: "区域状态"},
|
||||
{children: <LocationIcon onClick={() => {
|
||||
setMapVisible(true);
|
||||
}}/>, label: "位置"},
|
||||
]}
|
||||
/>
|
||||
|
||||
<MapSelector
|
||||
visible={mapVisible}
|
||||
onClose={() => setMapVisible(false)}
|
||||
longitude={info.longitude}
|
||||
latitude={info.latitude}
|
||||
disable={true}
|
||||
/>
|
||||
</Modal>
|
||||
);
|
||||
}
|
||||
|
||||
const AddModal = Connect([NS_MKMJAREA], true)(AddModalComponent);
|
||||
const InfoModal = Connect([NS_MKMJAREA], true)(InfoModalComponent);
|
||||
export default Connect([NS_MKMJAREA], true)(MkmjArea);
|
||||
|
||||
|
|
@ -145,8 +145,7 @@ function MkmjAreaGate(props) {
|
|||
]}
|
||||
{...tableProps}
|
||||
/>
|
||||
<AddModal
|
||||
visible={addModalVisible}
|
||||
{addModalVisible && <AddModal
|
||||
currentId={currentId}
|
||||
areaId={areaId}
|
||||
passageId={passageId}
|
||||
|
|
@ -155,17 +154,16 @@ function MkmjAreaGate(props) {
|
|||
setCurrentId("");
|
||||
}}
|
||||
getData={getData}
|
||||
/>
|
||||
/>}
|
||||
|
||||
<InfoModal
|
||||
visible={infoModalVisible}
|
||||
{infoModalVisible && <InfoModal
|
||||
currentId={currentId}
|
||||
onCancel={() => {
|
||||
setInfoModalVisible(false);
|
||||
setCurrentId("");
|
||||
}}
|
||||
getData={getData}
|
||||
/>
|
||||
/>}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
|
@ -194,7 +192,7 @@ function AddModalComponent(props) {
|
|||
};
|
||||
return (
|
||||
<Modal
|
||||
open={props.visible}
|
||||
open
|
||||
onCancel={onCancel}
|
||||
onOk={form.submit}
|
||||
title={props.currentId ? "编辑" : "新增"}
|
||||
|
|
@ -234,7 +232,7 @@ function InfoModalComponent(props) {
|
|||
|
||||
return (
|
||||
<Modal
|
||||
open={props.visible}
|
||||
open
|
||||
footer={<Button onClick={props.onCancel}>关闭</Button>}
|
||||
title="查看"
|
||||
loading={props.mkmjAreaGate.loading}
|
||||
|
|
|
|||
|
|
@ -125,25 +125,23 @@ function MkmjGateLog(props) {
|
|||
]}
|
||||
{...tableProps}
|
||||
/>
|
||||
<AddModal
|
||||
visible={addModalVisible}
|
||||
{addModalVisible && <AddModal
|
||||
currentId={currentId}
|
||||
onCancel={() => {
|
||||
setAddModalVisible(false);
|
||||
setCurrentId("");
|
||||
}}
|
||||
getData={getData}
|
||||
/>
|
||||
/>}
|
||||
|
||||
<InfoModal
|
||||
visible={infoModalVisible}
|
||||
{infoModalVisible && <InfoModal
|
||||
currentId={currentId}
|
||||
onCancel={() => {
|
||||
setInfoModalVisible(false);
|
||||
setCurrentId("");
|
||||
}}
|
||||
getData={getData}
|
||||
/>
|
||||
/>}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
|
@ -168,7 +166,7 @@ function AddModalComponent(props) {
|
|||
};
|
||||
return (
|
||||
<Modal
|
||||
open={props.visible}
|
||||
open
|
||||
onCancel={onCancel}
|
||||
onOk={form.submit}
|
||||
title="新增"
|
||||
|
|
@ -209,7 +207,7 @@ function InfoModalComponent(props) {
|
|||
|
||||
return (
|
||||
<Modal
|
||||
open={props.visible}
|
||||
open
|
||||
footer={<Button onClick={props.onCancel}>关闭</Button>}
|
||||
title="查看"
|
||||
loading={props.mkmjGateLog.loading}
|
||||
|
|
|
|||
|
|
@ -122,25 +122,23 @@ function MkmjGateVideo(props) {
|
|||
]}
|
||||
{...tableProps}
|
||||
/>
|
||||
<AddModal
|
||||
visible={addModalVisible}
|
||||
{addModalVisible && <AddModal
|
||||
currentId={currentId}
|
||||
onCancel={() => {
|
||||
setAddModalVisible(false);
|
||||
setCurrentId("");
|
||||
}}
|
||||
getData={getData}
|
||||
/>
|
||||
/>}
|
||||
|
||||
<InfoModal
|
||||
visible={infoModalVisible}
|
||||
{infoModalVisible && <InfoModal
|
||||
currentId={currentId}
|
||||
onCancel={() => {
|
||||
setInfoModalVisible(false);
|
||||
setCurrentId("");
|
||||
}}
|
||||
getData={getData}
|
||||
/>
|
||||
/>}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
|
@ -165,7 +163,7 @@ function AddModalComponent(props) {
|
|||
};
|
||||
return (
|
||||
<Modal
|
||||
open={props.visible}
|
||||
open
|
||||
onCancel={onCancel}
|
||||
onOk={form.submit}
|
||||
title="新增"
|
||||
|
|
@ -203,7 +201,7 @@ function InfoModalComponent(props) {
|
|||
|
||||
return (
|
||||
<Modal
|
||||
open={props.visible}
|
||||
open
|
||||
footer={<Button onClick={props.onCancel}>关闭</Button>}
|
||||
title="查看"
|
||||
loading={props.mkmjGateVideo.loading}
|
||||
|
|
|
|||
|
|
@ -153,8 +153,7 @@ function MkmjPassage(props) {
|
|||
]}
|
||||
{...tableProps}
|
||||
/>
|
||||
<AddModal
|
||||
visible={addModalVisible}
|
||||
{addModalVisible && <AddModal
|
||||
currentId={currentId}
|
||||
areaId={areaId}
|
||||
onCancel={() => {
|
||||
|
|
@ -162,17 +161,16 @@ function MkmjPassage(props) {
|
|||
setCurrentId("");
|
||||
}}
|
||||
getData={getData}
|
||||
/>
|
||||
/>}
|
||||
|
||||
<InfoModal
|
||||
visible={infoModalVisible}
|
||||
{infoModalVisible && <InfoModal
|
||||
currentId={currentId}
|
||||
onCancel={() => {
|
||||
setInfoModalVisible(false);
|
||||
setCurrentId("");
|
||||
}}
|
||||
getData={getData}
|
||||
/>
|
||||
/>}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
|
@ -213,7 +211,7 @@ function AddModalComponent(props) {
|
|||
};
|
||||
return (
|
||||
<Modal
|
||||
open={props.visible}
|
||||
open
|
||||
onCancel={onCancel}
|
||||
onOk={form.submit}
|
||||
title={props.currentId ? "编辑" : "新增"}
|
||||
|
|
@ -250,7 +248,7 @@ function InfoModalComponent(props) {
|
|||
|
||||
return (
|
||||
<Modal
|
||||
open={props.visible}
|
||||
open
|
||||
onCancel={props.onCancel}
|
||||
footer={<Button onClick={props.onCancel}>关闭</Button>}
|
||||
title="查看"
|
||||
|
|
|
|||
Loading…
Reference in New Issue