2842 lines
90 KiB
Vue
2842 lines
90 KiB
Vue
<template>
|
||
<view class="main">
|
||
<view
|
||
class="topBox"
|
||
:style="{
|
||
height: `${loginType === 'min' ? menu.bottom + 8 : ''}px`,
|
||
paddingTop: `${menu.top}px`,
|
||
}"
|
||
>
|
||
<view class="topContent">
|
||
<view class="backIconBox" @click="handleBack">
|
||
<image
|
||
class="backIcon"
|
||
src="https://eshangtech.com/wanmeiyizhanImg/home/brankBlackArrow.svg"
|
||
/>
|
||
</view>
|
||
<view class="currentServiceBox" @click="goSelectServer">
|
||
<image
|
||
class="servicePosition"
|
||
src="https://eshangtech.com/wanmeiyizhanImg/home/blackFixed.png"
|
||
/>
|
||
<text class="currentService">{{ detailInfo.SERVERPART_NAME }}</text>
|
||
<image
|
||
class="rightArrow"
|
||
src="https://eshangtech.com/wanmeiyizhanImg/home/rightArrow.svg"
|
||
/>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
|
||
<view
|
||
class="content"
|
||
:style="{ paddingTop: `${loginType === 'min' ? menu.bottom + 8 : ''}px` }"
|
||
>
|
||
<!-- 服务区照片 服务区距离名字信息 -->
|
||
<view class="serviceDetail">
|
||
<view class="detailTop">
|
||
<view
|
||
class="serviceImg"
|
||
v-if="detailInfo.ImageLits && detailInfo.ImageLits.length > 0"
|
||
>
|
||
<swiper
|
||
scroll-x="true"
|
||
circular="true"
|
||
class="banner"
|
||
indicator-dots="true"
|
||
indicator-active-color="#272625"
|
||
autoplay
|
||
interval="3000"
|
||
style="width: 100%; height: 100%"
|
||
>
|
||
<swiper-item
|
||
v-for="(img, i) in detailInfo.ImageLits"
|
||
:key="i"
|
||
style="width: 100%; height: 100%"
|
||
>
|
||
<image
|
||
style="width: 100%; height: 100%"
|
||
mode="aspectFill"
|
||
lazy-load="true"
|
||
:src="img"
|
||
></image>
|
||
</swiper-item>
|
||
</swiper>
|
||
</view>
|
||
|
||
<view class="noDataBg" v-else></view>
|
||
</view>
|
||
<view class="detailBottom">
|
||
<view class="detailFirst">
|
||
<text class="serviceName">{{
|
||
detailInfo.SERVERPART_NAME || ""
|
||
}}</text>
|
||
<text class="serviceStatus">营业中</text>
|
||
</view>
|
||
<view class="detailSecond">
|
||
<image
|
||
class="detailFixedIcon"
|
||
src="https://eshangtech.com/wanmeiyizhanImg/home/address.png"
|
||
/>
|
||
<text class="address">
|
||
<text class="distance"
|
||
>{{
|
||
detailInfo.SERVERPART_DISTANCE === 0
|
||
? 0
|
||
: detailInfo.SERVERPART_DISTANCE || "-"
|
||
}}km</text
|
||
>
|
||
<text class="addressText"
|
||
>{{ detailInfo.ServerpartInfo.SERVERPART_ADDRESS || "-"
|
||
}}{{ detailInfo.ServerpartInfo.EXPRESSWAY_NAME || "-" }}</text
|
||
>
|
||
</text>
|
||
</view>
|
||
<view class="navigationBox" @click="handleGomap">
|
||
<image
|
||
class="navigationIcon"
|
||
src="https://eshangtech.com/wanmeiyizhanImg/home/map.png"
|
||
/>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
|
||
<!-- 加油 充电 停车场 -->
|
||
<view class="carDetailBox" v-if="false">
|
||
<view class="detailTab">
|
||
<view
|
||
:class="
|
||
firstTab === item.value ? 'tabItem selectTabItem' : 'tabItem'
|
||
"
|
||
v-for="(item, index) in firstTabList"
|
||
:key="index"
|
||
@click="handleChangeFirstTab(item)"
|
||
>
|
||
{{ item.label }}
|
||
</view>
|
||
</view>
|
||
<view class="firstContent">
|
||
<!-- 加油 -->
|
||
<view class="gasContent" v-if="firstTab === 1">
|
||
<view class="gasItem">
|
||
<image
|
||
class="gasItemIcon"
|
||
src="https://eshangtech.com/wanmeiyizhanImg/home/92Icon.svg"
|
||
/>
|
||
<span class="label">#加油枪</span>
|
||
<span class="value">{{
|
||
detailInfo.sumDetail.REFUELINGGUN92 || "-"
|
||
}}</span>
|
||
</view>
|
||
<view class="gasItem">
|
||
<image
|
||
class="gasItemIcon"
|
||
src="https://eshangtech.com/wanmeiyizhanImg/home/95Icon.svg"
|
||
/>
|
||
<span class="label">#加油枪</span>
|
||
<span class="value">{{
|
||
detailInfo.sumDetail.REFUELINGGUN95 || "-"
|
||
}}</span>
|
||
</view>
|
||
<view class="gasItem">
|
||
<image
|
||
class="gasItemIcon"
|
||
src="https://eshangtech.com/wanmeiyizhanImg/home/zeroIcon.svg"
|
||
/>
|
||
<span class="label">#加油枪</span>
|
||
<span class="value">{{
|
||
detailInfo.sumDetail.REFUELINGGUN0 || "-"
|
||
}}</span>
|
||
</view>
|
||
</view>
|
||
<!-- 充电信息 -->
|
||
<view class="chargeContent" v-if="firstTab === 2">
|
||
<view class="chargeItem">
|
||
<view class="itemLeft">
|
||
<img
|
||
class="imgIcon"
|
||
src="https://eshangtech.com/minTestImg/LXIcon.png"
|
||
/>
|
||
<span class="chargeTypeName">理想</span>
|
||
</view>
|
||
<view class="itemRight">
|
||
<span class="emptyText">空</span>
|
||
<span class="use">{{
|
||
detailInfo.LXDetail && detailInfo.LXDetail.LXEmpty
|
||
? detailInfo.LXDetail.LXEmpty
|
||
: "0"
|
||
}}</span>
|
||
<span class="sum"
|
||
>/{{
|
||
detailInfo.LXDetail && detailInfo.LXDetail.LXSum
|
||
? detailInfo.LXDetail.LXSum
|
||
: "0"
|
||
}}</span
|
||
>
|
||
</view>
|
||
</view>
|
||
|
||
<view class="chargeItem">
|
||
<view class="itemLeft">
|
||
<img
|
||
class="imgIcon"
|
||
src="https://eshangtech.com/minTestImg/WLIcon.png"
|
||
/>
|
||
<span class="chargeTypeName">蔚来</span>
|
||
</view>
|
||
<view class="itemRight">
|
||
<span class="emptyText">空</span>
|
||
<span class="use">{{
|
||
detailInfo.WLDetail && detailInfo.WLDetail.WLEmpty
|
||
? detailInfo.WLDetail.WLEmpty
|
||
: "0"
|
||
}}</span>
|
||
<span class="sum"
|
||
>/{{
|
||
detailInfo.WLDetail && detailInfo.WLDetail.WLSum
|
||
? detailInfo.WLDetail.WLSum
|
||
: "0"
|
||
}}</span
|
||
>
|
||
</view>
|
||
</view>
|
||
|
||
<view class="chargeItem">
|
||
<view class="itemLeft">
|
||
<img
|
||
class="imgIcon"
|
||
src="https://eshangtech.com/wanmeiyizhanImg/home/sunIcon.svg"
|
||
/>
|
||
<span class="chargeTypeName">新能源</span>
|
||
</view>
|
||
<view class="itemRight">
|
||
<span class="emptyText">空</span>
|
||
<span class="use">{{
|
||
detailInfo.SunDetail && detailInfo.SunDetail.SunEmpty
|
||
? detailInfo.SunDetail.SunEmpty
|
||
: "0"
|
||
}}</span>
|
||
<span class="sum"
|
||
>/{{
|
||
detailInfo.SunDetail && detailInfo.SunDetail.SunSum
|
||
? detailInfo.SunDetail.SunSum
|
||
: "0"
|
||
}}</span
|
||
>
|
||
</view>
|
||
</view>
|
||
|
||
<view class="chargeItem" style="margin-bottom: 0">
|
||
<view class="itemLeft">
|
||
<img
|
||
class="imgIcon"
|
||
src="https://eshangtech.com/minTestImg/stateGridIcon.png"
|
||
/>
|
||
<span class="chargeTypeName">国网</span>
|
||
</view>
|
||
<view class="itemRight">
|
||
<span class="emptyText">空</span>
|
||
<span class="use">{{
|
||
detailInfo.chargeAndReplaceDetail &&
|
||
detailInfo.chargeAndReplaceDetail.chargeAndReplace
|
||
? detailInfo.chargeAndReplaceDetail.chargeAndReplace
|
||
: "0"
|
||
}}</span>
|
||
<span class="sum"
|
||
>/{{
|
||
detailInfo.chargeAndReplaceDetail &&
|
||
detailInfo.chargeAndReplaceDetail.chargeAndReplaceSum
|
||
? detailInfo.chargeAndReplaceDetail.chargeAndReplaceSum
|
||
: "0"
|
||
}}</span
|
||
>
|
||
</view>
|
||
</view>
|
||
|
||
<view class="stateGrid" v-if="false">
|
||
<view class="leftGrid">
|
||
<!-- <image class="gridImg" src="https://eshangtech.com/wanmeiyizhanImg/home/stateGrid.png" /> -->
|
||
<text class="gridText">充电桩</text>
|
||
</view>
|
||
<view class="rightGrid">
|
||
<text class="other">空</text>
|
||
<text class="have">{{ chargingObj.use || "0" }}</text>
|
||
<text class="all" v-if="chargingObj.have > 0"
|
||
>/{{ chargingObj.have || "0" }}</text
|
||
>
|
||
<text class="all" v-else
|
||
>/{{ detailInfo.sumDetail.LIVESTOCKPACKING || "0" }}</text
|
||
>
|
||
</view>
|
||
</view>
|
||
<view class="stateGrid" v-if="false">
|
||
<view class="leftGrid">
|
||
<!-- <image class="gridImg" src="https://eshangtech.com/wanmeiyizhanImg/home/stateGrid.png" /> -->
|
||
<text class="gridText">国网</text>
|
||
</view>
|
||
<view class="rightGrid">
|
||
<text class="other">空</text>
|
||
<text class="have">{{ chargingObj.use || "0" }}</text>
|
||
<text class="all" v-if="chargingObj.have > 0"
|
||
>/{{ chargingObj.have || "0" }}</text
|
||
>
|
||
<text class="all" v-else
|
||
>/{{ detailInfo.sumDetail.STATEGRIDCHARGE || "0" }}</text
|
||
>
|
||
</view>
|
||
</view>
|
||
<view class="stateGrid" v-if="false">
|
||
<view class="leftGrid">
|
||
<!-- <image class="gridImg" src="https://eshangtech.com/wanmeiyizhanImg/home/stateGrid.png" /> -->
|
||
<text class="gridText">理想5C</text>
|
||
</view>
|
||
<view class="rightGrid">
|
||
<text class="other">空</text>
|
||
<text class="have">{{ chargingObj.use || "0" }}</text>
|
||
<text class="all" v-if="chargingObj.have > 0"
|
||
>/{{ chargingObj.have || "0" }}</text
|
||
>
|
||
<text class="all" v-else
|
||
>/{{ detailInfo.sumDetail.LIAUTOCHARGE || "0" }}</text
|
||
>
|
||
</view>
|
||
</view>
|
||
<view class="stateGrid" v-if="false">
|
||
<view class="leftGrid">
|
||
<!-- <image class="gridImg" src="https://eshangtech.com/wanmeiyizhanImg/home/stateGrid.png" /> -->
|
||
<text class="gridText">广汽能源</text>
|
||
</view>
|
||
<view class="rightGrid">
|
||
<text class="other">空</text>
|
||
<text class="have">{{ chargingObj.use || "0" }}</text>
|
||
<text class="all" v-if="chargingObj.have > 0"
|
||
>/{{ chargingObj.have || "0" }}</text
|
||
>
|
||
<text class="all" v-else
|
||
>/{{ detailInfo.sumDetail.GACENERGYCHARGE || "0" }}</text
|
||
>
|
||
</view>
|
||
</view>
|
||
<view class="stateGrid" v-if="false">
|
||
<view class="leftGrid">
|
||
<!-- <image class="gridImg" src="https://eshangtech.com/wanmeiyizhanImg/home/stateGrid.png" /> -->
|
||
<text class="gridText">其他</text>
|
||
</view>
|
||
<view class="rightGrid">
|
||
<text class="other">空</text>
|
||
<text class="have">{{ chargingObj.use || "0" }}</text>
|
||
<text class="all" v-if="chargingObj.have > 0"
|
||
>/{{ chargingObj.have || "0" }}</text
|
||
>
|
||
<text class="all" v-else
|
||
>/{{ detailInfo.sumDetail.OTHERCHARGE || "0" }}</text
|
||
>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<!-- 停车场信息 -->
|
||
<view class="carContent" v-if="firstTab === 3">
|
||
<view class="carItem">
|
||
<view class="carTop">
|
||
<image
|
||
class="carIcon"
|
||
:src="
|
||
detailInfo.sumDetail.SMALLPARKING
|
||
? 'https://eshangtech.com/wanmeiyizhanImg/home/carIcon.svg'
|
||
: 'https://eshangtech.com/wanmeiyizhanImg/home/noCarIcon.svg'
|
||
"
|
||
/>
|
||
</view>
|
||
<view class="carBottom">
|
||
<view class="carName">轿车车位</view>
|
||
<view class="carValue"
|
||
>{{ detailInfo.sumDetail.SMALLPARKING || "-"
|
||
}}<span class="unit">个</span></view
|
||
>
|
||
</view>
|
||
</view>
|
||
<view class="carItem">
|
||
<view class="carTop">
|
||
<image
|
||
class="carIcon"
|
||
:src="
|
||
detailInfo.sumDetail.PACKING
|
||
? 'https://eshangtech.com/wanmeiyizhanImg/home/bus.svg'
|
||
: 'https://eshangtech.com/wanmeiyizhanImg/home/noBus.svg'
|
||
"
|
||
/>
|
||
</view>
|
||
<view class="carBottom">
|
||
<view class="carName">客车车位</view>
|
||
<view class="carValue"
|
||
>{{ detailInfo.sumDetail.PACKING || "-" }}
|
||
<span class="unit">个</span>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view class="carItem">
|
||
<view class="carTop">
|
||
<image
|
||
class="carIcon"
|
||
:src="
|
||
detailInfo.sumDetail.TRUCKPACKING
|
||
? 'https://eshangtech.com/wanmeiyizhanImg/home/train.svg'
|
||
: 'https://eshangtech.com/wanmeiyizhanImg/home/noTrain.svg'
|
||
"
|
||
/>
|
||
</view>
|
||
<view class="carBottom">
|
||
<view class="carName">货车车位</view>
|
||
<view class="carValue"
|
||
>{{ detailInfo.sumDetail.TRUCKPACKING || "-"
|
||
}}<span class="unit">个</span></view
|
||
>
|
||
</view>
|
||
</view>
|
||
<view class="carItem" style="margin-top: 24rpx">
|
||
<view class="carTop">
|
||
<image
|
||
class="carIcon"
|
||
:src="
|
||
detailInfo.sumDetail.DANPACKING
|
||
? 'https://eshangtech.com/wanmeiyizhanImg/home/chemicals.svg'
|
||
: 'https://eshangtech.com/wanmeiyizhanImg/home/noChemicals.svg'
|
||
"
|
||
/>
|
||
</view>
|
||
<view class="carBottom">
|
||
<view class="carName">危化品车位</view>
|
||
<view class="carValue"
|
||
>{{ detailInfo.sumDetail.DANPACKING || "-"
|
||
}}<span class="unit">个</span></view
|
||
>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
|
||
<!-- 车辆维修 -->
|
||
<view class="vehicleMaintenance" v-if="firstTab === 4">
|
||
<!-- v-if="detailInfo.sumDetail.HASCHILD" -->
|
||
<view class="vehicleTitle">车辆维修</view>
|
||
<view class="vehicleContent">
|
||
<view class="vehicleContentLeft">
|
||
<view class="leftLabel">{{
|
||
detailInfo.sumDetail.REPAIR_TEL || "-"
|
||
}}</view>
|
||
<view class="onlineTime">营业时间：24小时</view>
|
||
</view>
|
||
<view
|
||
class="vehicleContentRight"
|
||
@click="handleCallPhone(detailInfo.sumDetail.REPAIR_TEL)"
|
||
>
|
||
<image
|
||
class="callPhone"
|
||
src="https://eshangtech.com/wanmeiyizhanImg/home/callPhoneIcon.svg"
|
||
/>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
|
||
<!-- 热门商家 -->
|
||
<view class="popularMerchants">
|
||
<view class="popularTitle">热门商家</view>
|
||
<template v-if="merchantList && merchantList.length > 0">
|
||
<div
|
||
class="newShopUnit"
|
||
v-for="(item, i) in merchantList"
|
||
:key="i"
|
||
@click="goShop(item)"
|
||
>
|
||
<div>
|
||
<div class="shopItemTop">
|
||
<div class="shopImg">
|
||
<image
|
||
class="shopIcon"
|
||
:src="
|
||
item.MERCHANTS_LOGO ||
|
||
'https://eshangtech.com/ShopICO/no-picture.png'
|
||
"
|
||
mode="aspectFit"
|
||
/>
|
||
</div>
|
||
<div class="shopDetail">
|
||
<div class="shopName">
|
||
<span class="shopTitle">{{ item.MERCHANTS_NAME }}</span>
|
||
<!-- <span class="titleIcon" v-if="item.SCANCODE_ORDER === 1"></span> -->
|
||
</div>
|
||
<div class="otherDetail">
|
||
<div class="leftDetail">
|
||
<span class="mark"
|
||
>{{ item.MERCHANTS_SCORE
|
||
}}<span class="unit">分</span></span
|
||
>
|
||
<span class="monthSales"
|
||
>月售{{ item.MONTHLYSALES || "-" }}</span
|
||
>
|
||
<span class="perCapita"
|
||
>人均 ￥{{ item.PERCAPITA || "-" }}</span
|
||
>
|
||
</div>
|
||
<div class="rightDetail">
|
||
<!-- <span class="perCapita"
|
||
>人均 ￥{{ item.PERCAPITA || "-" }}</span
|
||
> -->
|
||
<!-- <span
|
||
v-show="item.CouponList && item.CouponList.length > 0"
|
||
class="icon-coupon"
|
||
>优惠券</span
|
||
> -->
|
||
</div>
|
||
</div>
|
||
<div class="couponList">
|
||
<div
|
||
class="couponBox"
|
||
:style="{
|
||
right:
|
||
item.SCANCODE_ORDER === 1 &&
|
||
item.CouponList &&
|
||
item.CouponList.length > 0
|
||
? '160rpx'
|
||
: '0',
|
||
}"
|
||
v-if="item.CouponList && item.CouponList.length > 0"
|
||
>
|
||
<view class="couponIconBox">
|
||
<image
|
||
class="couponIcon"
|
||
src="https://eshangtech.com/wanmeiyizhanImg/home/useCoupon.svg"
|
||
/>
|
||
</view>
|
||
<span class="couponText">优惠券</span>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- 去点餐 -->
|
||
<div
|
||
class="goOrder"
|
||
v-if="item.SCANCODE_ORDER === 1"
|
||
@click.stop="goBuy(item)"
|
||
>
|
||
<image
|
||
class="orderIcon"
|
||
src="https://eshangtech.com/wanmeiyizhanImg/home/goOrderIcon.svg"
|
||
/>
|
||
<span class="goOrderText">去点餐</span>
|
||
</div>
|
||
<!-- 优惠券 -->
|
||
<!-- <div
|
||
class="couponBox"
|
||
:style="{
|
||
right:
|
||
item.SCANCODE_ORDER === 1 &&
|
||
item.CouponList &&
|
||
item.CouponList.length > 0
|
||
? '160rpx'
|
||
: '0',
|
||
}"
|
||
v-if="item.CouponList && item.CouponList.length > 0"
|
||
>
|
||
<image
|
||
class="couponIcon"
|
||
src="https://eshangtech.com/wanmeiyizhanImg/home/useCoupon.png"
|
||
/>
|
||
<span class="couponText">优惠券</span>
|
||
</div> -->
|
||
</div>
|
||
</div>
|
||
|
||
<div
|
||
class="shopList"
|
||
v-if="item.GoodsList && item.GoodsList.length > 0"
|
||
>
|
||
<div
|
||
class="shopItem"
|
||
v-for="(subItem, subIndex) in item.GoodsList"
|
||
:key="subIndex"
|
||
>
|
||
<div class="shopImgBox">
|
||
<image class="shopImg" :src="subItem.IMAGE_URL" />
|
||
</div>
|
||
<div class="shopName">{{ subItem.COMMODITY_NAME || "" }}</div>
|
||
<div class="itemPrice">
|
||
<span class="itemUnit">¥</span>
|
||
<span class="itemPrice">{{
|
||
subItem.COMMODITY_RETAILPRICE || ""
|
||
}}</span>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</template>
|
||
</view>
|
||
|
||
<!-- 卫生间 母婴室 司机之家 -->
|
||
<view class="otherFacilities">
|
||
<view class="detailTab">
|
||
<view
|
||
:class="
|
||
secondTab === item.value ? 'tabItem selectTabItem' : 'tabItem'
|
||
"
|
||
v-for="(item, index) in secondTabList"
|
||
:key="index"
|
||
@click="handleChangeSecondTab(item)"
|
||
>
|
||
{{ item.label }}
|
||
</view>
|
||
</view>
|
||
<view class="secondContent">
|
||
<view class="toiletBox" v-if="secondTab === 1">
|
||
<view class="toiletItem">
|
||
<view class="toiletItemLeft">
|
||
<image
|
||
class="icon"
|
||
src="https://eshangtech.com/wanmeiyizhanImg/home/manWCIcon.svg"
|
||
/>
|
||
</view>
|
||
<view class="toiletItemRight">
|
||
<view class="label">男厕</view>
|
||
<view class="value"
|
||
>{{ detailInfo.sumDetail.HASPANTRY
|
||
}}<span class="unit">个</span></view
|
||
>
|
||
</view>
|
||
|
||
<!-- <view class="toiletItemLeft">
|
||
<image class="toiletIcon" src="https://eshangtech.com/wanmeiyizhanImg/home/manWC.svg" />
|
||
<text class="toiletText">男厕</text>
|
||
</view>
|
||
<view class="toiletItemRight">
|
||
<text
|
||
class="rightText"
|
||
:style="{
|
||
color: detailInfo.sumDetail.HASPANTRY > 0 ? '#009F43' : '',
|
||
}"
|
||
>{{ detailInfo.sumDetail.HASPANTRY }}</text
|
||
>
|
||
</view> -->
|
||
</view>
|
||
<view class="toiletItem">
|
||
<view class="toiletItemLeft">
|
||
<image
|
||
class="icon"
|
||
src="https://eshangtech.com/wanmeiyizhanImg/home/womanWCIcon.svg"
|
||
/>
|
||
</view>
|
||
<view class="toiletItemRight">
|
||
<view class="label">女厕</view>
|
||
<view class="value"
|
||
>{{ detailInfo.sumDetail.HASWIFI
|
||
}}<span class="unit">个</span></view
|
||
>
|
||
</view>
|
||
|
||
<!-- <view class="toiletItemLeft">
|
||
<image
|
||
class="toiletIcon"
|
||
src="https://eshangtech.com/wanmeiyizhanImg/home/woManWC.svg"
|
||
/>
|
||
<text class="toiletText">女厕</text>
|
||
</view>
|
||
<view class="toiletItemRight">
|
||
<text
|
||
class="rightText"
|
||
:style="{
|
||
color: detailInfo.sumDetail.HASWIFI > 0 ? '#009F43' : '',
|
||
}"
|
||
>{{ detailInfo.sumDetail.HASWIFI }}</text
|
||
>
|
||
</view> -->
|
||
</view>
|
||
<view class="toiletItem">
|
||
<view class="toiletItemLeft">
|
||
<image
|
||
class="icon"
|
||
src="https://eshangtech.com/wanmeiyizhanImg/home/tideToiletSeat.svg"
|
||
/>
|
||
</view>
|
||
<view class="toiletItemRight">
|
||
<view class="label">潮汐厕位</view>
|
||
<view class="value"
|
||
>{{ detailInfo.sumDetail.TOILETCOUNT
|
||
}}<span class="unit">个</span></view
|
||
>
|
||
</view>
|
||
<!-- <view class="toiletItemLeft">
|
||
<image
|
||
class="toiletIcon"
|
||
src="https://eshangtech.com/wanmeiyizhanImg/home/tideToiletSeat.svg"
|
||
/>
|
||
<text class="toiletText">潮汐厕位</text>
|
||
</view>
|
||
<view class="toiletItemRight">
|
||
<text
|
||
class="rightText"
|
||
:style="{
|
||
color:
|
||
detailInfo.sumDetail.TOILETCOUNT > 0 ? '#009F43' : '',
|
||
}"
|
||
>{{ detailInfo.sumDetail.TOILETCOUNT }}</text
|
||
>
|
||
</view> -->
|
||
</view>
|
||
<view class="toiletItem">
|
||
<view class="toiletItemLeft">
|
||
<image
|
||
class="icon"
|
||
src="https://eshangtech.com/wanmeiyizhanImg/home/toiletPaperTowels.svg"
|
||
/>
|
||
</view>
|
||
<view class="toiletItemRight">
|
||
<view class="label">厕纸巾</view>
|
||
<view class="value"
|
||
>{{ detailInfo.sumDetail.TOILET_PAPER
|
||
}}<span class="unit">个</span></view
|
||
>
|
||
</view>
|
||
<!-- <view class="toiletItemLeft">
|
||
<image
|
||
class="toiletIcon"
|
||
src="https://eshangtech.com/wanmeiyizhanImg/home/toiletPaperTowels.svg"
|
||
/>
|
||
<text class="toiletText">厕纸巾</text>
|
||
</view>
|
||
<view class="toiletItemRight">
|
||
<text
|
||
class="rightText"
|
||
:style="{
|
||
color:
|
||
detailInfo.sumDetail.TOILET_PAPER > 0 ? '#009F43' : '',
|
||
}"
|
||
>{{ detailInfo.sumDetail.TOILET_PAPER }}</text
|
||
>
|
||
</view> -->
|
||
</view>
|
||
</view>
|
||
<view class="toiletBox" v-if="secondTab === 2">
|
||
<view class="toiletItem">
|
||
<view class="toiletItemLeft">
|
||
<image
|
||
class="icon"
|
||
src="https://eshangtech.com/wanmeiyizhanImg/home/waterDispenser.svg"
|
||
/>
|
||
</view>
|
||
<view class="toiletItemRight">
|
||
<view class="label">饮水机</view>
|
||
<view class="value"
|
||
>{{ detailInfo.sumDetail.MABROOMWATER_DISPENSER
|
||
}}<span class="unit">个</span></view
|
||
>
|
||
</view>
|
||
<!-- <view class="toiletItemLeft">
|
||
<image class="toiletIcon" src="https://eshangtech.com/wanmeiyizhanImg/home/manWC.svg" />
|
||
<text class="toiletText">饮水机</text>
|
||
</view>
|
||
<view class="toiletItemRight">
|
||
<text
|
||
class="rightText"
|
||
:style="{
|
||
color:
|
||
detailInfo.sumDetail.MABROOMWATER_DISPENSER > 0
|
||
? '#009F43'
|
||
: '',
|
||
}"
|
||
>{{ detailInfo.sumDetail.MABROOMWATER_DISPENSER }}</text
|
||
>
|
||
</view> -->
|
||
</view>
|
||
|
||
<view class="toiletItem">
|
||
<view class="toiletItemLeft">
|
||
<image
|
||
class="icon"
|
||
src="https://eshangtech.com/wanmeiyizhanImg/home/nursingTable.svg"
|
||
/>
|
||
</view>
|
||
<view class="toiletItemRight">
|
||
<view class="label">哺乳桌</view>
|
||
<view class="value"
|
||
>{{ detailInfo.sumDetail.NURSING_TABLE
|
||
}}<span class="unit">个</span></view
|
||
>
|
||
</view>
|
||
<!-- <view class="toiletItemLeft">
|
||
<image class="toiletIcon" src="https://eshangtech.com/wanmeiyizhanImg/home/manWC.svg" />
|
||
<text class="toiletText">哺乳桌</text>
|
||
</view>
|
||
<view class="toiletItemRight">
|
||
<text
|
||
class="rightText"
|
||
:style="{
|
||
color:
|
||
detailInfo.sumDetail.NURSING_TABLE > 0 ? '#009F43' : '',
|
||
}"
|
||
>{{ detailInfo.sumDetail.NURSING_TABLE }}</text
|
||
>
|
||
</view> -->
|
||
</view>
|
||
|
||
<view class="toiletItem">
|
||
<view class="toiletItemLeft">
|
||
<image
|
||
class="icon"
|
||
src="https://eshangtech.com/wanmeiyizhanImg/home/crib.svg"
|
||
/>
|
||
</view>
|
||
<view class="toiletItemRight">
|
||
<view class="label">婴儿床</view>
|
||
<view class="value"
|
||
>{{ detailInfo.sumDetail.BABY_COT
|
||
}}<span class="unit">个</span></view
|
||
>
|
||
</view>
|
||
<!-- <view class="toiletItemLeft">
|
||
<image class="toiletIcon" src="https://eshangtech.com/wanmeiyizhanImg/home/manWC.svg" />
|
||
<text class="toiletText">婴儿床</text>
|
||
</view>
|
||
<view class="toiletItemRight">
|
||
<text
|
||
class="rightText"
|
||
:style="{
|
||
color: detailInfo.sumDetail.BABY_COT > 0 ? '#009F43' : '',
|
||
}"
|
||
>{{ detailInfo.sumDetail.BABY_COT }}</text
|
||
>
|
||
</view> -->
|
||
</view>
|
||
|
||
<view class="toiletItem">
|
||
<view class="toiletItemLeft">
|
||
<image
|
||
class="icon"
|
||
src="https://eshangtech.com/wanmeiyizhanImg/home/changingTable.svg"
|
||
/>
|
||
</view>
|
||
<view class="toiletItemRight">
|
||
<view class="label">尿布台</view>
|
||
<view class="value"
|
||
>{{ detailInfo.sumDetail.CHANGING_TABLE
|
||
}}<span class="unit">个</span></view
|
||
>
|
||
</view>
|
||
<!-- <view class="toiletItemLeft">
|
||
<image class="toiletIcon" src="https://eshangtech.com/wanmeiyizhanImg/home/manWC.svg" />
|
||
<text class="toiletText">尿布台</text>
|
||
</view>
|
||
<view class="toiletItemRight">
|
||
<text
|
||
class="rightText"
|
||
:style="{
|
||
color:
|
||
detailInfo.sumDetail.CHANGING_TABLE > 0 ? '#009F43' : '',
|
||
}"
|
||
>{{ detailInfo.sumDetail.CHANGING_TABLE }}</text
|
||
>
|
||
</view> -->
|
||
</view>
|
||
</view>
|
||
<view class="toiletBox" v-if="secondTab === 3">
|
||
<view class="toiletItem">
|
||
<view class="toiletItemLeft">
|
||
<image
|
||
class="icon"
|
||
src="https://eshangtech.com/wanmeiyizhanImg/home/showerRoom.svg"
|
||
/>
|
||
</view>
|
||
<view class="toiletItemRight">
|
||
<view class="label">淋浴间</view>
|
||
<view class="value">{{
|
||
detailInfo.sumDetail.SHOWERROOM === 0
|
||
? "无"
|
||
: detailInfo.sumDetail.SHOWERROOM === 1
|
||
? "有"
|
||
: detailInfo.sumDetail.SHOWERROOM === 2
|
||
? "热水"
|
||
: "-"
|
||
}}</view>
|
||
</view>
|
||
<!-- <view class="toiletItemLeft">
|
||
<image
|
||
class="toiletIcon"
|
||
src="https://eshangtech.com/wanmeiyizhanImg/home/showerRoom.svg"
|
||
/>
|
||
<text class="toiletText">淋浴间</text>
|
||
</view>
|
||
<view class="toiletItemRight">
|
||
<text
|
||
class="rightText"
|
||
:style="{
|
||
color: detailInfo.sumDetail.SHOWERROOM > 0 ? '#009F43' : '',
|
||
}"
|
||
>{{
|
||
detailInfo.sumDetail.SHOWERROOM === 0
|
||
? "无"
|
||
: detailInfo.sumDetail.SHOWERROOM === 1
|
||
? "有"
|
||
: detailInfo.sumDetail.SHOWERROOM === 2
|
||
? "热水"
|
||
: "-"
|
||
}}</text
|
||
>
|
||
</view> -->
|
||
</view>
|
||
<view class="toiletItem">
|
||
<view class="toiletItemLeft">
|
||
<image
|
||
class="icon"
|
||
src="https://eshangtech.com/wanmeiyizhanImg/home/waterBoiler.svg"
|
||
/>
|
||
</view>
|
||
<view class="toiletItemRight">
|
||
<view class="label">饮水机</view>
|
||
<view class="value"
|
||
>{{ detailInfo.sumDetail.DROOMWATER_DISPENSER
|
||
}}<span class="unit">个</span></view
|
||
>
|
||
</view>
|
||
<!-- <view class="toiletItemLeft">
|
||
<image
|
||
class="toiletIcon"
|
||
src="https://eshangtech.com/wanmeiyizhanImg/home/waterBoiler.svg"
|
||
/>
|
||
<text class="toiletText">饮水机</text>
|
||
</view>
|
||
<view class="toiletItemRight">
|
||
<text
|
||
class="rightText"
|
||
:style="{
|
||
color:
|
||
detailInfo.sumDetail.DROOMWATER_DISPENSER > 0
|
||
? '#009F43'
|
||
: '',
|
||
}"
|
||
>{{ detailInfo.sumDetail.DROOMWATER_DISPENSER }}</text
|
||
>
|
||
</view> -->
|
||
</view>
|
||
</view>
|
||
<view class="toiletBox" v-if="secondTab === 4">
|
||
<view class="toiletItem" v-if="false">
|
||
<view class="toiletItemLeft">
|
||
<image
|
||
class="icon"
|
||
src="https://eshangtech.com/wanmeiyizhanImg/home/showerRoom.svg"
|
||
/>
|
||
</view>
|
||
<view class="toiletItemRight">
|
||
<view class="label">淋浴间</view>
|
||
<view class="value"
|
||
>{{ detailInfo.sumDetail.HASSHOWERROOM
|
||
}}<span class="unit">个</span></view
|
||
>
|
||
</view>
|
||
<!-- <view class="toiletItemLeft">
|
||
<image
|
||
class="toiletIcon"
|
||
src="https://eshangtech.com/wanmeiyizhanImg/home/showerRoom.svg"
|
||
/>
|
||
<text class="toiletText">淋浴间</text>
|
||
</view>
|
||
<view class="toiletItemRight">
|
||
<text
|
||
class="rightText"
|
||
:style="{
|
||
color:
|
||
detailInfo.sumDetail.HASSHOWERROOM > 0 ? '#009F43' : '',
|
||
}"
|
||
>{{ detailInfo.sumDetail.HASSHOWERROOM }}</text
|
||
>
|
||
</view> -->
|
||
</view>
|
||
<view class="toiletItem">
|
||
<view class="toiletItemLeft">
|
||
<image
|
||
class="icon"
|
||
src="https://eshangtech.com/wanmeiyizhanImg/home/waterBoiler.svg"
|
||
/>
|
||
</view>
|
||
<view class="toiletItemRight">
|
||
<view class="label">开水器</view>
|
||
<view class="value"
|
||
>{{ detailInfo.sumDetail.HASWATERROOM
|
||
}}<span class="unit">个</span></view
|
||
>
|
||
</view>
|
||
<!-- <view class="toiletItemLeft">
|
||
<image
|
||
class="toiletIcon"
|
||
src="https://eshangtech.com/wanmeiyizhanImg/home/waterBoiler.svg"
|
||
/>
|
||
<text class="toiletText">开水器</text>
|
||
</view>
|
||
<view class="toiletItemRight">
|
||
<text
|
||
class="rightText"
|
||
:style="{
|
||
color:
|
||
detailInfo.sumDetail.HASWATERROOM > 0 ? '#009F43' : '',
|
||
}"
|
||
>{{ detailInfo.sumDetail.HASWATERROOM }}</text
|
||
>
|
||
</view> -->
|
||
</view>
|
||
<view class="toiletItem">
|
||
<view class="toiletItemLeft">
|
||
<image
|
||
class="icon"
|
||
src="https://eshangtech.com/wanmeiyizhanImg/home/microwave.svg"
|
||
/>
|
||
</view>
|
||
<view class="toiletItemRight">
|
||
<view class="label">微波炉</view>
|
||
<view class="value"
|
||
>{{ detailInfo.sumDetail.MICROWAVEOVEN
|
||
}}<span class="unit">个</span></view
|
||
>
|
||
</view>
|
||
<!-- <view class="toiletItemLeft">
|
||
<image
|
||
class="toiletIcon"
|
||
src="https://eshangtech.com/wanmeiyizhanImg/home/microwave.svg"
|
||
/>
|
||
<text class="toiletText">微波炉</text>
|
||
</view>
|
||
<view class="toiletItemRight">
|
||
<text
|
||
class="rightText"
|
||
:style="{
|
||
color:
|
||
detailInfo.sumDetail.MICROWAVEOVEN > 0 ? '#009F43' : '',
|
||
}"
|
||
>{{ detailInfo.sumDetail.MICROWAVEOVEN }}</text
|
||
>
|
||
</view> -->
|
||
</view>
|
||
<view class="toiletItem">
|
||
<view class="toiletItemLeft">
|
||
<image
|
||
class="icon"
|
||
src="https://eshangtech.com/wanmeiyizhanImg/home/washingMachine.svg"
|
||
/>
|
||
</view>
|
||
<view class="toiletItemRight">
|
||
<view class="label">洗衣机</view>
|
||
<view class="value"
|
||
>{{ detailInfo.sumDetail.WASHERCOUNT
|
||
}}<span class="unit">个</span></view
|
||
>
|
||
</view>
|
||
<!-- <view class="toiletItemLeft">
|
||
<image
|
||
class="toiletIcon"
|
||
src="https://eshangtech.com/wanmeiyizhanImg/home/washingMachine.svg"
|
||
/>
|
||
<text class="toiletText">洗衣机</text>
|
||
</view>
|
||
<view class="toiletItemRight">
|
||
<text
|
||
class="rightText"
|
||
:style="{
|
||
color:
|
||
detailInfo.sumDetail.WASHERCOUNT > 0 ? '#009F43' : '',
|
||
}"
|
||
>{{ detailInfo.sumDetail.WASHERCOUNT }}</text
|
||
>
|
||
</view> -->
|
||
</view>
|
||
<view class="toiletItem" v-if="false">
|
||
<!-- <view class="toiletItemLeft">
|
||
<image
|
||
class="toiletIcon"
|
||
src="https://eshangtech.com/wanmeiyizhanImg/home/watering.svg"
|
||
/>
|
||
<text class="toiletText">加水</text>
|
||
</view>
|
||
<view class="toiletItemRight">
|
||
<text
|
||
class="rightText"
|
||
:style="{
|
||
color:
|
||
detailInfo.sumDetail.VEHICLEWATERFILLING > 0
|
||
? '#009F43'
|
||
: '',
|
||
}"
|
||
>{{
|
||
detailInfo.sumDetail.VEHICLEWATERFILLING > 0 ? "有" : "无"
|
||
}}</text
|
||
>
|
||
</view> -->
|
||
</view>
|
||
<view class="toiletItem" v-if="false">
|
||
<view class="toiletItemLeft">
|
||
<image
|
||
class="toiletIcon"
|
||
src="https://eshangtech.com/wanmeiyizhanImg/home/urea.svg"
|
||
/>
|
||
<text class="toiletText">尿素</text>
|
||
</view>
|
||
<view class="toiletItemRight">
|
||
<!-- #009F43 绿 -->
|
||
<text
|
||
class="rightText"
|
||
:style="{
|
||
color: detailInfo.sumDetail.UREA_COUNT ? '#009F43' : '',
|
||
}"
|
||
>{{ detailInfo.sumDetail.UREA_COUNT ? "有" : "无" }}</text
|
||
>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
|
||
</view>
|
||
</view>
|
||
</template>
|
||
|
||
<script>
|
||
import { mapGetters } from "vuex";
|
||
export default {
|
||
data() {
|
||
return {
|
||
menu: {},
|
||
detailInfo: {}, // 服务区信息对象
|
||
firstTabList: [
|
||
{ label: "加油", value: 1 },
|
||
{ label: "充电", value: 2 },
|
||
{ label: "停车场", value: 3 },
|
||
{ label: "汽修", value: 4 },
|
||
], // 加油 充电 停车场 的tab
|
||
firstTab: 1,
|
||
secondTabList: [
|
||
{ label: "卫生间", value: 1 },
|
||
{ label: "母婴室", value: 2 },
|
||
{ label: "司机之家", value: 3 },
|
||
{ label: "其他设施", value: 4 },
|
||
],
|
||
secondTab: 1,
|
||
selectTypeList: [],
|
||
seatInfo: {},
|
||
serverpart: "", // 传入的服务区id
|
||
merchantList: [], // 商家列表
|
||
chargingObj: {
|
||
have: 0,
|
||
use: 0,
|
||
}, // 充电桩数据
|
||
loginType: "",
|
||
come: "", // 来自哪个页面
|
||
};
|
||
},
|
||
async onLoad(query) {
|
||
let systemInfo = uni.getSystemInfoSync();
|
||
let type = uni.getStorageSync("loginType");
|
||
this.loginType = type;
|
||
if (type === "min") {
|
||
this.menu = uni.getMenuButtonBoundingClientRect();
|
||
} else {
|
||
this.menu = systemInfo.safeArea;
|
||
}
|
||
console.log("query", query);
|
||
if (query.id) {
|
||
this.serverpart = query.id;
|
||
}
|
||
if (query.come) {
|
||
this.come = query.come;
|
||
}
|
||
|
||
await this.handleGetServerpartDetail(this.serverpart);
|
||
await this.handleGetMerchant();
|
||
},
|
||
async onShow() {
|
||
let currentService = uni.getStorageSync("currentService");
|
||
if (
|
||
currentService.SERVERPART_ID !== this.serverpart &&
|
||
this.come !== "chargeBox"
|
||
) {
|
||
this.serverpart = currentService.SERVERPART_ID;
|
||
await this.handleGetServerpartDetail(this.serverpart);
|
||
await this.handleGetMerchant();
|
||
}
|
||
},
|
||
computed: {
|
||
...mapGetters({
|
||
user: "user",
|
||
}),
|
||
},
|
||
methods: {
|
||
handleChangeFirstTab(obj) {
|
||
this.firstTab = obj.value;
|
||
},
|
||
handleChangeSecondTab(obj) {
|
||
this.secondTab = obj.value;
|
||
},
|
||
// 打开导航
|
||
handleGomap() {
|
||
let obj = this.detailInfo;
|
||
uni.openLocation({
|
||
latitude: obj.latitude ? obj.latitude * 1 : obj.SERVERPART_Y * 1,
|
||
longitude: obj.longitude ? obj.longitude * 1 : obj.SERVERPART_X * 1,
|
||
scale: 16, // 缩放比例
|
||
name: obj.SERVERPART_NAME,
|
||
// address: "", // 这个可能会影响地图的定位，所以可以选择不填
|
||
success(data) {
|
||
console.log(data);
|
||
},
|
||
fail(err) {
|
||
console.log(err);
|
||
},
|
||
});
|
||
},
|
||
// 查询服务区详情
|
||
async handleGetServerpartDetail(id) {
|
||
let currentService = uni.getStorageSync("currentService");
|
||
let seatInfo = uni.getStorageSync("seatInfo");
|
||
this.seatInfo = JSON.parse(seatInfo);
|
||
let req = {
|
||
ServerpartId: id || currentService.SERVERPART_ID,
|
||
latitude: this.seatInfo.latitude,
|
||
longitude: this.seatInfo.longitude,
|
||
excludeProperty: true,
|
||
};
|
||
uni.showLoading({
|
||
title: "加载中...",
|
||
});
|
||
const data = await this.$api.$get(
|
||
"/CommercialApi/BaseInfo/GetServerpartInfo",
|
||
req
|
||
);
|
||
let obj = data.Result_Data;
|
||
let sumObj = {
|
||
LIVESTOCKPACKING: 0, // 充电桩数
|
||
STATEGRIDCHARGE: 0, // 国网充电桩数量
|
||
LIAUTOCHARGE: 0, // 理想5C充电桩数量
|
||
GACENERGYCHARGE: 0, // 广汽能源充电桩数量
|
||
OTHERCHARGE: 0, // 其他充电桩数量
|
||
REFUELINGGUN92: 0, // 加油枪92号
|
||
REFUELINGGUN95: 0, // 加油枪95号
|
||
REFUELINGGUN0: 0, // 加油枪0号
|
||
HASPANTRY: 0, // 男厕数量
|
||
HASWIFI: 0, // 女厕数量
|
||
TOILETCOUNT: 0, // 潮汐厕位
|
||
HASSHOWERROOM: 0, // 淋浴房
|
||
HASWATERROOM: 0, // 开水器
|
||
MICROWAVEOVEN: 0, // 微波炉
|
||
WASHERCOUNT: 0, // 洗衣机数量
|
||
SLEEPINGPODS: 0, // 睡眠仓
|
||
HASPILOTLOUNGE: false, // 有无司机之家
|
||
SHOWERROOM: 0, // 司机之家淋浴间
|
||
HASCHILD: false, // 有无车辆维修
|
||
// VEHICLEWATERFILLING: false, // 有无车辆加水
|
||
SMALLPARKING: 0, // 轿车车位
|
||
PACKING: 0, // 客车车位
|
||
TRUCKPACKING: 0, // 货车车位
|
||
DANPACKING: 0, // 危化品车位
|
||
DININGBXCOUNT: 0, // 商铺数量
|
||
DININGROOMCOUNT: 0, // 餐饮店
|
||
HASBACKGROUNDRADIO: 0, // 便利店
|
||
POINTCONTROLCOUNT: 0, // 客房
|
||
BUSINESSTYPE: "",
|
||
TOILET_PAPER: 0, // 厕纸巾
|
||
MABROOMWATER_DISPENSER: 0, // 母婴室饮水机
|
||
NURSING_TABLE: 0, // 哺乳桌
|
||
BABY_COT: 0, // 婴儿床
|
||
CHANGING_TABLE: 0, // 尿布台
|
||
DROOMWATER_DISPENSER: 0, // 司机之家饮水机
|
||
REPAIR_TEL: "",
|
||
UREA_COUNT: 0, // 尿素
|
||
VEHICLEWATERFILLING: 0, // 加水
|
||
};
|
||
|
||
let LXSum = 0; // 理想
|
||
let WLSum = 0; // 蔚来
|
||
let SunSum = 0; // 新能源
|
||
let chargeAndReplaceSum = 0; // 国网
|
||
|
||
console.log("res.RegionInfo", obj.RegionInfo);
|
||
if (obj.RegionInfo && obj.RegionInfo.length > 0) {
|
||
obj.RegionInfo.forEach((item) => {
|
||
sumObj.LIVESTOCKPACKING += item.LIVESTOCKPACKING;
|
||
sumObj.STATEGRIDCHARGE += item.STATEGRIDCHARGE;
|
||
sumObj.LIAUTOCHARGE += item.LIAUTOCHARGE;
|
||
sumObj.GACENERGYCHARGE += item.GACENERGYCHARGE;
|
||
sumObj.OTHERCHARGE += item.OTHERCHARGE;
|
||
sumObj.REFUELINGGUN92 += item.REFUELINGGUN92;
|
||
sumObj.REFUELINGGUN95 += item.REFUELINGGUN95;
|
||
sumObj.REFUELINGGUN0 += item.REFUELINGGUN0;
|
||
sumObj.HASPANTRY += item.HASPANTRY;
|
||
sumObj.HASWIFI += item.HASWIFI;
|
||
sumObj.TOILETCOUNT += item.TOILETCOUNT;
|
||
sumObj.HASSHOWERROOM += item.HASSHOWERROOM;
|
||
sumObj.HASWATERROOM += item.HASWATERROOM;
|
||
sumObj.MICROWAVEOVEN += item.MICROWAVEOVEN;
|
||
sumObj.WASHERCOUNT += item.WASHERCOUNT;
|
||
sumObj.SLEEPINGPODS += item.SLEEPINGPODS;
|
||
sumObj.SMALLPARKING += item.SMALLPARKING;
|
||
sumObj.PACKING += item.PACKING;
|
||
sumObj.TRUCKPACKING += item.TRUCKPACKING;
|
||
sumObj.DANPACKING += item.DANPACKING;
|
||
sumObj.BUSINESSTYPE = item.BUSINESSTYPE;
|
||
sumObj.TOILET_PAPER += item.TOILET_PAPER;
|
||
sumObj.MABROOMWATER_DISPENSER += item.MABROOMWATER_DISPENSER;
|
||
sumObj.NURSING_TABLE += item.NURSING_TABLE;
|
||
sumObj.BABY_COT += item.BABY_COT;
|
||
sumObj.CHANGING_TABLE += item.CHANGING_TABLE;
|
||
sumObj.DROOMWATER_DISPENSER += item.DROOMWATER_DISPENSER;
|
||
sumObj.UREA_COUNT += item.UREA_COUNT;
|
||
sumObj.HASSHOWERROOM += item.HASSHOWERROOM;
|
||
sumObj.VEHICLEWATERFILLING += item.VEHICLEWATERFILLING;
|
||
if (item.HASPILOTLOUNGE) {
|
||
sumObj.HASPILOTLOUNGE = true;
|
||
}
|
||
if (item.HASCHILD) {
|
||
sumObj.HASCHILD = true;
|
||
}
|
||
sumObj.DININGBXCOUNT += item.DININGBXCOUNT;
|
||
sumObj.DININGROOMCOUNT += item.DININGROOMCOUNT;
|
||
sumObj.HASBACKGROUNDRADIO += item.HASBACKGROUNDRADIO;
|
||
sumObj.POINTCONTROLCOUNT += item.POINTCONTROLCOUNT;
|
||
if (item.REPAIR_TEL) {
|
||
sumObj.REPAIR_TEL = item.REPAIR_TEL;
|
||
}
|
||
sumObj.SHOWERROOM = item.SHOWERROOM;
|
||
|
||
chargeAndReplaceSum += item.STATEGRIDCHARGE; // 国网
|
||
SunSum += item.GACENERGYCHARGE; // 新能源
|
||
WLSum += item.OTHERCHAGRE; // 蔚来
|
||
LXSum += item.LIAUTOCHARGE; // 理想
|
||
});
|
||
}
|
||
|
||
// 理想的随机百分比
|
||
let LXRate = this.handleGetRandomData(0, 60);
|
||
// 蔚来的随机百分比
|
||
let WLRate = this.handleGetRandomData(0, 60);
|
||
// 阳光的随机百分比
|
||
let SunRate = this.handleGetRandomData(0, 60);
|
||
// 充换电的随机百分比
|
||
let chargeAndReplaceRate = this.handleGetRandomData(0, 60);
|
||
|
||
obj.LXDetail = {
|
||
LXEmpty: Math.floor(LXSum * (LXRate / 100)),
|
||
LXSum: LXSum,
|
||
};
|
||
obj.WLDetail = {
|
||
WLEmpty: Math.floor(WLSum * (WLRate / 100)),
|
||
WLSum: WLSum,
|
||
};
|
||
obj.SunDetail = {
|
||
SunEmpty: Math.floor(SunSum * (SunRate / 100)),
|
||
SunSum: SunSum,
|
||
};
|
||
obj.chargeAndReplaceDetail = {
|
||
chargeAndReplace: Math.floor(
|
||
chargeAndReplaceSum * (chargeAndReplaceRate / 100)
|
||
),
|
||
chargeAndReplaceSum: chargeAndReplaceSum,
|
||
};
|
||
|
||
obj.sumDetail = sumObj;
|
||
this.detailInfo = obj;
|
||
console.log("this.detailInfo", this.detailInfo);
|
||
let sortName = this.detailInfo.SERVERPART_NAME.split("服务区")[0];
|
||
if (["新桥", "丰乐", "肥东"].indexOf(sortName) !== -1) {
|
||
// 调用理想的数据
|
||
this.handleGetChargeData(sortName);
|
||
}
|
||
|
||
uni.hideLoading();
|
||
},
|
||
// 生成随机数
|
||
handleGetRandomData(max, min) {
|
||
return Math.floor(Math.random() * (max - min + 1)) + min;
|
||
},
|
||
// 拿到充电的理想数据
|
||
async handleGetChargeData(name) {
|
||
uni.showLoading({
|
||
title: "查询理想设备信息...",
|
||
});
|
||
|
||
const LiOperatorSecret = "bGMyYwJFl17BqwD3";
|
||
const LiOperCode = "MA7EBGWBX";
|
||
const LiSigSecret = "V7I6yvHvEk8STt0P";
|
||
const LiDataSecret = "P2S3WjoLv3rqL0hn";
|
||
const LiIV = "ZRlwcrx7k63ihzXF";
|
||
|
||
const OperatorID = "78109626X"; // 组织机构代码（OperatorID）
|
||
const OperatorSecret = "Xh2vLq1Pz9zF7wK3"; // Xh2vLq1Pz9zF7wK3 运营商秘钥（OperatorSecret）
|
||
const SigSecret = "bT8sWn2Aq0Jv6GvD"; // bT8sWn2Aq0Jv6GvD 签名秘钥（SigSecret）
|
||
const DataSecret = "fK7YzAq1R8Vp9hL0"; // fK7YzAq1R8Vp9hL0 数据加密秘钥（DataSecret）
|
||
const DataSecretIV = "z3XnWl8FQ2pTm5Ba"; // z3XnWl8FQ2pTm5Ba 初始化向量（DataSecretIV）
|
||
|
||
let tokenData = await this.$testApi.$post("/send", {
|
||
url: "https://openapi.chehejia.com/lcp-inter-evio-service/evcs/v1/evio/query_token",
|
||
|
||
data: JSON.stringify({
|
||
OperatorID: OperatorID,
|
||
OperatorSecret: LiOperatorSecret,
|
||
}),
|
||
id: 0,
|
||
seq: "001",
|
||
token: "",
|
||
});
|
||
console.log("tokenData", tokenData);
|
||
// token的实际值
|
||
let token = tokenData.Data.AccessToken;
|
||
|
||
// 拿到所有站点的数据
|
||
const allStationList = await this.$testApi.$post("/send", {
|
||
url: "https://openapi.chehejia.com/lcp-inter-evio-service/evcs/v1/evio/query_stations_info",
|
||
data: JSON.stringify({
|
||
PageNo: 1,
|
||
PageSize: 999,
|
||
}),
|
||
id: 0,
|
||
seq: "002",
|
||
token: token,
|
||
});
|
||
let stationList = allStationList.Data.StationInfos;
|
||
console.log("stationList", stationList);
|
||
|
||
let newStationList = [];
|
||
if (stationList && stationList.length > 0) {
|
||
stationList.forEach((item) => {
|
||
if (item.Address) {
|
||
if (item.Address.indexOf(name) !== -1) {
|
||
newStationList.push(item);
|
||
}
|
||
}
|
||
});
|
||
}
|
||
|
||
// 这段是和自己最近的三个服务区的 理想充电筛出来的数据
|
||
console.log("newStationList", newStationList);
|
||
|
||
let stationIds = [];
|
||
// 创建吧id当key的对象
|
||
let stationObj = {};
|
||
// 拿到充电站的id数组 去查里面的充电枪详情
|
||
if (newStationList && newStationList.length > 0) {
|
||
newStationList.forEach((item) => {
|
||
stationIds.push(item.StationID);
|
||
stationObj[item.StationID] = item;
|
||
});
|
||
}
|
||
|
||
// 查询具体状态
|
||
if (stationIds && stationIds.length > 0) {
|
||
const stationInfo = await this.$testApi.$post("/send", {
|
||
url: "https://openapi.chehejia.com/lcp-inter-evio-service/evcs/v1/evio/query_station_status",
|
||
data: JSON.stringify({
|
||
StationIDs: stationIds,
|
||
}),
|
||
id: 0,
|
||
seq: "003",
|
||
token: token,
|
||
});
|
||
let statusList = stationInfo.Data.StationStatusInfos;
|
||
console.log("statusList", statusList);
|
||
if (statusList && statusList.length > 0) {
|
||
statusList.forEach((item) => {
|
||
if (stationObj[item.StationID]) {
|
||
stationObj[item.StationID].statusList = item.ConnectorStatusInfos;
|
||
}
|
||
});
|
||
}
|
||
}
|
||
console.log("stationObj", stationObj);
|
||
|
||
// 带有状态的充电站列表格式
|
||
let haveStationList = [];
|
||
if (stationObj) {
|
||
for (let key in stationObj) {
|
||
haveStationList.push(stationObj[key]);
|
||
}
|
||
}
|
||
|
||
console.log("haveStationList", haveStationList);
|
||
|
||
let LXCharge = [];
|
||
let LXInfoList = [];
|
||
if (haveStationList && haveStationList.length > 0) {
|
||
haveStationList.forEach((subItem) => {
|
||
if (subItem.Address.indexOf(name) !== -1) {
|
||
LXCharge.push(...subItem.statusList);
|
||
if (subItem.EquipmentInfos && subItem.EquipmentInfos.length > 0) {
|
||
subItem.EquipmentInfos.forEach((thirdItem) => {
|
||
if (
|
||
thirdItem.ConnectorInfos &&
|
||
thirdItem.ConnectorInfos.length > 0
|
||
) {
|
||
thirdItem.ConnectorInfos.forEach((fourthItem) => {
|
||
LXInfoList.push(fourthItem);
|
||
});
|
||
}
|
||
});
|
||
}
|
||
}
|
||
});
|
||
// 空多少个
|
||
let LXEmpty = 0;
|
||
// 一共多少个
|
||
let LXSum = 0;
|
||
|
||
if (LXCharge && LXCharge.length > 0) {
|
||
LXCharge.forEach((subItem) => {
|
||
if (subItem.Status !== 3) {
|
||
LXEmpty += 1;
|
||
}
|
||
LXSum += 1;
|
||
});
|
||
}
|
||
|
||
this.detailInfo.LXDetail = {
|
||
LXEmpty: LXEmpty,
|
||
LXSum: LXSum,
|
||
};
|
||
}
|
||
uni.hideLoading();
|
||
},
|
||
// 跳转到选择服务区
|
||
goSelectServer() {
|
||
uni.navigateTo({ url: "/pages/newMap/index/index" });
|
||
},
|
||
// 返回上级页面
|
||
handleBack() {
|
||
uni.navigateBack({
|
||
delta: 1,
|
||
});
|
||
// uni.switchTab({
|
||
// url: "/pages/index/index",
|
||
// });
|
||
},
|
||
// 拿到精选商家数据
|
||
async handleGetMerchant() {
|
||
uni.showLoading({
|
||
title: "加载中...",
|
||
});
|
||
const data = await this.$api.getCoop({
|
||
action_type: "GetSellerList",
|
||
showSales: 1,
|
||
showCoupon: 1,
|
||
showComment: 1,
|
||
serverpartId: this.detailInfo.SERVERPART_ID,
|
||
provinceCode: "340000",
|
||
showGoods: 1,
|
||
pageSize: 9999,
|
||
pageIndex: 1,
|
||
});
|
||
let list = data.Data.List;
|
||
console.log("handleGetMerchant", list);
|
||
this.merchantList = list;
|
||
uni.hideLoading();
|
||
},
|
||
goShop(item) {
|
||
console.log("goShop", item);
|
||
if (item.SCANCODE_ORDER === 1) {
|
||
this.goBuy(item);
|
||
} else {
|
||
uni.navigateTo({
|
||
url: `/pages/storeDetail/index?id=${item.MERCHANTS_ID}`,
|
||
});
|
||
}
|
||
},
|
||
// 去点餐的跳转
|
||
goBuy(item) {
|
||
console.log("goBuy", item);
|
||
if (this.user.MEMBERSHIP_MOBILEPHONE) {
|
||
let id = item.SERVERPARTSHOP_IDS.split(",")[0];
|
||
uni.navigateTo({
|
||
url: `/pages/shopPages/shop/index?id=${id}&mid=${item.MERCHANTS_ID}&province=${item.PROVINCE_CODE}`,
|
||
});
|
||
} else {
|
||
let id = item.SERVERPARTSHOP_IDS.split(",")[0];
|
||
uni.navigateTo({
|
||
url: `/pages/shopPages/shop/index?id=${id}&mid=${item.MERCHANTS_ID}&province=${item.PROVINCE_CODE}`,
|
||
});
|
||
this.isLogin = true;
|
||
}
|
||
},
|
||
// 打电话
|
||
handleCallPhone(phone) {
|
||
if (!phone) {
|
||
return;
|
||
}
|
||
uni.makePhoneCall({
|
||
phoneNumber: phone, //仅为示例
|
||
});
|
||
},
|
||
},
|
||
};
|
||
</script>
|
||
|
||
<style lang="less" scoped>
|
||
.main {
|
||
width: 100vw;
|
||
// height: 100vh;
|
||
background: #f5f5f5;
|
||
|
||
.topBox {
|
||
width: 100%;
|
||
padding: 0 32rpx 16rpx;
|
||
box-sizing: border-box;
|
||
background: #fff;
|
||
position: fixed;
|
||
top: 0;
|
||
left: 0;
|
||
z-index: 9;
|
||
|
||
.topContent {
|
||
display: flex;
|
||
align-items: center;
|
||
|
||
.backIconBox {
|
||
width: 48rpx;
|
||
height: 48rpx;
|
||
|
||
.backIcon {
|
||
width: 100%;
|
||
height: 100%;
|
||
}
|
||
}
|
||
|
||
.currentServiceBox {
|
||
display: flex;
|
||
align-items: center;
|
||
padding: 12rpx 16rpx;
|
||
background: #fff;
|
||
border-radius: 32rpx;
|
||
border: 1rpx solid #e7e7e6;
|
||
margin-left: 8rpx;
|
||
|
||
.servicePosition {
|
||
width: 24rpx;
|
||
height: 24rpx;
|
||
margin-right: 8rpx;
|
||
}
|
||
|
||
.currentService {
|
||
font-family: PingFangSC, PingFang SC;
|
||
font-weight: 400;
|
||
font-size: 28rpx;
|
||
color: #090c1a;
|
||
line-height: 40rpx;
|
||
text-align: justify;
|
||
font-style: normal;
|
||
}
|
||
|
||
.rightArrow {
|
||
width: 24rpx;
|
||
height: 24rpx;
|
||
margin-left: 8rpx;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
.content {
|
||
width: 100%;
|
||
box-sizing: border-box;
|
||
padding: 0 32rpx 48rpx;
|
||
margin-top: 24rpx;
|
||
|
||
.serviceDetail {
|
||
width: 100%;
|
||
background: #ffffff;
|
||
border-radius: 16rpx;
|
||
|
||
.detailTop {
|
||
width: 100%;
|
||
height: 320rpx;
|
||
border-radius: 16rpx;
|
||
overflow: hidden;
|
||
|
||
.serviceImg {
|
||
width: 100%;
|
||
height: 100%;
|
||
}
|
||
|
||
.noDataBg {
|
||
width: 100%;
|
||
height: 100%;
|
||
background-image: url(https://eshangtech.com/wanmeiyizhanImg/discovery/defaultIcon.png);
|
||
background-repeat: no-repeat;
|
||
background-position-x: 50%;
|
||
background-position-y: 50%;
|
||
}
|
||
}
|
||
|
||
.detailBottom {
|
||
width: 100%;
|
||
box-sizing: border-box;
|
||
padding: 4rpx 24rpx 24rpx;
|
||
position: relative;
|
||
|
||
.detailFirst {
|
||
width: 100%;
|
||
|
||
.serviceName {
|
||
width: calc(100% - 190rpx);
|
||
font-family: PingFangSC, PingFang SC;
|
||
font-weight: 600;
|
||
font-size: 36rpx;
|
||
color: #130f05;
|
||
line-height: 52rpx;
|
||
text-align: left;
|
||
font-style: normal;
|
||
white-space: nowrap;
|
||
text-overflow: ellipsis;
|
||
overflow: hidden;
|
||
margin-right: 16rpx;
|
||
}
|
||
|
||
.serviceStatus {
|
||
font-family: PingFangSC, PingFang SC;
|
||
font-weight: 400;
|
||
font-size: 22rpx;
|
||
color: #009f43;
|
||
line-height: 32rpx;
|
||
text-align: justify;
|
||
font-style: normal;
|
||
display: inline-block;
|
||
padding: 2rpx 6rpx;
|
||
background: #e9f8ee;
|
||
border-radius: 4rpx;
|
||
}
|
||
}
|
||
|
||
.detailSecond {
|
||
width: 100%;
|
||
display: flex;
|
||
align-items: center;
|
||
|
||
.detailFixedIcon {
|
||
width: 24rpx;
|
||
height: 24rpx;
|
||
margin-right: 4rpx;
|
||
}
|
||
|
||
.address {
|
||
width: calc(100% - 120rpx);
|
||
display: inline-block;
|
||
text-overflow: ellipsis;
|
||
overflow: hidden;
|
||
white-space: nowrap;
|
||
|
||
.distance {
|
||
font-family: PingFangSC, PingFang SC;
|
||
font-weight: 400;
|
||
font-size: 26rpx;
|
||
color: #130f05;
|
||
line-height: 36rpx;
|
||
text-align: left;
|
||
font-style: normal;
|
||
margin-right: 8rpx;
|
||
}
|
||
|
||
.addressText {
|
||
font-family: PingFangSC, PingFang SC;
|
||
font-weight: 400;
|
||
font-size: 26rpx;
|
||
color: #716f69;
|
||
line-height: 36rpx;
|
||
text-align: left;
|
||
font-style: normal;
|
||
}
|
||
}
|
||
}
|
||
|
||
.navigationBox {
|
||
width: 64rpx;
|
||
height: 64rpx;
|
||
position: absolute;
|
||
right: 24rpx;
|
||
top: 32rpx;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
background: #f8f4ea;
|
||
border-radius: 50%;
|
||
.navigationIcon {
|
||
width: 24rpx;
|
||
height: 24rpx;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
.carDetailBox {
|
||
width: 100%;
|
||
background: #fff;
|
||
border-radius: 16rpx;
|
||
margin-top: 24rpx;
|
||
box-sizing: border-box;
|
||
padding: 24rpx;
|
||
|
||
.detailTab {
|
||
width: 100%;
|
||
border-bottom: 1px solid #f3f3f3;
|
||
display: flex;
|
||
align-items: center;
|
||
|
||
.tabItem {
|
||
font-family: PingFangSC, PingFang SC;
|
||
font-weight: 400;
|
||
font-size: 28rpx;
|
||
color: #716f69;
|
||
line-height: 40rpx;
|
||
text-align: left;
|
||
font-style: normal;
|
||
margin-right: 40rpx;
|
||
padding-bottom: 14rpx;
|
||
}
|
||
|
||
.selectTabItem {
|
||
font-weight: 600;
|
||
color: #160002;
|
||
position: relative;
|
||
}
|
||
|
||
.selectTabItem::after {
|
||
position: absolute;
|
||
content: "";
|
||
width: 2rem;
|
||
height: 6rpx;
|
||
background: #ba922f;
|
||
border-radius: 3rpx;
|
||
bottom: 0;
|
||
left: 50%;
|
||
transform: translateX(-50%);
|
||
}
|
||
}
|
||
|
||
.firstContent {
|
||
width: 100%;
|
||
margin-top: 24rpx;
|
||
|
||
.gasContent {
|
||
width: 100%;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
margin-top: 24rpx;
|
||
box-sizing: border-box;
|
||
|
||
.gasItem {
|
||
width: calc((100% - 32rpx) / 3);
|
||
padding: 32rpx 0;
|
||
border-radius: 8rpx;
|
||
display: flex;
|
||
flex-direction: column;
|
||
align-items: center;
|
||
|
||
.gasItemIcon {
|
||
width: 72rpx;
|
||
height: 72rpx;
|
||
}
|
||
|
||
.label {
|
||
font-family: PingFangSC, PingFang SC;
|
||
font-weight: 400;
|
||
font-size: 28rpx;
|
||
color: #2a2b2e;
|
||
line-height: 36rpx;
|
||
text-align: left;
|
||
font-style: normal;
|
||
margin: 16rpx 0;
|
||
}
|
||
|
||
.value {
|
||
font-family: DINAlternate, DINAlternate;
|
||
font-size: 28rpx;
|
||
color: #2a2b2e;
|
||
line-height: 36rpx;
|
||
text-align: left;
|
||
font-style: normal;
|
||
}
|
||
}
|
||
|
||
.first {
|
||
background: linear-gradient(180deg, #f3fbf7 0%, #f3faf7 100%);
|
||
}
|
||
|
||
.second {
|
||
background: linear-gradient(180deg, #f8f9ff 0%, #f5f6fe 100%);
|
||
}
|
||
|
||
.third {
|
||
background: linear-gradient(180deg, #f1f7ff 0%, #f2f7ff 100%);
|
||
}
|
||
}
|
||
|
||
.chargeContent {
|
||
margin-top: 24rpx;
|
||
|
||
.chargeItem {
|
||
width: 100%;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
margin-bottom: 24rpx;
|
||
.itemLeft {
|
||
display: flex;
|
||
align-items: center;
|
||
.imgIcon {
|
||
width: 40rpx;
|
||
height: 40rpx;
|
||
margin-right: 12rpx;
|
||
}
|
||
.chargeTypeName {
|
||
font-family: "PingFangSC";
|
||
font-weight: 400;
|
||
font-size: 28rpx;
|
||
color: #130f05;
|
||
line-height: 40rpx;
|
||
text-align: left;
|
||
font-style: normal;
|
||
}
|
||
}
|
||
.itemRight {
|
||
background: #f5f6f7;
|
||
border-radius: 4rpx;
|
||
padding: 4rpx 12rpx;
|
||
display: flex;
|
||
align-items: center;
|
||
.emptyText {
|
||
font-family: "PingFangSC";
|
||
font-weight: 400;
|
||
font-size: 24rpx;
|
||
color: #130f05;
|
||
line-height: 36rpx;
|
||
text-align: left;
|
||
font-style: normal;
|
||
margin-right: 4rpx;
|
||
}
|
||
.use {
|
||
font-family: "DINAlternate";
|
||
font-weight: bold;
|
||
font-size: 32rpx;
|
||
color: #130f05;
|
||
line-height: 36rpx;
|
||
text-align: left;
|
||
font-style: normal;
|
||
margin-right: 4rpx;
|
||
}
|
||
.sum {
|
||
font-family: "DINAlternate";
|
||
font-weight: bold;
|
||
font-size: 32rpx;
|
||
color: #716f69;
|
||
line-height: 36rpx;
|
||
text-align: left;
|
||
font-style: normal;
|
||
}
|
||
}
|
||
}
|
||
|
||
.stateGrid {
|
||
width: 100%;
|
||
margin-top: 24rpx;
|
||
background: #f6f6f6;
|
||
border-radius: 12rpx;
|
||
box-sizing: border-box;
|
||
padding: 24rpx;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
|
||
.leftGrid {
|
||
display: flex;
|
||
align-items: center;
|
||
|
||
.gridImg {
|
||
width: 40rpx;
|
||
height: 40rpx;
|
||
margin-right: 12rpx;
|
||
}
|
||
|
||
.gridText {
|
||
font-family: PingFangSC, PingFang SC;
|
||
font-weight: 400;
|
||
font-size: 28rpx;
|
||
color: #130f05;
|
||
line-height: 40rpx;
|
||
text-align: left;
|
||
font-style: normal;
|
||
margin-right: 12rpx;
|
||
}
|
||
|
||
.fastCharg {
|
||
font-family: PingFangSC, PingFang SC;
|
||
font-weight: 400;
|
||
font-size: 20rpx;
|
||
color: #ffffff;
|
||
line-height: 28rpx;
|
||
text-align: justify;
|
||
font-style: normal;
|
||
display: inline;
|
||
padding: 2rpx 6rpx;
|
||
background: linear-gradient(270deg, #ff500e 0%, #ff7d0a 100%);
|
||
border-radius: 4rpx;
|
||
}
|
||
}
|
||
|
||
.rightGrid {
|
||
display: flex;
|
||
align-items: center;
|
||
|
||
.other {
|
||
font-family: PingFangSC, PingFang SC;
|
||
font-weight: 400;
|
||
font-size: 24rpx;
|
||
color: #130f05;
|
||
line-height: 36rpx;
|
||
text-align: left;
|
||
font-style: normal;
|
||
margin-right: 4rpx;
|
||
}
|
||
|
||
.have {
|
||
font-family: DINAlternate, DINAlternate;
|
||
font-weight: bold;
|
||
font-size: 32rpx;
|
||
color: #130f05;
|
||
line-height: 36rpx;
|
||
text-align: left;
|
||
font-style: normal;
|
||
margin-right: 4rpx;
|
||
}
|
||
|
||
.all {
|
||
font-family: DINAlternate, DINAlternate;
|
||
font-weight: bold;
|
||
font-size: 32rpx;
|
||
color: #716f69;
|
||
line-height: 36rpx;
|
||
text-align: left;
|
||
font-style: normal;
|
||
}
|
||
}
|
||
}
|
||
|
||
.contentItem {
|
||
width: 100%;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
box-sizing: border-box;
|
||
padding: 24rpx;
|
||
margin-bottom: 24rpx;
|
||
// background-image: url('https://eshangtech.com/wanmeiyizhanImg/home/chargeBg.png');
|
||
// background-repeat: no-repeat;
|
||
// background-size: 100% 100%;
|
||
border-radius: 8rpx;
|
||
border: 2rpx solid #f5f6f7;
|
||
|
||
.leftItem {
|
||
display: flex;
|
||
align-items: center;
|
||
font-family: PingFangSC, PingFang SC;
|
||
font-weight: 400;
|
||
font-size: 28rpx;
|
||
color: #130f05;
|
||
line-height: 40rpx;
|
||
text-align: left;
|
||
font-style: normal;
|
||
|
||
// width: 128rpx;
|
||
// height: 64rpx;
|
||
.carIcon {
|
||
width: 40rpx;
|
||
height: 40rpx;
|
||
margin-right: 12rpx;
|
||
}
|
||
|
||
.configIcon {
|
||
width: 100%;
|
||
height: 100%;
|
||
}
|
||
}
|
||
|
||
.rightItem {
|
||
display: flex;
|
||
align-items: center;
|
||
|
||
.emptyText {
|
||
font-family: PingFangSC, PingFang SC;
|
||
font-weight: 400;
|
||
font-size: 24rpx;
|
||
color: #130f05;
|
||
line-height: 36rpx;
|
||
text-align: center;
|
||
font-style: normal;
|
||
margin-right: 4rpx;
|
||
}
|
||
|
||
.occupy {
|
||
font-family: DINAlternate, DINAlternate;
|
||
font-weight: bold;
|
||
font-size: 32rpx;
|
||
color: #130f05;
|
||
line-height: 40rpx;
|
||
text-align: left;
|
||
font-style: normal;
|
||
margin-right: 4rpx;
|
||
}
|
||
|
||
.unit {
|
||
font-family: PingFangSC, PingFang SC;
|
||
font-weight: 400;
|
||
font-size: 24rpx;
|
||
color: #716f69;
|
||
line-height: 36rpx;
|
||
text-align: justify;
|
||
font-style: normal;
|
||
}
|
||
|
||
.smallIcon {
|
||
width: 32rpx;
|
||
height: 32rpx;
|
||
}
|
||
|
||
.value {
|
||
font-family: DINAlternate, DINAlternate;
|
||
font-weight: bold;
|
||
font-size: 36rpx;
|
||
color: #282622;
|
||
line-height: 40rpx;
|
||
text-align: left;
|
||
font-style: normal;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
.carContent {
|
||
width: 100%;
|
||
// background: #FAFAFC;
|
||
border-radius: 8rpx;
|
||
border: 2rpx solid #f5f6f7;
|
||
margin-top: 24rpx;
|
||
box-sizing: border-box;
|
||
padding: 24rpx 24rpx 0;
|
||
display: flex;
|
||
align-items: center;
|
||
flex-wrap: wrap;
|
||
margin-bottom: 32rpx;
|
||
|
||
.carItem {
|
||
width: calc((100% / 2));
|
||
display: flex;
|
||
align-items: center;
|
||
margin-bottom: 32rpx;
|
||
|
||
.carTop {
|
||
width: 80rpx;
|
||
height: 80rpx;
|
||
display: flex;
|
||
align-items: center;
|
||
border: 1rpx solid #e7e7e6;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
border-radius: 50%;
|
||
margin-right: 16rpx;
|
||
|
||
.carIcon {
|
||
width: 40rpx;
|
||
height: 40rpx;
|
||
}
|
||
|
||
.carName {
|
||
font-family: PingFangSC, PingFang SC;
|
||
font-weight: 400;
|
||
font-size: 28rpx;
|
||
color: #282622;
|
||
line-height: 40rpx;
|
||
text-align: left;
|
||
font-style: normal;
|
||
}
|
||
}
|
||
|
||
.carBottom {
|
||
// margin-top: 4rpx;
|
||
// padding-left: 38rpx;
|
||
font-family: PingFangSC, PingFang SC;
|
||
font-weight: 400;
|
||
font-size: 28rpx;
|
||
color: #8c8981;
|
||
line-height: 40rpx;
|
||
text-align: left;
|
||
font-style: normal;
|
||
|
||
.carName {
|
||
font-family: PingFangSC, PingFang SC;
|
||
font-weight: 400;
|
||
font-size: 28rpx;
|
||
color: #130f05;
|
||
line-height: 40rpx;
|
||
text-align: left;
|
||
font-style: normal;
|
||
}
|
||
|
||
.carValue {
|
||
font-family: DINAlternate, DINAlternate;
|
||
font-size: 28rpx;
|
||
color: #130f05;
|
||
line-height: 36rpx;
|
||
text-align: left;
|
||
font-style: normal;
|
||
|
||
.unit {
|
||
font-family: PingFangSC, PingFang SC;
|
||
font-weight: 400;
|
||
font-size: 24rpx;
|
||
color: #716f69;
|
||
line-height: 36rpx;
|
||
text-align: justify;
|
||
font-style: normal;
|
||
margin-left: 4rpx;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
.vehicleMaintenance {
|
||
width: 100%;
|
||
box-sizing: border-box;
|
||
padding: 0 24rpx;
|
||
background: #ffffff;
|
||
border-radius: 16rpx;
|
||
|
||
.vehicleTitle {
|
||
font-family: PingFangSC, PingFang SC;
|
||
font-weight: 600;
|
||
font-size: 28rpx;
|
||
color: #130f05;
|
||
line-height: 40rpx;
|
||
text-align: left;
|
||
font-style: normal;
|
||
}
|
||
|
||
.vehicleContent {
|
||
margin-top: 12rpx;
|
||
display: flex;
|
||
align-items: flex-start;
|
||
justify-content: space-between;
|
||
|
||
.vehicleContentLeft {
|
||
.leftLabel {
|
||
font-family: PingFangSC, PingFang SC;
|
||
font-weight: 400;
|
||
font-size: 28rpx;
|
||
color: #130f05;
|
||
line-height: 40rpx;
|
||
text-align: left;
|
||
font-style: normal;
|
||
margin-bottom: 4rpx;
|
||
}
|
||
|
||
.onlineTime {
|
||
font-family: PingFangSC, PingFang SC;
|
||
font-weight: 400;
|
||
font-size: 24rpx;
|
||
color: #716f69;
|
||
line-height: 36rpx;
|
||
text-align: left;
|
||
font-style: normal;
|
||
margin-top: 24rpx;
|
||
}
|
||
}
|
||
|
||
.vehicleContentRight {
|
||
.callPhone {
|
||
width: 64rpx;
|
||
height: 64rpx;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
.otherFacilities {
|
||
width: 100%;
|
||
background: #fff;
|
||
border-radius: 16rpx;
|
||
margin-top: 24rpx;
|
||
box-sizing: border-box;
|
||
padding: 24rpx;
|
||
|
||
.otherTitle {
|
||
font-family: PingFangSC, PingFang SC;
|
||
font-weight: 600;
|
||
font-size: 28rpx;
|
||
color: #160002;
|
||
line-height: 40rpx;
|
||
text-align: left;
|
||
font-style: normal;
|
||
}
|
||
|
||
.detailTab {
|
||
width: 100%;
|
||
border-bottom: 1px solid #f3f3f3;
|
||
display: flex;
|
||
align-items: center;
|
||
|
||
.tabItem {
|
||
font-family: PingFangSC, PingFang SC;
|
||
font-weight: 400;
|
||
font-size: 28rpx;
|
||
color: #716f69;
|
||
line-height: 40rpx;
|
||
text-align: left;
|
||
font-style: normal;
|
||
margin-right: 40rpx;
|
||
padding-bottom: 14rpx;
|
||
}
|
||
|
||
.selectTabItem {
|
||
font-weight: 600;
|
||
color: #160002;
|
||
position: relative;
|
||
}
|
||
|
||
.selectTabItem::after {
|
||
position: absolute;
|
||
content: "";
|
||
width: 2rem;
|
||
height: 6rpx;
|
||
background: #ba922f;
|
||
border-radius: 3rpx;
|
||
bottom: 0;
|
||
left: 50%;
|
||
transform: translateX(-50%);
|
||
}
|
||
}
|
||
|
||
.secondContent {
|
||
width: 100%;
|
||
margin-top: 24rpx;
|
||
|
||
.toiletBox {
|
||
width: 100%;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
flex-wrap: wrap;
|
||
|
||
.toiletItem {
|
||
width: calc((100% - 16rpx) / 2);
|
||
box-sizing: border-box;
|
||
padding: 24rpx;
|
||
// background: #f6f6f6;
|
||
border-radius: 12rpx;
|
||
margin-bottom: 16rpx;
|
||
display: flex;
|
||
align-items: center;
|
||
// justify-content: space-between;
|
||
|
||
.toiletItemLeft {
|
||
width: 80rpx;
|
||
height: 80rpx;
|
||
border: 1rpx solid #e7e7e6;
|
||
border-radius: 50%;
|
||
margin-right: 16rpx;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
.icon {
|
||
width: 40rpx;
|
||
height: 40rpx;
|
||
}
|
||
}
|
||
|
||
.toiletItemRight {
|
||
.label {
|
||
font-family: PingFangSC, PingFang SC;
|
||
font-weight: 400;
|
||
font-size: 28rpx;
|
||
color: #130f05;
|
||
line-height: 40rpx;
|
||
text-align: left;
|
||
font-style: normal;
|
||
}
|
||
.value {
|
||
margin-top: 4rpx;
|
||
font-family: DINAlternate, DINAlternate;
|
||
font-size: 28rpx;
|
||
color: #130f05;
|
||
line-height: 36rpx;
|
||
text-align: left;
|
||
font-style: normal;
|
||
.unit {
|
||
margin-left: 4rpx;
|
||
font-family: PingFangSC, PingFang SC;
|
||
font-weight: 400;
|
||
font-size: 24rpx;
|
||
color: #716f69;
|
||
line-height: 36rpx;
|
||
text-align: left;
|
||
font-style: normal;
|
||
}
|
||
}
|
||
}
|
||
|
||
// .toiletItemLeft {
|
||
// display: flex;
|
||
// align-items: center;
|
||
|
||
// .toiletIcon {
|
||
// width: 32rpx;
|
||
// height: 32rpx;
|
||
// margin-right: 8rpx;
|
||
// }
|
||
|
||
// .toiletText {
|
||
// font-family: PingFangSC, PingFang SC;
|
||
// font-weight: 400;
|
||
// font-size: 28rpx;
|
||
// color: #160002;
|
||
// line-height: 40rpx;
|
||
// text-align: left;
|
||
// font-style: normal;
|
||
// }
|
||
// }
|
||
|
||
// .toiletItemRight {
|
||
// .rightText {
|
||
// font-family: PingFangSC, PingFang SC;
|
||
// font-weight: 400;
|
||
// font-size: 28rpx;
|
||
// color: #999da3;
|
||
// line-height: 40rpx;
|
||
// text-align: left;
|
||
// font-style: normal;
|
||
// }
|
||
// }
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
.popularMerchants {
|
||
width: 100%;
|
||
box-sizing: border-box;
|
||
padding: 24rpx;
|
||
background: #ffffff;
|
||
border-radius: 16rpx;
|
||
margin-top: 24rpx;
|
||
|
||
.popularTitle {
|
||
font-family: PingFangSC, PingFang SC;
|
||
font-weight: 600;
|
||
font-size: 28rpx;
|
||
color: #130f05;
|
||
line-height: 40rpx;
|
||
text-align: left;
|
||
font-style: normal;
|
||
}
|
||
|
||
.newTabList {
|
||
width: 100%;
|
||
overflow-x: auto;
|
||
display: flex;
|
||
flex-wrap: nowrap;
|
||
border-bottom: 1px solid #f5f6f7;
|
||
|
||
.newTabItem {
|
||
font-family: PingFangSC, PingFang SC;
|
||
font-weight: 400;
|
||
font-size: 28rpx;
|
||
color: #716f69;
|
||
line-height: 40rpx;
|
||
text-align: left;
|
||
font-style: normal;
|
||
padding: 0 50rpx 12rpx 50rpx;
|
||
white-space: nowrap;
|
||
}
|
||
|
||
.selectTabItem {
|
||
font-family: PingFangSC, PingFang SC;
|
||
font-weight: bold;
|
||
font-size: 28rpx;
|
||
color: #130f05;
|
||
line-height: 40rpx;
|
||
text-align: left;
|
||
font-style: normal;
|
||
position: relative;
|
||
}
|
||
|
||
.selectTabItem:after {
|
||
content: "";
|
||
position: absolute;
|
||
width: 2rem;
|
||
height: 4rpx;
|
||
background: #ba922f;
|
||
bottom: 0;
|
||
left: 50%;
|
||
transform: translateX(-50%);
|
||
}
|
||
}
|
||
|
||
.newTabList::-webkit-scrollbar {
|
||
display: none;
|
||
}
|
||
|
||
.newShopUnit {
|
||
width: 100%;
|
||
margin-bottom: 32rpx;
|
||
border-bottom: 1px solid #ededed;
|
||
padding-bottom: 32rpx;
|
||
.shopItemTop {
|
||
width: 100%;
|
||
display: flex;
|
||
align-items: flex-start;
|
||
.shopImg {
|
||
width: 136rpx;
|
||
height: 136rpx;
|
||
overflow: hidden;
|
||
border-radius: 8rpx;
|
||
margin-right: 24rpx;
|
||
.shopIcon {
|
||
width: 100%;
|
||
height: 100%;
|
||
}
|
||
}
|
||
.shopDetail {
|
||
width: calc(100% - 136rpx);
|
||
// height: 96rpx;
|
||
// display: flex;
|
||
// flex-direction: column;
|
||
// justify-content: space-between;
|
||
position: relative;
|
||
.shopName {
|
||
width: 100%;
|
||
display: flex;
|
||
align-items: center;
|
||
.shopTitle {
|
||
display: inline-block;
|
||
max-width: calc(100% - 133rpx);
|
||
white-space: nowrap;
|
||
overflow: hidden;
|
||
text-overflow: ellipsis;
|
||
font-family: PingFang SC;
|
||
font-weight: 400;
|
||
font-size: 32rpx;
|
||
color: #130f05;
|
||
line-height: 44rpx;
|
||
text-align: left;
|
||
font-style: normal;
|
||
}
|
||
.titleIcon {
|
||
display: inline-block;
|
||
background: url("https://eshangtech.com/ShopICO/icos/to-eat.png")
|
||
no-repeat center; // eshangtech.com/ShopICO/icos/to-eat.png) no-repeat center;
|
||
background-size: contain;
|
||
width: 133rpx;
|
||
height: 48rpx;
|
||
}
|
||
}
|
||
.otherDetail {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
.leftDetail {
|
||
.mark {
|
||
font-family: "DINAlternate";
|
||
font-weight: bold;
|
||
font-size: 32rpx;
|
||
color: #ba922f;
|
||
line-height: 36rpx;
|
||
text-align: justify;
|
||
font-style: normal;
|
||
.unit {
|
||
font-family: "PingFangSC";
|
||
font-weight: 400;
|
||
font-size: 24rpx;
|
||
color: #ba922f;
|
||
line-height: 32rpx;
|
||
text-align: left;
|
||
font-style: normal;
|
||
}
|
||
}
|
||
.monthSales {
|
||
margin-left: 16rpx;
|
||
font-family: "PingFangSC";
|
||
font-weight: 400;
|
||
font-size: 24rpx;
|
||
color: #716f69;
|
||
line-height: 36rpx;
|
||
text-align: left;
|
||
font-style: normal;
|
||
}
|
||
.perCapita {
|
||
margin-left: 16rpx;
|
||
font-family: "PingFangSC";
|
||
font-weight: 400;
|
||
font-size: 24rpx;
|
||
color: #716f69;
|
||
line-height: 36rpx;
|
||
text-align: left;
|
||
font-style: normal;
|
||
}
|
||
}
|
||
.rightDetail {
|
||
.perCapita {
|
||
font-size: 24rpx;
|
||
color: #666;
|
||
}
|
||
.icon-coupon {
|
||
background: url("https://eshangtech.com/ShopICO/icos/y-yhq.png")
|
||
no-repeat left center; // eshangtech.com/ShopICO/icos/y-yhq.png) no-repeat left center
|
||
background-size: contain;
|
||
// width 75rpx
|
||
// height 22rpx
|
||
padding-left: 40rpx;
|
||
height: 27rpx;
|
||
line-height: 27rpx;
|
||
// padding-left 25rpx
|
||
font-size: 24rpx;
|
||
color: #ec5930;
|
||
margin-left: 8px;
|
||
}
|
||
}
|
||
}
|
||
.couponList {
|
||
display: inline-block;
|
||
margin-top: 12rpx;
|
||
.couponBox {
|
||
background: #fef0e5;
|
||
border-radius: 2rpx;
|
||
display: flex;
|
||
align-items: center;
|
||
.couponIconBox {
|
||
width: 40rpx;
|
||
height: 40rpx;
|
||
background: linear-gradient(180deg, #ffddc0 0%, #ffeada 100%);
|
||
border-radius: 4rpx;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
.couponIcon {
|
||
width: 24rpx;
|
||
height: 24rpx;
|
||
}
|
||
}
|
||
.couponText {
|
||
margin: 0 10rpx;
|
||
font-family: "PingFangSC";
|
||
font-weight: 400;
|
||
font-size: 22rpx;
|
||
color: #fa5825;
|
||
line-height: 32rpx;
|
||
text-align: left;
|
||
font-style: normal;
|
||
}
|
||
}
|
||
}
|
||
|
||
.goOrder {
|
||
position: absolute;
|
||
right: 0;
|
||
top: 0;
|
||
padding: 10rpx 12rpx;
|
||
border-radius: 4rpx;
|
||
border: 2rpx solid #ae8d3e;
|
||
display: flex;
|
||
align-items: center;
|
||
.orderIcon {
|
||
width: 32rpx;
|
||
height: 32rpx;
|
||
margin-right: 8rpx;
|
||
}
|
||
.goOrderText {
|
||
font-family: "PingFangSC";
|
||
font-weight: 400;
|
||
font-size: 22rpx;
|
||
color: #ba922f;
|
||
line-height: 32rpx;
|
||
text-align: left;
|
||
font-style: normal;
|
||
}
|
||
}
|
||
|
||
// .couponBox {
|
||
// padding: 4rpx 6rpx;
|
||
// background: rgba(247, 80, 49, 0.08);
|
||
// border-radius: 2rpx;
|
||
// display: flex;
|
||
// align-items: center;
|
||
// position: absolute;
|
||
// right: 160rpx;
|
||
// top: 0;
|
||
// .couponIcon {
|
||
// width: 24rpx;
|
||
// height: 24rpx;
|
||
// margin-right: 4rpx;
|
||
// }
|
||
// .couponText {
|
||
// font-family: PingFangSC, PingFang SC;
|
||
// font-weight: 400;
|
||
// font-size: 22rpx;
|
||
// color: #f75031;
|
||
// line-height: 32rpx;
|
||
// text-align: left;
|
||
// font-style: normal;
|
||
// white-space: nowrap;
|
||
// }
|
||
// }
|
||
}
|
||
}
|
||
|
||
.shopList {
|
||
width: calc(100% - 160rpx);
|
||
box-sizing: border-box;
|
||
margin-left: 160rpx;
|
||
overflow-x: auto;
|
||
display: flex;
|
||
margin-top: 24rpx;
|
||
.shopItem {
|
||
width: 168rpx;
|
||
margin-right: 16rpx;
|
||
.shopImgBox {
|
||
width: 168rpx;
|
||
height: 128rpx;
|
||
overflow: hidden;
|
||
border-radius: 12rpx;
|
||
margin-bottom: 8rpx;
|
||
.shopImg {
|
||
width: 100%;
|
||
height: 100%;
|
||
}
|
||
}
|
||
.shopName {
|
||
width: 100%;
|
||
white-space: nowrap;
|
||
overflow: hidden;
|
||
text-overflow: ellipsis;
|
||
font-family: "PingFangSC";
|
||
font-weight: 400;
|
||
font-size: 22rpx;
|
||
color: #130f05;
|
||
line-height: 32rpx;
|
||
text-align: justify;
|
||
font-style: normal;
|
||
}
|
||
.itemPrice {
|
||
.itemUnit {
|
||
font-family: "DINAlternate";
|
||
font-weight: bold;
|
||
font-size: 24rpx;
|
||
color: #130f05;
|
||
text-align: left;
|
||
font-style: normal;
|
||
}
|
||
.itemPrice {
|
||
font-family: "DINAlternate";
|
||
font-weight: bold;
|
||
font-size: 32rpx;
|
||
color: #130f05;
|
||
text-align: left;
|
||
font-style: normal;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
.shopList::-webkit-scrollbar {
|
||
display: none;
|
||
}
|
||
|
||
.activitieBox {
|
||
width: 100%;
|
||
box-sizing: border-box;
|
||
padding-top: 24rpx;
|
||
|
||
.activeTitle {
|
||
font-family: PingFangSC, PingFang SC;
|
||
font-weight: 400;
|
||
font-size: 28rpx;
|
||
color: #716f69;
|
||
line-height: 40rpx;
|
||
text-align: left;
|
||
font-style: normal;
|
||
margin-bottom: 16rpx;
|
||
}
|
||
|
||
.couponList {
|
||
width: 100%;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
flex-wrap: wrap;
|
||
|
||
.couponItem {
|
||
width: calc((100% - 24rpx) / 2) !important;
|
||
margin-right: 24rpx;
|
||
|
||
.itemImgBox {
|
||
width: 100%;
|
||
height: 192rpx;
|
||
border-radius: 12rpx;
|
||
overflow: hidden;
|
||
margin-bottom: 16rpx;
|
||
|
||
.itemImg {
|
||
width: 100%;
|
||
height: 100%;
|
||
}
|
||
}
|
||
|
||
.couponText {
|
||
font-family: PingFangSC, PingFang SC;
|
||
font-weight: 400;
|
||
font-size: 28rpx;
|
||
color: #130f05;
|
||
line-height: 40rpx;
|
||
text-align: left;
|
||
font-style: normal;
|
||
white-space: nowrap;
|
||
overflow: hidden;
|
||
text-overflow: ellipsis;
|
||
}
|
||
|
||
.couponTime {
|
||
display: flex;
|
||
align-items: center;
|
||
|
||
.timeIcon {
|
||
width: 24rpx;
|
||
height: 24rpx;
|
||
margin-right: 8rpx;
|
||
}
|
||
|
||
.couponTimeText {
|
||
width: calc(100% - 32rpx);
|
||
font-family: PingFangSC, PingFang SC;
|
||
font-weight: 400;
|
||
font-size: 24rpx;
|
||
color: #716f69;
|
||
line-height: 36rpx;
|
||
text-align: justify;
|
||
font-style: normal;
|
||
white-space: nowrap;
|
||
overflow: hidden;
|
||
text-overflow: ellipsis;
|
||
}
|
||
}
|
||
}
|
||
|
||
.couponItem:nth-child(2n) {
|
||
margin-right: 0;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
</style> |