diff --git a/src/components/form/FormTreeSelectNew/index.jsx b/src/components/form/FormTreeSelectNew/index.jsx
index 6a2510f..462d469 100644
--- a/src/components/form/FormTreeSelectNew/index.jsx
+++ b/src/components/form/FormTreeSelectNew/index.jsx
@@ -13,6 +13,11 @@ export default function FormTreeSelectNew(props) {
     placeholder = "请选择",
     value = [],
     treeData = [],
+    fieldNames={
+      label: "name",
+      value: "id",
+      children: "children",
+    },
     disabled = false,
     className = "",
     maxHeight = 400,
@@ -174,6 +179,7 @@ export default function FormTreeSelectNew(props) {
           allowClear={allowClear}
           value={value}
           disabled={disabled}
+          fieldNames={fieldNames}
           dropdownStyle={{ maxHeight: maxHeight, overflow: "auto" }}
           treeData={data}
           placeholder={placeholder}
diff --git a/src/pages/NewEnergy/ChargeStationMgm/index.jsx b/src/pages/NewEnergy/ChargeStationMgm/index.jsx
index e69de29..d1dc1c2 100644
--- a/src/pages/NewEnergy/ChargeStationMgm/index.jsx
+++ b/src/pages/NewEnergy/ChargeStationMgm/index.jsx
@@ -0,0 +1,6 @@
+import React from "react"
+import loadable from "@loadable/component"
+import { LoadingImg } from "@/components"
+
+const Appointment = loadable(() => import("./loadable"))
+export default (pros) => <Appointment {...pros} fallback={<LoadingImg />} />
\ No newline at end of file
diff --git a/src/pages/NewEnergy/ChargeStationMgm/index.scss b/src/pages/NewEnergy/ChargeStationMgm/index.scss
new file mode 100644
index 0000000..3ac3e8d
--- /dev/null
+++ b/src/pages/NewEnergy/ChargeStationMgm/index.scss
@@ -0,0 +1,21 @@
+.add-station-modal {
+  .add-station-body {
+    display: flex;
+    flex-direction: column;
+    justify-content: center;
+    align-items: center;
+    .row {
+      width: 100%;
+      margin: 10px 0;
+    }
+    .cc-form-tree {
+      margin-bottom: 0;
+    }
+    .cc-form-content,.form-select-single-content {
+      flex: auto;
+    }
+    .cc-form-name,.form-select-single-name {
+      width: 100px;
+    }
+  }
+}
\ No newline at end of file
diff --git a/src/pages/NewEnergy/ChargeStationMgm/loadable.jsx b/src/pages/NewEnergy/ChargeStationMgm/loadable.jsx
new file mode 100644
index 0000000..63062b4
--- /dev/null
+++ b/src/pages/NewEnergy/ChargeStationMgm/loadable.jsx
@@ -0,0 +1,355 @@
+import React, { useState, useRef, useEffect } from "react";
+import {
+  message,
+  Modal,
+  Button,
+  Cascader
+} from "antd";
+import ajax from "@/services";
+import { useSessionStorageState, useSetState } from "ahooks"
+import { TableModule, FormInput, FormSelect, FormTreeSelectNew } from "@/components";
+import "./index.scss";
+
+
+function Appointment() {
+  // 详情弹窗
+  const [detailVisible, setDetailVisible] = useState(false);
+  // 列表数据
+  const [tableData, setTableData] = useState([]);
+  // 数据总数
+  const [total, setTotal] = useState(0);
+  // 详情数据
+  const [detailData, setDetailData] = useState({});
+  // 站点状态下拉
+  const [siteList, setSiteList] = useState([]);
+  // 区域下拉
+  const [areaList, setAreaList] = useState([]);
+  //商户名称下拉
+  const [operatorList, setOperatorList] = useState([]);
+  // 添加站点
+  const initAdd = {
+    name: "",
+    code: "",
+    address: "",
+    site_type: "",
+    area: "",
+    operator: ""
+  }
+  const [addFormData, setAddFormData] = useSetState(initAdd);
+  const [formData, setFormData] = useSetState({});
+  // 初始搜索条件
+  const initFormData = {
+    operator: "0",
+    rule_name: "",
+  };
+
+  const columns = [
+    {
+      title: "充电站名称",
+      dataIndex: "name",
+      key: "name",
+      align: "center",
+    },
+    {
+      title: "充电站编码",
+      dataIndex: "code",
+      key: "code",
+      align: "center",
+    },
+    {
+      title: "站点类型",
+      dataIndex: "site_type",
+      key: "site_type",
+      align: "center",
+    },
+    {
+      title: "所属区域",
+      dataIndex: "area",
+      key: "area",
+      align: "center",
+    },
+    {
+      title: "详细地址",
+      dataIndex: "address",
+      key: "address",
+      align: "center",
+    },
+    {
+      title: "车位总数",
+      dataIndex: "count",
+      key: "count",
+      align: "center",
+    },
+    {
+      title: "商户名称",
+      dataIndex: "operator",
+      key: "operator",
+      align: "center",
+    },
+    {
+      title: "站点状态",
+      dataIndex: "site_status",
+      key: "site_status",
+      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: "name",
+      type: "Input",
+      label: "充电站名称",
+      placeholder: "请输入充电站名称",
+    },
+    {
+      name: "area",
+      type: "TreeSelect",
+      defaultValue: "0",
+      label: "所属区域",
+      placeholder: "请选择所属区域",
+    },
+    {
+      name: "site_status",
+      type: "Select",
+      label: "站点状态",
+      options: [
+        { value: "0", label: "全部" },
+        ...siteList
+      ],
+      defaultValue: "0",
+      placeholder: "请选择站点状态",
+    },
+    {
+      name: "operator",
+      type: "Select",
+      label: "商户名称",
+      defaultValue: "0",
+      placeholder: "请选择商户名称",
+    },
+  ];
+
+  const init = () => {
+    getSiteStatus()
+    getAreaList()
+    getAllOperator()
+  }
+  // 获取站点状态下拉
+  const getSiteStatus = () => {
+    ajax.getSiteStatus().then((res) => {
+      const { status, data } = res
+      if (status === 20000) {
+        if (data && data.length) {
+          data.shift()
+          setSiteList(data);
+        }
+      } else {
+        message.error(res.message)
+      }
+    });
+  }
+  // 获取区域下拉
+  const getAreaList = () => {
+    ajax.getAreaTree().then((res) => {
+      const { status, data } = res
+      if (status === 20000) {
+        if (data && data.length) {
+          data.shift()
+          setAreaList(data);
+        }
+      }
+    }).catch((err) => {
+      console.error(err);
+    });
+  }
+  // 获取商户下拉
+  const getAllOperator = () => {
+    ajax.getAllOperator().then((res) => {
+      const { status, data } = res
+      if (status === 20000) {
+        if (data && data.length) {
+          data.shift()
+          setOperatorList(data);
+        }
+      }
+    }).catch((err) => {
+      console.error(err);
+    });;
+  }
+
+  // 打开弹窗
+  const openModal = (index, record) => {
+    setDetailData(record)
+    setDetailVisible(true);
+  }
+
+  // 检索
+  const search = (params) => {
+    ajax.getStationList(params).then((res) => {
+      if (res.status === 20000) {
+        setFormData(params)
+        setTableData(res.data);
+        setTotal(res.total);
+      } else {
+        message.error(res.message)
+      }
+    });
+  }
+  // 新增
+  const handelAdd = () => {
+    setAddFormData(initAdd)
+    setDetailVisible(true)
+  }
+
+  const handelOk = () => {
+    ajax.addStation(addFormData).then((res) => {
+      if (res.status === 20000) {
+        message.success("新增成功")
+        setDetailVisible(false);
+        setAddFormData(initAdd)
+        search(formData)
+      } else {
+        message.error(res.message)
+      }
+    });
+  }
+
+  useEffect(() => {
+    init()
+  }, [])
+
+
+  return (
+    <>
+      <TableModule
+        showSerial={true}
+        isExport={false}
+        diyButton={
+          <Button
+            type="primary"
+            onClick={handelAdd}
+          >
+            新增
+          </Button>
+        }
+        columns={columns}
+        tableData={tableData}
+        formSearch={formSearch}
+        pagename="充电站管理"
+        pageName={'chargeStationMgm'}
+        initFormData={initFormData}
+        total={total}
+        search={search}
+        exportUrl="/api/bpm/record/get_record_export"
+      />
+      <Modal
+        title="添加充电站"
+        open={detailVisible}
+        width={500}
+        className="add-station-modal"
+        onCancel={() => {
+          setDetailVisible(false);
+        }}
+        onOk={handelOk}
+        destroyOnClose
+      >
+        <div className="add-station-body">
+          <div className="row">
+            <FormInput
+              yisaLabel="充电站名称"
+              placeholder="请输入充电站名称"
+              isShowAfterIcon={false}
+              value={addFormData.name}
+              onChange={e => { setAddFormData({ name: e.target.value }) }}
+            />
+          </div>
+          <div className="row">
+            <FormInput
+              yisaLabel="充电站编码"
+              placeholder="请输入充电站编码"
+              isShowAfterIcon={false}
+              value={addFormData.code}
+              onChange={e => { setAddFormData({ code: e.target.value }) }}
+            />
+          </div>
+          <div className="row">
+            <FormInput
+              yisaLabel="详细地址"
+              placeholder="请输入详细地址"
+              isShowAfterIcon={false}
+              value={addFormData.address}
+              onChange={e => { setAddFormData({ address: e.target.value }) }}
+            />
+          </div>
+          <div className="row">
+            <FormSelect
+              yisaLabel="站点类型"
+              placeholder="请选择站点类型"
+              yisaData={siteList}
+              value={addFormData.site_type}
+              onChange={e => { setAddFormData({ site_type: e }) }}
+            />
+          </div>
+          <div className="row">
+            <FormTreeSelectNew
+              yisaLabel="所属区域"
+              labelPosition="left"
+              placeholder="请选择所属区域"
+              value={addFormData.area || null}
+              fieldNames={{
+                label: "name",
+                value: "id",
+                children: "children",
+              }}
+              treeData={areaList}
+              multiple={false}
+              isBayonet={true}
+              onChange={(e) => { setAddFormData({ area: e }) }}
+            />
+            {/* <Cascader
+              options={areaList}
+              defaultValue={addFormData.area}
+              placeholder="请选择区域"
+              expandTrigger="hover"
+              changeOnSelect
+              fieldNames={{
+                label: "name",
+                value: "id",
+                children: "children",
+              }}
+              onChange={cascaderChange}
+            /> */}
+          </div>
+          <div className="row">
+            <FormSelect
+              yisaLabel="商户名称"
+              placeholder="请选择商户名称"
+              yisaData={operatorList}
+              value={addFormData.operator}
+              onChange={e => { setAddFormData({ operator: e }) }}
+            />
+          </div>
+        </div>
+      </Modal>
+    </>
+  );
+}
+
+export default Appointment;
diff --git a/src/pages/NewEnergy/RecordsInquiry/Appointment/index.scss b/src/pages/NewEnergy/RecordsInquiry/Appointment/index.scss
index 9a8202a..e69de29 100644
--- a/src/pages/NewEnergy/RecordsInquiry/Appointment/index.scss
+++ b/src/pages/NewEnergy/RecordsInquiry/Appointment/index.scss
@@ -1,238 +0,0 @@
-@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);
-
-.ant-tabs {
-  margin-bottom: 16px;
-
-  .ant-tabs-nav {
-    margin-bottom: 0 !important;
-
-    &::before {
-      border-bottom: 1px solid var(--color-card-line) !important;
-    }
-  }
-
-  .ant-tabs-nav-wrap {
-    width: 100%;
-    box-sizing: content-box;
-
-    .ant-tabs-nav-list {
-      width: 340px;
-
-      .ant-tabs-ink-bar {
-        height: 3px;
-        background-color: #00ccff;
-      }
-
-      .ant-tabs-tab {
-        flex: 1;
-        width: 100%;
-        display: flex;
-        justify-content: center;
-        padding-bottom: 10px;
-        text-align: center;
-        cursor: pointer;
-        font-size: 14px !important;
-        font-family: MicrosoftYaHei;
-        text-align: center;
-        letter-spacing: 0.7px;
-      }
-
-      .ant-tabs-tab-active {
-        div {
-          color: #00ccff;
-        }
-      }
-    }
-  }
-}
-
-.ant-input::-webkit-input-placeholder {
-  color: var(--color-placeholder);
-}
-
-.ant-input::-moz-placeholder {
-  color: var(--color-placeholder);
-}
-.right-list  .ant-btn-primary {
-  width: 68px;
-  height: 30px;
-  background: linear-gradient(180deg, #3aa9ff, #59b7ff);
-  border-radius: 4px;
-}
-.ant-input:-ms-input-placeholder {
-  color: var(--color-placeholder);
-}
-.right-list .cc-result-flow .table-wrap .yisa-table .ant-table-thead th {
-  background-color: #616b83 !important;
-}
-.right-list .cc-result-flow .table-wrap .yisa-table .ant-table-tbody td {
-  background-color: #3e4557 !important;
-}
-.right-list .cc-result-flow .table-wrap .yisa-table .ant-table-tbody tr:nth-child(even) td {
-  background-color: #3e4557 !important;
-}
-.ant-input::placeholder {
-  color: var(--color-placeholder);
-}
-
-.ant-select-selection-placeholder {
-  color: var(--color-placeholder);
-}
-
-.ant-select-disabled.ant-select-single:not(.ant-select-customize-input) .ant-select-selector {
-  background: var(--color-input-disabled-bg);
-  color: var(--color-placeholder);
-}
-
-.ant-select-disabled .ant-select-arrow {
-  color: var(--color-placeholder);
-}
-
-.ant-select-disabled.ant-select:not(.ant-select-customize-input) .ant-select-selector {
-  background-color: var(--color-input-disabled-bg);
-  color: var(--color-input-disabled-color);
-  cursor: not-allowed;
-}
-
-.ant-select-multiple {
-  .ant-select-selector {
-    .ant-select-selection-item {
-      background-color: var(--color-bg-body);
-      border-color: var(--color-border);
-
-      .ant-select-selection-item-remove {
-        color: var(--color-text);
-      }
-    }
-  }
-}
-
-.ant-select-arrow {
-  color: var(--color-text);
-}
-
-.ant-select-clear {
-  border-radius: 50%;
-}
-
-.ant-select-dropdown-menu {
-  background-color: var(--color-input-bg);
-
-  .ant-select-dropdown-menu-item {
-    color: var(--color-text);
-
-    &.ant-select-dropdown-menu-item-active {
-      color: #fff;
-      // background-color: var(--radio-button-bg-checked);
-    }
-
-    &.ant-select-dropdown-menu-item-selected {
-      color: #fff;
-      // background-color: var(--radio-button-bg-checked);
-    }
-
-    &:hover {
-      color: #fff;
-      // background-color: var(--radio-button-bg-checked);
-    }
-  }
-}
-
-.ant-select-selector {
-  background-color: var(--color-search-list-item-bg) !important;
-  box-shadow: none !important;
-  border-radius: 4px;
-  color: var(--color-search-list-item-value);
-  border-color: var(--color-search-list-item-bd) !important;
-}
-
-.ant-select-selection {
-  background-color: var(--color-input-bg);
-  box-shadow: none;
-  color: var(--color-text);
-  // border-color:var(--checkable-tag-border);
-}
-
-.ant-form-horizontal .ant-form-item-label {
-  label {
-    display: inline-block;
-    word-wrap: break-word;
-    white-space: normal;
-  }
-}
-
-.ant-picker {
-  width: 100%;
-  background-color: var(--color-search-list-item-bg);
-  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;
-  }
-  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;
-  }
-}
-.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;
-  }
-}
\ No newline at end of file
diff --git a/src/pages/NewEnergy/RecordsInquiry/Appointment/loadable.jsx b/src/pages/NewEnergy/RecordsInquiry/Appointment/loadable.jsx
index febe305..8bccff3 100644
--- a/src/pages/NewEnergy/RecordsInquiry/Appointment/loadable.jsx
+++ b/src/pages/NewEnergy/RecordsInquiry/Appointment/loadable.jsx
@@ -1,26 +1,13 @@
 import React, { useState, useRef, useEffect } from "react";
 import {
   message,
-  Pagination,
-  Table,
-  Space,
   Modal,
   Button,
-  Tabs,
-  Descriptions,
-  Input,
-  Steps,
-  Select,
-  Image,
-  Timeline,
-  Popover
 } from "antd";
