5925265e69
【原 因】：搜索功能相关 页面组件 【过 程】：1.serarch.vue组页面 2把购物车按钮提取出来作为单独组件3.前端搜索 在前端做数据过滤进行 搜索结果的输出 【影 响】： # 类型 包含: # feat：新功能（feature） # fix：修补bug # docs：文档（documentation） # style： 格式（不影响代码运行的变动） # refactor：重构（即不是新增功能，也不是修改bug的代码变动） # test：增加测试 # chore：构建过程或辅助工具的变动
95 lines
2.6 KiB
Vue
95 lines
2.6 KiB
Vue
<template>
|
|
<view class="p-l-24 p-r-24 cartBox">
|
|
<view v-if="total === 0" class="rad16 bg-g flex ofh" style="height: 108rpx;">
|
|
<view class="bg-b" style="width: 152rpx;"></view>
|
|
<view class="flex1 flex mac p-l-24">
|
|
<u--image src="/static/icons/cafe-48.svg" width="96rpx" height="96rpx" />
|
|
<view class="m-l-12 fz36 fb">未选购餐品</view>
|
|
</view>
|
|
</view>
|
|
<view v-else class="bg-m rad16 flex" style="height: 108rpx;">
|
|
<view class="flex md p-b-12">
|
|
<u--image src="/static/icons/planeBox-100.svg" width="136rpx" height="136rpx"
|
|
@click="$store.commit('setCartShow',!$store.state.cartShow)" />
|
|
</view>
|
|
<view class="fci fz36 flex1 flex msb">
|
|
<view class="flex1 p-l-12 flex column mc" @click="$store.commit('setCartShow',!$store.state.cartShow)">
|
|
<view class="fz36 fb">¥{{total | formatPrice}}</view>
|
|
<view class="fz24" v-if="minimumOrderDifference>0">还差¥{{minimumOrderDifference | formatPrice}}起送
|
|
</view>
|
|
</view>
|
|
<view class="flex column mac mc" style="width: 180rpx;" @click="handleSeled">
|
|
<view class="fz36">选好了</view>
|
|
<view class="fz24">Order</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
import {
|
|
formatPrice,
|
|
totalPrice
|
|
} from '@/utils/index.js'
|
|
export default {
|
|
name: "cartBut",
|
|
data() {
|
|
return {
|
|
|
|
}
|
|
},
|
|
methods: {
|
|
// 购物车价格总和
|
|
totalPrice,
|
|
//"选好了"执行
|
|
handleSeled() {
|
|
const regex = /^(\+?\d{1,4}[\s-]?)?\d{3}\*{4}\d{4}$/
|
|
if (regex.test(this.$store.state.userInfo.tel)) { //手机号合法
|
|
if (Number(this.minimumOrderDifference) <= 0) { //起送价判断
|
|
uni.navigateTo({ //跳转到订单页面
|
|
url: '/pages/shop/confirm'
|
|
})
|
|
} else {
|
|
uni.showToast({
|
|
title: '未达到起送价',
|
|
icon: 'error'
|
|
})
|
|
}
|
|
} else { //手机号不合法 获取为空
|
|
uni.navigateTo({ //跳转到获取手机号页面
|
|
url: '/pages/main/getTel'
|
|
})
|
|
}
|
|
}
|
|
},
|
|
computed: {
|
|
//购物车总价
|
|
total() {
|
|
return this.totalPrice(this.$store.state.cartList)
|
|
},
|
|
//起送差价
|
|
minimumOrderDifference() {
|
|
return Number(this.shopCon.price_min) - Number(this.total)
|
|
},
|
|
//商品信息
|
|
shopCon() {
|
|
return this.$store.state.shopCon
|
|
},
|
|
},
|
|
filters: {
|
|
formatPrice //格式化价格
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
.cartBox {
|
|
z-index: 10071;
|
|
width: calc(100vw - 48rpx);
|
|
height: 156rpx;
|
|
background: linear-gradient(to bottom, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.7) 70%, rgba(255, 255, 255, 1) 100%);
|
|
position: absolute;
|
|
bottom: 0rpx;
|
|
}
|
|
</style> |