封闭区域监管端
LiuJiaNan
parent
c176f0ffcf
commit
90c6ad1686
101
router.md
101
router.md
|
|
@ -1,50 +1,65 @@
|
|||
### 监管端
|
||||
- `/primeport/container/supervision/firstLevelDoor/approverUser` 一级口门管理/门禁审批人管理
|
||||
- `/primeport/container/supervision/firstLevelDoor/basicInfo/firstLevelDoorInfo/list` 一级口门管理/基本信息管理/一级口门信息管理
|
||||
- `/primeport/container/supervision/firstLevelDoor/portEntryApproval/personnelApproval/relatedPersonnel` 一级口门管理/进港审批管理/人员审批管理/相关方人员进港审批
|
||||
- `/primeport/container/supervision/firstLevelDoor/portEntryApproval/longTermVehicleApproval/shareVehicles` 一级口门管理/进港审批管理/长期车辆审批管理/股份车辆审批
|
||||
- `/primeport/container/supervision/firstLevelDoor/portEntryApproval/longTermVehicleApproval/relatedVehicles` 一级口门管理/进港审批管理/长期车辆审批管理/相关方车辆审批
|
||||
- `/primeport/container/supervision/firstLevelDoor/portEntryApproval/temporaryVisitor/temporaryPersonnel/list` 一级口门管理/进港审批管理/临时访客管理/临时人员管理
|
||||
- `/primeport/container/supervision/firstLevelDoor/portEntryApproval/temporaryVisitor/temporaryVehicle/list` 一级口门管理/进港审批管理/临时访客管理/临时车辆管理
|
||||
- `/primeport/container/supervision/firstLevelDoor/importAndExportPortInfo/stockPersonnelAndVehicles/list` 一级口门管理/进出港信息管理/股份人员及车辆管理
|
||||
- `/primeport/container/supervision/firstLevelDoor/importAndExportPortInfo/personalVehicle/list` 一级口门管理/进出港信息管理/个人车辆管理
|
||||
- `/primeport/container/supervision/firstLevelDoor/importAndExportPortInfo/stockVehicles/list` 一级口门管理/进出港信息管理/股份单位车辆管理
|
||||
- `/primeport/container/supervision/firstLevelDoor/importAndExportPortInfo/branchPersonnelAndVehicles/list` 一级口门管理/进出港信息管理/分公司人员及车辆管理
|
||||
- `/primeport/container/supervision/firstLevelDoor/importAndExportPortInfo/stakeholderPersonnelAndVehicles/list` 一级口门管理/进出港信息管理/相关方人员及车辆管理
|
||||
- `/primeport/container/supervision/firstLevelDoor/importAndExportPortInfo/portBasedUnitsPersonnelAndVehicles/list` 一级口门管理/进出港信息管理/驻港单位人员及车辆管理
|
||||
- `/primeport/container/supervision/firstLevelDoor/importAndExportPortInfo/inspectDepartmentVehicles/list` 一级口门管理/进出港信息管理/检查部门车辆管理
|
||||
- `/primeport/container/supervision/firstLevelDoor/importAndExportPortInfo/vehiclesViolation/vehiclesViolation/list` 一级口门管理/进出港信息管理/车辆违规管理/车辆违规管理
|
||||
- `/primeport/container/supervision/firstLevelDoor/importAndExportPortInfo/vehiclesViolation/vehicleBlacklist/list` 一级口门管理/进出港信息管理/车辆违规管理/车辆黑名单管理
|
||||
#### 一级口门管理
|
||||
- `/primeport/container/supervision/firstLevelDoor/approverUser` 门禁审批人管理
|
||||
- `/primeport/container/supervision/firstLevelDoor/basicInfo/firstLevelDoorInfo/list` 基本信息管理/一级口门信息管理
|
||||
- `/primeport/container/supervision/firstLevelDoor/portEntryApproval/personnelApproval/relatedPersonnel` 进港审批管理/人员审批管理/相关方人员进港审批
|
||||
- `/primeport/container/supervision/firstLevelDoor/portEntryApproval/longTermVehicleApproval/shareVehicles` 进港审批管理/长期车辆审批管理/股份车辆审批
|
||||
- `/primeport/container/supervision/firstLevelDoor/portEntryApproval/longTermVehicleApproval/relatedVehicles` 进港审批管理/长期车辆审批管理/相关方车辆审批
|
||||
- `/primeport/container/supervision/firstLevelDoor/portEntryApproval/temporaryVisitor/temporaryPersonnel/list` 进港审批管理/临时访客管理/临时人员管理
|
||||
- `/primeport/container/supervision/firstLevelDoor/portEntryApproval/temporaryVisitor/temporaryVehicle/list` 进港审批管理/临时访客管理/临时车辆管理
|
||||
- `/primeport/container/supervision/firstLevelDoor/importAndExportPortInfo/stockPersonnelAndVehicles/list` 进出港信息管理/股份人员及车辆管理
|
||||
- `/primeport/container/supervision/firstLevelDoor/importAndExportPortInfo/personalVehicle/list` 进出港信息管理/个人车辆管理
|
||||
- `/primeport/container/supervision/firstLevelDoor/importAndExportPortInfo/stockVehicles/list` 进出港信息管理/股份单位车辆管理
|
||||
- `/primeport/container/supervision/firstLevelDoor/importAndExportPortInfo/branchPersonnelAndVehicles/list` 进出港信息管理/分公司人员及车辆管理
|
||||
- `/primeport/container/supervision/firstLevelDoor/importAndExportPortInfo/stakeholderPersonnelAndVehicles/list` 进出港信息管理/相关方人员及车辆管理
|
||||
- `/primeport/container/supervision/firstLevelDoor/importAndExportPortInfo/portBasedUnitsPersonnelAndVehicles/list` 进出港信息管理/驻港单位人员及车辆管理
|
||||
- `/primeport/container/supervision/firstLevelDoor/importAndExportPortInfo/inspectDepartmentVehicles/list` 进出港信息管理/检查部门车辆管理
|
||||
- `/primeport/container/supervision/firstLevelDoor/importAndExportPortInfo/vehiclesViolation/vehiclesViolation/list` 进出港信息管理/车辆违规管理/车辆违规管理
|
||||
- `/primeport/container/supervision/firstLevelDoor/importAndExportPortInfo/vehiclesViolation/vehicleBlacklist/list` 进出港信息管理/车辆违规管理/车辆黑名单管理
|
||||
|
||||
#### 封闭区域管理
|
||||
- `/primeport/container/supervision/enclosedArea/enclosedArea/enclosedArea/list` 封闭区域管理/封闭区域管理
|
||||
- `/primeport/container/supervision/enclosedArea/enclosedArea/enclosedAreaDoor/list` 封闭区域管理/封闭区域口门管理
|
||||
- `/primeport/container/supervision/enclosedArea/apply/personnel/list` 封闭区域申请/人员封闭区域申请
|
||||
- `/primeport/container/supervision/enclosedArea/apply/vehicle/list` 封闭区域申请/车辆封闭区域申请
|
||||
- `/primeport/container/supervision/enclosedArea/apply/personnelRecords/list` 封闭区域申请/人员封闭区域申请记录
|
||||
- `/primeport/container/supervision/enclosedArea/apply/vehicleRecords/list` 封闭区域申请/车辆封闭区域申请记录
|
||||
- `/primeport/container/supervision/enclosedArea/personnelAndVehicleStatistics/list` 区域人员及车辆统计
|
||||
|
||||
|
||||
### 企业端
|
||||
- `/primeport/container/enterprise/firstLevelDoor/approverUser` 一级口门管理/门禁审批人管理
|
||||
- `/primeport/container/enterprise/firstLevelDoor/portEntryApproval/personnelApproval/relatedPersonnel` 一级口门管理/进港审批管理/人员审批管理/相关方人员进港审批
|
||||
- `/primeport/container/enterprise/firstLevelDoor/portEntryApproval/longTermVehicleApproval/shareVehicles` 一级口门管理/进港审批管理/长期车辆审批管理/车辆审批
|
||||
- `/primeport/container/enterprise/firstLevelDoor/portEntryApproval/longTermVehicleApproval/relatedVehicles` 一级口门管理/进港审批管理/长期车辆审批管理/相关方车辆审批
|
||||
- `/primeport/container/enterprise/firstLevelDoor/portEntryApproval/temporaryVisitor/temporaryPersonnel/list` 一级口门管理/进港审批管理/临时访客管理/临时人员管理
|
||||
- `/primeport/container/enterprise/firstLevelDoor/portEntryApproval/temporaryVisitor/temporaryVehicle/list` 一级口门管理/进港审批管理/临时访客管理/临时车辆管理
|
||||
- `/primeport/container/enterprise/firstLevelDoor/importAndExportPortInfo/stockPersonnelAndVehicles/list` 一级口门管理/进出港信息管理/人员及车辆管理
|
||||
- `/primeport/container/enterprise/firstLevelDoor/importAndExportPortInfo/personalVehicle/list` 一级口门管理/进出港信息管理/个人车辆管理
|
||||
- `/primeport/container/enterprise/firstLevelDoor/importAndExportPortInfo/stockVehicles/list` 一级口门管理/进出港信息管理/单位车辆管理
|
||||
- `/primeport/container/enterprise/firstLevelDoor/importAndExportPortInfo/stakeholderPersonnelAndVehicles/list` 一级口门管理/进出港信息管理/相关方人员及车辆管理
|
||||
- `/primeport/container/enterprise/firstLevelDoor/importAndExportPortInfo/vehiclesViolation/vehiclesViolation/list` 一级口门管理/进出港信息管理/车辆违规管理/车辆违规管理
|
||||
- `/primeport/container/enterprise/firstLevelDoor/importAndExportPortInfo/vehiclesViolation/vehicleBlacklist/list` 一级口门管理/进出港信息管理/车辆违规管理/车辆黑名单管理
|
||||
#### 一级口门管理
|
||||
- `/primeport/container/enterprise/firstLevelDoor/approverUser` 门禁审批人管理
|
||||
- `/primeport/container/enterprise/firstLevelDoor/portEntryApproval/personnelApproval/relatedPersonnel` 进港审批管理/人员审批管理/相关方人员进港审批
|
||||
- `/primeport/container/enterprise/firstLevelDoor/portEntryApproval/longTermVehicleApproval/shareVehicles` 进港审批管理/长期车辆审批管理/车辆审批
|
||||
- `/primeport/container/enterprise/firstLevelDoor/portEntryApproval/longTermVehicleApproval/relatedVehicles` 进港审批管理/长期车辆审批管理/相关方车辆审批
|
||||
- `/primeport/container/enterprise/firstLevelDoor/portEntryApproval/temporaryVisitor/temporaryPersonnel/list` 进港审批管理/临时访客管理/临时人员管理
|
||||
- `/primeport/container/enterprise/firstLevelDoor/portEntryApproval/temporaryVisitor/temporaryVehicle/list` 进港审批管理/临时访客管理/临时车辆管理
|
||||
- `/primeport/container/enterprise/firstLevelDoor/importAndExportPortInfo/stockPersonnelAndVehicles/list` 进出港信息管理/人员及车辆管理
|
||||
- `/primeport/container/enterprise/firstLevelDoor/importAndExportPortInfo/personalVehicle/list` 进出港信息管理/个人车辆管理
|
||||
- `/primeport/container/enterprise/firstLevelDoor/importAndExportPortInfo/stockVehicles/list` 进出港信息管理/单位车辆管理
|
||||
- `/primeport/container/enterprise/firstLevelDoor/importAndExportPortInfo/stakeholderPersonnelAndVehicles/list` 进出港信息管理/相关方人员及车辆管理
|
||||
- `/primeport/container/enterprise/firstLevelDoor/importAndExportPortInfo/vehiclesViolation/vehiclesViolation/list` 进出港信息管理/车辆违规管理/车辆违规管理
|
||||
- `/primeport/container/enterprise/firstLevelDoor/importAndExportPortInfo/vehiclesViolation/vehicleBlacklist/list` 进出港信息管理/车辆违规管理/车辆黑名单管理
|
||||
|
||||
|
||||
### 相关方端
|
||||
- `/primeport/container/stakeholder/firstLevelDoor/approverUser` 一级口门管理/门禁审批人管理
|
||||
- `/primeport/container/stakeholder/firstLevelDoor/portEntryApproval/longTermVehicleApproval/shareVehicles` 一级口门管理/进港审批管理/长期车辆审批管理/车辆审批
|
||||
- `/primeport/container/stakeholder/firstLevelDoor/portEntryApproval/temporaryVisitor/temporaryPersonnel/list` 一级口门管理/进港审批管理/临时访客管理/临时人员管理
|
||||
- `/primeport/container/stakeholder/firstLevelDoor/portEntryApproval/temporaryVisitor/temporaryVehicle/list` 一级口门管理/进港审批管理/临时访客管理/临时车辆管理
|
||||
- `/primeport/container/stakeholder/firstLevelDoor/importAndExportPortInfo/stockPersonnelAndVehicles/list` 一级口门管理/进出港信息管理/人员及车辆管理
|
||||
- `/primeport/container/stakeholder/firstLevelDoor/importAndExportPortInfo/personalVehicle/list` 一级口门管理/进出港信息管理/个人车辆管理
|
||||
- `/primeport/container/stakeholder/firstLevelDoor/importAndExportPortInfo/vehiclesViolation/vehiclesViolation/list` 一级口门管理/进出港信息管理/车辆违规管理/车辆违规管理
|
||||
- `/primeport/container/stakeholder/firstLevelDoor/importAndExportPortInfo/vehiclesViolation/vehicleBlacklist/list` 一级口门管理/进出港信息管理/车辆违规管理/车辆黑名单管理
|
||||
- `/primeport/container/stakeholder/firstLevelDoor/personnelPermissionRecords/list` 一级口门管理/人员权限记录
|
||||
- `/primeport/container/stakeholder/firstLevelDoor/personnelApplication/list` 一级口门管理/人员申请
|
||||
- `/primeport/container/stakeholder/firstLevelDoor/vehicleApplication/list` 一级口门管理/车辆申请
|
||||
- `/primeport/container/stakeholder/firstLevelDoor/personnelApplicationRecords/list` 一级口门管理/人员申请记录
|
||||
- `/primeport/container/stakeholder/firstLevelDoor/vehicleApplicationRecords/list` 一级口门管理/车辆申请记录
|
||||
#### 一级口门管理
|
||||
- `/primeport/container/stakeholder/firstLevelDoor/approverUser` 门禁审批人管理
|
||||
- `/primeport/container/stakeholder/firstLevelDoor/portEntryApproval/longTermVehicleApproval/shareVehicles` 进港审批管理/长期车辆审批管理/车辆审批
|
||||
- `/primeport/container/stakeholder/firstLevelDoor/portEntryApproval/temporaryVisitor/temporaryPersonnel/list` 进港审批管理/临时访客管理/临时人员管理
|
||||
- `/primeport/container/stakeholder/firstLevelDoor/portEntryApproval/temporaryVisitor/temporaryVehicle/list` 进港审批管理/临时访客管理/临时车辆管理
|
||||
- `/primeport/container/stakeholder/firstLevelDoor/importAndExportPortInfo/stockPersonnelAndVehicles/list` 进出港信息管理/人员及车辆管理
|
||||
- `/primeport/container/stakeholder/firstLevelDoor/importAndExportPortInfo/personalVehicle/list` 进出港信息管理/个人车辆管理
|
||||
- `/primeport/container/stakeholder/firstLevelDoor/importAndExportPortInfo/vehiclesViolation/vehiclesViolation/list` 进出港信息管理/车辆违规管理/车辆违规管理
|
||||
- `/primeport/container/stakeholder/firstLevelDoor/importAndExportPortInfo/vehiclesViolation/vehicleBlacklist/list` 进出港信息管理/车辆违规管理/车辆黑名单管理
|
||||
- `/primeport/container/stakeholder/firstLevelDoor/personnelPermissionRecords/list` 人员权限记录
|
||||
- `/primeport/container/stakeholder/firstLevelDoor/personnelApplication/list` 人员申请
|
||||
- `/primeport/container/stakeholder/firstLevelDoor/vehicleApplication/list` 车辆申请
|
||||
- `/primeport/container/stakeholder/firstLevelDoor/personnelApplicationRecords/list` 人员申请记录
|
||||
- `/primeport/container/stakeholder/firstLevelDoor/vehicleApplicationRecords/list` 车辆申请记录
|
||||
|
||||
|
||||
### H5端
|
||||
- `/primeport/container/mobile/firstLevelDoor/personnelApplication/apply` 一级口门管理/人员申请/申请
|
||||
- `/primeport/container/mobile/firstLevelDoor/personnelApplication/applyList` 一级口门管理/人员申请/申请记录
|
||||
- `/primeport/container/mobile/firstLevelDoor/personnelApplication/apply` 人员申请/申请
|
||||
- `/primeport/container/mobile/firstLevelDoor/personnelApplication/applyList` 人员申请/申请记录
|
||||
|
|
|
|||
|
|
@ -0,0 +1,34 @@
|
|||
import { declareRequest } from "@cqsjjb/jjb-dva-runtime";
|
||||
|
||||
export const enclosedAreaList = declareRequest(
|
||||
"enclosedAreaLoading",
|
||||
`Post > @/primeport/`,
|
||||
);
|
||||
export const enclosedAreaDetailList = declareRequest(
|
||||
"enclosedAreaLoading",
|
||||
`Post > @/primeport/`,
|
||||
);
|
||||
export const enclosedAreaDetailListTree = declareRequest(
|
||||
"enclosedAreaLoading",
|
||||
`Post > @/primeport/`,
|
||||
);
|
||||
export const enclosedAreaDetailDelete = declareRequest(
|
||||
"enclosedAreaLoading",
|
||||
`Post > @/primeport/`,
|
||||
);
|
||||
export const enclosedAreaDetailAdd = declareRequest(
|
||||
"enclosedAreaLoading",
|
||||
`Post > @/primeport/`,
|
||||
);
|
||||
export const enclosedAreaDetailUpdate = declareRequest(
|
||||
"enclosedAreaLoading",
|
||||
`Post > @/primeport/`,
|
||||
);
|
||||
export const enclosedAreaDetailInfo = declareRequest(
|
||||
"enclosedAreaLoading",
|
||||
`Post > @/primeport/`,
|
||||
);
|
||||
export const enclosedAreaDetailSaveElectronicFence = declareRequest(
|
||||
"enclosedAreaLoading",
|
||||
`Post > @/primeport/`,
|
||||
);
|
||||
|
|
@ -0,0 +1,30 @@
|
|||
import { declareRequest } from "@cqsjjb/jjb-dva-runtime";
|
||||
|
||||
export const enclosedAreaPersonnelApplyList = declareRequest(
|
||||
"enclosedAreaPersonnelApplyLoading",
|
||||
`Post > @/primeport/`,
|
||||
);
|
||||
export const enclosedAreaPersonnelApplyInfo = declareRequest(
|
||||
"enclosedAreaPersonnelApplyLoading",
|
||||
`Post > @/primeport/`,
|
||||
);
|
||||
export const enclosedAreaPersonnelApplyEntourageList = declareRequest(
|
||||
"enclosedAreaPersonnelApplyLoading",
|
||||
`Post > @/primeport/`,
|
||||
);
|
||||
export const enclosedAreaPersonnelApplySave = declareRequest(
|
||||
"enclosedAreaPersonnelApplyLoading",
|
||||
`Post > @/primeport/`,
|
||||
);
|
||||
export const enclosedAreaPersonnelApplyRecordsList = declareRequest(
|
||||
"enclosedAreaPersonnelApplyLoading",
|
||||
`Post > @/primeport/`,
|
||||
);
|
||||
export const enclosedAreaPersonnelApplyRecordsAccessRecordsList = declareRequest(
|
||||
"enclosedAreaPersonnelApplyLoading",
|
||||
`Post > @/primeport/`,
|
||||
);
|
||||
export const enclosedAreaPersonnelApplyRecordsRejectReason = declareRequest(
|
||||
"enclosedAreaPersonnelApplyLoading",
|
||||
`Post > @/primeport/`,
|
||||
);
|
||||
|
|
@ -0,0 +1,30 @@
|
|||
import { declareRequest } from "@cqsjjb/jjb-dva-runtime";
|
||||
|
||||
export const enclosedAreaVehicleApplyList = declareRequest(
|
||||
"enclosedAreaVehicleApplyLoading",
|
||||
`Post > @/primeport/`,
|
||||
);
|
||||
export const enclosedAreaVehicleApplyInfo = declareRequest(
|
||||
"enclosedAreaVehicleApplyLoading",
|
||||
`Post > @/primeport/`,
|
||||
);
|
||||
export const enclosedAreaVehicleApplyVehicleList = declareRequest(
|
||||
"enclosedAreaVehicleApplyLoading",
|
||||
`Post > @/primeport/`,
|
||||
);
|
||||
export const enclosedAreaVehicleApplySave = declareRequest(
|
||||
"enclosedAreaVehicleApplyLoading",
|
||||
`Post > @/primeport/`,
|
||||
);
|
||||
export const enclosedAreaVehicleApplyRecordsList = declareRequest(
|
||||
"enclosedAreaVehicleApplyLoading",
|
||||
`Post > @/primeport/`,
|
||||
);
|
||||
export const enclosedAreaVehicleApplyRecordsAccessRecordsList = declareRequest(
|
||||
"enclosedAreaVehicleApplyLoading",
|
||||
`Post > @/primeport/`,
|
||||
);
|
||||
export const enclosedAreaVehicleApplyRecordsRejectReason = declareRequest(
|
||||
"enclosedAreaVehicleApplyLoading",
|
||||
`Post > @/primeport/`,
|
||||
);
|
||||
|
|
@ -0,0 +1,14 @@
|
|||
import { declareRequest } from "@cqsjjb/jjb-dva-runtime";
|
||||
|
||||
export const enclosedPersonnelAndVehicleStatisticsList = declareRequest(
|
||||
"enclosedPersonnelAndVehicleStatisticsLoading",
|
||||
`Post > @/primeport/`,
|
||||
);
|
||||
export const enclosedPersonnelAndVehicleStatisticsVehicleEntryAndExitRecordsList = declareRequest(
|
||||
"enclosedPersonnelAndVehicleStatisticsLoading",
|
||||
`Post > @/primeport/`,
|
||||
);
|
||||
export const enclosedPersonnelAndVehicleStatisticsPersonnelEntryAndExitRecordsList = declareRequest(
|
||||
"enclosedPersonnelAndVehicleStatisticsLoading",
|
||||
`Post > @/primeport/`,
|
||||
);
|
||||
|
|
@ -0,0 +1,360 @@
|
|||
import { CheckOutlined, DeleteOutlined } from "@ant-design/icons";
|
||||
import { useMount } from "ahooks";
|
||||
import { Input, message, Modal } from "antd";
|
||||
import { useEffect, useRef, useState } from "react";
|
||||
import CesiumMap from "zy-react-library/components/Map/CesiumMap";
|
||||
import { dynamicLoadCss, dynamicLoadJs } from "zy-react-library/utils";
|
||||
|
||||
const ElectronicFenceModal = (props) => {
|
||||
const { position } = props;
|
||||
const [latitudeAndLongitudeSet, setLatitudeAndLongitudeSet] = useState("");
|
||||
const [isDrawing, setIsDrawing] = useState(true); // 是否正在绘制
|
||||
const [isCompleted, setIsCompleted] = useState(false); // 是否已完成绘制
|
||||
|
||||
const mapContainerRef = useRef(null); // 存储地图容器引用
|
||||
const mapInstanceRef = useRef(null); // 存储地图实例
|
||||
const pointsRef = useRef([]); // 存储所有点击的点位
|
||||
const entitiesRef = useRef([]); // 存储所有绘制的实体(点位和线条)
|
||||
const handlerRef = useRef(null); // 存储鼠标点击事件处理器
|
||||
const isDrawingRef = useRef(isDrawing); // 使用ref存储isDrawing
|
||||
const isCompletedRef = useRef(isCompleted); // 使用ref存储isCompleted
|
||||
|
||||
// 同步状态到ref
|
||||
useEffect(() => {
|
||||
isDrawingRef.current = isDrawing;
|
||||
}, [isDrawing]);
|
||||
|
||||
useEffect(() => {
|
||||
isCompletedRef.current = isCompleted;
|
||||
}, [isCompleted]);
|
||||
|
||||
// 从position字符串解析点位数组
|
||||
const parsePositionString = (positionStr) => {
|
||||
if (!positionStr)
|
||||
return [];
|
||||
return positionStr.split(";").map((coord) => {
|
||||
const [longitude, latitude] = coord.split(",");
|
||||
return { longitude: Number(longitude), latitude: Number(latitude) };
|
||||
});
|
||||
};
|
||||
|
||||
// 将笛卡尔坐标转换为经纬度点位
|
||||
const convertCartesianToPoint = (cartesian) => {
|
||||
const cartographic = window.Cesium.Cartographic.fromCartesian(cartesian);
|
||||
const longitude = window.Cesium.Math.toDegrees(cartographic.longitude);
|
||||
const latitude = window.Cesium.Math.toDegrees(cartographic.latitude);
|
||||
return { longitude, latitude };
|
||||
};
|
||||
|
||||
// 在地图上添加点位
|
||||
const addPoint = (point) => {
|
||||
const viewer = mapInstanceRef.current;
|
||||
if (!viewer)
|
||||
return;
|
||||
|
||||
pointsRef.current.push(point);
|
||||
|
||||
const pointEntity = viewer.entities.add({
|
||||
position: window.Cesium.Cartesian3.fromDegrees(point.longitude, point.latitude),
|
||||
point: {
|
||||
pixelSize: 10,
|
||||
color: window.Cesium.Color.RED,
|
||||
outlineColor: window.Cesium.Color.WHITE,
|
||||
outlineWidth: 2,
|
||||
verticalOrigin: window.Cesium.VerticalOrigin.BOTTOM,
|
||||
horizontalOrigin: window.Cesium.HorizontalOrigin.CENTER,
|
||||
heightReference: window.Cesium.HeightReference.CLAMP_TO_GROUND,
|
||||
disableDepthTestDistance: Number.POSITIVE_INFINITY,
|
||||
clampToGround: true,
|
||||
},
|
||||
});
|
||||
entitiesRef.current.push(pointEntity);
|
||||
};
|
||||
|
||||
// 在两点之间绘制连线
|
||||
const drawLineBetweenPoints = (startPoint, endPoint) => {
|
||||
const viewer = mapInstanceRef.current;
|
||||
if (!viewer)
|
||||
return;
|
||||
|
||||
const lineEntity = viewer.entities.add({
|
||||
polyline: {
|
||||
positions: window.Cesium.Cartesian3.fromDegreesArray([
|
||||
startPoint.longitude,
|
||||
startPoint.latitude,
|
||||
endPoint.longitude,
|
||||
endPoint.latitude,
|
||||
]),
|
||||
width: 3,
|
||||
material: window.Cesium.Color.RED,
|
||||
verticalOrigin: window.Cesium.VerticalOrigin.BOTTOM,
|
||||
horizontalOrigin: window.Cesium.HorizontalOrigin.CENTER,
|
||||
heightReference: window.Cesium.HeightReference.CLAMP_TO_GROUND,
|
||||
disableDepthTestDistance: Number.POSITIVE_INFINITY,
|
||||
clampToGround: true,
|
||||
},
|
||||
});
|
||||
entitiesRef.current.push(lineEntity);
|
||||
};
|
||||
|
||||
// 绘制多边形填充
|
||||
const drawPolygonFill = (points) => {
|
||||
const viewer = mapInstanceRef.current;
|
||||
if (!viewer)
|
||||
return;
|
||||
|
||||
const positions = points.flatMap(point => [point.longitude, point.latitude]);
|
||||
const polygonEntity = viewer.entities.add({
|
||||
polygon: {
|
||||
hierarchy: window.Cesium.Cartesian3.fromDegreesArray(positions),
|
||||
material: window.Cesium.Color.RED.withAlpha(0.2),
|
||||
},
|
||||
});
|
||||
entitiesRef.current.push(polygonEntity);
|
||||
};
|
||||
|
||||
// 更新经纬度显示
|
||||
const updateLatitudeAndLongitudeDisplay = () => {
|
||||
const points = pointsRef.current;
|
||||
if (points.length === 0) {
|
||||
setLatitudeAndLongitudeSet("");
|
||||
return;
|
||||
}
|
||||
|
||||
const coordinateString = points
|
||||
.map(point => `${point.longitude},${point.latitude}`)
|
||||
.join(";");
|
||||
setLatitudeAndLongitudeSet(coordinateString);
|
||||
};
|
||||
|
||||
// 清除绘制
|
||||
const handleClearDrawing = () => {
|
||||
const viewer = mapInstanceRef.current;
|
||||
if (!viewer)
|
||||
return;
|
||||
|
||||
// 清除所有绘制的实体
|
||||
entitiesRef.current.forEach((entity) => {
|
||||
viewer.entities.remove(entity);
|
||||
});
|
||||
|
||||
// 清空数组和状态
|
||||
pointsRef.current = [];
|
||||
entitiesRef.current = [];
|
||||
setLatitudeAndLongitudeSet("");
|
||||
setIsCompleted(false);
|
||||
setIsDrawing(true);
|
||||
};
|
||||
|
||||
// 根据position绘制已存在的围栏
|
||||
const drawExistingFence = (positionStr) => {
|
||||
const viewer = mapInstanceRef.current;
|
||||
if (!viewer || !positionStr)
|
||||
return;
|
||||
|
||||
const points = parsePositionString(positionStr);
|
||||
if (points.length === 0)
|
||||
return;
|
||||
|
||||
// 绘制所有点位
|
||||
points.forEach(point => addPoint(point));
|
||||
|
||||
// 绘制连线
|
||||
for (let i = 0; i < points.length - 1; i++) {
|
||||
drawLineBetweenPoints(points[i], points[i + 1]);
|
||||
}
|
||||
|
||||
// 将最后一个点和第一个点相连
|
||||
drawLineBetweenPoints(points[points.length - 1], points[0]);
|
||||
|
||||
// 绘制多边形填充
|
||||
drawPolygonFill(points);
|
||||
|
||||
// 更新状态
|
||||
setIsCompleted(true);
|
||||
setIsDrawing(false);
|
||||
setLatitudeAndLongitudeSet(positionStr);
|
||||
};
|
||||
|
||||
// 监听position变化
|
||||
useEffect(() => {
|
||||
if (position && mapInstanceRef.current) {
|
||||
// 清除现有绘制
|
||||
handleClearDrawing();
|
||||
// 绘制传入的围栏
|
||||
drawExistingFence(position);
|
||||
}
|
||||
}, [position]);
|
||||
|
||||
// 处理地图点击事件
|
||||
const handleMapClick = (movement) => {
|
||||
const viewer = mapInstanceRef.current;
|
||||
if (!viewer || !isDrawingRef.current || isCompletedRef.current)
|
||||
return;
|
||||
|
||||
// 获取点击位置的三维坐标
|
||||
const cartesian = viewer.camera.pickEllipsoid(
|
||||
movement.position,
|
||||
viewer.scene.globe.ellipsoid,
|
||||
);
|
||||
|
||||
if (window.Cesium.defined(cartesian)) {
|
||||
const point = convertCartesianToPoint(cartesian);
|
||||
addPoint(point);
|
||||
if (pointsRef.current.length > 1) {
|
||||
drawLineBetweenPoints(pointsRef.current[pointsRef.current.length - 2], point);
|
||||
}
|
||||
updateLatitudeAndLongitudeDisplay();
|
||||
}
|
||||
};
|
||||
|
||||
// 初始化地图
|
||||
const initMap = () => {
|
||||
if (mapContainerRef.current) {
|
||||
if (!mapInstanceRef.current) {
|
||||
const { init, flyTo } = new CesiumMap();
|
||||
const { viewer } = init();
|
||||
mapInstanceRef.current = viewer;
|
||||
flyTo({ longitude: window.mapLongitude, latitude: window.mapLatitude, height: 900000 });
|
||||
|
||||
// 设置鼠标点击事件
|
||||
const handler = new window.Cesium.ScreenSpaceEventHandler(viewer.scene.canvas);
|
||||
handler.setInputAction(handleMapClick, window.Cesium.ScreenSpaceEventType.LEFT_CLICK);
|
||||
handlerRef.current = handler;
|
||||
|
||||
// 如果传入了position参数,则绘制已存在的围栏
|
||||
if (position) {
|
||||
drawExistingFence(position);
|
||||
}
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
// 加载Cesium地图
|
||||
const loadCesiumMap = async () => {
|
||||
if (!window.Cesium) {
|
||||
if (window?.base?.loadDynamicResource) {
|
||||
await window.base.loadDynamicResource({
|
||||
url: "https://cesium.com/downloads/cesiumjs/releases/1.91/Build/Cesium/Cesium.js",
|
||||
type: "script",
|
||||
attr: { type: "text/javascript" },
|
||||
});
|
||||
await window.base.loadDynamicResource({
|
||||
url: "https://cesium.com/downloads/cesiumjs/releases/1.91/Build/Cesium/Widgets/widgets.css",
|
||||
type: "link",
|
||||
attr: { rel: "stylesheet", type: "text/css" },
|
||||
});
|
||||
initMap();
|
||||
}
|
||||
else {
|
||||
await dynamicLoadJs("https://cesium.com/downloads/cesiumjs/releases/1.91/Build/Cesium/Cesium.js");
|
||||
await dynamicLoadCss("https://cesium.com/downloads/cesiumjs/releases/1.91/Build/Cesium/Widgets/widgets.css");
|
||||
initMap();
|
||||
}
|
||||
}
|
||||
else {
|
||||
initMap();
|
||||
}
|
||||
};
|
||||
|
||||
// 完成绘制
|
||||
const handleCompleteDrawing = () => {
|
||||
// 如果已经完成绘制,提示需要先清除
|
||||
if (isCompleted) {
|
||||
message.warning("若已完成绘制,请先点击清除绘制按钮。");
|
||||
return;
|
||||
}
|
||||
|
||||
if (pointsRef.current.length < 3) {
|
||||
// 至少需要3个点才能形成闭合区域
|
||||
message.warning("至少需要3个点才能完成绘制");
|
||||
return;
|
||||
}
|
||||
|
||||
const points = pointsRef.current;
|
||||
const firstPoint = points[0];
|
||||
const lastPoint = points[points.length - 1];
|
||||
|
||||
// 将最后一个点和第一个点相连
|
||||
drawLineBetweenPoints(lastPoint, firstPoint);
|
||||
|
||||
// 绘制多边形填充
|
||||
drawPolygonFill(points);
|
||||
|
||||
setIsCompleted(true);
|
||||
setIsDrawing(false);
|
||||
};
|
||||
|
||||
useMount(() => {
|
||||
loadCesiumMap();
|
||||
return () => {
|
||||
if (mapInstanceRef.current) {
|
||||
try {
|
||||
mapInstanceRef.current.destroy();
|
||||
mapInstanceRef.current = null;
|
||||
}
|
||||
catch (e) {
|
||||
console.warn("Error destroying map on unmount:", e);
|
||||
}
|
||||
mapInstanceRef.current = null;
|
||||
}
|
||||
};
|
||||
});
|
||||
|
||||
return (
|
||||
<Modal
|
||||
open
|
||||
title="电子围栏"
|
||||
maskClosable={false}
|
||||
onCancel={props?.onCancel}
|
||||
onOk={() => {
|
||||
if (!isCompleted) {
|
||||
message.warning("若已完成绘制，请先点击完成绘制按钮。");
|
||||
return;
|
||||
}
|
||||
props?.onOk(latitudeAndLongitudeSet);
|
||||
}}
|
||||
confirmLoading={props?.confirmLoading}
|
||||
width={800}
|
||||
>
|
||||
<div
|
||||
ref={mapContainerRef}
|
||||
id="map_container"
|
||||
style={{ width: "100%", height: "500px" }}
|
||||
/>
|
||||
<div style={{ display: "flex", gap: 15, alignItems: "center", marginTop: 16 }}>
|
||||
<div
|
||||
style={{
|
||||
display: "flex",
|
||||
flexDirection: "column",
|
||||
alignItems: "center",
|
||||
cursor: isDrawing && !isCompleted ? "pointer" : "not-allowed",
|
||||
opacity: isDrawing && !isCompleted ? 1 : 0.5,
|
||||
}}
|
||||
onClick={handleCompleteDrawing}
|
||||
>
|
||||
<CheckOutlined style={{ fontSize: 16 }} />
|
||||
<span style={{ fontSize: 12, color: "#666" }}>完成绘制</span>
|
||||
</div>
|
||||
<div
|
||||
style={{
|
||||
display: "flex",
|
||||
flexDirection: "column",
|
||||
alignItems: "center",
|
||||
cursor: "pointer",
|
||||
}}
|
||||
onClick={handleClearDrawing}
|
||||
>
|
||||
<DeleteOutlined style={{ fontSize: 16 }} />
|
||||
<span style={{ fontSize: 12, color: "#666" }}>清除绘制</span>
|
||||
</div>
|
||||
<div style={{ flex: 1, display: "flex", alignItems: "center", gap: 8 }}>
|
||||
<div style={{ width: "100px" }}>区域经纬度：</div>
|
||||
<Input value={latitudeAndLongitudeSet} readOnly />
|
||||
</div>
|
||||
</div>
|
||||
</Modal>
|
||||
);
|
||||
};
|
||||
|
||||
export default ElectronicFenceModal;
|
||||
|
|
@ -0,0 +1,48 @@
|
|||
import { message, Modal } from "antd";
|
||||
import { useRef } from "react";
|
||||
import Signature from "zy-react-library/components/Signature";
|
||||
|
||||
const NeedToKnowModal = (props) => {
|
||||
const signatureUrl = useRef("");
|
||||
const signatureFile = useRef({});
|
||||
|
||||
return (
|
||||
<Modal
|
||||
open
|
||||
title="安全进港须知"
|
||||
width={800}
|
||||
maskClosable={false}
|
||||
onCancel={props.onCancel}
|
||||
onOk={() => {
|
||||
if (!signatureUrl.current) {
|
||||
message.warning("请签名");
|
||||
return;
|
||||
}
|
||||
props.onOk({
|
||||
base64: signatureUrl.current,
|
||||
file: signatureFile.current,
|
||||
});
|
||||
}}
|
||||
>
|
||||
<div>
|
||||
<p style={{ textAlign: "justify", textIndent: "2rem" }}>欢迎您到访秦皇岛港。为保障您的人身安全及港口生产作业秩序，请注意港口属于重点安全监管区域，存在大型机械作业、货物装卸、车辆往来等生产场景，可能面临机械伤害、物体打击、车辆碰撞等安全风险。请您认真阅读以下须知内容，确认遵守后签字：</p>
|
||||
<p style={{ textAlign: "justify", textIndent: "2rem" }}>1. 入港时请主动出示有效身份证件，配合安保人员进行身份核验与信息登记，凭港口核发的《临时访客证》入港，自觉接受出港查验；不转借、冒用访客凭证，不将无关人员带入港口。</p>
|
||||
<p style={{ textAlign: "justify", textIndent: "2rem" }}>2. 入港后请严格在指定区域活动，未经陪同人员及港口负责人许可，绝不擅自进入标有“禁止入内”“危险区域”等标识的场所，不靠近起重机械、输送设备、危险品存储点等高危部位，不跨越安全护栏、警戒线，不在作业区域逗留围观。</p>
|
||||
<p style={{ textAlign: "justify", textIndent: "2rem" }}>3. 遵守港口生产秩序，不干扰装卸、运输、检修等正常工作；不随意触摸、操作生产设备、仪器仪表及安全设施，不移动、遮挡安全警示标识；如需拍摄港口场景，须提前征得港口方同意，不拍摄涉及安全、商业秘密的内容。</p>
|
||||
<p style={{ textAlign: "justify", textIndent: "2rem" }}>4. 严格遵守消防安全规定，不在港口内吸烟，不携带火种、易燃易爆物品、管制器具等违禁物品入港；发现火灾、设备故障等隐患或突发情况，第一时间告知陪同人员或港口工作人员，配合应急处置，不擅自行动引发次生风险。</p>
|
||||
<p style={{ textAlign: "justify", textIndent: "2rem" }}>5. 注意自身安全防护，行走时主动避让作业车辆与机械，不擅自横穿作业通道；雨天、雾天等恶劣天气下，听从陪同人员安排，加强安全防范。</p>
|
||||
<p style={{ textAlign: "justify", textIndent: "2rem" }}>6. 已知晓港口所去区域应急逃生路线，遇紧急情况按港口指引有序疏散。</p>
|
||||
<p>本人确认已完整阅读并理解以上须知，承诺严格遵守。如因违反本须知及港口安全规定导致自身人身伤害或港口、他人财产损失，自愿承担全部责任。</p>
|
||||
</div>
|
||||
<Signature
|
||||
onConfirm={(value) => {
|
||||
signatureUrl.current = value.base64;
|
||||
signatureFile.current = value.file;
|
||||
}}
|
||||
url={props.signatureUrl}
|
||||
/>
|
||||
</Modal>
|
||||
);
|
||||
};
|
||||
|
||||
export default NeedToKnowModal;
|
||||
|
|
@ -24,3 +24,7 @@ export const NS_VEHICLE_BLACKLIST = defineNamespace("vehicleBlacklist");
|
|||
export const NS_PERSONNEL_PERMISSION_RECORDS = defineNamespace("personnelPermissionRecords");
|
||||
export const NS_PERSONNEL_APPLICATION = defineNamespace("personnelApplication");
|
||||
export const NS_VEHICLE_APPLICATION = defineNamespace("vehicleApplication");
|
||||
export const NS_ENCLOSED_AREA = defineNamespace("enclosedArea");
|
||||
export const NS_ENCLOSED_AREA_PERSONNEL_APPLY = defineNamespace("enclosedAreaPersonnelApply");
|
||||
export const NS_ENCLOSED_AREA_VEHICLE_APPLY = defineNamespace("enclosedAreaVehicleApply");
|
||||
export const NS_ENCLOSED_PERSONNEL_AND_VEHICLE_STATISTICS = defineNamespace("enclosedPersonnelAndVehicleStatistics");
|
||||
|
|
|
|||
|
|
@ -4,9 +4,9 @@ import { useRef, useState } from "react";
|
|||
import FormBuilder from "zy-react-library/components/FormBuilder";
|
||||
import Page from "zy-react-library/components/Page";
|
||||
import DictionarySelect from "zy-react-library/components/Select/Dictionary";
|
||||
import Signature from "zy-react-library/components/Signature";
|
||||
import Table from "zy-react-library/components/Table";
|
||||
import { FORM_ITEM_RENDER_ENUM } from "zy-react-library/enum/formItemRender";
|
||||
import NeedToKnowModal from "~/components/NeedToKnowModal";
|
||||
import { NS_PERSONNEL_APPLICATION } from "~/enumerate/namespace";
|
||||
|
||||
function Add(props) {
|
||||
|
|
@ -130,7 +130,7 @@ function Add(props) {
|
|||
setAddPersonnelModalVisible(false);
|
||||
}}
|
||||
onOk={(values) => {
|
||||
setPersonnelList([...personnelList, values]);
|
||||
setPersonnelList(values);
|
||||
setAddPersonnelModalVisible(false);
|
||||
}}
|
||||
/>
|
||||
|
|
@ -156,8 +156,9 @@ function Add(props) {
|
|||
}
|
||||
|
||||
const AddPersonnelModalComponent = (props) => {
|
||||
const [selectedRowKeys, setSelectedRowKeys] = useState([]);
|
||||
const selectedRowsRef = useRef([]);
|
||||
const [selectedRowKeys, setSelectedRowKeys] = useState(props.personnelList.map(item => item.id));
|
||||
|
||||
const selectedRowsRef = useRef(props.personnelList || []);
|
||||
|
||||
return (
|
||||
<Modal
|
||||
|
|
@ -199,49 +200,6 @@ const AddPersonnelModalComponent = (props) => {
|
|||
);
|
||||
};
|
||||
|
||||
const NeedToKnowModal = (props) => {
|
||||
const signatureUrl = useRef("");
|
||||
const signatureFile = useRef({});
|
||||
|
||||
return (
|
||||
<Modal
|
||||
open
|
||||
title="安全进港须知"
|
||||
width={800}
|
||||
maskClosable={false}
|
||||
onCancel={props.onCancel}
|
||||
onOk={() => {
|
||||
if (!signatureUrl.current) {
|
||||
message.warning("请签名");
|
||||
return;
|
||||
}
|
||||
props.onOk({
|
||||
base64: signatureUrl.current,
|
||||
file: signatureFile.current,
|
||||
});
|
||||
}}
|
||||
>
|
||||
<div>
|
||||
<p style={{ textAlign: "justify", textIndent: "2rem" }}>欢迎您到访秦皇岛港。为保障您的人身安全及港口生产作业秩序，请注意港口属于重点安全监管区域，存在大型机械作业、货物装卸、车辆往来等生产场景，可能面临机械伤害、物体打击、车辆碰撞等安全风险。请您认真阅读以下须知内容，确认遵守后签字：</p>
|
||||
<p style={{ textAlign: "justify", textIndent: "2rem" }}>1. 入港时请主动出示有效身份证件，配合安保人员进行身份核验与信息登记，凭港口核发的《临时访客证》入港，自觉接受出港查验；不转借、冒用访客凭证，不将无关人员带入港口。</p>
|
||||
<p style={{ textAlign: "justify", textIndent: "2rem" }}>2. 入港后请严格在指定区域活动，未经陪同人员及港口负责人许可，绝不擅自进入标有“禁止入内”“危险区域”等标识的场所，不靠近起重机械、输送设备、危险品存储点等高危部位，不跨越安全护栏、警戒线，不在作业区域逗留围观。</p>
|
||||
<p style={{ textAlign: "justify", textIndent: "2rem" }}>3. 遵守港口生产秩序，不干扰装卸、运输、检修等正常工作；不随意触摸、操作生产设备、仪器仪表及安全设施，不移动、遮挡安全警示标识；如需拍摄港口场景，须提前征得港口方同意，不拍摄涉及安全、商业秘密的内容。</p>
|
||||
<p style={{ textAlign: "justify", textIndent: "2rem" }}>4. 严格遵守消防安全规定，不在港口内吸烟，不携带火种、易燃易爆物品、管制器具等违禁物品入港；发现火灾、设备故障等隐患或突发情况，第一时间告知陪同人员或港口工作人员，配合应急处置，不擅自行动引发次生风险。</p>
|
||||
<p style={{ textAlign: "justify", textIndent: "2rem" }}>5. 注意自身安全防护，行走时主动避让作业车辆与机械，不擅自横穿作业通道；雨天、雾天等恶劣天气下，听从陪同人员安排，加强安全防范。</p>
|
||||
<p style={{ textAlign: "justify", textIndent: "2rem" }}>6. 已知晓港口所去区域应急逃生路线，遇紧急情况按港口指引有序疏散。</p>
|
||||
<p>本人确认已完整阅读并理解以上须知，承诺严格遵守。如因违反本须知及港口安全规定导致自身人身伤害或港口、他人财产损失，自愿承担全部责任。</p>
|
||||
</div>
|
||||
<Signature
|
||||
onConfirm={(value) => {
|
||||
signatureUrl.current = value.base64;
|
||||
signatureFile.current = value.file;
|
||||
}}
|
||||
url={props.signatureUrl}
|
||||
/>
|
||||
</Modal>
|
||||
);
|
||||
};
|
||||
|
||||
const AddPersonnelModal = Connect([NS_PERSONNEL_APPLICATION], true)(AddPersonnelModalComponent);
|
||||
|
||||
export default Connect([NS_PERSONNEL_APPLICATION], true)(Add);
|
||||
|
|
|
|||
|
|
@ -1,15 +1,15 @@
|
|||
import { Connect } from "@cqsjjb/jjb-dva-runtime";
|
||||
import { Button, Form, message, Modal } from "antd";
|
||||
import { Button, Form, message } from "antd";
|
||||
import { useRef, useState } from "react";
|
||||
import FormBuilder from "zy-react-library/components/FormBuilder";
|
||||
import Page from "zy-react-library/components/Page";
|
||||
import DictionarySelect from "zy-react-library/components/Select/Dictionary";
|
||||
import PersonnelSelect from "zy-react-library/components/Select/Personnel/Gwj";
|
||||
import DepartmentSelectTree from "zy-react-library/components/SelectTree/Department/Gwj";
|
||||
import Signature from "zy-react-library/components/Signature";
|
||||
import Upload from "zy-react-library/components/Upload";
|
||||
import { FORM_ITEM_RENDER_ENUM } from "zy-react-library/enum/formItemRender";
|
||||
import { LICENSE_PLATE_NUMBER } from "zy-react-library/regular";
|
||||
import NeedToKnowModal from "~/components/NeedToKnowModal";
|
||||
import { NS_VEHICLE_APPLICATION } from "~/enumerate/namespace";
|
||||
|
||||
function Add(props) {
|
||||
|
|
@ -51,7 +51,6 @@ function Add(props) {
|
|||
{ name: "todo11", label: "车牌号", rules: [{ pattern: LICENSE_PLATE_NUMBER, message: "请输入正确的车牌号" }] },
|
||||
{ name: "todo12", label: "车辆照片", span: 24, render: (<Upload />) },
|
||||
{ name: "todo13", label: "行驶证照片", span: 24, render: (<Upload />) },
|
||||
{ name: "todo14", label: "机动车登记证书", span: 24, render: (<Upload />) },
|
||||
{
|
||||
name: "todo15",
|
||||
label: " ",
|
||||
|
|
@ -100,47 +99,4 @@ function Add(props) {
|
|||
);
|
||||
}
|
||||
|
||||
const NeedToKnowModal = (props) => {
|
||||
const signatureUrl = useRef("");
|
||||
const signatureFile = useRef({});
|
||||
|
||||
return (
|
||||
<Modal
|
||||
open
|
||||
title="安全进港须知"
|
||||
width={800}
|
||||
maskClosable={false}
|
||||
onCancel={props.onCancel}
|
||||
onOk={() => {
|
||||
if (!signatureUrl.current) {
|
||||
message.warning("请签名");
|
||||
return;
|
||||
}
|
||||
props.onOk({
|
||||
base64: signatureUrl.current,
|
||||
file: signatureFile.current,
|
||||
});
|
||||
}}
|
||||
>
|
||||
<div>
|
||||
<p style={{ textAlign: "justify", textIndent: "2rem" }}>欢迎您到访秦皇岛港。为保障您的人身安全及港口生产作业秩序，请注意港口属于重点安全监管区域，存在大型机械作业、货物装卸、车辆往来等生产场景，可能面临机械伤害、物体打击、车辆碰撞等安全风险。请您认真阅读以下须知内容，确认遵守后签字：</p>
|
||||
<p style={{ textAlign: "justify", textIndent: "2rem" }}>1. 入港时请主动出示有效身份证件，配合安保人员进行身份核验与信息登记，凭港口核发的《临时访客证》入港，自觉接受出港查验；不转借、冒用访客凭证，不将无关人员带入港口。</p>
|
||||
<p style={{ textAlign: "justify", textIndent: "2rem" }}>2. 入港后请严格在指定区域活动，未经陪同人员及港口负责人许可，绝不擅自进入标有“禁止入内”“危险区域”等标识的场所，不靠近起重机械、输送设备、危险品存储点等高危部位，不跨越安全护栏、警戒线，不在作业区域逗留围观。</p>
|
||||
<p style={{ textAlign: "justify", textIndent: "2rem" }}>3. 遵守港口生产秩序，不干扰装卸、运输、检修等正常工作；不随意触摸、操作生产设备、仪器仪表及安全设施，不移动、遮挡安全警示标识；如需拍摄港口场景，须提前征得港口方同意，不拍摄涉及安全、商业秘密的内容。</p>
|
||||
<p style={{ textAlign: "justify", textIndent: "2rem" }}>4. 严格遵守消防安全规定，不在港口内吸烟，不携带火种、易燃易爆物品、管制器具等违禁物品入港；发现火灾、设备故障等隐患或突发情况，第一时间告知陪同人员或港口工作人员，配合应急处置，不擅自行动引发次生风险。</p>
|
||||
<p style={{ textAlign: "justify", textIndent: "2rem" }}>5. 注意自身安全防护，行走时主动避让作业车辆与机械，不擅自横穿作业通道；雨天、雾天等恶劣天气下，听从陪同人员安排，加强安全防范。</p>
|
||||
<p style={{ textAlign: "justify", textIndent: "2rem" }}>6. 已知晓港口所去区域应急逃生路线，遇紧急情况按港口指引有序疏散。</p>
|
||||
<p>本人确认已完整阅读并理解以上须知，承诺严格遵守。如因违反本须知及港口安全规定导致自身人身伤害或港口、他人财产损失，自愿承担全部责任。</p>
|
||||
</div>
|
||||
<Signature
|
||||
onConfirm={(value) => {
|
||||
signatureUrl.current = value.base64;
|
||||
signatureFile.current = value.file;
|
||||
}}
|
||||
url={props.signatureUrl}
|
||||
/>
|
||||
</Modal>
|
||||
);
|
||||
};
|
||||
|
||||
export default Connect([NS_VEHICLE_APPLICATION], true)(Add);
|
||||
|
|
|
|||
|
|
@ -0,0 +1,239 @@
|
|||
import { Connect } from "@cqsjjb/jjb-dva-runtime";
|
||||
import { Button, Form, message, Modal } from "antd";
|
||||
import { useRef, useState } from "react";
|
||||
import FormBuilder from "zy-react-library/components/FormBuilder";
|
||||
import Page from "zy-react-library/components/Page";
|
||||
import Search from "zy-react-library/components/Search";
|
||||
import BasicSelectTree from "zy-react-library/components/SelectTree/Basic";
|
||||
import DepartmentSelectTree from "zy-react-library/components/SelectTree/Department/Gwj";
|
||||
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 NeedToKnowModal from "~/components/NeedToKnowModal";
|
||||
import { NS_ENCLOSED_AREA, NS_ENCLOSED_AREA_PERSONNEL_APPLY } from "~/enumerate/namespace";
|
||||
|
||||
function Add(props) {
|
||||
const [enclosedAreaList, setEnclosedAreaList] = useState([]);
|
||||
const [entourageList, setEntourageList] = useState([]);
|
||||
const [selectEntourageModalVisible, setSelectEntourageModalVisible] = useState(false);
|
||||
const [needToKnowModalVisible, setNeedToKnowModalVisible] = useState(false);
|
||||
|
||||
const signatureUrl = useRef("");
|
||||
|
||||
const [form] = Form.useForm();
|
||||
|
||||
const getEnclosedAreaList = async (id) => {
|
||||
const { data } = await props["enclosedAreaDetailListTree"]({ id });
|
||||
setEnclosedAreaList(data);
|
||||
};
|
||||
|
||||
const onSubmit = async (values) => {
|
||||
if (!values.todo8) {
|
||||
message.warning("请勾选《安全进港须知》并签字");
|
||||
return;
|
||||
}
|
||||
const { success } = await props["enclosedAreaPersonnelApplySave"]({ ...values });
|
||||
if (success) {
|
||||
message.success("操作成功");
|
||||
props.history.goBack();
|
||||
}
|
||||
};
|
||||
|
||||
return (
|
||||
<Page headerTitle="申请权限" isShowFooter={false}>
|
||||
<FormBuilder
|
||||
submitButtonText="提交申请"
|
||||
onFinish={onSubmit}
|
||||
options={[
|
||||
{
|
||||
name: "todo1",
|
||||
label: "区域管辖单位",
|
||||
render: (
|
||||
<DepartmentSelectTree
|
||||
searchType="inType"
|
||||
params={{ enterpriseType: [2] }}
|
||||
onChange={(value) => {
|
||||
getEnclosedAreaList(value);
|
||||
}}
|
||||
/>
|
||||
),
|
||||
},
|
||||
{ name: "todo2", label: "封闭区域", render: (<BasicSelectTree treeData={enclosedAreaList} placeholder="封闭区域" />) },
|
||||
{ name: "todo4", label: "审核人员", render: FORM_ITEM_RENDER_ENUM.SELECT, items: [] },
|
||||
{ name: "todo5", label: "申请时间范围", render: FORM_ITEM_RENDER_ENUM.DATE_RANGE },
|
||||
{
|
||||
label: "随行人员",
|
||||
span: 24,
|
||||
customizeRender: true,
|
||||
render: (
|
||||
<Table
|
||||
style={{ marginBottom: 16 }}
|
||||
headerTitle={(
|
||||
<span style={{
|
||||
color: "red",
|
||||
fontSize: "14px",
|
||||
}}
|
||||
>
|
||||
如需选择的人员无法添加或查询不到，请确认该人员在集团人资系统入职状态是否正常或人脸照片是否上传。
|
||||
</span>
|
||||
)}
|
||||
toolBarRender={() => (
|
||||
<Button
|
||||
type="primary"
|
||||
onClick={() => {
|
||||
setSelectEntourageModalVisible(true);
|
||||
}}
|
||||
>
|
||||
添加随行人员
|
||||
</Button>
|
||||
)}
|
||||
options={false}
|
||||
disabledResizer={true}
|
||||
pagination={false}
|
||||
columns={[
|
||||
{ title: "姓名", dataIndex: "todo1" },
|
||||
{ title: "部门", dataIndex: "todo2" },
|
||||
{
|
||||
title: "操作",
|
||||
render: (_, record) => (
|
||||
<Button
|
||||
type="link"
|
||||
danger
|
||||
onClick={() => {
|
||||
setEntourageList(entourageList.filter(item => item.id !== record.id));
|
||||
}}
|
||||
>
|
||||
删除
|
||||
</Button>
|
||||
),
|
||||
},
|
||||
]}
|
||||
dataSource={entourageList}
|
||||
/>
|
||||
),
|
||||
},
|
||||
{ name: "todo6", label: "申请原因", span: 24, render: FORM_ITEM_RENDER_ENUM.TEXTAREA },
|
||||
{
|
||||
name: "todo7",
|
||||
label: " ",
|
||||
span: 24,
|
||||
required: false,
|
||||
rules: [{ required: true, message: "请勾选" }],
|
||||
formItemProps: {
|
||||
colon: false,
|
||||
required: false,
|
||||
style: { textAlign: "center" },
|
||||
labelCol: { span: 0 },
|
||||
wrapperCol: { span: 24 },
|
||||
},
|
||||
render: FORM_ITEM_RENDER_ENUM.CHECKBOX,
|
||||
items: [{
|
||||
bianma: "1",
|
||||
name: (
|
||||
<>
|
||||
我已阅读并同意
|
||||
<Button
|
||||
type="link"
|
||||
style={{ padding: 0 }}
|
||||
onClick={() => {
|
||||
setNeedToKnowModalVisible(true);
|
||||
}}
|
||||
>
|
||||
《安全进港须知》
|
||||
</Button>
|
||||
</>
|
||||
),
|
||||
}],
|
||||
},
|
||||
{ name: "todo8", label: "签字", onlyForLabel: true },
|
||||
]}
|
||||
form={form}
|
||||
/>
|
||||
{
|
||||
selectEntourageModalVisible && (
|
||||
<SelectEntourageModal
|
||||
entourageList={entourageList}
|
||||
onClose={() => {
|
||||
setSelectEntourageModalVisible(false);
|
||||
}}
|
||||
onOk={(values) => {
|
||||
setEntourageList(values);
|
||||
setSelectEntourageModalVisible(false);
|
||||
}}
|
||||
/>
|
||||
)
|
||||
}
|
||||
{
|
||||
needToKnowModalVisible && (
|
||||
<NeedToKnowModal
|
||||
signatureUrl={signatureUrl.current}
|
||||
onCancel={() => {
|
||||
setNeedToKnowModalVisible(false);
|
||||
}}
|
||||
onOk={(values) => {
|
||||
form.setFieldValue("todo8", values);
|
||||
signatureUrl.current = values.base64;
|
||||
setNeedToKnowModalVisible(false);
|
||||
}}
|
||||
/>
|
||||
)
|
||||
}
|
||||
</Page>
|
||||
);
|
||||
}
|
||||
|
||||
const SelectEntourageModalComponent = (props) => {
|
||||
const [selectedRowKeys, setSelectedRowKeys] = useState(props.entourageList.map(item => item.id));
|
||||
|
||||
const selectedRowsRef = useRef(props.entourageList || []);
|
||||
|
||||
const [form] = Form.useForm();
|
||||
const { tableProps, getData } = useTable(props["enclosedAreaPersonnelApplyEntourageList"], {
|
||||
form,
|
||||
useStorageQueryCriteria: false,
|
||||
});
|
||||
|
||||
return (
|
||||
<Modal
|
||||
title="选择随行人员"
|
||||
open
|
||||
maskClosable={false}
|
||||
width={800}
|
||||
onCancel={props.onClose}
|
||||
onOk={() => {
|
||||
props.onOk(selectedRowsRef.current);
|
||||
}}
|
||||
>
|
||||
<Search
|
||||
options={[
|
||||
{ name: "todo1", label: "姓名" },
|
||||
]}
|
||||
form={form}
|
||||
onFinish={getData}
|
||||
/>
|
||||
<Table
|
||||
rowSelection={{
|
||||
selectedRowKeys,
|
||||
preserveSelectedRowKeys: true,
|
||||
onChange: (selectedRowKeys, selectedRows) => {
|
||||
setSelectedRowKeys(selectedRowKeys);
|
||||
selectedRowsRef.current = selectedRows;
|
||||
},
|
||||
}}
|
||||
options={false}
|
||||
disabledResizer={true}
|
||||
columns={[
|
||||
{ title: "部门", dataIndex: "todo1" },
|
||||
{ title: "姓名", dataIndex: "todo2" },
|
||||
{ title: "手机号", dataIndex: "todo3" },
|
||||
{ title: "是否录入人脸", dataIndex: "todo4", render: (_, record) => record.todo4 === 1 ? "是" : "否" },
|
||||
]}
|
||||
{...tableProps}
|
||||
/>
|
||||
</Modal>
|
||||
);
|
||||
};
|
||||
|
||||
const SelectEntourageModal = Connect([NS_ENCLOSED_AREA_PERSONNEL_APPLY, NS_ENCLOSED_AREA], true)(SelectEntourageModalComponent);
|
||||
|
||||
export default Connect([NS_ENCLOSED_AREA_PERSONNEL_APPLY, NS_ENCLOSED_AREA], true)(Add);
|
||||
|
|
@ -0,0 +1,68 @@
|
|||
import { Connect } from "@cqsjjb/jjb-dva-runtime";
|
||||
import { Button, Form } from "antd";
|
||||
import AddIcon from "zy-react-library/components/Icon/AddIcon";
|
||||
import Page from "zy-react-library/components/Page";
|
||||
import Search from "zy-react-library/components/Search";
|
||||
import Table from "zy-react-library/components/Table";
|
||||
import TooltipPreviewImg from "zy-react-library/components/TooltipPreviewImg";
|
||||
import useTable from "zy-react-library/hooks/useTable";
|
||||
import { NS_ENCLOSED_AREA_PERSONNEL_APPLY } from "~/enumerate/namespace";
|
||||
|
||||
function List(props) {
|
||||
const [form] = Form.useForm();
|
||||
const { tableProps, getData } = useTable(props["enclosedAreaPersonnelApplyList"], {
|
||||
form,
|
||||
});
|
||||
|
||||
return (
|
||||
<Page isShowAllAction={false}>
|
||||
<Search
|
||||
options={[
|
||||
{ name: "todo1", label: "人员姓名" },
|
||||
]}
|
||||
form={form}
|
||||
onFinish={getData}
|
||||
/>
|
||||
<Table
|
||||
toolBarRender={() => (
|
||||
<Button
|
||||
type="primary"
|
||||
icon={(<AddIcon />)}
|
||||
onClick={() => {
|
||||
props.history.push("./add");
|
||||
}}
|
||||
>
|
||||
申请权限
|
||||
</Button>
|
||||
)}
|
||||
columns={[
|
||||
{ title: "姓名", dataIndex: "todo1" },
|
||||
{ title: "部门", dataIndex: "todo2" },
|
||||
{ title: "手机号", dataIndex: "todo3" },
|
||||
{ title: "申请区域", dataIndex: "todo4" },
|
||||
{ title: "申请时间范围", dataIndex: "todo5", render: (_, record) => `${record.todo5} - ${record.todo6}` },
|
||||
{ title: "个人照片", dataIndex: "todo7", render: (_, record) => <TooltipPreviewImg files={record.todo7} /> },
|
||||
{ title: "申请状态", dataIndex: "todo8" },
|
||||
{
|
||||
title: "操作",
|
||||
width: 80,
|
||||
fixed: "right",
|
||||
render: (_, record) => (
|
||||
<Button
|
||||
type="link"
|
||||
onClick={() => {
|
||||
props.history.push(`./view?id=${record.id}`);
|
||||
}}
|
||||
>
|
||||
查看
|
||||
</Button>
|
||||
),
|
||||
},
|
||||
]}
|
||||
{...tableProps}
|
||||
/>
|
||||
</Page>
|
||||
);
|
||||
}
|
||||
|
||||
export default Connect([NS_ENCLOSED_AREA_PERSONNEL_APPLY], true)(List);
|
||||
|
|
@ -0,0 +1,74 @@
|
|||
import { Connect } from "@cqsjjb/jjb-dva-runtime";
|
||||
import { Descriptions, Divider, Spin } from "antd";
|
||||
import { useEffect, useState } from "react";
|
||||
import Page from "zy-react-library/components/Page";
|
||||
import PreviewImg from "zy-react-library/components/PreviewImg";
|
||||
import useGetUrlQuery from "zy-react-library/hooks/useGetUrlQuery";
|
||||
import { NS_ENCLOSED_AREA_PERSONNEL_APPLY } from "~/enumerate/namespace";
|
||||
|
||||
function View(props) {
|
||||
const [info, setInfo] = useState({});
|
||||
|
||||
const query = useGetUrlQuery();
|
||||
|
||||
const getData = async () => {
|
||||
const { data } = await props["enclosedAreaPersonnelApplyInfo"]({ id: query.id });
|
||||
setInfo(data);
|
||||
props.onGetData?.(data);
|
||||
};
|
||||
|
||||
useEffect(() => {
|
||||
getData();
|
||||
}, []);
|
||||
|
||||
return (
|
||||
<Page headerTitle="查看" contentPadding="0 20px 20px 20px">
|
||||
<Spin spinning={props.enclosedAreaPersonnelApply.enclosedAreaPersonnelApplyLoading}>
|
||||
<Divider orientation="left">人员信息</Divider>
|
||||
<Descriptions
|
||||
bordered
|
||||
column={2}
|
||||
styles={{ label: { width: 200 } }}
|
||||
items={[
|
||||
{ label: "所属企业", children: info.todo1 },
|
||||
{ label: "姓名", children: info.todo2 },
|
||||
{ label: "部门", children: info.todo3 },
|
||||
{ label: "手机号", children: info.todo4 },
|
||||
{ label: "申请区域", children: info.todo5 },
|
||||
{ label: "申请时间范围", children: `${info.todo6} - ${info.todo7}` },
|
||||
{ label: "个人照片", children: (<PreviewImg files={info.todo8} />) },
|
||||
{ label: "申请原因", children: info.todo9 },
|
||||
{ label: "申请人员签字", children: (<PreviewImg files={info.todo10} />) },
|
||||
]}
|
||||
/>
|
||||
{
|
||||
info.todo11.length > 0
|
||||
&& (
|
||||
<>
|
||||
<Divider orientation="left">更多人员信息</Divider>
|
||||
{
|
||||
info.todo11.map((item, index) => (
|
||||
<Descriptions
|
||||
key={index}
|
||||
bordered
|
||||
column={2}
|
||||
styles={{ label: { width: 200 } }}
|
||||
items={[
|
||||
{ label: "姓名", children: item.todo1 },
|
||||
{ label: "部门", children: item.todo2 },
|
||||
{ label: "手机号", children: item.todo3 },
|
||||
{ label: "个人照片", children: item.todo4 },
|
||||
]}
|
||||
/>
|
||||
))
|
||||
}
|
||||
</>
|
||||
)
|
||||
}
|
||||
{props.children}
|
||||
</Spin>
|
||||
</Page>
|
||||
);
|
||||
}
|
||||
|
||||
export default Connect([NS_ENCLOSED_AREA_PERSONNEL_APPLY], true)(View);
|
||||
|
|
@ -0,0 +1,5 @@
|
|||
function Personnel(props) {
|
||||
return props.children;
|
||||
}
|
||||
|
||||
export default Personnel;
|
||||
|
|
@ -0,0 +1,299 @@
|
|||
import { Connect } from "@cqsjjb/jjb-dva-runtime";
|
||||
import { Button, Form, message, Modal, Tabs } from "antd";
|
||||
import { useRef, useState } from "react";
|
||||
import FormBuilder from "zy-react-library/components/FormBuilder";
|
||||
import Page from "zy-react-library/components/Page";
|
||||
import Search from "zy-react-library/components/Search";
|
||||
import DictionarySelect from "zy-react-library/components/Select/Dictionary";
|
||||
import BasicSelectTree from "zy-react-library/components/SelectTree/Basic";
|
||||
import DepartmentSelectTree from "zy-react-library/components/SelectTree/Department/Gwj";
|
||||
import Table from "zy-react-library/components/Table";
|
||||
import TooltipPreviewImg from "zy-react-library/components/TooltipPreviewImg";
|
||||
import Upload from "zy-react-library/components/Upload";
|
||||
import { FORM_ITEM_RENDER_ENUM } from "zy-react-library/enum/formItemRender";
|
||||
import useTable from "zy-react-library/hooks/useTable";
|
||||
import { LICENSE_PLATE_NUMBER } from "zy-react-library/regular";
|
||||
import NeedToKnowModal from "~/components/NeedToKnowModal";
|
||||
import {
|
||||
NS_ENCLOSED_AREA,
|
||||
NS_ENCLOSED_AREA_VEHICLE_APPLY,
|
||||
} from "~/enumerate/namespace";
|
||||
|
||||
function Add(props) {
|
||||
const [enclosedAreaList, setEnclosedAreaList] = useState([]);
|
||||
const [vehicleList, setVehicleList] = useState([]);
|
||||
const [selectVehicleModalVisible, setSelectVehicleModalVisible] = useState(false);
|
||||
const [needToKnowModalVisible, setNeedToKnowModalVisible] = useState(false);
|
||||
|
||||
const signatureUrl = useRef("");
|
||||
|
||||
const [form] = Form.useForm();
|
||||
const todo6 = Form.useWatch("todo6", form);
|
||||
|
||||
const getEnclosedAreaList = async (id) => {
|
||||
const { data } = await props["enclosedAreaDetailListTree"]({ id });
|
||||
setEnclosedAreaList(data);
|
||||
};
|
||||
|
||||
const onSubmit = async (values) => {
|
||||
if (values.todo6 === 1 && vehicleList.length === 0) {
|
||||
message.warning("请选择车辆");
|
||||
return;
|
||||
}
|
||||
if (!values.todo14) {
|
||||
message.warning("请勾选《安全进港须知》并签字");
|
||||
return;
|
||||
}
|
||||
const { success } = await props["enclosedAreaVehicleApplySave"]({ ...values });
|
||||
if (success) {
|
||||
message.success("操作成功");
|
||||
props.history.goBack();
|
||||
}
|
||||
};
|
||||
|
||||
return (
|
||||
<Page headerTitle="车辆申请" isShowFooter={false}>
|
||||
<FormBuilder
|
||||
submitButtonText="提交申请"
|
||||
onFinish={onSubmit}
|
||||
options={[
|
||||
{
|
||||
name: "todo1",
|
||||
label: "区域管辖单位",
|
||||
render: (
|
||||
<DepartmentSelectTree
|
||||
searchType="inType"
|
||||
params={{ enterpriseType: [2] }}
|
||||
onChange={(value) => {
|
||||
getEnclosedAreaList(value);
|
||||
}}
|
||||
/>
|
||||
),
|
||||
},
|
||||
{ name: "todo2", label: "封闭区域", render: (<BasicSelectTree treeData={enclosedAreaList} placeholder="封闭区域" />) },
|
||||
{ name: "todo4", label: "审核人员", render: FORM_ITEM_RENDER_ENUM.SELECT, items: [] },
|
||||
{ name: "todo5", label: "申请时间范围", render: FORM_ITEM_RENDER_ENUM.DATE_RANGE },
|
||||
{
|
||||
name: "todo6",
|
||||
label: "车辆类型",
|
||||
render: FORM_ITEM_RENDER_ENUM.RADIO,
|
||||
items: [
|
||||
{ bianma: 1, name: "选择现有车辆" },
|
||||
{ bianma: 2, name: "新增车辆" },
|
||||
],
|
||||
componentProps: {
|
||||
onChange: () => {
|
||||
setVehicleList([]);
|
||||
},
|
||||
},
|
||||
},
|
||||
...(todo6 === 1
|
||||
? [
|
||||
{
|
||||
label: "选择现有车辆",
|
||||
span: 24,
|
||||
customizeRender: true,
|
||||
render: (
|
||||
<Table
|
||||
style={{ marginBottom: 16 }}
|
||||
toolBarRender={() => (
|
||||
<Button
|
||||
type="primary"
|
||||
onClick={() => {
|
||||
setSelectVehicleModalVisible(true);
|
||||
}}
|
||||
>
|
||||
选择车辆
|
||||
</Button>
|
||||
)}
|
||||
options={false}
|
||||
disabledResizer={true}
|
||||
pagination={false}
|
||||
columns={[
|
||||
{ title: "车牌类型", dataIndex: "todo1" },
|
||||
{ title: "车辆类型", dataIndex: "todo2" },
|
||||
{ title: "车牌号", dataIndex: "todo3" },
|
||||
{
|
||||
title: "车辆照片",
|
||||
dataIndex: "todo4",
|
||||
render: (_, record) => <TooltipPreviewImg files={record.todo4} />,
|
||||
},
|
||||
{
|
||||
title: "操作",
|
||||
render: (_, record) => (
|
||||
<Button
|
||||
type="link"
|
||||
danger
|
||||
onClick={() => {
|
||||
setVehicleList(vehicleList.filter(item => item.id !== record.id));
|
||||
}}
|
||||
>
|
||||
删除
|
||||
</Button>
|
||||
),
|
||||
},
|
||||
]}
|
||||
dataSource={vehicleList}
|
||||
/>
|
||||
),
|
||||
},
|
||||
]
|
||||
: []),
|
||||
...(todo6 === 2
|
||||
? [
|
||||
{ name: "todo7", label: "车牌类型", render: (<DictionarySelect dictValue="LICENSE_PLATE_TYPE" />) },
|
||||
{ name: "todo8", label: "车辆类型", render: (<DictionarySelect dictValue="VEHICLE_TYPE" />) },
|
||||
{ name: "todo9", label: "车牌号", rules: [{ pattern: LICENSE_PLATE_NUMBER, message: "请输入正确的车牌号" }] },
|
||||
{ name: "todo10", label: "车辆照片", span: 24, render: (<Upload />) },
|
||||
{ name: "todo11", label: "行驶证照片", span: 24, render: (<Upload />) },
|
||||
]
|
||||
: []),
|
||||
{ name: "todo12", label: "申请原因", span: 24, render: FORM_ITEM_RENDER_ENUM.TEXTAREA },
|
||||
{
|
||||
name: "todo13",
|
||||
label: " ",
|
||||
span: 24,
|
||||
required: false,
|
||||
rules: [{ required: true, message: "请勾选" }],
|
||||
formItemProps: {
|
||||
colon: false,
|
||||
required: false,
|
||||
style: { textAlign: "center" },
|
||||
labelCol: { span: 0 },
|
||||
wrapperCol: { span: 24 },
|
||||
},
|
||||
render: FORM_ITEM_RENDER_ENUM.CHECKBOX,
|
||||
items: [{
|
||||
bianma: "1",
|
||||
name: (
|
||||
<>
|
||||
我已阅读并同意
|
||||
<Button
|
||||
type="link"
|
||||
style={{ padding: 0 }}
|
||||
onClick={() => {
|
||||
setNeedToKnowModalVisible(true);
|
||||
}}
|
||||
>
|
||||
《安全进港须知》
|
||||
</Button>
|
||||
</>
|
||||
),
|
||||
}],
|
||||
},
|
||||
{ name: "todo14", label: "签字", onlyForLabel: true },
|
||||
]}
|
||||
form={form}
|
||||
/>
|
||||
{
|
||||
selectVehicleModalVisible && (
|
||||
<SelectVehicleModal
|
||||
vehicleList={vehicleList}
|
||||
onClose={() => {
|
||||
setSelectVehicleModalVisible(false);
|
||||
}}
|
||||
onOk={(values) => {
|
||||
setVehicleList(values);
|
||||
setSelectVehicleModalVisible(false);
|
||||
}}
|
||||
/>
|
||||
)
|
||||
}
|
||||
{
|
||||
needToKnowModalVisible && (
|
||||
<NeedToKnowModal
|
||||
signatureUrl={signatureUrl.current}
|
||||
onCancel={() => {
|
||||
setNeedToKnowModalVisible(false);
|
||||
}}
|
||||
onOk={(values) => {
|
||||
form.setFieldValue("todo14", values);
|
||||
signatureUrl.current = values.base64;
|
||||
setNeedToKnowModalVisible(false);
|
||||
}}
|
||||
/>
|
||||
)
|
||||
}
|
||||
</Page>
|
||||
);
|
||||
}
|
||||
|
||||
const SelectVehicleModalComponent = (props) => {
|
||||
const [tabActiveKey, setTabActiveKey] = useState("1");
|
||||
const [selectedRowKeys, setSelectedRowKeys] = useState(props.vehicleList.map(item => item.id));
|
||||
|
||||
const selectedRowsRef = useRef(props.vehicleList || []);
|
||||
|
||||
const [form] = Form.useForm();
|
||||
const { tableProps, getData } = useTable(props["enclosedAreaVehicleApplyVehicleList"], {
|
||||
form,
|
||||
useStorageQueryCriteria: false,
|
||||
params: { tabActiveKey },
|
||||
});
|
||||
|
||||
return (
|
||||
<Modal
|
||||
title="选择车辆"
|
||||
open
|
||||
maskClosable={false}
|
||||
width={900}
|
||||
onCancel={props.onClose}
|
||||
onOk={() => {
|
||||
props.onOk(selectedRowsRef.current);
|
||||
}}
|
||||
>
|
||||
<Search
|
||||
options={[
|
||||
{ name: "todo1", label: "车牌号" },
|
||||
]}
|
||||
form={form}
|
||||
onFinish={getData}
|
||||
/>
|
||||
<Table
|
||||
headerTitle={(
|
||||
<Tabs
|
||||
activeKey={tabActiveKey}
|
||||
items={[{ label: "个人车辆", key: "1" }, { label: "公司车辆", key: "2" }]}
|
||||
onChange={(event) => {
|
||||
setTabActiveKey(event);
|
||||
getData();
|
||||
}}
|
||||
/>
|
||||
)}
|
||||
rowSelection={{
|
||||
selectedRowKeys,
|
||||
type: "radio",
|
||||
preserveSelectedRowKeys: true,
|
||||
onChange: (selectedRowKeys, selectedRows) => {
|
||||
setSelectedRowKeys(selectedRowKeys);
|
||||
selectedRowsRef.current = selectedRows;
|
||||
},
|
||||
}}
|
||||
options={false}
|
||||
disabledResizer={true}
|
||||
columns={[
|
||||
{ title: "车牌类型", dataIndex: "todo1" },
|
||||
{ title: "车辆类型", dataIndex: "todo2" },
|
||||
{ title: "车牌号", dataIndex: "todo3" },
|
||||
{
|
||||
title: "车辆照片",
|
||||
dataIndex: "todo4",
|
||||
render: (_, record) => <TooltipPreviewImg files={record.todo4} />,
|
||||
},
|
||||
]}
|
||||
{...tableProps}
|
||||
dataSource={[
|
||||
{ id: "1", todo1: "1", todo2: "1", todo3: "1" },
|
||||
{ id: "2", todo1: "2", todo2: "2", todo3: "2" },
|
||||
{ id: "3", todo1: "3", todo2: "3", todo3: "3" },
|
||||
{ id: "4", todo1: "4", todo2: "4", todo3: "4" },
|
||||
{ id: "5", todo1: "5", todo2: "5", todo3: "5" },
|
||||
]}
|
||||
/>
|
||||
</Modal>
|
||||
);
|
||||
};
|
||||
|
||||
const SelectVehicleModal = Connect([NS_ENCLOSED_AREA_VEHICLE_APPLY], true)(SelectVehicleModalComponent);
|
||||
|
||||
export default Connect([NS_ENCLOSED_AREA_VEHICLE_APPLY, NS_ENCLOSED_AREA], true)(Add);
|
||||
|
|
@ -0,0 +1,71 @@
|
|||
import { Connect } from "@cqsjjb/jjb-dva-runtime";
|
||||
import { Button, Form } from "antd";
|
||||
import AddIcon from "zy-react-library/components/Icon/AddIcon";
|
||||
import Page from "zy-react-library/components/Page";
|
||||
import Search from "zy-react-library/components/Search";
|
||||
import Table from "zy-react-library/components/Table";
|
||||
import TooltipPreviewImg from "zy-react-library/components/TooltipPreviewImg";
|
||||
import useTable from "zy-react-library/hooks/useTable";
|
||||
import { NS_ENCLOSED_AREA_VEHICLE_APPLY } from "~/enumerate/namespace";
|
||||
|
||||
function List(props) {
|
||||
const [form] = Form.useForm();
|
||||
const { tableProps, getData } = useTable(props["enclosedAreaVehicleApplyList"], {
|
||||
form,
|
||||
});
|
||||
|
||||
return (
|
||||
<Page isShowAllAction={false}>
|
||||
<Search
|
||||
options={[
|
||||
{ name: "todo1", label: "车牌号" },
|
||||
]}
|
||||
form={form}
|
||||
onFinish={getData}
|
||||
/>
|
||||
<Table
|
||||
toolBarRender={() => (
|
||||
<Button
|
||||
type="primary"
|
||||
icon={(<AddIcon />)}
|
||||
onClick={() => {
|
||||
props.history.push("./add");
|
||||
}}
|
||||
>
|
||||
申请权限
|
||||
</Button>
|
||||
)}
|
||||
columns={[
|
||||
{ title: "车辆类型", dataIndex: "todo1" },
|
||||
{ title: "驾驶人", dataIndex: "todo2" },
|
||||
{ title: "职务", dataIndex: "todo3" },
|
||||
{ title: "手机号", dataIndex: "todo4" },
|
||||
{ title: "申请区域", dataIndex: "todo5" },
|
||||
{ title: "申请时间范围", dataIndex: "todo6", render: (_, record) => `${record.todo6} - ${record.todo7}` },
|
||||
{ title: "申请原因", dataIndex: "todo7" },
|
||||
{ title: "车牌号", dataIndex: "todo8" },
|
||||
{ title: "车辆照片", dataIndex: "todo9", render: (_, record) => <TooltipPreviewImg files={record.todo9} /> },
|
||||
{ title: "申请状态", dataIndex: "todo10" },
|
||||
{
|
||||
title: "操作",
|
||||
width: 80,
|
||||
fixed: "right",
|
||||
render: (_, record) => (
|
||||
<Button
|
||||
type="link"
|
||||
onClick={() => {
|
||||
props.history.push(`./view?id=${record.id}`);
|
||||
}}
|
||||
>
|
||||
查看
|
||||
</Button>
|
||||
),
|
||||
},
|
||||
]}
|
||||
{...tableProps}
|
||||
/>
|
||||
</Page>
|
||||
);
|
||||
}
|
||||
|
||||
export default Connect([NS_ENCLOSED_AREA_VEHICLE_APPLY], true)(List);
|
||||
|
|
@ -0,0 +1,52 @@
|
|||
import { Connect } from "@cqsjjb/jjb-dva-runtime";
|
||||
import { Descriptions, Divider, Spin } from "antd";
|
||||
import { useEffect, useState } from "react";
|
||||
import Page from "zy-react-library/components/Page";
|
||||
import PreviewImg from "zy-react-library/components/PreviewImg";
|
||||
import useGetUrlQuery from "zy-react-library/hooks/useGetUrlQuery";
|
||||
import { NS_ENCLOSED_AREA_VEHICLE_APPLY } from "~/enumerate/namespace";
|
||||
|
||||
function View(props) {
|
||||
const [info, setInfo] = useState({});
|
||||
|
||||
const query = useGetUrlQuery();
|
||||
|
||||
const getData = async () => {
|
||||
const { data } = await props["enclosedAreaVehicleApplyInfo"]({ id: query.id });
|
||||
setInfo(data);
|
||||
props.onGetData?.(data);
|
||||
};
|
||||
|
||||
useEffect(() => {
|
||||
getData();
|
||||
}, []);
|
||||
|
||||
return (
|
||||
<Page headerTitle="查看" contentPadding="0 20px 20px 20px">
|
||||
<Spin spinning={props.enclosedAreaVehicleApply.enclosedAreaVehicleApplyLoading}>
|
||||
<Divider orientation="left">车辆信息</Divider>
|
||||
<Descriptions
|
||||
bordered
|
||||
column={2}
|
||||
styles={{ label: { width: 200 } }}
|
||||
items={[
|
||||
{ label: "所属企业", children: info.todo1 },
|
||||
{ label: "姓名", children: info.todo2 },
|
||||
{ label: "职务", children: info.todo3 },
|
||||
{ label: "手机号", children: info.todo4 },
|
||||
{ label: "申请区域", children: info.todo5 },
|
||||
{ label: "申请时间范围", children: `${info.todo6} - ${info.todo7}` },
|
||||
{ label: "车辆类型", children: info.todo8 },
|
||||
{ label: "车辆照片", children: (<PreviewImg files={info.todo9} />) },
|
||||
{ label: "行驶证照片", children: (<PreviewImg files={info.todo10} />) },
|
||||
{ label: "申请原因", children: info.todo11 },
|
||||
{ label: "申请人员签字", children: (<PreviewImg files={info.todo12} />) },
|
||||
]}
|
||||
/>
|
||||
{props.children}
|
||||
</Spin>
|
||||
</Page>
|
||||
);
|
||||
}
|
||||
|
||||
export default Connect([NS_ENCLOSED_AREA_VEHICLE_APPLY], true)(View);
|
||||
|
|
@ -0,0 +1,5 @@
|
|||
function Vehicle(props) {
|
||||
return props.children;
|
||||
}
|
||||
|
||||
export default Vehicle;
|
||||
|
|
@ -0,0 +1,122 @@
|
|||
import { Connect } from "@cqsjjb/jjb-dva-runtime";
|
||||
import { Button, Descriptions, Form, Modal, Space } from "antd";
|
||||
import { useEffect, useState } from "react";
|
||||
import Page from "zy-react-library/components/Page";
|
||||
import Search from "zy-react-library/components/Search";
|
||||
import Table from "zy-react-library/components/Table";
|
||||
import TooltipPreviewImg from "zy-react-library/components/TooltipPreviewImg";
|
||||
import useTable from "zy-react-library/hooks/useTable";
|
||||
import { NS_ENCLOSED_AREA_VEHICLE_APPLY } from "~/enumerate/namespace";
|
||||
|
||||
function List(props) {
|
||||
const [currentId, setCurrentId] = useState("");
|
||||
const [viewRejectReasonModalVisible, setViewRejectReasonModalVisible] = useState(false);
|
||||
|
||||
const [form] = Form.useForm();
|
||||
const { tableProps, getData } = useTable(props["enclosedAreaVehicleApplyRecordsList"], {
|
||||
form,
|
||||
});
|
||||
|
||||
return (
|
||||
<Page isShowAllAction={false}>
|
||||
<Search
|
||||
options={[
|
||||
{ name: "todo1", label: "车牌号" },
|
||||
]}
|
||||
form={form}
|
||||
onFinish={getData}
|
||||
/>
|
||||
<Table
|
||||
columns={[
|
||||
{ title: "车辆类型", dataIndex: "todo1" },
|
||||
{ title: "驾驶人", dataIndex: "todo2" },
|
||||
{ title: "职务", dataIndex: "todo3" },
|
||||
{ title: "手机号", dataIndex: "todo4" },
|
||||
{ title: "申请区域", dataIndex: "todo5" },
|
||||
{ title: "申请时间范围", dataIndex: "todo6", render: (_, record) => `${record.todo6} - ${record.todo7}` },
|
||||
{ title: "申请原因", dataIndex: "todo7" },
|
||||
{ title: "车牌号", dataIndex: "todo8" },
|
||||
{ title: "车辆照片", dataIndex: "todo9", render: (_, record) => <TooltipPreviewImg files={record.todo9} /> },
|
||||
{ title: "申请状态", dataIndex: "todo10" },
|
||||
{
|
||||
title: "操作",
|
||||
width: 80,
|
||||
fixed: "right",
|
||||
render: (_, record) => (
|
||||
<Space>
|
||||
<Button
|
||||
type="link"
|
||||
onClick={() => {
|
||||
props.history.push(`./view?id=${record.id}`);
|
||||
}}
|
||||
>
|
||||
查看
|
||||
</Button>
|
||||
<Button
|
||||
type="link"
|
||||
onClick={() => {
|
||||
setViewRejectReasonModalVisible(true);
|
||||
setCurrentId(record.id);
|
||||
}}
|
||||
>
|
||||
驳回原因
|
||||
</Button>
|
||||
</Space>
|
||||
),
|
||||
},
|
||||
]}
|
||||
{...tableProps}
|
||||
/>
|
||||
{
|
||||
viewRejectReasonModalVisible && (
|
||||
<ViewRejectReasonModal
|
||||
id={currentId}
|
||||
onCancel={() => {
|
||||
setViewRejectReasonModalVisible(false);
|
||||
setCurrentId("");
|
||||
}}
|
||||
/>
|
||||
)
|
||||
}
|
||||
</Page>
|
||||
);
|
||||
}
|
||||
|
||||
const ViewRejectReasonModalComponent = (props) => {
|
||||
const [info, setInfo] = useState({});
|
||||
const getData = async () => {
|
||||
const { data } = await props["enclosedAreaVehicleApplyRecordsRejectReason"]({ id: props.id });
|
||||
setInfo(data);
|
||||
};
|
||||
|
||||
useEffect(() => {
|
||||
getData();
|
||||
}, []);
|
||||
|
||||
return (
|
||||
<Modal
|
||||
open
|
||||
title="驳回原因"
|
||||
maskClosable={false}
|
||||
onCancel={props.onCancel}
|
||||
width={600}
|
||||
footer={[
|
||||
<Button key="cancel" onClick={props.onCancel}>取消</Button>,
|
||||
]}
|
||||
loading={props.enclosedAreaVehicleApply.enclosedAreaVehicleApplyLoading}
|
||||
>
|
||||
<Descriptions
|
||||
column={1}
|
||||
bordered
|
||||
styles={{ label: { width: 200 } }}
|
||||
items={[
|
||||
{ label: "驳回原因", children: info.todo1 },
|
||||
]}
|
||||
/>
|
||||
</Modal>
|
||||
);
|
||||
};
|
||||
|
||||
const ViewRejectReasonModal = Connect([NS_ENCLOSED_AREA_VEHICLE_APPLY], true)(ViewRejectReasonModalComponent);
|
||||
|
||||
export default Connect([NS_ENCLOSED_AREA_VEHICLE_APPLY], true)(List);
|
||||
|
|
@ -0,0 +1,41 @@
|
|||
import { Connect } from "@cqsjjb/jjb-dva-runtime";
|
||||
import { Divider } from "antd";
|
||||
import { useEffect, useState } from "react";
|
||||
import Table from "zy-react-library/components/Table";
|
||||
import useGetUrlQuery from "zy-react-library/hooks/useGetUrlQuery";
|
||||
import { NS_ENCLOSED_AREA_VEHICLE_APPLY } from "~/enumerate/namespace";
|
||||
import ViewPage from "../../Personnel/View";
|
||||
|
||||
function View(props) {
|
||||
const [accessRecordsList, setAccessRecordsList] = useState([]);
|
||||
|
||||
const query = useGetUrlQuery();
|
||||
|
||||
const getData = async () => {
|
||||
const { data } = await props["enclosedAreaVehicleApplyRecordsAccessRecordsList"]({ id: query.id });
|
||||
setAccessRecordsList(data);
|
||||
};
|
||||
|
||||
useEffect(() => {
|
||||
getData();
|
||||
}, []);
|
||||
|
||||
return (
|
||||
<ViewPage {...props}>
|
||||
<Divider orientation="left">进出记录</Divider>
|
||||
<Table
|
||||
style={{ marginTop: 16 }}
|
||||
options={false}
|
||||
disabledResizer={true}
|
||||
pagination={false}
|
||||
columns={[
|
||||
{ title: "出入状态", dataIndex: "todo1" },
|
||||
{ title: "记录时间", dataIndex: "todo2" },
|
||||
]}
|
||||
dataSource={accessRecordsList}
|
||||
/>
|
||||
</ViewPage>
|
||||
);
|
||||
}
|
||||
|
||||
export default Connect([NS_ENCLOSED_AREA_VEHICLE_APPLY], true)(View);
|
||||
|
|
@ -0,0 +1,5 @@
|
|||
function VehicleRecords(props) {
|
||||
return props.children;
|
||||
}
|
||||
|
||||
export default VehicleRecords;
|
||||
|
|
@ -0,0 +1,5 @@
|
|||
function Apply(props) {
|
||||
return props.children;
|
||||
}
|
||||
|
||||
export default Apply;
|
||||
|
|
@ -0,0 +1,120 @@
|
|||
import { Connect } from "@cqsjjb/jjb-dva-runtime";
|
||||
import { Button, Descriptions, Form, Modal, Space } from "antd";
|
||||
import { useEffect, useState } from "react";
|
||||
import Page from "zy-react-library/components/Page";
|
||||
import Search from "zy-react-library/components/Search";
|
||||
import Table from "zy-react-library/components/Table";
|
||||
import TooltipPreviewImg from "zy-react-library/components/TooltipPreviewImg";
|
||||
import useTable from "zy-react-library/hooks/useTable";
|
||||
import { NS_ENCLOSED_AREA_PERSONNEL_APPLY } from "~/enumerate/namespace";
|
||||
|
||||
function List(props) {
|
||||
const [currentId, setCurrentId] = useState("");
|
||||
const [viewRejectReasonModalVisible, setViewRejectReasonModalVisible] = useState(false);
|
||||
|
||||
const [form] = Form.useForm();
|
||||
const { tableProps, getData } = useTable(props["enclosedAreaPersonnelApplyRecordsList"], {
|
||||
form,
|
||||
});
|
||||
|
||||
return (
|
||||
<Page isShowAllAction={false}>
|
||||
<Search
|
||||
options={[
|
||||
{ name: "todo1", label: "人员姓名" },
|
||||
]}
|
||||
form={form}
|
||||
onFinish={getData}
|
||||
/>
|
||||
<Table
|
||||
columns={[
|
||||
{ title: "所属企业", dataIndex: "todo0" },
|
||||
{ title: "姓名", dataIndex: "todo1" },
|
||||
{ title: "部门", dataIndex: "todo2" },
|
||||
{ title: "手机号", dataIndex: "todo3" },
|
||||
{ title: "申请区域", dataIndex: "todo4" },
|
||||
{ title: "申请时间范围", dataIndex: "todo5", render: (_, record) => `${record.todo5} - ${record.todo6}` },
|
||||
{ title: "个人照片", dataIndex: "todo7", render: (_, record) => <TooltipPreviewImg files={record.todo7} /> },
|
||||
{ title: "申请状态", dataIndex: "todo8" },
|
||||
{
|
||||
title: "操作",
|
||||
width: 150,
|
||||
fixed: "right",
|
||||
render: (_, record) => (
|
||||
<Space>
|
||||
<Button
|
||||
type="link"
|
||||
onClick={() => {
|
||||
props.history.push(`./view?id=${record.id}`);
|
||||
}}
|
||||
>
|
||||
查看
|
||||
</Button>
|
||||
<Button
|
||||
type="link"
|
||||
onClick={() => {
|
||||
setViewRejectReasonModalVisible(true);
|
||||
setCurrentId(record.id);
|
||||
}}
|
||||
>
|
||||
驳回原因
|
||||
</Button>
|
||||
</Space>
|
||||
),
|
||||
},
|
||||
]}
|
||||
{...tableProps}
|
||||
/>
|
||||
{
|
||||
viewRejectReasonModalVisible && (
|
||||
<ViewRejectReasonModal
|
||||
id={currentId}
|
||||
onCancel={() => {
|
||||
setViewRejectReasonModalVisible(false);
|
||||
setCurrentId("");
|
||||
}}
|
||||
/>
|
||||
)
|
||||
}
|
||||
</Page>
|
||||
);
|
||||
}
|
||||
|
||||
const ViewRejectReasonModalComponent = (props) => {
|
||||
const [info, setInfo] = useState({});
|
||||
const getData = async () => {
|
||||
const { data } = await props["enclosedAreaPersonnelApplyRecordsRejectReason"]({ id: props.id });
|
||||
setInfo(data);
|
||||
};
|
||||
|
||||
useEffect(() => {
|
||||
getData();
|
||||
}, []);
|
||||
|
||||
return (
|
||||
<Modal
|
||||
open
|
||||
title="驳回原因"
|
||||
maskClosable={false}
|
||||
onCancel={props.onCancel}
|
||||
width={600}
|
||||
footer={[
|
||||
<Button key="cancel" onClick={props.onCancel}>取消</Button>,
|
||||
]}
|
||||
loading={props.enclosedAreaPersonnelApply.enclosedAreaPersonnelApplyLoading}
|
||||
>
|
||||
<Descriptions
|
||||
column={1}
|
||||
bordered
|
||||
styles={{ label: { width: 200 } }}
|
||||
items={[
|
||||
{ label: "驳回原因", children: info.todo1 },
|
||||
]}
|
||||
/>
|
||||
</Modal>
|
||||
);
|
||||
};
|
||||
|
||||
const ViewRejectReasonModal = Connect([NS_ENCLOSED_AREA_PERSONNEL_APPLY], true)(ViewRejectReasonModalComponent);
|
||||
|
||||
export default Connect([NS_ENCLOSED_AREA_PERSONNEL_APPLY], true)(List);
|
||||
|
|
@ -0,0 +1,44 @@
|
|||
import { Connect } from "@cqsjjb/jjb-dva-runtime";
|
||||
import { Divider } from "antd";
|
||||
import { useEffect, useState } from "react";
|
||||
import Table from "zy-react-library/components/Table";
|
||||
import useGetUrlQuery from "zy-react-library/hooks/useGetUrlQuery";
|
||||
import { NS_ENCLOSED_AREA_PERSONNEL_APPLY } from "~/enumerate/namespace";
|
||||
import ViewPage from "../../Personnel/View";
|
||||
|
||||
function View(props) {
|
||||
const [accessRecordsList, setAccessRecordsList] = useState([]);
|
||||
|
||||
const query = useGetUrlQuery();
|
||||
|
||||
const getData = async () => {
|
||||
const { data } = await props["enclosedAreaPersonnelApplyRecordsAccessRecordsList"]({ id: query.id });
|
||||
setAccessRecordsList(data);
|
||||
};
|
||||
|
||||
useEffect(() => {
|
||||
getData();
|
||||
}, []);
|
||||
|
||||
return (
|
||||
<ViewPage {...props}>
|
||||
<Divider orientation="left">进出记录</Divider>
|
||||
<Table
|
||||
style={{ marginTop: 16 }}
|
||||
options={false}
|
||||
disabledResizer={true}
|
||||
pagination={false}
|
||||
columns={[
|
||||
{ title: "姓名", dataIndex: "todo1" },
|
||||
{ title: "部门", dataIndex: "todo2" },
|
||||
{ title: "手机号", dataIndex: "todo3" },
|
||||
{ title: "出入状态", dataIndex: "todo4" },
|
||||
{ title: "记录时间", dataIndex: "todo5" },
|
||||
]}
|
||||
dataSource={accessRecordsList}
|
||||
/>
|
||||
</ViewPage>
|
||||
);
|
||||
}
|
||||
|
||||
export default Connect([NS_ENCLOSED_AREA_PERSONNEL_APPLY], true)(View);
|
||||
|
|
@ -0,0 +1,5 @@
|
|||
function personnelRecords(props) {
|
||||
return props.children;
|
||||
}
|
||||
|
||||
export default personnelRecords;
|
||||
|
|
@ -0,0 +1,257 @@
|
|||
import useUrlState from "@ahooksjs/use-url-state";
|
||||
import { Connect } from "@cqsjjb/jjb-dva-runtime";
|
||||
import { Button, Form, message, Modal, Space, Tag } from "antd";
|
||||
import { useEffect, useState } from "react";
|
||||
import FormBuilder from "zy-react-library/components/FormBuilder";
|
||||
import AddIcon from "zy-react-library/components/Icon/AddIcon";
|
||||
import BackIcon from "zy-react-library/components/Icon/BackIcon";
|
||||
import Page from "zy-react-library/components/Page";
|
||||
import Search from "zy-react-library/components/Search";
|
||||
import DepartmentSelectTree from "zy-react-library/components/SelectTree/Department/Gwj";
|
||||
import DictionarySelectTree from "zy-react-library/components/SelectTree/Dictionary";
|
||||
import Table from "zy-react-library/components/Table";
|
||||
import useGetUrlQuery from "zy-react-library/hooks/useGetUrlQuery";
|
||||
import useTable from "zy-react-library/hooks/useTable";
|
||||
import ElectronicFenceModal from "~/components/ElectronicFenceModal";
|
||||
import { NS_ENCLOSED_AREA } from "~/enumerate/namespace";
|
||||
|
||||
function DetailList(props) {
|
||||
const [addModalVisible, setAddModalVisible] = useState(false);
|
||||
const [electronicFenceModalVisible, setElectronicFenceModalVisible] = useState(false);
|
||||
const [currentId, setCurrentId] = useState("");
|
||||
|
||||
const query = useGetUrlQuery();
|
||||
const [urlState, setUrlState] = useUrlState({
|
||||
parentId: query.id,
|
||||
parentName: query.name,
|
||||
backParentIds: [],
|
||||
backParentNames: [],
|
||||
}, {
|
||||
navigateMode: "replace",
|
||||
parseOptions: {
|
||||
arrayFormat: "index",
|
||||
},
|
||||
stringifyOptions: {
|
||||
arrayFormat: "index",
|
||||
},
|
||||
});
|
||||
|
||||
const [form] = Form.useForm();
|
||||
|
||||
const { tableProps, getData } = useTable(props["enclosedAreaDetailList"], {
|
||||
form,
|
||||
params: { parentId: urlState.parentId },
|
||||
manual: true,
|
||||
});
|
||||
|
||||
useEffect(() => {
|
||||
getData();
|
||||
}, [urlState.parentId]);
|
||||
|
||||
const onDelete = (id) => {
|
||||
Modal.confirm({
|
||||
title: "删除确认",
|
||||
content: "确定要删除吗？",
|
||||
onOk: async () => {
|
||||
const { success } = await props["enclosedAreaDetailDelete"]({ id });
|
||||
if (success) {
|
||||
message.success("删除成功");
|
||||
getData();
|
||||
}
|
||||
},
|
||||
});
|
||||
};
|
||||
|
||||
const onSaveElectronicFence = async (value) => {
|
||||
const { success } = await props["enclosedAreaDetailSaveElectronicFence"]({ id: currentId, value });
|
||||
if (success) {
|
||||
message.success("保存成功");
|
||||
setElectronicFenceModalVisible(false);
|
||||
setCurrentId("");
|
||||
getData();
|
||||
}
|
||||
};
|
||||
|
||||
return (
|
||||
<Page headerTitle="查看">
|
||||
<Search
|
||||
options={[
|
||||
{ name: "todo1", label: "区域名称" },
|
||||
]}
|
||||
form={form}
|
||||
onFinish={getData}
|
||||
/>
|
||||
<Table
|
||||
toolBarRender={() => (
|
||||
<Space>
|
||||
<Button
|
||||
type="primary"
|
||||
icon={(<AddIcon />)}
|
||||
onClick={() => {
|
||||
setAddModalVisible(true);
|
||||
}}
|
||||
>
|
||||
新增区域
|
||||
</Button>
|
||||
{
|
||||
urlState.parentId !== query.id && (
|
||||
<Button
|
||||
icon={<BackIcon />}
|
||||
onClick={() => {
|
||||
setUrlState({
|
||||
parentId: urlState.backParentIds.at(-1),
|
||||
parentName: urlState.backParentNames.at(-1),
|
||||
backParentIds: urlState.backParentIds.slice(0, -1),
|
||||
backParentNames: urlState.backParentNames.slice(0, -1),
|
||||
});
|
||||
}}
|
||||
>
|
||||
返回
|
||||
</Button>
|
||||
)
|
||||
}
|
||||
</Space>
|
||||
)}
|
||||
columns={[
|
||||
{ title: "区域名称", dataIndex: "todo1", render: (_, record) => (
|
||||
<Button
|
||||
type="link"
|
||||
onClick={() => {
|
||||
setUrlState({
|
||||
parentId: record.id,
|
||||
parentName: record.todo1,
|
||||
backParentIds: [...urlState.backParentIds, urlState.parentId],
|
||||
backParentNames: [...urlState.backParentNames, urlState.parentName],
|
||||
});
|
||||
}}
|
||||
>
|
||||
{record.todo1}
|
||||
</Button>
|
||||
) },
|
||||
{ title: "管辖公司", dataIndex: "todo2" },
|
||||
{ title: "区域类型", dataIndex: "todo3" },
|
||||
{
|
||||
title: "操作",
|
||||
width: 200,
|
||||
fixed: "right",
|
||||
render: (_, record) => (
|
||||
<Space>
|
||||
<Button
|
||||
type="link"
|
||||
onClick={() => {
|
||||
setCurrentId(record.id);
|
||||
setAddModalVisible(true);
|
||||
}}
|
||||
>
|
||||
修改
|
||||
</Button>
|
||||
<Button
|
||||
type="link"
|
||||
onClick={() => {
|
||||
setCurrentId(record.id);
|
||||
setElectronicFenceModalVisible(true);
|
||||
}}
|
||||
>
|
||||
电子围栏
|
||||
</Button>
|
||||
<Button
|
||||
type="link"
|
||||
danger
|
||||
onClick={() => {
|
||||
onDelete(record.id);
|
||||
}}
|
||||
>
|
||||
删除
|
||||
</Button>
|
||||
</Space>
|
||||
),
|
||||
},
|
||||
]}
|
||||
{...tableProps}
|
||||
/>
|
||||
{
|
||||
addModalVisible && (
|
||||
<AddModal
|
||||
id={currentId}
|
||||
parentId={urlState.parentId}
|
||||
parentName={urlState.parentName}
|
||||
onCancel={() => {
|
||||
setAddModalVisible(false);
|
||||
setCurrentId("");
|
||||
}}
|
||||
getData={getData}
|
||||
/>
|
||||
)
|
||||
}
|
||||
{
|
||||
electronicFenceModalVisible && (
|
||||
<ElectronicFenceModal
|
||||
confirmLoading={props.enclosedArea.enclosedAreaLoading}
|
||||
onCancel={() => {
|
||||
setElectronicFenceModalVisible(false);
|
||||
setCurrentId("");
|
||||
}}
|
||||
onOk={onSaveElectronicFence}
|
||||
/>
|
||||
)
|
||||
}
|
||||
</Page>
|
||||
);
|
||||
}
|
||||
|
||||
const AddModalComponent = (props) => {
|
||||
const [form] = Form.useForm();
|
||||
|
||||
const getData = async () => {
|
||||
const { data } = await props["enclosedAreaDetailInfo"]({ id: props.id });
|
||||
form.setFieldsValue(data);
|
||||
};
|
||||
|
||||
useEffect(() => {
|
||||
props.id && getData();
|
||||
}, []);
|
||||
|
||||
const onSubmit = async (values) => {
|
||||
const { success } = await props[props.id ? "enclosedAreaDetailUpdate" : "enclosedAreaDetailAdd"]({
|
||||
...values,
|
||||
id: props.id,
|
||||
parentId: props.parentId,
|
||||
});
|
||||
if (success) {
|
||||
message.success("操作成功");
|
||||
props.onCancel();
|
||||
props.getData();
|
||||
}
|
||||
};
|
||||
|
||||
return (
|
||||
<Modal
|
||||
open
|
||||
title={props.id ? "修改" : "新增"}
|
||||
maskClosable={false}
|
||||
onCancel={props.onCancel}
|
||||
onOk={form.submit}
|
||||
confirmLoading={props.enclosedArea.enclosedAreaLoading}
|
||||
width={600}
|
||||
>
|
||||
<FormBuilder
|
||||
onFinish={onSubmit}
|
||||
showActionButtons={false}
|
||||
span={24}
|
||||
labelCol={{ span: 8 }}
|
||||
loading={props.enclosedArea.enclosedAreaLoading}
|
||||
options={[
|
||||
{ name: "parentName", label: "上级区域名称", required: false, render: <Tag color="blue">{props.parentName || "无"}</Tag> },
|
||||
{ name: "todo1", label: "区域名称" },
|
||||
{ name: "todo2", label: "区域类型", render: (<DictionarySelectTree dictValue="ENCLOSED_AREA_TYPE" />) },
|
||||
{ name: "todo3", label: "管辖公司", render: (<DepartmentSelectTree searchType="inType" params={{ enterpriseType: [2] }} />) },
|
||||
]}
|
||||
form={form}
|
||||
/>
|
||||
</Modal>
|
||||
);
|
||||
};
|
||||
|
||||
const AddModal = Connect([NS_ENCLOSED_AREA], true)(AddModalComponent);
|
||||
|
||||
export default Connect([NS_ENCLOSED_AREA], true)(DetailList);
|
||||
|
|
@ -0,0 +1,42 @@
|
|||
import { Connect } from "@cqsjjb/jjb-dva-runtime";
|
||||
import { Button, Space } from "antd";
|
||||
import Page from "zy-react-library/components/Page";
|
||||
import Table from "zy-react-library/components/Table";
|
||||
import useTable from "zy-react-library/hooks/useTable";
|
||||
import { NS_ENCLOSED_AREA } from "~/enumerate/namespace";
|
||||
|
||||
function List(props) {
|
||||
const { tableProps } = useTable(props["enclosedAreaList"]);
|
||||
|
||||
return (
|
||||
<Page isShowAllAction={false}>
|
||||
<Table
|
||||
columns={[
|
||||
{ title: "港区名称", dataIndex: "todo1" },
|
||||
{ title: "区域数", dataIndex: "todo2" },
|
||||
{ title: "管辖单位数", dataIndex: "todo3" },
|
||||
{
|
||||
title: "操作",
|
||||
width: 100,
|
||||
fixed: "right",
|
||||
render: (_, record) => (
|
||||
<Space>
|
||||
<Button
|
||||
type="link"
|
||||
onClick={() => {
|
||||
props.history.push(`./detailList?id=${record.id}&name=${record.name}`);
|
||||
}}
|
||||
>
|
||||
查看
|
||||
</Button>
|
||||
</Space>
|
||||
),
|
||||
},
|
||||
]}
|
||||
{...tableProps}
|
||||
/>
|
||||
</Page>
|
||||
);
|
||||
}
|
||||
|
||||
export default Connect([NS_ENCLOSED_AREA], true)(List);
|
||||
|
|
@ -0,0 +1,5 @@
|
|||
function EnclosedArea(props) {
|
||||
return props.children;
|
||||
}
|
||||
|
||||
export default EnclosedArea;
|
||||
|
|
@ -0,0 +1,7 @@
|
|||
import ListPage from "~/pages/Container/Supervision/FirstLevelDoor/BasicInfo/FirstLevelDoorInfo/Camera/List";
|
||||
|
||||
function List(props) {
|
||||
return (<ListPage {...props} />);
|
||||
}
|
||||
|
||||
export default List;
|
||||
|
|
@ -0,0 +1,5 @@
|
|||
function Camera(props) {
|
||||
return props.children;
|
||||
}
|
||||
|
||||
export default Camera;
|
||||
|
|
@ -0,0 +1,7 @@
|
|||
import CameraList from "../../Camera/List";
|
||||
|
||||
function Camera() {
|
||||
return (<CameraList />);
|
||||
}
|
||||
|
||||
export default Camera;
|
||||
|
|
@ -0,0 +1,7 @@
|
|||
import FareGatePage from "~/pages/Container/Supervision/FirstLevelDoor/BasicInfo/FirstLevelDoorInfo/Channel/FareGate";
|
||||
|
||||
function FareGate(props) {
|
||||
return (<FareGatePage {...props} />);
|
||||
}
|
||||
|
||||
export default FareGate;
|
||||
|
|
@ -0,0 +1,7 @@
|
|||
import ListPage from "~/pages/Container/Supervision/FirstLevelDoor/BasicInfo/FirstLevelDoorInfo/Channel/List";
|
||||
|
||||
function List(props) {
|
||||
return (<ListPage {...props} />);
|
||||
}
|
||||
|
||||
export default List;
|
||||
|
|
@ -0,0 +1,5 @@
|
|||
function Channel(props) {
|
||||
return props.children;
|
||||
}
|
||||
|
||||
export default Channel;
|
||||
|
|
@ -0,0 +1,322 @@
|
|||
import { Connect } from "@cqsjjb/jjb-dva-runtime";
|
||||
import { Button, Descriptions, Form, message, Modal, Space } from "antd";
|
||||
import { useEffect, useState } from "react";
|
||||
import FormBuilder from "zy-react-library/components/FormBuilder";
|
||||
import AddIcon from "zy-react-library/components/Icon/AddIcon";
|
||||
import LocationIcon from "zy-react-library/components/Icon/LocationIcon";
|
||||
import Map from "zy-react-library/components/Map";
|
||||
import MapSelector from "zy-react-library/components/Map/MapSelector";
|
||||
import Page from "zy-react-library/components/Page";
|
||||
import Search from "zy-react-library/components/Search";
|
||||
import DictionarySelect from "zy-react-library/components/Select/Dictionary";
|
||||
import BasicSelectTree from "zy-react-library/components/SelectTree/Basic";
|
||||
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 { getLabelName } from "zy-react-library/utils";
|
||||
import { AREA_STATUS_ENUM, AREA_TYPE_ENUM } from "~/enumerate/constant";
|
||||
import { NS_ENCLOSED_AREA, NS_FIRST_LEVEL_DOOR_INFO } from "~/enumerate/namespace";
|
||||
|
||||
const areaLevel = 2;
|
||||
|
||||
function List(props) {
|
||||
const [addModalVisible, setAddModalVisible] = useState(false);
|
||||
const [viewModalVisible, setViewModalVisible] = useState(false);
|
||||
const [currentId, setCurrentId] = useState(null);
|
||||
|
||||
const [form] = Form.useForm();
|
||||
const { tableProps, getData } = useTable(props["firstLevelDoorInfoList"], {
|
||||
form,
|
||||
params: {
|
||||
eqAreaLevel: areaLevel,
|
||||
},
|
||||
});
|
||||
|
||||
const onUpdateStatus = (record) => {
|
||||
if (record.status === 1 && (record.videoNum > 0 || record.passageNum > 0))
|
||||
return message.warning("正在使用中的口门不能停用");
|
||||
|
||||
const msg = record.status === 1 ? "停用" : "开启";
|
||||
Modal.confirm({
|
||||
title: `${msg}确认`,
|
||||
content: `确定要${msg}吗？`,
|
||||
onOk: async () => {
|
||||
const { success } = await props["firstLevelDoorInfoDelete"]({ id: record.id, status: record.status === 1 ? 0 : 1 });
|
||||
if (success) {
|
||||
message.success(`${msg}成功`);
|
||||
getData();
|
||||
}
|
||||
},
|
||||
});
|
||||
};
|
||||
|
||||
return (
|
||||
<Page isShowAllAction={false}>
|
||||
<Search
|
||||
options={[
|
||||
{ name: "likeAreaName", label: "口门名称" },
|
||||
{ name: "eqAreaStatus", label: "口门状态", render: FORM_ITEM_RENDER_ENUM.SELECT, items: AREA_STATUS_ENUM },
|
||||
{ name: "eqAreaType", label: "口门类型", render: FORM_ITEM_RENDER_ENUM.SELECT, items: AREA_TYPE_ENUM },
|
||||
{ name: "eqAreaParentId", label: "所属区域", render: <DictionarySelect dictValue="primeport_area" /> },
|
||||
]}
|
||||
form={form}
|
||||
onFinish={getData}
|
||||
/>
|
||||
<Table
|
||||
toolBarRender={() => (
|
||||
<Button
|
||||
type="primary"
|
||||
icon={(<AddIcon />)}
|
||||
onClick={() => {
|
||||
setAddModalVisible(true);
|
||||
}}
|
||||
>
|
||||
新增
|
||||
</Button>
|
||||
)}
|
||||
columns={[
|
||||
{ title: "所属区域", dataIndex: "areaParentName" },
|
||||
{
|
||||
title: "口门类型",
|
||||
dataIndex: "areaType",
|
||||
render: (_, record) => getLabelName({ list: AREA_TYPE_ENUM, status: record.areaType }),
|
||||
},
|
||||
{ title: "管辖公司", dataIndex: "todo3" },
|
||||
{ title: "口门名称", dataIndex: "areaName" },
|
||||
{
|
||||
title: "口门位置",
|
||||
dataIndex: "location",
|
||||
render: (_, record) => `${record.latitude || ""}--${record.longitude || ""}`,
|
||||
},
|
||||
{ title: "摄像头个数", dataIndex: "videoNum", render: (_, record) => record.videoNum || 0 },
|
||||
{
|
||||
title: "口门状态",
|
||||
dataIndex: "areaStatus",
|
||||
render: (_, record) => getLabelName({ list: AREA_STATUS_ENUM, status: record.areaStatus }),
|
||||
},
|
||||
{
|
||||
title: "操作",
|
||||
width: 300,
|
||||
fixed: "right",
|
||||
render: (_, record) => (
|
||||
<Space>
|
||||
<Button
|
||||
type="link"
|
||||
onClick={() => {
|
||||
setCurrentId(record.id);
|
||||
setViewModalVisible(true);
|
||||
}}
|
||||
>
|
||||
查看
|
||||
</Button>
|
||||
<Button
|
||||
type="link"
|
||||
onClick={() => {
|
||||
setCurrentId(record.id);
|
||||
setAddModalVisible(true);
|
||||
}}
|
||||
>
|
||||
编辑
|
||||
</Button>
|
||||
<Button
|
||||
type="link"
|
||||
onClick={() => {
|
||||
onUpdateStatus(record);
|
||||
}}
|
||||
>
|
||||
{record.status === 1 ? "停用" : "开启"}
|
||||
</Button>
|
||||
<Button
|
||||
type="link"
|
||||
onClick={() => {
|
||||
props.history.push(`./channel/list?areaId=${record.id}`);
|
||||
}}
|
||||
>
|
||||
添加通道
|
||||
</Button>
|
||||
<Button
|
||||
type="link"
|
||||
onClick={() => {
|
||||
props.history.push(`./camera/list?areaId=${record.id}`);
|
||||
}}
|
||||
>
|
||||
添加摄像头
|
||||
</Button>
|
||||
</Space>
|
||||
),
|
||||
},
|
||||
]}
|
||||
{...tableProps}
|
||||
/>
|
||||
{
|
||||
addModalVisible && (
|
||||
<AddModal
|
||||
id={currentId}
|
||||
onClose={() => {
|
||||
setAddModalVisible(false);
|
||||
setCurrentId(null);
|
||||
}}
|
||||
getData={getData}
|
||||
/>
|
||||
)
|
||||
}
|
||||
{
|
||||
viewModalVisible && (
|
||||
<ViewModal
|
||||
id={currentId}
|
||||
onClose={() => {
|
||||
setViewModalVisible(false);
|
||||
setCurrentId(null);
|
||||
}}
|
||||
/>
|
||||
)
|
||||
}
|
||||
</Page>
|
||||
);
|
||||
}
|
||||
|
||||
const AddModalComponent = (props) => {
|
||||
const [enclosedAreaList, setEnclosedAreaList] = useState([]);
|
||||
|
||||
const [form] = Form.useForm();
|
||||
|
||||
const getEnclosedAreaList = async () => {
|
||||
const { data } = await props["enclosedAreaDetailListTree"]();
|
||||
setEnclosedAreaList(data);
|
||||
};
|
||||
|
||||
const getData = async () => {
|
||||
const { data } = await props["firstLevelDoorInfoInfo"]({ id: props.id });
|
||||
form.setFieldsValue({
|
||||
...data,
|
||||
areaType: data.areaType.toString(),
|
||||
areaStatus: data.areaStatus.toString(),
|
||||
});
|
||||
};
|
||||
|
||||
useEffect(() => {
|
||||
getEnclosedAreaList();
|
||||
props.id && getData();
|
||||
}, []);
|
||||
|
||||
const onSubmit = async (values) => {
|
||||
const { success } = await props[!props.id ? "firstLevelDoorInfoAdd" : "firstLevelDoorInfoEdit"]({
|
||||
...values,
|
||||
areaLevel,
|
||||
id: props.id,
|
||||
});
|
||||
if (success) {
|
||||
message.success("操作成功");
|
||||
props.onClose();
|
||||
props.getData();
|
||||
}
|
||||
};
|
||||
|
||||
return (
|
||||
<Modal
|
||||
open
|
||||
title={props.id ? "编辑" : "添加"}
|
||||
maskClosable={false}
|
||||
width={800}
|
||||
onCancel={props.onClose}
|
||||
onOk={form.submit}
|
||||
confirmLoading={props.firstLevelDoorInfo.firstLevelDoorInfoLoading}
|
||||
>
|
||||
<FormBuilder
|
||||
onFinish={onSubmit}
|
||||
showActionButtons={false}
|
||||
loading={props.firstLevelDoorInfo.firstLevelDoorInfoLoading}
|
||||
labelCol={{ span: 8 }}
|
||||
span={24}
|
||||
options={[
|
||||
{ name: "areaParentId", label: "所属区域", render: <DictionarySelect dictValue="primeport_area" /> },
|
||||
{ name: "areaParentName", label: "所属区域名称", onlyForLabel: true },
|
||||
{ name: "areaName", label: "口门名称" },
|
||||
{ name: "areaType", label: "口门类型", render: FORM_ITEM_RENDER_ENUM.SELECT, items: AREA_TYPE_ENUM },
|
||||
{ name: "areaRange", label: "口门位置" },
|
||||
{ customizeRender: true, span: 24, render: <Map type="cesium" /> },
|
||||
{ name: "areaStatus", label: "口门状态", render: FORM_ITEM_RENDER_ENUM.SELECT, items: AREA_STATUS_ENUM },
|
||||
{ name: "todo6", label: "口门进入区域", render: (<BasicSelectTree treeData={enclosedAreaList} placeholder="口门进入区域" />) },
|
||||
{
|
||||
name: "todo7",
|
||||
label: "口门离开区域",
|
||||
span: 12,
|
||||
render: FORM_ITEM_RENDER_ENUM.RADIO,
|
||||
items: [{ bianma: 1, name: "离场" }, { bianma: 2, name: "进入其他区域" }],
|
||||
},
|
||||
{
|
||||
name: "todo8",
|
||||
label: "",
|
||||
span: 12,
|
||||
wrapperCol: { span: 24 },
|
||||
dependencies: ["todo7"],
|
||||
hidden: formValues => !(formValues.todo7 === 2),
|
||||
render: (<BasicSelectTree treeData={enclosedAreaList} placeholder="口门进入区域" />),
|
||||
},
|
||||
]}
|
||||
form={form}
|
||||
/>
|
||||
</Modal>
|
||||
);
|
||||
};
|
||||
|
||||
const ViewModalComponent = (props) => {
|
||||
const [info, setInfo] = useState({});
|
||||
const [mapVisible, setMapVisible] = useState(false);
|
||||
|
||||
const getData = async () => {
|
||||
const { data } = await props["firstLevelDoorInfoInfo"]({ id: props.id });
|
||||
setInfo(data);
|
||||
};
|
||||
|
||||
useEffect(() => {
|
||||
props.id && getData();
|
||||
}, []);
|
||||
|
||||
return (
|
||||
<Modal
|
||||
open
|
||||
title="查看"
|
||||
maskClosable={false}
|
||||
width={800}
|
||||
onCancel={props.onClose}
|
||||
footer={[
|
||||
<Button key="cancel" onClick={props.onClose}>取消</Button>,
|
||||
]}
|
||||
loading={props.firstLevelDoorInfo.firstLevelDoorInfoLoading}
|
||||
>
|
||||
<Descriptions
|
||||
column={1}
|
||||
bordered
|
||||
styles={{ label: { width: 200 } }}
|
||||
items={[
|
||||
{ label: "所属区域", children: info.areaParentName },
|
||||
{ label: "口门名称", children: info.areaName },
|
||||
{ label: "口门类型", children: getLabelName({ list: AREA_TYPE_ENUM, status: info.areaType }) },
|
||||
{ label: "口门位置", children: info.areaRange },
|
||||
{ label: "口门状态", children: getLabelName({ list: AREA_STATUS_ENUM, status: info.areaStatus }) },
|
||||
{
|
||||
label: "位置",
|
||||
children: (<LocationIcon onClick={() => { setMapVisible(true); }} />),
|
||||
},
|
||||
{ label: "口门进入区域", children: info.todo6 },
|
||||
{ label: "口门离开区域", children: info.todo7 === 1 ? "离场" : `进入其他区域（${info.todo8}）` },
|
||||
]}
|
||||
/>
|
||||
|
||||
<MapSelector
|
||||
visible={mapVisible}
|
||||
onClose={() => setMapVisible(false)}
|
||||
longitude={info.longitude}
|
||||
latitude={info.latitude}
|
||||
disable={true}
|
||||
type="cesium"
|
||||
/>
|
||||
</Modal>
|
||||
);
|
||||
};
|
||||
|
||||
const AddModal = Connect([NS_FIRST_LEVEL_DOOR_INFO, NS_ENCLOSED_AREA], true)(AddModalComponent);
|
||||
const ViewModal = Connect([NS_FIRST_LEVEL_DOOR_INFO], true)(ViewModalComponent);
|
||||
|
||||
export default Connect([NS_FIRST_LEVEL_DOOR_INFO], true)(List);
|
||||
|
|
@ -0,0 +1,5 @@
|
|||
function EnclosedAreaDoor(props) {
|
||||
return props.children;
|
||||
}
|
||||
|
||||
export default EnclosedAreaDoor;
|
||||
|
|
@ -0,0 +1,5 @@
|
|||
function EnclosedArea(props) {
|
||||
return props.children;
|
||||
}
|
||||
|
||||
export default EnclosedArea;
|
||||
|
|
@ -0,0 +1,5 @@
|
|||
function EnclosedArea(props) {
|
||||
return props.children;
|
||||
}
|
||||
|
||||
export default EnclosedArea;
|
||||
|
|
@ -0,0 +1,115 @@
|
|||
import useUrlState from "@ahooksjs/use-url-state";
|
||||
import { Connect } from "@cqsjjb/jjb-dva-runtime";
|
||||
import { Button, Form, Space } from "antd";
|
||||
import { useEffect } from "react";
|
||||
import BackIcon from "zy-react-library/components/Icon/BackIcon";
|
||||
import Page from "zy-react-library/components/Page";
|
||||
import Search from "zy-react-library/components/Search";
|
||||
import Table from "zy-react-library/components/Table";
|
||||
import useTable from "zy-react-library/hooks/useTable";
|
||||
import { NS_ENCLOSED_PERSONNEL_AND_VEHICLE_STATISTICS } from "~/enumerate/namespace";
|
||||
|
||||
function List(props) {
|
||||
const [urlState, setUrlState] = useUrlState({
|
||||
parentId: "0",
|
||||
backParentIds: [],
|
||||
}, {
|
||||
navigateMode: "replace",
|
||||
parseOptions: {
|
||||
arrayFormat: "index",
|
||||
},
|
||||
stringifyOptions: {
|
||||
arrayFormat: "index",
|
||||
},
|
||||
});
|
||||
|
||||
const [form] = Form.useForm();
|
||||
|
||||
const { tableProps, getData } = useTable(props["enclosedPersonnelAndVehicleStatisticsList"], {
|
||||
form,
|
||||
params: { parentId: urlState.parentId },
|
||||
manual: true,
|
||||
});
|
||||
|
||||
useEffect(() => {
|
||||
getData();
|
||||
}, [urlState.parentId]);
|
||||
|
||||
return (
|
||||
<Page isShowAllAction={false}>
|
||||
<Search
|
||||
options={[
|
||||
{ name: "todo1", label: "区域名称" },
|
||||
]}
|
||||
form={form}
|
||||
onFinish={getData}
|
||||
/>
|
||||
<Table
|
||||
toolBarRender={() => (
|
||||
<Space>
|
||||
{
|
||||
urlState.parentId !== "0" && (
|
||||
<Button
|
||||
icon={<BackIcon />}
|
||||
onClick={() => {
|
||||
setUrlState({
|
||||
parentId: urlState.backParentIds.at(-1),
|
||||
backParentIds: urlState.backParentIds.slice(0, -1),
|
||||
});
|
||||
}}
|
||||
>
|
||||
返回
|
||||
</Button>
|
||||
)
|
||||
}
|
||||
</Space>
|
||||
)}
|
||||
columns={[
|
||||
{ title: "区域名称", dataIndex: "todo1", render: (_, record) => (
|
||||
<Button
|
||||
type="link"
|
||||
onClick={() => {
|
||||
setUrlState({
|
||||
parentId: record.id,
|
||||
backParentIds: [...urlState.backParentIds, urlState.parentId],
|
||||
});
|
||||
}}
|
||||
>
|
||||
{record.todo1}
|
||||
</Button>
|
||||
) },
|
||||
{ title: "人员现存数", dataIndex: "todo2" },
|
||||
{ title: "车辆现存数", dataIndex: "todo3" },
|
||||
{
|
||||
title: "操作",
|
||||
width: 200,
|
||||
fixed: "right",
|
||||
render: (_, record) => (
|
||||
<Space>
|
||||
<Button
|
||||
type="link"
|
||||
onClick={() => {
|
||||
props.history.push(`./vehicleEntryAndExitRecords?id=${record.id}`);
|
||||
}}
|
||||
>
|
||||
车辆进出记录
|
||||
</Button>
|
||||
<Button
|
||||
type="link"
|
||||
onClick={() => {
|
||||
props.history.push(`./personnelEntryAndExitRecords?id=${record.id}`);
|
||||
}}
|
||||
>
|
||||
人员进出记录
|
||||
</Button>
|
||||
</Space>
|
||||
),
|
||||
},
|
||||
]}
|
||||
{...tableProps}
|
||||
/>
|
||||
</Page>
|
||||
);
|
||||
}
|
||||
|
||||
export default Connect([NS_ENCLOSED_PERSONNEL_AND_VEHICLE_STATISTICS], true)(List);
|
||||
|
|
@ -0,0 +1,52 @@
|
|||
import { Connect } from "@cqsjjb/jjb-dva-runtime";
|
||||
import { Form } from "antd";
|
||||
import Page from "zy-react-library/components/Page";
|
||||
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 useGetUrlQuery from "zy-react-library/hooks/useGetUrlQuery";
|
||||
import useTable from "zy-react-library/hooks/useTable";
|
||||
import { getLabelName } from "zy-react-library/utils";
|
||||
import { NS_ENCLOSED_PERSONNEL_AND_VEHICLE_STATISTICS } from "~/enumerate/namespace";
|
||||
import { CATEGORY_ENUM } from "../VehicleEntryAndExitRecords";
|
||||
|
||||
function PersonnelEntryAndExitRecords(props) {
|
||||
const [form] = Form.useForm();
|
||||
const query = useGetUrlQuery();
|
||||
|
||||
const { tableProps, getData } = useTable(props["enclosedPersonnelAndVehicleStatisticsPersonnelEntryAndExitRecordsList"], {
|
||||
form,
|
||||
params: { id: query.id },
|
||||
});
|
||||
|
||||
return (
|
||||
<Page headerTitle="人员进出记录">
|
||||
<Search
|
||||
options={[
|
||||
{ name: "todo1", label: "人员姓名" },
|
||||
{ name: "todo2", label: "时间范围", render: FORM_ITEM_RENDER_ENUM.DATE_RANGE },
|
||||
{ name: "todo3", label: "人员类别", render: FORM_ITEM_RENDER_ENUM.SELECT },
|
||||
]}
|
||||
form={form}
|
||||
onFinish={getData}
|
||||
/>
|
||||
<Table
|
||||
columns={[
|
||||
{ title: "姓名", dataIndex: "todo1" },
|
||||
{ title: "手机号", dataIndex: "todo2" },
|
||||
{
|
||||
title: "人员类别",
|
||||
dataIndex: "todo3",
|
||||
render: (_, record) => getLabelName({ list: CATEGORY_ENUM, status: record.todo3 }),
|
||||
},
|
||||
{ title: "口门名称", dataIndex: "todo4" },
|
||||
{ title: "记录时间", dataIndex: "todo5" },
|
||||
{ title: "出入动作", dataIndex: "todo6" },
|
||||
]}
|
||||
{...tableProps}
|
||||
/>
|
||||
</Page>
|
||||
);
|
||||
}
|
||||
|
||||
export default Connect([NS_ENCLOSED_PERSONNEL_AND_VEHICLE_STATISTICS], true)(PersonnelEntryAndExitRecords);
|
||||
|
|
@ -0,0 +1,60 @@
|
|||
import { Connect } from "@cqsjjb/jjb-dva-runtime";
|
||||
import { Form } from "antd";
|
||||
import Page from "zy-react-library/components/Page";
|
||||
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 useGetUrlQuery from "zy-react-library/hooks/useGetUrlQuery";
|
||||
import useTable from "zy-react-library/hooks/useTable";
|
||||
import { getLabelName } from "zy-react-library/utils";
|
||||
import { NS_ENCLOSED_PERSONNEL_AND_VEHICLE_STATISTICS } from "~/enumerate/namespace";
|
||||
|
||||
export const CATEGORY_ENUM = [
|
||||
{ bianma: "1", name: "内部人员" },
|
||||
{ bianma: "2", name: "股份公司" },
|
||||
{ bianma: "3", name: "相关方" },
|
||||
{ bianma: "4", name: "临时访客" },
|
||||
];
|
||||
|
||||
function VehicleEntryAndExitRecords(props) {
|
||||
const [form] = Form.useForm();
|
||||
const query = useGetUrlQuery();
|
||||
|
||||
const { tableProps, getData } = useTable(props["enclosedPersonnelAndVehicleStatisticsVehicleEntryAndExitRecordsList"], {
|
||||
form,
|
||||
params: { id: query.id },
|
||||
});
|
||||
|
||||
return (
|
||||
<Page headerTitle="车辆进出记录">
|
||||
<Search
|
||||
options={[
|
||||
{ name: "todo1", label: "车牌号" },
|
||||
{ name: "todo2", label: "时间范围", render: FORM_ITEM_RENDER_ENUM.DATE_RANGE },
|
||||
{ name: "todo3", label: "车辆属性", render: FORM_ITEM_RENDER_ENUM.SELECT, items: CATEGORY_ENUM },
|
||||
]}
|
||||
form={form}
|
||||
onFinish={getData}
|
||||
/>
|
||||
<Table
|
||||
columns={[
|
||||
{ title: "车辆类型", dataIndex: "todo1" },
|
||||
{ title: "车牌号", dataIndex: "todo2" },
|
||||
{
|
||||
title: "车辆属性",
|
||||
dataIndex: "todo3",
|
||||
render: (_, record) => getLabelName({ list: CATEGORY_ENUM, status: record.todo3 }),
|
||||
},
|
||||
{ title: "姓名", dataIndex: "todo4" },
|
||||
{ title: "手机号", dataIndex: "todo5" },
|
||||
{ title: "口门名称", dataIndex: "todo6" },
|
||||
{ title: "记录时间", dataIndex: "todo7" },
|
||||
{ title: "出入动作", dataIndex: "todo8" },
|
||||
]}
|
||||
{...tableProps}
|
||||
/>
|
||||
</Page>
|
||||
);
|
||||
}
|
||||
|
||||
export default Connect([NS_ENCLOSED_PERSONNEL_AND_VEHICLE_STATISTICS], true)(VehicleEntryAndExitRecords);
|
||||
|
|
@ -0,0 +1,5 @@
|
|||
function personnelAndVehicleStatistics(props) {
|
||||
return props.children;
|
||||
}
|
||||
|
||||
export default personnelAndVehicleStatistics;
|
||||
Loading…
Reference in New Issue