|
|
@@ -0,0 +1,920 @@
|
|
|
+<template>
|
|
|
+ <view class="menu-box box-border-box align-items-flex-start">
|
|
|
+
|
|
|
+ <view class="menu-box-left" :style="{top: newNavHeight + 'rpx'}">
|
|
|
+ <view class="menu-box-left-box" :style="{height: menuLeftType?`calc(100vh - ${newNavHeight}rpx - ${68}rpx)`:''}">
|
|
|
+ <view class="menu-type-list fs-26 box-border-box align-items-center flex-justify-center"
|
|
|
+ v-for="(item,i) in categoryData" :key="i" @click="selectType(item)"
|
|
|
+ :class="type === item.type?'bgc-f fc-3 fw-600':'fc-6 fw-400'" :id="'scroll'+ item.type">
|
|
|
+ {{item.name}}
|
|
|
+ <view class="menu-type-num fc-f" v-show="item.num > 0">{{item.num > 99?'99+':item.num}}</view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+
|
|
|
+ <view class="menu-box-only">
|
|
|
+ <view class="" v-for="(item,i) in categoryData" :key="i" :id="'scroll'+ item.type">
|
|
|
+ <view class="fs-28 fw-600 fc-3 sticky-nav bgc-f p-20 box-border-box" :style="{top: newNavHeight + 'rpx'}">
|
|
|
+ {{item.name}}
|
|
|
+ </view>
|
|
|
+ <view class="menu-list flex-justify-space box-border-box" v-for="(info,k) in item.list" :key="k"
|
|
|
+ :id="'goods_id'+ info.goods_id">
|
|
|
+ <image class="flex-shrink0 goods_img" :src="info.goods_image" mode="scaleToFill"></image>
|
|
|
+ <view class="menu-list-right flex-direction flex-justify-space">
|
|
|
+ <view class="mb-8">
|
|
|
+ <view class="mb-4 goods-name text-overflow-ellipsis fs-32 fw-600">{{info.goods_name}}
|
|
|
+ </view>
|
|
|
+ <view class="text-overflow-ellipsis-one fw-400 fc-9 fs-24 mb-2 goods-name" v-if="info.spec_type == 1">
|
|
|
+ {{info.goods_desc?info.goods_desc:''}}
|
|
|
+ </view>
|
|
|
+ <view class="fw-400 fc-9 fs-24">月销{{info.sales}}</view>
|
|
|
+ </view>
|
|
|
+ <view class="flex-justify-space align-items-flex-end">
|
|
|
+ <view class="">
|
|
|
+ <span class="fs-24 fw-400 fc-FB3D03">￥</span>
|
|
|
+ <span class="fs-40 fw-b fc-FB3D03">{{info.seckill_money>0?info.seckill_money:info.price}}</span>
|
|
|
+ </view>
|
|
|
+ <view class="display-flex align-items-center" v-if="info.spec_type == 1">
|
|
|
+ <image v-show="info.num > 0" class="wh-44" @click="addred(1,i,k,info)" src="@/static/img/takeout/j.png"
|
|
|
+ mode=""></image>
|
|
|
+ <view v-show="info.num > 0" class="right-only-right-2 text-align-center fs-28 fw-400">{{info.num}}
|
|
|
+ </view>
|
|
|
+ <image class="wh-44" src="@/static/img/takeout/add.png" @click="addred(2,i,k,info)" mode=""></image>
|
|
|
+ </view>
|
|
|
+ <view v-else class="right-only-right text-align-center" @click="addred(3,i,k,info)">
|
|
|
+ <view class="fw-600 fs-28 fc-f">
|
|
|
+ 选规格
|
|
|
+ </view>
|
|
|
+ <view class="selectedNum" v-if="info.num>0">
|
|
|
+ {{info.num}}
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+
|
|
|
+ </view>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+ import tools from "@/service/tools";
|
|
|
+ import {
|
|
|
+ shopCategory,
|
|
|
+ shopGoods,
|
|
|
+ shopGoodsSpec
|
|
|
+ } from "@/api/shop";
|
|
|
+ import {
|
|
|
+ shoppingSave,
|
|
|
+ getShopIngList,
|
|
|
+ setShopIngAdd,
|
|
|
+ setShopIngDel,
|
|
|
+ setShopIngNumber
|
|
|
+ } from "@/api/shopping";
|
|
|
+ export default {
|
|
|
+ name: 'menu-box',
|
|
|
+ props: {
|
|
|
+ 'shop_id': {
|
|
|
+ default: 0
|
|
|
+ },
|
|
|
+ 'newNavHeight': {
|
|
|
+ default: 0
|
|
|
+ },
|
|
|
+ 'menuLeftType': {
|
|
|
+ default: false
|
|
|
+ }
|
|
|
+ },
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ idMark: '', //滚动自适应参数
|
|
|
+ idMarkTwo: '', //滚动自适应参数
|
|
|
+ type: 0, //分类标识
|
|
|
+ typeList: [],
|
|
|
+ categoryData: [{
|
|
|
+ type: 0,
|
|
|
+ name: '测试1',
|
|
|
+ list: [{
|
|
|
+ goods_id: 1,
|
|
|
+ goods_name: '测试商品1-1',
|
|
|
+ price: '10',
|
|
|
+ goods_image: 'https://qcloud.dpfile.com/pc/JvY4fMzO0Km80S9Sn-tNxYin28jkvrNMJV-pUo8YwCctS4AHLKPXFhGyuI2dCwk8.jpg'
|
|
|
+ }, {
|
|
|
+ goods_id: 2,
|
|
|
+ goods_name: '测试商品1-2',
|
|
|
+ price: '10',
|
|
|
+ goods_image: 'https://qcloud.dpfile.com/pc/JvY4fMzO0Km80S9Sn-tNxYin28jkvrNMJV-pUo8YwCctS4AHLKPXFhGyuI2dCwk8.jpg'
|
|
|
+ }, {
|
|
|
+ goods_id: 3,
|
|
|
+ goods_name: '测试商品1-3',
|
|
|
+ price: '10',
|
|
|
+ goods_image: 'https://qcloud.dpfile.com/pc/JvY4fMzO0Km80S9Sn-tNxYin28jkvrNMJV-pUo8YwCctS4AHLKPXFhGyuI2dCwk8.jpg'
|
|
|
+ }]
|
|
|
+ }, {
|
|
|
+ type: 1,
|
|
|
+ name: '测试2',
|
|
|
+ list: [{
|
|
|
+ goods_id: 4,
|
|
|
+ goods_name: '测试商品2-1',
|
|
|
+ price: '10',
|
|
|
+ goods_image: 'https://qcloud.dpfile.com/pc/JvY4fMzO0Km80S9Sn-tNxYin28jkvrNMJV-pUo8YwCctS4AHLKPXFhGyuI2dCwk8.jpg'
|
|
|
+ }, {
|
|
|
+ goods_id: 5,
|
|
|
+ goods_name: '测试商品2-2',
|
|
|
+ price: '10',
|
|
|
+ goods_image: 'https://qcloud.dpfile.com/pc/JvY4fMzO0Km80S9Sn-tNxYin28jkvrNMJV-pUo8YwCctS4AHLKPXFhGyuI2dCwk8.jpg'
|
|
|
+ }, {
|
|
|
+ goods_id: 6,
|
|
|
+ goods_name: '测试商品2-3',
|
|
|
+ price: '10',
|
|
|
+ goods_image: 'https://qcloud.dpfile.com/pc/JvY4fMzO0Km80S9Sn-tNxYin28jkvrNMJV-pUo8YwCctS4AHLKPXFhGyuI2dCwk8.jpg'
|
|
|
+ }]
|
|
|
+ }, {
|
|
|
+ type: 2,
|
|
|
+ name: '测试3',
|
|
|
+ list: [{
|
|
|
+ goods_id: 7,
|
|
|
+ goods_name: '测试商品3',
|
|
|
+ price: '10',
|
|
|
+ goods_image: 'https://qcloud.dpfile.com/pc/JvY4fMzO0Km80S9Sn-tNxYin28jkvrNMJV-pUo8YwCctS4AHLKPXFhGyuI2dCwk8.jpg'
|
|
|
+ }]
|
|
|
+ }, {
|
|
|
+ type: 3,
|
|
|
+ name: '测试4',
|
|
|
+ list: [{
|
|
|
+ goods_id: 8,
|
|
|
+ goods_name: '测试商品4',
|
|
|
+ price: '10',
|
|
|
+ goods_image: 'https://qcloud.dpfile.com/pc/JvY4fMzO0Km80S9Sn-tNxYin28jkvrNMJV-pUo8YwCctS4AHLKPXFhGyuI2dCwk8.jpg'
|
|
|
+ }]
|
|
|
+ }, {
|
|
|
+ type: 4,
|
|
|
+ name: '测试5',
|
|
|
+ list: [{
|
|
|
+ goods_id: 9,
|
|
|
+ goods_name: '测试商品5',
|
|
|
+ price: '10',
|
|
|
+ goods_image: 'https://qcloud.dpfile.com/pc/JvY4fMzO0Km80S9Sn-tNxYin28jkvrNMJV-pUo8YwCctS4AHLKPXFhGyuI2dCwk8.jpg'
|
|
|
+ }]
|
|
|
+ },
|
|
|
+ {
|
|
|
+ type: 5,
|
|
|
+ name: '测试6',
|
|
|
+ list: [{
|
|
|
+ goods_id: 10,
|
|
|
+ goods_name: '测试商品6',
|
|
|
+ price: '10',
|
|
|
+ goods_image: 'https://qcloud.dpfile.com/pc/JvY4fMzO0Km80S9Sn-tNxYin28jkvrNMJV-pUo8YwCctS4AHLKPXFhGyuI2dCwk8.jpg'
|
|
|
+ }]
|
|
|
+ },
|
|
|
+ {
|
|
|
+ type: 6,
|
|
|
+ name: '测试7',
|
|
|
+ list: [{
|
|
|
+ goods_id: 11,
|
|
|
+ goods_name: '测试商品7',
|
|
|
+ price: '10',
|
|
|
+ goods_image: 'https://qcloud.dpfile.com/pc/JvY4fMzO0Km80S9Sn-tNxYin28jkvrNMJV-pUo8YwCctS4AHLKPXFhGyuI2dCwk8.jpg'
|
|
|
+ }]
|
|
|
+ },
|
|
|
+ {
|
|
|
+ type: 7,
|
|
|
+ name: '测试8',
|
|
|
+ list: [{
|
|
|
+ goods_id: 12,
|
|
|
+ goods_name: '测试商品8',
|
|
|
+ price: '10',
|
|
|
+ goods_image: 'https://qcloud.dpfile.com/pc/JvY4fMzO0Km80S9Sn-tNxYin28jkvrNMJV-pUo8YwCctS4AHLKPXFhGyuI2dCwk8.jpg'
|
|
|
+ }]
|
|
|
+ },
|
|
|
+ {
|
|
|
+ type: 8,
|
|
|
+ name: '测试9',
|
|
|
+ list: [{
|
|
|
+ goods_id: 13,
|
|
|
+ goods_name: '测试商品9',
|
|
|
+ price: '10',
|
|
|
+ goods_image: 'https://qcloud.dpfile.com/pc/JvY4fMzO0Km80S9Sn-tNxYin28jkvrNMJV-pUo8YwCctS4AHLKPXFhGyuI2dCwk8.jpg'
|
|
|
+ }]
|
|
|
+ },
|
|
|
+ ],
|
|
|
+ menuList: [],
|
|
|
+ cartData: {
|
|
|
+ total_price: 0,
|
|
|
+ total_num: 0,
|
|
|
+ total_goods_money: 0,
|
|
|
+ pack_price: 0,
|
|
|
+ must_category: 0,
|
|
|
+ is_place_order: 0,
|
|
|
+ err_msg: 0,
|
|
|
+ goods_list: [],
|
|
|
+ },
|
|
|
+ isAjax: false,
|
|
|
+ operate_id: '',
|
|
|
+ popData: {
|
|
|
+ goodsItem: {},
|
|
|
+ price: '0.00',
|
|
|
+ line_price: '',
|
|
|
+ num: 0,
|
|
|
+ goods_id: '',
|
|
|
+ is_quota: 0,
|
|
|
+ is_infinite: 0,
|
|
|
+ quota_num: 0,
|
|
|
+ payNum: 0,
|
|
|
+ stock: 0,
|
|
|
+ spec_key: '',
|
|
|
+ goods_spec_id: '',
|
|
|
+ spec_name: [],
|
|
|
+ spec_ids: [],
|
|
|
+ spec_list: [],
|
|
|
+ spec_attr: [],
|
|
|
+ },
|
|
|
+ selectedNum: 1,
|
|
|
+ selectedSpecification: [],
|
|
|
+ scrollType: true
|
|
|
+ }
|
|
|
+ },
|
|
|
+ watch: {},
|
|
|
+ mounted() {},
|
|
|
+ methods: {
|
|
|
+ setSpecNum(type) {
|
|
|
+ // this.popData.spec_ids
|
|
|
+ if (!this.popData.spec_key) {
|
|
|
+ console.log('被阻挡');
|
|
|
+ tools.error('请选择规格')
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ if (type === 1) {
|
|
|
+ // 减
|
|
|
+ console.log('减');
|
|
|
+ if (this.popData.num > 1) {
|
|
|
+ --this.popData.num;
|
|
|
+ this.$forceUpdate()
|
|
|
+ } else {
|
|
|
+ this.isAjax = false
|
|
|
+ }
|
|
|
+ } else {
|
|
|
+ console.log('加');
|
|
|
+ if (this.popData.is_infinite === 0 && this.popData.payNum > this.popData.stock) {
|
|
|
+ console.log('加1');
|
|
|
+ tools.error('商品库存' + this.popData.stock + '件')
|
|
|
+ } else if (this.popData.is_quota > 0 && this.popData.payNum > this.popData.quota_num) {
|
|
|
+ console.log('加2');
|
|
|
+ tools.error('限购' + this.popData.quota_num + '件')
|
|
|
+ } else {
|
|
|
+ // 加
|
|
|
+ console.log('加3');
|
|
|
+ ++this.popData.num;
|
|
|
+ this.$forceUpdate()
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ },
|
|
|
+ getShopGoodsSpec(item) {
|
|
|
+ console.log(item, this.cartData, 'item');
|
|
|
+ shopGoodsSpec({
|
|
|
+ 'goods_id': item.goods_id
|
|
|
+ }).then(res => {
|
|
|
+ console.log(item, 'item');
|
|
|
+ this.popData.goodsItem = item
|
|
|
+ if (this.popData.goods_id !== item.goods_id) {
|
|
|
+ this.popData.goods_id = item.goods_id
|
|
|
+ this.popData.spec_name = []
|
|
|
+ // this.popData.price = '0.00'
|
|
|
+ this.popData.price = item.price
|
|
|
+ this.popData.line_price = ''
|
|
|
+ this.popData.spec_key = ''
|
|
|
+ this.popData.num = 1
|
|
|
+ this.popData.spec_ids = []
|
|
|
+ console.log(this.popData, '走if');
|
|
|
+ this.$forceUpdate()
|
|
|
+ } else {
|
|
|
+ console.log(this.popData, '无');
|
|
|
+ this.popData.num = 1;
|
|
|
+ // this.popData.price = item.price
|
|
|
+ if (this.cartData.goods_list.length > 0) {
|
|
|
+ this.cartData.goods_list.forEach(item => {
|
|
|
+ if (item.goods_spec_id === this.popData.spec_key) {
|
|
|
+ // this.popData.num = this.selectedSpecification.goods_number
|
|
|
+ this.popData.num = this.popData.payNum
|
|
|
+ console.log(this.popData, '走else');
|
|
|
+ this.$forceUpdate()
|
|
|
+ }
|
|
|
+ })
|
|
|
+ }
|
|
|
+ }
|
|
|
+ this.popData.spec_list = res.data
|
|
|
+ this.popData.spec_attr = res.data
|
|
|
+ console.log(this.selectedSpecification, 'this.selectedSpecification');
|
|
|
+ this.selectedSpecification.forEach((v, k) => {
|
|
|
+ if (v.goods_id === item.goods_id) {
|
|
|
+ v.goodsItem = item
|
|
|
+ v.spec_list = res.data
|
|
|
+ v.spec_attr = res.data
|
|
|
+ v.num = v.goods_number
|
|
|
+ let data = JSON.parse(JSON.stringify(v))
|
|
|
+ this.popData = data
|
|
|
+ }
|
|
|
+ })
|
|
|
+ console.log(this.popData, 'this.popData');
|
|
|
+ this.$refs.popupGG.open();
|
|
|
+ this.setGoodsSpecPrice()
|
|
|
+ this.isAjax = false
|
|
|
+ }).catch(() => {
|
|
|
+ tools.error('规格信息异常')
|
|
|
+ this.isAjax = false
|
|
|
+ })
|
|
|
+ },
|
|
|
+ setGoodsSpecPrice() {
|
|
|
+ console.log(this.popData.spec_ids)
|
|
|
+ if (this.popData.spec_ids.length > 0) {
|
|
|
+ let spec_ids = JSON.parse(JSON.stringify(this.popData.spec_ids))
|
|
|
+ spec_ids.sort((a, b) => a - b);
|
|
|
+ let spec_key = spec_ids.join('_')
|
|
|
+ this.popData.spec_key = spec_key
|
|
|
+ } else {
|
|
|
+ this.popData.num = 1
|
|
|
+ this.popData.goods_spec_id = ''
|
|
|
+ }
|
|
|
+ },
|
|
|
+ setShopIngList(cartData) {
|
|
|
+ this.cartData = cartData
|
|
|
+ this.selectedSpecification = []
|
|
|
+ this.setGoodsNum()
|
|
|
+ },
|
|
|
+ getShopIngList(isStart) {
|
|
|
+ getShopIngList({
|
|
|
+ 'shop_id': this.shop_id,
|
|
|
+ }).then(res => {
|
|
|
+ if (res.code === 1) {
|
|
|
+ this.cartData = res.data
|
|
|
+ let data = res.data
|
|
|
+ data.goods_list.forEach((v, k) => {
|
|
|
+ let ge = JSON.parse(JSON.stringify(v))
|
|
|
+ ge.spec_ids = ge.goods_spec_id.split('_').map(item => Number(item.trim()))
|
|
|
+ ge.spec_name = ge.goods_attr.split(',').map(item => item.trim())
|
|
|
+ this.selectedSpecification.push(ge)
|
|
|
+ })
|
|
|
+ console.log(this.selectedSpecification, '初始回显已选数据');
|
|
|
+ this.$emit('setCartData', this.cartData)
|
|
|
+ this.setGoodsNum()
|
|
|
+ }
|
|
|
+ })
|
|
|
+ },
|
|
|
+ setGoodsNum() {
|
|
|
+ if (this.cartData.goods_list.length > 0) {
|
|
|
+ let goodsIds = []
|
|
|
+ this.categoryData.forEach(categoryItem => {
|
|
|
+ categoryItem.list.forEach(goodsItem => {
|
|
|
+ goodsItem.num = 0
|
|
|
+ this.cartData.goods_list.forEach(item => {
|
|
|
+ if (item.goods_id === goodsItem.goods_id) {
|
|
|
+ if (goodsIds.indexOf(item.goods_id) < 0) {
|
|
|
+ goodsIds.push(item.goods_id)
|
|
|
+ goodsItem.num = item.goods_number * 1
|
|
|
+ } else {
|
|
|
+ goodsItem.num += item.goods_number * 1
|
|
|
+ }
|
|
|
+ }
|
|
|
+ })
|
|
|
+ })
|
|
|
+ })
|
|
|
+ } else {
|
|
|
+ //购物车数据清除
|
|
|
+ this.categoryData.forEach(categoryItem => {
|
|
|
+ categoryItem.list.forEach(goodsItem => {
|
|
|
+ goodsItem.num = 0
|
|
|
+ })
|
|
|
+ })
|
|
|
+ }
|
|
|
+ },
|
|
|
+ getShopGoods() {
|
|
|
+ if (this.shop_id < 0 || !this.operate_id) {
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ shopGoods({
|
|
|
+ 'shop_id': this.shop_id,
|
|
|
+ operate_id: this.operate_id,
|
|
|
+ }).then(res => {
|
|
|
+ if (res.code === 1) {
|
|
|
+ this.categoryData = res.data
|
|
|
+ const category_id = uni.getStorageSync('category_id')
|
|
|
+ const goods_id = uni.getStorageSync('goods_id')
|
|
|
+ if (category_id.type && category_id.type != 'undefined') {
|
|
|
+ this.selectType(category_id, goods_id)
|
|
|
+ } else {
|
|
|
+ this.selectType(this.categoryData[0])
|
|
|
+ }
|
|
|
+ this.categoryData.forEach(categoryItem => {
|
|
|
+ categoryItem.list.forEach(goodsItem => {
|
|
|
+ goodsItem.payNum = 0
|
|
|
+ goodsItem.spec = []
|
|
|
+ })
|
|
|
+ })
|
|
|
+ setTimeout(() => {
|
|
|
+ this.setGoodsNum()
|
|
|
+ }, 1000)
|
|
|
+ }
|
|
|
+ })
|
|
|
+ },
|
|
|
+ selectType(item, itemTwo) {
|
|
|
+ if (this.type != item.type) {
|
|
|
+ this.type = item.type;
|
|
|
+ this.idMark = 'scroll' + item.type
|
|
|
+
|
|
|
+ // 触发事件通知父组件需要滚动
|
|
|
+ this.$emit('scrollToCategory', {
|
|
|
+ type: item.type,
|
|
|
+ selector: `#scroll${item.type}`
|
|
|
+ });
|
|
|
+
|
|
|
+ this.$forceUpdate()
|
|
|
+ }
|
|
|
+ },
|
|
|
+ menuScroll(e) {
|
|
|
+ let _this = this;
|
|
|
+ let query = uni.createSelectorQuery().in(this);
|
|
|
+ const goods_id = uni.getStorageSync('goods_id')
|
|
|
+ if (goods_id.goodsId && goods_id.goodsId != 'undefined') {
|
|
|
+ query.selectAll(".menu-list").boundingClientRect(data => {
|
|
|
+ data.forEach((v) => {
|
|
|
+ if (data[this.categoryData.length - 1].top <= 392) {
|
|
|
+ return
|
|
|
+ }
|
|
|
+ if (v.top < 332 && v.top > 0) {
|
|
|
+ // _this.idMark = v.id;
|
|
|
+ let arr = v.id.split('scroll');
|
|
|
+ }
|
|
|
+ })
|
|
|
+ uni.setStorageSync('category_id', '')
|
|
|
+ uni.setStorageSync('goods_id', '')
|
|
|
+ }).exec();
|
|
|
+ } else {
|
|
|
+ query.selectAll(".menu-box-only").boundingClientRect(data => {
|
|
|
+ data.forEach((v) => {
|
|
|
+ if (data[this.categoryData.length - 1].top <= 392) {
|
|
|
+ return
|
|
|
+ }
|
|
|
+ if (v.top < 332 && v.top > 0) {
|
|
|
+ // _this.idMark = v.id;
|
|
|
+ let arr = v.id.split('scroll');
|
|
|
+ _this.type = Number(arr[1]);
|
|
|
+ }
|
|
|
+ this.$forceUpdate()
|
|
|
+ })
|
|
|
+ }).exec();
|
|
|
+ }
|
|
|
+ },
|
|
|
+ addred(type, i, k, item) {
|
|
|
+ if (this.isAjax) {
|
|
|
+ return
|
|
|
+ }
|
|
|
+ this.isAjax = true
|
|
|
+ if (type === 1) {
|
|
|
+ // 减
|
|
|
+ --item.num;
|
|
|
+ if (item.num >= 0) {
|
|
|
+ this.addShoppingSave(item, item.num, type)
|
|
|
+ } else {
|
|
|
+ this.isAjax = false
|
|
|
+ }
|
|
|
+ } else if (type === 2) {
|
|
|
+ // 加
|
|
|
+ ++item.num;
|
|
|
+ if (item.is_infinite === 0 && item.num > item.stock) {
|
|
|
+ tools.error('商品库存' + item.stock + '件')
|
|
|
+ --item.num
|
|
|
+ this.isAjax = false
|
|
|
+ } else if (item.is_quota > 0 && item.num > item.quota_num) {
|
|
|
+ tools.error('限购' + item.quota_num + '件')
|
|
|
+ --item.num
|
|
|
+ this.isAjax = false
|
|
|
+ } else {
|
|
|
+ this.addShoppingSave(item, item.num, type)
|
|
|
+ }
|
|
|
+
|
|
|
+ } else if (type === 3) {
|
|
|
+ // 选规格
|
|
|
+ console.log(item, '000000000')
|
|
|
+ console.log(this.selectedSpecification, '1111111111111');
|
|
|
+ this.selectedSpecification.forEach((v, k) => {
|
|
|
+ if (v.goods_id === item.goods_id) {
|
|
|
+ v.quota_num = item.quota_num
|
|
|
+ v.payNum = item.num
|
|
|
+ v.stock = item.stock
|
|
|
+ }
|
|
|
+ })
|
|
|
+ this.popData.is_quota = item.is_quota
|
|
|
+ this.popData.quota_num = item.quota_num
|
|
|
+ this.popData.is_infinite = item.is_infinite
|
|
|
+ this.popData.payNum = item.num
|
|
|
+ this.popData.stock = item.stock
|
|
|
+ this.getShopGoodsSpec(item)
|
|
|
+ } else {
|
|
|
+ let data = JSON.parse(JSON.stringify(this.popData))
|
|
|
+ this.selectedSpecification.push(data)
|
|
|
+ console.log(this.popData, "666666666666666666")
|
|
|
+ console.log('1', this.popData.goods_id, this.shop_id, this.popData.goodsItem.category_id, this.popData
|
|
|
+ .spec_key, this.popData.num);
|
|
|
+ this.setShoppingSave()
|
|
|
+ this.isAjax = false
|
|
|
+ }
|
|
|
+ },
|
|
|
+ addShoppingSave(item, num, type) {
|
|
|
+ shoppingSave({
|
|
|
+ type: 1,
|
|
|
+ goods_id: item.goods_id,
|
|
|
+ shop_id: this.shop_id,
|
|
|
+ category_id: item.category_id,
|
|
|
+ goods_spec_id: '',
|
|
|
+ number: num
|
|
|
+ }).then((res) => {
|
|
|
+ if (res.code === 1) {
|
|
|
+ if (type === 1) {
|
|
|
+ tools.success('操作成功')
|
|
|
+ } else {
|
|
|
+ tools.success(res.msg)
|
|
|
+ }
|
|
|
+ this.isAjax = false
|
|
|
+ this.getShopIngList()
|
|
|
+ } else {
|
|
|
+ this.isAjax = false
|
|
|
+ tools.error(res.msg)
|
|
|
+ }
|
|
|
+ })
|
|
|
+ },
|
|
|
+ gbPop() {
|
|
|
+ this.$refs.popupGG.close();
|
|
|
+ },
|
|
|
+ setSub(item, type) {
|
|
|
+ let cartKey = this.cartData.goods_list.findIndex(row => row.goods_id === item.goods_id)
|
|
|
+ if (type === 2 && cartKey < 0) {
|
|
|
+ this.setShopIngAdd(item.goods_id, item.category_id, '', 1, item)
|
|
|
+ } else {
|
|
|
+ this.setShopIngNumber(item.goods_id, item.category_id, type, '', 1, item)
|
|
|
+ }
|
|
|
+ },
|
|
|
+ setShoppingSave() {
|
|
|
+ shoppingSave({
|
|
|
+ type: 1,
|
|
|
+ goods_id: this.popData.goods_id,
|
|
|
+ shop_id: this.shop_id,
|
|
|
+ category_id: this.popData.goodsItem.category_id,
|
|
|
+ goods_spec_id: this.popData.spec_key,
|
|
|
+ number: this.popData.num
|
|
|
+ }).then((res) => {
|
|
|
+ if (res.code === 1) {
|
|
|
+ tools.success(res.msg)
|
|
|
+ this.$refs.popupGG.close();
|
|
|
+ this.getShopIngList()
|
|
|
+ } else {
|
|
|
+ tools.error(res.msg)
|
|
|
+ }
|
|
|
+ })
|
|
|
+ },
|
|
|
+ setShopIngAdd(goodsId, categoryId, goodsSpecId, number, item) {
|
|
|
+ setShopIngAdd({
|
|
|
+ 'type': 1,
|
|
|
+ 'goods_id': goodsId,
|
|
|
+ 'shop_id': this.shop_id,
|
|
|
+ 'category_id': categoryId,
|
|
|
+ 'goods_spec_id': goodsSpecId,
|
|
|
+ 'number': number,
|
|
|
+ }).then(res => {
|
|
|
+ this.isAjax = false
|
|
|
+ if (res.code === 1) {
|
|
|
+ if (item) {
|
|
|
+ ++item.num;
|
|
|
+ }
|
|
|
+ this.getShopIngList()
|
|
|
+ } else if (res.code === 2) {
|
|
|
+ tools.error(res.msg)
|
|
|
+ if (item) {
|
|
|
+ ++item.num;
|
|
|
+ }
|
|
|
+ this.getShopIngList()
|
|
|
+ } else {
|
|
|
+ tools.error(res.msg)
|
|
|
+ }
|
|
|
+
|
|
|
+ }).catch(() => {
|
|
|
+ this.isAjax = false
|
|
|
+ })
|
|
|
+ },
|
|
|
+ setShopIngNumber(goodsId, categoryId, operation, goodsSpecId, number, item) {
|
|
|
+ setShopIngNumber({
|
|
|
+ 'type': 1,
|
|
|
+ 'goods_id': goodsId,
|
|
|
+ 'shop_id': this.shop_id,
|
|
|
+ 'category_id': categoryId,
|
|
|
+ 'goods_spec_id': goodsSpecId,
|
|
|
+ 'number': number,
|
|
|
+ 'operation': operation === 2 ? 1 : 2,
|
|
|
+ }).then(res => {
|
|
|
+ this.isAjax = false
|
|
|
+ if (res.code === 1) {
|
|
|
+ if (item) {
|
|
|
+ if (operation === 2) {
|
|
|
+ ++item.num;
|
|
|
+ } else {
|
|
|
+ --item.num;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ this.getShopIngList()
|
|
|
+ } else if (res.code === 2) {
|
|
|
+ tools.error(res.msg)
|
|
|
+ if (item) {
|
|
|
+ if (operation === 2) {
|
|
|
+ ++item.num;
|
|
|
+ } else {
|
|
|
+ --item.num;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ this.getShopIngList()
|
|
|
+ } else {
|
|
|
+ tools.error(res.msg)
|
|
|
+ }
|
|
|
+
|
|
|
+ }).catch(() => {
|
|
|
+ this.isAjax = false
|
|
|
+ })
|
|
|
+ },
|
|
|
+
|
|
|
+ setShopIngDel() {},
|
|
|
+ // -------弹窗选择规格-----------
|
|
|
+ selectSpec(info, groupKey) {
|
|
|
+ let specKey = this.popData.spec_ids.indexOf(info.spec_id)
|
|
|
+ if (specKey >= 0) {
|
|
|
+ this.popData.spec_ids.splice(specKey, 1)
|
|
|
+ this.popData.spec_name.splice(specKey, 1)
|
|
|
+ if (Number(info.spec_price) > 0) {
|
|
|
+ this.popData.price = Number(this.popData.price) - Number(info.spec_price)
|
|
|
+ }
|
|
|
+ } else {
|
|
|
+ this.popData.spec_ids.push(info.spec_id)
|
|
|
+ this.popData.spec_name.push(info.spec_name)
|
|
|
+ if (Number(info.spec_price) > 0) {
|
|
|
+ this.popData.price = Number(this.popData.price) + Number(info.spec_price)
|
|
|
+ }
|
|
|
+ for (const attrKey in this.popData.spec_attr[groupKey].spec_list) {
|
|
|
+ if (this.popData.spec_attr[groupKey].spec_list[attrKey].spec_id !== info.spec_id) {
|
|
|
+ let oldKey = this.popData.spec_ids.indexOf(this.popData.spec_attr[groupKey].spec_list[attrKey]
|
|
|
+ .spec_id)
|
|
|
+ if (oldKey >= 0) {
|
|
|
+ this.popData.spec_ids.splice(oldKey, 1)
|
|
|
+ this.popData.spec_name.splice(oldKey, 1)
|
|
|
+ this.popData.price = Number(this.popData.price) - Number(this.popData.spec_attr[groupKey]
|
|
|
+ .spec_list[attrKey].spec_price)
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ // this.spec_ids = this.popData.spec_list.join('_')
|
|
|
+ this.setGoodsSpecPrice()
|
|
|
+ },
|
|
|
+ },
|
|
|
+ }
|
|
|
+</script>
|
|
|
+
|
|
|
+<style scoped lang="scss">
|
|
|
+ .sticky-nav {
|
|
|
+ width: 100%;
|
|
|
+ position: sticky;
|
|
|
+ z-index: 3;
|
|
|
+ }
|
|
|
+
|
|
|
+ .wh-44 {
|
|
|
+ width: 44rpx;
|
|
|
+ height: 44rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .menu-box-left-f {
|
|
|
+ position: sticky;
|
|
|
+ // transition: all .3s ease;
|
|
|
+ // overflow: auto;
|
|
|
+ }
|
|
|
+
|
|
|
+ .menu-box-left {
|
|
|
+ width: 160rpx;
|
|
|
+ height: auto;
|
|
|
+ position: sticky;
|
|
|
+ overflow: auto;
|
|
|
+ // transition: all .3s ease;
|
|
|
+ // height: 100%;
|
|
|
+ // background-color: #F7F8FA;
|
|
|
+ // position: absolute;
|
|
|
+ // left: 0;
|
|
|
+ // top: 0;
|
|
|
+ // border-radius: 0rpx 20rpx 0 0rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .menu-box-left-box {
|
|
|
+ overflow-y: auto;
|
|
|
+ }
|
|
|
+
|
|
|
+ .menu-type-list {
|
|
|
+ width: 160rpx;
|
|
|
+ min-height: 108rpx;
|
|
|
+ padding: 18rpx 28rpx;
|
|
|
+ position: relative;
|
|
|
+ z-index: 10;
|
|
|
+
|
|
|
+ .menu-type-num {
|
|
|
+ position: absolute;
|
|
|
+ top: 2rpx;
|
|
|
+ right: 8rpx;
|
|
|
+ padding: 0 6rpx;
|
|
|
+ min-width: 20rpx;
|
|
|
+ height: 32rpx;
|
|
|
+ text-align: center;
|
|
|
+ line-height: 32rpx;
|
|
|
+ background: #FB3D03;
|
|
|
+ border-radius: 50%;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .menu-type-list-f {
|
|
|
+ // width: 160rpx;
|
|
|
+ background-color: #007AFF;
|
|
|
+
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
+ overflow-y: auto;
|
|
|
+ /* 如果分类项很多，允许内部滚动 */
|
|
|
+ -webkit-overflow-scrolling: touch;
|
|
|
+ /* 改善移动端滚动体验 */
|
|
|
+ // height: 100%;
|
|
|
+ }
|
|
|
+
|
|
|
+ .menu-box-only {
|
|
|
+ // flex: 1;
|
|
|
+ width: calc(100% - 160rpx);
|
|
|
+ }
|
|
|
+
|
|
|
+ .menu-box-right {
|
|
|
+ // flex: 1;
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
+ // padding: 16rpx 0;
|
|
|
+ // box-sizing: border-box;
|
|
|
+ // position: relative;
|
|
|
+ }
|
|
|
+
|
|
|
+ .menu-list {
|
|
|
+ width: 100%;
|
|
|
+ padding: 0 20rpx 40rpx;
|
|
|
+ // height: 200rpx;
|
|
|
+ // margin-bottom: 40rpx;
|
|
|
+
|
|
|
+ .goods_img {
|
|
|
+ width: 200rpx;
|
|
|
+ height: 200rpx;
|
|
|
+ border-radius: 12rpx;
|
|
|
+ margin-right: 16rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .menu-list-right {
|
|
|
+ flex: 1;
|
|
|
+
|
|
|
+ .right-only-right {
|
|
|
+ width: 100rpx;
|
|
|
+ height: 44rpx;
|
|
|
+ background: linear-gradient(117deg, #57CAFF 0%, #41ABF5 100%);
|
|
|
+ border-radius: 12rpx;
|
|
|
+ line-height: 44rpx;
|
|
|
+ position: relative;
|
|
|
+
|
|
|
+ .selectedNum {
|
|
|
+ position: absolute;
|
|
|
+ right: 2rpx;
|
|
|
+ top: -22rpx;
|
|
|
+ font-size: 24rpx;
|
|
|
+ color: #fff;
|
|
|
+ width: 32rpx;
|
|
|
+ height: 32rpx;
|
|
|
+ line-height: 32rpx;
|
|
|
+ background: #FB3D03;
|
|
|
+ border-radius: 50%;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .right-only-right-red {
|
|
|
+ width: 44rpx;
|
|
|
+ height: 44rpx;
|
|
|
+ line-height: 40rpx;
|
|
|
+ border-radius: 12rpx;
|
|
|
+ border: 1rpx solid #41ABF5;
|
|
|
+ color: #41ABF5;
|
|
|
+ }
|
|
|
+
|
|
|
+ .right-only-right-add {
|
|
|
+ width: 44rpx;
|
|
|
+ height: 44rpx;
|
|
|
+ line-height: 40rpx;
|
|
|
+ background: linear-gradient(117deg, #57CAFF 0%, #41ABF5 100%);
|
|
|
+ border-radius: 12rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .right-only-right-2 {
|
|
|
+ min-width: 50rpx;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .menu-box {
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
+ // padding-bottom: 140rpx;
|
|
|
+
|
|
|
+ .gg-box {
|
|
|
+ width: 750rpx;
|
|
|
+ height: 1208rpx;
|
|
|
+ background: #FFFFFF;
|
|
|
+ border-radius: 24rpx 24rpx 0rpx 0rpx;
|
|
|
+
|
|
|
+ .goods-info {
|
|
|
+ border-bottom: 1rpx solid #EEEEEE;
|
|
|
+
|
|
|
+ image {
|
|
|
+ width: 170rpx;
|
|
|
+ height: 160rpx;
|
|
|
+ border-radius: 8rpx;
|
|
|
+ margin-right: 22rpx;
|
|
|
+ margin-bottom: 32rpx;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .pop-buttom {
|
|
|
+ width: 100%;
|
|
|
+ // height: 250rpx;
|
|
|
+ box-shadow: 0rpx 0rpx 20rpx 0rpx rgba(51, 51, 51, 0.1);
|
|
|
+
|
|
|
+ .pop-buttom-left {
|
|
|
+ padding-top: 12rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .pop-buttom-2 {
|
|
|
+ width: 100%;
|
|
|
+ height: 96rpx;
|
|
|
+ line-height: 96rpx;
|
|
|
+ background: #41ABF5;
|
|
|
+ border-radius: 200rpx
|
|
|
+ }
|
|
|
+
|
|
|
+ .right-only-right-red {
|
|
|
+ width: 44rpx;
|
|
|
+ height: 44rpx;
|
|
|
+ line-height: 40rpx;
|
|
|
+ border-radius: 12rpx;
|
|
|
+ border: 1rpx solid #41ABF5;
|
|
|
+ color: #41ABF5;
|
|
|
+ }
|
|
|
+
|
|
|
+ .right-only-right-add {
|
|
|
+ width: 44rpx;
|
|
|
+ height: 44rpx;
|
|
|
+ line-height: 40rpx;
|
|
|
+ background: linear-gradient(117deg, #57CAFF 0%, #41ABF5 100%);
|
|
|
+ border-radius: 12rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .right-only-right-2 {
|
|
|
+ min-width: 50rpx;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .w-m {
|
|
|
+ width: calc(100% + 30rpx);
|
|
|
+ }
|
|
|
+
|
|
|
+ .spec-item {
|
|
|
+ min-width: 210rpx;
|
|
|
+ height: 66rpx;
|
|
|
+ line-height: 66rpx;
|
|
|
+ box-sizing: border-box;
|
|
|
+ border-radius: 12rpx;
|
|
|
+ margin: 0 26rpx 26rpx 0;
|
|
|
+ padding: 0 10rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ // .spec-item:nth-child(3) {
|
|
|
+ // margin-right: 0rpx !important;
|
|
|
+ // }
|
|
|
+
|
|
|
+ .s-item {
|
|
|
+ background-color: #ECF7FE;
|
|
|
+ border: 2rpx solid #41ABF5;
|
|
|
+ color: #41ABF5;
|
|
|
+ }
|
|
|
+
|
|
|
+ .n-item {
|
|
|
+ border: 2rpx solid #EEEEEE;
|
|
|
+ color: #000;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .goods-name {
|
|
|
+ max-width: 310rpx;
|
|
|
+ }
|
|
|
+</style>
|
