diff --git a/src/pages/NewEnergy/ChargingMgm/BillingRule/index.scss b/src/pages/NewEnergy/ChargingMgm/BillingRule/index.scss
index 9a8202a..23f35ce 100644
--- a/src/pages/NewEnergy/ChargingMgm/BillingRule/index.scss
+++ b/src/pages/NewEnergy/ChargingMgm/BillingRule/index.scss
@@ -171,68 +171,113 @@ $color-primary: var(--color-primary);
   border-color: var(--color-border);
 }
 
-// .yisa-table {
-//   width: 100%;
-
-//   .ant-table-thead {
-//     th {
-//       background: var(--color-table-header-bg) !important;
-//     }
-//   }
-
-//   .ant-table-tbody {
-//     td {
-//       background: var(--color-table-body-bg) !important;
-//       border-bottom-color: var(--color-table-border-bottom-color);
-//     }
-
-//     tr:nth-child(even) {
-//       td {
-//         background: var(--color-table-body-bg-nth-child-even) !important;
-//       }
-//     }
-
-//     tr:nth-child(odd) {
-//       td {
-//         background: var(--color-table-body-bg-nth-child-even) !important;
-//       }
-//     }
-//   }
-// }
-.totalModal{
-  .ant-modal-footer{
-    display: none;
+.totalModal {
+  .ruleTitle {
+    font-size: 16px;
+    font-weight: 700;
+    color: #ffffff;
   }
-  position: absolute;
-  top: 40px;
-  right: 174px;
-}
-.ltc-item-img {
-  width: 390px;
-  height: 300px;
-  border: 1px solid;
-  background: #6565656b;
-  margin-right: 20px !important;
-  img  {
-    height: 295px;
-    width: 387px;
-    // object-fit: contain;
+  .ant-modal-content{
+    width: 796px;
+  }
+  .modal-form{
+    margin: 20px 0 0 0;
+    .yisa-search{
+      margin-bottom: 20px;
+      label{
+        color: #eeeff1;
+      }
+      .ant-input-textarea-show-count:after{
+          position: absolute;
+          bottom: 19%;
+          right: 7%;
+      }
+      textarea{
+        position: relative;
+      }
+    }
+  }
+  
+ 
+  .ant-modal-footer{
+    display: flex;
+    justify-content: center;
+    .ant-btn{
+      width: 88px;
+      height: 35px;
+      color: #fff;
+      border: none;
+      border-radius: 4px;
+    }
+    .ant-btn:last-child{
+      background: #409eff;
+    }
   }
 }
-.hanleHistoyModal{
-  max-height: 700px;
-  overflow: auto;
-}
-.hanleHistoyModal::-webkit-scrollbar {
-  width: 5px;
-}
-.hanleHistoyModal::-webkit-scrollbar-thumb {
-  background-color: #9da2ab;
-  border-radius: 10px;
-}
-.modal-img{
-  img{
-    width: 200px;
-    height: 200px;
+.detail-Modal{
+  .ruleTitle {
+    font-size: 16px;
+    font-weight: 700;
+    color: #ffffff;
+  }
+  .ltc-content {
+    display: flex;
+    flex-wrap: wrap;
+    margin: auto;
+    padding: 20px;
+    color: #ffffff;
+    .ltc-item {
+      font-size: 14px;
+      margin: 6px 12px 6px 0;
+      display: inline-flex;
+      flex: 1;
+      //width: 470px;
+      .new-item {
+        display: inline-block;
+        width: 120px;
+        height: 32px;
+        line-height: 32px;
+        background: rgba(150, 161, 192, 0.24);
+        text-align: center;
+      }
+
+      .new-value {
+        display: inline-block;
+        width: 320px;
+        height: 32px;
+        line-height: 32px;
+        text-align: center;
+        background: #3E4557;
+        box-shadow: 0px 3px 8px 0px rgba(0, 0, 0, 0.12);
+      }
+
+      .ltc-item-input {
+        display: inline-block;
+        width: 200px;
+      }
+
+      div {
+        width: 150px;
+      }
+    }
+    .last-row{
+      width: 100%;
+      display: flex;
+      flex-direction: column;
+      .rule-description{
+        .new-item{
+          line-height: 96px;
+          height: 96px;
+        }
+        .new-value{
+          width: 780px;
+          line-height: 96px;
+          height: 96px;
+          word-wrap:break-word
+        }
+      }
+    }
+    
   }
+  
 }
\ No newline at end of file
diff --git a/src/pages/NewEnergy/ChargingMgm/BillingRule/loadable.jsx b/src/pages/NewEnergy/ChargingMgm/BillingRule/loadable.jsx
index 4ef6d7b..a9f38d7 100644
--- a/src/pages/NewEnergy/ChargingMgm/BillingRule/loadable.jsx
+++ b/src/pages/NewEnergy/ChargingMgm/BillingRule/loadable.jsx
@@ -18,55 +18,67 @@ import {
 import { dictionary } from "@/config/common";
 import ajax from "@/services";
 import { TableModule } from "@/components";
+import moment from 'moment'
 import "./index.scss";
 
 const { TextArea } = Input;
 
 function BillingRule() {
+    // 初始搜索条件
+  const initFormData = {
+      operator_id: "0",
+      rule_name: "",
+    };
+  const params ={
+    operator_id:'',
+    rule_name:'',
+    rule_code:'',
+    rule_description:'',
+    time:moment().format("YYYY-MM-DD HH:mm:ss"),
+    username:''
+  }
+  // 新增or详细弹框
+  const [modalData, setModalData] = useState(params)
   // 详情弹窗
   const [detailVisible, setDetailVisible] = useState(false);
   // 列表数据
   const [tableData, setTableData] = useState([]);
   // 数据总数
   const [total, setTotal] = useState(0);
-  // 详情数据
-  const [detailData, setDetailData] = useState({});
-  // 初始搜索条件
-  const initFormData = {
-    operator: "0",
-    rule_name: "",
-  };
-
+  const [operatorOption, setOperatorOption] = useState([])
+  const [ruleDetailVisible, setRuleDetailVisible] = useState(false)
+  const [detailsData, setDetailsData] = useState({})
+  const tableRef = useRef(null)
   const columns = [
     {
       title: "运营商名称",
-      dataIndex: "operator",
-      key: "operator",
+      dataIndex: "operator_name",
+      key: "operator_name",
       align: "center",
     },
     {
       title: "规则名称",
-      dataIndex: "plate",
-      key: "plate",
+      dataIndex: "rule_name",
+      key: "rule_name",
       align: "center",
     },
     {
       title: "规则编码",
-      dataIndex: "plate_color",
-      key: "plate_color",
+      dataIndex: "rule_code",
+      key: "rule_code",
       align: "center",
     },
     {
       title: "创建人",
-      dataIndex: "berth_id",
-      key: "berth_id",
+      dataIndex: "creator",
+      key: "creator",
       width: 100,
       align: "center",
     },
     {
       title: "创建时间",
-      dataIndex: "in_time",
-      key: "in_time",
+      dataIndex: "create_time",
+      key: "create_time",
       align: "center",
     },
     {
@@ -79,9 +91,9 @@ function BillingRule() {
       render: (text, record, index) => {
         return (
           <>
-            <Button type="primary" onClick={() => openModal(index, record)}>
+            <a type="primary" onClick={() => openModal(index, record)}>
               详情
-            </Button>
+            </a>
           </>
         )
 
@@ -91,11 +103,12 @@ function BillingRule() {
 
   const formSearch = [
     {
-      name: "operator",
+      name: "operator_id",
       type: "Select",
-      label: "商户名称",
+      label: "运营商名称",
       defaultValue: "0",
-      placeholder: "请选择商户名称",
+      placeholder: "请选择运营商名称",
+      options:operatorOption.length ? operatorOption : [{value:"0",label:'全部'}]
     },
     {
       name: "rule_name",
@@ -107,21 +120,38 @@ function BillingRule() {
       name: "timePeriod",
       type: "RangePicker",
       label: "时间段",
+      defaultValue: [moment().subtract(1,"months"), moment()]
     },
   ];
-
+    // 获取运营商名字
+    const getAllOperator =() => {
+      ajax.getOperatorList().then((res) => {
+        if (res.status === 20000) {
+          setOperatorOption(res.data);
+        }
+      });
+    }
   // 打开弹窗
   const openModal = (index, record) => {
-    setDetailData(record)
-    setDetailVisible(true);
+    setDetailsData(record)
+    setRuleDetailVisible(true);
   }
 
   // 检索
   const search = (params) => {
-    ajax.getParkingList(params).then((res) => {
+    console.log("params",params);
+    let data = {
+      ...params,
+      type:1
+    }
+    ajax.getRegularList(data).then((res) => {
       if (res.status === 20000) {
         setTableData(res.data.list);
         setTotal(res.data.total);
+        setModalData({
+          ...modalData,
+          username:res.data.username,
+        })
       } else {
         message.error(res.message)
       }
@@ -129,9 +159,43 @@ function BillingRule() {
   }
 
   const handelAdd = () => {
+    setModalData({
+      ...params,
+      username:modalData?.username
+    })
     setDetailVisible(true)
   }
 
+// 处理弹框ok按钮
+  const handleConfirm = () => {
+    if(!modalData?.operator_id){
+      message.warning("运营商名称不能为空")
+      return
+    }else if(!modalData?.rule_name){
+      message.warning("规则名称不能为空")
+      return
+    }else if(!modalData?.rule_code){
+      message.warning("规则编码不能为空")
+      return
+    }
+    // 发保存请求
+    ajax.addRule({...modalData,type:1}).then(res => {
+      if (res.status === 20000) {
+        message.success(res.message)
+        tableRef.current.fetch()
+        setModalData({
+          ...params,
+          username:modalData?.username
+        })
+        setDetailVisible(false)
+      }
+    }).catch(err => {
+      console.log(err);
+    })
+  }
+  useEffect(() => {
+    getAllOperator()
+  },[])
   return (
     <>
       <TableModule
@@ -146,10 +210,10 @@ function BillingRule() {
           </Button>
         }
         columns={columns}
+        ref={tableRef}
         tableData={tableData}
         formSearch={formSearch}
         pagename="停车记录查询"
-        pageName={'billingRule'}
         initFormData={initFormData}
         total={total}
         search={search}
@@ -157,14 +221,145 @@ function BillingRule() {
       />
       <Modal
         open={detailVisible}
-        width={1500}
+        width={650}
         className="totalModal"
         onCancel={() => {
+          setModalData({...params,username:modalData?.username})
+          setDetailVisible(false);
+        }}
+        onOk={() => {
+          handleConfirm()
           setDetailVisible(false);
         }}
+        okText="保存"
         destroyOnClose
       >
-
+        <div className="ruleTitle">
+          <span className="font">新增规则</span>
+        </div>
+        <div className="modal-form">
+          <div className="yisa-search">
+              <em style={{marginRight:'5px',marginLeft:'-13px',color:'red'}}>*</em>
+              <label>运营商名称</label>
+              <Select
+                  value={modalData.operator_id}
+                  style={{ width: 660, marginLeft: 10 }}
+                  options={operatorOption}
+                  onChange={(v) => {setModalData({...modalData,operator_id:v})}}
+              />
+          </div>
+          <div className="yisa-search" style={{marginLeft:13}}>
+              <em style={{marginRight:'5px',marginLeft:'-13px',color:'red'}}>*</em>
+              <label>规则名称</label>
+              <Input
+                  placeholder="请输入名称"
+                  value={modalData.rule_name}
+                  style={{ width: 660, marginLeft: 10 }}
+                  maxLength={30}
+                  onChange={(v) => {setModalData({...modalData,rule_name:v.target.value})}}
+              />
+          </div>
+          <div className="yisa-search" style={{marginLeft:13}}>
+              <em style={{marginRight:'5px',marginLeft:'-13px',color:'red'}}>*</em>
+              <label>规则编码</label>
+              <Input
+                  placeholder="请输入编码"
+                  value={modalData.rule_code}
+                  style={{ width: 660, marginLeft: 10 }}
+                  maxLength={30}
+                  onChange={(v) => {setModalData({...modalData,rule_code:v.target.value})}}
+              />
+          </div>
+          <div className="yisa-search" style={{marginLeft:26}}>
+              <em style={{marginRight:'5px',marginLeft:'-13px',color:'red'}}>*</em>
+              <label>创建人</label>
+              <Input
+                  placeholder="请输入创建人"
+                  value={modalData.username}
+                  style={{ width: 660, marginLeft: 10 }}
+                  maxLength={30}
+                  disabled
+                  // onChange={(v) => {setModalData({...modalData,creator:v.target.value})}}
+              />
+          </div>
+          <div className="yisa-search" style={{marginLeft:12}}>
+              <em style={{marginRight:'5px',marginLeft:'-13px',color:'red'}}>*</em>
+              <label>创建时间</label>
+              <Input
+                  placeholder="请输入创建时间"
+                  value={modalData.time}
+                  style={{ width: 660, marginLeft: 10 }}
+                  maxLength={30}
+                  disabled
+                  // onChange={(v) => {setModalData({...modalData,creat_time:v.target.value})}}
+              />
+          </div>
+          <div className="yisa-search" style={{display:"flex",marginLeft:13}}>
+              <label>规则描述</label>
+              <TextArea
+                showCount
+                placeholder="请输入规则描述"
+                value={modalData.rule_description}
+                style={{ width: 660,height:80, marginLeft: 7 }}
+                onChange={(v)=> setModalData({...modalData,rule_description:v.target.value})}
+                maxLength={200}
+                />
+          </div>
+        </div>
+      </Modal>
+      <Modal
+         open={ruleDetailVisible}
+         width={1000}
+         className="detail-Modal"
+         footer={null}
+         destroyOnClose
+         onCancel={() => {
+          setRuleDetailVisible(false);
+        }}
+      >
+         <div className="ruleTitle">
+          <span className="font">新增规则</span>
+        </div>
+        <div className="ltc-content">
+            <div className="ltc-item">
+              <div className="new-item">运营商名称</div>
+              <div className="new-value">
+                {detailsData?.operator_name || "--"}
+              </div>
+            </div>
+            <div className="ltc-item">
+              <div className="new-item">规则名称</div>
+              <div className="new-value">
+                {detailsData?.rule_name || "--"}
+              </div>
+            </div>
+            <div className="ltc-item">
+              <div className="new-item">规则编码</div>
+              <div className="new-value">
+                {detailsData?.rule_code || "--"}
+              </div>
+            </div>
+            <div className="ltc-item">
+              <div className="new-item">创建人</div>
+              <div className="new-value">
+                {detailsData?.creator || "--"}
+              </div>
+            </div>
+            <div className="last-row">
+            <div className="ltc-item">
+              <div className="new-item">创建时间</div>
+              <div className="new-value">
+                {detailsData?.create_time || "--"}
+              </div>
+            </div>
+            <div className="ltc-item rule-description" >
+              <div className="new-item">规则描述</div>
+              <div className="new-value">
+                {detailsData?.rule_description || "--"}
+              </div>
+            </div>
+            </div>
+          </div>
       </Modal>
     </>
   );
diff --git a/src/pages/NewEnergy/ChargingMgm/OrderRuleMgm/index.scss b/src/pages/NewEnergy/ChargingMgm/OrderRuleMgm/index.scss
index 9a8202a..9a67b18 100644
--- a/src/pages/NewEnergy/ChargingMgm/OrderRuleMgm/index.scss
+++ b/src/pages/NewEnergy/ChargingMgm/OrderRuleMgm/index.scss
@@ -171,68 +171,110 @@ $color-primary: var(--color-primary);
   border-color: var(--color-border);
 }
 
-// .yisa-table {
-//   width: 100%;
-
-//   .ant-table-thead {
-//     th {
-//       background: var(--color-table-header-bg) !important;
-//     }
-//   }
-
-//   .ant-table-tbody {
-//     td {
-//       background: var(--color-table-body-bg) !important;
-//       border-bottom-color: var(--color-table-border-bottom-color);
-//     }
-
-//     tr:nth-child(even) {
-//       td {
-//         background: var(--color-table-body-bg-nth-child-even) !important;
-//       }
-//     }
-
-//     tr:nth-child(odd) {
-//       td {
-//         background: var(--color-table-body-bg-nth-child-even) !important;
-//       }
-//     }
-//   }
-// }
-.totalModal{
-  .ant-modal-footer{
-    display: none;
+
+.totalModal {
+  .ruleTitle {
+    font-size: 16px;
+    font-weight: 700;
+    color: #ffffff;
   }
-  position: absolute;
-  top: 40px;
-  right: 174px;
-}
-.ltc-item-img {
-  width: 390px;
-  height: 300px;
-  border: 1px solid;
-  background: #6565656b;
-  margin-right: 20px !important;
-  img  {
-    height: 295px;
-    width: 387px;
-    // object-fit: contain;
+  .ant-modal-content{
+    width: 796px;
+  }
+  .modal-form{
+    margin: 20px 0 0 0;
+    .yisa-search{
+      margin-bottom: 20px;
+      label{
+        color: #eeeff1;
+      }
+      .ant-input-textarea-show-count:after{
+          position: absolute;
+          bottom: 19%;
+          right: 7%;
+      }
+      textarea{
+        position: relative;
+      }
+    }
+  }
+  
+ 
+  .ant-modal-footer{
+    display: flex;
+    justify-content: center;
+    .ant-btn{
+      width: 88px;
+      height: 35px;
+      color: #fff;
+      border: none;
+      border-radius: 4px;
+    }
+    .ant-btn:last-child{
+      background: #409eff;
+    }
   }
 }
-.hanleHistoyModal{
-  max-height: 700px;
-  overflow: auto;
-}
-.hanleHistoyModal::-webkit-scrollbar {
-  width: 5px;
-}
-.hanleHistoyModal::-webkit-scrollbar-thumb {
-  background-color: #9da2ab;
-  border-radius: 10px;
-}
-.modal-img{
-  img{
-    width: 200px;
-    height: 200px;
+.detail-Modal{
+  .ruleTitle {
+    font-size: 16px;
+    font-weight: 700;
+    color: #ffffff;
+  }
+  .ltc-content {
+    display: flex;
+    flex-wrap: wrap;
+    margin: auto;
+    padding: 20px;
+    color: #ffffff;
+    .ltc-item {
+      font-size: 14px;
+      margin: 6px 12px 6px 0;
+      display: inline-flex;
+      flex: 1;
+      //width: 470px;
+      .new-item {
+        display: inline-block;
+        width: 120px;
+        height: 32px;
+        line-height: 32px;
+        background: rgba(150, 161, 192, 0.24);
+        text-align: center;
+      }
+
+      .new-value {
+        display: inline-block;
+        width: 320px;
+        height: 32px;
+        line-height: 32px;
+        text-align: center;
+        background: #3E4557;
+        box-shadow: 0px 3px 8px 0px rgba(0, 0, 0, 0.12);
+      }
+
+      .ltc-item-input {
+        display: inline-block;
+        width: 200px;
+      }
+
+      div {
+        width: 150px;
+      }
+    }
+      .rule-description{
+        .new-item{
+          line-height: 96px;
+          height: 96px;
+        }
+        .new-value{
+          width: 780px;
+          line-height: 96px;
+          height: 96px;
+          word-wrap:break-word
+        }
+      }
+    
+    
   }
+  
 }
\ No newline at end of file
diff --git a/src/pages/NewEnergy/ChargingMgm/OrderRuleMgm/loadable.jsx b/src/pages/NewEnergy/ChargingMgm/OrderRuleMgm/loadable.jsx
index cf801d2..bb53a4a 100644
--- a/src/pages/NewEnergy/ChargingMgm/OrderRuleMgm/loadable.jsx
+++ b/src/pages/NewEnergy/ChargingMgm/OrderRuleMgm/loadable.jsx
@@ -13,161 +13,428 @@ import {
   Select,
   Image,
   Timeline,
-  Popover
+  Popover,
+  Popconfirm
 } from "antd";
 import { dictionary } from "@/config/common";
 import ajax from "@/services";
 import { TableModule } from "@/components";
+import moment from 'moment'
 import "./index.scss";
 
 const { TextArea } = Input;
-
 function OrderRuleMgm() {
-  // 详情弹窗
-  const [detailVisible, setDetailVisible] = useState(false);
-  // 列表数据
-  const [tableData, setTableData] = useState([]);
-  // 数据总数
-  const [total, setTotal] = useState(0);
-  // 详情数据
-  const [detailData, setDetailData] = useState({});
   // 初始搜索条件
-  const initFormData = {
-    operator: "0",
+const initFormData = {
+    operator_id: "0",
     rule_name: "",
   };
+const params ={
+  operator_id:'',
+  rule_name:'',
+  rule_code:'',
+  rule_description:'',
+  time:moment().format("YYYY-MM-DD HH:mm:ss"),
+  username:'',
+  status:1,
+}
+// 新增or详细弹框
+const [modalData, setModalData] = useState(params)
+// 详情弹窗
+const [detailVisible, setDetailVisible] = useState(false);
+// 列表数据
+const [tableData, setTableData] = useState([]);
+// 数据总数
+const [total, setTotal] = useState(0);
+const [operatorOption, setOperatorOption] = useState([])
+const [ruleDetailVisible, setRuleDetailVisible] = useState(false)
+const [detailsData, setDetailsData] = useState({})
+const tableRef = useRef(null)
+const columns = [
+  {
+    title: "运营商名称",
+    dataIndex: "operator_name",
+    key: "operator_name",
+    align: "center",
+  },
+  {
+    title: "规则名称",
+    dataIndex: "rule_name",
+    key: "rule_name",
+    align: "center",
+  },
+  {
+    title: "规则编码",
+    dataIndex: "rule_code",
+    key: "rule_code",
+    align: "center",
+  },
+  {
+    title: "创建人",
+    dataIndex: "creator",
+    key: "creator",
+    width: 100,
+    align: "center",
+  },
+  {
+    title: "规则状态",
+    dataIndex: "status",
+    key: "status",
+    width: 100,
+    align: "center",
+    render:(_,record) => {
+      return(
+        <span style={
+          {
+            color:record ?.status ? "#2ADC41" : "#EC5761"}
+          }
+            >
+          {record?.status ? "正常" : "停用"}</span>
+      )
+    }
+  },
+  {
+    title: "创建时间",
+    dataIndex: "create_time",
+    key: "create_time",
+    align: "center",
+  },
+  {
+    title: "操作",
+    dataIndex: "operation",
+    key: "operation",
+    align: "center",
+    fixed: "right",
+    width: 100,
+    render: (text, record, index) => {
+      return (
+        <div style={{display:"flex",cursor:"pointer"}}>
+          <div style={{color:"#3AA9FF"}} onClick={() => openModal(index, record)}>
+            详情
+          </div>
+          <div 
+            style={{marginLeft:10,color:record ?.status ? "#EC5761" : "#2ADC41"}} 
+          >
+             <Popconfirm 
+                placement="left" 
+                title={record?.status ? "是否停用该规则" : "是否启动该规则"} 
+                onConfirm={() => { handleRuleStatus(record?.id,record?.status ? 0 : 1) }}
+                okText="是" 
+                cancelText="否">
+                  {record?.status ? "停用" : "启动"}
+              </Popconfirm>
+            
+          </div>
+        </div>
+      )
 
-  const columns = [
-    {
-      title: "运营商名称",
-      dataIndex: "operator",
-      key: "operator",
-      align: "center",
-    },
-    {
-      title: "规则名称",
-      dataIndex: "plate",
-      key: "plate",
-      align: "center",
-    },
-    {
-      title: "规则编码",
-      dataIndex: "plate_color",
-      key: "plate_color",
-      align: "center",
-    },
-    {
-      title: "创建人",
-      dataIndex: "berth_id",
-      key: "berth_id",
-      width: 100,
-      align: "center",
-    },
-    {
-      title: "创建时间",
-      dataIndex: "in_time",
-      key: "in_time",
-      align: "center",
-    },
-    {
-      title: "操作",
-      dataIndex: "operation",
-      key: "operation",
-      align: "center",
-      fixed: "right",
-      width: 100,
-      render: (text, record, index) => {
-        return (
-          <>
-            <Button type="primary" onClick={() => openModal(index, record)}>
-              详情
-            </Button>
-          </>
-        )
-
-      },
     },
-  ];
+  },
+];
 
-  const formSearch = [
-    {
-      name: "operator",
-      type: "Select",
-      label: "商户名称",
-      defaultValue: "0",
-      placeholder: "请选择商户名称",
-    },
-    {
-      name: "rule_name",
-      type: "Input",
-      label: "规则名称",
-      placeholder: "请输入出场收费员",
-    },
-    {
-      name: "timePeriod",
-      type: "RangePicker",
-      label: "时间段",
-    },
-  ];
-
-  // 打开弹窗
-  const openModal = (index, record) => {
-    setDetailData(record)
-    setDetailVisible(true);
-  }
+const formSearch = [
+  {
+    name: "operator_id",
+    type: "Select",
+    label: "运营商名称",
+    defaultValue: "0",
+    placeholder: "请选择运营商名称",
+    options:operatorOption.length ? operatorOption : [{value:"0",label:'全部'}]
+  },
+  {
+    name: "rule_name",
+    type: "Input",
+    label: "规则名称",
+    placeholder: "请输入出场收费员",
+  },
+  {
+    name: "timePeriod",
+    type: "RangePicker",
+    label: "时间段",
+    defaultValue: [moment().subtract(1,"months"), moment()]
+  },
+];
+  // 更新规则状态
+  const handleRuleStatus = (id,status) => {
+    ajax.updataRule({id,status}).then((res) => {
+      if (res.status == 20000) {
+        message.success(res.message)
+        tableRef.current.fetch()
+      }else{
+        message.success(res.message)
+      }
+    }).catch(e => {
+      console.log(e);
+    });
+  } 
 
-  // 检索
-  const search = (params) => {
-    ajax.getParkingList(params).then((res) => {
+  // 获取运营商名字
+  const getAllOperator =() => {
+    ajax.getOperatorList().then((res) => {
       if (res.status === 20000) {
-        setTableData(res.data.list);
-        setTotal(res.data.total);
-      } else {
-        message.error(res.message)
+        setOperatorOption(res.data);
+      }else{
+        setOperatorOption([])
       }
+    }).catch(e => {
+      console.log(e);
     });
   }
+// 打开弹窗
+const openModal = (index, record) => {
+  setDetailsData(record)
+  setRuleDetailVisible(true);
+}
 
-  const handelAdd = () => {
-    setDetailVisible(true)
+// 检索
+const search = (params) => {
+  let data = {
+    ...params,
+    type:2
   }
+  ajax.getRegularList(data).then((res) => {
+    if (res.status === 20000) {
+      setTableData(res.data.list);
+      setTotal(res.data.total);
+      setModalData({
+        ...modalData,
+        username:res.data.username,
+      })
+    } else {
+      message.error(res.message)
+    }
+  });
+}
 
-  return (
-    <>
-      <TableModule
-        showSerial={true}
-        isExport={false}
-        diyButton={
-          <Button
-            type="primary"
-            onClick={handelAdd}
-          >
-            新增
-          </Button>
-        }
-        columns={columns}
-        tableData={tableData}
-        formSearch={formSearch}
-        pagename="停车记录查询"
-        pageName={'orderRuleMgm'}
-        initFormData={initFormData}
-        total={total}
-        search={search}
-        exportUrl="/api/bpm/record/get_record_export"
-      />
-      <Modal
-        open={detailVisible}
-        width={1500}
-        className="totalModal"
-        onCancel={() => {
-          setDetailVisible(false);
-        }}
-        destroyOnClose
-      >
+const handelAdd = () => {
+  setModalData({
+    ...params,
+    username:modalData?.username
+  })
+  setDetailVisible(true)
+}
 
-      </Modal>
-    </>
-  );
+// 处理弹框ok按钮
+const handleConfirm = () => {
+  if(!modalData?.operator_id){
+    message.warning("运营商名称不能为空")
+    return
+  }else if(!modalData?.rule_name){
+    message.warning("规则名称不能为空")
+    return
+  }else if(!modalData?.rule_code){
+    message.warning("规则编码不能为空")
+    return
+  }
+  // 发保存请求
+  ajax.addRule({...modalData,type:2}).then(res => {
+    if (res.status === 20000) {
+      message.success(res.message)
+      tableRef.current.fetch()
+      setModalData({
+        ...params,
+        username:modalData?.username
+      })
+      setDetailVisible(false)
+    }
+  }).catch(err => {
+    console.log(err);
+  })
+}
+useEffect(() => {
+  getAllOperator()
+},[])
+return (
+  <>
+    <TableModule
+      showSerial={true}
+      isExport={false}
+      diyButton={
+        <Button
+          type="primary"
+          onClick={handelAdd}
+        >
+          新增
+        </Button>
+      }
+      columns={columns}
+      ref={tableRef}
+      tableData={tableData}
+      formSearch={formSearch}
+      pagename="停车记录查询"
+      initFormData={initFormData}
+      total={total}
+      search={search}
+      exportUrl="/api/bpm/record/get_record_export"
+    />
+    <Modal
+      open={detailVisible}
+      width={650}
+      className="totalModal"
+      onCancel={() => {
+        setModalData({...params,username:modalData?.username})
+        setDetailVisible(false);
+      }}
+      onOk={() => {
+        handleConfirm()
+        setDetailVisible(false);
+      }}
+      okText="保存"
+      destroyOnClose
+    >
+      <div className="ruleTitle">
+        <span className="font">新增规则</span>
+      </div>
+      <div className="modal-form">
+        <div className="yisa-search">
+            <em style={{marginRight:'5px',marginLeft:'-13px',color:'red'}}>*</em>
+            <label>运营商名称</label>
+            <Select
+                value={modalData.operator_id}
+                style={{ width: 660, marginLeft: 10 }}
+                options={operatorOption}
+                onChange={(v) => {setModalData({...modalData,operator_id:v})}}
+            />
+        </div>
+        <div className="yisa-search" style={{marginLeft:13}}>
+            <em style={{marginRight:'5px',marginLeft:'-13px',color:'red'}}>*</em>
+            <label>规则名称</label>
+            <Input
+                placeholder="请输入名称"
+                value={modalData.rule_name}
+                style={{ width: 660, marginLeft: 10 }}
+                maxLength={30}
+                onChange={(v) => {setModalData({...modalData,rule_name:v.target.value})}}
+            />
+        </div>
+        <div className="yisa-search" style={{marginLeft:13}}>
+            <em style={{marginRight:'5px',marginLeft:'-13px',color:'red'}}>*</em>
+            <label>规则编码</label>
+            <Input
+                placeholder="请输入编码"
+                value={modalData.rule_code}
+                style={{ width: 660, marginLeft: 10 }}
+                maxLength={30}
+                onChange={(v) => {setModalData({...modalData,rule_code:v.target.value})}}
+            />
+        </div>
+        <div className="yisa-search" style={{marginLeft:26}}>
+            <em style={{marginRight:'5px',marginLeft:'-13px',color:'red'}}>*</em>
+            <label>创建人</label>
+            <Input
+                placeholder="请输入创建人"
+                value={modalData.username}
+                style={{ width: 660, marginLeft: 10 }}
+                maxLength={30}
+                disabled
+                // onChange={(v) => {setModalData({...modalData,creator:v.target.value})}}
+            />
+        </div>
+        <div className="yisa-search" style={{marginLeft:12}}>
+            <em style={{marginRight:'5px',marginLeft:'-13px',color:'red'}}>*</em>
+            <label>创建时间</label>
+            <Input
+                placeholder="请输入创建时间"
+                value={modalData.time}
+                style={{ width: 660, marginLeft: 10 }}
+                maxLength={30}
+                disabled
+                // onChange={(v) => {setModalData({...modalData,creat_time:v.target.value})}}
+            />
+        </div>
+        <div className="yisa-search" style={{marginLeft:12}}>
+            <em style={{marginRight:'5px',marginLeft:'-13px',color:'red'}}>*</em>
+            <label>规则状态</label>
+            <Select
+                value={modalData.status}
+                style={{ width: 660, marginLeft: 10 }}
+                options={[
+                  {
+                    value:1,
+                    label:'正常'
+                  },
+                  {
+                    value:0,
+                    label:'停用'
+                  }
+              ]}
+                // onChange={(v) => {setModalData({...modalData,creat_time:v.target.value})}}
+            />
+        </div>
+        <div className="yisa-search" style={{display:"flex",marginLeft:13}}>
+            <label>规则描述</label>
+            <TextArea
+              showCount
+              placeholder="请输入规则描述"
+              value={modalData.rule_description}
+              style={{ width: 660,height:80, marginLeft: 7 }}
+              onChange={(v)=> setModalData({...modalData,rule_description:v.target.value})}
+              maxLength={200}
+              />
+        </div>
+      </div>
+    </Modal>
+    <Modal
+       open={ruleDetailVisible}
+       width={1000}
+       className="detail-Modal"
+       footer={null}
+       destroyOnClose
+       onCancel={() => {
+        setRuleDetailVisible(false);
+      }}
+    >
+       <div className="ruleTitle">
+        <span className="font">新增规则</span>
+      </div>
+      <div className="ltc-content">
+          <div className="ltc-item">
+            <div className="new-item">运营商名称</div>
+            <div className="new-value">
+              {detailsData?.operator_name || "--"}
+            </div>
+          </div>
+          <div className="ltc-item">
+            <div className="new-item">规则名称</div>
+            <div className="new-value">
+              {detailsData?.rule_name || "--"}
+            </div>
+          </div>
+          <div className="ltc-item">
+            <div className="new-item">规则编码</div>
+            <div className="new-value">
+              {detailsData?.rule_code || "--"}
+            </div>
+          </div>
+          <div className="ltc-item">
+            <div className="new-item">创建人</div>
+            <div className="new-value">
+              {detailsData?.creator || "--"}
+            </div>
+          </div>
+          <div className="ltc-item">
+            <div className="new-item">创建时间</div>
+            <div className="new-value">
+              {detailsData?.create_time || "--"}
+            </div>
+          </div>
+          <div className="ltc-item">
+            <div className="new-item">规则状态</div>
+            <div className="new-value">
+              {detailsData?.status || "--"}
+            </div>
+          </div>
+          <div className="ltc-item rule-description" >
+            <div className="new-item">规则描述</div>
+            <div className="new-value">
+              {detailsData?.rule_description || "--"}
+            </div>
+          </div>
+  
+        </div>
+    </Modal>
+  </>
+);
 }
 
 export default OrderRuleMgm;
diff --git a/src/services/NewEnergy/chargingMgm.js b/src/services/NewEnergy/chargingMgm.js
index 3f5f566..545330d 100644
--- a/src/services/NewEnergy/chargingMgm.js
+++ b/src/services/NewEnergy/chargingMgm.js
@@ -9,6 +9,45 @@ const getWechatMenuList = (params) => {
   });
 };
 
+// 获取运营商下拉
+const getOperatorList = (params) => {
+  return ajax({
+    url: "/api/nes/rule/operator",
+    type: "get",
+    data: params,
+  });
+};
+
+// 获取规则列表
+const getRegularList = (params) => {
+  return ajax({
+    url: "/api/nes/rule/list",
+    type: "post",
+    data: params,
+  });
+};
+
+// 新增规则
+const addRule = (params) => {
+  return ajax({
+    url: "/api/nes/rule/add",
+    type: "post",
+    data: params,
+  });
+};
+
+// 更新规则状态
+const updataRule = (params) => {
+  return ajax({
+    url: "/api/nes/rule/update",
+    type: "post",
+    data: params,
+  });
+};
 export default{
-  getWechatMenuList
+  getWechatMenuList,
+  getOperatorList,
+  getRegularList,
+  addRule,
+  updataRule
 }
\ No newline at end of file
diff --git a/src/services/index.js b/src/services/index.js
index abcce60..aeceee3 100644
--- a/src/services/index.js
+++ b/src/services/index.js
@@ -23,7 +23,11 @@ import FinancialMgm from "./FinancialMgm";
 import DataAnalysisPrediction from "./DataAnalysisPrediction";
 import ParkingOverview from "./ParkingOverview";
 import OffPeak from "./OffPeak";
+<<<<<<< Updated upstream
 import NewEnergy from "./NewEnergy";
+=======
+import NewEnergy from "./NewEnergy"
+>>>>>>> Stashed changes
 const api = {};
 export default {
   ...api,