|
|
<template>
|
|
|
<view>
|
|
|
<view style="display: flex;flex-direction: column;height: 100vh;background: #F6D13A;" :style="{
|
|
|
background: mch && mch.main_color ? mch.main_color : (mch ? '#F6D13A' : '#F0F0F0')
|
|
|
}">
|
|
|
<view class="hearder-box" style=""
|
|
|
v-if="mch">
|
|
|
<view style="display: flex;align-items: center;">
|
|
|
<view style="flex: 1;">
|
|
|
<u-search placeholder="请输入搜索商品名称" v-model="keyword" @search="getData" @custom="getData"></u-search>
|
|
|
</view>
|
|
|
<view v-if="table" style="font-size: 32rpx;font-weight: bold;margin-left: 20rpx;">
|
|
|
桌号：{{ table.number }}
|
|
|
</view>
|
|
|
</view>
|
|
|
<view style="display: flex;align-items: center;justify-content: space-between;margin-top: 20rpx;">
|
|
|
<view style="display: flex;align-items: center;">
|
|
|
<view style="margin-right: 20rpx;">
|
|
|
<image style="width: 60rpx;height: 60rpx;border-radius: 20rpx;" :src="mch.logo_url"></image>
|
|
|
</view>
|
|
|
<view style="color: #000;font-weight: 600;">
|
|
|
{{ mch.name }}
|
|
|
</view>
|
|
|
<view>
|
|
|
<u-icon name="arrow-right" color="#262626" size="15"></u-icon>
|
|
|
</view>
|
|
|
</view>
|
|
|
<view style="font-size: 28rpx;font-weight: 600;" v-if="mch.business_hours && mch.business_hours.length > 0">
|
|
|
<!-- <text style="color: #000;">10:30-22:40</text> -->
|
|
|
<view style="margin-left: 20rpx;color: #000;"
|
|
|
v-for="(items, i) of mch.business_hours" :key="i">
|
|
|
{{ items.join('-') }}
|
|
|
</view>
|
|
|
</view>
|
|
|
</view>
|
|
|
<view style="margin-top: 14rpx;">
|
|
|
<u-icon @click="openLocation(mch)" name="map" :label="mch.detail || mch.name"
|
|
|
labelColor="#a8a8a8" color="#a8a8a8" size="12" label-size="12"></u-icon>
|
|
|
</view>
|
|
|
</view>
|
|
|
|
|
|
<view class="content-box" style="overflow: hidden;">
|
|
|
<!-- 左侧菜单 -->
|
|
|
<view class="left-tab" style="overflow-y: scroll;background: #F0F0F0;">
|
|
|
<template v-if="cat_list && cat_list.length > 0">
|
|
|
<view v-for="(item, index) in cat_list" class="cat-item" @click="updateCatIndex(index)"
|
|
|
:class="cat_index == index ? 'cat-item-active' : ''">
|
|
|
<template v-if="item.id">
|
|
|
<view v-if="item.pic_url">
|
|
|
<image style="width: 60rpx;height: 60rpx;" :src="item.pic_url" mode=""></image>
|
|
|
</view>
|
|
|
<view :style="{
|
|
|
lineHeight: item.pic_url ? '40rpx' : '60rpx'
|
|
|
}">
|
|
|
{{ item.name }}
|
|
|
</view>
|
|
|
</template>
|
|
|
<template v-else>
|
|
|
<view>
|
|
|
<image style="width: 60rpx;height: 60rpx;" src="@/static/image/bixuan.png" mode=""></image>
|
|
|
</view>
|
|
|
<view :style="{
|
|
|
lineHeight: '40rpx'
|
|
|
}">
|
|
|
{{ item.name }}
|
|
|
</view>
|
|
|
</template>
|
|
|
</view>
|
|
|
</template>
|
|
|
<template v-else>
|
|
|
<view style="padding: 80rpx 0;">
|
|
|
<u-empty iconSize="80rpx" mode="list" ></u-empty>
|
|
|
</view>
|
|
|
</template>
|
|
|
</view>
|
|
|
<!-- 右侧菜单 -->
|
|
|
<view class="right-tab" style="display: flex;flex-direction: column;position: relative;">
|
|
|
<view style="display: flex;flex: 1;height: 100%;overflow: hidden;position: relative;"
|
|
|
>
|
|
|
<scroll-view scroll-y style="overflow-y: scroll;float: left;width: 100%;flex: 1;"
|
|
|
refresher-default-style="none"
|
|
|
:refresher-triggered="triggered" :refresher-enabled="cat_index > 0" @refresherrefresh="onRefresh"
|
|
|
:refresher-threshold="60" @refresherrestore="onStore"
|
|
|
@scrolltolower="sBottome" @scroll="is_scroll_bottom = false">
|
|
|
<template #refresher>
|
|
|
<view style="height: 100%;display: flex;align-items: flex-end;justify-content: center;">
|
|
|
<view style="font-size: 28rpx;color: #999;line-height: 60px;">
|
|
|
下滑加载上一分类
|
|
|
</view>
|
|
|
</view>
|
|
|
</template>
|
|
|
|
|
|
<view style="padding: 20rpx;min-height: 100%;" @touchstart="onTouchstart" @touchend="onTouchend" @touchmove="onTouchmove">
|
|
|
<view v-if="cat_list && cat_list.length > 0" style="margin-bottom: 20rpx;">
|
|
|
{{ cat_list[cat_index].name }}
|
|
|
</view>
|
|
|
<view v-for="(item, index) in goods_list" @click="show_goods_id = item.goods_id"
|
|
|
style="display: flex;width: 100%;background: #FFF;border-radius: 14rpx;box-shadow: 0px 0px 8rpx 0px rgba(0, 0, 0, 0.1);margin-bottom: 20rpx;overflow: hidden;">
|
|
|
<view style="background: #F0F0F0;">
|
|
|
<image style="display: block;width: 200rpx;height: 200rpx;"
|
|
|
:src="item.goods_info.pic_url" mode="aspectFill"></image>
|
|
|
</view>
|
|
|
<view
|
|
|
style="flex: 1;padding: 10rpx 14rpx;display: flex;flex-direction: column;justify-content: space-between;">
|
|
|
<view>
|
|
|
<view class="goods_name">{{ item.goods_info.name }}</view>
|
|
|
<view style="color: #A16222;font-weight: bold;margin-top: 16rpx;">
|
|
|
￥{{ item.goods_info.price_min }}起
|
|
|
</view>
|
|
|
</view>
|
|
|
<view style="display: flex;justify-content: flex-end;">
|
|
|
<view @click.stop="chooseSpecifications(item, $event)" :data-index="index">
|
|
|
<u-icon name="plus-circle-fill" :color="mch && mch.main_color ? mch.main_color : '#A16222'" size="50rpx"></u-icon>
|
|
|
</view>
|
|
|
</view>
|
|
|
</view>
|
|
|
</view>
|
|
|
<template v-if="goods_loading == 0">
|
|
|
<!-- 加载中 -->
|
|
|
<view style="padding: 20rpx;display: flex;align-items: center;justify-content: center;">
|
|
|
<u-loading-icon></u-loading-icon>
|
|
|
</view>
|
|
|
</template>
|
|
|
<view v-else>
|
|
|
<view v-if="(cat_index + 1) < cat_list.length"
|
|
|
style="font-size: 28rpx;color: #999;line-height: 60rpx;display: flex;align-items: center;justify-content: center;">
|
|
|
<view style="margin-right: 10rpx;">
|
|
|
{{ bottom_scoll_px < 200 ? '上滑加载下一分类' : '释放加载下一分类' }}
|
|
|
</view>
|
|
|
<view
|
|
|
:style="{
|
|
|
transform: 'rotateX(' + (180 * bottom_scoll_px / 200) + 'deg)'
|
|
|
}"
|
|
|
style="border: 1rpx solid #999;width: 34rpx;height: 34rpx;border-radius: 50%;display: flex;align-items: center;justify-content: center;">
|
|
|
<u-icon name="arrow-upward" color="#999" size="28rpx"></u-icon>
|
|
|
</view>
|
|
|
</view>
|
|
|
</view>
|
|
|
</view>
|
|
|
</scroll-view>
|
|
|
</view>
|
|
|
<!-- <view v-if="bottom_scoll_px > 0"
|
|
|
style="display: flex;justify-content: center;overflow: hidden;position: absolute;left: 0;right: 0;bottom: 0;"
|
|
|
:style="{
|
|
|
height: bottom_scoll_px + 'px'
|
|
|
}">
|
|
|
<view style="font-size: 28rpx;color: #999;line-height: 60px;">
|
|
|
上滑加载下一分类
|
|
|
</view>
|
|
|
</view> -->
|
|
|
</view>
|
|
|
</view>
|
|
|
<view class="bttom-box" v-show="1 || goodsArr.reduce((sum, item) => sum + (item.num - 0), 0) > 0"
|
|
|
style="height: 150rpx;background: #FFF;position: relative;display: flex;align-items: center;width: 100%;padding: 30rpx;">
|
|
|
<view
|
|
|
style="padding: 10rpx 10rpx;display: flex;align-items: center;justify-content: space-between;position: relative;z-index: 1;background: #EFEFEF;width: 100%;border-radius: 70rpx;">
|
|
|
<view style="display: flex;align-items: center;">
|
|
|
<view @click="show_card = !show_card"
|
|
|
style="width: 80rpx;height: 80rpx;background: #FFF;border-radius: 50%;display: flex;align-items: center;justify-content: center;position: relative;">
|
|
|
<u-icon size="70rpx" name="shopping-cart" :color="mch && mch.main_color ? mch.main_color : '#A16222'"></u-icon>
|
|
|
<view
|
|
|
style="position: absolute;background: #BD3124;color: #FFF;font-size: 20rpx;line-height: 30rpx;padding: 0 10rpx;border-radius: 15rpx;right: 0;top: 0;">
|
|
|
{{ goodsArr.reduce((sum, item) => sum + (item.num - 0), 0) }}
|
|
|
</view>
|
|
|
</view>
|
|
|
<view style="margin-left: 40rpx;color: #000;font-weight: bold;font-size: 40rpx;">
|
|
|
<!-- ￥{{ (
|
|
|
goodsArr.reduce((sum, item) => sum + (item.activeGoodsInfo.price * item.num - 0), 0)
|
|
|
).toFixed(2) }} -->
|
|
|
￥{{ totalPrice }}
|
|
|
</view>
|
|
|
</view>
|
|
|
<view @click="toSubmit"
|
|
|
:style="{
|
|
|
background: mch && mch.main_color ? mch.main_color : '#A16222'
|
|
|
}"
|
|
|
style="color: #FFF;padding: 0 30rpx;line-height: 70rpx;border-radius: 35rpx;font-size: 32rpx;">
|
|
|
去下单
|
|
|
</view>
|
|
|
</view>
|
|
|
<view style="position: fixed;bottom: 0;top: 0;left: 0;right: 0;background: rgba(0, 0, 0, .2);"
|
|
|
@click="show_card = !show_card" v-if="show_card">
|
|
|
<view :style="{
|
|
|
maxHeight: show_card ? '60vh' : '0'
|
|
|
}" style="position: absolute;left: 0;right: 0;bottom: 0;background: #FFF;border-radius: 20rpx 20rpx 0 0;z-index: 0;transition: max-height 0.5s;overflow-y: scroll;">
|
|
|
<view
|
|
|
style="padding: 20rpx 30rpx;border-bottom: 1rpx solid #F0F0F0;position: sticky;top: 0;z-index: 3;background: #FFF;">
|
|
|
购物车({{ goodsArr.reduce((sum, item) => sum + (item.num - 0), 0) }})
|
|
|
</view>
|
|
|
<view style="padding: 20rpx;flex: 1;overflow-y: scroll;">
|
|
|
<view v-for="(item, index) in goodsArr" v-if="item.num > 0"
|
|
|
style="display: flex;width: 100%;background: #f7f7f7;border-radius: 14rpx;margin-bottom: 20rpx;overflow: hidden;padding: 16rpx;">
|
|
|
<view style="overflow: hidden;">
|
|
|
<image style="display: block;width: 140rpx;height: 140rpx;border-radius: 18rpx;"
|
|
|
:src="item.goods.pic_url" mode="aspectFill"></image>
|
|
|
</view>
|
|
|
<view
|
|
|
style="flex: 1;padding: 10rpx 14rpx;display: flex;flex-direction: column;justify-content: space-between;">
|
|
|
<view>
|
|
|
<view class="goods_name" style="-webkit-line-clamp: 1;font-size: 20rpx;">
|
|
|
{{ item.goods.name }}
|
|
|
</view>
|
|
|
</view>
|
|
|
<view class="item-desc" style="margin: 10rpx 0;">
|
|
|
<view class="goods_sky" style="color: #999;font-size: 24rpx;">
|
|
|
<text v-for="(sku, _index) of item.activeGoodsInfo.attr_list" :key="_index">
|
|
|
{{ sku.group_name }}：{{ sku.name }}
|
|
|
</text>
|
|
|
</view>
|
|
|
</view>
|
|
|
<view style="display: flex;">
|
|
|
<view v-for="(small, index) of item.small_goods" :key="index"
|
|
|
v-show="small.group_item.length != 0">
|
|
|
<view
|
|
|
style="display: flex;background: #FFF;margin: 0 10rpx 10rpx 0;font-size: 22rpx;padding: 10rpx 20rpx;flex-wrap: nowrap;align-items: center;border-radius: 10rpx;justify-content: center;"
|
|
|
v-for="sitem of small.group_item">
|
|
|
<view>
|
|
|
{{ sitem.name }}
|
|
|
</view>
|
|
|
<view v-if="sitem.price" style="color:#BD3124;">
|
|
|
{{ sitem.price }} 元
|
|
|
</view>
|
|
|
</view>
|
|
|
</view>
|
|
|
</view>
|
|
|
<view style="display: flex;justify-content: space-between;align-items: center;">
|
|
|
<view style="color: #A16222;font-weight: bold;">
|
|
|
￥{{ item.activeGoodsInfo.price }}
|
|
|
</view>
|
|
|
<u-number-box :min="0" v-model="item.num"></u-number-box>
|
|
|
</view>
|
|
|
</view>
|
|
|
</view>
|
|
|
</view>
|
|
|
<view class="bttom-box" style="height: 110rpx;width: 100%;"></view>
|
|
|
</view>
|
|
|
</view>
|
|
|
</view>
|
|
|
</view>
|
|
|
<logins v-if="wcCode != -1" :wcCode="wcCode" :type="$utils.isInAliBrowser() || $utils.isInWeChatBrowser() ? 0 : 2" @isLogin="getCatList"></logins>
|
|
|
|
|
|
<pageSku v-if="goods.id" ref="pagesku" :goods="goods" @skuPopData="skuPopData"></pageSku>
|
|
|
<view v-if="show_donghua == 1" :animation="animationData"
|
|
|
style="position: fixed;right: 32rpx;top: 600rpx;z-index: 10;" :style="{
|
|
|
top: top + 'px'
|
|
|
}">
|
|
|
<!-- <image style="width: 50rpx;height: 50rpx;" src="../my/images/av.png" mode=""></image> -->
|
|
|
<u-icon size="50rpx" name="plus-circle-fill" :color="mch && mch.main_color ? mch.main_color : '#A16222'"
|
|
|
style="background: #fff;border-radius: 50%;"></u-icon>
|
|
|
</view>
|
|
|
|
|
|
<goods v-if="show_goods_id > 0" :goods_id="show_goods_id" @close="show_goods_id = 0"></goods>
|
|
|
|
|
|
<u-popup mode="bottom" :show="show_ren" round="20rpx">
|
|
|
<view v-if="ren_setting" style="padding-bottom: 50rpx;font-size: 40rpx;">
|
|
|
<view style="text-align: center;line-height: 80rpx;font-size: 34rpx;">
|
|
|
请选择人数
|
|
|
</view>
|
|
|
<view style="display: flex;flex-wrap: wrap;">
|
|
|
<view
|
|
|
v-for="(item, index) in (ren_setting.max_num - ren_setting.min_num + 1)"
|
|
|
>
|
|
|
<view @click="table_num = index + (ren_setting.min_num - 0);show_ren = false"
|
|
|
style="padding: 30rpx 40rpx;margin: 20rpx;background: #F0F0F0;border-radius: 10rpx;"
|
|
|
>
|
|
|
{{ index + (ren_setting.min_num - 0) }}人
|
|
|
</view>
|
|
|
</view>
|
|
|
</view>
|
|
|
</view>
|
|
|
</u-popup>
|
|
|
</view>
|
|
|
</template>
|
|
|
<script>
|
|
|
import logins from '@/components/login/logins.vue'
|
|
|
import pageSku from "./compontents/page-sku.vue";
|
|
|
import goods from "./compontents/goods.vue";
|
|
|
export default {
|
|
|
components: {
|
|
|
logins,
|
|
|
pageSku,
|
|
|
goods
|
|
|
},
|
|
|
data() {
|
|
|
return {
|
|
|
wcCode: -1,
|
|
|
mch_id: 0,
|
|
|
store_id: 0,
|
|
|
n_id: 0,
|
|
|
cat_index: 0,
|
|
|
goods_loading: 0,
|
|
|
|
|
|
cat_list: [],
|
|
|
goods_list: [],
|
|
|
mch: null,
|
|
|
table: null,
|
|
|
goods: {},
|
|
|
goodsArr: [],
|
|
|
show_card: false,
|
|
|
|
|
|
|
|
|
top: 0,
|
|
|
show_donghua: 0,
|
|
|
animationData: {},
|
|
|
animation: null,
|
|
|
cartData: null,
|
|
|
is_cont: 0,
|
|
|
|
|
|
show_goods_id: 0,
|
|
|
|
|
|
keyword: '',
|
|
|
is_scroll_bottom: false,
|
|
|
start_i: 0,
|
|
|
end_i: 0,
|
|
|
triggered: false,
|
|
|
required_list: [], // 必选订单
|
|
|
|
|
|
show_ren: false,
|
|
|
ren_setting: null,
|
|
|
table_num: 0
|
|
|
}
|
|
|
},
|
|
|
watch: {
|
|
|
cat_index(value) {
|
|
|
this.goods_list = []
|
|
|
this.getGoods()
|
|
|
}
|
|
|
},
|
|
|
async onLoad(query) {
|
|
|
let that = this
|
|
|
if (query.wxcode) {
|
|
|
uni.getStorage({
|
|
|
key: 'take_query',
|
|
|
success(res) {
|
|
|
if (!res.data.mch_id) {
|
|
|
uni.showModal({
|
|
|
title: '提示',
|
|
|
showCancel: false,
|
|
|
content: JSON.stringify(res)
|
|
|
})
|
|
|
} else {
|
|
|
that.mch_id = res.data.mch_id
|
|
|
that.store_id = res.data.store_id
|
|
|
that.n_id = res.data.n_id
|
|
|
that.is_cont = res.data.is_cont ? 1 : 0
|
|
|
that.$nextTick(() => {
|
|
|
that.wcCode = query.wxcode
|
|
|
})
|
|
|
}
|
|
|
|
|
|
},
|
|
|
fail(res) {
|
|
|
uni.showModal({
|
|
|
title: '提示',
|
|
|
showCancel: false,
|
|
|
content: JSON.stringify(res)
|
|
|
})
|
|
|
}
|
|
|
})
|
|
|
} else {
|
|
|
this.mch_id = query.mch_id
|
|
|
this.store_id = query.store_id
|
|
|
this.n_id = query.n_id
|
|
|
if (query.mch_id) {
|
|
|
uni.setStorage({
|
|
|
data: {
|
|
|
mch_id: query.mch_id,
|
|
|
store_id: query.store_id,
|
|
|
n_id: query.n_id,
|
|
|
is_cont: query.is_cont,
|
|
|
},
|
|
|
key: 'take_query',
|
|
|
success() {
|
|
|
that.is_cont = query.is_cont ? 1 : 0
|
|
|
that.wcCode = ''
|
|
|
if(!that.$utils.isInAliBrowser() && !that.$utils.isInWeChatBrowser()) {
|
|
|
that.getCatList()
|
|
|
}
|
|
|
},
|
|
|
fail(res) {
|
|
|
uni.showModal({
|
|
|
title: '提示',
|
|
|
showCancel: false,
|
|
|
content: JSON.stringify(res)
|
|
|
})
|
|
|
}
|
|
|
})
|
|
|
} else {
|
|
|
// uni.showModal({
|
|
|
// title: '提示',
|
|
|
// showCancel: false,
|
|
|
// content: '参数错误'
|
|
|
// })
|
|
|
}
|
|
|
// this.getCatList(query)
|
|
|
}
|
|
|
},
|
|
|
//发送给朋友
|
|
|
onShareAppMessage(res) { },
|
|
|
onPullDownRefresh() { },
|
|
|
onShow() { },
|
|
|
onReady() {
|
|
|
setTimeout(() => {
|
|
|
let view = uni.createSelectorQuery().select(".bttom-box");
|
|
|
if (view) {
|
|
|
view.boundingClientRect(data => {
|
|
|
this.cartData = data
|
|
|
}).exec();
|
|
|
}
|
|
|
}, 200)
|
|
|
},
|
|
|
onHide() {},
|
|
|
computed: {
|
|
|
totalPrice() {
|
|
|
return this.goodsArr.reduce((pre, cur) => {
|
|
|
let price = cur.activeGoodsInfo.price * cur.num
|
|
|
// 计算小料
|
|
|
let smallMaterialPrice = 0
|
|
|
if (cur.small_goods) {
|
|
|
smallMaterialPrice = cur.small_goods.reduce((price, item) => {
|
|
|
return price + item.group_item.reduce((price, item) =>
|
|
|
price + item.price, 0)
|
|
|
}, 0)
|
|
|
}
|
|
|
smallMaterialPrice = cur.num * (Number(smallMaterialPrice))
|
|
|
return pre + Number(price) + smallMaterialPrice;
|
|
|
}, 0).toFixed(2);
|
|
|
},
|
|
|
bottom_scoll_px() {
|
|
|
if (this.is_scroll_bottom && (this.start_i - this.end_i) > 0 && this.start_i > 0 && this.end_i > 0) {
|
|
|
return (this.start_i - this.end_i) > 200 ? 200 : (this.start_i - this.end_i)
|
|
|
} else {
|
|
|
return 0
|
|
|
}
|
|
|
}
|
|
|
},
|
|
|
methods: {
|
|
|
onTouchstart(e) {
|
|
|
if (this.is_scroll_bottom) {
|
|
|
this.start_i = e.changedTouches && e.changedTouches.length > 0 ? e.changedTouches[0].pageY : 0
|
|
|
}
|
|
|
},
|
|
|
onTouchmove(e) {
|
|
|
if (this.is_scroll_bottom) {
|
|
|
this.end_i = e.changedTouches && e.changedTouches.length > 0 ? e.changedTouches[0].pageY : 0
|
|
|
}
|
|
|
},
|
|
|
onTouchend(e) {
|
|
|
if (this.start_i > 0) {
|
|
|
this.end_i = e.changedTouches && e.changedTouches.length > 0 ? e.changedTouches[0].pageY : 0
|
|
|
|
|
|
let start_i = this.start_i,end_i = this.end_i
|
|
|
|
|
|
this.start_i = 0
|
|
|
this.end_i = 0
|
|
|
if (start_i > end_i && this.is_scroll_bottom) {
|
|
|
if (this.is_scroll_bottom && (start_i - end_i) > 200) {
|
|
|
if (this.cat_index + 1 < this.cat_list.length) {
|
|
|
this.cat_index += 1
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
}
|
|
|
},
|
|
|
sBottome() {
|
|
|
setTimeout(() => {
|
|
|
this.is_scroll_bottom = true
|
|
|
}, 500)
|
|
|
},
|
|
|
onRefresh(e) {
|
|
|
// console.log(e, 'onRefresh')
|
|
|
var that = this;
|
|
|
if(!this.triggered){
|
|
|
//下拉加载，先让其变true再变false才能关闭
|
|
|
this.triggered = true;
|
|
|
//关闭加载状态 (转动的圈)，需要一点延时才能关闭
|
|
|
setTimeout(() => {
|
|
|
that.triggered = false;
|
|
|
},500)
|
|
|
}
|
|
|
},
|
|
|
onStore(e) {
|
|
|
if (this.cat_index > 0) {
|
|
|
this.cat_index -= 1
|
|
|
}
|
|
|
},
|
|
|
getData() {
|
|
|
this.cat_list = []
|
|
|
this.goods_list = []
|
|
|
this.cat_index = 0
|
|
|
this.$nextTick(() => {
|
|
|
this.getCatList({
|
|
|
store_id: this.store_id,
|
|
|
mch_id: this.mch_id,
|
|
|
n_id: this.n_id,
|
|
|
})
|
|
|
})
|
|
|
},
|
|
|
async getCatList() {
|
|
|
uni.showLoading({
|
|
|
title: '加载中'
|
|
|
})
|
|
|
let res = await this.$api.common.getFootCat({
|
|
|
store_id: this.store_id,
|
|
|
mch_id: this.mch_id,
|
|
|
n_id: this.n_id,
|
|
|
keyword: this.keyword
|
|
|
})
|
|
|
uni.hideLoading()
|
|
|
if (res.code > 0) {
|
|
|
uni.showModal({
|
|
|
title: '提示',
|
|
|
content: res.msg,
|
|
|
showCancel: false,
|
|
|
success() {
|
|
|
|
|
|
}
|
|
|
})
|
|
|
} else {
|
|
|
if (res.data.is_more && res.data.is_more > 0 && this.is_cont == 0) {
|
|
|
uni.reLaunch({
|
|
|
url: '/pages/takeaway/orderAndSettlement/edit?n_id=' + this.n_id + '&mch_id=' +
|
|
|
this.mch_id + '&store_id=' + this.store_id
|
|
|
})
|
|
|
}
|
|
|
this.cat_list = res.data.cat_list
|
|
|
this.mch = res.data.mch
|
|
|
this.table = res.data.table
|
|
|
if (res.data.cat_list.length > 0) {
|
|
|
this.$nextTick(() => {
|
|
|
this.getGoods()
|
|
|
})
|
|
|
}
|
|
|
}
|
|
|
this.showRen()
|
|
|
},
|
|
|
async getGoods() {
|
|
|
this.goods_loading = 0
|
|
|
this.is_scroll_bottom = true
|
|
|
this.triggered = false
|
|
|
this.start_i = 0
|
|
|
this.end_i = 0
|
|
|
let res = await this.$api.common.getFootGoods({
|
|
|
cat_id: this.cat_list[this.cat_index].id,
|
|
|
store_id: this.store_id,
|
|
|
mch_id: this.mch_id,
|
|
|
keyword: this.keyword
|
|
|
})
|
|
|
this.goods_loading = 1
|
|
|
if (res.code > 0) {
|
|
|
uni.showModal({
|
|
|
title: '提示',
|
|
|
content: res.msg,
|
|
|
showCancel: false,
|
|
|
success() {}
|
|
|
})
|
|
|
} else {
|
|
|
if (this.cat_list[this.cat_index].id == 0) {
|
|
|
this.required_list = res.data
|
|
|
}
|
|
|
this.goods_list = res.data
|
|
|
}
|
|
|
},
|
|
|
// 选择规格
|
|
|
async chooseSpecifications(params, e) {
|
|
|
uni.showLoading({
|
|
|
title: "请稍等",
|
|
|
mask: true,
|
|
|
});
|
|
|
this.goods = {};
|
|
|
await this.$nextTick()
|
|
|
const res = await this.$api.common.goodsInfo({
|
|
|
id: params.goods_id
|
|
|
});
|
|
|
this.goods = res.data
|
|
|
await this.$nextTick()
|
|
|
await this.setStart(e)
|
|
|
setTimeout(async () => {
|
|
|
uni.hideLoading();
|
|
|
this.$refs.pagesku.skuPopData.type = 2;
|
|
|
this.$refs.pagesku.$refs?.popup?.open();
|
|
|
}, 0)
|
|
|
},
|
|
|
async skuPopData(e) {
|
|
|
const goods = this.goodsArr.find(item => item.goods_sku_id === e.goods_sku_id && item
|
|
|
.small_goods_json ===
|
|
|
e.small_goods_json)
|
|
|
if (goods) {
|
|
|
let goodsArr = this.goodsArr
|
|
|
this.goodsArr.forEach((item, index) => {
|
|
|
if (item.goods_sku_id === e.goods_sku_id && item.small_goods_json === e
|
|
|
.small_goods_json) {
|
|
|
this.goodsArr[index].num = (this.goodsArr[index].num - 0) + 1
|
|
|
}
|
|
|
})
|
|
|
this.goodsArr = []
|
|
|
this.goodsArr = goodsArr
|
|
|
} else {
|
|
|
e.key = Math.random()
|
|
|
this.goodsArr.push(JSON.parse(JSON.stringify(e)))
|
|
|
}
|
|
|
console.log(this.goodsArr)
|
|
|
await this.$nextTick()
|
|
|
this.setA()
|
|
|
},
|
|
|
setStart(e) {
|
|
|
this.top = e.detail.y
|
|
|
var animation = uni.createAnimation({
|
|
|
duration: 600,
|
|
|
timingFunction: 'ease',
|
|
|
})
|
|
|
this.animation = animation
|
|
|
this.animationData = animation.export()
|
|
|
},
|
|
|
setA() {
|
|
|
this.show_donghua = 1
|
|
|
// 先旋转后放大
|
|
|
this.animation.translate('-600rpx', (this.cartData.top - this.top)).step()
|
|
|
this.animationData = this.animation.export()
|
|
|
setTimeout(() => {
|
|
|
this.show_donghua = 0
|
|
|
this.$nextTick(() => {
|
|
|
this.animation.translate('600rpx', -(this.cartData.top - this.top)).step()
|
|
|
this.animationData = this.animation.export()
|
|
|
})
|
|
|
}, 600)
|
|
|
},
|
|
|
updateCatIndex(index) {
|
|
|
if (this.cat_index == 0 && this.cat_list[this.cat_index] && this.cat_list[this.cat_index].id == 0) {
|
|
|
if (!this.verRequired()) {
|
|
|
uni.showToast({
|
|
|
icon: 'none',
|
|
|
title: '请选择必选商品'
|
|
|
})
|
|
|
} else {
|
|
|
this.cat_index = index
|
|
|
}
|
|
|
} else {
|
|
|
this.cat_index = index
|
|
|
}
|
|
|
},
|
|
|
// 验证必点商品是否已点
|
|
|
verRequired() {
|
|
|
let that = this
|
|
|
let goodsArr = this.goodsArr.filter(item => item.num > 0)
|
|
|
let required_list = that.required_list.filter((item) => {
|
|
|
return goodsArr.filter((item1) => {
|
|
|
return item.goods_info.id == item1.goods.id
|
|
|
}).length > 0 ? true : false
|
|
|
})
|
|
|
return that.required_list.length <= required_list.length
|
|
|
},
|
|
|
toSubmit() {
|
|
|
let goodsArr = this.goodsArr.filter(item => item.num > 0)
|
|
|
if (!goodsArr.length) {
|
|
|
uni.$u.toast("请选择点餐商品")
|
|
|
return
|
|
|
}
|
|
|
if (this.required_list && this.required_list.length > 0) {
|
|
|
if (!this.verRequired()) {
|
|
|
uni.$u.toast("请选择必选商品")
|
|
|
return
|
|
|
}
|
|
|
}
|
|
|
let that = this
|
|
|
uni.setStorage({
|
|
|
key: 'take_n_id_' + this.n_id,
|
|
|
data: goodsArr,
|
|
|
success() {
|
|
|
uni.navigateTo({
|
|
|
url: "/pages/takeaway/orderAndSettlement/index?" + "n_id=" + that.n_id +
|
|
|
"&mch_id=" + that.mch_id + "&store_id=" + that.store_id + "&table_num=" + that.table_num,
|
|
|
});
|
|
|
}
|
|
|
})
|
|
|
},
|
|
|
async showRen() {
|
|
|
this.goods = {};
|
|
|
await this.$nextTick()
|
|
|
const res = await this.$api.common.getRen({
|
|
|
store_id: this.store_id,
|
|
|
mch_id: this.mch_id,
|
|
|
n_id: this.n_id,
|
|
|
});
|
|
|
if (res.code == 0) {
|
|
|
this.show_ren = true
|
|
|
this.ren_setting = res.data
|
|
|
}
|
|
|
},
|
|
|
}
|
|
|
}
|
|
|
</script>
|
|
|
|
|
|
<style lang="scss" scoped>
|
|
|
.hearder-box {
|
|
|
// background: linear-gradient(to bottom, #D6BDA3, #F3EEE8);
|
|
|
// background: #FFF;
|
|
|
padding: 20rpx;
|
|
|
}
|
|
|
|
|
|
.content-box {
|
|
|
display: flex;
|
|
|
flex: 1;
|
|
|
background: blue;
|
|
|
border-radius: 20rpx 20rpx 0 0;
|
|
|
overflow: hidden;
|
|
|
|
|
|
.left-tab {
|
|
|
width: 160rpx;
|
|
|
height: 100%;
|
|
|
background: #E3DAD0;
|
|
|
}
|
|
|
|
|
|
.right-tab {
|
|
|
flex: 1;
|
|
|
height: 100%;
|
|
|
background: #FFF;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
.bttom-box {
|
|
|
padding-bottom: constant(safe-area-inset-bottom);
|
|
|
padding-bottom: env(safe-area-inset-bottom);
|
|
|
}
|
|
|
|
|
|
.cat-item {
|
|
|
display: flex;
|
|
|
flex-direction: column;
|
|
|
justify-content: center;
|
|
|
align-items: center;
|
|
|
font-size: 30rpx;
|
|
|
padding: 20rpx;
|
|
|
color: #666666;
|
|
|
}
|
|
|
|
|
|
.cat-item-active {
|
|
|
background: #FFF;
|
|
|
color: #000;
|
|
|
font-weight: bold;
|
|
|
}
|
|
|
|
|
|
.goods_name {
|
|
|
display: -webkit-box;
|
|
|
-webkit-box-orient: vertical;
|
|
|
-webkit-line-clamp: 2;
|
|
|
/* 定义文本的行数 */
|
|
|
overflow: hidden;
|
|
|
text-overflow: ellipsis;
|
|
|
font-size: 28rpx;
|
|
|
}
|
|
|
|
|
|
.minus {
|
|
|
border: 1px solid #e5e5e5;
|
|
|
border-right: none;
|
|
|
border-radius: 20px 0 0 20px;
|
|
|
padding: 6px;
|
|
|
}
|
|
|
|
|
|
.plus {
|
|
|
border: 1px solid #e5e5e5;
|
|
|
border-left: none;
|
|
|
border-radius: 0 20px 20px 0;
|
|
|
padding: 6px;
|
|
|
}
|
|
|
|
|
|
.numInput {
|
|
|
width: 35px;
|
|
|
text-align: center;
|
|
|
border: 1px solid #e5e5e5;
|
|
|
padding: 3px 0;
|
|
|
height: 20px;
|
|
|
line-height: 20px;
|
|
|
font-size: 12px;
|
|
|
color: #000;
|
|
|
}
|
|
|
</style> |