From 1c5b28f01e6ae56e7b50c3cf759bfff2fc5ce29e Mon Sep 17 00:00:00 2001 From: zhangjian Date: Mon, 15 Jan 2024 17:01:58 +0800 Subject: [PATCH] =?UTF-8?q?feat():=E5=AE=8C=E6=88=90=E5=9C=B0=E9=94=81?= =?UTF-8?q?=E7=9B=91=E6=8E=A7=E9=A1=B5=E9=9D=A2=E7=9A=84=E6=8E=A5=E5=8F=A3?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../RealtimeMonitor/LockMonitor/index.jsx | 4 +- .../RealtimeMonitor/LockMonitor/loadable.jsx | 1045 +------------------- .../RealtimeMonitor/PileMonitor/loadable.jsx | 571 +---------- src/services/NewEnergy/index.js | 4 +- src/services/NewEnergy/realtimeMonitor.js | 14 + src/services/index.js | 4 +- 6 files changed, 115 insertions(+), 1527 deletions(-) create mode 100644 src/services/NewEnergy/realtimeMonitor.js diff --git a/src/pages/NewEnergy/RealtimeMonitor/LockMonitor/index.jsx b/src/pages/NewEnergy/RealtimeMonitor/LockMonitor/index.jsx index d155dc7..d6150c1 100644 --- a/src/pages/NewEnergy/RealtimeMonitor/LockMonitor/index.jsx +++ b/src/pages/NewEnergy/RealtimeMonitor/LockMonitor/index.jsx @@ -2,5 +2,5 @@ import React from "react" import loadable from "@loadable/component" import { LoadingImg } from "@/components" -const LockMonitor = loadable(() => import("./loadable")) -export default (pros) => } /> \ No newline at end of file +const PileMonitor = loadable(() => import("./loadable")) +export default (pros) => } /> \ No newline at end of file diff --git a/src/pages/NewEnergy/RealtimeMonitor/LockMonitor/loadable.jsx b/src/pages/NewEnergy/RealtimeMonitor/LockMonitor/loadable.jsx index b2afd6b..fe1f87b 100644 --- a/src/pages/NewEnergy/RealtimeMonitor/LockMonitor/loadable.jsx +++ b/src/pages/NewEnergy/RealtimeMonitor/LockMonitor/loadable.jsx @@ -23,392 +23,52 @@ import errorImg from '@/assets/images/error-img-new.png' import { QuestionCircleOutlined } from '@ant-design/icons'; import { TableModule } from "@/components"; import "./index.scss"; -import { - payRecordColumns, - refundRecordColumns, - operatorRecordColumns, -} from "./dataSource"; + // import errorImg from "@/assets/images/layout/error.png" // import { useLocation } from "react-router-dom"; const { TextArea } = Input; let array = []; -function LockMonitor() { - const roadContent = ( -
-

出场时间-入场时间的计算金额

