站点修改
This commit is contained in:
parent
498d6bcbed
commit
f930438426
@ -1,71 +1,74 @@
|
||||
<template>
|
||||
<scroll-view class="divForm" :style="{height}" scroll-y show-scrollbar>
|
||||
<uni-forms ref="formRef" :model="formData" :label-width="80">
|
||||
<uni-forms-item label="站点名称" name="name" required :rules="[{'required': true,errorMessage: '请填写站点名称'}]">
|
||||
<uni-easyinput v-model="formData.name" />
|
||||
</uni-forms-item>
|
||||
<uni-forms-item label="站点类型:" name="zdlx" required :rules="[{'required': true,errorMessage: '请选择站点类型'}]">
|
||||
<uni-data-select v-model="formData.zdlx" :localdata="arrZDLX" />
|
||||
|
||||
</uni-forms-item>
|
||||
<uni-forms-item label="站点级别:" name="zdjb" required :rules="[{'required': true,errorMessage: '请选择站点级别'}]">
|
||||
<div class="divRow">
|
||||
<uni-data-checkbox v-model="formData.zdjb" :localdata="arrZDJB" />
|
||||
</div>
|
||||
</uni-forms-item>
|
||||
<!-- <uni-forms-item label="调度投放:" name="ddtf" required :rules="[{'required': true,errorMessage: '请选择调度投放'}]">
|
||||
<div class="divRow">
|
||||
<uni-data-checkbox v-model="formData.ddtf" :localdata="arrDDTF" />
|
||||
</div>
|
||||
|
||||
</uni-forms-item>
|
||||
<uni-forms-item label="用户端显示:" name="zdxs" required :rules="[{'required': true,errorMessage: '请选择用户端显示'}]">
|
||||
<div class="divRow">
|
||||
<uni-data-checkbox v-model="formData.zdxs" :localdata="arrZDXS" />
|
||||
<label style="margin-left: 10px;" @click="showTip('开启后在用户端小程序地图上不会显示站点,但不影响用户在该站点范围内还车')">
|
||||
<uni-icons type="info" size="20" color="#5892E3" /></label>
|
||||
</div>
|
||||
</uni-forms-item>-->
|
||||
<uni-forms-item label="可停车辆:" name="ktcl" required :rules="[{'required': true,errorMessage: '请填写可停车辆'}]">
|
||||
<div class="divRow">
|
||||
<uni-easyinput v-model="formData.ktcl" />
|
||||
<label>辆</label>
|
||||
</div>
|
||||
</uni-forms-item>
|
||||
<uni-forms-item label="最大可停:" name="zdkt" required :rules="[{'required': true,errorMessage: '请填写最大可停'}]">
|
||||
<div class="divRow">
|
||||
<uni-easyinput v-model="formData.zdkt" />
|
||||
<label>辆</label>
|
||||
</div>
|
||||
</uni-forms-item>
|
||||
<!-- <uni-forms-item label="还车半径:">
|
||||
<div class="divRow">
|
||||
<uni-easyinput v-model="formData.hcbj" />
|
||||
<label>米</label>
|
||||
</div>
|
||||
</uni-forms-item> -->
|
||||
<uni-forms-item label="站点图片:">
|
||||
<div>
|
||||
<div class="divFontColor" style="margin: 10px 0px;">最多3张</div>
|
||||
<uni-file-picker file-mediatype="image" mode="grid" file-extname="png,jpg" :limit="3"
|
||||
@select="uploadfile" @delete="delfile" />
|
||||
</div>
|
||||
</uni-forms-item>
|
||||
<uni-forms-item label="站点描述:">
|
||||
<uni-easyinput type="textarea" v-model="formData.zdms" />
|
||||
</uni-forms-item>
|
||||
<!-- <uni-forms-item label="站点标签:">
|
||||
<uni-data-checkbox mode="button" multiple v-model="formData.zdbq" :localdata="arrZDBQ" />
|
||||
</uni-forms-item> -->
|
||||
</uni-forms>
|
||||
|
||||
</scroll-view>
|
||||
<div class="divBottom">
|
||||
<div class="b-btn-white divtBtn" v-if="opentype=='edit'" @click="openMap">重新绘制</div>
|
||||
<div class="b-btn-white divtBtn" v-if="opentype=='add'" @click="openMap">返回绘制</div>
|
||||
<div class="b-btn-blue divtBtn" style="margin-left: 10px;" @click="SaveData">确认{{opentype=='add'?"新建":"保存"}}
|
||||
<div style="width: 100vw;">
|
||||
<scroll-view class="divForm" :style="{height}" scroll-y show-scrollbar>
|
||||
<uni-forms ref="formRef" :model="formData" :label-width="80">
|
||||
<uni-forms-item label="站点名称" name="name" required :rules="[{'required': true,errorMessage: '请填写站点名称'}]">
|
||||
<uni-easyinput v-model="formData.name" />
|
||||
</uni-forms-item>
|
||||
<uni-forms-item label="站点类型:" name="zdlx" required :rules="[{'required': true,errorMessage: '请选择站点类型'}]">
|
||||
<uni-data-select v-model="formData.zdlx" :localdata="arrZDLX" />
|
||||
|
||||
</uni-forms-item>
|
||||
<uni-forms-item label="站点级别:" name="zdjb" required :rules="[{'required': true,errorMessage: '请选择站点级别'}]">
|
||||
<div class="divRow">
|
||||
<uni-data-checkbox v-model="formData.zdjb" :localdata="arrZDJB" />
|
||||
</div>
|
||||
</uni-forms-item>
|
||||
<!-- <uni-forms-item label="调度投放:" name="ddtf" required :rules="[{'required': true,errorMessage: '请选择调度投放'}]">
|
||||
<div class="divRow">
|
||||
<uni-data-checkbox v-model="formData.ddtf" :localdata="arrDDTF" />
|
||||
</div>
|
||||
|
||||
</uni-forms-item>
|
||||
<uni-forms-item label="用户端显示:" name="zdxs" required :rules="[{'required': true,errorMessage: '请选择用户端显示'}]">
|
||||
<div class="divRow">
|
||||
<uni-data-checkbox v-model="formData.zdxs" :localdata="arrZDXS" />
|
||||
<label style="margin-left: 10px;" @click="showTip('开启后在用户端小程序地图上不会显示站点,但不影响用户在该站点范围内还车')">
|
||||
<uni-icons type="info" size="20" color="#5892E3" /></label>
|
||||
</div>
|
||||
</uni-forms-item>-->
|
||||
<uni-forms-item label="可停车辆:" name="ktcl" required :rules="[{'required': true,errorMessage: '请填写可停车辆'}]">
|
||||
<div class="divRow">
|
||||
<uni-easyinput v-model="formData.ktcl" />
|
||||
<label>辆</label>
|
||||
</div>
|
||||
</uni-forms-item>
|
||||
<uni-forms-item label="最大可停:" name="zdkt" required :rules="[{'required': true,errorMessage: '请填写最大可停'}]">
|
||||
<div class="divRow">
|
||||
<uni-easyinput v-model="formData.zdkt" />
|
||||
<label>辆</label>
|
||||
</div>
|
||||
</uni-forms-item>
|
||||
<!-- <uni-forms-item label="还车半径:">
|
||||
<div class="divRow">
|
||||
<uni-easyinput v-model="formData.hcbj" />
|
||||
<label>米</label>
|
||||
</div>
|
||||
</uni-forms-item> -->
|
||||
<uni-forms-item label="站点图片:">
|
||||
<div>
|
||||
<div class="divFontColor" style="margin: 10px 0px;">最多3张</div>
|
||||
<uni-file-picker file-mediatype="image" mode="grid" file-extname="png,jpg" :limit="3" :value="filevalue"
|
||||
@select="uploadfile" @delete="delfile" />
|
||||
</div>
|
||||
</uni-forms-item>
|
||||
<uni-forms-item label="站点描述:">
|
||||
<uni-easyinput type="textarea" v-model="formData.zdms" />
|
||||
</uni-forms-item>
|
||||
<!-- <uni-forms-item label="站点标签:">
|
||||
<uni-data-checkbox mode="button" multiple v-model="formData.zdbq" :localdata="arrZDBQ" />
|
||||
</uni-forms-item> -->
|
||||
</uni-forms>
|
||||
|
||||
</scroll-view>
|
||||
<div class="divBottom">
|
||||
<div class="b-btn-white divtBtn" v-if="opentype=='edit'" @click="openMap">重新绘制</div>
|
||||
<div class="b-btn-white divtBtn" v-if="opentype=='add'" @click="openMap">返回绘制</div>
|
||||
<div class="b-btn-blue divtBtn" style="margin-left: 10px;" @click="SaveData">确认{{opentype=='add'?"新建":"保存"}}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
@ -85,6 +88,8 @@
|
||||
callOperateApi,
|
||||
fileUploadApi
|
||||
} from "../../../utils/api";
|
||||
import config from "../../../utils/config";
|
||||
import { findIndex,lastIndexOf } from "lodash";
|
||||
|
||||
var qqmapsdk = new QQMapWX({
|
||||
key: map.sdkKey
|
||||
@ -129,9 +134,10 @@
|
||||
let radius = null;
|
||||
let regionid = null;
|
||||
let arrFile = [];
|
||||
const filevalue=ref([]);
|
||||
const formData = ref({
|
||||
id:"",
|
||||
name: "站点名称",
|
||||
name: "",
|
||||
address: "",
|
||||
zdlx: 1,
|
||||
zdjb: 1,
|
||||
@ -152,9 +158,7 @@
|
||||
}
|
||||
if (type == "edit") {
|
||||
const id = formData.value.id;
|
||||
//const points = JSON.stringify(arrPoint);
|
||||
const points =
|
||||
'[{"latitude":30.571833529690217,"longitude":104.06370857334673},{"latitude":30.571476489584985,"longitude":104.06382896516845},{"latitude":30.571211588676054,"longitude":104.0681363214153},{"latitude":30.571845047283958,"longitude":104.06805606033697},{"latitude":30.571833529690217,"longitude":104.06370857334673}]';
|
||||
const points = JSON.stringify(arrPoint);
|
||||
uni.navigateTo({
|
||||
url: `/pages/map/map-bikesite?type=edit&id=${id}&points=${points}&k=${Date.now()}`
|
||||
})
|
||||
@ -172,7 +176,7 @@
|
||||
zdms
|
||||
} = res;
|
||||
const {
|
||||
address
|
||||
id,address
|
||||
} = formData.value;
|
||||
let shapeType = 2;
|
||||
let points = null;
|
||||
@ -188,6 +192,7 @@
|
||||
points = arrPoint;
|
||||
}
|
||||
const params = {
|
||||
siteRegionId:id,
|
||||
operationRegionId: regionid,
|
||||
siteName: name,
|
||||
siteAdress: address,
|
||||
@ -203,8 +208,11 @@
|
||||
imageIds:arrFile,
|
||||
describe:zdms
|
||||
}
|
||||
|
||||
callOperateApi("ebikeRegion/saveSite", params, "post").then(res => {
|
||||
let url="ebikeRegion/saveSite"
|
||||
if(opentype.value=="edit"){
|
||||
url="ebikeRegion/updateSite";
|
||||
}
|
||||
callOperateApi(url, params, "post").then(res => {
|
||||
console.log("1111111111111111111", "/ebikeRegion/saveSite", params, res);
|
||||
const {
|
||||
code,
|
||||
@ -217,7 +225,7 @@
|
||||
return;
|
||||
} else {
|
||||
showModelMessage("保存成功!");
|
||||
uni.navigateTo({
|
||||
uni.reLaunch({
|
||||
url: "/pages/devops/bikesite/bikesite-list"
|
||||
})
|
||||
}
|
||||
@ -314,15 +322,32 @@
|
||||
console.log("ebikeRegion/siteInfo",message);
|
||||
}
|
||||
const{siteRegionId:id,operationRegionId,siteName,siteAdress,siteType,siteLevel,siteLng,siteLat,shapeType,radius:r,points
|
||||
,allowedParkingNum,allowedParkingMax,describe,images}=data;
|
||||
,allowedParkingNum,allowedParkingMax,describe,images=[]}=data;
|
||||
regionid=operationRegionId;
|
||||
radius=r;
|
||||
if(shapeType=="2"){
|
||||
arrPoint=points;
|
||||
}
|
||||
else{
|
||||
arrPoint=[{longitude:siteLng,latitude:siteLat}]
|
||||
const arrFileData=[];
|
||||
images.map(item=>{
|
||||
const{imageId,imageBucket,imageName}=item;
|
||||
const extname=imageName.substring(lastIndexOf(imageName,".")+1);
|
||||
const obj={
|
||||
url:`${config.filePath}/${imageBucket}/${imageName}`,
|
||||
name:imageName,
|
||||
extname
|
||||
}
|
||||
arrFileData.push(obj);
|
||||
arrFile.push(imageId);
|
||||
});
|
||||
if(arrPoint.length==0){
|
||||
if(shapeType=="2"){
|
||||
arrPoint=points;
|
||||
}
|
||||
else{
|
||||
arrPoint=[{longitude:siteLng,latitude:siteLat}]
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
filevalue.value=arrFileData;
|
||||
formData.value={
|
||||
id,
|
||||
name:siteName,
|
||||
@ -367,7 +392,9 @@
|
||||
getScreenHeightNoTabBar(res => {
|
||||
height.value = (res - 60) + "px";
|
||||
});
|
||||
arrPoint=[];
|
||||
if (points) {
|
||||
|
||||
arrPoint = JSON.parse(points);
|
||||
radius = r;
|
||||
const {
|
||||
@ -398,7 +425,7 @@
|
||||
if(arrZDJB.value.length==0){
|
||||
getZDJB();
|
||||
}
|
||||
if(id&&!points){
|
||||
if(id){
|
||||
getSiteInfo(id);
|
||||
}
|
||||
});
|
||||
|
||||
@ -1,28 +1,29 @@
|
||||
<template>
|
||||
<div style="background-color:#F2F2F2;height: 100vh;">
|
||||
<div style="display:flex;padding: 10px;">
|
||||
<uni-easyinput v-model="siteName" placeholder="请输入站点名称" suffixIcon="search" @iconClick="search"/>
|
||||
<label style="margin-left: 10px;" @click="openMap">
|
||||
<uni-icons custom-prefix="iconfont" type="icon-ebikeditu2" color="#1b1a1a" size="40" />
|
||||
</label>
|
||||
</div>
|
||||
|
||||
<div class="divSearch">
|
||||
<div v-for="(item,index) in arrSearch " :key="index"
|
||||
:class="'divSearchTab'+(searchIndex==index?' divSearchTabSel':'')" @click="changerOrder(index)">
|
||||
<label>{{item}}</label>
|
||||
<div class="divSearchRow">
|
||||
<div class="divSearchCel">
|
||||
<uni-icons custom-prefix="iconfont" type="icon-ebikesanjiaoxing"
|
||||
:color="(searchIndex==index&&searchType=='up')?iconColorSel:iconColor" size="8" />
|
||||
</div>
|
||||
<div class="divSearchCel">
|
||||
<uni-icons custom-prefix="iconfont" type="icon-ebikesanjiaoxing-copy"
|
||||
:color="(searchIndex==index&&searchType=='down')?iconColorSel:iconColor" size="8" />
|
||||
<z-paging ref="paging" v-model="arrData" default-page-no="1" :default-page-size="pageNum" auto-show-back-to-top @query="query">
|
||||
<template #top>
|
||||
<div style="display:flex;padding: 10px;">
|
||||
<uni-easyinput v-model="siteName" placeholder="请输入站点名称" suffixIcon="search" @iconClick="search" />
|
||||
<label style="margin-left: 10px;" @click="openMap">
|
||||
<uni-icons custom-prefix="iconfont" type="icon-ebikeditu2" color="#1b1a1a" size="40" />
|
||||
</label>
|
||||
</div>
|
||||
<div class="divSearch">
|
||||
<div v-for="(item,index) in arrSearch " :key="index"
|
||||
:class="'divSearchTab'+(searchIndex==index?' divSearchTabSel':'')" @click="changerOrder(index)">
|
||||
<label>{{item}}</label>
|
||||
<div class="divSearchRow">
|
||||
<div class="divSearchCel">
|
||||
<uni-icons custom-prefix="iconfont" type="icon-ebikesanjiaoxing"
|
||||
:color="(searchIndex==index&&searchType=='up')?iconColorSel:iconColor" size="8" />
|
||||
</div>
|
||||
<div class="divSearchCel">
|
||||
<uni-icons custom-prefix="iconfont" type="icon-ebikesanjiaoxing-copy"
|
||||
:color="(searchIndex==index&&searchType=='down')?iconColorSel:iconColor" size="8" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<div>
|
||||
<uni-card v-for="(item,index) in arrData" :key="'c'+index">
|
||||
<div style="display: flex;align-items: center;">
|
||||
@ -72,16 +73,16 @@
|
||||
暂无数据
|
||||
</div>
|
||||
</div>
|
||||
<div style="position:absolute;bottom:30px;right: 15px;" @click="addSite">
|
||||
<uni-icons type="plus" color="#7a6d6d" size="40" />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</z-paging>
|
||||
<div style="position:fixed;bottom:30px;right: 15px;z-index: 100;" @click="addSite">
|
||||
<uni-icons type="plus" color="#7a6d6d" size="40" />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import {
|
||||
ref,
|
||||
ref,onMounted,
|
||||
onUnmounted
|
||||
} from 'vue';
|
||||
import {
|
||||
@ -96,13 +97,16 @@
|
||||
import {
|
||||
callOperateApi
|
||||
} from '../../../utils/api';
|
||||
import { cloneDeep } from 'lodash';
|
||||
import {
|
||||
cloneDeep
|
||||
} from 'lodash';
|
||||
|
||||
const arrSearch = ["实时车辆", "借车订单量", "还车订单量"]
|
||||
const iconColor = " #BDBDBD";
|
||||
const iconColorSel = "#000";
|
||||
const searchIndex = ref(null);
|
||||
const searchType = ref("");
|
||||
const paging = ref(null);
|
||||
//数据
|
||||
const arrData = ref([]);
|
||||
|
||||
@ -116,14 +120,70 @@
|
||||
}];
|
||||
const selAreaStore = useSelarea();
|
||||
let zoneId = null;
|
||||
let pageNum = 1;
|
||||
let pageSize = 10;
|
||||
let selData=null;
|
||||
let loadType="";
|
||||
let selData = null;
|
||||
let loadType = "";
|
||||
let siteName = ref(""); //查询条件
|
||||
let pageNum=5;
|
||||
|
||||
function query(pageNo, pageSize) {
|
||||
const params = {
|
||||
zoneId,
|
||||
pageNum: pageNo.toString(),
|
||||
pageSize:pageSize.toString(),
|
||||
siteName: siteName.value
|
||||
}
|
||||
callOperateApi("ebikeRegion/pageSite", params, "get").then(res => {
|
||||
const {
|
||||
code,
|
||||
data,
|
||||
message
|
||||
} = res;
|
||||
if (code != 200) {
|
||||
showModelMessage("加载失败!");
|
||||
console.log("ebikeRegion/pageSite错误", message);
|
||||
paging.value.complete(false);
|
||||
return;
|
||||
}
|
||||
const {
|
||||
records
|
||||
} = data;
|
||||
const arrNewData = [];
|
||||
records.map((item, index) => {
|
||||
const {
|
||||
siteRegionId,
|
||||
siteName,
|
||||
createdTime,
|
||||
allowedParkingNum,
|
||||
siteAdress,
|
||||
levelName,
|
||||
siteTypeName
|
||||
} = item;
|
||||
const sindex = (pageNo - 1) * pageSize + index;
|
||||
|
||||
const newdata = {
|
||||
id: siteRegionId,
|
||||
zdlx: (siteTypeName && siteTypeName.length > 0 )? siteTypeName.substring(0, 1) :
|
||||
"", //站点类型
|
||||
zdmc: siteName, //站点名称
|
||||
zdjb: levelName, //站点级别
|
||||
cjsj: createdTime, //创建时间
|
||||
clsl1: 0, //车辆数量
|
||||
clsl2: allowedParkingNum, //限制车辆数量
|
||||
zcsl: 0, //租车数量
|
||||
hcsl: 0, //还车数量
|
||||
cjdd: siteAdress, //创建地点
|
||||
cjr: "创建人", //创建人
|
||||
pageNum,
|
||||
index: sindex
|
||||
}
|
||||
arrNewData[index] = newdata;
|
||||
});
|
||||
paging.value.complete(arrNewData);
|
||||
})
|
||||
}
|
||||
|
||||
function search(e) {
|
||||
console.log("111111111111111","search", e,siteName.value);
|
||||
paging.value.reload();
|
||||
}
|
||||
|
||||
//排序
|
||||
@ -162,17 +222,27 @@
|
||||
});
|
||||
}
|
||||
|
||||
function delSite(data) {
|
||||
console.log("0000000000000",data);
|
||||
const{id,pageNum:pn,index,zdmc}=data;
|
||||
const params={
|
||||
ids:[id]
|
||||
function delSite(obj) {
|
||||
const {
|
||||
id,
|
||||
pageNum: pn,
|
||||
index,
|
||||
zdmc
|
||||
} = obj;
|
||||
const params = {
|
||||
ids: [id]
|
||||
}
|
||||
|
||||
showModelMessage(`确认删除站点:${zdmc}?`,null,true).then((res)=>{
|
||||
const{cancel,confirm}=res;
|
||||
if(cancel) return;
|
||||
callOperateApi("ebikeRegion/delSite",params,"post").then(res=>{
|
||||
|
||||
showModelMessage(`确认删除站点:${zdmc}?`, null, true).then((res) => {
|
||||
const {
|
||||
cancel,
|
||||
confirm
|
||||
} = res;
|
||||
if (cancel) return;
|
||||
uni.showLoading({
|
||||
title: '加载中'
|
||||
})
|
||||
callOperateApi("ebikeRegion/delSite", params, "post").then(res => {
|
||||
console.log("11111111111111111111111", "ebikeRegion/delSite", res);
|
||||
const {
|
||||
code,
|
||||
@ -180,84 +250,27 @@
|
||||
message
|
||||
} = res;
|
||||
if (code != 200) {
|
||||
uni.hideLoading();
|
||||
showModelMessage("删除失败!");
|
||||
console.log("ebikeRegion/delSite错误", message)
|
||||
return;
|
||||
}
|
||||
selData=data;
|
||||
loadType="del";
|
||||
loadData(pn,()=>{
|
||||
showModelMessage("删除成功!");
|
||||
});
|
||||
// selData = obj;
|
||||
// loadType = "del";
|
||||
uni.hideLoading();
|
||||
showModelMessage("删除成功!");
|
||||
paging.value.reload();
|
||||
})
|
||||
})
|
||||
|
||||
|
||||
}
|
||||
|
||||
function loadData(pn,callbak) {
|
||||
const params = {
|
||||
zoneId,
|
||||
pageNum:pn,
|
||||
pageSize,
|
||||
siteName:siteName.value
|
||||
}
|
||||
callOperateApi("ebikeRegion/pageSite", params, "get").then(res => {
|
||||
console.log("11111111111111111111111", "ebikeRegion/pageSite", res,loadType);
|
||||
const {
|
||||
code,
|
||||
data,
|
||||
message
|
||||
} = res;
|
||||
if (code != 200) {
|
||||
console.log("ebikeRegion/pageSite错误", message)
|
||||
return;
|
||||
}
|
||||
const {
|
||||
records
|
||||
} = data;
|
||||
const arrNewData=cloneDeep(arrData.value);
|
||||
if(loadType=="del"){
|
||||
const{index}=selData;
|
||||
if(pageNum>pn){
|
||||
arrNewData.splice(index,arrNewData.length-index);
|
||||
}
|
||||
}
|
||||
records.map((item,index) => {
|
||||
const {
|
||||
siteRegionId,
|
||||
siteName,
|
||||
createdTime,
|
||||
allowedParkingNum,
|
||||
siteAdress,levelName
|
||||
} = item;
|
||||
const sindex=(pn-1)*pageSize+index;
|
||||
|
||||
const newdata = {
|
||||
id: siteRegionId,
|
||||
zdlx: "停", //站点类型
|
||||
zdmc: siteName, //站点名称
|
||||
zdjb: levelName, //站点级别
|
||||
cjsj: createdTime, //创建时间
|
||||
clsl1: 0, //车辆数量
|
||||
clsl2: allowedParkingNum, //限制车辆数量
|
||||
zcsl: 0, //租车数量
|
||||
hcsl: 0, //还车数量
|
||||
cjdd: siteAdress, //创建地点
|
||||
cjr: "创建人", //创建人
|
||||
pageNum,
|
||||
index:sindex
|
||||
}
|
||||
console.log("666666666666666666",newdata);
|
||||
arrNewData[sindex]=newdata;
|
||||
});
|
||||
arrData.value=arrNewData;
|
||||
if(callbak) callbak();
|
||||
})
|
||||
}
|
||||
|
||||
|
||||
onShow(() => {
|
||||
zoneId = selAreaStore.value;
|
||||
loadData(pageNum);
|
||||
if (paging&&paging.value) paging.value.refresh();
|
||||
// loadData(pageNum);
|
||||
});
|
||||
|
||||
onUnmounted(() => {
|
||||
|
||||
@ -32,5 +32,14 @@
|
||||
background: white;
|
||||
width: 100vw;
|
||||
padding: 15px;
|
||||
font-size: 14px;
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
.divSiteInfo {
|
||||
z-index: 100;
|
||||
position: absolute;
|
||||
bottom: 0px;
|
||||
background: white;
|
||||
width: 100vw;
|
||||
padding: 10px;
|
||||
}
|
||||
@ -2,7 +2,7 @@
|
||||
<div :style="{width:'100vw',height}">
|
||||
<map id="mapRef" ref="mapRef" :style="{width:'100vw',height}" show-location :longitude="mapcenter.longitude"
|
||||
:latitude="mapcenter.latitude" :markers="markers" :polygons="polygons" :circles="circles"
|
||||
:polyline="polyline" :scale="scale" @tap="mapTap" />
|
||||
:polyline="polyline" :scale="scale" @tap="mapTap" @poitap="mapTap" />
|
||||
<div class="divNav">
|
||||
|
||||
</div>
|
||||
@ -17,7 +17,7 @@
|
||||
<div>刷新</div>
|
||||
</div>
|
||||
<div class="divBtnTitle" style="padding-bottom: 10px;"
|
||||
@click="()=>{showRegion=!showRegion;showMapSite(!showRegion)}">
|
||||
@click="()=>{showRegion=!showRegion;showMapSite(showRegion)}">
|
||||
<uni-icons custom-prefix="iconfont" type="icon-ebikeP" :color="!showRegion?iconcolor:showColor"
|
||||
:size="iconsize" />
|
||||
<div :style="{color:!showRegion?iconcolor:showColor}">站点</div>
|
||||
@ -25,13 +25,13 @@
|
||||
</div>
|
||||
</div>
|
||||
<div v-if="showDraw" class="divBottom">
|
||||
<div style="display: flex;">
|
||||
<!-- <div style="display: flex;">
|
||||
<label>选择形状:</label>
|
||||
<div style="margin-top: -5px;">
|
||||
<uni-data-checkbox v-model="selDraw" :localdata="drawType"
|
||||
@change="changDrawType"></uni-data-checkbox>
|
||||
</div>
|
||||
</div>
|
||||
</div> -->
|
||||
<div v-if="selDraw=='1'" style="line-height: 35px;">
|
||||
<label class="lbWorn">请点击地图绘制您想绘制的区域</label>
|
||||
<div>
|
||||
@ -56,7 +56,37 @@
|
||||
<div class="b-btn-blue" style="width:100%;" @click="completeDraw">完成绘制</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<div>站点信息</div>
|
||||
<div>{{siteInfo.name}}</div>
|
||||
<div>{{siteInfo.address}}</div>
|
||||
<div class="divSiteInfo">
|
||||
<div>
|
||||
<div>
|
||||
{{siteInfo.zdrl}}
|
||||
</div>
|
||||
<div>
|
||||
站点容量
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<div>
|
||||
{{siteInfo.sssl}}
|
||||
</div>
|
||||
<div>
|
||||
实时数量
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<div>
|
||||
{{siteInfo.zdrl-siteInfo.sssl}}
|
||||
</div>
|
||||
<div>
|
||||
需调度
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
@ -121,9 +151,19 @@
|
||||
const drawId = 10000000;
|
||||
const drawColor = "#e58b04";
|
||||
const drawFillColor = "#e58b041a";
|
||||
const editColor = "#e41309";
|
||||
const editFillColor = "#e4130930";
|
||||
const height = ref("100vh");
|
||||
const opentype = ref("add"); //打开类型
|
||||
let editId = ""; //编辑ID
|
||||
|
||||
const siteInfo=ref({
|
||||
id:"",
|
||||
name: "",
|
||||
address: "",
|
||||
zdrl:0,
|
||||
sssl:0
|
||||
})
|
||||
|
||||
//缩放
|
||||
function onZoom(type) {
|
||||
@ -176,7 +216,6 @@
|
||||
}
|
||||
|
||||
function mapTap(e) {
|
||||
console.log("9999999999999999","mapTap",e);
|
||||
if (!showDraw.value) return;
|
||||
const {
|
||||
detail: {
|
||||
@ -199,18 +238,7 @@
|
||||
break;
|
||||
}
|
||||
}
|
||||
/* if(!inside){
|
||||
for(i=0;i<arrCirclesData.length;i++){
|
||||
const data=arrCirclesData[i];
|
||||
const {latitude:lat,
|
||||
longitude:lng,radius:r}=data;
|
||||
inside=map.checkPointInPolygon(longitude,latitude,{lng,lat},r);
|
||||
if(inside){
|
||||
selArea=data;
|
||||
break;
|
||||
}
|
||||
}
|
||||
} */
|
||||
|
||||
if(!inside){
|
||||
showModelMessage("请绘制在运营区域内!")
|
||||
return;
|
||||
@ -343,8 +371,8 @@
|
||||
console.log("88888888888888888888888",arrPoint);
|
||||
const points = JSON.stringify(arrPoint);
|
||||
const {operationRegionId}=selArea;
|
||||
uni.navigateTo({
|
||||
url: `/pages/devops/bikesite/bikesite-info?points=${points}&radius=${radius.value}&&type=${opentype.value}&®ionid=${operationRegionId}`
|
||||
uni.redirectTo({
|
||||
url: `/pages/devops/bikesite/bikesite-info?id=${editId}&points=${points}&radius=${radius.value}&&type=${opentype.value}&®ionid=${operationRegionId}`
|
||||
})
|
||||
}
|
||||
|
||||
@ -355,7 +383,6 @@
|
||||
|
||||
function loadOperation(callback) {
|
||||
console.log("666666666666666666666", "行政区划", zoneId);
|
||||
|
||||
map.getOperation(zoneId, (res) => {
|
||||
if (!res) {
|
||||
if (callback) callback();
|
||||
@ -373,7 +400,6 @@
|
||||
if (callback) callback();
|
||||
return;
|
||||
}
|
||||
console.log("00000000000000000000000areaData",areaData);
|
||||
areaData = {
|
||||
arrCircles,
|
||||
arrPolygons,
|
||||
@ -412,9 +438,9 @@
|
||||
points
|
||||
} = item;
|
||||
const {
|
||||
lng,
|
||||
lat
|
||||
} = map.getPolygonCenter(points)
|
||||
latitude: lat,
|
||||
longitude: lng
|
||||
} = points[0];
|
||||
const len = arrMarker.length;
|
||||
arrMarker.push(map.addMarker(len + index, lng, lat, "bikesite.png"));
|
||||
});
|
||||
@ -460,9 +486,8 @@
|
||||
if (showSite) {
|
||||
if (editId) { //编辑
|
||||
const obj = {
|
||||
regionid: editId
|
||||
siteRegionId: editId
|
||||
};
|
||||
console.log("9999999999999999999999arrCirclesData, arrPolygonsData", arrCirclesData, arrPolygonsData);
|
||||
let index = findIndex(arrCirclesData, obj);
|
||||
|
||||
if (index > -1) {
|
||||
@ -472,7 +497,7 @@
|
||||
} = arrCircles_region[index];
|
||||
arrCirclesData.splice(index, 1);
|
||||
arrCircles_region.splice(index, 1);
|
||||
arrEditC.push(map.addCirle(drawColor, drawFillColor, longitude, latitude, radius.value));
|
||||
arrEditC.push(map.addCirle(editColor, editFillColor, longitude, latitude, radius.value));
|
||||
} else {
|
||||
index = findIndex(arrPolygonsData, obj);
|
||||
if (index > -1) {
|
||||
@ -481,12 +506,13 @@
|
||||
} = arrPolygons_region[index];
|
||||
arrPolygonsData.splice(index, 1);
|
||||
arrPolygons_region.splice(index, 1);
|
||||
arrEditP.push(map.addPolygon(drawColor, drawFillColor, arrPoint))
|
||||
arrEditP.push(map.addPolygon(editColor, editFillColor, arrPoint))
|
||||
}
|
||||
}
|
||||
}
|
||||
polygons.value = [...arrPolygons, ...arrPolygons_region, ...arrEditP];
|
||||
circles.value = [...arrCircles, ...arrCircles_region, ...arrEditC];
|
||||
drawPoint=[];
|
||||
} else {
|
||||
polygons.value = arrPolygons;
|
||||
circles.value = arrCircles;
|
||||
@ -560,8 +586,7 @@
|
||||
uni.setNavigationBarTitle({
|
||||
title
|
||||
});
|
||||
|
||||
|
||||
//加载数据
|
||||
loadData();
|
||||
});
|
||||
</script>
|
||||
|
||||
@ -316,7 +316,7 @@ export function getRegionData(arrRegionID, callback) {
|
||||
arrCircles.push(addCirle(scolor, fcolor, lng, lat, radius));
|
||||
arrCirclesData.push(data);
|
||||
} else if (shapeType == 2) {
|
||||
if(!points) return;
|
||||
if (!points) return;
|
||||
const arrPoint = points.map(p => {
|
||||
return {
|
||||
longitude: p.longitude,
|
||||
@ -365,6 +365,7 @@ export const getBikeData = (arrRegionID, callback) => {
|
||||
} else {
|
||||
if (data.length > 0) arrData.push(...data);
|
||||
data.map(item => {
|
||||
item={...item,soc:item.soc||0}
|
||||
const {
|
||||
bikeId,
|
||||
longitude,
|
||||
@ -396,7 +397,7 @@ export const getBikeData = (arrRegionID, callback) => {
|
||||
|
||||
//电量车辆点
|
||||
export function addMarker_Q(id, data) {
|
||||
const {
|
||||
let {
|
||||
longitude,
|
||||
latitude,
|
||||
soc
|
||||
@ -480,76 +481,6 @@ export function direction({
|
||||
qqmapsdk.direction(options);
|
||||
}
|
||||
|
||||
// 几何中心计算算法(适用于任意多边形)
|
||||
export function getPolygonCenter(points) {
|
||||
let X = 0,
|
||||
Y = 0,
|
||||
Z = 0;
|
||||
const pointCount = points.length;
|
||||
|
||||
points.forEach(point => {
|
||||
const lat = point.latitude * Math.PI / 180;
|
||||
const lng = point.longitude * Math.PI / 180;
|
||||
const x = Math.cos(lat) * Math.cos(lng);
|
||||
const y = Math.cos(lat) * Math.sin(lng);
|
||||
const z = Math.sin(lat);
|
||||
|
||||
X += x;
|
||||
Y += y;
|
||||
Z += z;
|
||||
});
|
||||
|
||||
X /= pointCount;
|
||||
Y /= pointCount;
|
||||
Z /= pointCount;
|
||||
|
||||
const lng = Math.atan2(Y, X);
|
||||
const lat = Math.atan2(Z, Math.sqrt(X * X + Y * Y));
|
||||
|
||||
return {
|
||||
lat: lat * 180 / Math.PI,
|
||||
lng: lng * 180 / Math.PI
|
||||
};
|
||||
}
|
||||
|
||||
|
||||
// 工具函数:将像素坐标转换为经纬度
|
||||
function pixelToLatLng(map, x, y) {
|
||||
// return new Promise((resolve) => {
|
||||
// map.getCenterLocation({
|
||||
// success: (res) => {
|
||||
// const center = { lat: res.latitude, lng: res.longitude };
|
||||
// const scale = map.scale;
|
||||
// const pixelWidth = 256 * Math.pow(2, (18 - scale)); // 缩放级别对应的像素宽度
|
||||
// const latOffset = (y - map.height / 2) * (180 / (256 * Math.pow(2, scale))) / 3600;
|
||||
// const lngOffset = (x - map.width / 2) * (180 / (256 * Math.pow(2, scale))) / 3600;
|
||||
// resolve({
|
||||
// latitude: center.lat + latOffset,
|
||||
// longitude: center.lng + lngOffset
|
||||
// });
|
||||
// }
|
||||
// });
|
||||
// });
|
||||
}
|
||||
|
||||
// 计算可视区域四个角点
|
||||
export function calculateVisibleBounds(map) {
|
||||
map.getScale((res) => {
|
||||
console.log("00000000000000000000", res)
|
||||
})
|
||||
|
||||
// const topLeft = await pixelToLatLng(map, 0, 0);
|
||||
// const topRight = await pixelToLatLng(map, width, 0);
|
||||
// const bottomLeft = await pixelToLatLng(map, 0, height);
|
||||
// const bottomRight = await pixelToLatLng(map, width, height);
|
||||
|
||||
// return {
|
||||
// minLat: Math.min(topLeft.latitude, bottomLeft.latitude),
|
||||
// maxLat: Math.max(topRight.latitude, bottomRight.latitude),
|
||||
// minLng: Math.min(topLeft.longitude, topRight.longitude),
|
||||
// maxLng: Math.max(bottomLeft.longitude, bottomRight.longitude)
|
||||
// };
|
||||
}
|
||||
|
||||
// 判断点是否在多边形内(射线法)
|
||||
export function checkPointInPolygon(longitude, latitude, polygon) {
|
||||
@ -572,7 +503,6 @@ export function checkPointInPolygon(longitude, latitude, polygon) {
|
||||
|
||||
// 判断点(x,y)是否在圆心(cx,cy)半径r的圆内
|
||||
export function isPointInCircle(longitude, latitude, center, radius) {
|
||||
debugger;
|
||||
const dx = longitude - center.lng; // 经度差
|
||||
const dy = latitude - center.lat; // 纬度差
|
||||
const distance = Math.sqrt(dx * dx + dy * dy);
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user