From d34c0c868f26305e0fd919682f7a65f53a86d381 Mon Sep 17 00:00:00 2001 From: He Huan Date: Wed, 17 Jan 2024 15:07:22 +0800 Subject: [PATCH] =?UTF-8?q?feat():=E6=96=B0=E5=A2=9E=E7=89=A9=E7=90=86?= =?UTF-8?q?=E6=A1=A9=E7=AE=A1=E7=90=86=E5=92=8C=E5=9C=B0=E9=94=81=E7=AE=A1?= =?UTF-8?q?=E7=90=86=E9=A1=B5=E9=9D=A2?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../ChargeDeviceMgm/GroundLockManagement/index.jsx | 6 + .../GroundLockManagement/index.scss | 58 ++++ .../GroundLockManagement/loadable.jsx | 316 +++++++++++++++++++++ .../PhysicalPileManagement/index.jsx | 6 + .../PhysicalPileManagement/index.scss | 58 ++++ .../PhysicalPileManagement/loadable.jsx | 316 +++++++++++++++++++++ src/pages/NewEnergy/ChargeDeviceMgm/index.jsx | 6 + src/pages/NewEnergy/index.jsx | 2 + src/router/router.config.js | 12 + src/services/NewEnergy/ChargeDeviceMgm.js | 14 + src/services/NewEnergy/index.js | 4 +- 11 files changed, 797 insertions(+), 1 deletion(-) create mode 100644 src/pages/NewEnergy/ChargeDeviceMgm/GroundLockManagement/index.jsx create mode 100644 src/pages/NewEnergy/ChargeDeviceMgm/GroundLockManagement/index.scss create mode 100644 src/pages/NewEnergy/ChargeDeviceMgm/GroundLockManagement/loadable.jsx create mode 100644 src/pages/NewEnergy/ChargeDeviceMgm/PhysicalPileManagement/index.jsx create mode 100644 src/pages/NewEnergy/ChargeDeviceMgm/PhysicalPileManagement/index.scss create mode 100644 src/pages/NewEnergy/ChargeDeviceMgm/PhysicalPileManagement/loadable.jsx create mode 100644 src/services/NewEnergy/ChargeDeviceMgm.js diff --git a/src/pages/NewEnergy/ChargeDeviceMgm/GroundLockManagement/index.jsx b/src/pages/NewEnergy/ChargeDeviceMgm/GroundLockManagement/index.jsx new file mode 100644 index 0000000..c45021e --- /dev/null +++ b/src/pages/NewEnergy/ChargeDeviceMgm/GroundLockManagement/index.jsx @@ -0,0 +1,6 @@ +import React from "react" +import loadable from "@loadable/component" +import { LoadingImg } from "@/components" + +const TimeRuleLoadable = loadable(() => import("./loadable")) +export default (pros) => } /> \ No newline at end of file diff --git a/src/pages/NewEnergy/ChargeDeviceMgm/GroundLockManagement/index.scss b/src/pages/NewEnergy/ChargeDeviceMgm/GroundLockManagement/index.scss new file mode 100644 index 0000000..da7212c --- /dev/null +++ b/src/pages/NewEnergy/ChargeDeviceMgm/GroundLockManagement/index.scss @@ -0,0 +1,58 @@ +.modal-rule-detail{ + .ant-modal-body{ + display: flex; + justify-content: center; + } + + .form-container{ + width: 400px; + .cc-form-input,.cc-form-select{ + margin-bottom: 10px; + } + + .yisa-search{ + display: flex; + align-items: center; + margin-bottom: 10px; + .modal-start-time{ + display: flex; + justify-content: right; + margin-right: 10px; + text-align: right; + width: calc(100% - 274px - 10px); + + } + .ant-picker{ + width: 274px; + } + label{ + color: var(--color-search-list-item-text); + } + .redLogo{ + margin-right:0px; + color: #ef5454; + } + .line{ + width: calc(100% - 249px - 10px); + margin-right: 10px; + text-align: right; + color: var(--color-search-list-item-text); + } + .ant-input{ + width: 274px; + } + } + .form-select-single-name{ + em{ + margin-right:0px; + color: #ef5454; + } + } + } +} +.operateBtn { + div { + cursor: pointer; + margin-top: 5px; + } +} \ No newline at end of file diff --git a/src/pages/NewEnergy/ChargeDeviceMgm/GroundLockManagement/loadable.jsx b/src/pages/NewEnergy/ChargeDeviceMgm/GroundLockManagement/loadable.jsx new file mode 100644 index 0000000..676ac0d --- /dev/null +++ b/src/pages/NewEnergy/ChargeDeviceMgm/GroundLockManagement/loadable.jsx @@ -0,0 +1,316 @@ +import React, { useState, useRef, useEffect } from "react"; +import { message, Pagination, Table, Space, Modal, Button ,Popover,Input,TimePicker,InputNumber} from "antd"; +// import { dictionary, utils } from "@/config/common"; +// import moment from 'moment' +// import { useSessionStorageState, useUpdateEffect, useSize, useUpdate } from 'ahooks'; +import ajax from "@/services"; +import { TableModule ,FormInput,FormSelect} from "@/components"; +import "./index.scss"; +import moment from "moment"; +// import errorImg from "@/assets/images/layout/error.png" +// import { useLocation } from "react-router-dom"; +const { TextArea } = Input; +function GroundLockManagement() { + const selectData= [ + { + label: "全部", + value: "0", + }, + { + label: "公休日",//1公休日、2工作日、3节假日 + value: "1", + }, + { + label: "工作日", + value: "2", + }, + { + label: "节假日", + value: "3", + }, + + ] + const listData={ + name: "", + code:"", + start_time: '00:00:00', + model: '', + muzzle_num: "", + } + const columns = [ + { + title: "序号", + dataIndex: "index", + key: "index", + align:"center", + render: (_, record, index) => { + return index + 1; + }, + }, + { + title: "设备名称", + dataIndex: "name", + align: "center", + }, + { + title: "硬件编码", + dataIndex: "code", + key: "code", + align: "center", + }, + { + title: "所在充电站", + dataIndex: "start_time", + align: "center", + }, + { + title: "设备型号", + dataIndex: "model", + key: "model", + align: "center", + }, + { + title: "枪口数量", + dataIndex: "muzzle_num", + key: "muzzle_num", + align: "center", + }, + ]; + const formSearch = [ + { + type: "Input", + label: "设备名称", + placeholder: "请输入名称", + autoComplete:"off", + name: "name", + }, + { + type: "Select", + label: "充电站名称", + name: "date_type", + placeholder:"请选择日期类型", + options:selectData + }, + ]; + const tableRef = useRef(null); + //搜索参数初始化 + const initFormData = { + name: "", + date_type: "0", + }; + const [visible, setVisible] = useState(false); + const [actionState, setActionState] = useState(null); //操作状态 + // 新增数据 + const [rowData, setRowData] = useState(listData); + //搜索的结果 + const [tableData, setTableData] = useState([]); + //搜索的总结果数 + const [total, setTotal] = useState(10); + //储存编辑的id + const [editId,setEditId] = useState(""); + function search(params) { + ajax.getList(params).then((res) => { + if (res.status === 20000) { + setTableData(res.data.list); + setTotal(res.data.total); + } + }); + } + function addButton() { + return ( + + ); + } + // 确定 + const handleOk = () => { + if(!rowData.name){ + message.destroy(); + message.warning(`名称不可为空`); + return + }else if(!rowData.date_type){ + message.destroy(); + message.warning(`日期类型不可为空`); + return + } + else if(rowData.start_time==rowData.end_time){ + message.destroy(); + message.warning(`开始时间不能与结束时间相同！`); + return + } + else if(rowData.is_in===""){ + message.destroy(); + message.warning(`是否可进入不可为空`); + return + } + else if(rowData.is_out===""){ + message.destroy(); + message.warning(`是否可出场不可为空`); + return + } + let data = rowData + if(actionState=="edit"){ + data={...rowData,id:editId} + Modal.confirm({ + title: `提示`, + content: `修改的数据可能导致已绑定的数据出错，是否修改？`, + onOk: () => {addAjax(data,'修改成功')} + }) + }else{ + addAjax(data,'新增成功') + } + } + //新增修改函数 + const addAjax = (data,messageDate) => { + ajax.getTimeRuleDetailsAdd(data).then((res) => { + if (res.status === 20000) { + setVisible(false); + message.success(messageDate) + setRowData(listData) + tableRef.current.fetch(1,{}) + }else { + message.error(res?.message); + } + }); + } + const handleDel = (record) => { + Modal.confirm({ + title: `提示`, + content: `是否确认删除选中的数据项？`, + onOk: () => { + ajax.delTimeRuleDetails({id:record.id}).then((res) => { + if (res.status === 20000) { + message.success('删除成功') + tableRef.current.fetch(1,{}) + }else { + message.error(res?.message); + } + }); + } + }) + } + // 取消 + const onCancel = () => { + setActionState(null); + setVisible(false); + }; + // 弹窗标题 + const getModalTitle = (key) => { + switch (key) { + case "edit": + return "修改时间详情"; + case "add": + return "添加时间详情"; + default: + break; + } + }; + return ( + <> + + { + setRowData({ + name: "", + date_type:"", + start_time: '00:00:00', + end_time: '23:59:59', + is_in: "", + is_out: "", + remarks: "", + }) + }} + > +
+ { setRowData({ ...rowData, name: e.target.value }) }} + /> + { setRowData({ ...rowData, code: e.target.value }) }} + /> + { setRowData({ ...rowData, model: e.target.value }) }} + /> +
+
+
*
+ +
+ + {/* { + // handleInputChange('long', e, idx) + console.log(e) + } + }> + */} +
+ + { setRowData({ ...rowData,date_type: e }) }} + /> +
+ + + ); +} + +export default GroundLockManagement; diff --git a/src/pages/NewEnergy/ChargeDeviceMgm/PhysicalPileManagement/index.jsx b/src/pages/NewEnergy/ChargeDeviceMgm/PhysicalPileManagement/index.jsx new file mode 100644 index 0000000..c45021e --- /dev/null +++ b/src/pages/NewEnergy/ChargeDeviceMgm/PhysicalPileManagement/index.jsx @@ -0,0 +1,6 @@ +import React from "react" +import loadable from "@loadable/component" +import { LoadingImg } from "@/components" + +const TimeRuleLoadable = loadable(() => import("./loadable")) +export default (pros) => } /> \ No newline at end of file diff --git a/src/pages/NewEnergy/ChargeDeviceMgm/PhysicalPileManagement/index.scss b/src/pages/NewEnergy/ChargeDeviceMgm/PhysicalPileManagement/index.scss new file mode 100644 index 0000000..da7212c --- /dev/null +++ b/src/pages/NewEnergy/ChargeDeviceMgm/PhysicalPileManagement/index.scss @@ -0,0 +1,58 @@ +.modal-rule-detail{ + .ant-modal-body{ + display: flex; + justify-content: center; + } + + .form-container{ + width: 400px; + .cc-form-input,.cc-form-select{ + margin-bottom: 10px; + } + + .yisa-search{ + display: flex; + align-items: center; + margin-bottom: 10px; + .modal-start-time{ + display: flex; + justify-content: right; + margin-right: 10px; + text-align: right; + width: calc(100% - 274px - 10px); + + } + .ant-picker{ + width: 274px; + } + label{ + color: var(--color-search-list-item-text); + } + .redLogo{ + margin-right:0px; + color: #ef5454; + } + .line{ + width: calc(100% - 249px - 10px); + margin-right: 10px; + text-align: right; + color: var(--color-search-list-item-text); + } + .ant-input{ + width: 274px; + } + } + .form-select-single-name{ + em{ + margin-right:0px; + color: #ef5454; + } + } + } +} +.operateBtn { + div { + cursor: pointer; + margin-top: 5px; + } +} \ No newline at end of file diff --git a/src/pages/NewEnergy/ChargeDeviceMgm/PhysicalPileManagement/loadable.jsx b/src/pages/NewEnergy/ChargeDeviceMgm/PhysicalPileManagement/loadable.jsx new file mode 100644 index 0000000..3a835a1 --- /dev/null +++ b/src/pages/NewEnergy/ChargeDeviceMgm/PhysicalPileManagement/loadable.jsx @@ -0,0 +1,316 @@ +import React, { useState, useRef, useEffect } from "react"; +import { message, Pagination, Table, Space, Modal, Button ,Popover,Input,TimePicker,InputNumber} from "antd"; +// import { dictionary, utils } from "@/config/common"; +// import moment from 'moment' +// import { useSessionStorageState, useUpdateEffect, useSize, useUpdate } from 'ahooks'; +import ajax from "@/services"; +import { TableModule ,FormInput,FormSelect} from "@/components"; +import "./index.scss"; +import moment from "moment"; +// import errorImg from "@/assets/images/layout/error.png" +// import { useLocation } from "react-router-dom"; +const { TextArea } = Input; +function PhysicalPileManagement() { + const selectData= [ + { + label: "全部", + value: "0", + }, + { + label: "公休日",//1公休日、2工作日、3节假日 + value: "1", + }, + { + label: "工作日", + value: "2", + }, + { + label: "节假日", + value: "3", + }, + + ] + const listData={ + name: "", + code:"", + start_time: '00:00:00', + model: '', + muzzle_num: "", + } + const columns = [ + { + title: "序号", + dataIndex: "index", + key: "index", + align:"center", + render: (_, record, index) => { + return index + 1; + }, + }, + { + title: "设备名称", + dataIndex: "name", + align: "center", + }, + { + title: "硬件编码", + dataIndex: "code", + key: "code", + align: "center", + }, + { + title: "所在充电站", + dataIndex: "start_time", + align: "center", + }, + { + title: "设备型号", + dataIndex: "model", + key: "model", + align: "center", + }, + { + title: "枪口数量", + dataIndex: "muzzle_num", + key: "muzzle_num", + align: "center", + }, + ]; + const formSearch = [ + { + type: "Input", + label: "设备名称", + placeholder: "请输入名称", + autoComplete:"off", + name: "name", + }, + { + type: "Select", + label: "充电站名称", + name: "date_type", + placeholder:"请选择日期类型", + options:selectData + }, + ]; + const tableRef = useRef(null); + //搜索参数初始化 + const initFormData = { + name: "", + date_type: "0", + }; + const [visible, setVisible] = useState(false); + const [actionState, setActionState] = useState(null); //操作状态 + // 新增数据 + const [rowData, setRowData] = useState(listData); + //搜索的结果 + const [tableData, setTableData] = useState([]); + //搜索的总结果数 + const [total, setTotal] = useState(10); + //储存编辑的id + const [editId,setEditId] = useState(""); + function search(params) { + ajax.getList(params).then((res) => { + if (res.status === 20000) { + setTableData(res.data.list); + setTotal(res.data.total); + } + }); + } + function addButton() { + return ( + + ); + } + // 确定 + const handleOk = () => { + if(!rowData.name){ + message.destroy(); + message.warning(`名称不可为空`); + return + }else if(!rowData.date_type){ + message.destroy(); + message.warning(`日期类型不可为空`); + return + } + else if(rowData.start_time==rowData.end_time){ + message.destroy(); + message.warning(`开始时间不能与结束时间相同！`); + return + } + else if(rowData.is_in===""){ + message.destroy(); + message.warning(`是否可进入不可为空`); + return + } + else if(rowData.is_out===""){ + message.destroy(); + message.warning(`是否可出场不可为空`); + return + } + let data = rowData + if(actionState=="edit"){ + data={...rowData,id:editId} + Modal.confirm({ + title: `提示`, + content: `修改的数据可能导致已绑定的数据出错，是否修改？`, + onOk: () => {addAjax(data,'修改成功')} + }) + }else{ + addAjax(data,'新增成功') + } + } + //新增修改函数 + const addAjax = (data,messageDate) => { + ajax.getTimeRuleDetailsAdd(data).then((res) => { + if (res.status === 20000) { + setVisible(false); + message.success(messageDate) + setRowData(listData) + tableRef.current.fetch(1,{}) + }else { + message.error(res?.message); + } + }); + } + const handleDel = (record) => { + Modal.confirm({ + title: `提示`, + content: `是否确认删除选中的数据项？`, + onOk: () => { + ajax.delTimeRuleDetails({id:record.id}).then((res) => { + if (res.status === 20000) { + message.success('删除成功') + tableRef.current.fetch(1,{}) + }else { + message.error(res?.message); + } + }); + } + }) + } + // 取消 + const onCancel = () => { + setActionState(null); + setVisible(false); + }; + // 弹窗标题 + const getModalTitle = (key) => { + switch (key) { + case "edit": + return "修改时间详情"; + case "add": + return "添加时间详情"; + default: + break; + } + }; + return ( + <> + + { + setRowData({ + name: "", + date_type:"", + start_time: '00:00:00', + end_time: '23:59:59', + is_in: "", + is_out: "", + remarks: "", + }) + }} + > +
+ { setRowData({ ...rowData, name: e.target.value }) }} + /> + { setRowData({ ...rowData, code: e.target.value }) }} + /> + { setRowData({ ...rowData, model: e.target.value }) }} + /> +
+
+
*
+ +
+ + {/* { + // handleInputChange('long', e, idx) + console.log(e) + } + }> + */} +
+ + { setRowData({ ...rowData,date_type: e }) }} + /> +
+ + + ); +} + +export default PhysicalPileManagement; diff --git a/src/pages/NewEnergy/ChargeDeviceMgm/index.jsx b/src/pages/NewEnergy/ChargeDeviceMgm/index.jsx index e69de29..14b1a96 100644 --- a/src/pages/NewEnergy/ChargeDeviceMgm/index.jsx +++ b/src/pages/NewEnergy/ChargeDeviceMgm/index.jsx @@ -0,0 +1,6 @@ +import PhysicalPileManagement from './PhysicalPileManagement' +import GroundLockManagement from './GroundLockManagement' +export default { + PhysicalPileManagement, + GroundLockManagement + } \ No newline at end of file diff --git a/src/pages/NewEnergy/index.jsx b/src/pages/NewEnergy/index.jsx index 65094c1..95baac1 100644 --- a/src/pages/NewEnergy/index.jsx +++ b/src/pages/NewEnergy/index.jsx @@ -3,6 +3,7 @@ import NewEnergyOverview from './NewEnergyOverview' import ChargeStationMgm from './ChargeStationMgm' import RecordsInquiry from './RecordsInquiry' import RealtimeMonitor from './RealtimeMonitor' +import ChargeDeviceMgm from './ChargeDeviceMgm' export default { NewEnergyOverview, @@ -10,4 +11,5 @@ export default { ...RealtimeMonitor, ...ChargingMgm, ...RecordsInquiry, + ...ChargeDeviceMgm, } \ No newline at end of file diff --git a/src/router/router.config.js b/src/router/router.config.js index 98a79e9..1942cee 100644 --- a/src/router/router.config.js +++ b/src/router/router.config.js @@ -1389,6 +1389,18 @@ let routes = [ text: "电桩监控", name: "pileMonitor", component: pages.PileMonitor, + }, + { + path: "/newEnergy/physicalPileManagement", + text: "物理桩管理", + name: "physicalPileManagement", + component: pages.PhysicalPileManagement, + }, + { + path: "/newEnergy/groundLockManagement", + text: "地锁管理", + name: "groundLockManagement", + component: pages.GroundLockManagement, } ], }, diff --git a/src/services/NewEnergy/ChargeDeviceMgm.js b/src/services/NewEnergy/ChargeDeviceMgm.js new file mode 100644 index 0000000..c6e9994 --- /dev/null +++ b/src/services/NewEnergy/ChargeDeviceMgm.js @@ -0,0 +1,14 @@ +import ajax from "@/config/ajax" + +//获取物理桩管理-列表 +const getList = (params) => { + return ajax({ + url: "/api/nes/device/list", + type: "post", + data: params, + }); +}; + +export default{ + getList, +} \ No newline at end of file diff --git a/src/services/NewEnergy/index.js b/src/services/NewEnergy/index.js index 67d7dff..c59090b 100644 --- a/src/services/NewEnergy/index.js +++ b/src/services/NewEnergy/index.js @@ -1,9 +1,11 @@ import chargingMgm from './chargingMgm' import chargeStationMgm from './ChargeStationMgm' import realtimeMonitor from './realtimeMonitor' +import ChargeDeviceMgm from './ChargeDeviceMgm' export default { ...chargingMgm, ...chargeStationMgm, - ...realtimeMonitor + ...realtimeMonitor, + ...ChargeDeviceMgm } \ No newline at end of file