-import { dictionary } from "@/config/common";
 import ajax from "@/services";
 import { TableModule } from "@/components";
 import "./index.scss";
 
-const { TextArea } = Input;
 
 function Appointment() {
   // 详情弹窗
diff --git a/src/pages/NewEnergy/RecordsInquiry/Charge/index.scss b/src/pages/NewEnergy/RecordsInquiry/Charge/index.scss
index 9a8202a..e69de29 100644
--- a/src/pages/NewEnergy/RecordsInquiry/Charge/index.scss
+++ b/src/pages/NewEnergy/RecordsInquiry/Charge/index.scss
@@ -1,238 +0,0 @@
-@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);
-
-.ant-tabs {
-  margin-bottom: 16px;
-
-  .ant-tabs-nav {
-    margin-bottom: 0 !important;
-
-    &::before {
-      border-bottom: 1px solid var(--color-card-line) !important;
-    }
-  }
-
-  .ant-tabs-nav-wrap {
-    width: 100%;
-    box-sizing: content-box;
-
-    .ant-tabs-nav-list {
-      width: 340px;
-
-      .ant-tabs-ink-bar {
-        height: 3px;
-        background-color: #00ccff;
-      }
-
-      .ant-tabs-tab {
-        flex: 1;
-        width: 100%;
-        display: flex;
-        justify-content: center;
-        padding-bottom: 10px;
-        text-align: center;
-        cursor: pointer;
-        font-size: 14px !important;
-        font-family: MicrosoftYaHei;
-        text-align: center;
-        letter-spacing: 0.7px;
-      }
-
-      .ant-tabs-tab-active {
-        div {
-          color: #00ccff;
-        }
-      }
-    }
-  }
-}
-
-.ant-input::-webkit-input-placeholder {
-  color: var(--color-placeholder);
-}
-
-.ant-input::-moz-placeholder {
-  color: var(--color-placeholder);
-}
-.right-list  .ant-btn-primary {
-  width: 68px;
-  height: 30px;
-  background: linear-gradient(180deg, #3aa9ff, #59b7ff);
-  border-radius: 4px;
-}
-.ant-input:-ms-input-placeholder {
-  color: var(--color-placeholder);
-}
-.right-list .cc-result-flow .table-wrap .yisa-table .ant-table-thead th {
-  background-color: #616b83 !important;
-}
-.right-list .cc-result-flow .table-wrap .yisa-table .ant-table-tbody td {
-  background-color: #3e4557 !important;
-}
-.right-list .cc-result-flow .table-wrap .yisa-table .ant-table-tbody tr:nth-child(even) td {
-  background-color: #3e4557 !important;
-}
-.ant-input::placeholder {
-  color: var(--color-placeholder);
-}
-
-.ant-select-selection-placeholder {
-  color: var(--color-placeholder);
-}
-
-.ant-select-disabled.ant-select-single:not(.ant-select-customize-input) .ant-select-selector {
-  background: var(--color-input-disabled-bg);
-  color: var(--color-placeholder);
-}
-
-.ant-select-disabled .ant-select-arrow {
-  color: var(--color-placeholder);
-}
-
-.ant-select-disabled.ant-select:not(.ant-select-customize-input) .ant-select-selector {
-  background-color: var(--color-input-disabled-bg);
-  color: var(--color-input-disabled-color);
-  cursor: not-allowed;
-}
-
-.ant-select-multiple {
-  .ant-select-selector {
-    .ant-select-selection-item {
-      background-color: var(--color-bg-body);
-      border-color: var(--color-border);
-
-      .ant-select-selection-item-remove {
-        color: var(--color-text);
-      }
-    }
-  }
-}
-
-.ant-select-arrow {
-  color: var(--color-text);
-}
-
-.ant-select-clear {
-  border-radius: 50%;
-}
-
-.ant-select-dropdown-menu {
-  background-color: var(--color-input-bg);
-
-  .ant-select-dropdown-menu-item {
-    color: var(--color-text);
-
-    &.ant-select-dropdown-menu-item-active {
-      color: #fff;
-      // background-color: var(--radio-button-bg-checked);
-    }
-
-    &.ant-select-dropdown-menu-item-selected {
-      color: #fff;
-      // background-color: var(--radio-button-bg-checked);
-    }
-
-    &:hover {
-      color: #fff;
-      // background-color: var(--radio-button-bg-checked);
-    }
-  }
-}
-
-.ant-select-selector {
-  background-color: var(--color-search-list-item-bg) !important;
-  box-shadow: none !important;
-  border-radius: 4px;
-  color: var(--color-search-list-item-value);
-  border-color: var(--color-search-list-item-bd) !important;
-}
-
-.ant-select-selection {
-  background-color: var(--color-input-bg);
-  box-shadow: none;
-  color: var(--color-text);
-  // border-color:var(--checkable-tag-border);
-}
-
-.ant-form-horizontal .ant-form-item-label {
-  label {
-    display: inline-block;
-    word-wrap: break-word;
-    white-space: normal;
-  }
-}
-
-.ant-picker {
-  width: 100%;
-  background-color: var(--color-search-list-item-bg);
-  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;
-  }
-  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;
-  }
-}
-.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;
-  }
-}
\ No newline at end of file
diff --git a/src/pages/NewEnergy/RecordsInquiry/Charge/loadable.jsx b/src/pages/NewEnergy/RecordsInquiry/Charge/loadable.jsx
index 50650f2..0530080 100644
--- a/src/pages/NewEnergy/RecordsInquiry/Charge/loadable.jsx
+++ b/src/pages/NewEnergy/RecordsInquiry/Charge/loadable.jsx
@@ -1,26 +1,13 @@
 import React, { useState, useRef, useEffect } from "react";
 import {
   message,
-  Pagination,
-  Table,
-  Space,
   Modal,
   Button,
-  Tabs,
-  Descriptions,
-  Input,
-  Steps,
-  Select,
-  Image,
-  Timeline,
-  Popover
 } from "antd";
