调度界面
This commit is contained in:
小小
parent
cda8a2f68f
commit
2e7a5047f5
@ -118,36 +118,34 @@
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.divQuantityCount {
|
||||
.divQuantityCount,
|
||||
.divCount {
|
||||
font-size: 18px;
|
||||
font-weight: bolder;
|
||||
}
|
||||
|
||||
/* .divRowQC {
|
||||
line-height: 25px;
|
||||
.divFlex {
|
||||
display: flex;
|
||||
justify-content: space-evenly;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.lbNoQC {
|
||||
.divCountLabel {
|
||||
font-size: 14px;
|
||||
color: #000;
|
||||
margin-left: 3px;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.lbTag {
|
||||
padding: 3px 10px;
|
||||
font-size: 12px;
|
||||
.divSlider {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-left: 10px;
|
||||
font-size: 14px;
|
||||
padding-top: 10px;
|
||||
}
|
||||
|
||||
.divSliderLable {
|
||||
background-color: #E2F8FF;
|
||||
border-radius: 15px;
|
||||
margin-left: 5px;
|
||||
|
||||
padding: 3px 15px;
|
||||
color: #0AB6F9;
|
||||
margin-right: 10px;
|
||||
}
|
||||
|
||||
.lbTagGreen {
|
||||
color: #1DD950;
|
||||
background-color: #E8F9E6;
|
||||
}
|
||||
|
||||
.lbTagRed {
|
||||
color: #F98F93;
|
||||
background-color: #FFECED;
|
||||
} */
|
||||
@ -1,6 +1,6 @@
|
||||
<template>
|
||||
<div class="divHead">
|
||||
<label :class="selRight==index?'divHeadSel':''" v-for="(item,index) in arrRight" :key="index"
|
||||
<label :class="selRight.index==index?'divHeadSel':''" v-for="(item,index) in arrRight" :key="index"
|
||||
@click="queryOrders(item.lx,index)">
|
||||
{{item.name}}
|
||||
</label>
|
||||
@ -69,9 +69,13 @@
|
||||
</div>
|
||||
</div>
|
||||
<div class="divLowerRight">
|
||||
<div @click="changeBatteries">
|
||||
<div v-show="selRight.lx=='hd'" @click="changeBatteries">
|
||||
<uni-icons type="scan" :color="iconcolor" :size="iconsize" />
|
||||
<div>批量换电</div>
|
||||
<div>换电</div>
|
||||
</div>
|
||||
<div v-show="selRight.lx=='dd'" @click="changeBatteries">
|
||||
<uni-icons type="scan" :color="iconcolor" :size="iconsize" />
|
||||
<div>调度</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="divBottom">
|
||||
@ -94,7 +98,8 @@
|
||||
<div class="divQuantity">
|
||||
<div class="divQuantityCount" :style="{color:color_middle}">{{q_cnt2}}</div>
|
||||
<div>
|
||||
<label><uni-icons custom-prefix="iconfont" :type="icon-ebikedianliang1"
|
||||
<label>
|
||||
<uni-icons custom-prefix="iconfont" type="icon-ebikedianliang1"
|
||||
:color="color_middle" :size="iconsize" />
|
||||
</label>
|
||||
中电量
|
||||
@ -114,74 +119,62 @@
|
||||
</uni-col>
|
||||
|
||||
</uni-row>
|
||||
<div style="padding-top: 10px;">
|
||||
<uni-row>
|
||||
<uni-col :span="6">
|
||||
<div style="text-align: right;">电量筛选</div>
|
||||
</uni-col>
|
||||
<uni-col :span="16">
|
||||
<slider show-value block-size="20" :value="quantityCount" :active-color="quantityColor"
|
||||
:block-color="quantityColor" @change="quantityChange" />
|
||||
</uni-col>
|
||||
</uni-row>
|
||||
<div class="divSlider">
|
||||
<div style="text-align: right;">电量筛选</div>
|
||||
<div style="flex: 1;">
|
||||
<slider show-value block-size="20" :value="quantityCount" :active-color="quantityColor"
|
||||
:block-color="quantityColor" @change="quantityChange" />
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
<div v-show="showQC_info" style="padding: 0px 10px;">
|
||||
<div style="position:absolute;right:10px;top: -5px;" @click="colseQC_Info">
|
||||
<div v-show="showBikeInfo" style="padding: 0px 10px;">
|
||||
<div style="position:absolute;right:10px;top: -5px;" @click="colseBikeInfo">
|
||||
<uni-icons custom-prefix="iconfont" type="icon-ebikeguanbi" size="20" color="#777777" />
|
||||
</div>
|
||||
<devops-home-bikeinfo :data="dataQC" />
|
||||
<devops-home-bikeinfo :data="dataBikeInfo" />
|
||||
</div>
|
||||
<div v-show="showDD">
|
||||
<div class="divFlex">
|
||||
<div>
|
||||
<div class="divCount">
|
||||
{{dd_count.sxjg}}
|
||||
</div>
|
||||
<div class="divCountLabel">
|
||||
筛选结果
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<div class="divCount" :style="{color:color_down}">
|
||||
{{dd_count.ccyyq}}
|
||||
</div>
|
||||
<div class="divCountLabel">
|
||||
超出运营区域
|
||||
|
||||
<!-- <div v-show="showQC_info" style="padding: 0px 10px;">
|
||||
<div style="position:absolute;right:10px;top: -5px;" @click="colseQC_Info">
|
||||
<uni-icons custom-prefix="iconfont" type="icon-ebikeguanbi" size="20" color="#777777" />
|
||||
</div>
|
||||
<div class="divRowQC">
|
||||
<lable class="lbNoQC">{{dataQC.bikeCode}}</lable>
|
||||
<label v-for="(item,index) in dataQC.arrTag" :key="index" :class="getTagClass(item.type)">
|
||||
{{item.title}}
|
||||
</label>
|
||||
|
||||
</div>
|
||||
<div class="divRowQC" style="color:#adb3b3;font-size: 14px;">
|
||||
电量刷新时间：{{dataQC.time}}
|
||||
</div>
|
||||
<div class="divRowQC" style="display:flex;justify-content: space-between;font-size: 14px;">
|
||||
|
||||
<label>
|
||||
<label :style="{color:dataQC.color}">
|
||||
<uni-icons custom-prefix="iconfont" :type="dataQC.icon" :color="dataQC.color"
|
||||
:size="iconsize" />
|
||||
{{dataQC.soc}}%
|
||||
</label>
|
||||
<lable style="color: #00C57C;margin-left: 10px;">
|
||||
(
|
||||
<label>
|
||||
<uni-icons custom-prefix="iconfont" type="icon-ebikecheliangguanli"
|
||||
color="#00C57C" />
|
||||
</label>
|
||||
<label>{{dataQC.distance}}</label>
|
||||
)
|
||||
|
||||
</lable>
|
||||
</label>
|
||||
<div style="background-color:#E2F8FF;border-radius:15px;padding: 3px 15px;">
|
||||
<label>
|
||||
<uni-icons custom-prefix="iconfont" type="icon-ebikeyinlianglabashengyin"
|
||||
color="#0084FF" size="16" />
|
||||
</label>
|
||||
<label style="color: #0084FF;" @click="findBike">寻车铃</label>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<div class="divCount" :style="{color:color_middle}">
|
||||
{{dd_count.bztcq}}
|
||||
</div>
|
||||
<div class="divCountLabel">
|
||||
不在停车区
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div style="margin-top:15px;display:flex;justify-content:space-between;">
|
||||
<label class="divBtnBlue" @click="openBikeInfo">车辆详情</label>
|
||||
<label class="divBtnBlue" @click="openBattery">电池开仓</label>
|
||||
<label class="divBtnBlue" @click="changeBatteries">完成换电</label>
|
||||
|
||||
<div class="divSlider">
|
||||
<div>无单筛选</div>
|
||||
<div style="flex: 1;">
|
||||
<slider show-value block-size="20" :max="showDD_LX_Max" :value="dd_selvalue"
|
||||
@change="changeDDSelvalue" />
|
||||
</div>
|
||||
<div @click="changeDDLX">
|
||||
<label class="divSliderLable" v-show="showDD_LX===1"> 天数</label>
|
||||
<label class="divSliderLable" v-show="showDD_LX===2"> 小时</label>
|
||||
</div>
|
||||
</div>
|
||||
</div> -->
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
@ -244,18 +237,24 @@
|
||||
//权限
|
||||
const arrRight = ref([{
|
||||
name: "换电",
|
||||
lx: "changebatteries"
|
||||
lx: "hd"
|
||||
},
|
||||
{
|
||||
name: "调度",
|
||||
lx: "deploy"
|
||||
lx: "dd"
|
||||
},
|
||||
{
|
||||
name: "维修",
|
||||
lx: "maintenance"
|
||||
lx: "wx"
|
||||
}
|
||||
]);
|
||||
const selRight = ref(0);
|
||||
const selRight = ref({
|
||||
index: 0,
|
||||
...arrRight.value[0]
|
||||
});
|
||||
|
||||
console.log("66666666666666666666666", selRight)
|
||||
|
||||
|
||||
const mapRef = ref("mapRef");
|
||||
let mapContext = null;
|
||||
@ -283,8 +282,8 @@
|
||||
const q_cnt0 = ref(0);
|
||||
const q_cnt2 = ref(0);
|
||||
const showQC = ref(true);
|
||||
const showQC_info = ref(false);
|
||||
const dataQC = ref({
|
||||
const showBikeInfo = ref(false);
|
||||
const dataBikeInfo = ref({
|
||||
bikeCode: "",
|
||||
arrTag: [],
|
||||
time: "",
|
||||
@ -294,6 +293,18 @@
|
||||
icon: ""
|
||||
})
|
||||
|
||||
const showDD = ref(false);
|
||||
const showDD_LX = ref(1); // 1天数 2小时
|
||||
const showDD_LX_Max = ref(7);
|
||||
const dd_count = ref({
|
||||
sxjg: 0, //筛选结果
|
||||
ccyyq: 0, //超出语音区域
|
||||
bztcq: 0 //不在停车区
|
||||
});
|
||||
const dd_selvalue = ref(0); //筛选值
|
||||
|
||||
|
||||
|
||||
|
||||
let locationPoint = null; //当前行政区划
|
||||
const arrAreaData = ref(null); //行政区划
|
||||
@ -305,6 +316,28 @@
|
||||
const showRegion = ref(false); //显示站点
|
||||
const showColor = "#1088FD";
|
||||
|
||||
function changeDDSelvalue(e) {
|
||||
const {
|
||||
detail: {
|
||||
value
|
||||
}
|
||||
} = e;
|
||||
dd_selvalue = value;
|
||||
showModelMessage("该功能暂未实现！");
|
||||
}
|
||||
|
||||
//调度查询类型
|
||||
function changeDDLX() {
|
||||
let lx = 1;
|
||||
let max = 7;
|
||||
if (showDD_LX.value == 1) {
|
||||
lx = 2;
|
||||
max = 120;
|
||||
}
|
||||
showDD_LX.value = lx;
|
||||
showDD_LX_Max.value = max;
|
||||
}
|
||||
|
||||
//加载后
|
||||
onMounted(() => {
|
||||
mapContext = map.getMap("mapRef", getCurrentInstance());
|
||||
@ -518,106 +551,7 @@
|
||||
loadMapBikeData(showBike.value, mapdata);
|
||||
})
|
||||
})
|
||||
/* const params = {
|
||||
zoneId
|
||||
}
|
||||
api.callOperateApi("ebikeRegion/getOperation", params, "get").then((res) => {
|
||||
uni.hideLoading();
|
||||
const {
|
||||
code,
|
||||
message,
|
||||
data
|
||||
} = res;
|
||||
if (code == 200) {
|
||||
const arrCircles = [];
|
||||
const arrPolygons = [];
|
||||
const arrRegionID = [];
|
||||
data.map((item, index) => {
|
||||
const {
|
||||
shapeType,
|
||||
regionId,
|
||||
radius,
|
||||
points
|
||||
} = item;
|
||||
arrRegionID.push(regionId);
|
||||
const scolor = "#578FD4";
|
||||
const fcolor = "#C0DAF5";
|
||||
if (shapeType == 1) {
|
||||
const {
|
||||
longitude: lng,
|
||||
latitude: lat
|
||||
} = points[0];
|
||||
arrCircles.push(map.addCirle(scolor, fcolor, lng, lat, radius));
|
||||
} else if (shapeType == 2) {
|
||||
const arrPoint = points.map(p => {
|
||||
return {
|
||||
longitude: p.longitude,
|
||||
latitude: p.latitude
|
||||
}
|
||||
})
|
||||
arrPolygons.push(map.addPolygon(scolor, fcolor, arrPoint));
|
||||
}
|
||||
|
||||
});
|
||||
let mapdata = {
|
||||
zoneId,
|
||||
arrCircles,
|
||||
arrPolygons,
|
||||
arrData: data
|
||||
};
|
||||
polygons.value = arrPolygons;
|
||||
circles.value = arrCircles;
|
||||
mapDataIndex = mapDataIndex == -1 ? mapData_opt.length : mapDataIndex;
|
||||
mapData_opt[mapDataIndex] = mapdata;
|
||||
|
||||
//站点
|
||||
if (arrRegionID.length == 0) return;
|
||||
map.getRegionData(arrRegionID, (res) => {
|
||||
const {
|
||||
arrData,
|
||||
arrCircles,
|
||||
arrPolygons
|
||||
} = res;
|
||||
mapdata = {
|
||||
...mapdata,
|
||||
regionData: {
|
||||
arrData,
|
||||
arrCircles,
|
||||
arrPolygons
|
||||
}
|
||||
};
|
||||
mapData_opt[mapDataIndex] = mapdata;
|
||||
loadMapRegionData(showRegion.value, mapdata);
|
||||
//车辆
|
||||
if (arrRegionID.length == 0) return;
|
||||
map.getBikeData(arrRegionID, (res) => {
|
||||
const {
|
||||
arrData,
|
||||
arrPoints,
|
||||
icnt,
|
||||
icnt_0,
|
||||
icnt_2
|
||||
} = res;
|
||||
mapdata = {
|
||||
...mapdata,
|
||||
bikeData: {
|
||||
arrData,
|
||||
arrPoints
|
||||
}
|
||||
};
|
||||
mapData_opt[mapDataIndex] = mapdata;
|
||||
q_cnt.value = icnt;
|
||||
q_cnt0.value = icnt_0;
|
||||
q_cnt2.value = icnt_2;
|
||||
arrMakers = arrData;
|
||||
loadMapBikeData(showBike.value, mapdata);
|
||||
})
|
||||
})
|
||||
} else {
|
||||
showModelMessage(message);
|
||||
}
|
||||
});
|
||||
*/
|
||||
}
|
||||
|
||||
//地图数据
|
||||
@ -769,23 +703,50 @@
|
||||
|
||||
|
||||
|
||||
//批量换电
|
||||
//换电
|
||||
function changeBatteries() {
|
||||
showModelMessage("该功能暂未实现！");
|
||||
uni.navigateTo({
|
||||
url: "/pages/devops/changebatteries/changebatteries"
|
||||
})
|
||||
}
|
||||
|
||||
//查询工单
|
||||
function queryOrders(lx, index) {
|
||||
selRight.value = index;
|
||||
console.log("11111111111111111111", lx, index)
|
||||
showModelMessage("该功能暂未实现！");
|
||||
selRight.value = {
|
||||
index,
|
||||
...arrRight.value[index]
|
||||
}
|
||||
switch (index) {
|
||||
case 0:
|
||||
showDD.value = false;
|
||||
showQC.value = true;
|
||||
showBikeInfo.value = false;
|
||||
break;
|
||||
case 1:
|
||||
showDD.value = true;
|
||||
showQC.value = false;
|
||||
showBikeInfo.value = false;
|
||||
break;
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
//关闭电量信息
|
||||
function colseQC_Info() {
|
||||
showQC.value = true;
|
||||
showQC_info.value = false;
|
||||
function colseBikeInfo() {
|
||||
const {
|
||||
lx
|
||||
} = selRight.value;
|
||||
switch (lx) {
|
||||
case "dd":
|
||||
showDD.value = true;
|
||||
break;
|
||||
case "hd":
|
||||
showQC.value = true;
|
||||
break;
|
||||
}
|
||||
showBikeInfo.value = false;
|
||||
dataBikeInfo.value=null;
|
||||
}
|
||||
|
||||
function markerTap(e) {
|
||||
@ -806,7 +767,7 @@
|
||||
longitude: elng,
|
||||
latitude: elat
|
||||
} = selMarker;
|
||||
if (bikeCode == dataQC.value.bikeCode) {
|
||||
if (bikeCode == dataBikeInfo.value.bikeCode) {
|
||||
return;
|
||||
}
|
||||
map.getLoalcation(mapContext, (res) => {
|
||||
@ -830,8 +791,9 @@
|
||||
icon
|
||||
} = getQCIcon(soc);
|
||||
showQC.value = false;
|
||||
showQC_info.value = true;
|
||||
dataQC.value = {
|
||||
showDD.value = false;
|
||||
showBikeInfo.value = true;
|
||||
dataBikeInfo.value = {
|
||||
...selMarker,
|
||||
bikeCode: bikeCode,
|
||||
arrTag: [{
|
||||
@ -845,7 +807,8 @@
|
||||
color,
|
||||
soc: soc,
|
||||
distance: distance,
|
||||
icon
|
||||
icon,
|
||||
rightlx: selRight.value.lx
|
||||
}
|
||||
mapContext.includePoints({
|
||||
points: arrPoint,
|
||||
@ -864,30 +827,17 @@
|
||||
}
|
||||
|
||||
function regionchange(e) {
|
||||
console.log("1111111111111111111111111", e)
|
||||
// "centerLocation": {
|
||||
// "latitude": 30.633169,
|
||||
// "longitude": 103.975094
|
||||
// },
|
||||
// "region": {
|
||||
// "southwest": {
|
||||
// "latitude": 30.628234,
|
||||
// "longitude": 103.971932
|
||||
// },
|
||||
// "northeast": {
|
||||
// "latitude": 30.638104,
|
||||
// "longitude": 103.978255
|
||||
// }
|
||||
// }
|
||||
const {
|
||||
type,causedBy,region
|
||||
type,
|
||||
causedBy,
|
||||
region
|
||||
} = e.detail;
|
||||
if (type != "end") return;
|
||||
|
||||
const minLat= region.southwest.latitude;
|
||||
const maxLat= region.northeast.latitude;
|
||||
const minLng=region.southwest.longitude;
|
||||
const maxLng= region.northeast.longitude;
|
||||
const minLat = region.southwest.latitude;
|
||||
const maxLat = region.northeast.latitude;
|
||||
const minLng = region.southwest.longitude;
|
||||
const maxLng = region.northeast.longitude;
|
||||
}
|
||||
</script>
|
||||
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user