caoliancun/MP_XOIL_company_new
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

星油企业版

Browse Source
This commit is contained in:
caolc
2022-08-08 09:17:43 +08:00
commit e3238cb907
517 changed files with 80472 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

306
BagStation/pages/overviewMap/components/addressSelector.vue Normal file
View File

@@ -0,0 +1,306 @@
<template>
<view :style="{top:(styles.top + styles.height + 10 )+'px'}" class="header">
<view class="sele_car">
<view @click="backFn()" class="flex ac">
<uni-icons type="back" size="30"></uni-icons>
<!-- <uni-icond type="back" size="30"></uni-icond> -->
</view>
<view class=" flex sele_car_right">
<view @click="chooseLocation('start')" class=" Padding flex ac flexone">
<view class="yuan" />
<view class="flexone margin size">{{Route.start.title}}</view>
</view>
</view>
</view>
<view class="filter">
<view v-for="(item,index) in menuList" :key='index' class="filter_item">
<view @click="seleFilter(item,index)"> {{ item.value?item.value.split('/')[0]:item.title}} </view>
<view :style="{maxHeight:item.SublistOpen?'200rpx':'0rpx'}" class="conditions">
<view :style="{color:item.value?item.value.split('/')[0] == items.lable?'#666666':'#bbbbbb':'#bbbbbb'}" @click="filterItemSele(index,indexs)" v-for="(items,indexs) in item.Sublist" :key='indexs' style="margin-bottom: 10rpx; font-size: 25rpx;">{{items.lable}}</view>
</view>
</view>
</view>
</view>
</template>
<script>
import oilSiteApi from '@/api/oil-site.js'
export default {
props: {
Route: {
type: Object,
default: () => {
return {}
}
},
polyline: {
type: Array,
default: () => []
}
},
watch: {
polyline: function(n, o) {
if (n.length !== 0) {
this.isShow.conditions = true
} else {
this.isShow.conditions = false
}
}
},
data() {
return {
styles: {},
isShow: {
conditions: false
},
header:null,
menuList: [
// {
// title: '距离',
// value: '5KM/5',
// field: 'juLi',
// SublistOpen: false,
// Sublist: [{
// lable: '5KM',
// value: '5'
// }, {
// lable: '20KM',
// value: '20'
// }, {
// lable: '30KM',
// value: '30'
// },{
// lable: '50KM',
// value: '50'
// }]
// },
{
title: '全类型',
value: '全类型/2',
field: 'highSpeed',
SublistOpen: false,
Sublist: [
{
lable: '全类型',
value: '2'
},
{
lable: '高速',
value: '1'
}, {
lable: '非高速',
value: '0'
}
]
}
]
}
},
mounted() {
this.styles = uni.getMenuButtonBoundingClientRect();
console.log(this.styles);
const query = uni.createSelectorQuery().in(this);
query.select('.header').boundingClientRect(data => {
console.log("得到布局位置信息" + JSON.stringify(data));
this.header = data
console.log("节点离页面顶部的距离为" + data.top);
}).exec();
},
created() {
this.getConditionMenu();
},
methods: {
getElement(){
return this.styles.top + this.styles.height + 10 + this.header.height
},
filterItemSele(index,indexs){
this.menuList[index].value = `${this.menuList[index].Sublist[indexs].lable}/${this.menuList[index].Sublist[indexs].value}`;
this.menuList[index].SublistOpen=false;
console.log(this.datassFn(),'/-/-/');
if(index==1){
this.$emit('mapEventListeners','localScreen',this.datassFn())
}else{
this.$emit('mapEventListeners','apiScreen',this.datassFn())
}
},
getConditionMenu() {
oilSiteApi.getConditionMenu().then(res => {
if (res.code !== 20000) return
Object.keys(res.data).forEach((item,index)=>{
let data = {
title: index==0?'全渠道':'油品',
value: index==0?'全渠道/':'0#/0#',
field: index==0?'siteChannel':'oilProductCode',
SublistOpen: false,
Sublist: []
}
res.data[item].forEach(items=>{
data.Sublist.push({
lable:index==0?items.name:items.id,
value:items.id
})
})
this.menuList.push(data)
})
this.menuList[1].Sublist.unshift({
lable:'全渠道',
value:''
});
[this.menuList[0],this.menuList[1],this.menuList[2]]=[this.menuList[2],this.menuList[0],this.menuList[1]]
// [this.menuList[0],this.menuList[1],this.menuList[2],this.menuList[3]] = [this.menuList[0],this.menuList[3],this.menuList[1],this.menuList[2]];
console.log(this.menuList, '***')
})
},
datassFn(){
let data = {}
this.menuList.forEach((item,index)=>{
data[item.field] = item.value?item.value.split('/')[1]:''
})
console.log(data,'***************')
return data
},
seleFilter(e, w) {
this.menuList.forEach((item,index)=>{
if(w==index) return
item.SublistOpen = false
})
e.SublistOpen = !e.SublistOpen;
this.$emit('closeFooterScroll')
},
chooseLocation(e) {
console.log(this.Route,'******')
// uni.navigateTo({
// url:'/BagStation/pages/newRoutePlanning/chooseLocation=' + `${e}/${this.Route.start.latitude},${this.Route.start.longitude}`
// })
uni.navigateTo({
url: '/BagStation/pages/newRoutePlanning/chooseLocation?type=' +
`${e}/${this.Route.start.latitude},${this.Route.start.longitude}`,
fail(e) {
console.log(e,'****************************')
}
})
},
backFn() {
uni.navigateBack()
}
}
}
</script>
<style scoped>
.conditions {
position: absolute;
background-color: #FFFFFF;
width: 100%;
max-height: 200rpx;
top: 68rpx;
display: flex;
flex-direction: column;
gap: 15rpx;
/* padding: 21rpx 0; */
border-bottom-left-radius: 10px;
border-bottom-right-radius: 10px;
overflow: auto;
transition: max-height 0.3s, opacity 0.3s;
opacity: 1;
}
.filter_item {
flex: 1;
background-color: #FFFFFF;
border-radius: 10px;
margin-top: 30rpx;
padding: 24rpx 0;
text-align: center;
position: relative;
margin-right: 20rpx;
/* border-bottom-left-radius: 10px;
border-bottom-right-radius: 10px; */
}
.filter :last-child{
margin-right: 0;
}
.filter {
font-size: 28rpx;
width: 100%;
display: flex;
/* gap: 20rpx; */
color: #666666;
}
.colorb {
color: #BBBBBB;
}
.Padding {
padding: 0 28rpx;
}
.addressInput {
background: #F0F0F0;
border-radius: 10px;
}
.textoverflow {
overflow: hidden;
text-overflow: ellipsis;
}
.size {
font-size: 28rpx;
color: #666666;
}
.margin {
margin: 0 28rpx;
}
.flexone {
flex: 1;
}
.yuan {
width: 20rpx;
height: 20rpx;
background: #2E8EF7;
border-radius: 50%;
}
.sele_car_right {
flex-direction: column;
flex: 1;
/* padding: 0 27.2rpx; */
padding-left: 27.2rpx;
}
.flex {
display: flex;
}
.jc {
justify-content: center;
}
.ac {
align-items: center;
}
.sele_car {
/* height: 194rpx; */
background: #FFFFFF;
border-radius: 10px;
padding: 18rpx 32rpx;
display: flex;
}
.header {
width: 100vw;
position: absolute;
z-index: 999999;
padding: 0 44rpx;
}
</style>

