|
|
@@ -1,78 +1,207 @@
|
|
|
<template>
|
|
|
<view :data-theme="theme">
|
|
|
<tui-skeleton v-if="showSkeleton"></tui-skeleton>
|
|
|
- <view class='productSort' :style="{visibility: showSkeleton ? 'hidden' : 'visible', height: winHeight+ 'px' }">
|
|
|
+
|
|
|
+ <view class='productSort' :style="{visibility: showSkeleton ? 'hidden' : 'visible', height: winHeight+ 'px' }">
|
|
|
+ <!-- 头部 -->
|
|
|
+ <view class="box-top" :style="{ 'marginTop': sysHeight*2 + 90 + 'rpx'}">
|
|
|
+ <view class="box-top1">
|
|
|
+ <text class="box-txt">{{merchanInfo.name}}</text>
|
|
|
+ <!-- 收藏图片 -->
|
|
|
+ <view>
|
|
|
+ <!-- 未收藏icon -->
|
|
|
+ <image class='icon-img' src="../../static/img/收藏-灰.png"
|
|
|
+ @click='getMerCollectAddApi' v-if="!merchanInfo.isCollect"/>
|
|
|
+ <!-- 已经收藏 -->
|
|
|
+ <image class='icon-img' src="../../static/img/收藏-亮.png"
|
|
|
+ @click='getMerCollectCancelApi' v-else />
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <!-- 月销 -->
|
|
|
+ <view class="box-pin">
|
|
|
+ <text class="box-txt2">{{ merchanInfo.starLevel }}分</text>
|
|
|
+ <text class="box-txt3">销量 {{merchanInfo.sales || 0 }}</text>
|
|
|
+ </view>
|
|
|
+ <!-- 商家地址 -->
|
|
|
+ <view class="box-shopp">商家地址：{{merchanInfo.addressDetail}}</view>
|
|
|
+ <!-- 新品上新的 -->
|
|
|
+ <view class="box-newtxt">
|
|
|
+
|
|
|
+ <swiper style="height: 40rpx; width:100%;" :indicator-dots="false" :autoplay="true" interval="2500" :duration="500" vertical="true" circular="true">
|
|
|
+ <block v-for="(item,index) in merchanInfo.headline" :key='index'>
|
|
|
+ <swiper-item catchtouchmove='catchTouchMove'>
|
|
|
+ <view class='text acea-row row-between-wrapper'>
|
|
|
+ <view class='newsTitle'>
|
|
|
+ <text class='iconfont icon-laba ' style="font-size: 24rpx;margin-right: 10rpx;"></text>
|
|
|
+ <text>{{item.title}}</text>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </swiper-item>
|
|
|
+ </block>
|
|
|
+ </swiper>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+
|
|
|
<!-- #ifdef APP -->
|
|
|
- <view class='header acea-row row-center-wrapper' :style="{ 'marginTop': sysHeight*2 + 'rpx'}">
|
|
|
+ <view class='header acea-row row-center-wrapper' >
|
|
|
<!-- #endif -->
|
|
|
<!-- #ifndef APP -->
|
|
|
- <view class='header acea-row row-center-wrapper header-box'>
|
|
|
+ <view class='header acea-row row-center-wrapper header-box boxcolor'
|
|
|
+ >
|
|
|
+ <view class="back-button-1" @tap="handBack()"></view>
|
|
|
<!-- #endif -->
|
|
|
- <!-- #ifndef MP -->
|
|
|
- <view class='acea-row row-between-wrapper input'>
|
|
|
- <text class='iconfont icon-sousuo'></text>
|
|
|
- <input type='text' placeholder='点击搜索商品信息' @confirm="searchSubmitValue" confirm-type='search' name="search"
|
|
|
- placeholder-class='placeholder' maxlength="20"></input>
|
|
|
- </view>
|
|
|
- <!-- #endif -->
|
|
|
<!-- #ifdef MP -->
|
|
|
- <searchBox class="searchBox" :toBackShow="false" @searchChange="searchSubmitValue"></searchBox>
|
|
|
+ <!-- 导航栏 -->
|
|
|
+ <view :style="{ height: `${navigationBarHeight*2+90}rpx`,lineHeight: `${navigationBarHeight*2+110}rpx`}" class="order-nav">
|
|
|
+
|
|
|
+ <text class="box-color-txt">{{merchanInfo.name}}</text>
|
|
|
+ </view>
|
|
|
<!-- #endif -->
|
|
|
</view>
|
|
|
<!-- #ifdef APP -->
|
|
|
<view class="con-box">
|
|
|
<!-- #endif -->
|
|
|
<!-- #ifndef APP -->
|
|
|
- <view class="con-box" :style="{ 'marginTop': sysHeight*2 + 90 + 'rpx'}">
|
|
|
+
|
|
|
+ <!--切换点餐还是评价 -->
|
|
|
+ <view class="let-box">
|
|
|
+ <view @click="Tabnex(0)" class="let-box1">
|
|
|
+ <text :class="{ 'actave1': tabindex == 0 }" class="let-txt">点菜</text>
|
|
|
+ <view :class="{ 'actave': tabindex == 0 }" class="let-line"></view>
|
|
|
+ </view>
|
|
|
+ <view @click="Tabnex(1)" class="let-box1">
|
|
|
+ <text :class="{ 'actave1': tabindex == 1 }" class="let-txt">评价</text>
|
|
|
+ <view :class="{ 'actave': tabindex == 1 }" class="let-line"></view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <!-- 点餐页面 0是点餐 1是评价-->
|
|
|
+ <view class="con-box" v-if="tabindex==0">
|
|
|
<!-- #endif -->
|
|
|
<view class='aside'>
|
|
|
+ <!-- 左侧数据 -->
|
|
|
<scroll-view scroll-y="true" style="height: 100%; overflow: hidden;" scroll-with-animation='true' :scroll-into-view="intoindex">
|
|
|
<view v-for="(item,index) in productList" :key="item.id">
|
|
|
- <view class='item acea-row row-center-wrapper' :class='index==navActive?"on":""' v-if='item.childList && item.childList.length > 0'
|
|
|
- :key="item.id" @click='tap(index,"b"+item.id)' :id='"sort"+index'><text class="item_text skeleton-rect">{{item.name}}</text>
|
|
|
+ <view class='item acea-row row-center-wrapper' :class='index==navActive?"on":""'
|
|
|
+ :key="item.id" @click='tap(index,"b"+item.id)' :id='"sort"+index'><text class="item_text skeleton-rect">
|
|
|
+ {{item.name}}
|
|
|
+ </text>
|
|
|
</view>
|
|
|
</view>
|
|
|
</scroll-view>
|
|
|
</view>
|
|
|
+ <!-- 右侧数据 -->
|
|
|
<view class='conter'>
|
|
|
<scroll-view scroll-y="true" :scroll-into-view="toView" style="height: 100%; overflow: hidden;" @scroll="scroll" scroll-with-animation='true'>
|
|
|
- <view v-for="(p,i) in productList" :key="p.id">
|
|
|
- <view class='listw' :id="'b'+p.id+index" v-for="(item,index) in p.childList" :key="item.id">
|
|
|
- <view class='title acea-row'>
|
|
|
- <view class='name skeleton-rect'>{{item.name}}</view>
|
|
|
- </view>
|
|
|
+
|
|
|
+ <view v-for="(p,i) in productList" :key="p.id" class="nexbox">
|
|
|
+
|
|
|
+ <view @click="getOrderdetils(item)" class='listw' :id="'b'+p.id+index" v-for="(item,index) in p.childList" :key="item.id">
|
|
|
<view class='list acea-row'>
|
|
|
- <block v-for="(itemn,indexn) in item.childList" :key="itemn.id">
|
|
|
- <navigator hover-class='none' :url='"/pages/goods/goods_list/index?cid="+itemn.id+"&title="+itemn.name'
|
|
|
- class='item acea-row row-column row-middle'>
|
|
|
+ <!-- 粘性定位的大类标题 -->
|
|
|
+ <view v-if="index==0" class="nexbox-txt">{{p.name}}</view>
|
|
|
+ <block>
|
|
|
+ <view class='xbox1 row-middle item'
|
|
|
+ >
|
|
|
<view class='picture skeleton-rect'>
|
|
|
- <easy-loadimage mode="widthFix" :image-src="itemn.icon"></easy-loadimage>
|
|
|
+ <image class="neximg" mode='aspectFill' :src="item.icon"/>
|
|
|
+ </view>
|
|
|
+ <view class='nexbox1'>
|
|
|
+ <text class="nexbox1-txt">{{item.name}}</text>
|
|
|
+ <view class="nexbox2">
|
|
|
+ <text>销量 {{item.sales}}</text>
|
|
|
+ <text>好评率 {{ item.replyChance*100}}%</text>
|
|
|
+ </view>
|
|
|
+ <!-- 价格 加 -->
|
|
|
+ <view class="nexbox3">
|
|
|
+ <text class="nexbox-txt3">￥ {{item.price}}</text>
|
|
|
+
|
|
|
+ <view class="nexbox4">
|
|
|
+ <!-- 减 -->
|
|
|
+ <view v-if="item.sum>0" @click.stop="letloke(item)" class="neximg1">-</view>
|
|
|
+ <text>{{item.sum}}</text>
|
|
|
+ <!-- 加 -->
|
|
|
+ <image @click.stop="Addsum(item)"
|
|
|
+ class="nexbox-img3"
|
|
|
+ referrerpolicy="no-referrer"
|
|
|
+ src="https://lanhu-dds-backend.oss-cn-beijing.aliyuncs.com/merge_image/imgs/2eb30a58d13a4d218392389a0a61bee4_mergeImage.png"
|
|
|
+ />
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
</view>
|
|
|
- <view class='name line1'>{{itemn.name}}</view>
|
|
|
- </navigator>
|
|
|
+ </view>
|
|
|
</block>
|
|
|
</view>
|
|
|
</view>
|
|
|
</view>
|
|
|
- <view :style='"height:"+(bottomheight-300)+"rpx;"'></view>
|
|
|
+ <view :style='"height:"+(bottomheight-600)+"rpx;"'></view>
|
|
|
</scroll-view>
|
|
|
</view>
|
|
|
</view>
|
|
|
</view>
|
|
|
- <view v-if="bottomNavigationIsCustom" class="footerBottom"></view>
|
|
|
- <pageFooter></pageFooter>
|
|
|
+
|
|
|
+
|
|
|
+ <!-- 打开的购物车 -->
|
|
|
+ <view class="mode" v-if="lockcatble">
|
|
|
+ <view class="mode-1">
|
|
|
+ <!-- 判断数量大于0显示 -->
|
|
|
+ <view class="mode-clear" v-if="getCartGoodsNumber>0">
|
|
|
+ <text class="mode-txt">数量：<text style="color: #FD6716 ;">({{getCartGoodsNumber}})</text></text>
|
|
|
+ <text @click="Clery" class="mode-txt1">清空</text>
|
|
|
+ </view>
|
|
|
+ <view class="mode-box">
|
|
|
+ <view class="mode-2" v-for="(item,index) in cart" :key="index">
|
|
|
+ <image class="mode-img" mode='aspectFill' :src="item.icon"/>
|
|
|
+ <view class='nexbox1'>
|
|
|
+ <text class="nexbox1-txt">{{item.name}}</text>
|
|
|
+ <view class="nexbox2">
|
|
|
+ <text>销量 {{item.sales}}</text>
|
|
|
+ <text>好评率 {{ item.replyChance*100}}%</text>
|
|
|
+ </view>
|
|
|
+ <!-- 价格 加 -->
|
|
|
+ <view class="nexbox3">
|
|
|
+ <text class="nexbox-txt3">￥ {{item.price}}</text>
|
|
|
+
|
|
|
+ <view class="nexbox4">
|
|
|
+ <!-- 减 -->
|
|
|
+ <view v-if="item.sum>0" @click="letloke(item)" class="neximg1">-</view>
|
|
|
+ <text>{{item.sum}}</text>
|
|
|
+ <!-- 加 -->
|
|
|
+ <image @click="Addsum(item)"
|
|
|
+ class="nexbox-img3"
|
|
|
+ referrerpolicy="no-referrer"
|
|
|
+ src="https://lanhu-dds-backend.oss-cn-beijing.aliyuncs.com/merge_image/imgs/2eb30a58d13a4d218392389a0a61bee4_mergeImage.png"
|
|
|
+ />
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view style="height: 200rpx;">
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <!-- 购物车栏 begin -->
|
|
|
+ <view v-if="tabindex==0" class="cart-box" style="bottom: 77rpx">
|
|
|
+ <view class="mark" @click="lockcatble=!lockcatble">
|
|
|
+ <image src="/static/img/ic-security-settings.png" class="cart-img" @tap=""></image>
|
|
|
+ <view class="tag" v-if="cart.length > 0">{{ getCartGoodsNumber }}</view>
|
|
|
+ </view>
|
|
|
+ <view style="font-weight: 500;font-size: 27rpx;color: #999999;" class="price" v-if="cart.length === 0">配送费2元</view>
|
|
|
+ <view style="font-weight: 600;font-size: 27rpx;color: #FFFFFF;" class="price" v-else>￥{{ getCartGoodsPrice || 0 }}</view>
|
|
|
+ <button :style="{backgroundColor: disabledPay ? '#000' : ''}" type="primary" class="pay-btn bg-color" @tap="toPay"
|
|
|
+ :disabled="disabledPay">
|
|
|
+ {{ disabledPay ? `差${spread}元起送` : '去结算' }}
|
|
|
+ </button>
|
|
|
+ </view>
|
|
|
</view>
|
|
|
</template>
|
|
|
<script>
|
|
|
- // +----------------------------------------------------------------------
|
|
|
- // | CRMEB [ CRMEB赋能开发者，助力企业发展 ]
|
|
|
- // +----------------------------------------------------------------------
|
|
|
- // | Copyright (c) 2016~2025 https://www.crmeb.com All rights reserved.
|
|
|
- // +----------------------------------------------------------------------
|
|
|
- // | Licensed CRMEB并不是自由软件，未经许可不能去掉CRMEB相关版权
|
|
|
- // +----------------------------------------------------------------------
|
|
|
- // | Author: CRMEB Team <admin@crmeb.com>
|
|
|
- // +----------------------------------------------------------------------
|
|
|
+
|
|
|
let app = getApp();
|
|
|
import { getCategoryList } from '@/api/product.js';
|
|
|
import easyLoadimage from '@/components/base/easy-loadimage.vue';
|
|
|
@@ -81,7 +210,17 @@
|
|
|
import pageFooter from "@/components/pageFooter/index.vue";
|
|
|
import animationType from '@/utils/animationType.js'
|
|
|
// #ifdef MP
|
|
|
- import searchBox from "@/components/searchBox.vue";
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+ import {
|
|
|
+ getCategoryCacheTree,
|
|
|
+ getMerchantInfo
|
|
|
+ } from '../../api/merchant.js'
|
|
|
+ import {
|
|
|
+ getMerCollectAddApi,
|
|
|
+ getMerCollectCancelApi
|
|
|
+ } from '@/api/merchant.js';
|
|
|
// #endif
|
|
|
let sysHeight = uni.getSystemInfoSync().statusBarHeight;
|
|
|
export default {
|
|
|
@@ -90,10 +229,24 @@
|
|
|
tuiSkeleton,
|
|
|
pageFooter,
|
|
|
// #ifdef MP
|
|
|
- searchBox
|
|
|
+
|
|
|
// #endif
|
|
|
},
|
|
|
- computed: mapGetters(['bottomNavigationIsCustom']),
|
|
|
+ computed:{
|
|
|
+ getCartGoodsNumber() { //计算购物车总数
|
|
|
+ return this.cart.reduce((acc, cur) => acc + cur.sum, 0)
|
|
|
+ },
|
|
|
+ getCartGoodsPrice() { //计算购物车总价
|
|
|
+ return this.cart.reduce((acc, cur) => acc + cur.sum * cur.price, 0).toFixed(2)
|
|
|
+ },
|
|
|
+ disabledPay() { //是否达到起送价
|
|
|
+ return this.orderType == 'takeout' && (this.getCartGoodsPrice < this.store.min_price) ? true : false
|
|
|
+ },
|
|
|
+ spread() { //差多少元起送
|
|
|
+ if (this.orderType != 'takeout') return
|
|
|
+ return parseFloat((this.store.min_price - this.getCartGoodsPrice).toFixed(2))
|
|
|
+ }
|
|
|
+ },
|
|
|
data() {
|
|
|
let active = 0;
|
|
|
// #ifdef H5
|
|
|
@@ -105,49 +258,7 @@
|
|
|
navlist: [],
|
|
|
hotList: [], //推荐分类
|
|
|
sysHeight:sysHeight,
|
|
|
- productList: [
|
|
|
- {name: 'skeleton',id: 0,
|
|
|
- childList:[
|
|
|
- {name: 'skeleton',id: 10,childList:[
|
|
|
- {name: '',id: 101,},
|
|
|
- {name: '',id: 102,},
|
|
|
- {name: '',id: 103,},
|
|
|
- {name: '',id: 104,},
|
|
|
- {name: '',id: 105,},
|
|
|
- {name: '',id: 106,}
|
|
|
- ]},
|
|
|
- {name: 'skeleton',id: 1,
|
|
|
- childList:[
|
|
|
- {name: '',id: 101,},
|
|
|
- {name: '',id: 102,},
|
|
|
- {name: '',id: 103,},
|
|
|
- {name: '',id: 104,},
|
|
|
- {name: '',id: 105,},
|
|
|
- {name: '',id: 106,}
|
|
|
- ]},
|
|
|
- {name: '',id: 20}
|
|
|
- ]
|
|
|
- },
|
|
|
- {name: 'skeleton',id: 2,
|
|
|
- childList:[{name:'skeleton',id: 30}]},
|
|
|
- {name: 'skeleton',id: 3,
|
|
|
- childList:[{name:'skeleton',id: 31}]},
|
|
|
- {name: 'skeleton',id: 4,
|
|
|
- childList:[{name:'skeleton',id: 32}]},
|
|
|
- {name: 'skeleton',id: 5,
|
|
|
- childList:[{name:'skeleton',id: 33}]},
|
|
|
- {name: 'skeleton',id: 6,
|
|
|
- childList:[{name:'skeleton',id: 34}]},
|
|
|
- {name: 'skeleton',id: 7,
|
|
|
- childList:[{name:'skeleton',id: 35}]},
|
|
|
- {name: 'skeleton',id: 8,
|
|
|
- childList:[{name:'skeleton',id: 36}]},
|
|
|
- {name: 'skeleton',id: 9,
|
|
|
- children:[{name:'skeleton',id: 37}]},
|
|
|
- {name: 'skeleton',id: 10,
|
|
|
- childList:[{name:'skeleton',id: 38}]},
|
|
|
- {name: 'skeleton',id: 11,
|
|
|
- childList:[{name:'skeleton',id: 39}]},
|
|
|
+ productList: [ //菜品数据
|
|
|
],
|
|
|
navActive: 0,
|
|
|
activceCate: active,
|
|
|
@@ -161,10 +272,41 @@
|
|
|
pid: '',
|
|
|
newData: {},
|
|
|
activeRouter: '',
|
|
|
+
|
|
|
+
|
|
|
+ page:1,//当前页
|
|
|
+ limit:9999,//每页条
|
|
|
+ Item:'',//跳转这一项数据
|
|
|
+ merchanInfo:'',//商家信息
|
|
|
+ navigationBarHeight: '',//导航栏高度
|
|
|
+ cart: [], //购物车
|
|
|
+ store: { //起送
|
|
|
+ min_price: 0.01
|
|
|
+ },
|
|
|
+ orderType: 'takeout',
|
|
|
+ lockcatble:false,//打开的购物车弹窗
|
|
|
+ navigateUrl:'',//跳转详情路径
|
|
|
+ tabindex:0,//点菜评价切换
|
|
|
}
|
|
|
},
|
|
|
onLoad(options) {
|
|
|
+ console.log('options',options)
|
|
|
+ // 获取设备信息
|
|
|
+ const systemInfo = uni.getSystemInfoSync();
|
|
|
+ console.log('设备信息',systemInfo)
|
|
|
+ // 设置导航栏高度
|
|
|
+ this.navigationBarHeight = systemInfo.safeArea.top;
|
|
|
+
|
|
|
+
|
|
|
let that = this
|
|
|
+ that.Item=JSON.parse(options.item)
|
|
|
+ console.log('数据',that.Item)
|
|
|
+
|
|
|
+ that.getMerchantInfo()//商家信息
|
|
|
+ that.getCategoryCacheTree()// // 商家页面-点菜分类
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
uni.getSystemInfo({
|
|
|
success: function(res) {
|
|
|
that.winHeight = res.windowHeight
|
|
|
@@ -178,8 +320,10 @@
|
|
|
}, {
|
|
|
passive: false
|
|
|
});
|
|
|
+
|
|
|
+
|
|
|
// #endif
|
|
|
- this.getAllCategory();
|
|
|
+
|
|
|
},
|
|
|
onShow() {
|
|
|
let that = this
|
|
|
@@ -202,6 +346,100 @@
|
|
|
|
|
|
},
|
|
|
methods: {
|
|
|
+ // 收藏接口
|
|
|
+ getMerCollectAddApi(){
|
|
|
+ getMerCollectAddApi(this.merchanInfo.id).then(res=>{
|
|
|
+ console.log('收藏',res)
|
|
|
+ if(res.code==200){
|
|
|
+ this.$util.Tips({
|
|
|
+ title: "收藏成功",
|
|
|
+ });
|
|
|
+ this.getMerchantInfo()//商家信息
|
|
|
+ }
|
|
|
+ })
|
|
|
+ },
|
|
|
+ // 取消收藏
|
|
|
+ getMerCollectCancelApi(){
|
|
|
+ getMerCollectCancelApi(this.merchanInfo.id).then(res=>{
|
|
|
+ console.log()
|
|
|
+ if(res.code==200){
|
|
|
+ this.$util.Tips({
|
|
|
+ title: "取消收藏",
|
|
|
+ });
|
|
|
+ this.getMerchantInfo()//商家信息
|
|
|
+ }
|
|
|
+ })
|
|
|
+ },
|
|
|
+ // 点菜评价切换
|
|
|
+ Tabnex(index){
|
|
|
+ this.tabindex=index
|
|
|
+ },
|
|
|
+
|
|
|
+ // 跳转详情
|
|
|
+ getOrderdetils(item){
|
|
|
+ console.log(item)
|
|
|
+ },
|
|
|
+ // 去结算
|
|
|
+ toPay() {
|
|
|
+ uni.showLoading({
|
|
|
+ title: '加载中'
|
|
|
+ })
|
|
|
+ let cartList=JSON.stringify(this.cart)
|
|
|
+ uni.setStorageSync('cart', JSON.parse(JSON.stringify(this.cart)))
|
|
|
+
|
|
|
+ uni.navigateTo({
|
|
|
+ url: `/pages/goods/order_confirm/index?cartList=${cartList}`
|
|
|
+ })
|
|
|
+ uni.hideLoading()
|
|
|
+ },
|
|
|
+ // 购物车清空
|
|
|
+ Clery(){
|
|
|
+ this.cart=[] //清空购物车数组
|
|
|
+ // 重新获取
|
|
|
+ this.getCategoryCacheTree()// // 商家页面-点菜分类
|
|
|
+ },
|
|
|
+ // 减少
|
|
|
+ letloke(item){
|
|
|
+ console.log('购物车', item);
|
|
|
+ // 查找 cart 中是否已经有该 item，根据 id 判断
|
|
|
+ const existingItem = this.cart.find(cartItem => cartItem.id === item.id);
|
|
|
+ if (existingItem) {
|
|
|
+ // 如果找到相同 id 的 item，减少数量
|
|
|
+ if (existingItem.sum > 1) {
|
|
|
+ existingItem.sum -= 1; // 减少数量
|
|
|
+ } else {
|
|
|
+ // 如果数量为 1，则移除该项
|
|
|
+ existingItem.sum = 0 //赋值0;
|
|
|
+ const index = this.cart.indexOf(existingItem);
|
|
|
+ this.cart.splice(index, 1);
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ console.log('购物车', this.cart);
|
|
|
+ },
|
|
|
+ //商品数量加入购物车
|
|
|
+ Addsum(item){
|
|
|
+ // 查找 cart 中是否已经有该 item，根据 id 判断
|
|
|
+ const existingItem = this.cart.find(cartItem => cartItem.id === item.id);
|
|
|
+ console.log('这一项',existingItem)
|
|
|
+ if (existingItem) {
|
|
|
+ // 如果找到相同 id 的 item，增加数量
|
|
|
+ existingItem.sum += 1;
|
|
|
+ } else {
|
|
|
+ // 如果没有找到该 item，添加到 cart 数组
|
|
|
+ item.sum = 1; // 初始化数量为 1
|
|
|
+ this.cart.push(item);
|
|
|
+ }
|
|
|
+ console.log('购物车',this.cart)
|
|
|
+ },
|
|
|
+ // 减
|
|
|
+ // 返回
|
|
|
+ handBack() {
|
|
|
+ uni.navigateBack({
|
|
|
+ delta: 1
|
|
|
+ })
|
|
|
+ },
|
|
|
+ // 获取高度
|
|
|
infoScroll: function() {
|
|
|
let that = this;
|
|
|
//设置商品列表高度
|
|
|
@@ -231,6 +469,7 @@
|
|
|
};
|
|
|
that.hightArr = hightArr;
|
|
|
},
|
|
|
+ // 左侧点击
|
|
|
tap: function(index, id) {
|
|
|
this.toView = ''+id+0;
|
|
|
this.navActive = index;
|
|
|
@@ -238,19 +477,41 @@
|
|
|
uni.$emit('scroll');
|
|
|
}, 300);
|
|
|
},
|
|
|
- getAllCategory: function() {
|
|
|
- let that = this;
|
|
|
- let value = ""
|
|
|
- that.pidIndex = 0;
|
|
|
- getCategoryList().then(res => {
|
|
|
- that.productList = res.data;
|
|
|
- console.log(this.productList)
|
|
|
- that.$nextTick(function(){
|
|
|
- that.infoScroll();
|
|
|
- })
|
|
|
- that.showSkeleton = false
|
|
|
+
|
|
|
+ // 获取商家信息
|
|
|
+ getMerchantInfo(){
|
|
|
+ getMerchantInfo(this.Item.id).then(res => {
|
|
|
+ console.log('商家信息',res)
|
|
|
+ this.merchanInfo = res.data
|
|
|
+ });
|
|
|
+ },
|
|
|
+
|
|
|
+ // 商家页面-点菜分类
|
|
|
+ getCategoryCacheTree(){
|
|
|
+ getCategoryCacheTree(this.Item.id).then(res => {
|
|
|
+ // console.log('点菜分类数据',res.data)
|
|
|
+ // 遍历 data 数组
|
|
|
+ let data=res.data
|
|
|
+ data.forEach(category => {
|
|
|
+ if (category.childList && Array.isArray(category.childList)) {
|
|
|
+ // 给 childList 数组中的每个元素加上 sum 字段
|
|
|
+ category.childList.forEach(item => {
|
|
|
+ item.sum = 0; // 你可以根据需要设置sum的初始值
|
|
|
+ });
|
|
|
+ }
|
|
|
+ });
|
|
|
+
|
|
|
+ this.productList =data
|
|
|
+ console.log('处理的数据',this.productList )
|
|
|
+ //调取滚动
|
|
|
+ this.$nextTick(function(){
|
|
|
+ this.infoScroll();
|
|
|
+ })
|
|
|
+ this.showSkeleton = false
|
|
|
})
|
|
|
},
|
|
|
+
|
|
|
+ // 滚动
|
|
|
scroll: function(e) {
|
|
|
uni.$emit('scroll');
|
|
|
let scrollTop = e.detail.scrollTop + 10;
|
|
|
@@ -265,18 +526,7 @@
|
|
|
}
|
|
|
}
|
|
|
},
|
|
|
- searchSubmitValue: function(e) {
|
|
|
- if (this.$util.trim(e.detail.value).length > 0)
|
|
|
- uni.navigateTo({
|
|
|
- animationType: animationType.type,
|
|
|
- animationDuration: animationType.duration,
|
|
|
- url: '/pages/goods/goods_list/index?searchValue=' + e.detail.value
|
|
|
- })
|
|
|
- else
|
|
|
- return this.$util.Tips({
|
|
|
- title: '请填写要搜索的产品信息'
|
|
|
- });
|
|
|
- },
|
|
|
+
|
|
|
}
|
|
|
}
|
|
|
</script>
|
|
|
@@ -299,7 +549,7 @@
|
|
|
/* #ifndef MP */
|
|
|
height: 96rpx;
|
|
|
/* #endif */
|
|
|
- background-color: #fff;
|
|
|
+ // background-color: #fff;
|
|
|
border-bottom: 1rpx solid #f5f5f5;
|
|
|
}
|
|
|
.productSort .header .input {
|
|
|
@@ -355,6 +605,7 @@
|
|
|
}
|
|
|
.productSort .aside .item.on {
|
|
|
background-color: #f7f7f7;
|
|
|
+ color: #333;
|
|
|
border-left: 4rpx solid var(--view-theme);
|
|
|
width: 100%;
|
|
|
text-align: center;
|
|
|
@@ -396,8 +647,10 @@
|
|
|
padding-bottom: 26rpx;
|
|
|
}
|
|
|
.productSort .conter .list .item {
|
|
|
- width: 174rpx;
|
|
|
+ // width: 174rpx;
|
|
|
margin-top: 26rpx;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
}
|
|
|
.productSort .conter .list .item .picture,
|
|
|
.productSort .conter uni-image,
|
|
|
@@ -405,7 +658,7 @@
|
|
|
/deep/.easy-loadimage{
|
|
|
width: 110rpx;
|
|
|
height: 110rpx;
|
|
|
- border-radius: 50%;
|
|
|
+
|
|
|
}
|
|
|
.productSort .conter .list .item .name {
|
|
|
font-size: 24rpx;
|
|
|
@@ -415,11 +668,520 @@
|
|
|
width: 120rpx;
|
|
|
text-align: center;
|
|
|
}
|
|
|
- .searchBox{
|
|
|
- width: 100%;
|
|
|
- }
|
|
|
+
|
|
|
.header-box{
|
|
|
position: fixed;
|
|
|
z-index: 9999;
|
|
|
}
|
|
|
+
|
|
|
+
|
|
|
+ // 新的功能板块
|
|
|
+
|
|
|
+
|
|
|
+ .box-top{
|
|
|
+ padding: 20rpx;
|
|
|
+ box-sizing: border-box;
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+ gap: 20rpx;
|
|
|
+ background-color: #fff;
|
|
|
+ border-top-left-radius:30rpx ;
|
|
|
+ border-top-right-radius: 30rpx;
|
|
|
+ }
|
|
|
+ .box-top1{
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: space-between;
|
|
|
+ }
|
|
|
+ .box-txt{
|
|
|
+ overflow-wrap: break-word;
|
|
|
+ color: rgba(20, 20, 20, 1);
|
|
|
+ font-size: 36rpx;
|
|
|
+ font-family: PingFangSC-Semibold;
|
|
|
+ font-weight: 600;
|
|
|
+ text-align: left;
|
|
|
+ white-space: nowrap;
|
|
|
+ line-height: 50rpx;
|
|
|
+ }
|
|
|
+ .box-pin{
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ gap: 10rpx;
|
|
|
+ }
|
|
|
+ .box-txt2{
|
|
|
+ overflow-wrap: break-word;
|
|
|
+ color: rgba(253, 103, 22, 1);
|
|
|
+ font-size: 28rpx;
|
|
|
+ font-family: PingFangSC-Semibold;
|
|
|
+ font-weight: 600;
|
|
|
+ text-align: left;
|
|
|
+ white-space: nowrap;
|
|
|
+ line-height: 40rpx;
|
|
|
+ }
|
|
|
+ .box-txt3{
|
|
|
+ overflow-wrap: break-word;
|
|
|
+ color: rgba(153, 153, 153, 1);
|
|
|
+ font-size: 22rpx;
|
|
|
+ font-family: PingFangSC-Medium;
|
|
|
+ font-weight: 500;
|
|
|
+ text-align: left;
|
|
|
+ white-space: nowrap;
|
|
|
+ line-height: 32rpx;
|
|
|
+ margin-top: 6rpx;
|
|
|
+ }
|
|
|
+ .box-shopp{
|
|
|
+ overflow-wrap: break-word;
|
|
|
+ color: rgba(20, 20, 20, 1);
|
|
|
+ font-size: 24rpx;
|
|
|
+ font-family: PingFangSC-Regular;
|
|
|
+ font-weight: normal;
|
|
|
+ text-align: left;
|
|
|
+ white-space: nowrap;
|
|
|
+ line-height: 34rpx;
|
|
|
+ }
|
|
|
+ .box-newtxt{
|
|
|
+ background: #F8F9FB ;
|
|
|
+ padding: 10rpx;
|
|
|
+ box-sizing: border-box;
|
|
|
+ overflow-wrap: break-word;
|
|
|
+ color: rgba(133, 134, 135, 1);
|
|
|
+ font-size: 22rpx;
|
|
|
+ font-family: PingFangSC-Regular;
|
|
|
+ font-weight: normal;
|
|
|
+ text-align: left;
|
|
|
+ white-space: nowrap;
|
|
|
+ line-height: 32rpx;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ gap: 6rpx;
|
|
|
+ height: 60rpx;
|
|
|
+ position: relative;
|
|
|
+ }
|
|
|
+
|
|
|
+ .boxcolor{
|
|
|
+ background-color: #FF6702;
|
|
|
+ }
|
|
|
+ .box-color-txt{
|
|
|
+ overflow-wrap: break-word;
|
|
|
+ color: rgba(255, 255, 255, 1);
|
|
|
+ font-size: 36rpx;
|
|
|
+ font-family: PingFangSC-Medium;
|
|
|
+ font-weight: 500;
|
|
|
+ text-align: center;
|
|
|
+ white-space: nowrap;
|
|
|
+
|
|
|
+ }
|
|
|
+ .back-button-1 {
|
|
|
+ position: absolute;
|
|
|
+ left: 20rpx;
|
|
|
+ font-size: 30px; /* 设置箭头的大小 */
|
|
|
+ color: #000; /* 设置箭头颜色 */
|
|
|
+ width: 40px; /* 按钮的宽度 */
|
|
|
+ height: 40px; /* 按钮的高度 */
|
|
|
+ background-color: transparent; /* 背景透明 */
|
|
|
+ border-radius: 50%; /* 圆形按钮 */
|
|
|
+ cursor: pointer; /* 鼠标悬停时显示手指 */
|
|
|
+
|
|
|
+ }
|
|
|
+ .back-button-1::before {
|
|
|
+ content: '<'; /* 设置按钮的内容为 "<" */
|
|
|
+ font-size: 30px; /* 设置箭头符号的大小 */
|
|
|
+ color: #000; /* 设置箭头颜色 */
|
|
|
+ }
|
|
|
+ .nexbox{
|
|
|
+ background: #FFF;
|
|
|
+ box-sizing: border-box;
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+ gap: 10rpx;
|
|
|
+ }
|
|
|
+ .nexbox-txt{
|
|
|
+ width: 100%;
|
|
|
+ position: sticky;
|
|
|
+ top: -2rpx;
|
|
|
+ z-index: 99;
|
|
|
+ background: #fff;
|
|
|
+ box-sizing: border-box;
|
|
|
+ height: 50rpx;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ padding-left: 20rpx;
|
|
|
+ color: #fd6716;
|
|
|
+ }
|
|
|
+ .row-middle{
|
|
|
+ width: 100%;
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-between;
|
|
|
+ }
|
|
|
+ .nexbox1{
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+ gap: 15rpx;
|
|
|
+ width: 70%;
|
|
|
+ }
|
|
|
+ .neximg{
|
|
|
+ width: 25%;
|
|
|
+ height: 100%;
|
|
|
+ flex-shrink: 0;
|
|
|
+ object-fit: contain; /* 保持图片等比例缩放，并且不会裁切 */
|
|
|
+ }
|
|
|
+ .nexbox1-txt{
|
|
|
+ overflow-wrap: break-word;
|
|
|
+ color: rgba(20, 20, 20, 1);
|
|
|
+ font-size: 32rpx;
|
|
|
+ font-family: PingFangSC-Semibold;
|
|
|
+ font-weight: 600;
|
|
|
+ white-space: nowrap;
|
|
|
+ line-height: 44rpx;
|
|
|
+
|
|
|
+ }
|
|
|
+ .nexbox2{
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ gap: 20rpx;
|
|
|
+ overflow-wrap: break-word;
|
|
|
+ color: rgba(100, 100, 100, 1);
|
|
|
+ font-size: 22rpx;
|
|
|
+ font-family: PingFangSC-Regular;
|
|
|
+ font-weight: normal;
|
|
|
+ text-align: left;
|
|
|
+ white-space: nowrap;
|
|
|
+ line-height: 32rpx;
|
|
|
+ }
|
|
|
+ .nexbox3{
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: space-between;
|
|
|
+ }
|
|
|
+ .nexbox-txt3{
|
|
|
+ overflow-wrap: break-word;
|
|
|
+ color: rgba(255, 152, 5, 1);
|
|
|
+ font-size: 28rpx;
|
|
|
+ font-family: PingFangSC-Semibold;
|
|
|
+ font-weight: 600;
|
|
|
+
|
|
|
+ white-space: nowrap;
|
|
|
+ line-height: 40rpx;
|
|
|
+ }
|
|
|
+ .nexbox-img3{
|
|
|
+ width: 36rpx !important;
|
|
|
+ height: 36rpx !important;
|
|
|
+
|
|
|
+ }
|
|
|
+ .nexbox4{
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ gap: 20rpx;
|
|
|
+ line-height: 18rpx;
|
|
|
+ }
|
|
|
+ .neximg1{
|
|
|
+ width: 36rpx;
|
|
|
+ height: 36rpx;
|
|
|
+ background: #FFFFFF;
|
|
|
+ border: 1px solid #FF6702;
|
|
|
+ color: #FF6702;
|
|
|
+ border-radius: 60%;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: center;
|
|
|
+ }
|
|
|
+
|
|
|
+ // 购物车
|
|
|
+ .cart-box {
|
|
|
+ position: absolute;
|
|
|
+ // bottom: 30rpx;
|
|
|
+ left: 30rpx;
|
|
|
+ right: 30rpx;
|
|
|
+ height: 96rpx;
|
|
|
+ border-radius: 48rpx;
|
|
|
+ box-shadow: 0 0 20rpx rgba(0, 0, 0, 0.2);
|
|
|
+ background-color: #000;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: space-between;
|
|
|
+ z-index: 9999;
|
|
|
+
|
|
|
+ .cart-img {
|
|
|
+ width: 50rpx;
|
|
|
+ height: 47rpx;
|
|
|
+ position: relative;
|
|
|
+ // margin-top: -48rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .pay-btn {
|
|
|
+ height: 100%;
|
|
|
+ padding: 0 30rpx;
|
|
|
+ color: #FFFFFF;
|
|
|
+ border-radius: 0 50rpx 50rpx 0;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ font-size: $font-size-base;
|
|
|
+ }
|
|
|
+
|
|
|
+ .mark {
|
|
|
+ padding-left: 46rpx;
|
|
|
+ margin-right: 30rpx;
|
|
|
+ position: relative;
|
|
|
+
|
|
|
+ .tag {
|
|
|
+ background-color: $color-warning;
|
|
|
+ color: $text-color-white;
|
|
|
+ display: flex;
|
|
|
+ justify-content: center;
|
|
|
+ align-items: center;
|
|
|
+ font-size: $font-size-sm;
|
|
|
+ position: absolute;
|
|
|
+ right: -13rpx;
|
|
|
+ top: -20rpx;
|
|
|
+ border-radius: 100%;
|
|
|
+ padding: 4rpx;
|
|
|
+ width: 27rpx;
|
|
|
+ height: 27rpx;
|
|
|
+ opacity: .9;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .price {
|
|
|
+ flex: 1;
|
|
|
+ color: $text-color-base;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .cart-popup {
|
|
|
+ .top {
|
|
|
+ background-color: $bg-color-primary;
|
|
|
+ color: $color-primary;
|
|
|
+ padding: 10rpx 30rpx;
|
|
|
+ font-size: 24rpx;
|
|
|
+ text-align: right;
|
|
|
+ }
|
|
|
+
|
|
|
+ .cart-list {
|
|
|
+ background-color: #FFFFFF;
|
|
|
+ width: 100%;
|
|
|
+ overflow: hidden;
|
|
|
+ min-height: 1vh;
|
|
|
+ max-height: 60vh;
|
|
|
+
|
|
|
+ .wrapper {
|
|
|
+ height: 100%;
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+ padding: 0 30rpx;
|
|
|
+ margin-bottom: 156rpx;
|
|
|
+
|
|
|
+ .item {
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-between;
|
|
|
+ align-items: center;
|
|
|
+ padding: 30rpx 0;
|
|
|
+ position: relative;
|
|
|
+
|
|
|
+ &::after {
|
|
|
+ content: ' ';
|
|
|
+ position: absolute;
|
|
|
+ bottom: 0;
|
|
|
+ left: 0;
|
|
|
+ width: 100%;
|
|
|
+ background-color: $border-color;
|
|
|
+ height: 2rpx;
|
|
|
+ transform: scaleY(.6);
|
|
|
+ }
|
|
|
+
|
|
|
+ .left {
|
|
|
+ flex: 1;
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+ overflow: hidden;
|
|
|
+ margin-right: 30rpx;
|
|
|
+
|
|
|
+ .name {
|
|
|
+ font-size: $font-size-sm;
|
|
|
+ color: $text-color-base;
|
|
|
+ }
|
|
|
+
|
|
|
+ .props {
|
|
|
+ color: $text-color-assist;
|
|
|
+ font-size: 24rpx;
|
|
|
+ overflow: hidden;
|
|
|
+ text-overflow: ellipsis;
|
|
|
+ white-space: nowrap;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .center {
|
|
|
+ margin-right: 120rpx;
|
|
|
+ font-size: $font-size-base;
|
|
|
+ }
|
|
|
+
|
|
|
+ .right {
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: space-between;
|
|
|
+
|
|
|
+ .btn {
|
|
|
+ width: 46rpx;
|
|
|
+ height: 46rpx;
|
|
|
+ border-radius: 100%;
|
|
|
+ padding: 0;
|
|
|
+ text-align: center;
|
|
|
+ line-height: 46rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .number {
|
|
|
+ font-size: $font-size-base;
|
|
|
+ width: 46rpx;
|
|
|
+ height: 46rpx;
|
|
|
+ text-align: center;
|
|
|
+ line-height: 46rpx;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .back-button {
|
|
|
+
|
|
|
+ width: 30rpx;
|
|
|
+
|
|
|
+ height: 30rpx;
|
|
|
+
|
|
|
+ border-right: 4rpx solid #fff;
|
|
|
+ border-bottom: 4rpx solid #fff;
|
|
|
+
|
|
|
+ transform: rotate(135deg);
|
|
|
+
|
|
|
+ margin-left: 10rpx;
|
|
|
+
|
|
|
+ display: inline-block;
|
|
|
+
|
|
|
+ position: relative;
|
|
|
+ }
|
|
|
+
|
|
|
+ .newsTitle {
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ }
|
|
|
+
|
|
|
+ // 购物车弹窗
|
|
|
+ .mode{
|
|
|
+ position: fixed;
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
+ left: 0;
|
|
|
+ top: 0;
|
|
|
+ background: rgba(33, 33, 33, 0.8);
|
|
|
+ z-index: 999;
|
|
|
+ display: flex;
|
|
|
+ align-items: flex-end;
|
|
|
+ }
|
|
|
+ .mode-1{
|
|
|
+ width: 100%;
|
|
|
+ height: 840rpx;
|
|
|
+ background: #FFF;
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+ gap: 20rpx;
|
|
|
+ // padding: 30rpx;
|
|
|
+ box-sizing: border-box;
|
|
|
+ overflow: auto; /* 添加这个属性使容器可以滚动 */
|
|
|
+ }
|
|
|
+ .mode-box{
|
|
|
+ width: 100%;
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+ gap: 20rpx;
|
|
|
+ padding: 30rpx;
|
|
|
+ box-sizing: border-box;
|
|
|
+ }
|
|
|
+ .mode-2{
|
|
|
+ width: 100%;
|
|
|
+ height: 200rpx;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: space-between;
|
|
|
+
|
|
|
+
|
|
|
+ }
|
|
|
+ .mode-img{
|
|
|
+ border-radius: 5%;
|
|
|
+ width: 25%;
|
|
|
+ height: 150rpx;
|
|
|
+ flex-shrink: 0;
|
|
|
+ object-fit: contain; /* 保持图片等比例缩放，并且不会裁切 */
|
|
|
+ }
|
|
|
+ .mode-clear{
|
|
|
+ padding: 30rpx;
|
|
|
+ box-sizing: border-box;
|
|
|
+ position: sticky;
|
|
|
+ z-index: 99;
|
|
|
+ top: 0;
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-between;
|
|
|
+ align-items: center;
|
|
|
+ background: #FFF;
|
|
|
+ border-bottom: 1px solid burlywood;
|
|
|
+ }
|
|
|
+ .mode-txt{
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ gap: 8rpx;
|
|
|
+ }
|
|
|
+ .mode-txt1{
|
|
|
+ font-weight: 500;
|
|
|
+ font-size: 32rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+
|
|
|
+ // 盒子
|
|
|
+ .xbox1{
|
|
|
+ margin-top: 26rpx;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ width: 100%;
|
|
|
+ justify-content: space-between;
|
|
|
+ }
|
|
|
+
|
|
|
+
|
|
|
+ // 点菜评价切换
|
|
|
+ .let-box{
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ gap: 60rpx;
|
|
|
+ padding: 20rpx;
|
|
|
+ box-sizing: border-box;
|
|
|
+ }
|
|
|
+ .let-box1{
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: center;
|
|
|
+ gap: 10rpx;
|
|
|
+ }
|
|
|
+ .let-line{
|
|
|
+ border-radius: 6rpx;
|
|
|
+ width: 40rpx;
|
|
|
+ height: 10rpx;
|
|
|
+ }
|
|
|
+ .let-txt{
|
|
|
+ overflow-wrap: break-word;
|
|
|
+ color: rgba(20, 20, 20, 1);
|
|
|
+ font-size: 28rpx;
|
|
|
+ font-weight: normal;
|
|
|
+ text-align: left;
|
|
|
+ white-space: nowrap;
|
|
|
+ line-height: 40rpx;
|
|
|
+ }
|
|
|
+ .actave{
|
|
|
+ background-color: rgba(255, 103, 2, 1);
|
|
|
+ }
|
|
|
+ .actave1{
|
|
|
+ color: rgba(255, 103, 2, 1);
|
|
|
+ }
|
|
|
+ .icon-img{
|
|
|
+ width: 40rpx;
|
|
|
+ height: 40rpx;
|
|
|
+ flex-shrink: 0;
|
|
|
+ }
|
|
|
</style>
|
xjg
