Merge branch 'develop' of http://120.27.195.166:3000/chenglb/PMS_Frontend_v1.0.0 into develop

src/pages/OutRoadMgm/OutDeviceMgm/OutDevice/index.scss

@@ -64,7 +64,7 @@
       width: 100%;
       display: flex;
       align-items: center;
-      margin-bottom: 24px;
+      margin-bottom: 16px;
 
       .form-txt {
         color: var(--color-search-list-item-text);
@@ -170,7 +170,12 @@
     .cc-result-flow {
       width: 100%;
       height: calc(100% - 34px - 13px);
-
+      .ant-table-wrapper {
+        height: calc(100% - 45px);
+        .ant-table-body {
+          @include scrollBar(var(--color-user-list-bg), #3b97ff);
+        }
+      }
       .yisa-table {
         width: 100%;
         height: calc(100% - 32px - 15px);
@@ -202,24 +207,24 @@
 
 /*定义滚动条高宽及背景
  高宽分别对应横竖滚动条的尺寸*/
- ::-webkit-scrollbar {
-  width: 6px;
-  height: 16px;
-  background-color: #5c5c5c;
-}
-
-/*定义滚动条轨道
-  内阴影+圆角*/
-::-webkit-scrollbar-track {
-  -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
-  border-radius: 10px;
-  background-color: #9da2ab;
-}
-
-/*定义滑块
-  内阴影+圆角*/
-::-webkit-scrollbar-thumb {
-  border-radius: 10px;
-  -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, .3);
-  background-color: #3b97ff;
-}
+//  ::-webkit-scrollbar {
+//   width: 6px;
+//   height: 16px;
+//   background-color: #5c5c5c;
+// }
+
+// /*定义滚动条轨道
+//   内阴影+圆角*/
+// ::-webkit-scrollbar-track {
+//   -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
+//   border-radius: 10px;
+//   background-color: #9da2ab;
+// }
+
+// /*定义滑块
+//   内阴影+圆角*/
+// ::-webkit-scrollbar-thumb {
+//   border-radius: 10px;
+//   -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, .3);
+//   background-color: #3b97ff;
+// }

src/pages/OutRoadMgm/OutDeviceMgm/OutDevice/loadable.jsx

@@ -470,12 +470,13 @@ function OutDevice() {
             <Table
               // bordered
               // className="yisa-table"
+              className="yisa-table-scroll"
               rowKey={(row) => row.id}
               dataSource={resultData?.list || []}
               columns={columns}
               pagination={false}
               loading={tabLoading}
-              scroll={{ y: "620px" }}
+              scroll={{ y: "calc(100% - 50px)" }}
             />
             <Pagination {...paginationProps} className="pagination-common" />
           </ResultFlowResult>

src/pages/OutRoadMgm/OutDeviceMgm/OutMonitorMgm/index.scss

@@ -52,7 +52,7 @@ $color-primary : var(--color-primary);
       width: 100%;
       display: flex;
       align-items: center;
-      margin-bottom: 24px;
+      margin-bottom: 16px;
 
       label {
         color: var(--color-search-list-item-text);
@@ -151,7 +151,12 @@ $color-primary : var(--color-primary);
       .cc-result-flow {
         width: 100%;
         height: calc(100% - 34px - 13px);
-
+        .ant-table-wrapper {
+          height: calc(100% - 45px);
+          .ant-table-body {
+            @include scrollBar(var(--color-user-list-bg), #3b97ff);
+          }
+        }
         .yisa-table {
           width: 100%;
           height: calc(100% - 32px - 15px);

src/pages/OutRoadMgm/OutDeviceMgm/OutMonitorMgm/loadable.jsx

@@ -628,11 +628,13 @@ function OutMonitorMgm(props) {
               <Table
                 // bordered
                 // className="yisa-table"
+                className="yisa-table-scroll"
                 rowKey={(row) => row.id}
                 dataSource={resultData?.list || []}
                 columns={tableColumns}
                 pagination={false}
                 loading={tabLoading}
+                scroll={{ y: "calc(100% - 50px)" }}
               />
               <Pagination {...paginationProps} className="pagination-common" />
             </ResultFlowResult>

src/pages/OutRoadMgm/OutDeviceMgm/OutNvrMgm/index.scss

@@ -54,7 +54,7 @@ $color-primary : var(--color-primary);
       width: 100%;
       display: flex;
       align-items: center;
-      margin-bottom: 24px;
+      margin-bottom: 16px;
 
       label {
         color: var(--color-search-list-item-text);
@@ -153,7 +153,12 @@ $color-primary : var(--color-primary);
       .cc-result-flow {
         width: 100%;
         height: calc(100% - 34px - 13px);
-
+        .ant-table-wrapper {
+          height: calc(100% - 45px);
+          .ant-table-body {
+            @include scrollBar(var(--color-user-list-bg), #3b97ff);
+          }
+        }
         .yisa-table {
           width: 100%;
           height: calc(100% - 32px - 15px);

src/pages/OutRoadMgm/OutDeviceMgm/OutNvrMgm/loadable.jsx

@@ -632,12 +632,13 @@ function OutNvrMgm(props) {
               <Table
                 // bordered
                 // className="yisa-table"
+                className="yisa-table-scroll"
                 rowKey={(row) => row.id}
                 dataSource={resultData?.list || []}
                 columns={tableColumns}
                 pagination={false}
                 loading={tabLoading}
-                scroll={{ y: "620px" }}
+                scroll={{ y: "calc(100% - 50px)" }}
               />
               <Pagination {...paginationProps} className="pagination-common" />
             </ResultFlowResult>

src/pages/OutRoadMgm/OutPersonMgm/TollCollector/index.jsx

@@ -1,13 +1,11 @@
 
-import React, { useState, useRef, useEffect } from "react";
+import React, { useState, useEffect } from "react";
 import { message, Pagination, Table, Select, Input, Button, Popover, Modal, Radio, DatePicker, Transfer } from "antd";
-import { dictionary, utils } from "@/config/common";
+import { dictionary } from "@/config/common";
 import { useSessionStorageState } from "ahooks";
 import moment from "moment";
 import ajax from "@/services";
 import "./index.scss";
-import { use } from "echarts";
-import { set } from "js-cookie";
 
 function TollCollector() {
   // 默认数据

src/pages/OutRoadMgm/OutPersonMgm/TransitionReport/index.jsx

@@ -1,12 +1,10 @@
 
-import React, { useState, useRef, useEffect } from "react";
+import React, { useState, useEffect } from "react";
 import { message, Pagination, Table, Select, Input, DatePicker, Button, Popover, Modal } from "antd";
-import { dictionary, utils } from "@/config/common";
+import { dictionary } from "@/config/common";
 import moment from "moment";
 import { useSessionStorageState } from "ahooks";
 import ajax from "@/services";
-import { QuickMenu } from "@/components";
-import RecordReviewModal from "@/components/ParkingRecordModal/RecordReviewModal";
 import "./index.scss";
 
 function TransitionReport() {
@@ -21,23 +19,38 @@ function TransitionReport() {
     pn: 1,
     page_size: dictionary?.pageSizeOptions1[0]
   };
+
+  // 详情默认请求参数
+  const modalDefaultData = {
+    pn: 1,
+    page_size: dictionary?.pageSizeOptions1[0]
+  };
+
   const timeSel = [
     {value: "1", label: "按上班时间"},
     {value: "2", label: "按下班时间"},
   ];
 
   const [formData, setFormData] = useState(defaultData); // 表单数据
+  const [modalDetailData, setModalDetailData] = useState(modalDefaultData); // 模态框请求参数
   const [sessionData, setSessionData] = useSessionStorageState("transitionReport", { value: {} }); // session缓存
   const [operatorList, setOperatorList] = useState([{ value: "0", label: "全部" }]); // 商户名称查询数据
   const [loading, setLoading] = useState(false); // 检索按钮加载状态
-
+  const [detailOpen, setDetailOpen] = useState(false);  // 详情模态框
+  const [detailLoad, setDetailLoad] = useState(false); // 详情模态框表格加载
+  
   // 表格返回数据
   const [resultData, setResultData] = useState({
     total: 0,
     list: [],
   });
-
-  //列表
+  
+  // 详情模态框表格数据
+  const [detailData, setDetailData] = useState({
+    total: 0,
+    list: [],
+  });
+  // 列表
   const tableColumns = [
     {
       title: "序号",
@@ -109,7 +122,21 @@ function TransitionReport() {
             overlayClassName="start-exception-deal-operate"
             content={
               <div className="operateBtn operate-btn" style={{ cursor: "pointer" }} trigger="hover">
-                <div className="hover" onClick={() => console.log("详情")}>详情</div>
+                <div 
+                  className="hover" 
+                  onClick={() => {
+                    let _data = {
+                      ...formData,
+                      ...modalDefaultData,
+                      id: record?.id
+                    };
+                    setModalDetailData(_data);
+                    $getModalTableList(_data);
+                    setDetailOpen(true);
+                  }}
+                >
+                  详情
+                </div>
               </div>
             }
           >
@@ -120,6 +147,80 @@ function TransitionReport() {
     },
   ];
 
+  // 模态框列表
+  const modalTableColumns = [
+    {
+      title: "区域",
+      dataIndex: "region",
+      key: "region",
+      align: "center",
+      render: (text, record, index) => text || "--",
+    },
+    {
+      title: "车场名称",
+      dataIndex: "park_name",
+      key: "park_name",
+      align: "center",
+      render: (text, record, index) => text || "--",
+    },
+    {
+      title: "所属商户",
+      dataIndex: "operator",
+      key: "operator",
+      align: "center",
+      render: (text, record, index) => text || "--",
+    },
+    {
+      title: "车场类型",
+      dataIndex: "park_type",
+      key: "park_type",
+      align: "center",
+      render: (text, record, index) => text || "--",
+    },
+    {
+      title: "车牌号",
+      dataIndex: "plate_number",
+      key: "plate_number",
+      align: "center",
+      render: (text, record, index) => text || "--",
+    },
+    {
+      title: "入场时间",
+      dataIndex: "in_time",
+      key: "in_time",
+      align: "center",
+      render: (text, record, index) => text || "--",
+    },
+    {
+      title: "出场时间",
+      dataIndex: "out_time",
+      key: "out_time",
+      align: "center",
+      render: (text, record, index) => text || "--",
+    },
+    {
+      title: "停车时长",
+      dataIndex: "admission_time",
+      key: "admission_time",
+      align: "center",
+      render: (text, record, index) => text || "--",
+    },
+    {
+      title: "应收金额",
+      dataIndex: "receivable_amount",
+      key: "receivable_amount",
+      align: "center",
+      render: (text, record, index) => text || "--",
+    },
+    {
+      title: "实收金额",
+      dataIndex: "actual_amount",
+      key: "actual_amount",
+      align: "center",
+      render: (text, record, index) => text || "--",
+    },
+  ];
+
   // 获取商户名称
   const $getAllOperator = () => {
     ajax.ElectInvoice.getSelectOperator().then((res) => {
@@ -152,6 +253,25 @@ function TransitionReport() {
     $getTableList(temFormData);
   };
 
+  // 模态框表格分页
+  const $changePnModal = (pn, page_size) => {
+    let temFormData = {};
+    if (modalDetailData.page_size == page_size) {
+      temFormData = {
+        ...modalDetailData,
+        pn
+      };
+    } else {
+      temFormData = {
+        ...modalDetailData,
+        pn: 1,
+        page_size,
+      };
+    };
+    setModalDetailData(temFormData);
+    $getModalTableList(temFormData);
+  };
+
 
   // 获取表格数据
   const $getTableList = (value = {}) => {
@@ -174,6 +294,25 @@ function TransitionReport() {
     });
   };
 
+  // 获取模态框表格数据
+  const $getModalTableList = (value) => {
+    let _data = {
+      ...modalDetailData,
+      ...value
+    };
+    ajax.getModalTransitionReportData(_data).then((res) => {
+      setLoading(false);
+      if (res.status === 20000) {
+        setDetailData(res?.data || {});
+      } else {
+        message.error(res.message);
+      }
+    }).catch((error) => {
+      setLoading(false);
+      message.error(error.message);
+    });
+  };
+
   useEffect(() => {
     let _data = {};
     if (sessionData && Object.values(sessionData).length > 0) {
@@ -341,14 +480,37 @@ function TransitionReport() {
         </div>
       </div>
 
-      {/* <Modal
-        title="提示"
-        open={jobStatusEditOpen.open}
-        onOk={() => $jobStatusEdit(jobStatusEditOpen.data)}
-        onCancel={() => { setJobStatusEditOpen({ open: false, data: {} }) }}
+      <Modal
+        title="现金收入详情"
+        className="transition-report-modal"
+        open={detailOpen}
+        // onOk={() => $jobStatusEdit(detailModal.data)}
+        onCancel={() => { setDetailOpen(false); setModalDetailData(modalDefaultData) }}
+        footer={null}
       >
-        <p>此操作将改变在职状态, 是否继续?</p>
-      </Modal> */}
+        <div className="result-data-modal">
+            <Table
+              rowKey={(row) => row.id}
+              className="table yisa-table-scroll"
+              dataSource={detailData.list || []}
+              columns={modalTableColumns}
+              pagination={false}
+              loading={detailLoad}
+              scroll={{ y: "calc(100% - 50px)" }}
+            />
+            <Pagination
+              className="pagination-common"
+              showSizeChanger={true}
+              showQuickJumper={true}
+              showTotal={() => `共 ${detailData.total || 0} 条`}
+              total={detailData.total}
+              current={modalDetailData.pn}
+              pageSize={modalDetailData.page_size}
+              pageSizeOptions={dictionary?.pageSizeOptions1}
+              onChange={$changePnModal}
+            />
+          </div>
+      </Modal>
     </div>
   );
 }

src/pages/OutRoadMgm/OutPersonMgm/TransitionReport/index.scss

@@ -150,4 +150,21 @@ $color-primary: var(--color-primary);
       }
     }
   }
+}
+
+.transition-report-modal {
+  width: 1200px !important;
+  height: 80%;
+  .ant-modal-content {
+    height: 100%;
+    .ant-modal-body {
+      height: calc(100% - 54px);
+      .result-data-modal {
+        height: 100%;
+        .yisa-table-scroll {
+          height: calc(100% - 47px);
+        }
+      }
+    }
+  }
 }

src/pages/OutRoadMgm/OutRemoteDevice/index.jsx

@@ -0,0 +1,148 @@
+
+import React, { useState, useEffect } from "react";
+import { message, Pagination, Table, Select, Input, DatePicker, Button, Popover, Modal } from "antd";
+import { connect } from "react-redux";
+import loadable from "@loadable/component"
+import { LoadingImg } from "@/components"
+import { dictionary } from "@/config/common";
+import moment from "moment";
+import { useSessionStorageState } from "ahooks";
+import ajax from "@/services";
+import "./index.scss";
+
+function OutRemoteDevice(props) {
+  const uid = props?.user?.userInfo?.user_uid;
+  console.log(uid);
+  // 默认数据
+  const defaultData = {
+    pn: 1,
+    page_size: dictionary?.pageSizeOptions1[0]
+  };
+  const [formData, setFormData] = useState(defaultData); // 表单数据
+  const [loading, setLoading] = useState(false); // 检索按钮加载状态
+  
+  // 表格返回数据
+  const [resultData, setResultData] = useState({
+    total_records: 0,
+    list: [],
+  });
+
+  // 列表
+  const tableColumns = [
+    {
+      title: "序号",
+      width: 60,
+      align: "center",
+      fixed: 'left',
+      render: (text, record, index) => index + 1,
+    },
+    {
+      title: "版本",
+      dataIndex: "version_code",
+      key: "version_code",
+      align: "center",
+      render: (text, record, index) => text || "--",
+    },
+    {
+      title: "描述",
+      dataIndex: "note",
+      key: "note",
+      align: "center",
+      render: (text, record, index) => text || "--",
+    },
+  ];
+
+  // 分页
+  const $changePn = (pn, page_size) => {
+    let temFormData = {};
+    if (formData.page_size == page_size) {
+      temFormData = {
+        ...formData,
+        pn
+      };
+    } else {
+      temFormData = {
+        ...formData,
+        pn: 1,
+        page_size,
+      };
+    };
+    setFormData(temFormData);
+    $getTableList(temFormData);
+  };
+
+  // 获取表格数据
+  const $getTableList = (value = {}) => {
+    let _data = {
+      ...formData,
+      ...value
+    };
+    setLoading(true);
+    setResultData({ list: [], total_records: 0 });
+    ajax.getOutRemoteDeviceData(_data).then((res) => {
+      setLoading(false);
+      if (res.status === 20000) {
+        setResultData(res?.data || {});
+      } else {
+        setLoading(false);
+        message.error(res.message);
+      }
+    }).catch((error) => {
+      setLoading(false);
+      message.error(error.message);
+    });
+  };
+  useEffect(() => {
+    $getTableList();
+  }, []);
+
+  return (
+    <div className="remote-device-management">
+      <div className="paid-result">
+        <div className="result">
+          <div className="row-head">
+            <span className="number-wrapper">共查询到<span className="total-number"> {resultData.total_records || 0} </span>条结果</span>
+            <div >
+              <Button type="primary">
+                前场管理系统升级
+              </Button>
+            </div>
+          </div>
+          <div className="result-data">
+            <Table
+              rowKey={(row) => row.id}
+              className="table yisa-table-scroll"
+              dataSource={resultData?.list || []}
+              columns={tableColumns}
+              pagination={false}
+              loading={loading}
+              scroll={{ y: "calc(100% - 50px)" }}
+            />
+            <Pagination
+              className="pagination-common"
+              showSizeChanger={true}
+              showQuickJumper={true}
+              showTotal={() => `共 ${resultData.total_records || 0} 条`}
+              total={resultData.total_records}
+              current={formData.pn}
+              pageSize={formData.page_size}
+              pageSizeOptions={dictionary?.pageSizeOptions1}
+              onChange={$changePn}
+            />
+          </div>
+        </div>
+      </div>
+    </div>
+  );
+}
+
+export default  connect(function mapStateToProps(state) {
+  return {
+    user: state.user,
+  };
+})((props) => {
+
+  return(
+    <OutRemoteDevice {...props} fallback={<LoadingImg />} />
+  )
+})

src/pages/OutRoadMgm/OutRemoteDevice/index.scss

@@ -0,0 +1,43 @@
+@import "@/assets/css/mixin.scss";
+$color-container-bg: var(--color-container-bg);
+$color-user-list-bg: var(--color-user-list-bg);
+$color-text: var(--color-text);
+$color-primary: var(--color-primary);
+
+.remote-device-management {
+  padding-top: 10px;
+  width: 100%;
+  height: 100%;
+  .paid-result {
+    height: calc(100% - 40px);
+    margin: 20px;
+    padding: 20px;
+    background: var(--color-user-list-bg);
+    // border-top-left-radius: 20px;
+    box-shadow: 0px 3px 8px 0px rgba(0, 0, 0, 0.08);
+    .row-head {
+      height: 32px;
+      display: flex;
+      align-items: center;
+      justify-content: space-between;
+      margin-bottom: 13px;
+
+      .total-number {
+        margin: 0 2px;
+        color: var(--color-primary);
+      }
+
+      .colorBtn {
+        height: 36px;
+        border-radius: 4px;
+      }
+    }
+    .result {
+      height: 100%;
+      .result-data {
+        width: 100%;
+        height: calc(100% - 45px - 47px);
+      }
+    }
+  }
+}

src/pages/OutRoadMgm/index.jsx

@@ -4,6 +4,7 @@ import OutExceptionMgm from "./OutExceptionMgm"
 import OutDeviceMgm from "./OutDeviceMgm"
 import OutBusinessRecord from "./OutBusinessRecord"
 import OutPersonMgm from "./OutPersonMgm"
+import OutRemoteDevice from "./OutRemoteDevice"
 
 export default {
     ...OutSegmentMgm,
@@ -11,5 +12,6 @@ export default {
     ...OutExceptionMgm,
     ...OutDeviceMgm,
     ...OutBusinessRecord,
-    ...OutPersonMgm
+    ...OutPersonMgm,
+    OutRemoteDevice
 }

src/router/router.config.js

@@ -1179,6 +1179,13 @@ let routes = [
         component: pages.OutRoadOverview,
       },
       {
+        // -------------------------------远程运维管理
+        path: "/outRoad/outRemoteDevice",
+        text: "概览",
+        name: "outRemoteDevice",
+        component: pages.OutRemoteDevice,
+      },
+      {
         // --------------路段管理
         path: "/outRoad/chargeRulesMgm",
         text: "计费规则管理",

src/services/OutRoadMgm/OutPersonMgm.js

@@ -59,4 +59,24 @@ export default {
       data,
     });
   },
+
+  // 交接班报表--模态框列表数据
+  getModalTransitionReportData: (data) => {
+    return ajax({
+      url: "/api/orp/report/get_detail",
+      type: "post",
+      data,
+    });
+  },
+
+
+  // -- 远程运维管理 --
+  // 远程运维管理--查询列表数据
+  getOutRemoteDeviceData: (data) => {
+    return ajax({
+      url: "/api/bpm/remote/get_version_res",
+      type: "post",
+      data,
+    });
+  },
 };