Browse Source

feat():充电站管理新增经纬度选择功能

tags/PMS_V1.0.0_Alpha5
zhugy 1 year ago
parent
commit
75d5bad529
  1. 73
      src/components/TableModule/index.jsx
  2. 8
      src/components/TableModule/index.scss
  3. 6
      src/pages/NewEnergy/ChargeStationMgm/index.scss
  4. 64
      src/pages/NewEnergy/ChargeStationMgm/loadable.jsx
  5. 2
      src/pages/NewEnergy/RecordsInquiry/Appointment/loadable.jsx
  6. 46
      src/pages/NewEnergy/RecordsInquiry/Charge/loadable.jsx
  7. 2
      src/pages/NewEnergy/RecordsInquiry/Violation/loadable.jsx
  8. 8
      src/services/NewEnergy/recordsInquiry.js

73
src/components/TableModule/index.jsx

@ -37,7 +37,7 @@ const { RangePicker } = DatePicker;
//<TableModule ref={Ref} /> Ref.current.fetche //<TableModule ref={Ref} /> Ref.current.fetche
const TableModule = forwardRef((props, ref) => { const TableModule = forwardRef((props, ref) => {
const { const {
className="",
className = "",
pagename = "", pagename = "",
columns = [], // columns = [], //
tableData = [], //table tableData = [], //table
@ -50,9 +50,10 @@ const TableModule = forwardRef((props, ref) => {
rowSelection = false, // rowSelection = false, //
isExport = true, // isExport = true, //
diyButton,// diyButton,//
diyTotal, //
rightButtonGroup = [], // rightButtonGroup = [], //
otherData = {}, // otherData = {}, //
rowKey="id", //tablekey
rowKey = "id", //tablekey
userInfo = {},// userInfo = {},//
valueChange, valueChange,
mandatory, mandatory,
@ -61,12 +62,12 @@ const TableModule = forwardRef((props, ref) => {
limitCon,// limitCon,//
isQuickMenu = [], isQuickMenu = [],
mandatory_name, mandatory_name,
renderAdd=() => {},
renderAdd = () => { },
pageName = '',// pageName = '',//
showSerial = false,// showSerial = false,//
limitType = 0, // 0 < 0 > 0 limitType = 0, // 0 < 0 > 0
limit = 0, // limit = 0, //
rightHeaderCompSlot= null, //
rightHeaderCompSlot = null, //
} = props; } = props;
const [sessionTabList, setSessionTabList] = useSessionStorageState(pageName, { const [sessionTabList, setSessionTabList] = useSessionStorageState(pageName, {
value: {} value: {}
@ -131,25 +132,25 @@ const TableModule = forwardRef((props, ref) => {
function onShowSizeChange(pn, page_size) { function onShowSizeChange(pn, page_size) {
setPageData({ setPageData({
pn:1,
pn: 1,
page_size: page_size page_size: page_size
}); });
fetch({pn:1,page_size:page_size})
fetch({ pn: 1, page_size: page_size })
} }
function onChange(pn, page_size){
if(pageData.page_size == page_size){
function onChange(pn, page_size) {
if (pageData.page_size == page_size) {
setPageData({ setPageData({
pn, pn,
page_size, page_size,
}); });
fetch({pn,page_size})
}else{
fetch({ pn, page_size })
} else {
setPageData({ setPageData({
pn:1,
pn: 1,
page_size: page_size page_size: page_size
}); });
fetch({pn:1,page_size:page_size})
fetch({ pn: 1, page_size: page_size })
} }
} }
@ -185,12 +186,12 @@ const TableModule = forwardRef((props, ref) => {
} }
// daterange, date1.isAfter todo --> datepicker // daterange, date1.isAfter todo --> datepicker
let fv = searchForm.getFieldsValue(); let fv = searchForm.getFieldsValue();
Object.keys(fv).map(key=>{
if(temp_obj.hasOwnProperty(key) && fv[key]?.length == 2 && fv[key][0]._isAMomentObject){
if(temp_obj[key] == null || temp_obj[key].length != 2){
temp_obj[key] = initFormData[key] ? initFormData[key] : []
}else{
temp_obj[key] = [moment(temp_obj[key][0]), moment( temp_obj[key][1])]
Object.keys(fv).map(key => {
if (temp_obj.hasOwnProperty(key) && fv[key]?.length == 2 && fv[key][0]._isAMomentObject) {
if (temp_obj[key] == null || temp_obj[key].length != 2) {
temp_obj[key] = initFormData[key] ? initFormData[key] : []
} else {
temp_obj[key] = [moment(temp_obj[key][0]), moment(temp_obj[key][1])]
} }
} }
}) })
@ -242,16 +243,16 @@ const TableModule = forwardRef((props, ref) => {
} }
} }
let form = {}; let form = {};
if(typeof args1 == 'object'){
form = {...searchForm.getFieldsValue(), ...args1, ...otherData, ...updateData}
}else{
form = {...searchForm.getFieldsValue(), ...pageData, ...otherData, ...pnno, ...updateData}
if (typeof args1 == 'object') {
form = { ...searchForm.getFieldsValue(), ...args1, ...otherData, ...updateData }
} else {
form = { ...searchForm.getFieldsValue(), ...pageData, ...otherData, ...pnno, ...updateData }
} }
if(args1 == 'first' ){ // plateData,
if(sessionTabList?.plate2){
form.carId = sessionTabList.plate2
if (args1 == 'first') { // plateData,
if (sessionTabList?.plate2) {
form.carId = sessionTabList.plate2
} }
if(sessionTabList?.region?.length){
if (sessionTabList?.region?.length) {
form.region = sessionTabList.region form.region = sessionTabList.region
} }
} }
@ -283,7 +284,7 @@ const TableModule = forwardRef((props, ref) => {
) )
} }
} }
if(args1 != 'first'){
if (args1 != 'first') {
if (areaName !== null) form[areaName] = areaSelectedList; if (areaName !== null) form[areaName] = areaSelectedList;
} }
if (form.deal_time_start !== void 0 && form.deal_time_end !== void 0) {// if (form.deal_time_start !== void 0 && form.deal_time_end !== void 0) {//
@ -597,9 +598,9 @@ const TableModule = forwardRef((props, ref) => {
key={item.name} key={item.name}
> >
{item.hiddenCount ? ( {item.hiddenCount ? (
<Input placeholder={item.placeholder} autoComplete={item.autoComplete?item.autoComplete:null} />//autoComplete
<Input placeholder={item.placeholder} autoComplete={item.autoComplete ? item.autoComplete : null} />//autoComplete
) : ( ) : (
<Input {...inputParams} placeholder={item.placeholder} autoComplete={item.autoComplete?item.autoComplete:null}/>
<Input {...inputParams} placeholder={item.placeholder} autoComplete={item.autoComplete ? item.autoComplete : null} />
)} )}
</Form.Item> </Form.Item>
); );
@ -817,7 +818,7 @@ const TableModule = forwardRef((props, ref) => {
key={item.name} key={item.name}
initialValue={item.defaultValue} initialValue={item.defaultValue}
> >
<DatePicker.RangePicker allowClear={item.allowClear ? true : false} />
<DatePicker.RangePicker allowClear={item.allowClear ? true : false} />
</Form.Item> </Form.Item>
) )
break; break;
@ -927,6 +928,9 @@ const TableModule = forwardRef((props, ref) => {
export_file_name: filename, export_file_name: filename,
} }
} }
if (pageName === "charge") { //
form.start_time = moment(form.start_time[0]).format("YYYY-MM-DD") + "," + moment(form.start_time[1]).format("YYYY-MM-DD")
}
if (tableData.length != 0) { if (tableData.length != 0) {
exportAjax({ exportAjax({
url: exportUrl, url: exportUrl,
@ -1025,9 +1029,9 @@ const TableModule = forwardRef((props, ref) => {
</Button> </Button>
<Button type="primary" className="submit" <Button type="primary" className="submit"
onClick={() => { onClick={() => {
if(pageData.pn == 1){
if (pageData.pn == 1) {
fetch(1) fetch(1)
}else{
} else {
setPageData({ ...pageData, pn: 1 }) setPageData({ ...pageData, pn: 1 })
fetch({ ...pageData, pn: 1 }) fetch({ ...pageData, pn: 1 })
} }
@ -1058,6 +1062,7 @@ const TableModule = forwardRef((props, ref) => {
<span className="letter">共查询到</span> <span className="letter">共查询到</span>
<span className="total-number"> {total}</span> <span className="total-number"> {total}</span>
<span className="letter">条结果</span> <span className="letter">条结果</span>
{diyTotal ? diyTotal : null}
</span> </span>
<div className="right-button-group"> <div className="right-button-group">
{rightButtonGroup.map((item) => item)} {rightButtonGroup.map((item) => item)}
@ -1114,7 +1119,7 @@ const TableModule = forwardRef((props, ref) => {
pageSize={pageData.page_size} pageSize={pageData.page_size}
pageSizeOptions={dictionary?.pageSizeOptions} pageSizeOptions={dictionary?.pageSizeOptions}
onChange={onChange} onChange={onChange}
// onShowSizeChange={onShowSizeChange}
// onShowSizeChange={onShowSizeChange}
/> />
</div> </div>
</ResultFlow> </ResultFlow>
@ -1197,7 +1202,7 @@ function InputSelectGroup(params) {
</Col> </Col>
<Col span={16}> <Col span={16}>
<DatePicker <DatePicker
className="date-group-time"
className="date-group-time"
placeholder="请选择开始日期" placeholder="请选择开始日期"
allowClear={false} allowClear={false}
onChange={(val, string) => { onChange={(val, string) => {

8
src/components/TableModule/index.scss

@ -38,6 +38,14 @@ $color-primary: var(--color-primary);
} }
.right-list { .right-list {
.charge-static {
.charge-item {
padding: 0 20px;
&:first-child {
margin-left: 20px;
}
}
}
.total-wrapper { .total-wrapper {
display: block; display: block;
.total-item { .total-item {

6
src/pages/NewEnergy/ChargeStationMgm/index.scss

@ -5,8 +5,14 @@
.left,.right { .left,.right {
width: calc(50% - 10px); width: calc(50% - 10px);
.row { .row {
position: relative;
width: 100%; width: 100%;
margin: 10px 0; margin: 10px 0;
.latlng-box {
position: absolute;
right: 0;
top: 0;
}
} }
.cc-form-tree { .cc-form-tree {
margin-bottom: 0; margin-bottom: 0;

64
src/pages/NewEnergy/ChargeStationMgm/loadable.jsx

@ -8,7 +8,7 @@ import {
import ajax from "@/services"; import ajax from "@/services";
import { useSessionStorageState, useSetState } from "ahooks" import { useSessionStorageState, useSetState } from "ahooks"
import { LoadingOutlined, PlusOutlined } from '@ant-design/icons'; import { LoadingOutlined, PlusOutlined } from '@ant-design/icons';
import { TableModule, FormInput, FormSelect, FormTreeSelectNew, ImgError } from "@/components";
import { TableModule, FormInput, FormSelect, FormTreeSelectNew, ImgError, SelectGaodeLngLat } from "@/components";
import "./index.scss"; import "./index.scss";
@ -25,6 +25,8 @@ function Appointment() {
const [areaList, setAreaList] = useState([]); const [areaList, setAreaList] = useState([]);
// //
const [operatorList, setOperatorList] = useState([]); const [operatorList, setOperatorList] = useState([]);
//
const [lngLatVisible, setLngLatVisible] = useState(false);
// //
const initAdd = { const initAdd = {
name: "", name: "",
@ -34,7 +36,8 @@ function Appointment() {
area: "", area: "",
operator: "", operator: "",
count: "", count: "",
img: ""
img: "",
lng_lat: ""
} }
const [addFormData, setAddFormData] = useSetState(initAdd); const [addFormData, setAddFormData] = useSetState(initAdd);
// //
@ -208,35 +211,40 @@ function Appointment() {
setDetailVisible(true) setDetailVisible(true)
} }
const handelOk = () => { const handelOk = () => {
if(!addFormData.name) {
// console.log(addFormData);
if (!addFormData.name) {
message.warn("请输入充电站名称") message.warn("请输入充电站名称")
return return
} }
if(!addFormData.code) {
if (!addFormData.code) {
message.warn("请输入充电站编码") message.warn("请输入充电站编码")
return return
} }
if(!addFormData.count) {
if (!addFormData.count) {
message.warn("请输入车位数量") message.warn("请输入车位数量")
return return
} }
if(!addFormData.address) {
if (!addFormData.address) {
message.warn("请输入详细地址") message.warn("请输入详细地址")
return return
} }
if(!addFormData.site_type) {
if (!addFormData.site_type) {
message.warn("请选择站点类型") message.warn("请选择站点类型")
return return
} }
if(!addFormData.area) {
if (!addFormData.area) {
message.warn("请选择所属区域") message.warn("请选择所属区域")
return return
} }
if(!addFormData.operator) {
if (!addFormData.operator) {
message.warn("请选择商户名称") message.warn("请选择商户名称")
return return
} }
if(!addFormData.img) {
if (!addFormData.lng_lat) {
message.warn("请选择经纬度")
return
}
if (!addFormData.img) {
message.warn("请上传充电照片") message.warn("请上传充电照片")
return return
} }
@ -401,19 +409,6 @@ function Appointment() {
isBayonet={true} isBayonet={true}
onChange={(e) => { setAddFormData({ area: e }) }} 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>
<div className="row"> <div className="row">
<FormSelect <FormSelect
@ -426,6 +421,29 @@ function Appointment() {
onChange={e => { setAddFormData({ operator: e }) }} onChange={e => { setAddFormData({ operator: e }) }}
/> />
</div> </div>
<div className="row">
<FormInput
yisaLabel="经纬度"
placeholder="请选择经纬度"
isShowAfterIcon={false}
defaultValue={addFormData.lng_lat || null}
value={addFormData.lng_lat}
disabled={true}
/>
<div className="latlng-box">
<SelectGaodeLngLat
open={() => setLngLatVisible(true)}
lngLatVisible={lngLatVisible}
getLntLat={(value) => {
setAddFormData({ lng_lat: value })
}}
onChange={(adress) => {
console.log(adress);
}}
close={() => setLngLatVisible(false)}
/>
</div>
</div>
</div> </div>
<div className="right"> <div className="right">
<Upload <Upload

2
src/pages/NewEnergy/RecordsInquiry/Appointment/loadable.jsx

@ -19,7 +19,7 @@ function Appointment() {
const [total, setTotal] = useState(0); const [total, setTotal] = useState(0);
// //
const [detailData, setDetailData] = useState({}); const [detailData, setDetailData] = useState({});
const startTime = moment().subtract(0, 'days').startOf('day').format('YYYY-MM-DD')
const startTime = moment().subtract(7, 'days').startOf('day').format('YYYY-MM-DD')
const endTime = moment().format('YYYY-MM-DD') const endTime = moment().format('YYYY-MM-DD')
// //
const initFormData = { const initFormData = {

46
src/pages/NewEnergy/RecordsInquiry/Charge/loadable.jsx

@ -16,9 +16,18 @@ function Charge() {
const [tableData, setTableData] = useState([]); const [tableData, setTableData] = useState([]);
// //
const [total, setTotal] = useState(0); const [total, setTotal] = useState(0);
const [resultData, setResultData] = useState({
data: [],
total: 0,
total_capacity: 0, //
total_electric: 0, //
total_service_fee: 0, //
total_income: 0, //
total_duration: 0, //
});
// //
const [detailData, setDetailData] = useState({}); const [detailData, setDetailData] = useState({});
const startTime = moment().subtract(0, 'days').startOf('day').format('YYYY-MM-DD')
const startTime = moment().subtract(7, 'days').startOf('day').format('YYYY-MM-DD')
const endTime = moment().format('YYYY-MM-DD') const endTime = moment().format('YYYY-MM-DD')
// //
const initFormData = { const initFormData = {
@ -136,6 +145,7 @@ function Charge() {
} }
ajax.recordsInquiry.getChargeList(params).then((res) => { ajax.recordsInquiry.getChargeList(params).then((res) => {
if (res.status === 20000) { if (res.status === 20000) {
setResultData(res)
setTableData(res.data); setTableData(res.data);
setTotal(res.total); setTotal(res.total);
} else { } else {
@ -144,6 +154,37 @@ function Charge() {
}); });
} }
const diyTotal = (data) => {
return (
<span className="charge-static">
<span className="charge-item">
<span className="letter">总电量:</span>
<span className="total-number">{data.total_capacity||0}</span>
<span className="letter"></span>
</span>
<span className="charge-item">
<span className="letter">总电费:</span>
<span className="total-number">{data.total_electric||0}</span>
<span className="letter"></span>
</span>
<span className="charge-item">
<span className="letter">总服务费:</span>
<span className="total-number">{data.total_service_fee||0}</span>
<span className="letter"></span>
</span>
<span className="charge-item">
<span className="letter">总收入:</span>
<span className="total-number">{data.total_income||0}</span>
<span className="letter"></span>
</span>
<span className="charge-item">
<span className="letter">总时长:</span>
<span className="total-number">{data.total_duration||0}</span>
</span>
</span>
)
}
const handelAdd = () => { const handelAdd = () => {
setDetailVisible(true) setDetailVisible(true)
} }
@ -153,6 +194,7 @@ function Charge() {
<TableModule <TableModule
showSerial={true} showSerial={true}
columns={columns} columns={columns}
diyTotal={diyTotal(resultData)}
tableData={tableData} tableData={tableData}
formSearch={formSearch} formSearch={formSearch}
pagename="充电订单" pagename="充电订单"
@ -160,7 +202,7 @@ function Charge() {
initFormData={initFormData} initFormData={initFormData}
total={total} total={total}
search={search} search={search}
exportUrl="/api/bpm/record/get_record_export"
exportUrl="/api/nes/record_query/export_charge_list"
/> />
<Modal <Modal
open={detailVisible} open={detailVisible}

2
src/pages/NewEnergy/RecordsInquiry/Violation/loadable.jsx

@ -21,7 +21,7 @@ function Violation() {
const [total, setTotal] = useState(0); const [total, setTotal] = useState(0);
// //
const [detailData, setDetailData] = useState({}); const [detailData, setDetailData] = useState({});
const startTime = moment().subtract(0, 'days').startOf('day').format('YYYY-MM-DD')
const startTime = moment().subtract(7, 'days').startOf('day').format('YYYY-MM-DD')
const endTime = moment().format('YYYY-MM-DD') const endTime = moment().format('YYYY-MM-DD')
// //
const initFormData = { const initFormData = {

8
src/services/NewEnergy/recordsInquiry.js

@ -12,7 +12,7 @@ const getUnlockingList = (params) => {
// 预约记录查询 // 预约记录查询
const getAppointmentList = (params) => { const getAppointmentList = (params) => {
return ajax({ return ajax({
url: "/api/new_power/records/appointment_list",
url: "/api/nes/record_query/appointment_list",
type: "post", type: "post",
data: params, data: params,
}); });
@ -21,7 +21,7 @@ const getAppointmentList = (params) => {
// 充电记录查询 // 充电记录查询
const getChargeList = (params) => { const getChargeList = (params) => {
return ajax({ return ajax({
url: "/api/new_power/records/charge_list",
url: "/api/nes/record_query/charge_list",
type: "post", type: "post",
data: params, data: params,
}); });
@ -30,7 +30,7 @@ const getChargeList = (params) => {
// 违规记录查询 // 违规记录查询
const getViolationList = (params) => { const getViolationList = (params) => {
return ajax({ return ajax({
url: "/api/new_power/records/violation_list",
url: "/api/nes/record_query/violation_list",
type: "post", type: "post",
data: params, data: params,
}); });
@ -39,7 +39,7 @@ const getViolationList = (params) => {
// 违规类型下拉 // 违规类型下拉
const getViolationSelect = (params) => { const getViolationSelect = (params) => {
return ajax({ return ajax({
url: "/api/new_power/records/violation_select",
url: "/api/nes/record_query/violation_select",
type: "get", type: "get",
data: params, data: params,
}); });

Loading…
Cancel
Save