-import { dictionary } from "@/config/common";
 import ajax from "@/services";
 import { TableModule } from "@/components";
 import "./index.scss";
 
-const { TextArea } = Input;
 
 function Charge() {
   // 详情弹窗
@@ -39,73 +26,55 @@ function Charge() {
 
   const columns = [
     {
-      title: "用户手机号",
+      title: "充电订单号",
       dataIndex: "operator",
       key: "operator",
       align: "center",
     },
     {
-      title: "车牌号",
+      title: "充电站",
       dataIndex: "plate",
       key: "plate",
       align: "center",
     },
     {
-      title: "充电站",
+      title: "充电电量",
       dataIndex: "plate_color",
       key: "plate_color",
       align: "center",
     },
     {
-      title: "商户名称",
+      title: "电费",
       dataIndex: "berth_id",
       key: "berth_id",
       align: "center",
     },
     {
-      title: "降预约开始时间",
-      dataIndex: "in_time",
-      key: "in_time",
-      align: "center",
-    },
-    {
-      title: "预约截至时间",
+      title: "充电服务费",
       dataIndex: "in_time",
       key: "in_time",
       align: "center",
     },
     {
-      title: "缴纳预约费用金额",
+      title: "充电收入",
       dataIndex: "in_time",
       key: "in_time",
       align: "center",
     },
     {
-      title: "缴费时间",
+      title: "充电开始时间",
       dataIndex: "in_time",
       key: "in_time",
       align: "center",
     },
     {
-      title: "订单状态",
+      title: "充电结束时间",
       dataIndex: "in_time",
       key: "in_time",
       align: "center",
     },
     {
-      title: "订单完结时间",
-      dataIndex: "in_time",
-      key: "in_time",
-      align: "center",
-    },
-    {
-      title: "预约费用退款金额",
-      dataIndex: "in_time",
-      key: "in_time",
-      align: "center",
-    },
-    {
-      title: "顶动感实收金额",
+      title: "充电时长",
       dataIndex: "in_time",
       key: "in_time",
       align: "center",
@@ -134,37 +103,19 @@ function Charge() {
     {
       name: "phone",
       type: "Input",
-      label: "用户手机号",
-      placeholder: "请输入用户手机号",
+      label: "充电站名称",
+      placeholder: "请输入充电站名称",
     },
     {
       name: "plate",
       type: "Input",
-      label: "车牌号",
-      placeholder: "请输入车牌号",
-    },
-    {
-      name: "charging",
-      type: "Input",
-      label: "充电站",
-      placeholder: "请输入充电站",
-    },
-    {
-      name: "operator",
-      type: "Select",
-      label: "商户名称",
-      defaultValue: "0",
-      placeholder: "请选择商户名称",
+      label: "订单编号",
+      placeholder: "请输入订单编号",
     },
     {
       name: "timeStart",
       type: "DateRangePicker",
-      label: "预约开始时间",
-    },
-    {
-      name: "timeEnd",
-      type: "DateRangePicker",
-      label: "订单完结时间",
+      label: "充电开始时间",
     },
   ];
 
@@ -194,20 +145,11 @@ function Charge() {
     <>
       <TableModule
         showSerial={true}
-        isExport={false}
-        diyButton={
-          <Button
-            type="primary"
-            onClick={handelAdd}
-          >
-            新增
-          </Button>
-        }
         columns={columns}
         tableData={tableData}
         formSearch={formSearch}
-        pagename="预约订单"
-        pageName={'Appointment'}
+        pagename="充电订单"
+        pageName={'charge'}
         initFormData={initFormData}
         total={total}
         search={search}
diff --git a/src/pages/NewEnergy/RecordsInquiry/Unlocking/index.scss b/src/pages/NewEnergy/RecordsInquiry/Unlocking/index.scss
index 9a8202a..e69de29 100644
--- a/src/pages/NewEnergy/RecordsInquiry/Unlocking/index.scss
+++ b/src/pages/NewEnergy/RecordsInquiry/Unlocking/index.scss
@@ -1,238 +0,0 @@
-@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);
-
-.ant-tabs {
-  margin-bottom: 16px;
-
-  .ant-tabs-nav {
-    margin-bottom: 0 !important;
-
-    &::before {
-      border-bottom: 1px solid var(--color-card-line) !important;
-    }
-  }
-
-  .ant-tabs-nav-wrap {
-    width: 100%;
-    box-sizing: content-box;
-
-    .ant-tabs-nav-list {
-      width: 340px;
-
-      .ant-tabs-ink-bar {
-        height: 3px;
-        background-color: #00ccff;
-      }
-
-      .ant-tabs-tab {
-        flex: 1;
-        width: 100%;
-        display: flex;
-        justify-content: center;
-        padding-bottom: 10px;
-        text-align: center;
-        cursor: pointer;
-        font-size: 14px !important;
-        font-family: MicrosoftYaHei;
-        text-align: center;
-        letter-spacing: 0.7px;
-      }
-
-      .ant-tabs-tab-active {
-        div {
-          color: #00ccff;
-        }
-      }
-    }
-  }
-}
-
-.ant-input::-webkit-input-placeholder {
-  color: var(--color-placeholder);
-}
-
-.ant-input::-moz-placeholder {
-  color: var(--color-placeholder);
-}
-.right-list  .ant-btn-primary {
-  width: 68px;
-  height: 30px;
-  background: linear-gradient(180deg, #3aa9ff, #59b7ff);
-  border-radius: 4px;
-}
-.ant-input:-ms-input-placeholder {
-  color: var(--color-placeholder);
-}
-.right-list .cc-result-flow .table-wrap .yisa-table .ant-table-thead th {
-  background-color: #616b83 !important;
-}
-.right-list .cc-result-flow .table-wrap .yisa-table .ant-table-tbody td {
-  background-color: #3e4557 !important;
-}
-.right-list .cc-result-flow .table-wrap .yisa-table .ant-table-tbody tr:nth-child(even) td {
-  background-color: #3e4557 !important;
-}
-.ant-input::placeholder {
-  color: var(--color-placeholder);
-}
-
-.ant-select-selection-placeholder {
-  color: var(--color-placeholder);
-}
-
-.ant-select-disabled.ant-select-single:not(.ant-select-customize-input) .ant-select-selector {
-  background: var(--color-input-disabled-bg);
-  color: var(--color-placeholder);
-}
-
-.ant-select-disabled .ant-select-arrow {
-  color: var(--color-placeholder);
-}
-
-.ant-select-disabled.ant-select:not(.ant-select-customize-input) .ant-select-selector {
-  background-color: var(--color-input-disabled-bg);
-  color: var(--color-input-disabled-color);
-  cursor: not-allowed;
-}
-
-.ant-select-multiple {
-  .ant-select-selector {
-    .ant-select-selection-item {
-      background-color: var(--color-bg-body);
-      border-color: var(--color-border);
-
-      .ant-select-selection-item-remove {
-        color: var(--color-text);
-      }
-    }
-  }
-}
-
-.ant-select-arrow {
-  color: var(--color-text);
-}
-
-.ant-select-clear {
-  border-radius: 50%;
-}
-
-.ant-select-dropdown-menu {
-  background-color: var(--color-input-bg);
-
-  .ant-select-dropdown-menu-item {
-    color: var(--color-text);
-
-    &.ant-select-dropdown-menu-item-active {
-      color: #fff;
-      // background-color: var(--radio-button-bg-checked);
-    }
-
-    &.ant-select-dropdown-menu-item-selected {
-      color: #fff;
-      // background-color: var(--radio-button-bg-checked);
-    }
-
-    &:hover {
-      color: #fff;
-      // background-color: var(--radio-button-bg-checked);
-    }
-  }
-}
-
-.ant-select-selector {
-  background-color: var(--color-search-list-item-bg) !important;
-  box-shadow: none !important;
-  border-radius: 4px;
-  color: var(--color-search-list-item-value);
-  border-color: var(--color-search-list-item-bd) !important;
-}
-
-.ant-select-selection {
-  background-color: var(--color-input-bg);
-  box-shadow: none;
-  color: var(--color-text);
-  // border-color:var(--checkable-tag-border);
-}
-
-.ant-form-horizontal .ant-form-item-label {
-  label {
-    display: inline-block;
-    word-wrap: break-word;
-    white-space: normal;
-  }
-}
-
-.ant-picker {
-  width: 100%;
-  background-color: var(--color-search-list-item-bg);
-  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;
-  }
-  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;
-  }
-}
-.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;
-  }
-}
\ No newline at end of file
diff --git a/src/pages/NewEnergy/RecordsInquiry/Violation/index.scss b/src/pages/NewEnergy/RecordsInquiry/Violation/index.scss
index 9a8202a..e69de29 100644
--- a/src/pages/NewEnergy/RecordsInquiry/Violation/index.scss
+++ b/src/pages/NewEnergy/RecordsInquiry/Violation/index.scss
@@ -1,238 +0,0 @@
-@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);
-
-.ant-tabs {
-  margin-bottom: 16px;
-
-  .ant-tabs-nav {
-    margin-bottom: 0 !important;
-
-    &::before {
-      border-bottom: 1px solid var(--color-card-line) !important;
-    }
-  }
-
-  .ant-tabs-nav-wrap {
-    width: 100%;
-    box-sizing: content-box;
-
-    .ant-tabs-nav-list {
-      width: 340px;
-
-      .ant-tabs-ink-bar {
-        height: 3px;
-        background-color: #00ccff;
-      }
-
-      .ant-tabs-tab {
-        flex: 1;
-        width: 100%;
-        display: flex;
-        justify-content: center;
-        padding-bottom: 10px;
-        text-align: center;
-        cursor: pointer;
-        font-size: 14px !important;
-        font-family: MicrosoftYaHei;
-        text-align: center;
-        letter-spacing: 0.7px;
-      }
-
-      .ant-tabs-tab-active {
-        div {
-          color: #00ccff;
-        }
-      }
-    }
-  }
-}
-
-.ant-input::-webkit-input-placeholder {
-  color: var(--color-placeholder);
-}
-
-.ant-input::-moz-placeholder {
-  color: var(--color-placeholder);
-}
-.right-list  .ant-btn-primary {
-  width: 68px;
-  height: 30px;
-  background: linear-gradient(180deg, #3aa9ff, #59b7ff);
-  border-radius: 4px;
-}
-.ant-input:-ms-input-placeholder {
-  color: var(--color-placeholder);
-}
-.right-list .cc-result-flow .table-wrap .yisa-table .ant-table-thead th {
-  background-color: #616b83 !important;
-}
-.right-list .cc-result-flow .table-wrap .yisa-table .ant-table-tbody td {
-  background-color: #3e4557 !important;
-}
-.right-list .cc-result-flow .table-wrap .yisa-table .ant-table-tbody tr:nth-child(even) td {
-  background-color: #3e4557 !important;
-}
-.ant-input::placeholder {
-  color: var(--color-placeholder);
-}
-
-.ant-select-selection-placeholder {
-  color: var(--color-placeholder);
-}
-
-.ant-select-disabled.ant-select-single:not(.ant-select-customize-input) .ant-select-selector {
-  background: var(--color-input-disabled-bg);
-  color: var(--color-placeholder);
-}
-
-.ant-select-disabled .ant-select-arrow {
-  color: var(--color-placeholder);
-}
-
-.ant-select-disabled.ant-select:not(.ant-select-customize-input) .ant-select-selector {
-  background-color: var(--color-input-disabled-bg);
-  color: var(--color-input-disabled-color);
-  cursor: not-allowed;
-}
-
-.ant-select-multiple {
-  .ant-select-selector {
-    .ant-select-selection-item {
-      background-color: var(--color-bg-body);
-      border-color: var(--color-border);
-
-      .ant-select-selection-item-remove {
-        color: var(--color-text);
-      }
-    }
-  }
-}
-
-.ant-select-arrow {
-  color: var(--color-text);
-}
-
-.ant-select-clear {
-  border-radius: 50%;
-}
-
-.ant-select-dropdown-menu {
-  background-color: var(--color-input-bg);
-
-  .ant-select-dropdown-menu-item {
-    color: var(--color-text);
-
-    &.ant-select-dropdown-menu-item-active {
-      color: #fff;
-      // background-color: var(--radio-button-bg-checked);
-    }
-
-    &.ant-select-dropdown-menu-item-selected {
-      color: #fff;
-      // background-color: var(--radio-button-bg-checked);
-    }
-
-    &:hover {
-      color: #fff;
-      // background-color: var(--radio-button-bg-checked);
-    }
-  }
-}
-
-.ant-select-selector {
-  background-color: var(--color-search-list-item-bg) !important;
-  box-shadow: none !important;
-  border-radius: 4px;
-  color: var(--color-search-list-item-value);
-  border-color: var(--color-search-list-item-bd) !important;
-}
-
-.ant-select-selection {
-  background-color: var(--color-input-bg);
-  box-shadow: none;
-  color: var(--color-text);
-  // border-color:var(--checkable-tag-border);
-}
-
-.ant-form-horizontal .ant-form-item-label {
-  label {
-    display: inline-block;
-    word-wrap: break-word;
-    white-space: normal;
-  }
-}
-
-.ant-picker {
-  width: 100%;
-  background-color: var(--color-search-list-item-bg);
-  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;
-  }
-  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;
-  }
-}
-.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;
-  }
-}
\ No newline at end of file
diff --git a/src/pages/NewEnergy/RecordsInquiry/Violation/loadable.jsx b/src/pages/NewEnergy/RecordsInquiry/Violation/loadable.jsx
index 1e7a33b..d1fa6ae 100644
--- a/src/pages/NewEnergy/RecordsInquiry/Violation/loadable.jsx
+++ b/src/pages/NewEnergy/RecordsInquiry/Violation/loadable.jsx
@@ -1,26 +1,13 @@
 import React, { useState, useRef, useEffect } from "react";
 import {
   message,
-  Pagination,
-  Table,
-  Space,
   Modal,
   Button,
-  Tabs,
-  Descriptions,
-  Input,
-  Steps,
-  Select,
-  Image,
-  Timeline,
-  Popover
 } from "antd";