-
- ) - const receivableContent = ( -
-

订单金额-折扣金额

-
- ) - const discountContent = ( -
-

折扣金额=停车卡抵扣+路段折扣

-
- ) - const preferentialContent = ( -
-

优惠券支付金额

-
- ) - const refundContent = ( -
-

退款总计=退实付+退优惠

-
- ) - const columns = [ - { - title: "序号", - dataIndex: "index", - key: "index", - align: "center", - fixed: "left", - render: (text, record, index) => index + 1, - width: 100, - }, - - { - title: "路段名称", - dataIndex: "road", - align: "center", - render: (text, record, index) => ( -
{record.road}
- ) - }, - { - title: "车牌号", - dataIndex: "plate", - align: "center", - render: (text, record, index) => ( -
{record.plate}
- ) - }, - { - title: "车牌颜色", - dataIndex: "plate_color", - key: "plate_color", - width: 100, - align: "center", - }, - { - title: "泊位号", - dataIndex: "berth_id", - key: "berth_id", - width: 100, - align: "center", - }, - { - title: "入场时间", - dataIndex: "in_time", - align: "center", - render: (text, record, index) => ( -
{record.in_time}
- ) - }, - { - title: "离场时间", - dataIndex: "out_time", - align: "center", - render: (text, record, index) => ( -
{record.out_time}
- ) - }, - { - title: "停车时长", - dataIndex: "admission_time", - key: "admission_time", - width: 100, - align: "center", - }, - { - title: "入场收费员", - dataIndex: "in_person", - key: "in_person", - width: 100, - align: "center", +function PileMonitor() { - }, - { - title: "出场收费员", - dataIndex: "out_person", - key: "out_person", - width: 100, - align: "center", - }, - { - title: - 订单金额 - - , - dataIndex: "order_amount", - key: "order_amount", - width: 100, - align: "center", - // filterDropdown: true, - // filterIcon: - // - // - // - }, - { - title: - 应收金额 - - , - dataIndex: "receivable_amount", - key: "receivable_amount", - width: 100, - align: "center", - // filterDropdown: true, - // filterIcon: - // - // - // - }, - { - title: - 折扣金额 - - , - dataIndex: "discount_amount", - key: "discount_amount", - width: 100, - align: "center", - // filterDropdown: true, - // filterIcon: - // - // - // - }, - { - title: - 优惠金额 - - , - dataIndex: "preferential_amount", - key: "preferential_amount", - width: 100, - align: "center", - // filterDropdown: true, - // filterIcon: - // - // - // - }, - { - title: "实付金额", - dataIndex: "actual_amount", - key: "actual_amount", - width: 100, - align: "center", - }, - { - title: - 退款总计 - - , - dataIndex: "refund_total", - key: "refund_total", - width: 100, - align: "center", - // filterDropdown: true, - // filterIcon: - // - // - // - }, - { - title: "停车记录ID", - dataIndex: "park_id", - align: "center", - render: (text, record, index) => ( -
- { - navigator.clipboard.writeText(`${text}`).then(() => { message.success("已复制到剪切板") }); - }}>{record.park_id} -
- ), - }, - { - title: "区域", - dataIndex: "region", - align: "center", - render: (text, record, index) => ( -
{record.region}
- ) - }, - { - title: "商户名称", - dataIndex: "operator", - align: "center", - render: (text, record, index) => ( -
{record.operator}
- ) - }, - { - title: "路段类型", - dataIndex: "road_type", - key: "road_type", - width: 100, - align: "center", - }, - { - title: "操作", - dataIndex: "operation", - key: "operation", - align: "center", - fixed: "right", - width: 100, - render: (text, record, index) => { - setDataDetail(record) - return ( - <> - - - ) - }, - }, - ]; const formSearch = [ { - name: "region", - type: "TreeSelect", - label: "区域", - }, - { - name: "operator", - type: "Select", - label: "商户名称", - defaultValue: "0", - placeholder: "请选择商户名称", - }, - { - name: "road", - type: "SearchSelect", - label: "路段名称", - placeholder: "请输入路段名称", - }, - { - name: "road_type", - type: "Select", - label: "路段类型", - defaultValue: 0, - options: sysConfig.roadType, - }, - { - name: "phone", - type: "Input", - label: "手机号", - placeholder: "请输入手机号", - }, - { - name: "plate", + name: "device_name", type: "Input", - label: "车牌号", - placeholder: "请输入车牌号", - }, - { - name: "berth_id", - type: "Input", - label: "泊位号", - placeholder: "请输入泊位号", - }, - { - name: "type", - type: "Select", - label: "出入场类型", - defaultValue: 1, - options: [ - { - label: "入场", - value: 1, - }, - { - label: "出场", - value: 2, - }, - ], + label: "设备名称", + placeholder:"请输入" }, { - name: "park_id", + name: "device_num", type: "Input", - label: "停车记录ID", - placeholder: "请输入停车记录ID", + label: "设备编码", + placeholder:"请输入" }, { - name: "plate_color", + name: "device_state", type: "Select", - label: "车牌颜色", - placeholder: "请输入车牌颜色", - options: sysConfig.plateColor, + label: "设备状态", + defaultValue: 0, + options: sysConfig.energyDeviceType, }, { - name: "order_type", + name: "lock_state", type: "Select", - label: "订单类型", + label: "车位锁状态", defaultValue: 0, - options: [ - { - label: "全部", - value: 0, - }, - { - label: "进行中", - value: 1, - }, - { - label: "待支付", - value: 2, - }, - { - label: "已支付", - value: 3, - } - ], - }, - { - name: "in_person", - type: "Input", - label: "入场收费员", - placeholder: "请输入入场收费员", - }, - { - name: "out_person", - type: "Input", - label: "出场收费员", - placeholder: "请输入出场收费员", - }, - { - name: "timePeriod", - type: "RangePicker", - label: "时间段", + options: sysConfig.energyLockState, }, + ]; const initFormData = { - region: ["0"], - operator: "0", - road: "0", - road_type: 0, - phone: "", - plate: "", - berth_id: "", - type: 1, - park_id: "", - order_type: 0, - plate_color: -1, - in_person: "", - out_person: "", + device_name:"", + device_num:"" }; //历史处理的表头 - const historyProgressColumns = [ + const columns = [ { title: "序号", dataIndex: "id", @@ -417,62 +77,45 @@ function LockMonitor() { render: (text, record, index) => index + 1, }, { - title: "状态", - dataIndex: "status", - key: "status", + title: "设备名称", + dataIndex: "device_name", + key: "device_name", align: "center", }, { - title: "处理记录ID", - dataIndex: "deal_record_id", - key: "deal_record_id", + title: "设备编码", + dataIndex: "device_num", + key: "device_num", align: "center", }, { - title: "处理时间", - dataIndex: "deal_time", - key: "deal_time", + title: "设备类型", + dataIndex: "device_type", + key: "device_type", align: "center", }, { - title: "处理人", - dataIndex: "dealer", - key: "dealer", + title: "设备供应商", + dataIndex: "device_vendor", + key: "device_vendor", align: "center", }, { - title: "业务订单类型", - dataIndex: "business_type", - key: "business_type", + title: "对接平台", + dataIndex: "platform", + key: "platform", align: "center", }, { - title: "更改项", - dataIndex: "change_content", - key: "change_content", + title: "车位锁状态", + dataIndex: "lock_state_name", + key: "lock_state_name", align: "center", - render: (text) => { - return text == 1 - ? "调整出场时间" - : text == 2 - ? "变更车牌号" - : text == 3 - ? "更改订单金额" - : text == 4 - ? "免费该订单" - : "作废该订单" - } }, { - title: "更改初始值", - dataIndex: "initial_value", - key: "initial_value", - align: "center", - }, - { - title: "更改更新值", - dataIndex: "update_value", - key: "update_value", + title: "设备状态", + dataIndex: "device_state_name", + key: "device_state_name", align: "center", }, { @@ -485,9 +128,7 @@ function LockMonitor() { return ( @@ -497,240 +138,14 @@ function LockMonitor() { ]; - const h_columns = [ - { - title: "停车订单ID", - dataIndex: "park_id", - key: "park_id", - width: 200, - align: "center", - render: (text) => ( - <> - { - navigator.clipboard.writeText(`${text}`).then(() => { - message.success("已复制到剪切板"); - }); - }} - > - {text} - - - ), - }, - { - title: "车牌号", - dataIndex: "plate", - key: "plate", - align: "center", - }, - { - title: "停车场名称", - dataIndex: "park_name", - key: "park_name", - align: "center", - width: 200, - }, - { - title: "入场时间", - dataIndex: "in_time", - key: "in_time", - align: "center", - }, - { - title: "计费时间", - dataIndex: "admission_time", - key: "admission_time", - align: "center", - }, - ]; - const [detailVisible, setDetailVisible] = useState(false); const [tableData, setTableData] = useState([]); const [total, setTotal] = useState(0); - const [tabKey, setTabKey] = useState("1"); - // 车场id - const [parkId, setParkId] = useState(""); - //支付记录数据 - const [payRecord, setPayRecord] = useState([]); - //退款订单数据 - const [refundRecord, setRefundRecord] = useState([]); - //操作记录数据 - const [operationRecord, setOperatorRecord] = useState([]); - //历史处理数据 - const [historyProgressRecord, setHistoryProgressRecord] = useState([]); - //停车记录信息数据 - const [parkingRecordDetail, setParkingRecordDetail] = useState({}); - //当前的所选择的停车信息索引 - const [recordIndex, setRecordIndex] = useState(-1); - //当前所选择的订单ID - const [currentRecordID, setCurrentRecordID] = useState(""); - //历史记录详情Modal - const [historyVisible, setHistoryVisible] = useState(false); - //历史记录详情的弹窗查看全部 - const [isShowAll, setIsShowAll] = useState(false); - //历史记录车辆图片弹窗 - const [platePhototModal, setPlatePhotoModal] = useState(false); - //历史记录详情数据 - const [historyDataDetail, setHistoryDataDetail] = useState({}); - const [DataDetail, setDataDetail] = useState({}); - function openModal(index, record) { - setDetailVisible(true); - setParkingRecordDetail(record); - setHistoryDataDetail(record) - setRecordIndex(index); - } - - const handleImgError = (e) => { - let evn = e || event - let img = evn.srcElement ? evn.srcElement : evn.target - img.src = errorImg - } - - function changeKey(key) { - setTabKey(key); - switch (key) { - case "2": - getPaymentRecord(currentRecordID); - break; - case "3": - getRefundRecord(currentRecordID); - break; - case "4": - getOperateRecord(currentRecordID); - break; - case "5": - getHistoryRecord(currentRecordID); - break; - default: - break; - } - } - function renderParkRecord(item) { - return ( - item && ( -
- - {item.road} - {item.berth_id} - {item.region} - {item.operator} - {item.road_type} - - - {item.plate} - {item.phone} - {item.in_time} - {item.out_time} - {item.admission_time} - {item.order_amount} - {item.parking_card_discount} - - {item.road_discount} - - - {item.receivable_amount} - - {item.coupon } - - {item.preferential_amount} - - - {item.actual_amount} - - - {item.refund_discount} - - - {item.actual_refund} - - - {item.refund_total} - - - {item.in_person} - - - {item.out_person} - - - - -
- -
- - -
- -
- - -
- -
- - -
- ) - ); - } - //查看历史详情 - const [getHistoryData,setGetHistoryData]=useState({}) - function checkHistoryDetail(record) { - setGetHistoryData(record); - setHistoryVisible(true); - } - function renderModalTable(columns, dataSource) { - return ( - - ); - } - //获取订单的支付记录 - function getPaymentRecord(park_id) { - ajax.getPaymentRecord({ park_record_id: park_id }).then((res) => { - if (res.status === 20000) { - setPayRecord(res.data.list); - } - }); - } - //获取退款订单的接口 - function getRefundRecord(park_id) { - ajax.getRefundRecord({ park_id }).then((res) => { - if (res.status === 20000) { - setRefundRecord(res.data.list); - } - }); - } - //获取操作处理的接口 - function getOperateRecord(park_id) { - ajax.getOperateRecord({ park_record_id: park_id }).then((res) => { - if (res.status === 20000) { - setOperatorRecord(res.data.list); - } - }); - } - //获取历史处理记录的接口 - function getHistoryRecord(park_id) { - ajax.getHistoryRecord({ park_record_id: park_id }).then((res) => { - if (res.status === 20000) { - // res.data.list.map(res=>{ - setHistoryProgressRecord(res.data.list); - // }) - } - }); - } - //获取函数 function search(params) { utils.tableScrollTop("parent-table-scroll") - ajax.getParkingList(params).then((res) => { + ajax.getPileMonitor(params).then((res) => { if (res.status === 20000) { setTableData(res.data.list); setTotal(res.data.total); @@ -739,10 +154,6 @@ function LockMonitor() { } }); } - useEffect(() => { - // setParkingRecordDetail(tableData[recordIndex]); - setCurrentRecordID(tableData[recordIndex]?.park_id || ""); - }, [recordIndex]); return ( <> @@ -750,377 +161,17 @@ function LockMonitor() { columns={columns} tableData={tableData} formSearch={formSearch} - pagename="停车记录查询" - mandatory={['plate','berth_id']} - mandatory_name={['车牌号或泊位号']} - pageName={'parkRecordTotal'} + pagename="电桩监控" + // mandatory={['plate','berth_id']} + // mandatory_name={['车牌号或泊位号']} + pageName={'pileMonitor'} initFormData={initFormData} total={total} search={search} - exportUrl="/api/bpm/record/get_record_export" + // exportUrl="/api/bpm/record/get_record_export" /> - { - setDetailVisible(false); - setTabKey("1"); - }} - destroyOnClose - > - - - {renderParkRecord(parkingRecordDetail)} - - - {renderModalTable(payRecordColumns, payRecord)} - - - {renderModalTable(refundRecordColumns, refundRecord)} - - - {renderModalTable(operatorRecordColumns, operationRecord)} - - - {renderModalTable(historyProgressColumns, historyProgressRecord)} - - - { - setHistoryVisible(false); - }} - className="hanleHistoyModal" - footer={null} - width={1000} - > -
- - - {historyDataDetail?.road} - - - {historyDataDetail.region} - - - {historyDataDetail.operator} - - - {historyDataDetail.berth_id} - - - {historyDataDetail.road_type} - - - - - {historyDataDetail.plate} - - - {historyDataDetail.admission_time} - - - {historyDataDetail.in_time} - - - {historyDataDetail.out_time} - - - {historyDataDetail.in_source} - - - {historyDataDetail.out_source} - - - { - setPlatePhotoModal(true); - }} - > - 查看 - - - - - - {historyDataDetail.order_amount} - - - {historyDataDetail.preferential_total} - - - {historyDataDetail.actual_amount} - - - {historyDataDetail.arrears_mount} - - - { - setIsShowAll(false); - }} - > - 返回 - - ) : ( - { - setIsShowAll(true); - }} - > - 查看全部 - - ) - } - > - - - - - {isShowAll ? ( - - -
-
流程记录 -
-
- - -
-
申诉处理审核: 已完成
-
-
{getHistoryData.examine_time}
-
来源:平台
-
操作人:{getHistoryData.dealer}
-
-
- - -
-
申诉处理提审
-
-
-
操作项
-
- {getHistoryData?.change_content == 1 - ? "调整出场时间" - : getHistoryData?.change_content == 2 - ? "变更车牌号" - : getHistoryData?.change_content == 3 - ? "更改订单金额" - : getHistoryData?.change_content == 4 - ? "免费该订单" - : "作废该订单"} -
-
{getHistoryData.deal_time}
-
-
-
初始值
-
{getHistoryData.initial_value || "--"}
-
来源:平台
-
-
-
变更值
-
{getHistoryData.update_value || "--"}
-
{getHistoryData.dealer}
-
-
-
- - -
- - - ) : ( - - - - -