chenglb
/
PMS_Frontend_v1.0.0
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

feat():新增充电站管理页面

tags/PMS_V1.0.0_Alpha5
zhugy 1 year ago
parent
8e8987f724
commit
2a3c10b297
16 changed files with 459 additions and 1108 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 6
      src/components/form/FormTreeSelectNew/index.jsx
  2. 6
      src/pages/NewEnergy/ChargeStationMgm/index.jsx
  3. 21
      src/pages/NewEnergy/ChargeStationMgm/index.scss
  4. 355
      src/pages/NewEnergy/ChargeStationMgm/loadable.jsx
  5. 238
      src/pages/NewEnergy/RecordsInquiry/Appointment/index.scss
  6. 13
      src/pages/NewEnergy/RecordsInquiry/Appointment/loadable.jsx
  7. 238
      src/pages/NewEnergy/RecordsInquiry/Charge/index.scss
  8. 90
      src/pages/NewEnergy/RecordsInquiry/Charge/loadable.jsx
  9. 238
      src/pages/NewEnergy/RecordsInquiry/Unlocking/index.scss
  10. 238
      src/pages/NewEnergy/RecordsInquiry/Violation/index.scss
  11. 76
      src/pages/NewEnergy/RecordsInquiry/Violation/loadable.jsx
  12. 2
      src/pages/NewEnergy/index.jsx
  13. 6
      src/router/router.config.js
  14. 32
      src/services/NewEnergy/ChargeStationMgm.js
  15. 4
      src/services/NewEnergy/index.js
  16. 4
      src/services/index.js

6
src/components/form/FormTreeSelectNew/index.jsx
View File

@ -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}

6
src/pages/NewEnergy/ChargeStationMgm/index.jsx
View File

@ -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 />} />

21
src/pages/NewEnergy/ChargeStationMgm/index.scss
View File

@ -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;
}
}
}

355
src/pages/NewEnergy/ChargeStationMgm/loadable.jsx
View File

@ -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;

238
src/pages/NewEnergy/RecordsInquiry/Appointment/index.scss
View File

@ -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;
}
}

13
src/pages/NewEnergy/RecordsInquiry/Appointment/loadable.jsx
View File

@ -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() {
// 详情弹窗

238
src/pages/NewEnergy/RecordsInquiry/Charge/index.scss
View File

@ -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;
}
}

90
src/pages/NewEnergy/RecordsInquiry/Charge/loadable.jsx
View File

@ -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: "预约截至时间",
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",
},
{
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",
@ -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}

238
src/pages/NewEnergy/RecordsInquiry/Unlocking/index.scss
View File

@ -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;
}
}

238
src/pages/NewEnergy/RecordsInquiry/Violation/index.scss
View File

@ -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;
}
}

76
src/pages/NewEnergy/RecordsInquiry/Violation/loadable.jsx
View File

@ -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}

2
src/pages/NewEnergy/index.jsx
View File

@ -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,

6
src/router/router.config.js
View File

@ -1337,6 +1337,12 @@ let routes = [
component: pages.OrderRuleMgm,
},
{
path: "/newEnergy/chargeStationMgm",
text: "充电站管理",
name: "chargeStationMgm",
component: pages.ChargeStationMgm,
},
{
path: "/newEnergy/charge",
text: "充电订单",
name: "charge",

32
src/services/NewEnergy/ChargeStationMgm.js
View File

@ -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
}

4
src/services/NewEnergy/index.js
View File

@ -1,5 +1,7 @@
import chargingMgm from './chargingMgm'
import chargeStationMgm from './ChargeStationMgm'
export default {
...chargingMgm
...chargingMgm,
...chargeStationMgm
}

4
src/services/index.js
View File

@ -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
};
Write Preview
Loading…
Cancel
Save