1921 lines
48 KiB
Vue
1921 lines
48 KiB
Vue
<template>
|
|
<view v-if="XCXIsSelect=='是'">
|
|
<view>
|
|
<view class="food_all">
|
|
<!-- banner -->
|
|
<swiper class="swiper" :autoplay="true" interval="2000" duration="500" :circular="true"
|
|
style="width: 100%;height: 300rpx;">
|
|
<swiper-item v-for="(item,index) in shopDet.shopBanner" :key='index'>
|
|
<image :src="item" mode="scaleToFill" style="width: 100%;"></image>
|
|
</swiper-item>
|
|
</swiper>
|
|
<view class="shop padding">
|
|
<view class="flex justify-between">
|
|
<view style="width: 500rpx;">
|
|
<view class="text-xl text-bold u-line-1">{{shopDet.shopName}}
|
|
|
|
</view>
|
|
<view class="flex align-center margin-top-xs">
|
|
<view style="color: #FD6416;font-weight: bold;font-size: 30rpx;">
|
|
<u-icon name="star-fill" color="#FD6416" size="28"></u-icon>
|
|
{{shopDet.shopScore?shopDet.shopScore:0}}
|
|
</view>
|
|
|
|
<view class="margin-left-xs text-gray">销量 {{shopDet.shopSales?shopDet.shopSales:0}}
|
|
</view>
|
|
<view class="margin-left-xs text-gray" v-if="shopDet.errandTime">
|
|
约{{shopDet.errandTime}}分钟
|
|
</view>
|
|
<view class="margin-left-xs text-gray" v-if="shopDet.minimumDelivery">
|
|
{{shopDet.minimumDelivery}}元起送
|
|
</view>
|
|
</view>
|
|
<view class="flex align-center margin-top-xs">
|
|
<!-- <view style="color: #FCD202;margin-right: 8rpx;">{{shopDet.autoSendOrder==1?'商家配送':'平台配送'}}</view> -->
|
|
<view style="margin-right: 8rpx;">{{shopDet.autoSendOrder==1?'商家配送：':'平台配送：'}}</view>
|
|
<view class="text-gray" style="margin-right: 8rpx;">
|
|
配送费{{shopDet.errandMoney?shopDet.errandMoney:0}}元</view>
|
|
<view class="lable text-gray" v-if="shopDet.exemptMinMoney">
|
|
满{{shopDet.exemptMinMoney}}元免配送费</view>
|
|
</view>
|
|
|
|
|
|
</view>
|
|
<view>
|
|
<image :src="shopDet.shopCover" class="radius"
|
|
style="width: 110rpx;height: 110rpx;margin-top: 30rpx;">
|
|
</image>
|
|
</view>
|
|
</view>
|
|
<view class="flex align-center margin-top-xs" v-if="shopDet.shopNotice">
|
|
<text style="width: 14%;">公告：</text>
|
|
<u-notice-bar color="#AAAAAA" :speed="100" border-radius="30" padding="0rpx 0rpx"
|
|
bg-color="#f5f5f5" style="width: 86%;" type="none" mode="horizontal" :volume-icon="false"
|
|
:list="shopDet.shopNotice.split(',')"></u-notice-bar>
|
|
</view>
|
|
<view class="margin-top-xs" style="width: 100%;height: 40rpx;" v-if="couponList.length>0">
|
|
<scroll-view scroll-x="true" class="scroll-view_H">
|
|
<view class="coupon-item flex align-center" v-for="(item,index) in couponList" :key="index"
|
|
@click="coupons=true">
|
|
<view>¥</view>
|
|
<view class="" style="font-weight: bold;font-size: 24rpx;margin-right: 10rpx;">
|
|
{{item.money}}
|
|
</view>
|
|
<view style="margin-right: 20rpx;">满{{item.minMoney}}可用</view>
|
|
<view style="font-weight: bold;">领</view>
|
|
</view>
|
|
<!-- <view class="flex align-center" style="width: 100%;height: 100%;">
|
|
|
|
</view> -->
|
|
|
|
</scroll-view>
|
|
</view>
|
|
</view>
|
|
<!-- 食品 -->
|
|
<view class="food">
|
|
<!-- 店名地址 -->
|
|
<view class="food_address">
|
|
<view class="flex flex-sub bg justify-between padding-right-xl">
|
|
<view @click="switchTab(1)" :class="current==1? 'select':''" class="tabBtn">
|
|
<view class="title">全部商品</view>
|
|
<view :class="current==1? 'active1':''"></view>
|
|
</view>
|
|
<view @click="switchTab(2)" :class="current==2? 'select':''" class="tabBtn">
|
|
<view class="title">评价</view>
|
|
<view :class="current==2? 'active1':''"></view>
|
|
</view>
|
|
<view @click="switchTab(3)" :class="current==3? 'select':''" class="tabBtn">
|
|
<view class="title">商家</view>
|
|
<view :class="current==3? 'active1':''"></view>
|
|
</view>
|
|
</view>
|
|
<!-- <view class="flex Switch">
|
|
<view @click="tabSwidth(1)" :class="orderType==1?'selSwitch':''">自取</view>
|
|
<view @click="tabSwidth(2)" :class="orderType==2?'selSwitch':''">外卖</view>
|
|
</view> -->
|
|
<view>
|
|
<!-- #ifdef MP-WEIXIN -->
|
|
<image @click="goPindan()" src="../../../static/images/index/pindan.png"
|
|
style="width: 160rpx;height: 64rpx;" mode=""></image>
|
|
<!-- #endif -->
|
|
</view>
|
|
</view>
|
|
<view class="VerticalBox" v-if="current==1">
|
|
<scroll-view class="VerticalNav nav bg-gray" scroll-y scroll-with-animation
|
|
:scroll-top="verticalNavTop" style="height:calc(100vh - 590upx)">
|
|
<view style="font-size: 28upx;" class="cu-item text-lg"
|
|
:class="index==tabCur?'cur':'text-gray'" v-for="(item,index) in dataList" :key="index"
|
|
@tap="TabSelect" :data-id="index">
|
|
{{item.classifyName}}
|
|
</view>
|
|
</scroll-view>
|
|
<scroll-view class="VerticalMain" scroll-y scroll-with-animation
|
|
style="height:calc(100vh - 590rpx)" :scroll-into-view="'main-'+mainCur"
|
|
@scroll="VerticalMain">
|
|
<view class="bg-white padding-sm margin-bottom-sm" v-for="(item,index) in dataList"
|
|
v-if="item.goodsList.length" :key="index" :id="'main-'+index">
|
|
<view class="flex justify-between padding-bottom-sm" @click="goDet(ite.goodsId)"
|
|
v-for="(ite,ind) in item.goodsList" :key='ind'>
|
|
<image :src="ite.goodsCover" mode=""
|
|
style="width: 184rpx;height: 184rpx;border-radius: 10rpx;"></image>
|
|
<view
|
|
class="flex-sub margin-left-sm padding-tb-xs flex flex-direction justify-between">
|
|
<view class="text-black text-lg text-bold" style="font-size: 30upx;">
|
|
{{ite.goodsName}}
|
|
</view>
|
|
<view class="text-gray">
|
|
已售 {{ite.sales?ite.sales:0}}
|
|
</view>
|
|
<view class="text-gray text-sm u-line-2"
|
|
style="overflow: hidden;line-clamp: 2;-webkit-line-clamp: 2;width: 100%;">
|
|
{{ite.goodsDescribe?ite.goodsDescribe:''}}
|
|
</view>
|
|
<view class="flex justify-between">
|
|
<view class="text-sm text-red">
|
|
¥ <text class="text-lg">{{ite.goodsMoney}}</text>
|
|
</view>
|
|
<image @click.stop="selSku(ite)" src="../../../static/images/index/add.png"
|
|
mode="" style="width: 40rpx;height: 40rpx"></image>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</scroll-view>
|
|
<empty v-if="!dataList.length"></empty>
|
|
</view>
|
|
<view class="" v-if="current==2">
|
|
<view class="flex margin-lr padding-tb-sm u-border-bottom" v-if="shopDet.shopScore">
|
|
<view class="flex padding-right">
|
|
<view class="text-sl" style="color: #FD6416;">{{shopDet.shopScore}}</view>
|
|
<view class="flex flex-direction justify-around margin-left-sm">
|
|
<view>商家评分</view>
|
|
<view class="flex">
|
|
<u-icon v-for="ite in shopDet.shopScore1" :key='ite' color="#FCD202"
|
|
name="star-fill"></u-icon>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view class="flex-sub flex justify-around u-border-left padding-left">
|
|
<view class="flex flex-direction justify-around text-center">
|
|
<view>好评</view>
|
|
<view>{{EvaluateData.goodReputation?EvaluateData.goodReputation:0}}</view>
|
|
</view>
|
|
<view class="flex flex-direction justify-around text-center">
|
|
<view>中评</view>
|
|
<view>{{EvaluateData.mediumReview?EvaluateData.mediumReview:0}}</view>
|
|
</view>
|
|
<view class="flex flex-direction justify-around text-center">
|
|
<view>差评</view>
|
|
<view>{{EvaluateData.negativeComment?EvaluateData.negativeComment:0}}</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view class="padding-tb-sm margin-lr">
|
|
<u-button hover-class='none' @click="sel(0)" type="primary" shape="circle" size="mini"
|
|
:plain="false" :custom-style="count==0?customStyle:customStyle1">全部评论</u-button>
|
|
<u-button hover-class='none' @click="sel(1)" type="primary" shape="circle" size="mini"
|
|
:plain="false" :custom-style="count==1?customStyle:customStyle1">
|
|
好评({{EvaluateData.goodReputation?EvaluateData.goodReputation:0}})</u-button>
|
|
<u-button hover-class='none' @click="sel(2)" type="primary" shape="circle" size="mini"
|
|
:plain="false" :custom-style="count==2?customStyle:customStyle1">
|
|
中评({{EvaluateData.mediumReview?EvaluateData.mediumReview:0}})</u-button>
|
|
<u-button hover-class='none' @click="sel(3)" type="primary" shape="circle" size="mini"
|
|
:plain="false" :custom-style="count==3?customStyle:customStyle1">
|
|
差评({{EvaluateData.negativeComment?EvaluateData.negativeComment:0}})</u-button>
|
|
</view>
|
|
<view class="padding-tb-sm margin-lr u-border-bottom" v-for="(item, index) in EvaluateList"
|
|
:key='index'>
|
|
<view class="flex justify-between align-center">
|
|
<view class="flex align-center">
|
|
<u-avatar :src="item.avatar" size="65"></u-avatar>
|
|
<view class=" margin-left-sm" style="line-height: 46upx;">
|
|
{{item.userName?item.userName:'匿名'}}
|
|
</view>
|
|
<view class="flex margin-left-sm">
|
|
<u-icon v-for="ite in item.score" :key='ite' color="#FCD202" name="star-fill">
|
|
</u-icon>
|
|
</view>
|
|
</view>
|
|
|
|
<view>{{item.createTime}}</view>
|
|
</view>
|
|
<view class="margin-top-sm">{{item.evaluateMessage}}</view>
|
|
<view class="pinglunImg" v-if="item.pictures!=undefined && item.pictures">
|
|
<view class="pinglunImg-box flex justify-between flex-wrap">
|
|
<image style="margin-bottom: 20rpx;"
|
|
@click="yuanlan(item.pictures==undefined?[]:item.pictures.split(','),index2)"
|
|
v-for="(item2,index2) in item.pictures==undefined?[]:item.pictures.split(',')"
|
|
:src="item2" mode=""></image>
|
|
<image style="margin-bottom: 20rpx;width: 160rpx;height: 0;" src="" mode=""></image>
|
|
<image style="margin-bottom: 20rpx;width: 160rpx;height: 0;" src="" mode=""></image>
|
|
</view>
|
|
</view>
|
|
<view class="margin-top-sm" v-if="item.shopReplyMessage">
|
|
<view class="flex align-center">
|
|
<view class=" flex align-center text-df" style="color: #999999;">
|
|
<view class="text-df">商家回复:</view>{{item.shopReplyMessage}}
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<empty v-if="!EvaluateList.length"></empty>
|
|
</view>
|
|
<view class="margin-lr padding-bottom" v-if="current==3">
|
|
<view class="flex align-center margin-top-sm">
|
|
<view class="flex-sub">
|
|
<view class="text-black text-lg text-bold">{{shopDet.shopName}}</view>
|
|
<view class="margin-top-sm" @click="goMap">
|
|
<u-icon name="map" size="28"></u-icon> {{shopDet.detailedAddress}}
|
|
</view>
|
|
</view>
|
|
<image @click="call(shopDet.phone)" src="../../../static/images/index/phone.png"
|
|
class="radius" style="width: 38rpx;height: 49rpx;">
|
|
</image>
|
|
</view>
|
|
<image :src="shopDet.shopCover" class="radius margin-top-sm"
|
|
style="width: 140rpx;height: 140rpx;">
|
|
</image>
|
|
<view class="text-black text-lg text-bold margin-top-xs">商家信息</view>
|
|
<view class="text-black margin-top-xs text-df">
|
|
营业时间：{{shopDet.businessHours}}-{{shopDet.lockHours}}</view>
|
|
<view class="text-black margin-top-xs text-df">商家品类：{{shopDet.shopTypeName}}</view>
|
|
<view class="text-black margin-top-xs text-df">配送范围：{{shopDet.distributionDistance}}以内</view>
|
|
<view class="text-black margin-top-xs text-df" v-if="shopDet.shopNotice">
|
|
公告：{{shopDet.shopNotice}}</view>
|
|
<view class="text-black margin-top-xs text-df" v-else>公告：店铺开业啦！</view>
|
|
</view>
|
|
</view>
|
|
<!-- 结算 -->
|
|
<view class="settlement" @click="isPopupShow" v-if="current==1">
|
|
<view class="settlement_img">
|
|
<image src="../../../static/images/index/diancan.png" mode=""></image>
|
|
<view class="settlement_hot">{{goodsNum}}</view>
|
|
</view>
|
|
<view class="settlement_le">
|
|
<text>￥</text>{{totalPrice}}
|
|
<text v-if="shopDet.minimumDelivery"
|
|
style="margin-left: 10rpx;">{{shopDet.minimumDelivery}}元起送</text>
|
|
</view>
|
|
<view v-if="totalPrice>=shopDet.minimumDelivery" class="settlement_ri" @click.stop="goConfirm()">去结算
|
|
</view>
|
|
<view v-else class="settlement_ri1">去结算</view>
|
|
</view>
|
|
<!-- 购物车弹窗 -->
|
|
<u-popup v-model="popupShow" mode="bottom" border-radius="20">
|
|
<view class="padding">
|
|
<view class="flex justify-between align-center margin-bottom-sm">
|
|
<view class="text-bold text-black text-df">已选餐品</view>
|
|
<view class="flex align-center">
|
|
<image src="../../../static/images/index/delete.png" style="width: 28rpx;height: 31rpx;"
|
|
mode=""></image>
|
|
<text class="margin-left-xs" @click="empty">清空购物车</text>
|
|
</view>
|
|
</view>
|
|
<scroll-view scroll-y='true' class="popup">
|
|
<view v-for="(item,ind) in goodsList.orderGoodsList[0]" :key='ind'>
|
|
<view class="flex align-center margin-tb-sm">
|
|
<image :src="item.goodsPicture[0]"
|
|
style="width: 96rpx;height: 96rpx;border-radius: 10rpx;">
|
|
</image>
|
|
<view class="margin-left-sm">
|
|
<view>{{item.goodsName}}</view>
|
|
<view v-if="item.skuMessage">{{item.skuMessage}}</view>
|
|
</view>
|
|
</view>
|
|
<view class="flex justify-between align-center">
|
|
<view class="text-bold text-sm">¥<text class="text-lg">{{item.goodsPrice}}</text>
|
|
</view>
|
|
<view class="flex align-center justify-between">
|
|
<view @click.stop="noAdd(item,ind)">
|
|
<image src="../../../static/images/index/jian.png"
|
|
style="width: 54rpx;height: 54rpx;"></image>
|
|
</view>
|
|
<view class="text-center margin-lr-xs">{{item.goodsNum}}</view>
|
|
<view @click.stop="add(item,ind)">
|
|
<image src="../../../static/images/index/add.png"
|
|
style="width: 50rpx;height: 50rpx;"></image>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</scroll-view>
|
|
</view>
|
|
<view class="settlement1 margin-top-lg">
|
|
<view class="settlement_img">
|
|
<image src="../../../static/images/index/diancan.png" mode=""></image>
|
|
<view class="settlement_hot">{{goodsNum}}</view>
|
|
</view>
|
|
<view class="settlement_le">
|
|
<text>￥</text>{{totalPrice}}
|
|
<text v-if="shopDet.minimumDelivery"
|
|
style="margin-left: 10rpx;">{{shopDet.minimumDelivery}}元起送</text>
|
|
</view>
|
|
<view v-if="totalPrice>=shopDet.minimumDelivery" class="settlement_ri"
|
|
@click.stop="goConfirm()">去结算</view>
|
|
<view v-else class="settlement_ri1">去结算</view>
|
|
</view>
|
|
</u-popup>
|
|
<!-- 选择规格弹窗 -->
|
|
<u-popup v-model="skuShow" mode="center" :closeable='true' border-radius="20">
|
|
<view style="width: 700rpx;">
|
|
<view class="text-center text-lg text-bold padding-tb">{{goodsDet.goodsName}}</view>
|
|
<view class="margin-top-sm padding-lr" v-for="(item,index) in attrList" :key="index">
|
|
<view class="text-bold text-black">{{item.value}}</view>
|
|
<view class="flex margin-tb-sm flex-wrap">
|
|
<view v-for="(ite, ind) in item.detail" :key="ind" @click="skuSel(ite,index,ind)"
|
|
class="margin-bottom-sm">
|
|
<view class="skuBtn"
|
|
:class="item.goodsId == index && item.attrId == ind?'active': ''">
|
|
{{ite.name}}
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view class="flex justify-between padding-lr padding-top">
|
|
<view>
|
|
<view class="text-xl text-bold text-black"><text class="text-sm">￥</text>{{price}}
|
|
</view>
|
|
<view class="detail_describe_text2">{{checkString}}</view>
|
|
</view>
|
|
<u-number-box v-model="value" :min="1" @change="valChange"></u-number-box>
|
|
</view>
|
|
<view class="detail_account_bottom padding">
|
|
<view class="detail_account_bottom_le" @click="payment()">立即购买</view>
|
|
<view class="detail_account_bottom_ri" @click="orderSel(2)">加入购物车</view>
|
|
|
|
</view>
|
|
</view>
|
|
</u-popup>
|
|
<!-- 优惠券弹窗 -->
|
|
<!-- coupons -->
|
|
<u-popup v-model="coupons" height="520rpx" mode="bottom" :closeable="true">
|
|
<view class="yhq flex justify-center align-center">
|
|
<view class="yhq-box">
|
|
<view class="yhq-box-title">
|
|
优惠券
|
|
</view>
|
|
<view class="yhq-box-list">
|
|
<scroll-view scroll-y="true" style="width: 100%;height: 100%;padding-bottom: 20rpx;">
|
|
<view class="yhq-box-list-item flex justify-center align-center"
|
|
v-for="(item,index) in couponList" :key="index">
|
|
<view class="yhq-box-list-item-c flex justify-between align-center">
|
|
<view class="yhq-box-list-item-c-l flex align-center">
|
|
<image
|
|
:src="item.couponPicture?item.couponPicture:'../../../static/logo.png'"
|
|
style="width: 80rpx;height: 80rpx;border-radius: 20rpx;" mode="">
|
|
</image>
|
|
<view class="" style="margin-left: 20rpx;">
|
|
<view class="">
|
|
<text
|
|
style="color: red;margin-right: 10rpx;">¥{{item.money}}</text>
|
|
<text style="font-weight: bold;margin-right: 10rpx;">优惠券</text>
|
|
(满{{item.minMoney}}元可用)
|
|
</view>
|
|
<view class="" style="font-size: 20rpx;color: gray;">
|
|
领取后{{item.endDate}}天内有效
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view class="yhq-box-list-item-c-r" style="color: red;"
|
|
@click="lingqv(item.couponId)">
|
|
领取
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</scroll-view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</u-popup>
|
|
|
|
</view>
|
|
<view class="hintPopul" v-if="shopDet&&shopDet.putawayFlag==1">
|
|
<view class="content_">
|
|
<image src="../../../static/images/index/shop.png" style="width: 200rpx;height: 180rpx;">
|
|
</image>
|
|
<view class="text-xl text-bold">店铺打烊啦</view>
|
|
<view class="hintText margin-top-sm text-gray">现在店铺已经打烊了,营业时间</view>
|
|
<view class="margin-top-xs text-gray margin-bottom">{{shopDet.businessHours}}-{{shopDet.lockHours}}
|
|
</view>
|
|
<view class="Btns" @click="goBack()">知道了</view>
|
|
</view>
|
|
</view>
|
|
|
|
|
|
|
|
|
|
</view>
|
|
|
|
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
import empty from '@/components/empty.vue'
|
|
export default {
|
|
components: {
|
|
empty
|
|
},
|
|
data() {
|
|
return {
|
|
maskCustomStyle: {
|
|
background: 'rgba(0,0,0,0.1)'
|
|
},
|
|
hdStyle: {
|
|
background: '#F5F5F5',
|
|
},
|
|
customStyle: {
|
|
color: '#333333',
|
|
background: '#FCD202',
|
|
marginRight: '20rpx',
|
|
border: 0
|
|
},
|
|
customStyle1: {
|
|
color: '#333333',
|
|
background: '#F2F2F2',
|
|
marginRight: '20rpx',
|
|
border: 0
|
|
},
|
|
current: 1,
|
|
loading: false, // 是否显示骨架屏组件
|
|
tabCur: 0,
|
|
mainCur: 0,
|
|
verticalNavTop: 0,
|
|
load: true,
|
|
dataList: [],
|
|
shopDet: {},
|
|
shopList: [],
|
|
city: '西安',
|
|
lat: '',
|
|
lng: '',
|
|
shopName: '',
|
|
page: 1,
|
|
limit: 10,
|
|
evaluatePage: 1,
|
|
evaluateLimit: 10,
|
|
show: true,
|
|
totalPrice: 0,
|
|
goodsNum: 0,
|
|
goodsList: {
|
|
orderGoodsList: [
|
|
[]
|
|
]
|
|
},
|
|
popupShow: false,
|
|
skuShow: false,
|
|
|
|
userId: '',
|
|
hintShow: true, //
|
|
shouquan: 0,
|
|
orderType: 2,
|
|
|
|
value: 1,
|
|
goodsDet: {},
|
|
skuId: '',
|
|
skuMessage: '',
|
|
skuList: [],
|
|
attrList: [],
|
|
checkString: '',
|
|
checkStateList: [],
|
|
CheckattrValue: false,
|
|
price: 0,
|
|
echoSkuList: [],
|
|
echoSku: [],
|
|
isEchoSku: {},
|
|
shopId: '',
|
|
lng: '',
|
|
lat: '',
|
|
commentList: [],
|
|
EvaluateList: [],
|
|
EvaluateData: {},
|
|
grade: '',
|
|
count: 0,
|
|
orderId: '',
|
|
isTrue: false,
|
|
XCXIsSelect: '否',
|
|
couponList: [], //优惠券列表
|
|
coupons: false,
|
|
}
|
|
},
|
|
onLoad(option) {
|
|
this.XCXIsSelect = this.$queue.getData('XCXIsSelect');
|
|
if (this.XCXIsSelect == '否') {
|
|
// this.getGuize()
|
|
uni.setNavigationBarTitle({
|
|
title: '隐私政策'
|
|
});
|
|
} else {
|
|
uni.setNavigationBarTitle({
|
|
title: '店铺详情'
|
|
});
|
|
}
|
|
let that = this
|
|
that.shopId = option.shopId
|
|
|
|
uni.showLoading({
|
|
title: '加载中'
|
|
})
|
|
|
|
// #ifndef H5
|
|
uni.getLocation({
|
|
type: 'gcj02', //返回可以用于uni.openLocation的经纬度
|
|
success: function(res) {
|
|
console.log(res, '经纬度')
|
|
that.lat = res.latitude;
|
|
that.lng = res.longitude;
|
|
|
|
}
|
|
});
|
|
that.getData()
|
|
// #endif
|
|
// #ifdef H5
|
|
uni.getLocation({
|
|
type: 'gcj02', //返回可以用于uni.openLocation的经纬度
|
|
success: function(res) {
|
|
console.log(res, '经纬度')
|
|
that.lat = res.latitude;
|
|
that.lng = res.longitude;
|
|
that.getData()
|
|
}
|
|
});
|
|
|
|
that.getData()
|
|
// #endif
|
|
that.orderId = uni.getStorageSync('orderId') ? uni.getStorageSync('orderId') : ''
|
|
},
|
|
onHide() {
|
|
uni.removeStorageSync('types')
|
|
},
|
|
onShow() {
|
|
this.orderId = uni.getStorageSync('orderId') ? uni.getStorageSync('orderId') : ''
|
|
if (this.orderId) {
|
|
this.getOrderDetail();
|
|
}
|
|
this.userId = uni.getStorageSync('userId')
|
|
this.getOrderList()
|
|
this.getcouponList()
|
|
|
|
},
|
|
onShareAppMessage(res) { //发送给朋友
|
|
return {
|
|
title: this.shopDet.shopName,
|
|
path: '/pages/index/index?shopId=' + this.shopDet.shopId,
|
|
imageUrl: this.shopDet.shopCover,
|
|
}
|
|
},
|
|
onShareTimeline(res) { //分享到朋友圈
|
|
return {
|
|
title: this.shopDet.shopName,
|
|
path: '/pages/index/index?shopId=' + this.shopDet.shopId,
|
|
imageUrl: this.shopDet.shopCover,
|
|
}
|
|
},
|
|
methods: {
|
|
//领取优惠券
|
|
lingqv(couponId, needIntegral) {
|
|
let that = this
|
|
let data = {
|
|
couponId: couponId,
|
|
}
|
|
that.$Request.postT("/app/coupon/buyCoupon", data).then(res => {
|
|
if (res.code == 0) {
|
|
uni.showToast({
|
|
title: '领取成功'
|
|
})
|
|
that.coupons = false
|
|
} else {
|
|
uni.showToast({
|
|
title: res.msg,
|
|
icon: 'none'
|
|
})
|
|
}
|
|
});
|
|
},
|
|
//获取商家优惠券
|
|
getcouponList() {
|
|
// couponList
|
|
let data = {
|
|
shopId: this.shopId,
|
|
}
|
|
this.$Request.get("/app/coupon/seleteAllCoupon", data).then(res => {
|
|
if (res.code == 0 && res.data) {
|
|
this.couponList = res.data
|
|
}
|
|
});
|
|
},
|
|
// 预览图片
|
|
yuanlan(arr, index) {
|
|
uni.previewImage({
|
|
urls: arr,
|
|
current: index
|
|
})
|
|
},
|
|
goBack() {
|
|
uni.navigateBack({
|
|
|
|
})
|
|
},
|
|
goNav(url) {
|
|
uni.navigateTo({
|
|
url
|
|
})
|
|
},
|
|
switchTab(e) {
|
|
// this.page = 1
|
|
this.current = e
|
|
|
|
if (this.current == 1) {
|
|
this.getData()
|
|
} else if (this.current == 2) {
|
|
this.evaluatePage = 1;
|
|
this.getEvaluateList()
|
|
} else if (this.current == 3) {
|
|
|
|
}
|
|
},
|
|
sel(e) {
|
|
this.grade = e
|
|
this.count = e
|
|
this.evaluatePage = 1
|
|
this.getEvaluateList()
|
|
},
|
|
// 获取评论列表
|
|
getEvaluateList() {
|
|
let data = {
|
|
shopId: this.shopId,
|
|
page: this.evaluatePage,
|
|
limit: this.evaluateLimit,
|
|
grade: this.grade
|
|
}
|
|
this.$Request.get("/app/goods/selectEvaluateByShopId", data).then(res => {
|
|
if (res.code == 0 && res.data) {
|
|
this.EvaluateData = res.data
|
|
if (this.evaluatePage == 1) {
|
|
this.EvaluateList = res.data.pageUtils.list
|
|
} else {
|
|
this.EvaluateList = [...this.EvaluateList, ...res.data.pageUtils.list]
|
|
}
|
|
}
|
|
});
|
|
},
|
|
// 获取店铺信息
|
|
getData() {
|
|
let data = {
|
|
shopId: this.shopId,
|
|
lng: this.lng,
|
|
lat: this.lat
|
|
}
|
|
this.$Request.get("/app/goods/selectGoodsList", data).then(res => {
|
|
if (res.code == 0 && res.data) {
|
|
this.dataList = res.data.list
|
|
this.shopDet = res.data.goodsShop
|
|
|
|
for (var i = 0; i < this.dataList.length; i++) {
|
|
this.dataList[i].id = i
|
|
}
|
|
|
|
this.shopDet.shopScore1 = Math.floor(this.shopDet.shopScore)
|
|
this.shopDet.errandTime = Math.round(this.shopDet.errandTime)
|
|
if (this.shopDet.shopBanner) {
|
|
this.shopDet.shopBanner = this.shopDet.shopBanner.split(',')
|
|
}
|
|
this.shopDet.shopScore = this.shopDet.shopScore.toFixed(2)
|
|
if (this.shopDet.distributionDistance < 1000) {
|
|
this.shopDet.distributionDistance = '<1000m'
|
|
} else {
|
|
this.shopDet.distributionDistance = Number(this.shopDet.distributionDistance / 1000) +
|
|
'km'
|
|
}
|
|
|
|
uni.setNavigationBarTitle({
|
|
title: this.shopDet.shopName
|
|
})
|
|
|
|
}
|
|
uni.hideLoading()
|
|
});
|
|
},
|
|
getEchoOrder() {
|
|
let data = {
|
|
shopId: this.shopId,
|
|
goodsId: this.goodsDet.goodsId
|
|
}
|
|
this.$Request.get("/app/order/echoOrder", data).then(res => {
|
|
if (res.code == 0 && res.data.length) {
|
|
this.echoSkuList = res.data
|
|
if (res.data[0].skuMessage) {
|
|
this.echoSku = res.data[0].skuMessage.split(',')
|
|
}
|
|
}
|
|
});
|
|
},
|
|
// 弹窗展示商品详情
|
|
selSku(item) {
|
|
console.log(item)
|
|
this.checkStateList = []
|
|
this.checkString = ''
|
|
this.attrList = [];
|
|
this.skuId = '';
|
|
this.skuMessage = '';
|
|
this.$Request.get("/app/goods/selectGoodsById?goodsId=" + item.goodsId).then(res => {
|
|
uni.hideLoading()
|
|
if (res.code == 0) {
|
|
this.goodsDet = res.data
|
|
if (this.goodsDet.goodsLabel) {
|
|
this.goodsDet.goodsLabel = this.goodsDet.goodsLabel.split(',')
|
|
}
|
|
if (this.goodsDet.goodsPicture) {
|
|
this.goodsDet.goodsPicture = this.goodsDet.goodsPicture.split(',')
|
|
}
|
|
this.price = this.goodsDet.goodsMoney
|
|
this.skuList = this.goodsDet.sku
|
|
this.getEchoOrder()
|
|
|
|
if (!this.skuList.length) {
|
|
let that = this
|
|
setTimeout(function() {
|
|
that.orderSel(2)
|
|
|
|
}, 500)
|
|
} else {
|
|
if (this.goodsDet.attr.length) {
|
|
this.attrList = this.goodsDet.attr[0] ? this.goodsDet.attr[0].attrValue : []
|
|
} else {
|
|
this.skuId = this.goodsDet.sku[0].id
|
|
}
|
|
this.attrList.forEach(res => {
|
|
let data = {
|
|
name: ''
|
|
}
|
|
this.checkStateList.push(data);
|
|
let detail = [];
|
|
console.log(res.detail)
|
|
if (res.detail.length > 0) {
|
|
res.detail.split(',').forEach(d => {
|
|
let data = {
|
|
name: '',
|
|
state: ''
|
|
}
|
|
data.name = d;
|
|
detail.push(data);
|
|
});
|
|
res.detail = detail;
|
|
}
|
|
})
|
|
|
|
this.skuShow = true
|
|
}
|
|
|
|
}
|
|
});
|
|
|
|
},
|
|
// 选择规格
|
|
skuSel(item, index, ind) {
|
|
console.log(item, index, ind)
|
|
this.attrList[index].goodsId = index
|
|
this.attrList[index].attrId = ind
|
|
this.checkStateList[index].name = item.name;
|
|
this.checkString = '';
|
|
|
|
this.checkStateList.forEach(d => {
|
|
if (d.name) {
|
|
if (this.checkString) {
|
|
this.checkString = this.checkString + ',' + d.name;
|
|
} else {
|
|
this.checkString = d.name;
|
|
}
|
|
}
|
|
});
|
|
console.log(this.skuList)
|
|
for (var i = 0; i < this.skuList.length; i++) {
|
|
let d = this.skuList[i];
|
|
if (d.detailJson == this.checkString) {
|
|
console.log(d.detailJson, this.checkString)
|
|
// if (d.stock > 0) {
|
|
this.skuId = d.id
|
|
this.skuMessage = d.detailJson
|
|
this.price = d.skuPrice
|
|
this.CheckattrValue = true;
|
|
// } else {
|
|
// this.$queue.showToast('库存不足请选择其他规格')
|
|
// }
|
|
|
|
break
|
|
} else {
|
|
this.CheckattrValue = false;
|
|
}
|
|
}
|
|
},
|
|
valChange(e) {
|
|
console.log('当前值为: ' + e.value)
|
|
this.value = e.value
|
|
},
|
|
// 立即购买
|
|
payment() {
|
|
if (!this.userId) {
|
|
uni.navigateTo({
|
|
url: '/pages/public/login'
|
|
})
|
|
return
|
|
}
|
|
if (this.attrList.length) {
|
|
if (this.checkString == '' || !this.CheckattrValue) {
|
|
this.$queue.showToast('请选择正确的商品规格');
|
|
return;
|
|
}
|
|
}
|
|
|
|
let goodstr1 = 0 //商品库的 必须次数
|
|
let goodstr2 = 0 //购物车的 必须次数
|
|
let regex = new RegExp('必选', 'g');
|
|
let dataList = JSON.stringify(this.dataList)
|
|
if (dataList.match(regex)) {
|
|
goodstr1 = dataList.match(regex).length
|
|
console.log("goodstr1----" + goodstr1)
|
|
if (dataList.indexOf('必选') != -1) { //检测商品是否存在必选
|
|
let goodsList = JSON.stringify(this.goodsDet)
|
|
if (goodsList.match(regex)) {
|
|
goodstr2 = goodsList.match(regex).length
|
|
console.log("goodstr2----" + goodstr2)
|
|
if (goodstr1 == goodstr2) { //检查购物车商品是否存在必须
|
|
let data = {
|
|
goodsId: this.goodsDet.goodsId,
|
|
skuMessage: this.skuMessage,
|
|
skuId: this.skuId,
|
|
num: this.value,
|
|
orderType: this.orderType,
|
|
shopId: this.shopId,
|
|
}
|
|
this.$Request.post("/app/order/buyGoods", data).then(res => {
|
|
if (res.code == 0) {
|
|
this.skuShow = false
|
|
uni.navigateTo({
|
|
url: '/pages/index/shop/payOrder?orderId=' + res.data + '&orderType=' + this
|
|
.orderType
|
|
})
|
|
|
|
} else {
|
|
this.$queue.showToast(res.msg);
|
|
}
|
|
})
|
|
} else {
|
|
uni.showToast({
|
|
title: "有" + goodstr1 + "个必选商品，请选择后结算",
|
|
icon: "none"
|
|
})
|
|
return
|
|
}
|
|
|
|
} else {
|
|
uni.showToast({
|
|
title: "有" + goodstr1 + "个必选商品，请选择后结算",
|
|
icon: "none"
|
|
})
|
|
return
|
|
}
|
|
}
|
|
} else {
|
|
let data = {
|
|
goodsId: this.goodsDet.goodsId,
|
|
skuMessage: this.skuMessage,
|
|
skuId: this.skuId,
|
|
num: this.value,
|
|
orderType: this.orderType,
|
|
shopId: this.shopId,
|
|
}
|
|
this.$Request.post("/app/order/buyGoods", data).then(res => {
|
|
if (res.code == 0) {
|
|
this.skuShow = false
|
|
uni.navigateTo({
|
|
url: '/pages/index/shop/payOrder?orderId=' + res.data + '&orderType=' + this
|
|
.orderType
|
|
})
|
|
|
|
} else {
|
|
this.$queue.showToast(res.msg);
|
|
}
|
|
})
|
|
}
|
|
},
|
|
// 加入购物车
|
|
orderSel(e) {
|
|
if (!this.userId) {
|
|
uni.navigateTo({
|
|
url: '/pages/public/login'
|
|
})
|
|
return
|
|
}
|
|
if (this.attrList.length) {
|
|
if (this.checkString == '' || !this.CheckattrValue) {
|
|
this.$queue.showToast('请选择正确的商品规格');
|
|
return;
|
|
}
|
|
}
|
|
|
|
|
|
// if (this.echoSku.length) {
|
|
// this.echoSkuList.forEach(res => {
|
|
// if (res.skuMessage == this.skuMessage) {
|
|
// this.isEchoSku = res
|
|
// }
|
|
// })
|
|
// if (JSON.stringify(this.isEchoSku) != "{}") {
|
|
// let data = {
|
|
// orderGoodsId: this.isEchoSku.id,
|
|
// type: 1,
|
|
// num: this.value,
|
|
// shopId: this.shopId,
|
|
// }
|
|
|
|
// this.$Request.get("/app/order/updateGoodsNum", data).then(res => {
|
|
// if (res.code == 0) {
|
|
// // setTimeout(function() {
|
|
// this.$queue.showToast('添加成功');
|
|
|
|
|
|
// this.skuShow = false
|
|
// this.getOrderList()
|
|
// // },1000)
|
|
// } else {
|
|
// this.$queue.showToast(res.msg);
|
|
// }
|
|
// });
|
|
// return
|
|
// }
|
|
// }
|
|
|
|
let data = {
|
|
goodsId: this.goodsDet.goodsId,
|
|
skuMessage: this.skuMessage,
|
|
skuId: this.skuId,
|
|
num: this.value,
|
|
shopId: this.shopId,
|
|
}
|
|
let url = ''
|
|
if (this.types == 1) {
|
|
url = '/app/order/joinOrder'
|
|
} else {
|
|
url = '/app/order/insertOrder'
|
|
}
|
|
this.$Request.post('/app/order/insertOrder', data).then(res => {
|
|
if (res.code == 0) {
|
|
this.$queue.showToast('添加成功');
|
|
this.skuShow = false
|
|
this.getOrderList()
|
|
|
|
} else {
|
|
this.$queue.showToast(res.msg);
|
|
}
|
|
})
|
|
},
|
|
// 切换外卖/自提
|
|
tabSwidth(e) {
|
|
this.orderType = e
|
|
this.getOrderList()
|
|
},
|
|
// 展示购物车弹窗
|
|
isPopupShow() {
|
|
console.log(this.goodsList, '677')
|
|
if (this.goodsList && this.goodsList.orderGoodsList && this.goodsList.orderGoodsList[0].length > 0) {
|
|
this.popupShow = true
|
|
} else {
|
|
uni.showToast({
|
|
title: '请先添加商品',
|
|
icon: "none"
|
|
})
|
|
}
|
|
},
|
|
// 添加数量
|
|
add(item, index) {
|
|
// this.count++;
|
|
console.log(item, index)
|
|
this.goodsList.orderGoodsList[0][index].goodsNum++
|
|
|
|
let data = {
|
|
orderGoodsId: this.goodsList.orderGoodsList[0][index].id,
|
|
type: 1,
|
|
num: 1,
|
|
shopId: this.shopId
|
|
}
|
|
this.$Request.get("/app/order/updateGoodsNum", data).then(res => {
|
|
if (res.code == 0) {
|
|
this.getOrderList()
|
|
} else {
|
|
this.$queue.showToast(res.msg);
|
|
this.goodsList.orderGoodsList[0][index].goodsNum--
|
|
}
|
|
});
|
|
},
|
|
// 减少数量
|
|
noAdd(item, index) {
|
|
console.log(item, index)
|
|
this.goodsList.orderGoodsList[0][index].goodsNum--
|
|
// this.count--;
|
|
let data = {
|
|
orderGoodsId: this.goodsList.orderGoodsList[0][index].id,
|
|
type: 2,
|
|
num: 1,
|
|
shopId: this.shopId
|
|
}
|
|
this.$Request.get("/app/order/updateGoodsNum", data).then(res => {
|
|
if (res.code == 0) {
|
|
this.getOrderList()
|
|
}
|
|
});
|
|
},
|
|
// 清空购物车
|
|
empty() {
|
|
let data = {
|
|
shopId: this.shopId,
|
|
}
|
|
this.$Request.post("/app/order/emptyShoppingTrolley", data).then(res => {
|
|
if (res.code == 0) {
|
|
this.totalPrice = 0
|
|
this.goodsNum = 0
|
|
this.goodsList = {
|
|
orderGoodsList: [
|
|
[]
|
|
]
|
|
}
|
|
this.echoSkuList = []
|
|
this.echoSku = []
|
|
this.getOrderList()
|
|
this.popupShow = false
|
|
this.getEchoOrder()
|
|
}
|
|
});
|
|
},
|
|
// 获取购物车商品列表
|
|
getOrderList() {
|
|
let data = {
|
|
shopId: this.shopId,
|
|
page: 1,
|
|
limit: 1000,
|
|
status: 1,
|
|
// orderType: this.orderType
|
|
}
|
|
this.$Request.get("/app/order/selectAllOrderList", data).then(res => {
|
|
if (res.code == 0 && res.data.pageUtils.list.length) {
|
|
this.goodsList = res.data.pageUtils.list[0]
|
|
|
|
if (this.goodsList && this.goodsList.orderGoodsList && this.goodsList.orderGoodsList[0]) {
|
|
|
|
this.totalPrice = res.data.money
|
|
this.goodsNum = 0
|
|
|
|
this.goodsList.orderGoodsList[0].forEach(res => {
|
|
if (res.goodsPicture) {
|
|
res.goodsPicture = res.goodsPicture.split(',')
|
|
}
|
|
this.goodsNum += res.goodsNum
|
|
})
|
|
if (!this.goodsList.orderGoodsList[0].length) {
|
|
this.popupShow = false
|
|
}
|
|
}
|
|
}
|
|
uni.hideLoading()
|
|
});
|
|
},
|
|
// 跳转商品详情
|
|
goDet(id) {
|
|
uni.navigateTo({
|
|
url: '/pages/index/shop/goodsDet?goodsId=' + id + '&shopId=' + this.shopId + '&orderType=' +
|
|
this.orderType
|
|
})
|
|
},
|
|
// 去结算
|
|
goConfirm() {
|
|
if (!this.userId) {
|
|
uni.navigateTo({
|
|
url: '/pages/public/login'
|
|
})
|
|
return
|
|
}
|
|
|
|
|
|
let goodstr1 = 0 //商品库的 必须次数
|
|
let goodstr2 = 0 //购物车的 必须次数
|
|
let regex = new RegExp('必选', 'g');
|
|
if (this.goodsList && this.goodsList.orderGoodsList[0].length > 0) {
|
|
let dataList = JSON.stringify(this.dataList)
|
|
if (dataList.match(regex)) {
|
|
goodstr1 = dataList.match(regex).length
|
|
console.log("goodstr1----" + goodstr1)
|
|
if (dataList.indexOf('必选') != -1) { //检测商品是否存在必选
|
|
let goodsList = JSON.stringify(this.goodsList.orderGoodsList)
|
|
if (goodsList.match(regex)) {
|
|
goodstr2 = goodsList.match(regex).length
|
|
console.log("goodstr2----" + goodstr2)
|
|
if (goodstr1 == goodstr2) { //检查购物车商品是否存在必须
|
|
uni.navigateTo({
|
|
url: '/pages/index/shop/confirmOrder?shopId=' + this.shopId +
|
|
'&orderType=' + this
|
|
.orderType
|
|
})
|
|
} else {
|
|
uni.showToast({
|
|
title: "有" + goodstr1 + "个必选商品，请选择后结算",
|
|
icon: "none"
|
|
})
|
|
return
|
|
}
|
|
|
|
} else {
|
|
uni.showToast({
|
|
title: "有" + goodstr1 + "个必选商品，请选择后结算",
|
|
icon: "none"
|
|
})
|
|
return
|
|
}
|
|
}
|
|
} else {
|
|
uni.navigateTo({
|
|
url: '/pages/index/shop/confirmOrder?shopId=' + this.shopId + '&orderType=' + this
|
|
.orderType
|
|
})
|
|
}
|
|
} else {
|
|
uni.showToast({
|
|
title: '请先添加商品',
|
|
icon: "none"
|
|
})
|
|
}
|
|
},
|
|
TabSelect(e) {
|
|
console.log(e.currentTarget.dataset.id)
|
|
this.tabCur = e.currentTarget.dataset.id;
|
|
this.mainCur = e.currentTarget.dataset.id;
|
|
this.verticalNavTop = (e.currentTarget.dataset.id - 1) * 50
|
|
},
|
|
VerticalMain(e) {
|
|
let that = this;
|
|
let tabHeight = 0;
|
|
if (this.load) {
|
|
for (let i = 0; i < this.dataList.length; i++) {
|
|
let view = uni.createSelectorQuery().select("#main-" + this.dataList[i].id);
|
|
view.fields({
|
|
size: true
|
|
}, data => {
|
|
console.log(data, 'data 828')
|
|
this.dataList[i].top = tabHeight;
|
|
tabHeight = tabHeight + data.height;
|
|
this.dataList[i].bottom = tabHeight;
|
|
}).exec();
|
|
}
|
|
this.load = false
|
|
}
|
|
let scrollTop = e.detail.scrollTop;
|
|
// console.log(scrollTop,'111')
|
|
for (let i = 0; i < this.dataList.length; i++) {
|
|
if (scrollTop > this.dataList[i].top && scrollTop < this.dataList[i].bottom) {
|
|
this.verticalNavTop = (this.dataList[i].id - 1) * 50
|
|
this.tabCur = this.dataList[i].id
|
|
console.log(scrollTop) //不能删除
|
|
return false
|
|
}
|
|
}
|
|
},
|
|
// 打电话
|
|
call(e) {
|
|
uni.makePhoneCall({
|
|
phoneNumber: e
|
|
});
|
|
},
|
|
// 点击调起地图查看位置
|
|
goMap() {
|
|
//查看位置需要传经纬度才能执行
|
|
let that = this
|
|
uni.authorize({
|
|
scope: 'scope.userLocation',
|
|
success(res) {
|
|
uni.openLocation({
|
|
latitude: that.shopDet.shopLat,
|
|
longitude: that.shopDet.shopLng,
|
|
success: function() {}
|
|
});
|
|
},
|
|
fail(err) {
|
|
|
|
}
|
|
})
|
|
},
|
|
getOrderDetail() {
|
|
this.$Request.getT('/app/order/selectOrderById?orderId=' + this.orderId).then(res => {
|
|
if (res.code == 0 && res.data) {
|
|
if (res.data.isPay && res.data.isPay == 1) {
|
|
this.orderId = '';
|
|
uni.removeStorageSync('orderId')
|
|
}
|
|
}
|
|
});
|
|
},
|
|
goPindan() {
|
|
if (!this.userId) {
|
|
uni.navigateTo({
|
|
url: '/pages/public/login'
|
|
})
|
|
return
|
|
}
|
|
|
|
if (uni.getStorageSync('orderId')) {
|
|
uni.navigateTo({
|
|
url: '/pages/index/shop/pindanDet?shopId=' + this.shopId + '&orderId=' + uni
|
|
.getStorageSync('orderId')
|
|
})
|
|
} else {
|
|
let data = {
|
|
shopId: this.shopId,
|
|
}
|
|
this.$Request.post("/app/order/shareTheBill", data).then(res => {
|
|
if (res.code == 0) {
|
|
uni.navigateTo({
|
|
url: '/pages/index/shop/pindanDet?shopId=' + this.shopId + '&orderId=' +
|
|
res.data
|
|
})
|
|
}
|
|
});
|
|
}
|
|
|
|
|
|
|
|
}
|
|
},
|
|
onReachBottom: function() {
|
|
if (this.current == 2) {
|
|
this.evaluatePage = this.evaluatePage + 1;
|
|
this.getEvaluateList()
|
|
}
|
|
},
|
|
}
|
|
</script>
|
|
|
|
<style scoped lang="scss">
|
|
page {
|
|
background-color: #FFFFFF;
|
|
}
|
|
|
|
.yhq {
|
|
width: 100%;
|
|
height: 520rpx;
|
|
background-color: #F5F5F5;
|
|
overflow-y: hidden;
|
|
|
|
.yhq-box {
|
|
width: 686rpx;
|
|
height: 500rpx;
|
|
|
|
// background-color: red;
|
|
.yhq-box-title {
|
|
width: 100%;
|
|
text-align: center;
|
|
font-weight: bold;
|
|
}
|
|
|
|
.yhq-box-list {
|
|
width: 100%;
|
|
height: auto;
|
|
height: 460rpx;
|
|
margin-top: 30rpx;
|
|
|
|
.yhq-box-list-item {
|
|
width: 100%;
|
|
height: 120rpx;
|
|
border-radius: 24rpx;
|
|
background-color: #FFFFFF;
|
|
margin-bottom: 20rpx;
|
|
}
|
|
|
|
.yhq-box-list-item-c {
|
|
width: 646rpx;
|
|
height: 100%;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
.scroll-view_H {
|
|
width: 100%;
|
|
|
|
white-space: nowrap;
|
|
}
|
|
|
|
.coupon-item {
|
|
display: inline-block;
|
|
height: 46rpx;
|
|
margin-right: 20rpx;
|
|
border: 1px solid red;
|
|
border-radius: 10rpx;
|
|
padding: 0rpx 10rpx 0rpx 10rpx;
|
|
font-size: 20rpx;
|
|
color: red;
|
|
line-height: 44rpx;
|
|
|
|
view {
|
|
display: inline-block;
|
|
}
|
|
|
|
}
|
|
|
|
.pinglunImg {
|
|
width: 100%;
|
|
margin-top: 10rpx;
|
|
}
|
|
|
|
.pinglunImg-box {
|
|
width: 100%;
|
|
|
|
image {
|
|
// margin-left: 10rpx;
|
|
width: 160upx;
|
|
height: 160upx;
|
|
border-radius: 10rpx;
|
|
}
|
|
}
|
|
|
|
.hintPopul {
|
|
width: 100%;
|
|
height: 100vh;
|
|
position: fixed;
|
|
top: 0;
|
|
background: rgba(0, 0, 0, .4);
|
|
z-index: 999;
|
|
}
|
|
|
|
.content_ {
|
|
position: absolute;
|
|
left: 0;
|
|
right: 0;
|
|
top: 0;
|
|
bottom: 0;
|
|
margin: auto;
|
|
text-align: center;
|
|
width: 500rpx;
|
|
height: 400rpx;
|
|
border-radius: 20rpx;
|
|
background-color: #fff;
|
|
padding-top: 120rpx;
|
|
}
|
|
|
|
.content_ image {
|
|
position: absolute;
|
|
top: -50rpx;
|
|
left: 0;
|
|
right: 0;
|
|
margin: auto;
|
|
}
|
|
|
|
.hintText {
|
|
font-size: 30rpx;
|
|
}
|
|
|
|
.Btns {
|
|
width: 460rpx;
|
|
height: 60rpx;
|
|
line-height: 60rpx;
|
|
text-align: center;
|
|
background: #FCD202;
|
|
font-size: 28rpx;
|
|
border: 2rpx solid #FCD202;
|
|
color: #333333;
|
|
border-radius: 50rpx;
|
|
font-weight: 700;
|
|
margin: auto;
|
|
}
|
|
|
|
|
|
.bg1 {
|
|
background: #FFFFFF;
|
|
}
|
|
|
|
.sticky-tabs {
|
|
z-index: 990;
|
|
position: sticky;
|
|
top: var(--window-top);
|
|
// background-color: #fff;
|
|
}
|
|
|
|
/* // 使用mescroll-uni,则top为0 */
|
|
.mescroll-uni,
|
|
/deep/.mescroll-uni {
|
|
.sticky-tabs {
|
|
top: 0;
|
|
}
|
|
}
|
|
|
|
.shop {
|
|
position: absolute;
|
|
top: 80rpx;
|
|
left: 0;
|
|
right: 0;
|
|
width: 686rpx;
|
|
margin: auto;
|
|
background: #FFFFFF;
|
|
border-radius: 20rpx;
|
|
box-shadow: 0 0 20rpx #CCCCCC;
|
|
}
|
|
|
|
.skuBtn {
|
|
padding: 10rpx 30rpx;
|
|
border-radius: 10rpx;
|
|
text-align: center;
|
|
margin: 10rpx 20rpx;
|
|
font-size: 28rpx;
|
|
color: #333333;
|
|
border: 2px solid #F2F2F2;
|
|
}
|
|
|
|
.active {
|
|
background: rgba(252, 210, 2, 0.2) !important;
|
|
border: 2px solid #FCD202 !important;
|
|
opacity: 0.6;
|
|
}
|
|
|
|
.active1 {
|
|
/* width: 82rpx; */
|
|
height: 16rpx;
|
|
background: #FCD202;
|
|
position: relative;
|
|
top: -10rpx;
|
|
z-index: 9;
|
|
}
|
|
|
|
.popup {
|
|
/* height: 500rpx; */
|
|
max-height: 500rpx;
|
|
/* overflow-y: auto; */
|
|
}
|
|
|
|
.tabBtn {
|
|
/* background-color: #f6f6fa; */
|
|
height: 60rpx;
|
|
line-height: 60rpx;
|
|
color: #999999;
|
|
font-size: 38rpx;
|
|
}
|
|
|
|
.Switch {
|
|
width: 164rpx;
|
|
height: 62rpx;
|
|
color: #FFFFFF;
|
|
background: #FCD202;
|
|
border-radius: 30rpx;
|
|
display: flex;
|
|
align-items: center;
|
|
padding: 2rpx;
|
|
}
|
|
|
|
.Switch>view {
|
|
/* flex: 1; */
|
|
width: 80rpx;
|
|
text-align: center;
|
|
line-height: 62rpx;
|
|
height: 58rpx;
|
|
}
|
|
|
|
.selSwitch {
|
|
|
|
color: #333333;
|
|
background: #FFFFFF;
|
|
border-radius: 30rpx;
|
|
}
|
|
|
|
.hintPopul {
|
|
width: 100%;
|
|
height: 100vh;
|
|
|
|
position: absolute;
|
|
top: 0;
|
|
background: rgba(0, 0, 0, .4);
|
|
}
|
|
|
|
.content {
|
|
position: absolute;
|
|
left: 0;
|
|
right: 0;
|
|
top: 0;
|
|
bottom: 0;
|
|
margin: auto;
|
|
text-align: center;
|
|
width: 500rpx;
|
|
height: 400rpx;
|
|
border-radius: 20rpx;
|
|
background-color: #fff;
|
|
padding-top: 120rpx;
|
|
}
|
|
|
|
.content image {
|
|
position: absolute;
|
|
top: -50rpx;
|
|
left: 0;
|
|
right: 0;
|
|
margin: auto;
|
|
}
|
|
|
|
.hintText {
|
|
font-size: 30rpx;
|
|
|
|
}
|
|
|
|
|
|
.VerticalNav.nav {
|
|
width: 200upx;
|
|
white-space: initial;
|
|
}
|
|
|
|
.VerticalNav.nav .cu-item {
|
|
width: 100%;
|
|
text-align: center;
|
|
background-color: #f1f1f1;
|
|
margin: 0;
|
|
border: none;
|
|
height: 50px;
|
|
position: relative;
|
|
}
|
|
|
|
.VerticalNav.nav .cu-item.cur {
|
|
background-color: #fff;
|
|
}
|
|
|
|
|
|
.VerticalBox {
|
|
display: flex;
|
|
}
|
|
|
|
.VerticalMain {
|
|
background-color: #f1f1f1;
|
|
flex: 1;
|
|
}
|
|
|
|
.detail_describe_text2 {
|
|
font-weight: 500;
|
|
margin-top: 2%;
|
|
color: #999999;
|
|
}
|
|
|
|
.detail_account_bottom {
|
|
margin-top: 20rpx;
|
|
width: 100%;
|
|
display: flex;
|
|
justify-content: space-between;
|
|
/* margin: 4% 0 3%; */
|
|
}
|
|
|
|
.detail_account_bottom_le {
|
|
width: 47.5%;
|
|
/* margin-right: 5%; */
|
|
border-radius: 44rpx;
|
|
text-align: center;
|
|
line-height: 2.8;
|
|
border: 2rpx solid #FCD202;
|
|
}
|
|
|
|
.detail_account_bottom_ri {
|
|
width: 47.5%;
|
|
border-radius: 44rpx;
|
|
text-align: center;
|
|
line-height: 2.8;
|
|
background-color: #FCD202;
|
|
}
|
|
|
|
.food_all {
|
|
position: relative;
|
|
}
|
|
|
|
.text-through {
|
|
text-decoration: line-through
|
|
}
|
|
|
|
/* 食物 */
|
|
.food {
|
|
width: 100%;
|
|
overflow: hidden;
|
|
// position: absolute;
|
|
// top: 350rpx;
|
|
// background-color: #FFFFFF;
|
|
border-top-left-radius: 18rpx;
|
|
border-top-right-radius: 18rpx;
|
|
}
|
|
|
|
.food_address {
|
|
// margin: 3% 3% 0 3%;
|
|
// margin: 3%;
|
|
display: flex;
|
|
justify-content: space-between;
|
|
align-items: center;
|
|
margin-top: 100rpx;
|
|
background-color: #FFFFFF;
|
|
// padding-bottom: 3%;
|
|
padding: 3%;
|
|
}
|
|
|
|
.food_address_le {
|
|
width: 75%;
|
|
}
|
|
|
|
.food_address_le_top {
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: space-between;
|
|
}
|
|
|
|
.food_address_le_top_le {
|
|
width: 40rpx;
|
|
height: 37rpx;
|
|
}
|
|
|
|
.food_address_le_top_le image {
|
|
width: 40rpx;
|
|
height: 37rpx;
|
|
}
|
|
|
|
.food_address_le_top_ce {
|
|
line-height: 1.6;
|
|
font-size: 38rpx;
|
|
font-weight: 600;
|
|
color: #333333;
|
|
}
|
|
|
|
.food_address_le_top_ce_ri {
|
|
width: 14rpx;
|
|
/* margin: 1% 0 0 2%; */
|
|
height: 24rpx;
|
|
margin-left: 2%;
|
|
}
|
|
|
|
.food_address_le_top_ce_ri image {
|
|
width: 14rpx;
|
|
height: 24rpx;
|
|
}
|
|
|
|
.food_address_text {
|
|
font-weight: 500;
|
|
font-size: 24rpx;
|
|
color: #999999;
|
|
}
|
|
|
|
.food_address_ri {
|
|
width: 24%;
|
|
height: 55rpx;
|
|
display: flex;
|
|
padding: 0.5% 1%;
|
|
background-color: #FCD202;
|
|
border-radius: 31rpx;
|
|
color: #FFFFFF;
|
|
}
|
|
|
|
.food_address_ri_sty {
|
|
flex: 1;
|
|
text-align: center;
|
|
padding-top: 4%;
|
|
font-size: 24rpx;
|
|
}
|
|
|
|
.food_address_ri_sty_active {
|
|
width: 100%;
|
|
overflow: hidden;
|
|
background-color: #FFFFFF;
|
|
border-radius: 31rpx;
|
|
color: #333333;
|
|
text-align: center;
|
|
}
|
|
|
|
/* 结算 */
|
|
.settlement {
|
|
width: 94%;
|
|
background-color: #000000;
|
|
line-height: 3.4;
|
|
border-radius: 49rpx;
|
|
position: fixed;
|
|
bottom: 10rpx;
|
|
left: 3%;
|
|
display: flex;
|
|
justify-content: space-between;
|
|
}
|
|
|
|
.settlement1 {
|
|
width: 94%;
|
|
background-color: #000000;
|
|
line-height: 2.8;
|
|
border-radius: 49rpx;
|
|
position: relative;
|
|
|
|
/* bottom: 10rpx; */
|
|
left: 0;
|
|
right: 0;
|
|
/* left: 3%; */
|
|
display: flex;
|
|
justify-content: space-between;
|
|
margin: 20rpx auto;
|
|
}
|
|
|
|
.settlement_le {
|
|
width: 48%;
|
|
padding-left: 18%;
|
|
color: #FFFFFF;
|
|
font-size: 30rpx;
|
|
}
|
|
|
|
.settlement_le text {
|
|
font-size: 22rpx;
|
|
}
|
|
|
|
.settlement_ri {
|
|
width: 35%;
|
|
background-color: #FCD202;
|
|
font-family: PingFang SC;
|
|
font-weight: 800;
|
|
color: #333333;
|
|
text-align: center;
|
|
border-top-right-radius: 49rpx;
|
|
border-bottom-right-radius: 49rpx;
|
|
}
|
|
|
|
.settlement_ri1 {
|
|
width: 35%;
|
|
background-color: #333333;
|
|
font-family: PingFang SC;
|
|
font-weight: 800;
|
|
color: #999999;
|
|
text-align: center;
|
|
border-top-right-radius: 49rpx;
|
|
border-bottom-right-radius: 49rpx;
|
|
}
|
|
|
|
.settlement_img {
|
|
width: 91rpx;
|
|
height: 96rpx;
|
|
position: absolute;
|
|
// bottom: 30rpx;
|
|
left: 5%;
|
|
}
|
|
|
|
.settlement_img image {
|
|
width: 74rpx;
|
|
height: 81rpx;
|
|
}
|
|
|
|
.settlement_hot {
|
|
width: 35rpx;
|
|
height: 35rpx;
|
|
line-height: 35rpx;
|
|
text-align: center;
|
|
border-radius: 50%;
|
|
position: absolute;
|
|
top: -10rpx;
|
|
right: 0;
|
|
background-color: #FF130A;
|
|
color: #FFFFFF;
|
|
font-size: 20rpx;
|
|
font-weight: bold;
|
|
color: #FFFFFF;
|
|
}
|
|
|
|
|
|
.select_all {
|
|
width: 100%;
|
|
position: relative;
|
|
}
|
|
|
|
/* 餐厅 */
|
|
.select {
|
|
color: #000000;
|
|
font-weight: bold;
|
|
background-color: #fff;
|
|
z-index: 10;
|
|
}
|
|
|
|
.select_line {
|
|
width: 15%;
|
|
height: 6rpx;
|
|
margin: 0 auto 4%;
|
|
background: #E6E6E6;
|
|
border-radius: 4rpx;
|
|
}
|
|
|
|
.select_search {
|
|
width: 100%;
|
|
margin: 2% 0;
|
|
display: flex;
|
|
align-items: center;
|
|
}
|
|
|
|
.select_search_le {
|
|
/* width: 10%; */
|
|
font-size: 30rpx;
|
|
line-height: 2.5;
|
|
margin-right: 1%;
|
|
}
|
|
|
|
.select_search_ce {
|
|
/* width: 5%; */
|
|
/* margin-top: 1%; */
|
|
margin-right: 20rpx;
|
|
margin-left: 6rpx;
|
|
/* margin: 0 20rpx; */
|
|
width: 20rpx;
|
|
height: 10rpx;
|
|
}
|
|
|
|
.select_search_ri {
|
|
/* width: 84%; */
|
|
height: 72rpx;
|
|
flex: 1;
|
|
display: flex;
|
|
}
|
|
|
|
.select_search_ri input {
|
|
flex: 1;
|
|
/* width: 100%; */
|
|
height: 72rpx;
|
|
background: #F5F5F5;
|
|
color: #999999;
|
|
border-radius: 36rpx;
|
|
text-decoration: 42rpx;
|
|
text-align: center;
|
|
}
|
|
|
|
/* 附近 */
|
|
.nearby {
|
|
width: 100%;
|
|
position: relative;
|
|
}
|
|
|
|
.nearby_text {
|
|
width: 18%;
|
|
font-size: 30rpx;
|
|
font-weight: 800;
|
|
color: #333333;
|
|
text-align: center;
|
|
border-bottom: 16rpx solid #FCD202;
|
|
/* line-height: 20rpx; */
|
|
margin-top: 10rpx;
|
|
}
|
|
|
|
.nearby_address_active {
|
|
border: 2rpx solid #FCD202;
|
|
width: 100%;
|
|
padding: 3%;
|
|
margin-top: 3%;
|
|
border-radius: 10upx;
|
|
display: flex;
|
|
}
|
|
|
|
.nearby_address {
|
|
width: 100%;
|
|
padding: 3%;
|
|
margin-top: 3%;
|
|
border-radius: 10upx;
|
|
display: flex;
|
|
}
|
|
|
|
.nearby_address_le {
|
|
flex: 1;
|
|
}
|
|
|
|
.nearby_address_ri {
|
|
line-height: 2.5;
|
|
text-align: right;
|
|
/* flex: 1; */
|
|
}
|
|
|
|
.nearby_text2 {
|
|
|
|
/* line-height: 1.5; */
|
|
display: flex;
|
|
justify-content: space-between;
|
|
align-items: center;
|
|
}
|
|
|
|
.nearby_text2_ {
|
|
font-size: 30rpx;
|
|
font-weight: 800;
|
|
color: #333333;
|
|
}
|
|
|
|
.nearby_text3 {
|
|
font-size: 24rpx;
|
|
font-weight: 500;
|
|
color: #999999;
|
|
margin-top: 2%;
|
|
}
|
|
|
|
/* 添加地址 */
|
|
.goorder {
|
|
width: 100%;
|
|
padding: 2% 3%;
|
|
position: fixed;
|
|
bottom: 0;
|
|
background-color: #FFFFFF;
|
|
border-top: 1rpx solid #999999;
|
|
}
|
|
|
|
.goorder_but {
|
|
width: 100%;
|
|
line-height: 2.5;
|
|
text-align: center;
|
|
background: #FCD202;
|
|
border-radius: 36rpx;
|
|
}
|
|
</style> |