1438 lines
47 KiB
Vue
1438 lines
47 KiB
Vue
<template>
|
||
<div class="main">
|
||
<!-- <div class="leftArrow" :style="{top:(menu.top + ((menu.height - 24)/2) )+ 'px'}" @click="handleBack">-->
|
||
<!-- <image class="img" src="https://eshangtech.com/ShopICO/ahyd-BID/commercial/navigation-left.svg"></image>-->
|
||
<!-- </div>-->
|
||
<view class="mapBox" v-if="isShowMap">
|
||
<map id="myMap" :longitude="longitude" :latitude="latitude" :markers="markers" class="map" show-location></map>
|
||
<!-- <view class="ydBox" @click="handleClickYD">-->
|
||
<!-- <image class="ydIcon" src="https://eshangtech.com/wanmeiyizhanImg/tabBar/company_active.png"/>-->
|
||
<!-- </view>-->
|
||
</view>
|
||
<!-- <view v-else class="map"></view>-->
|
||
<div class="list" :style="{
|
||
transform: isMoveUp ? `translateY(calc(-40vh + 40px))` : '',
|
||
background: '#EEF1F9'
|
||
}">
|
||
<!-- :style="{transform:isMoveUp?`translateY(calc(-40vh + ${menu.bottom + 5}px))`:''}"-->
|
||
<div class="top">
|
||
<div class="topImg">
|
||
<image class="packUp" :style="{ transform: isMoveUp ? 'rotate(180deg)' : '' }"
|
||
src="https://eshangtech.com/ShopICO/ahyd-BID/service/packUp.svg" @click="handleClickShowMoveUp"></image>
|
||
</div>
|
||
<div class="search">
|
||
<!-- <div class="left">
|
||
<picker class="pick" @change="handleChangeService($event)" :value="selectIndex" :range="array" range-key="name">
|
||
<div class="box">
|
||
<view class="picker">
|
||
{{selectName || ''}}
|
||
</view>
|
||
<image class="selectIcon" src="https://eshangtech.com/ShopICO/ahyd-BID/service/upArrow.svg"></image>
|
||
</div>
|
||
</picker>
|
||
</div> -->
|
||
<div class="right">
|
||
<input class="searchText" v-model="searchText" confirm-type="search" @confirm="handleSearch"
|
||
placeholder="搜索服务区" placeholder-style="font-size: 14px;color: #A69E9F;" />
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<scroll-view @scrolltolower="handleScrollBottom" :scroll-y="true" class="serviceList"
|
||
:style="{ height: isMoveUp ? `calc(100vh - 130px)` : 'calc(60vh - 74px)' }">
|
||
<div style="height: 100%">
|
||
<!-- <charge-box :serviceAreaList="chaegeBoxList" :pageType="'newMap'" :comeForm="comeForm" :noLoading="true" /> -->
|
||
<ChargeBoxStyle :dataList="serviceList" :pageType="'newMap'" :comeForm="comeForm" />
|
||
</div>
|
||
</scroll-view>
|
||
</div>
|
||
|
||
<CustomLoading :visible="isLoading" v-if="isLoading" @update:visible="(val) => (isLoading = val)" />
|
||
</div>
|
||
</template>
|
||
|
||
<script>
|
||
import {
|
||
handleHavePointInMin,
|
||
handleHavePointInApp,
|
||
hanldeHavePointInIos,
|
||
handleGetUserPointInfo,
|
||
handleGetNearThreeService
|
||
} from "../../../utils/publicMethods";
|
||
import ChargeBoxStyle from "../../../components/chargeBoxStyle.vue";
|
||
import CustomLoading from '../../../components/customLoading.vue'
|
||
export default {
|
||
components: { ChargeBoxStyle, CustomLoading },
|
||
data() {
|
||
return {
|
||
menu: {}, // 手机参数
|
||
longitude: null,
|
||
latitude: null,
|
||
userLongitude: null,
|
||
userLatitude: null,
|
||
seat: "",
|
||
statusBarHeight: "",
|
||
isMoveUp: false, // 是否展开
|
||
array: [], // 服务区选择器选择的列表
|
||
selectIndex: null, // 服务区选择器选择的值
|
||
selectValue: "", // 选择的值
|
||
selectName: "", // 选择的片区名字
|
||
searchText: "",
|
||
serviceList: [],
|
||
isShowMap: true,
|
||
serviceTypeObj: {},
|
||
currentServiceMessage: {}, // 当前的服务区数据
|
||
seatInfo: {}, // 经纬度
|
||
loginType: "", // 登录类别
|
||
comeForm: "",
|
||
chaegeBoxList: [], //服务区名称列表
|
||
markers: [],
|
||
pageIndex: 1,
|
||
businessObj: {},// 繁忙度对象
|
||
isLoading: false,
|
||
|
||
};
|
||
},
|
||
async onLoad(option) {
|
||
console.log("option", option);
|
||
if (option.comeForm) {
|
||
this.comeForm = option.comeForm;
|
||
}
|
||
// 获取手机参数
|
||
let systemInfo = uni.getSystemInfoSync();
|
||
this.statusBarHeight = Number(systemInfo.statusBarHeight);
|
||
this.loginType = type;
|
||
if (type === "min") {
|
||
this.menu = uni.getMenuButtonBoundingClientRect();
|
||
} else {
|
||
this.menu = systemInfo.safeArea;
|
||
}
|
||
// 地图初始化
|
||
this.mapCtx = uni.createMapContext("myMap");
|
||
// let seatInfo = uni.getStorageSync("seatInfo");
|
||
// if (seatInfo) {
|
||
// this.seatInfo = seatInfo;
|
||
// }
|
||
let type = uni.getStorageSync("loginType");
|
||
this.loginType = type
|
||
// wx.getLocation({
|
||
// type: 'gcj02',
|
||
// altitude: true,
|
||
// success: async (res) => {
|
||
// console.log('rewrwqerwq', res)
|
||
// let seatInfo = {
|
||
// latitude: res.latitude,
|
||
// longitude: res.longitude
|
||
// }
|
||
// uni.setStorageSync('seatInfo', seatInfo)
|
||
// }
|
||
// })
|
||
|
||
console.log("type", type);
|
||
|
||
const seatInfo = await handleGetUserPointInfo()
|
||
console.log("seatInfo", seatInfo);
|
||
this.seatInfo = seatInfo
|
||
|
||
await this.handleGetBusiness()
|
||
|
||
await this.handleGetServiceList();
|
||
// if (this.seatInfo.longitude && this.seatInfo.latitude) {
|
||
// let res = uni.getStorageSync("currentService");
|
||
// console.log("res", res);
|
||
// // 已经拿到选中的服务区了
|
||
// if (res) {
|
||
// this.currentServiceMessage = res;
|
||
// }
|
||
// // 获取片区列表
|
||
// await this.getServiceList();
|
||
// // 服务区的枚举类型
|
||
// await this.handleServiceType();
|
||
// // 拿到服务区的列表
|
||
// await this.handleGetServiceList();
|
||
// } else {
|
||
// if (this.loginType === "min") {
|
||
// handleHavePointInMin().then((res) => {
|
||
// console.log("handleHavePointInMin", res);
|
||
// _this.handleGetOnLoad();
|
||
// });
|
||
// } else if (this.loginType === "android") {
|
||
// handleHavePointInApp().then((res) => {
|
||
// console.log("handleHavePointInApp", res);
|
||
// });
|
||
// } else {
|
||
// console.log("ios");
|
||
// hanldeHavePointInIos();
|
||
// }
|
||
// }
|
||
this.$utils.addUserBehaviorNew();
|
||
},
|
||
onHide() {
|
||
this.isShowMap = true;
|
||
},
|
||
onUnload() {
|
||
this.isShowMap = false;
|
||
},
|
||
methods: {
|
||
// 每次进入页面拿到一次繁忙度的数据
|
||
async handleGetBusiness() {
|
||
let businessReq = {
|
||
action_type: "getCurHalfCollect",
|
||
province_code: 3544,
|
||
};
|
||
|
||
const businessRes = await new Promise((resolve, reject) => {
|
||
uni.request({
|
||
url: `https://cloud.eshangtech.com/MobileServicePlatform/Handler/handler_ajax.ashx`,
|
||
method: "GET",
|
||
data: businessReq,
|
||
success(res) {
|
||
let data = res.data.CollectionObject;
|
||
if (data && data.length > 0) {
|
||
resolve(data);
|
||
} else {
|
||
resolve([]);
|
||
}
|
||
},
|
||
});
|
||
});
|
||
|
||
console.log('fljddlkjalkd', businessRes);
|
||
|
||
let obj = {}
|
||
if (businessRes && businessRes.length > 0) {
|
||
businessRes.forEach((item) => {
|
||
obj[item.SERVERPART_ID] = item
|
||
})
|
||
}
|
||
this.businessObj = obj
|
||
|
||
},
|
||
// 滚动到底部
|
||
handleScrollBottom() {
|
||
console.log('到底部啦');
|
||
this.pageIndex = this.pageIndex + 1
|
||
this.handleGetServiceList()
|
||
},
|
||
// 点击了展开
|
||
handleClickShowMoveUp() {
|
||
if (this.isMoveUp) {
|
||
this.isMoveUp = false;
|
||
} else {
|
||
this.isMoveUp = true;
|
||
}
|
||
},
|
||
// 切换片区
|
||
handleChangeService(e) {
|
||
console.log("e", e);
|
||
this.selectIndex = Number(e.mp.detail.value);
|
||
this.selectValue = this.array[this.selectIndex].value;
|
||
this.selectName = this.array[this.selectIndex].name;
|
||
},
|
||
// 获取片区列表
|
||
async getServiceList() {
|
||
let req = {
|
||
Province_Code: "340000",
|
||
};
|
||
const data = await this.$api.$get(
|
||
"/CommercialApi/BaseInfo/GetSPRegionList",
|
||
req
|
||
);
|
||
console.log("data", data);
|
||
this.array = data.Result_Data.List;
|
||
// 已经有选择的服务区的话 根据数据 自动把片区选择起来
|
||
if (this.currentServiceMessage.SPREGIONTYPE_ID) {
|
||
let selectIndex = 0;
|
||
this.array.forEach((item, index) => {
|
||
if (item.value === this.currentServiceMessage.SPREGIONTYPE_ID) {
|
||
selectIndex = index;
|
||
}
|
||
});
|
||
this.selectIndex = selectIndex;
|
||
this.selectValue = this.currentServiceMessage.SPREGIONTYPE_ID;
|
||
this.selectName = this.currentServiceMessage.SPREGIONTYPE_NAME;
|
||
} else {
|
||
this.selectIndex = 0;
|
||
this.selectValue = this.array[this.selectIndex].value;
|
||
this.selectName = this.array[this.selectIndex].name;
|
||
}
|
||
},
|
||
// 加油的数据
|
||
async handleGetOilData(list, idList) {
|
||
const data = await this.$api.$javaGet2("/oil-price/getListByServerPartIds", {
|
||
serverpartIds: idList.toString(),
|
||
});
|
||
let oilData = data.Result_Data.List
|
||
|
||
|
||
if (list && list.length > 0) {
|
||
list.forEach((item) => {
|
||
let haveOil = false
|
||
let oilList = oilData.filter((filterItem => item.SERVERPART_ID === filterItem.serverpartId))
|
||
if (oilList && oilList.length > 0) {
|
||
haveOil = true
|
||
}
|
||
|
||
item.imgList.forEach((subItem) => {
|
||
if (subItem.title === '充电桩') {
|
||
let isHave = false
|
||
if (item.GWDetail.GWSum > 0 || item.JKDetail.JKSum > 0 || item.LXDetail.LXSum > 0 || item.WLDetail.WLSum > 0) {
|
||
isHave = true
|
||
}
|
||
subItem.url = isHave ? "https://eshangtech.com/minTestImg/chargeImgNew/chargingStation.svg"
|
||
: "https://eshangtech.com/minTestImg/chargeImgNew/nochargingStation.svg"
|
||
} else if (subItem.title === '加油站' && haveOil) {
|
||
subItem.url = haveOil ? "https://eshangtech.com/minTestImg/REFUELINGGUN.svg"
|
||
: "https://eshangtech.com/minTestImg/noREFUELINGGUN.svg"
|
||
}
|
||
})
|
||
})
|
||
}
|
||
|
||
return list
|
||
},
|
||
// 拿到服务区列表
|
||
async handleGetServiceList() {
|
||
// if (!(this.seatInfo.longitude && this.seatInfo.latitude)) {
|
||
// return;
|
||
// }
|
||
this.isLoading = true
|
||
let req = {
|
||
Province_Code: "340000",
|
||
// SPRegionType_ID: this.selectValue,
|
||
// Serverpart_ID: this.currentServiceMessage.Serverpart_ID || "",
|
||
longitude: this.seatInfo.longitude,
|
||
latitude: this.seatInfo.latitude,
|
||
ShowService: true,
|
||
PageIndex: this.pageIndex,
|
||
PageSize: 10
|
||
};
|
||
const data = await this.$api.$get(
|
||
"/CommercialApi/BaseInfo/GetServerpartList",
|
||
req
|
||
);
|
||
console.log('djisajdasijd', data);
|
||
|
||
let list = data.Result_Data.List;
|
||
|
||
// const res = await handleGetNearThreeService()
|
||
// let list = res.allServiceList;
|
||
|
||
let nameList = [];
|
||
let idList = []
|
||
if (list && list.length > 0) {
|
||
list.forEach((item) => {
|
||
nameList.push(item.SERVERPART_NAME);
|
||
idList.push(item.SERVERPART_ID)
|
||
// 理想总数
|
||
let LIAUTOCHARGESum = 0;
|
||
// 国网总数
|
||
let STATEGRIDCHARGESum = 0;
|
||
// 充换电总数
|
||
let GACENERGYCHARGESum = 0;
|
||
let HASPANTRY = 0; // 男厕数量
|
||
let HASWIFI = 0; // 女厕数量
|
||
let HASSHOWERROOM = 0; // 淋浴房
|
||
let MICROWAVEOVEN = 0; // 微波炉
|
||
let WASHERCOUNT = 0; // 洗衣机数量
|
||
let HASPILOTLOUNGE = false; // 有无司机之家
|
||
let HASCHILD = false; // 有无车辆维修
|
||
let SMALLPARKING = 0; // 轿车车位
|
||
let PACKING = 0; // 客车车位
|
||
let TRUCKPACKING = 0; // 货车车位
|
||
let DANPACKING = 0; // 危化品车位
|
||
let DININGROOMCOUNT = 0; // 餐饮店
|
||
let HASBACKGROUNDRADIO = 0; // 便利店
|
||
let POINTCONTROLCOUNT = 0; // 客房
|
||
let REFUELINGGUN92 = 0; // 加油枪92号
|
||
let REFUELINGGUN95 = 0; // 加油枪95号
|
||
let REFUELINGGUN0 = 0; // 加油枪0号
|
||
|
||
if (item.RegionInfo && item.RegionInfo.length > 0) {
|
||
item.RegionInfo.forEach((subItem) => {
|
||
HASPANTRY += subItem.HASPANTRY;
|
||
HASWIFI += subItem.HASPANTRY;
|
||
HASSHOWERROOM += subItem.HASSHOWERROOM;
|
||
MICROWAVEOVEN += subItem.MICROWAVEOVEN;
|
||
WASHERCOUNT += subItem.WASHERCOUNT;
|
||
SMALLPARKING += subItem.SMALLPARKING;
|
||
PACKING += subItem.PACKING;
|
||
TRUCKPACKING += subItem.TRUCKPACKING;
|
||
DANPACKING += subItem.DANPACKING;
|
||
DININGROOMCOUNT += subItem.DININGROOMCOUNT;
|
||
HASBACKGROUNDRADIO += subItem.HASBACKGROUNDRADIO;
|
||
POINTCONTROLCOUNT += subItem.POINTCONTROLCOUNT;
|
||
REFUELINGGUN92 += subItem.REFUELINGGUN92;
|
||
REFUELINGGUN95 += subItem.REFUELINGGUN95;
|
||
REFUELINGGUN0 += subItem.REFUELINGGUN0;
|
||
|
||
if (subItem.HASPILOTLOUNGE) {
|
||
HASPILOTLOUNGE = true;
|
||
}
|
||
if (subItem.HASCHILD) {
|
||
HASCHILD = true;
|
||
}
|
||
});
|
||
}
|
||
|
||
item.imgList = [
|
||
{
|
||
url:
|
||
HASPANTRY > 0 || HASWIFI > 0
|
||
? "https://eshangtech.com/minTestImg/chargeImgNew/motherAndBaby.svg"
|
||
: "https://eshangtech.com/minTestImg/chargeImgNew/nomotherAndBaby.svg",
|
||
isShow: HASPANTRY > 0 || HASWIFI > 0,
|
||
title: "母婴室",
|
||
},
|
||
{
|
||
url:
|
||
HASPILOTLOUNGE > 0
|
||
? "https://eshangtech.com/minTestImg/chargeImgNew/HASPILOTLOUNGE.svg"
|
||
: "https://eshangtech.com/minTestImg/chargeImgNew/noHASPILOTLOUNGE.svg",
|
||
isShow: HASPILOTLOUNGE > 0,
|
||
title: "司机之家",
|
||
},
|
||
{
|
||
url: HASCHILD
|
||
? "https://eshangtech.com/minTestImg/chargeImgNew/HASCHILD.svg"
|
||
: "https://eshangtech.com/minTestImg/chargeImgNew/noHASCHILD.svg",
|
||
isShow: SMALLPARKING,
|
||
title: "车辆维修",
|
||
},
|
||
{
|
||
url:
|
||
DININGROOMCOUNT > 0
|
||
? "https://eshangtech.com/minTestImg/chargeImgNew/DININGROOMCOUNT.svg"
|
||
: "https://eshangtech.com/minTestImg/chargeImgNew/noDININGROOMCOUNT.svg",
|
||
isShow: DININGROOMCOUNT > 0,
|
||
title: "餐饮",
|
||
},
|
||
{
|
||
url:
|
||
HASBACKGROUNDRADIO > 0
|
||
? "https://eshangtech.com/minTestImg/chargeImgNew/HASBACKGROUNDRADIO.svg"
|
||
: "https://eshangtech.com/minTestImg/chargeImgNew/noHASBACKGROUNDRADIO.svg",
|
||
isShow: HASBACKGROUNDRADIO > 0,
|
||
title: "便利店",
|
||
},
|
||
|
||
{
|
||
url:
|
||
HASPANTRY > 0 || HASWIFI > 0
|
||
? "https://eshangtech.com/minTestImg/chargeImgNew/WC.svg"
|
||
: "https://eshangtech.com/minTestImg/chargeImgNew/noWC.svg",
|
||
isShow: HASPANTRY > 0,
|
||
title: "卫生间",
|
||
},
|
||
|
||
{
|
||
url:
|
||
SMALLPARKING > 0 ||
|
||
PACKING > 0 ||
|
||
TRUCKPACKING > 0 ||
|
||
DANPACKING > 0
|
||
? "https://eshangtech.com/minTestImg/chargeImgNew/SMALLPARKING.svg"
|
||
: "https://eshangtech.com/minTestImg/chargeImgNew/noSMALLPARKING.svg",
|
||
isShow:
|
||
SMALLPARKING > 0 ||
|
||
PACKING > 0 ||
|
||
TRUCKPACKING > 0 ||
|
||
DANPACKING > 0,
|
||
title: "停车场",
|
||
},
|
||
{
|
||
url:
|
||
REFUELINGGUN92 > 0 ||
|
||
REFUELINGGUN95 > 0 ||
|
||
REFUELINGGUN0 > 0
|
||
? "https://eshangtech.com/minTestImg/chargeImgNew/REFUELINGGUN.svg"
|
||
: "https://eshangtech.com/minTestImg/chargeImgNew/noREFUELINGGUN.svg",
|
||
isShow:
|
||
REFUELINGGUN92 > 0 ||
|
||
REFUELINGGUN95 > 0 ||
|
||
REFUELINGGUN0 > 0,
|
||
title: "加油站",
|
||
},
|
||
{
|
||
url:
|
||
LIAUTOCHARGESum > 0 ||
|
||
STATEGRIDCHARGESum > 0 ||
|
||
GACENERGYCHARGESum > 0
|
||
? "https://eshangtech.com/minTestImg/chargeImgNew/chargingStation.svg"
|
||
: "https://eshangtech.com/minTestImg/chargeImgNew/nochargingStation.svg",
|
||
isShow:
|
||
LIAUTOCHARGESum > 0 ||
|
||
STATEGRIDCHARGESum > 0 ||
|
||
GACENERGYCHARGESum > 0,
|
||
title: "充电桩",
|
||
},
|
||
|
||
{
|
||
url:
|
||
POINTCONTROLCOUNT > 0
|
||
? "https://eshangtech.com/minTestImg/chargeImgNew/POINTCONTROLCOUNT.svg"
|
||
: "https://eshangtech.com/minTestImg/chargeImgNew/noPOINTCONTROLCOUNT.svg",
|
||
isShow: POINTCONTROLCOUNT > 0,
|
||
title: "客房",
|
||
},
|
||
{
|
||
url:
|
||
HASSHOWERROOM > 0
|
||
? "https://eshangtech.com/minTestImg/HASSHOWERROOM.svg"
|
||
: "https://eshangtech.com/minTestImg/noHASSHOWERROOM.svg",
|
||
isShow: HASSHOWERROOM > 0,
|
||
title: "淋浴房",
|
||
},
|
||
]
|
||
|
||
item.businessObj = this.businessObj[item.SERVERPART_ID.toString()]
|
||
});
|
||
}
|
||
|
||
this.chaegeBoxList = nameList;
|
||
|
||
// 拿到电价数据
|
||
list = await this.handleGetChargeData(list, idList)
|
||
// 拿到油价数据
|
||
list = await this.handleGetOilData(list, idList)
|
||
|
||
this.isLoading = false
|
||
|
||
this.serviceList = this.serviceList.concat(list);
|
||
|
||
this.longitude = this.serviceList[0].SERVERPART_X;
|
||
this.latitude = this.serviceList[0].SERVERPART_Y;
|
||
this.isShowMap = true;
|
||
|
||
console.log("this.serviceList", this.serviceList);
|
||
|
||
|
||
// await this.getServiceDetail(this.serviceList[0].SERVERPART_ID);
|
||
},
|
||
extractDirection(stationName) {
|
||
if (!stationName) return '';
|
||
// 定义方向匹配的正则表达式
|
||
const directionPatterns = [
|
||
/(?:（|\(|【)([^）\)】]*方向)(?:\)|）|】)/, // 匹配括号内的方向
|
||
/([^，,。.;;！!?？、\s]+方向)/, // 匹配无括号的方向
|
||
/方向([^，,。.;;！!?？、\s]+)/ // 匹配"方向XX"格式
|
||
];
|
||
for (const pattern of directionPatterns) {
|
||
const match = stationName.match(pattern);
|
||
if (match) {
|
||
// 提取最核心的方向信息（去掉前后可能的多余字符）
|
||
const direction = match[1] || match[0];
|
||
return direction.replace(/^[（\(【]|[）\)】]$/g, '').trim();
|
||
}
|
||
}
|
||
return '';
|
||
},
|
||
// 拿到充电数据
|
||
async handleGetChargeData(serviceList, idList) {
|
||
const data = await this.$api.$javaPost("/charge/stationinfo/queryByIds", {
|
||
ids: idList,
|
||
brands: [],
|
||
});
|
||
// 理想
|
||
let LXData = [];
|
||
// 交控
|
||
let JKData = [];
|
||
// 国网
|
||
let GWData = [];
|
||
// 蔚来
|
||
let WLData = [];
|
||
|
||
if (data && data.length > 0) {
|
||
data.forEach((item) => {
|
||
if (item.brand === "理想") {
|
||
LXData.push(item);
|
||
} else if (item.brand === "交控") {
|
||
JKData.push(item);
|
||
} else if (item.brand === "国网") {
|
||
GWData.push(item);
|
||
} else if (item.brand === "蔚来") {
|
||
WLData.push(item);
|
||
}
|
||
});
|
||
}
|
||
|
||
if (serviceList && serviceList.length > 0) {
|
||
serviceList.forEach((item) => {
|
||
let LXInfoList = [];
|
||
let JKInfoList = [];
|
||
let GWInfoList = [];
|
||
let WLInfoList = [];
|
||
// 理想
|
||
let LXRes = [];
|
||
if (LXData && LXData.length > 0) {
|
||
let thisServiceRes = LXData.filter(
|
||
(filterItem) => filterItem.serverpartId === item.SERVERPART_ID
|
||
);
|
||
if (thisServiceRes && thisServiceRes.length > 0) {
|
||
thisServiceRes.forEach((subItem) => {
|
||
if (subItem.equipments && subItem.equipments.length > 0) {
|
||
subItem.equipments.forEach((thirdItem) => {
|
||
if (
|
||
thirdItem.connectors &&
|
||
thirdItem.connectors.length > 0
|
||
) {
|
||
thirdItem.connectors.forEach((fourthItem) => {
|
||
LXRes.push(fourthItem);
|
||
LXInfoList.push({
|
||
...fourthItem,
|
||
address: this.extractDirection(subItem.name),
|
||
Status: fourthItem.status,
|
||
Power: Number(fourthItem.powerMax),
|
||
ConnectorID: fourthItem.connectorCode,
|
||
ConnectorType: Number(fourthItem.connectorType),
|
||
NationalStandard: Number(fourthItem.national),
|
||
VoltageLowerLimits: Number(fourthItem.voltageLimit),
|
||
VoltageUpperLimits: Number(fourthItem.voltageMax),
|
||
electricityFee: subItem.electricityFee
|
||
});
|
||
});
|
||
}
|
||
});
|
||
}
|
||
});
|
||
}
|
||
}
|
||
// 空多少个
|
||
let LXEmpty = 0;
|
||
// 一共多少个
|
||
let LXSum = 0;
|
||
if (LXRes && LXRes.length > 0) {
|
||
LXRes.forEach((subItem) => {
|
||
// if (subItem.status !== 3) {
|
||
// 替换空的逻辑 只有空闲的状态 才算空
|
||
if (subItem.status === 1) {
|
||
LXEmpty += 1;
|
||
}
|
||
LXSum += 1;
|
||
});
|
||
}
|
||
item.LXDetail = {
|
||
LXSum: LXSum,
|
||
LXEmpty: LXEmpty,
|
||
};
|
||
|
||
// 交控
|
||
let JKRes = [];
|
||
if (JKData && JKData.length > 0) {
|
||
let thisServiceRes = JKData.filter(
|
||
(filterItem) => filterItem.serverpartId === item.SERVERPART_ID
|
||
);
|
||
if (thisServiceRes && thisServiceRes.length > 0) {
|
||
thisServiceRes.forEach((subItem) => {
|
||
if (subItem.equipments && subItem.equipments.length > 0) {
|
||
subItem.equipments.forEach((thirdItem) => {
|
||
if (
|
||
thirdItem.connectors &&
|
||
thirdItem.connectors.length > 0
|
||
) {
|
||
thirdItem.connectors.forEach((fourthItem) => {
|
||
JKRes.push(fourthItem);
|
||
JKInfoList.push({
|
||
...fourthItem,
|
||
address: this.extractDirection(subItem.name),
|
||
Status: fourthItem.status,
|
||
Power: Number(fourthItem.powerMax),
|
||
ConnectorID: fourthItem.connectorCode,
|
||
ConnectorType: Number(fourthItem.connectorType),
|
||
NationalStandard: Number(fourthItem.national),
|
||
VoltageLowerLimits: Number(fourthItem.voltageLimit),
|
||
VoltageUpperLimits: Number(fourthItem.voltageMax),
|
||
electricityFee: subItem.electricityFee
|
||
});
|
||
});
|
||
}
|
||
});
|
||
}
|
||
});
|
||
}
|
||
}
|
||
// 空多少个
|
||
let JKEmpty = 0;
|
||
// 一共多少个
|
||
let JKSum = 0;
|
||
if (JKRes && JKRes.length > 0) {
|
||
JKRes.forEach((subItem) => {
|
||
// 替换空的逻辑 只有空闲的状态 才算空
|
||
if (subItem.status === 1) {
|
||
JKEmpty += 1;
|
||
}
|
||
JKSum += 1;
|
||
});
|
||
}
|
||
item.JKDetail = {
|
||
JKEmpty: JKEmpty,
|
||
JKSum: JKSum,
|
||
};
|
||
|
||
// 国网
|
||
let GWRes = [];
|
||
if (GWData && GWData.length > 0) {
|
||
let thisServiceRes = GWData.filter(
|
||
(filterItem) => filterItem.serverpartId === item.SERVERPART_ID && filterItem.name.indexOf('方向）') !== -1 && filterItem.name.indexOf('充电站') !== -1
|
||
);
|
||
if (thisServiceRes && thisServiceRes.length > 0) {
|
||
thisServiceRes.forEach((subItem) => {
|
||
if (subItem.equipments && subItem.equipments.length > 0) {
|
||
subItem.equipments.forEach((thirdItem) => {
|
||
if (
|
||
thirdItem.connectors &&
|
||
thirdItem.connectors.length > 0
|
||
) {
|
||
thirdItem.connectors.forEach((fourthItem) => {
|
||
GWRes.push(fourthItem);
|
||
GWInfoList.push({
|
||
...fourthItem,
|
||
Status: fourthItem.status,
|
||
address: this.extractDirection(subItem.name),
|
||
Power: Number(fourthItem.powerMax),
|
||
ConnectorID: fourthItem.connectorCode,
|
||
ConnectorType: Number(fourthItem.connectorType),
|
||
NationalStandard: Number(fourthItem.national),
|
||
VoltageLowerLimits: Number(fourthItem.voltageLimit),
|
||
VoltageUpperLimits: Number(fourthItem.voltageMax),
|
||
electricityFee: subItem.electricityFee
|
||
});
|
||
});
|
||
}
|
||
});
|
||
}
|
||
});
|
||
}
|
||
}
|
||
// 空多少个
|
||
let GWEmpty = 0;
|
||
// 一共多少个
|
||
let GWSum = 0;
|
||
if (GWRes && GWRes.length > 0) {
|
||
GWRes.forEach((subItem) => {
|
||
// 替换空的逻辑 只有空闲的状态 才算空
|
||
if (subItem.status === 1) {
|
||
GWEmpty += 1;
|
||
}
|
||
GWSum += 1;
|
||
});
|
||
}
|
||
item.GWDetail = {
|
||
GWEmpty: GWEmpty,
|
||
GWSum: GWSum,
|
||
};
|
||
|
||
// console.log('daskjdaskjdaskljdaslkhfjdshf', GWRes);
|
||
|
||
|
||
// 蔚来
|
||
let WLRes = [];
|
||
|
||
if (WLData && WLData.length > 0) {
|
||
let thisServiceRes = WLData.filter(
|
||
(filterItem) => filterItem.serverpartId === item.SERVERPART_ID
|
||
);
|
||
if (thisServiceRes && thisServiceRes.length > 0) {
|
||
thisServiceRes.forEach((subItem) => {
|
||
if (subItem.equipments && subItem.equipments.length > 0) {
|
||
subItem.equipments.forEach((thirdItem) => {
|
||
if (
|
||
thirdItem.connectors &&
|
||
thirdItem.connectors.length > 0
|
||
) {
|
||
thirdItem.connectors.forEach((fourthItem) => {
|
||
WLRes.push(fourthItem);
|
||
WLInfoList.push({
|
||
...fourthItem,
|
||
Status: fourthItem.status,
|
||
address: this.extractDirection(subItem.name),
|
||
Power: Number(fourthItem.powerMax),
|
||
ConnectorID: fourthItem.connectorCode,
|
||
ConnectorType: Number(fourthItem.connectorType),
|
||
NationalStandard: Number(fourthItem.national),
|
||
VoltageLowerLimits: Number(fourthItem.voltageLimit),
|
||
VoltageUpperLimits: Number(fourthItem.voltageMax),
|
||
electricityFee: subItem.electricityFee
|
||
});
|
||
});
|
||
}
|
||
});
|
||
}
|
||
});
|
||
}
|
||
}
|
||
|
||
// 空多少个
|
||
let WLEmpty = 0;
|
||
// 一共多少个
|
||
let WLSum = 0;
|
||
|
||
if (WLRes && WLRes.length > 0) {
|
||
WLRes.forEach((subItem) => {
|
||
// 替换空的逻辑 只有空闲的状态 才算空
|
||
if (subItem.status === 1) {
|
||
WLEmpty += 1;
|
||
}
|
||
WLSum += 1;
|
||
});
|
||
}
|
||
|
||
item.WLDetail = {
|
||
WLEmpty: WLEmpty,
|
||
WLSum: WLSum,
|
||
};
|
||
|
||
|
||
item.allChargeDetail = {
|
||
allSum:
|
||
Number(
|
||
item.LXDetail && item.LXDetail.LXSum ? item.LXDetail.LXSum : 0
|
||
) +
|
||
Number(item.WLDetail.WLSum || 0) +
|
||
Number(item.JKDetail.JKSum || 0) +
|
||
Number(item.GWDetail.GWSum || 0),
|
||
empty:
|
||
Number(
|
||
item.LXDetail && item.LXDetail.LXEmpty
|
||
? item.LXDetail.LXEmpty
|
||
: 0
|
||
) +
|
||
Number(item.WLDetail.WLEmpty || 0) +
|
||
Number(item.JKDetail.JKEmpty || 0) +
|
||
Number(item.GWDetail.GWEmpty || 0),
|
||
};
|
||
|
||
item.LXInfoList = LXInfoList;
|
||
item.JKInfoList = JKInfoList;
|
||
item.GWInfoList = GWInfoList;
|
||
item.WLInfoList = WLInfoList;
|
||
});
|
||
}
|
||
console.log('dksjdisjfdf', serviceList)
|
||
return serviceList
|
||
},
|
||
// 选择的服务区详情
|
||
handleGoDetail(id, obj) {
|
||
console.log("id", id);
|
||
console.log("obj", obj);
|
||
let res = this.handleChangeServiceInfo(obj);
|
||
// let res = {
|
||
// SERVERPART_NAME: obj.SERVERPART_NAME, // 服务区
|
||
// SPREGIONTYPE_NAME: obj.SPREGIONTYPE_NAME, // 片区
|
||
// Serverpart_ID: obj.SERVERPART_ID,
|
||
// SPRegionType_ID: obj.SPREGIONTYPE_ID,
|
||
// longitude: obj.SERVERPART_X,
|
||
// latitude: obj.SERVERPART_Y
|
||
// }
|
||
console.log("this.comeForm", this.comeForm);
|
||
|
||
uni.setStorageSync("currentService", res); // 当前选中服务区信息
|
||
if (this.comeForm === "home") {
|
||
uni.navigateTo({ url: "/pages/serviceDetail/shopDetail/index" });
|
||
} else {
|
||
uni.navigateBack({
|
||
delta: 1,
|
||
});
|
||
}
|
||
},
|
||
// 兼容一下老接口要的服务区对象的内容
|
||
handleChangeServiceInfo(obj) {
|
||
let newObj = {
|
||
...obj,
|
||
Distance: obj.SERVERPART_DISTANCE,
|
||
OwnerUnitId: obj.OWNERUNIT_ID,
|
||
OwnerUnitName: obj.OWNERUNIT_NAME,
|
||
ProvinceCode: "340000",
|
||
ServerPart_Id: obj.SERVERPART_ID,
|
||
ServerPart_Name: obj.SERVERPART_NAME,
|
||
ServerPart_Tel: "",
|
||
ServerPart_X: obj.SERVERPART_X,
|
||
ServerPart_Y: obj.SERVERPART_Y,
|
||
showName: `${obj.SERVERPART_NAME}(${obj.SERVERPART_DISTANCE}km)`,
|
||
};
|
||
return newObj;
|
||
},
|
||
// 获取服务区详情信息
|
||
async getServiceDetail(id) {
|
||
let req = {
|
||
ServerpartId: id,
|
||
longitude: this.seatInfo.longitude,
|
||
latitude: this.seatInfo.latitude,
|
||
};
|
||
const data = await this.$api.$get(
|
||
"/CommercialApi/BaseInfo/GetServerpartInfo",
|
||
req
|
||
);
|
||
console.log("data", data);
|
||
this.longitude = data.Result_Data.ServerpartInfo.SERVERPART_X;
|
||
this.latitude = data.Result_Data.ServerpartInfo.SERVERPART_Y;
|
||
this.isShowMap = true;
|
||
},
|
||
// 枚举服务区类型 SERVERPART_TYPE
|
||
async handleServiceType() {
|
||
const data = await this.$api.$get(
|
||
"/EShangApiMain/FrameWork/GetFieldEnumByField",
|
||
{ FieldExplainField: "SERVERPART_TYPE" }
|
||
);
|
||
console.log("data", data);
|
||
let obj = {};
|
||
data.Result_Data.List.forEach((item) => {
|
||
obj[Number(item.value)] = item.label;
|
||
});
|
||
console.log("obj", obj);
|
||
this.serviceTypeObj = obj;
|
||
},
|
||
// 搜索框触发的方法
|
||
async handleSearch() {
|
||
this.pageIndex = 1
|
||
this.chaegeBoxList = [];
|
||
let req = {
|
||
// longitude: this.longitude,
|
||
Province_Code: "340000",
|
||
longitude: this.seatInfo.longitude,
|
||
latitude: this.seatInfo.latitude,
|
||
Serverpart_Name: this.searchText,
|
||
ShowService: true,
|
||
PageIndex: this.pageIndex,
|
||
PageSize: 10
|
||
};
|
||
const data = await this.$api.$get(
|
||
"/CommercialApi/BaseInfo/GetServerpartList",
|
||
req
|
||
);
|
||
|
||
// let data = await this.$api.$javaGet2('/third-party/getServerPartList', req)
|
||
let list = data.Result_Data.List;
|
||
|
||
let nameList = [];
|
||
let idList = []
|
||
if (list && list.length > 0) {
|
||
list.forEach((item) => {
|
||
nameList.push(item.SERVERPART_NAME);
|
||
idList.push(item.SERVERPART_ID)
|
||
// 理想总数
|
||
let LIAUTOCHARGESum = 0;
|
||
// 国网总数
|
||
let STATEGRIDCHARGESum = 0;
|
||
// 充换电总数
|
||
let GACENERGYCHARGESum = 0;
|
||
let HASPANTRY = 0; // 男厕数量
|
||
let HASWIFI = 0; // 女厕数量
|
||
let HASSHOWERROOM = 0; // 淋浴房
|
||
let MICROWAVEOVEN = 0; // 微波炉
|
||
let WASHERCOUNT = 0; // 洗衣机数量
|
||
let HASPILOTLOUNGE = false; // 有无司机之家
|
||
let HASCHILD = false; // 有无车辆维修
|
||
let SMALLPARKING = 0; // 轿车车位
|
||
let PACKING = 0; // 客车车位
|
||
let TRUCKPACKING = 0; // 货车车位
|
||
let DANPACKING = 0; // 危化品车位
|
||
let DININGROOMCOUNT = 0; // 餐饮店
|
||
let HASBACKGROUNDRADIO = 0; // 便利店
|
||
let POINTCONTROLCOUNT = 0; // 客房
|
||
let REFUELINGGUN92 = 0; // 加油枪92号
|
||
let REFUELINGGUN95 = 0; // 加油枪95号
|
||
let REFUELINGGUN0 = 0; // 加油枪0号
|
||
|
||
if (item.RegionInfo && item.RegionInfo.length > 0) {
|
||
item.RegionInfo.forEach((subItem) => {
|
||
HASPANTRY += subItem.HASPANTRY;
|
||
HASWIFI += subItem.HASPANTRY;
|
||
HASSHOWERROOM += subItem.HASSHOWERROOM;
|
||
MICROWAVEOVEN += subItem.MICROWAVEOVEN;
|
||
WASHERCOUNT += subItem.WASHERCOUNT;
|
||
SMALLPARKING += subItem.SMALLPARKING;
|
||
PACKING += subItem.PACKING;
|
||
TRUCKPACKING += subItem.TRUCKPACKING;
|
||
DANPACKING += subItem.DANPACKING;
|
||
DININGROOMCOUNT += subItem.DININGROOMCOUNT;
|
||
HASBACKGROUNDRADIO += subItem.HASBACKGROUNDRADIO;
|
||
POINTCONTROLCOUNT += subItem.POINTCONTROLCOUNT;
|
||
REFUELINGGUN92 += subItem.REFUELINGGUN92;
|
||
REFUELINGGUN95 += subItem.REFUELINGGUN95;
|
||
REFUELINGGUN0 += subItem.REFUELINGGUN0;
|
||
|
||
if (subItem.HASPILOTLOUNGE) {
|
||
HASPILOTLOUNGE = true;
|
||
}
|
||
if (subItem.HASCHILD) {
|
||
HASCHILD = true;
|
||
}
|
||
});
|
||
}
|
||
|
||
item.imgList = [
|
||
{
|
||
url:
|
||
HASPANTRY > 0 || HASWIFI > 0
|
||
? "https://eshangtech.com/minTestImg/chargeImgNew/motherAndBaby.svg"
|
||
: "https://eshangtech.com/minTestImg/chargeImgNew/nomotherAndBaby.svg",
|
||
isShow: HASPANTRY > 0 || HASWIFI > 0,
|
||
title: "母婴室",
|
||
},
|
||
{
|
||
url:
|
||
HASPILOTLOUNGE > 0
|
||
? "https://eshangtech.com/minTestImg/chargeImgNew/HASPILOTLOUNGE.svg"
|
||
: "https://eshangtech.com/minTestImg/chargeImgNew/noHASPILOTLOUNGE.svg",
|
||
isShow: HASPILOTLOUNGE > 0,
|
||
title: "司机之家",
|
||
},
|
||
{
|
||
url: HASCHILD
|
||
? "https://eshangtech.com/minTestImg/chargeImgNew/HASCHILD.svg"
|
||
: "https://eshangtech.com/minTestImg/chargeImgNew/noHASCHILD.svg",
|
||
isShow: SMALLPARKING,
|
||
title: "车辆维修",
|
||
},
|
||
{
|
||
url:
|
||
DININGROOMCOUNT > 0
|
||
? "https://eshangtech.com/minTestImg/chargeImgNew/DININGROOMCOUNT.svg"
|
||
: "https://eshangtech.com/minTestImg/chargeImgNew/noDININGROOMCOUNT.svg",
|
||
isShow: DININGROOMCOUNT > 0,
|
||
title: "餐饮",
|
||
},
|
||
{
|
||
url:
|
||
HASBACKGROUNDRADIO > 0
|
||
? "https://eshangtech.com/minTestImg/chargeImgNew/HASBACKGROUNDRADIO.svg"
|
||
: "https://eshangtech.com/minTestImg/chargeImgNew/noHASBACKGROUNDRADIO.svg",
|
||
isShow: HASBACKGROUNDRADIO > 0,
|
||
title: "便利店",
|
||
},
|
||
|
||
{
|
||
url:
|
||
HASPANTRY > 0 || HASWIFI > 0
|
||
? "https://eshangtech.com/minTestImg/chargeImgNew/WC.svg"
|
||
: "https://eshangtech.com/minTestImg/chargeImgNew/noWC.svg",
|
||
isShow: HASPANTRY > 0,
|
||
title: "卫生间",
|
||
},
|
||
|
||
{
|
||
url:
|
||
SMALLPARKING > 0 ||
|
||
PACKING > 0 ||
|
||
TRUCKPACKING > 0 ||
|
||
DANPACKING > 0
|
||
? "https://eshangtech.com/minTestImg/chargeImgNew/SMALLPARKING.svg"
|
||
: "https://eshangtech.com/minTestImg/chargeImgNew/noSMALLPARKING.svg",
|
||
isShow:
|
||
SMALLPARKING > 0 ||
|
||
PACKING > 0 ||
|
||
TRUCKPACKING > 0 ||
|
||
DANPACKING > 0,
|
||
title: "停车场",
|
||
},
|
||
{
|
||
url:
|
||
REFUELINGGUN92 > 0 ||
|
||
REFUELINGGUN95 > 0 ||
|
||
REFUELINGGUN0 > 0
|
||
? "https://eshangtech.com/minTestImg/chargeImgNew/REFUELINGGUN.svg"
|
||
: "https://eshangtech.com/minTestImg/chargeImgNew/noREFUELINGGUN.svg",
|
||
isShow:
|
||
REFUELINGGUN92 > 0 ||
|
||
REFUELINGGUN95 > 0 ||
|
||
REFUELINGGUN0 > 0,
|
||
title: "加油站",
|
||
},
|
||
{
|
||
url:
|
||
LIAUTOCHARGESum > 0 ||
|
||
STATEGRIDCHARGESum > 0 ||
|
||
GACENERGYCHARGESum > 0
|
||
? "https://eshangtech.com/minTestImg/chargeImgNew/chargingStation.svg"
|
||
: "https://eshangtech.com/minTestImg/chargeImgNew/nochargingStation.svg",
|
||
isShow:
|
||
LIAUTOCHARGESum > 0 ||
|
||
STATEGRIDCHARGESum > 0 ||
|
||
GACENERGYCHARGESum > 0,
|
||
title: "充电桩",
|
||
},
|
||
|
||
{
|
||
url:
|
||
POINTCONTROLCOUNT > 0
|
||
? "https://eshangtech.com/minTestImg/chargeImgNew/POINTCONTROLCOUNT.svg"
|
||
: "https://eshangtech.com/minTestImg/chargeImgNew/noPOINTCONTROLCOUNT.svg",
|
||
isShow: POINTCONTROLCOUNT > 0,
|
||
title: "客房",
|
||
},
|
||
{
|
||
url:
|
||
HASSHOWERROOM > 0
|
||
? "https://eshangtech.com/minTestImg/HASSHOWERROOM.svg"
|
||
: "https://eshangtech.com/minTestImg/noHASSHOWERROOM.svg",
|
||
isShow: HASSHOWERROOM > 0,
|
||
title: "淋浴房",
|
||
},
|
||
]
|
||
});
|
||
}
|
||
|
||
// 拿到电价数据
|
||
list = await this.handleGetChargeData(list, idList)
|
||
// 拿到油价数据
|
||
list = await this.handleGetOilData(list, idList)
|
||
|
||
this.serviceList = list;
|
||
this.chaegeBoxList = nameList;
|
||
console.log("this.chaegeBoxList", this.chaegeBoxList);
|
||
},
|
||
},
|
||
};
|
||
</script>
|
||
<style scoped lang="stylus">
|
||
.main {
|
||
height: 100vh;
|
||
width: 100%;
|
||
position: relative;
|
||
|
||
.leftArrow {
|
||
width: 24px;
|
||
height: 24px;
|
||
position: absolute;
|
||
left: 16px;
|
||
z-index: 99999999999;
|
||
|
||
.img {
|
||
width: 100%;
|
||
height: 100%;
|
||
}
|
||
}
|
||
|
||
.mapBox {
|
||
position: absolute;
|
||
top: 0;
|
||
left: 0;
|
||
width: 100%;
|
||
height: 40vh;
|
||
|
||
.map {
|
||
width: 100%;
|
||
height: 40vh;
|
||
}
|
||
|
||
.ydBox {
|
||
width: 40px;
|
||
height: 40px;
|
||
background: #fff;
|
||
border-radius: 50%;
|
||
position: absolute;
|
||
bottom: 40px;
|
||
left: 16px;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
|
||
.ydIcon {
|
||
width: 30px;
|
||
height: 30px;
|
||
}
|
||
}
|
||
}
|
||
|
||
.list {
|
||
width: 100%;
|
||
height: calc(60vh + 20px);
|
||
box-sizing: border-box;
|
||
transform: translateY(-20px);
|
||
background: #F2F4F5;
|
||
position: absolute;
|
||
top: 40vh;
|
||
|
||
.top {
|
||
width: 100%;
|
||
height: 74px;
|
||
padding: 0 16px;
|
||
// border-radius: 20px 20px 0 0;
|
||
box-sizing: border-box;
|
||
background: #fff;
|
||
box-shadow: 0 4px 4px 0 rgba(22, 0, 2, 0.04);
|
||
|
||
.topImg {
|
||
display: flex;
|
||
justify-content: center;
|
||
|
||
.packUp {
|
||
width: 26px;
|
||
height: 5px;
|
||
margin-top: 8px;
|
||
}
|
||
}
|
||
|
||
.search {
|
||
width: 100%;
|
||
height: 36px;
|
||
background: #F2F4F5;
|
||
border-radius: 4px;
|
||
margin-top: 13px;
|
||
box-sizing: border-box;
|
||
padding: 8px 24rpx;
|
||
display: flex;
|
||
align-items: center;
|
||
|
||
.left {
|
||
width: 40%;
|
||
position: relative;
|
||
|
||
.pick {
|
||
.box {
|
||
display: flex;
|
||
align-items: center;
|
||
|
||
.picker {
|
||
font-size: 14px;
|
||
font-family: PingFangSC-Regular, PingFang SC;
|
||
font-weight: 400;
|
||
color: #160002;
|
||
line-height: 20px;
|
||
}
|
||
|
||
.selectIcon {
|
||
width: 15px;
|
||
height: 15px;
|
||
margin-left: 6px;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
.left:after {
|
||
content: '';
|
||
width: 2px;
|
||
height: 20px;
|
||
position: absolute;
|
||
right: 0;
|
||
top: 0;
|
||
background: #E1DFDF;
|
||
}
|
||
|
||
.right {
|
||
width: 100%;
|
||
|
||
.searchText {
|
||
font-size: 14px;
|
||
font-family: PingFangSC-Regular, PingFang SC;
|
||
font-weight: 400;
|
||
color: #A69E9F;
|
||
line-height: 20px;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
.serviceList {
|
||
width: 100%;
|
||
height: calc(100% - 90px);
|
||
box-sizing: border-box;
|
||
padding: 32rpx 16px;
|
||
overflow-y: auto;
|
||
|
||
.serviceItem {
|
||
width: 100%;
|
||
padding: 12px;
|
||
box-sizing: border-box;
|
||
background: #FFFFFF;
|
||
border-radius: 8rpx;
|
||
border: 2rpx solid #F5F6F7;
|
||
margin-bottom: 12px;
|
||
|
||
.topItem {
|
||
display: flex;
|
||
justify-content: space-between;
|
||
align-items: center;
|
||
|
||
.leftItem {
|
||
display: flex;
|
||
align-items: center;
|
||
|
||
.title {
|
||
font-family: PingFangSC, PingFang SC;
|
||
font-weight: 400;
|
||
font-size: 32rpx;
|
||
color: #130F05;
|
||
line-height: 44rpx;
|
||
text-align: left;
|
||
font-style: normal;
|
||
margin-right: 12rpx;
|
||
}
|
||
|
||
.typeBox {
|
||
// background: linear-gradient(180deg, rgba(49, 144, 255, 0.2) 0%, rgba(22, 87, 255, 0.2) 100%);
|
||
background: #FEF7E5;
|
||
border-radius: 4rpx;
|
||
padding: 0 8rpx;
|
||
font-size: 24rpx;
|
||
font-family: PingFangSC, PingFang SC;
|
||
font-weight: 400;
|
||
// color: #1E67FF;
|
||
color: #BA922F;
|
||
line-height: 40rpx;
|
||
// margin-left: 16rpx;
|
||
}
|
||
}
|
||
|
||
.box {
|
||
display: flex;
|
||
align-items: center;
|
||
|
||
.imgBox {
|
||
width: 28px;
|
||
height: 28px;
|
||
// border: 1px solid #F1F1F1;
|
||
// overflow: hidden;
|
||
margin-right: 16px;
|
||
border-radius: 50%;
|
||
background: #F5F6F7;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
|
||
.icon {
|
||
width: 32rpx;
|
||
height: 32rpx;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
.distance {
|
||
font-size: 12px;
|
||
font-family: PingFangSC-Regular, PingFang SC;
|
||
font-weight: 400;
|
||
color: #786B6C;
|
||
line-height: 18px;
|
||
|
||
.number {
|
||
color: #D7000F;
|
||
margin: 0 2px;
|
||
}
|
||
}
|
||
|
||
.info {
|
||
display: flex;
|
||
align-items: center;
|
||
margin-top: 4px;
|
||
|
||
.time {
|
||
font-size: 12px;
|
||
font-family: PingFangSC-Regular, PingFang SC;
|
||
font-weight: 400;
|
||
color: #786B6C;
|
||
line-height: 18px;
|
||
}
|
||
|
||
.infoIcon {
|
||
width: 24rpx;
|
||
height: 24rpx;
|
||
margin-right: 8rpx;
|
||
}
|
||
|
||
.addressBox, .time {
|
||
display: flex;
|
||
align-items: center;
|
||
width: 100%;
|
||
|
||
.distance {
|
||
color: #130F05;
|
||
margin-right: 4rpx;
|
||
}
|
||
|
||
.line {
|
||
width: 1px;
|
||
height: 24rpx;
|
||
background: #E7E7E6;
|
||
margin: 0 12rpx;
|
||
}
|
||
|
||
.address {
|
||
font-size: 12px;
|
||
font-family: PingFangSC-Regular, PingFang SC;
|
||
font-weight: 400;
|
||
color: #786B6C;
|
||
line-height: 18px;
|
||
}
|
||
}
|
||
}
|
||
|
||
.typeList {
|
||
margin-top: 8px;
|
||
display: flex;
|
||
align-items: center;
|
||
|
||
.typeItem {
|
||
width: 40rpx;
|
||
height: 40rpx;
|
||
margin-right: 16rpx;
|
||
}
|
||
}
|
||
|
||
.centerItem {
|
||
width: 100%;
|
||
box-sizing: border-box;
|
||
margin-top: 24rpx;
|
||
display: flex;
|
||
align-items: center;
|
||
flex-wrap: wrap;
|
||
|
||
.centerConfigItem {
|
||
width: calc((100% / 5));
|
||
display: flex;
|
||
flex-direction: column;
|
||
align-items: center;
|
||
justify-content: center;
|
||
margin-bottom: 24rpx;
|
||
|
||
.configImg {
|
||
width: 32rpx;
|
||
height: 32rpx;
|
||
// margin-right: 8rpx;
|
||
margin-bottom: 8rpx;
|
||
}
|
||
|
||
.configText {
|
||
font-family: 'PingFang SC', 'Noto Sans CJK SC', 'Microsoft YaHei', sans-serif;
|
||
font-weight: 400;
|
||
font-size: 24rpx;
|
||
color: #130f05;
|
||
line-height: 40rpx;
|
||
}
|
||
}
|
||
|
||
.centerConfigItemNew {
|
||
width: calc((100% / 6));
|
||
display: flex;
|
||
flex-direction: column;
|
||
align-items: center;
|
||
justify-content: center;
|
||
margin-bottom: 24rpx;
|
||
|
||
.configImg {
|
||
width: 48rpx;
|
||
height: 48rpx;
|
||
// margin-right: 8rpx;
|
||
margin-bottom: 8rpx;
|
||
}
|
||
|
||
.configText {
|
||
font-family: 'PingFang SC', 'Noto Sans CJK SC', 'Microsoft YaHei', sans-serif;
|
||
font-weight: 400;
|
||
font-size: 24rpx;
|
||
color: #130f05;
|
||
line-height: 40rpx;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
.serviceList ::-webkit-box{
|
||
display: none;
|
||
}
|
||
}
|
||
}
|
||
</style>
|