-import { dictionary } from "@/config/common";
 import ajax from "@/services";
 import { TableModule } from "@/components";
 import "./index.scss";
 
-const { TextArea } = Input;
 
 function Violation() {
   // 详情弹窗
@@ -57,55 +44,13 @@ function Violation() {
       align: "center",
     },
     {
-      title: "商户名称",
+      title: "违规类型",
       dataIndex: "berth_id",
       key: "berth_id",
       align: "center",
     },
     {
-      title: "降预约开始时间",
-      dataIndex: "in_time",
-      key: "in_time",
-      align: "center",
-    },
-    {
-      title: "预约截至时间",
-      dataIndex: "in_time",
-      key: "in_time",
-      align: "center",
-    },
-    {
-      title: "缴纳预约费用金额",
-      dataIndex: "in_time",
-      key: "in_time",
-      align: "center",
-    },
-    {
-      title: "缴费时间",
-      dataIndex: "in_time",
-      key: "in_time",
-      align: "center",
-    },
-    {
-      title: "订单状态",
-      dataIndex: "in_time",
-      key: "in_time",
-      align: "center",
-    },
-    {
-      title: "订单完结时间",
-      dataIndex: "in_time",
-      key: "in_time",
-      align: "center",
-    },
-    {
-      title: "预约费用退款金额",
-      dataIndex: "in_time",
-      key: "in_time",
-      align: "center",
-    },
-    {
-      title: "顶动感实收金额",
+      title: "记录创建时间",
       dataIndex: "in_time",
       key: "in_time",
       align: "center",
@@ -152,19 +97,14 @@ function Violation() {
     {
       name: "operator",
       type: "Select",
-      label: "商户名称",
+      label: "违规类型",
       defaultValue: "0",
-      placeholder: "请选择商户名称",
+      placeholder: "请选择违规类型",
     },
     {
       name: "timeStart",
       type: "DateRangePicker",
-      label: "预约开始时间",
-    },
-    {
-      name: "timeEnd",
-      type: "DateRangePicker",
-      label: "订单完结时间",
+      label: "记录创建时间",
     },
   ];
 
@@ -190,6 +130,8 @@ function Violation() {
     setDetailVisible(true)
   }
 
+
+
   return (
     <>
       <TableModule
@@ -206,8 +148,8 @@ function Violation() {
         columns={columns}
         tableData={tableData}
         formSearch={formSearch}
-        pagename="预约订单"
-        pageName={'Appointment'}
+        pagename="违规订单"
+        pageName={'violation'}
         initFormData={initFormData}
         total={total}
         search={search}
diff --git a/src/pages/NewEnergy/index.jsx b/src/pages/NewEnergy/index.jsx
index 7d43cfc..65094c1 100644
--- a/src/pages/NewEnergy/index.jsx
+++ b/src/pages/NewEnergy/index.jsx
@@ -1,10 +1,12 @@
 import ChargingMgm from './ChargingMgm'
 import NewEnergyOverview from './NewEnergyOverview'
+import ChargeStationMgm from './ChargeStationMgm'
 import RecordsInquiry from './RecordsInquiry'
 import RealtimeMonitor from './RealtimeMonitor'
 
 export default {
   NewEnergyOverview,
+  ChargeStationMgm,
   ...RealtimeMonitor,
   ...ChargingMgm,
   ...RecordsInquiry,
diff --git a/src/router/router.config.js b/src/router/router.config.js
index 1c5c6fe..58c238d 100644
--- a/src/router/router.config.js
+++ b/src/router/router.config.js
@@ -1337,6 +1337,12 @@ let routes = [
         component: pages.OrderRuleMgm,
       },
       {
+        path: "/newEnergy/chargeStationMgm",
+        text: "充电站管理",
+        name: "chargeStationMgm",
+        component: pages.ChargeStationMgm,
+      },
+      {
         path: "/newEnergy/charge",
         text: "充电订单",
         name: "charge",
diff --git a/src/services/NewEnergy/ChargeStationMgm.js b/src/services/NewEnergy/ChargeStationMgm.js
new file mode 100644
index 0000000..5b7dc12
--- /dev/null
+++ b/src/services/NewEnergy/ChargeStationMgm.js
@@ -0,0 +1,32 @@
+import ajax from "@/config/ajax"
+// 充电站管理
+// 获取列表数据
+const getStationList = (params) => {
+  return ajax({
+    url: "/api/fin/charge_station/get_list",
+    type: "post",
+    data: params,
+  });
+};
+// 获取站点状态
+const getSiteStatus = (params) => {
+  return ajax({
+    url: "/api/fin/charge_station/site_status",
+    type: "get",
+    data: params,
+  });
+};
+// 新增充电站
+const addStation = (params) => {
+  return ajax({
+    url: "/api/fin/charge_station/add_station",
+    type: "post",
+    data: params,
+  });
+};
+
+export default{
+  getSiteStatus,
+  getStationList,
+  addStation
+}
diff --git a/src/services/NewEnergy/index.js b/src/services/NewEnergy/index.js
index d1a45b4..18993a1 100644
--- a/src/services/NewEnergy/index.js
+++ b/src/services/NewEnergy/index.js
@@ -1,5 +1,7 @@
 import chargingMgm from './chargingMgm'
+import chargeStationMgm from './ChargeStationMgm'
 
 export default {
-  ...chargingMgm
+  ...chargingMgm,
+  ...chargeStationMgm
 }
\ No newline at end of file
diff --git a/src/services/index.js b/src/services/index.js
index 76c1d02..abcce60 100644
--- a/src/services/index.js
+++ b/src/services/index.js
@@ -23,6 +23,7 @@ import FinancialMgm from "./FinancialMgm";
 import DataAnalysisPrediction from "./DataAnalysisPrediction";
 import ParkingOverview from "./ParkingOverview";
 import OffPeak from "./OffPeak";
+import NewEnergy from "./NewEnergy";
 const api = {};
 export default {
   ...api,
@@ -50,5 +51,6 @@ export default {
   ...FinancialMgm,
   ...DataAnalysisPrediction,
   ParkingOverview,
-  ...OffPeak
+  ...OffPeak,
+  ...NewEnergy
 };