feat: 新需求加问题单

src/assets/css/base.scss

@@ -758,3 +758,15 @@ color:var(--color-text) !important;
     margin-top: 0 !important;
   }
 }
+
+.yisa-custom-scrollbar{
+  &::-webkit-scrollbar{
+    width: 10px;
+    background-color: #3e4557;
+    cursor: pointer;
+  }
+  &::-webkit-scrollbar-thumb{
+    background-color: #9da2ab;
+    border-radius: 5px;
+  }
+}

src/config/ajax.js

@@ -7,6 +7,10 @@ import qs from 'qs'
 axios.defaults.baseURL = baseApi
 axios.defaults.timeout = 5 * 60 * 1000
 axios.defaults.headers.common['Authorization'] = getToken()
+window.queryRecord = {} // 临时方案, 对于查询比较慢的接口, 先统一在这里处理, todo, 后期每个接口再加loading, 
+const longtimeInterfaces = [ // 对于一些查询比较慢的接口, 先定义一个数组, 
+  "/api/orp/road/road_list"
+]
 // axios.defaults.headers.common['Authorization']  = `Bearer eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJleHAiOjE2OTk2MzAwNzUsInN1YiI6Inlpc2Ffand0IiwibmJmIjoxNjk5NjI2NDc1LCJhdWQiOiJ5aXNhX3VzZXIiLCJpYXQiOjE2OTk2MjY0NzUsImp0aSI6IjlhYzg3MzcxNGUyYWUyNjQyOWNlMTFjMDliZjZiMTFiIiwiaXNzIjoieWlzYV9pc3MiLCJzdGF0dXMiOjEsImRhdGEiOnsidXNlcl91aWQiOjE4MTkwOTEwNDA1MzQ2MTU5NjksImlkX2NhcmQiOm51bGwsInJvbGVfaWQiOjE3NjcyMTAwNDQ0NDE2MTQ0NzksIm5hbWUiOiLotoXnuqfnrqHnkIblkZgiLCJkZXBhcnRtZW50X25hbWUiOiLopb_mtbflsrjlhaznlKjkuovkuJrpm4blm6IiLCJ1c2VyX25hbWUiOiJ4dXF1biIsInRlbCI6IjE4OTc2MzMwMzIwIiwiYXV0aCI6IjE1MiwxNTMsMTU0LDE1NSwxNTYsMTU3LDE1OCwxNTksMTYwLDE2MSwxNjIsMTYzLDE2NCwxNjUsMTY2LDE2NywxNjgsMTY5LDE3MCwxNzEsMTcyLDE3MywxNzQsMTc1LDE3NiwxNzcsMTc4LDE3OSwxODAsMTgxLDE4MiwxODMsMTUyLDEyMSwxMzQsMTM1LDEzOSwxNDMsMTQ5LDEzNiwxMzcsMTM4LDE0MCwxNDEsMTQyLDE0NCwxNDUsMTUwLDE1MSwxMjAsMTIyLDEyMywxMjQsMTI1LDExMiwxMTMsMTE0LDExNSwxNDYsMTQ3LDE0OCw4OCw4OSw5MCw5MSwxMDMsMTE4LDEyNiwxMzAsOTcsMTE2LDExNyw5Miw5Myw5NCw5NSw5NiwxMDQsMTA1LDExOSwxMjcsMTI4LDEyOSwxMzEsMTMyLDEzMyw5OCw5OSwxMDAsMTAxLDEwMiwxMDYsMTA3LDEwOCwxMDksMTEwLDExMSwxLDIsMyw2LDcsOCw5LDEwLDQsMTMsMTQsMTUsMTYsMTcsMTgsMTksMjAsMTEsMTIsMjEsMjIsMjcsMjgsMzMsMzYsMzcsMzgsMzksNDAsNDEsNDIsNDMsNDQsNDUsNDYsNDksNTAsNTEsNTIsNTMsNSw1Nyw1OCw1NCw1NSw1Niw3MSw3Miw1OSw2MCw2MSw2Miw2OSw3MCw3Myw3NCw3NSw3Niw3Nyw2NSw2Niw2Nyw2OCw2Myw2NCwyMywyNCwyNSwyNiwzNCwzNSwyOSwzMCwzMSwzMiw0Nyw0OCw3OCw3OSw4MCw4MSw4Miw4Myw4NCw4NSw4Niw4NyIsInBpZCI6MCwiaWRfbmFtZSI6IuiuuOe-pCJ9fQ.mYH-k_uKUDxysOiytBSRzOj4hWjKSxkTBVEpy4FnLe8`
 /**
  * @description  请求全局拦截
@@ -37,6 +41,27 @@ function ajax(ajaxData = {}) {
   if (ajaxData.transFormData) {
     ajaxData.data = { ...ajaxData.data, transFormData: true }
   }
+  // 新增逻辑
+  if(ajaxData.data?.guard){
+    if( window.queryRecord[ajaxData.url]?.ing ){ 
+      message.destroy()
+      if(ajaxData.data.pn && ajaxData.data.pn != window.queryRecord[ajaxData.url].pn){ // 约定pn 作为分页器 页码的唯一变量名
+        message.error('建议不要快速切换')
+      }else{
+        message.error('请勿重复操作')
+        // 返回一个promise防止语法错误
+        return new Promise((resolve, reject)=>{
+          new Error(1)
+        })
+      }
+    }else{
+      if(ajaxData.data.pn){
+        window.queryRecord[ajaxData.url] = {ing: true, pn: ajaxData.data.pn}
+      }else{
+        window.queryRecord[ajaxData.url] = {ing: true}
+      }
+    }
+  }
   return new Promise((resolve, reject) => {
     if (!utils.isObject(ajaxData)) {
       return reject(new Error('ajax请求配置错误'))
@@ -44,7 +69,6 @@ function ajax(ajaxData = {}) {
     let method = ajaxData.type || 'GET'
     method = method.toLowerCase()
     let url = ajaxData.mock && isDevelopment ? `/mock` + ajaxData.url : ajaxData.url
-
     // let data = method === 'get' ? { params: ajaxData.data } : ajaxData.data
     let data =
       method === "get" || method === 'delete'
@@ -53,17 +77,23 @@ function ajax(ajaxData = {}) {
 
     axios[method](url, data)
       .then(res => {
+        if(res?.config?.data && JSON.parse(res.config.data)?.guard){
+          window.queryRecord[res.config.url].ing = false
+        }
         if (res.data.status === 30009 || res.data.status === 40006 || res.data.status === 40005 ) {
           removeToken()
           window.location.replace(sysConfig.logout_url)
           // window.location.replace("/#/login")
           message.error(res.data.message)
           reject(res)
-          } else {
+        } else {
           resolve(res.data)
         }
       })
       .catch(err => {
+        if(err?.config?.data && JSON.parse(err.config.data)?.guard){
+          window.queryRecord[err.config.url].ing = false
+        }
         let response = err.response
         if (response) {
           switch (response.status) {

src/pages/InRoadMgm/EquipmentOpe/faultReport/loadable.jsx

@@ -92,6 +92,7 @@ function faultReport(props) {
         {
             title: '序号',
             render: (text, record, index) => index + 1,
+            width: 80,
         },
         {
             title: '商户名称',
@@ -109,6 +110,11 @@ function faultReport(props) {
             key: 'park_name',
         },
         {
+            title: '泊位号',
+            dataIndex: 'berth_code',
+            key: 'berth_code',
+        },
+        {
             title: '设备类型',
             dataIndex: 'fault_type_name',
             key: 'fault_type_name',
@@ -119,9 +125,11 @@ function faultReport(props) {
             key: 'name',
         },
         {
-            title: '故障原因',
+            title: '备注',
             dataIndex: 'reason',
             key: 'reason',
+            width: 200,
+            ellipsis: true
         },
         {
             title: '上报时间',
@@ -286,7 +294,7 @@ function faultReport(props) {
                         ]}
                     />
                     <div className="btnBox">
-                        <Button type="primary" className="yisa-btn colorReset reset"  onClick={() => { getResetData() }}>
+                        <Button  className="yisa-btn colorReset reset"  onClick={() => { getResetData() }}>
                             重置
                         </Button>
                         <Button type="primary" className="yisa-btn colorBtn submit"  onClick={() => { getSearchData() }}>

src/pages/InRoadMgm/RecordInquiry/ArrearsEtcInquiries/index.jsx

@@ -0,0 +1,6 @@
+import React from "react"
+import loadable from "@loadable/component"
+import { LoadingImg } from "@/components"
+
+const ArrearsEtcInquiriesLoadable = loadable(() => import("./loadable"))
+export default (pros) => <ArrearsEtcInquiriesLoadable {...pros} fallback={<LoadingImg />} />

src/pages/InRoadMgm/RecordInquiry/ArrearsEtcInquiries/index.scss

@@ -0,0 +1,5 @@
+@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);

src/pages/InRoadMgm/RecordInquiry/ArrearsEtcInquiries/loadable.jsx

@@ -0,0 +1,181 @@
+import React, { useState, useRef, useEffect } from "react";
+import { message, Pagination, Table, Space, Modal, Button } 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 } from "@/components";
+// import "./index.scss";
+// import errorImg from "@/assets/images/layout/error.png"
+// import {  useLocation } from "react-router-dom";
+
+let array = [];
+
+function ArrearsEtcInquiries() {
+  const columns = [
+    {
+      title: "序号",
+      dataIndex: "index",
+      key: "index",
+      align: "center",
+      render: (_, record, index) => {
+        return index + 1;
+      },
+    },
+    {
+      title: "车牌号",
+      dataIndex: "licensePlateNumber",
+      align: "center",
+      render: (text, record, index) => (
+        <div style={{ width: "100px", wordBreak: "break-all" }}>{record.licensePlateNumber}</div>
+      )
+    },
+    {
+      title: "商户名称",
+      dataIndex: "merchantName",
+      align: "center",
+      render: (text, record, index) => (
+        <div style={{ width: "100px", wordBreak: "break-all" }}>{record.merchantName}</div>
+      )
+    },
+    {
+      title: "欠费路段",
+      dataIndex: "arrearsSection",
+      align: "center",
+      render: (text, record, index) => (
+        <div style={{ width: "100px", wordBreak: "break-all" }}>{record.arrearsSection}</div>
+      )
+    },
+    {
+      title: "入场时间",
+      dataIndex: "entryTime",
+      align: "center",
+      render: (text, record, index) => (
+        <div style={{ width: "130px", wordBreak: "break-all" }}>{record.entryTime}</div>
+      )
+    },
+    {
+      title: "出场时间",
+      dataIndex: "exitTime",
+      align: "center",
+      render: (text, record, index) => (
+        <div style={{ width: "130px", wordBreak: "break-all" }}>{record.exitTime}</div>
+      )
+    },
+    {
+      title: "停车时长",
+      dataIndex: "parkingDuration",
+      key: "parkingDuration",
+      align: "center",
+    },
+    {
+      title: "实收金额",
+      dataIndex: "actualPayment",
+      key: "actualPayment",
+      align: "center",
+    },
+    {
+      title: "支付渠道",
+      dataIndex: "paymentChannel",
+      key: "paymentChannel",
+      align: "center",
+    },
+    // {
+    //   title: "收费员",
+    //   dataIndex: "tollCollector",
+    //   key: "tollCollector",
+    //   align: "center",
+    // },
+    // {
+    //   title: "收费路段",
+    //   dataIndex: "tollSection",
+    //   key: "tollSection",
+    //   align: "center",
+    // },
+    {
+      title: "缴费时间",
+      dataIndex: "paymentTime",
+      key: "paymentTime",
+      align: "center",
+    },
+  ];
+  const formSearch = [
+    {
+      name: "operator",
+      type: "Select",
+      label: "商户名称",
+      placeholder: "请输入商户名称",
+    },
+    {
+      name: "road",
+      type: "Input",
+      label: "欠费路段",
+      placeholder: "请输入欠费路段",
+    },
+    // {
+    //   name: "out_person",
+    //   type: "Input",
+    //   label: "收费员",
+    //   placeholder: "请输入收费员",
+    // },
+    // {
+    //   name: "tollSection",
+    //   type: "Input",
+    //   label: "收费路段",
+    //   placeholder: "请输入收费路段",
+    // },
+    {
+      name: "plate",
+      type: "Input",
+      label: "车牌号",
+      placeholder: "请输入车牌号",
+    },
+    {
+      name: "paymentTimePeriod",
+      type: "RangePicker",
+      label: "缴费时间段",
+    },
+  ];
+  //搜索参数初始化
+  const initFormData = {
+    operator: "0",
+    road: "",
+    out_person: "",
+    tollSection: "",
+    plate: "",
+  };
+  //搜索的结果
+  const [tableData, setTableData] = useState([]);
+  //搜索的总结果数
+  const [total, setTotal] = useState(0);
+  //搜索方法
+  const fetch = (params) => {
+    utils.tableScrollTop("parent-table-scroll");
+    ajax.getArrearsListEtc(params).then((res) => {
+      if (res.status === 20000) {
+        setTableData(res.data.list);
+        setTotal(res.data.total);
+      }
+    });
+  };
+  return (
+    <TableModule
+      columns={columns}
+      tableData={tableData}
+      formSearch={formSearch}
+      total={total}
+      search={fetch}
+      initFormData={initFormData}
+      mandatory={['plate','berth_id']}
+      mandatory_name={['车牌号或泊位号']}
+      pagename="欠费追缴查询"
+      pageName={'arrearsInquiries'}
+      otherData={{
+        payment_time: 1,
+      }}
+      exportUrl="/api/bpm/record/get_arrears_export"
+    />
+  );
+}
+
+export default ArrearsEtcInquiries;

src/pages/InRoadMgm/RecordInquiry/index.jsx

@@ -1,4 +1,5 @@
 import ArrearsInquiries from "./ArrearsInquiries"
+import ArrearsEtcInquiries from "./ArrearsEtcInquiries"
 import ArrearsRecordTotal from "./ArrearsRecordTotal"
 import DisabledCarParkRecordTotal from "./DisabledCarParkRecordTotal"
 import EntryExitOptPDA from "./EntryExitOptPDA"
@@ -9,6 +10,7 @@ import PreOrderRecord from "./PreOrderRecord"
 import UnRecordOrder from "./UnRecordOrder"
 export default {
     ArrearsInquiries,
+    ArrearsEtcInquiries,
     ArrearsRecordTotal,
     DisabledCarParkRecordTotal,
     EntryExitOptPDA,

src/pages/Nav/index.jsx

@@ -67,30 +67,33 @@ export default function Nav() {
   return (
       <div className="cc-layout nav-layout">
         <Header />
-        <div className="nav-contanier">
-            {
-                navData.map((item,index)=>{
-                    return <div 
-                                key={index} 
-                                className={`item  ${activeIndex == index ? 'active' : ""}`} 
-                                onMouseOut={()=>{setActiveIndex(-1)}} 
-                                onMouseOver={()=>{setActiveIndex(index)}} 
-                                onClick={()=>{clickItem(item)}}
-                                >
-                                <div className="out-wrapper">
-                                    <div className="icon-wrapper">
-                                        <IconPda type={item.icon}></IconPda>
-                                    </div> 
-                                    <div className="line"></div>
-                                </div>
+        <div className="nav-content">
+            <div className="nav-contanier">
+                {
+                    navData.map((item,index)=>{
+                        return <div 
+                                    key={index} 
+                                    className={`item  ${activeIndex == index ? 'active' : ""}`} 
+                                    onMouseOut={()=>{setActiveIndex(-1)}} 
+                                    onMouseOver={()=>{setActiveIndex(index)}} 
+                                    onClick={()=>{clickItem(item)}}
+                                    >
+                                    <div className="out-wrapper">
+                                        <div className="icon-wrapper">
+                                            <IconPda type={item.icon}></IconPda>
+                                        </div> 
+                                        <div className="line"></div>
+                                    </div>
 
-                                <div className="zh-name">{item.text}</div>
-                                <div className="en-name">{item.en_name}</div>
+                                    <div className="zh-name">{item.text}</div>
+                                    <div className="en-name">{item.en_name}</div>
 
-                            </div>
-                })
-            }
+                                </div>
+                    })
+                }
+            </div>
         </div>
+        
       </div>
     
   )

src/pages/Nav/index.scss

@@ -1,38 +1,36 @@
-@function px2vh($h) {
-  @return $h * 100vh / 970
-}
 
-@function px2vw($w) {
-  @return $w * 100vw / 1920
-}
+
 .nav-layout{
     .cc-header{
         position: absolute;
     }
 }
-.nav-contanier{
+.nav-content{
     width: 100%;
     height: 100%;
     background-image: url('@/assets/images/nav/nav_bg.png');
     background-size: 100% 100%;
     background-position: center;
-    padding: 30px;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+}
+.nav-contanier{
+    width: 1600px;
+    height: 710px;
     display: flex;
     flex-direction: row;
     align-items: center;
+    flex-wrap: wrap;
     .item{
-        // display: flex;
-        // flex-direction: column;
-        // align-items: center;
-        // justify-content: center;
         margin: 10px;
         cursor: pointer;
         background: url("@/assets/images/nav/nav_item.png");
         background-size: 100% 100%;
         background-position: center;
-        width: 246px;
-        height: 680px;
-        padding-top: 130px;
+        width: 280px;
+        height: 330px;
+        padding-top: 30px;
         position: relative;
         
         &:hover{
@@ -46,7 +44,9 @@
                 font-size: 16px;
             }
             .line{
-                margin-top: 50px;
+                margin-top: 30px;
+                height: 2px;
+                border-bottom: 2px solid #3e536c !important;
             }
             &::after{
                 content: '';
@@ -56,7 +56,7 @@
                 height: 4px;
                 border-radius: 2px;
                 position: absolute;
-                bottom: -20px;
+                bottom: -10px;
             }
         }
         .out-wrapper{
@@ -83,12 +83,13 @@
             height: 2px;
             width: 120px;
             margin: auto ;
+            margin-top: 10px;
             // background-color: red;
             border-bottom: 2px solid #3E536C;
         }
         .zh-name{
             text-align: center;
-            margin-top: 60px;
+            // margin-top: 10px;
             font-size: 18px;
             font-weight: 700;
         }

src/pages/OutRoadMgm/OutSegmentMgm/ChargeRulesMgm/AddModal.jsx

@@ -192,12 +192,12 @@ function AddModal(props) {
   return (
     <Modal
       open={visible}
-      width={1200}
+      width={1250}
       onCancel={close}
       title={status === "add" ? "添加" : "编辑"}
       onOk={submit}
     >
-      <div>
+      <div className="yisa-custom-scrollbar" style={{height: '600px',overflowY: 'auto',overflowX: 'hidden'}}>
         <Form
           form={form}
           labelCol={{ span: 6 }}

src/pages/OutRoadMgm/OutSegmentMgm/ChargeRulesMgm/Detail.jsx

@@ -33,7 +33,7 @@ function Detail(props) {
       title="详情"
       footer={null}
     >
-      <div>
+      <div className="yisa-custom-scrollbar" style={{height: '600px', overflowY: 'auto', overflowX: 'hidden'}}>
         <Descriptions column={2}>
           <Descriptions.Item label="规则名称" span={1}>
             {record.feeName}

src/router/index.jsx

@@ -31,6 +31,7 @@ function RouterMap(props) {
 
   useEffect(() => {
     message.destroy()
+    window.queryRecord = {}
   },[location.pathname]);
 
 

src/router/router.config.js

@@ -208,6 +208,12 @@ let routes = [
         component: pages.ArrearsInquiries,
       },
       {
+        path: "/inRoad/ArrearsEtcInquiries",
+        text: "ETC追缴查询",
+        name: "ArrearsEtcInquiries",
+        component: pages.ArrearsEtcInquiries,
+      },
+      {
         path: "/inRoad/ArrearsRecordTotal",
         text: "停车欠费订单",
         name: "arrearsRecordTotal",

src/services/OperationCenter/OperationSales/index.js

@@ -22,7 +22,7 @@ const handleCouponInsert = (p) => {
   return ajax({
     url: "/api/ope/coupon/insert",
     type: 'post',
-    data: p
+    data: {...p, guard: true}
   })
 }
 

src/services/OutRoadMgm/OutSegment.js

@@ -7,6 +7,7 @@ const getOrpRoadList = (params) => {
     url: "/api/orp/road/road_list",
     type: "post",
     data: params,
+    guard:true
   });
 };
 //导出

src/services/recordInquiry.js

@@ -1,5 +1,5 @@
 import ajax from "../config/ajax";
-///api/bpm/record/get_arrears_list
+//欠费追缴记录查询
 const getArrearsList = (params) => {
   return ajax({
     url: "/api/bpm/record/get_arrears_list",
@@ -7,6 +7,14 @@ const getArrearsList = (params) => {
     data: params,
   });
 };
+// etc追缴查询
+const getArrearsListEtc = (params) => {
+  return ajax({
+    url: "/api/bpm/record/get_arrears_list_etc",
+    type: "post",
+    data: params,
+  });
+};
 ///api/bpm/record/get_parking_arrears_list
 const getParkingArrearsList = (params) => {
   return ajax({
@@ -36,7 +44,7 @@ const getParkingList = (params) => {
   return ajax({
     url: "/api/bpm/record/get_record_list",
     type: "post",
-    data: params,
+    data: {...params, guard: true}
   });
 };
 ///api/bpm/record/get_prepayment_list
@@ -89,12 +97,12 @@ const getHistoryRecord = (params) => {
   });
 };
 
-//  /api/bpm/record/get_record_list   停车记录查询-列表和停车记录信息
+//    停车记录查询-列表和停车记录信息
 const getRecordList = (params) => {
   return ajax({
     url: "/api/bpm/record/get_record_list",
     type: "post",
-    data: params,
+    data: {...params, guard: true} 
   });
 };
 
@@ -107,7 +115,7 @@ const getChangeTemporary = (params) => {
     data: params,
   });
 };
-//  /api/bpm/record/get_unregistered   未登记记录查询
+//   未登记记录查询
 
 const getUnregistered = (params) => {
   return ajax({