186
BagStation/pages/overviewMap/components/footer.vue Normal file
View File

@@ -0,0 +1,186 @@
<template>
<view class="footer_body">
<view @click="$emit('reset')" class="myPosition">
<image src="@/static/img/myPosition.png"></image>
</view>
<view v-if="!details" class="selector">
<view class="selector_left" >
<view class="selector_left_d">
<view v-if="isShow.km" class="selector_left_d_popup">
<view @click="seleKm(index)" :style="{color:seleIndex==index?'':'#bbbbbb'}" v-for="(item,index) in kmData" :key="index">{{item.lable}}</view>
</view>
<image style="width: 50rpx;height: 50rpx;" src="../../../static/img/price.png"></image>
<text style="margin: 0 20rpx;" @click="isShow.km=!isShow.km">
{{kmData[seleIndex].lable}}
</text>
<image style="width: 40rpx;height: 25rpx;transform: rotate(180deg);" src="../../../static/img/chevron-up.png"></image>
</view>
</view>
<view @click="upScale" class="screen_bottom">全站 / 区域</view>
</view>
<serviceStation v-if="details" @openMapApp='openMapApp' @dragMap='dragMap' :details='details'></serviceStation>
</view>
</template>
<script>
import serviceStation from '../../newRoutePlanning/components/serviceStation.vue'
export default{
components:{
serviceStation
},
props:{
value:{
type:Number,
default:2000
},
mapScale:{
type:Number,
default:9
},
spareMapScale:{
type:Number,
default:9
},
details:{
type:Object,
default:()=>{
return null
}
}
},
data() {
return {
isShow:{
km:false
},
seleIndex:0,
kmData:[
{
lable:'20KM',
value:20000
},
{
lable:'30KM',
value:30000
},
{
lable:'50KM',
value:50000
}
]
}
},
methods:{
close(){
this.isShow.km=false
},
seleKm(e){
this.seleIndex = e;
setTimeout(()=>{
this.isShow.km=false;
},500);
this.$emit('input',this.kmData[this.seleIndex].value);
},
upScale(){
this.$emit('upScale')
},
openMapApp(){
console.log('导')
let that = this
wx.openLocation({
latitude: that.details.latitude, // 纬度
longitude: that.details.longitude, // 经度
name: that.details.siteName, // 地址名称
address: that.details.siteName, // 详细地址
success: function(r) {
console.log(r)
},
fail: function(res) {
console.log('拉起失败啦', res)
}
})
},
dragMap(e,w){
this.$emit('dragMap',e,w)
},
}
}
</script>
<style scoped>
.selector_left_d_popup{
position: absolute;
width: 100%;
background-color: #FFFFFF;
height: 200rpx;
overflow-y: auto;
top: -220rpx;
border-radius: 10px;
display: flex;
justify-content: space-around;
align-items: center;
flex-direction: column;
}
.selector_left_d{
font-size: 36rpx;
color: #666666;
font-weight: 600;
/* gap:20rpx; */
display: flex;
align-items: center;
height: 100%;
width: max-content;
position: relative;
}
.selector_left{
flex: 1;
}
.screen_bottom {
width: 240rpx;
height: 80rpx;
background: #FF6700;
border-radius: 16px;
display: flex;
align-items: center;
justify-content: center;
color: #FFFFFF;
font-size: 36rpx;
font-weight: 600;
}
.myPosition{
display: flex;
background-color: #ffffff;
width: 70rpx;
height: 70rpx;
display: flex;
justify-content: center;
align-items: center;
border-radius: 10px;
margin-left: 85%;
margin-bottom: 20rpx;
}
.myPosition image{
/* background-color: #FFFFFF; */
width: 45rpx;
height: 45rpx;
}
.selector{
width: calc(80% + 50rpx);
background-color: #FFFFFF;
border-radius: 10px;
margin: 0 auto;
margin-bottom: env(safe-area-inset-bottom);
display: flex;
justify-content: flex-end;
padding: 10rpx 25rpx;
}
.footer_body{
position: absolute;
z-index: 999999;
bottom: 0;
width: 100%;
color: #000000;
width: 100vw;
}
</style>