修改页面
This commit is contained in:
@ -84,6 +84,7 @@
|
||||
</view>
|
||||
<view class="u-m-l-64 flex1">
|
||||
<u-button hover-class="none"
|
||||
@click="onSubmitOrder"
|
||||
:customStyle="{height: '92rpx', backgroundColor: themeColor, color: '#fff', border: 'none', paddingTop: '8rpx'}"
|
||||
:hair-line="false"
|
||||
shape="circle">
|
||||
@ -103,10 +104,12 @@
|
||||
pay: {
|
||||
weixin: 0,
|
||||
alipay: 0
|
||||
}
|
||||
},
|
||||
showLoading: false, // Loading: 显示 | 隐藏
|
||||
}
|
||||
},
|
||||
onLoad() {
|
||||
onLoad(options) {
|
||||
console.log("this.$>>>", this.$store.state.goods.buyGoods);
|
||||
//#ifdef MP-WEIXIN
|
||||
this.pay.weixin = 1
|
||||
//#endif
|
||||
@ -118,7 +121,70 @@
|
||||
methods: {
|
||||
appointmentTime() {
|
||||
this.timePopup = true
|
||||
}
|
||||
},
|
||||
|
||||
// 点击订单提交
|
||||
onSubmitOrder() {
|
||||
uni.showModal({
|
||||
title: '温馨提示',
|
||||
content: '是否确认下单?',
|
||||
confirmColor: '#FF2C3C',
|
||||
success: ({ confirm }) => {
|
||||
if (!confirm) return
|
||||
|
||||
this.handleOrderMethods('submit')
|
||||
|
||||
}
|
||||
})
|
||||
},
|
||||
|
||||
// 订单处理
|
||||
// handleOrderMethods(action) {
|
||||
// // 订单提交数据
|
||||
// const orderFrom = {
|
||||
// action,
|
||||
// goods: this.goods,
|
||||
// delivery_type: this.delivery,
|
||||
// use_integral: this.useIntegral,
|
||||
// address_id: this.addressId,
|
||||
// coupon_id: this.couponId,
|
||||
// bargain_launch_id: this.bargainLaunchId == -1 ? '' : this.bargainLaunchId
|
||||
// }
|
||||
|
||||
// switch (action) {
|
||||
// case 'info':
|
||||
// this.initPageData(orderFrom)
|
||||
// break
|
||||
// case 'submit':
|
||||
// this.handleOrderSubmit(orderFrom)
|
||||
// break
|
||||
// }
|
||||
// },
|
||||
|
||||
// // 订单提交
|
||||
// async handleOrderSubmit(from) {
|
||||
// this.showLoading = true
|
||||
|
||||
// from.remark = this.userRemark
|
||||
// from.type = this.type
|
||||
|
||||
// try {
|
||||
// const { code, data, msg } = this.teamId ? await teamBuy(from) : await orderBuy(from)
|
||||
|
||||
// if (code == 1) {
|
||||
// uni.redirectTo({
|
||||
// url: `/pages/payment/payment?from=${data.type}&order_id=${data.order_id}`
|
||||
// })
|
||||
// } else {
|
||||
// throw new Error(msg)
|
||||
// }
|
||||
// } catch (err) {
|
||||
// console.log(err)
|
||||
// // this.$toast({ title: '下单异常,请重新操作' })
|
||||
// } finally {
|
||||
// this.showLoading = false
|
||||
// }
|
||||
// },
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
@ -28,29 +28,41 @@
|
||||
<view v-show="!showHistory" class="content">
|
||||
<mescroll-body ref="mescroll" @init="mescrollInit" @down="downCallback" :up="upOption" :down="downOption" @up="upCallback">
|
||||
<view v-for="(item, index) in goodsList" :key="index">
|
||||
<view class="bg-white row u-m-b-20 u-p-20">
|
||||
<view class="">
|
||||
<u-image :src="item.image" width="136" height="136" border-radius="16"></u-image>
|
||||
</view>
|
||||
<view class="u-m-l-16 w-full row-start u-row-between">
|
||||
<view>
|
||||
<view class="u-line-2 u-p-t-10">{{item.name}}</view>
|
||||
<view class="u-p-t-20 row-between">
|
||||
<view class="row">
|
||||
<view class="primary">
|
||||
<price-format :price="item.price" :subscriptSize="22" :firstSize="34" :secondSize="26"></price-format>
|
||||
</view>
|
||||
<view class="u-m-l-8">
|
||||
<price-format :price="item.market_price" :lineThrough="true" color="#C0C0C0" :subscriptSize="22" :firstSize="22" :secondSize="22"></price-format>
|
||||
<navigator :url="`/pages/shop/shop?id=${item.id}`" hover-class="none" class="bg-white row u-m-b-20 u-p-20">
|
||||
<!-- <view class="bg-white row u-m-b-20 u-p-20"> -->
|
||||
<view class="">
|
||||
<u-image :src="item.image" width="136" height="136" border-radius="16"></u-image>
|
||||
</view>
|
||||
<view class="u-m-l-16 w-full row-start u-row-between">
|
||||
<view>
|
||||
<view class="u-line-2 u-p-t-10">{{item.name}}</view>
|
||||
<view class="u-p-t-20 row-between">
|
||||
<view class="row">
|
||||
<view class="primary">
|
||||
<price-format :price="item.price" :subscriptSize="22" :firstSize="34" :secondSize="26"></price-format>
|
||||
</view>
|
||||
<view class="u-m-l-8">
|
||||
<price-format :price="item.market_price" :lineThrough="true" color="#C0C0C0" :subscriptSize="22" :firstSize="22" :secondSize="22"></price-format>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="column-end">
|
||||
<view @click.stop="addCartFun(item)">
|
||||
<u-icon name="plus-circle-fill" color="#254062" size="48"></u-icon>
|
||||
</view>
|
||||
<!-- <u-button
|
||||
@click.stop="openSpec(item)"
|
||||
hover-class="none"
|
||||
:customStyle="{width: '116rpx', height: '46rpx', lineHeight: '46rpx', fontSize: '24rpx', backgroundColor: themeColor, color: '#fff', border: 'none', paddingTop: '8rpx'}"
|
||||
:hair-line="false"
|
||||
shape="circle">
|
||||
选规格
|
||||
</u-button> -->
|
||||
</view>
|
||||
</view>
|
||||
<view class="column-end" @click.stop="count++">
|
||||
<u-icon name="plus-circle-fill" color="#254062" size="48"></u-icon>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<!-- </view> -->
|
||||
</navigator>
|
||||
</view>
|
||||
</mescroll-body>
|
||||
|
||||
@ -101,7 +113,8 @@
|
||||
</view>
|
||||
</view>
|
||||
</u-popup>
|
||||
<shop-spec v-model="showSpec" @close="showSpec = false"></shop-spec>
|
||||
|
||||
<shop-spec v-model="showSpec" :name="goodsName" :spec="goodsSpec" @close="showSpec = false" @confirm="confirmSpec"></shop-spec>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
@ -109,7 +122,8 @@
|
||||
import {
|
||||
getGoodsSearch,
|
||||
getSearchpage,
|
||||
clearSearch
|
||||
clearSearch,
|
||||
addCart,
|
||||
} from '@/api/store'
|
||||
import {
|
||||
trottle,
|
||||
@ -150,7 +164,9 @@
|
||||
numberVal: 1,
|
||||
showCart: false,
|
||||
showSpec: false,
|
||||
count: 0
|
||||
count: 0,
|
||||
goodsName: '',
|
||||
goodsSpec: [],
|
||||
};
|
||||
},
|
||||
onLoad(options) {
|
||||
@ -248,6 +264,35 @@
|
||||
this.keyword = item
|
||||
this.showHistory = false
|
||||
this.onRefresh();
|
||||
},
|
||||
|
||||
// 打开弹框
|
||||
openSpec(item) {
|
||||
console.log("123>>>", 123);
|
||||
|
||||
this.showSpec = true
|
||||
this.goodsName = item.name
|
||||
this.goodsSpec = item.goods_spec
|
||||
},
|
||||
|
||||
// 确认选择的商品规格
|
||||
confirmSpec() {
|
||||
|
||||
},
|
||||
|
||||
// 选择商品
|
||||
async addCartFun(item) {
|
||||
const {
|
||||
code,
|
||||
data,
|
||||
msg
|
||||
} = await addCart({
|
||||
item_id: item.id,
|
||||
goods_num: 1
|
||||
});
|
||||
if (code == 1) {
|
||||
this.getCartListFun()
|
||||
}
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
|
||||
@ -35,7 +35,7 @@
|
||||
<text class="text-999 ml20">随时退 过期自动退</text>
|
||||
</view>
|
||||
<view>
|
||||
<u-button @click="showSpec = true" hover-class="none"
|
||||
<u-button @click="openSpec" hover-class="none"
|
||||
:customStyle="{width: '116rpx', height: '46rpx', lineHeight: '46rpx', fontSize: '24rpx', backgroundColor: themeColor, color: '#fff', border: 'none', paddingTop: '8rpx'}"
|
||||
:hair-line="false"
|
||||
shape="circle">
|
||||
@ -48,20 +48,20 @@
|
||||
|
||||
<view class="u-m-t-24">
|
||||
<view class="u-m-l-48 nr">详情</view>
|
||||
<view class="bg-white mx24 px24 u-m-t-24 u-padding-top-20 u-padding-bottom-20 br24">
|
||||
<view class="bg-white mx24 px24 u-m-t-24 u-p-t-20 u-p-b-20 br24">
|
||||
<u-image :src="cloudPath + 'img/banner.png'" height="600"></u-image>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="u-m-t-24">
|
||||
<view class="u-m-l-48 nr">购买须知</view>
|
||||
<view class="bg-white mx24 px24 u-m-t-24 u-padding-top-20 u-padding-bottom-20 br24">
|
||||
<view class="bg-white mx24 px24 u-m-t-24 u-p-t-20 u-p-b-20 br24">
|
||||
这里是购买须知的内容
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="fixed bg-white row-between px48 u-padding-top-20 u-padding-bottom-20">
|
||||
<view class="fixed bg-white row-between px48 u-p-t-20 u-p-b-20">
|
||||
<view class="column u-text-center">
|
||||
<view class="row-center">
|
||||
<u-image :src="cloudPath + 'img/icon_store.png'" width="48" height="48"></u-image>
|
||||
@ -78,7 +78,7 @@
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<shop-spec v-model="showSpec" :spec="goods.goods_spec" @close="showSpec = false" @confirm="confirmSpec"></shop-spec>
|
||||
<shop-spec v-model="showSpec" :name="goods.name" :spec="goods.goods_spec" @close="showSpec = false" @confirm="confirmSpec"></shop-spec>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
@ -127,6 +127,11 @@
|
||||
}
|
||||
},
|
||||
|
||||
// 打开商品规格
|
||||
openSpec() {
|
||||
this.showSpec = true
|
||||
},
|
||||
|
||||
// 获取选择的商品规格
|
||||
confirmSpec(data) {
|
||||
console.log("data>>>", data.spec);
|
||||
@ -144,7 +149,7 @@
|
||||
spec: this.spec // 选中的商品规格
|
||||
});
|
||||
|
||||
console.log("this.$>>>", this.$store.state.goods.buyGoods);
|
||||
// console.log("this.$>>>", this.$store.state.goods.buyGoods);
|
||||
|
||||
uni.navigateTo({
|
||||
url: `/pages/order_now/order_now`
|
||||
|
||||
@ -1,18 +1,20 @@
|
||||
<template>
|
||||
<view class="shop-cart">
|
||||
<view class="u-m-32">
|
||||
<view class="u-text-right nr" @click="isEdit = !isEdit">编辑</view>
|
||||
<view class="u-m-t-40" v-for="(item, index) in 10" :key="10">
|
||||
<view class="u-text-right nr" v-if="cartLists.length > 0" @click="isEdit = !isEdit">{{ !isEdit ? '编辑' : '完成' }}</view>
|
||||
<view class="u-m-t-40" v-for="(item, index) in cartLists" :key="index">
|
||||
<view class="bg-white br16 u-p-24 row">
|
||||
<view>
|
||||
<u-checkbox shape="circle" :active-color="themeColor"></u-checkbox>
|
||||
<view class="select checkbox">
|
||||
<checkbox type="circle" class="checkbox" :value="item.cart_id + ''" :checked="item.selected == 1" @click="changOneSelect(item.cart_id, item.selected)"></checkbox>
|
||||
</view>
|
||||
<view class="row flex1 u-col-top">
|
||||
<view>
|
||||
<u-image :src="cloudPath + 'img/banner.png'" width="160" height="160" border-radius="8"></u-image>
|
||||
<u-image :src="item.img" width="160" height="160" border-radius="8"></u-image>
|
||||
</view>
|
||||
<view class="u-m-l-16">
|
||||
<view>煎饼果子套餐</view>
|
||||
<navigator :url="`/pages/shop/shop?id=${item.goods_id}`" hover-class="none">
|
||||
<view class="u-line-2">{{ item.name }}</view>
|
||||
</navigator>
|
||||
<view class="sm text-999 u-m-t-8 attr u-text-center u-p-l-16 u-p-r-16 u-p-6-8 u-p-b-8">
|
||||
<text>味浓芳香</text>
|
||||
<text class="u-m-l-8 u-m-r-8">|</text>
|
||||
@ -22,13 +24,13 @@
|
||||
</view>
|
||||
<view class="u-m-t-16 row-between">
|
||||
<view class="primary">
|
||||
<price-format :price="12.9" :subscriptSize="22" :firstSize="34" :secondSize="26"></price-format>
|
||||
<price-format :price="item.price" :subscriptSize="22" :firstSize="34" :secondSize="26"></price-format>
|
||||
</view>
|
||||
<view>
|
||||
<view v-if="!isEdit">
|
||||
<u-number-box></u-number-box>
|
||||
<u-number-box :disabled="item.cart_status != 0" :value="item.goods_num" :min="1" :max="item.item_stock" @change="countChange($event, item.cart_id, item)" />
|
||||
</view>
|
||||
<view v-if="isEdit">
|
||||
<view v-if="isEdit" @click.stop="deleteCartGoods(item.cart_id)">
|
||||
<u-icon name="trash" size="32" color="#999"></u-icon>
|
||||
</view>
|
||||
</view>
|
||||
@ -37,25 +39,34 @@
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view v-if="!(cartType != 2)" class="cart-null column-center mb20" style="padding: 80rpx 0 50rpx" v-show="!(cartType != 2)">
|
||||
<image class="img-null" :src="cloudPath + 'img/cart_null.png'"></image>
|
||||
<view class="muted mb20">购物车暂无任何商品~</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- <view v-if="!isLogin" class="login column-center u-m-t-80">
|
||||
<view v-if="!isLogin" class="login column-center u-m-t-80">
|
||||
<image class="img-null" :src="cloudPath + 'img/cart_null.png'" width="1200" height="1200" mode="aspectFill"></image>
|
||||
<view class="muted mt20">登录后才能查看购物车哦</view>
|
||||
<navigator class="mt20 br60 row-center btn text-default" url="/pages/login/login" hover-class="none">
|
||||
<text>去登录</text>
|
||||
</navigator>
|
||||
</view> -->
|
||||
</view>
|
||||
|
||||
<view class="fixed footer bg-white w-full row-between u-col-center px32">
|
||||
<view class="fixed footer bg-white w-full row-between u-col-center px32" v-if="!(cartType != 1)">
|
||||
<view>
|
||||
<u-checkbox shape="circle" :active-color="themeColor">全选</u-checkbox>
|
||||
<!-- <u-checkbox shape="circle" :active-color="themeColor">全选</u-checkbox> -->
|
||||
<checkbox-group class="row checkbox" @change="changeAllSelect">
|
||||
<checkbox id="checkAll" value="all" :checked="isSelectedAll"></checkbox>
|
||||
<label for="checkAll" class="ml10">全选</label>
|
||||
</checkbox-group>
|
||||
</view>
|
||||
<view class="row">
|
||||
<view class="row-center">
|
||||
<view>合计:</view>
|
||||
<view class="primary u-m-l-8" style="margin-top: -8rpx;">
|
||||
<price-format :price="12.9" :subscriptSize="32" :firstSize="40" :secondSize="32"></price-format>
|
||||
<price-format :price="totalPrice" :subscriptSize="32" :firstSize="40" :secondSize="32"></price-format>
|
||||
</view>
|
||||
</view>
|
||||
<view class="u-m-l-24">
|
||||
@ -67,16 +78,182 @@
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {
|
||||
getCartList,
|
||||
changeCartSelect,
|
||||
changeGoodsCount,
|
||||
deleteGoods,
|
||||
} from "@/api/store";
|
||||
import {
|
||||
mapGetters,
|
||||
mapActions
|
||||
} from "vuex";
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
isEdit: false
|
||||
isEdit: false,
|
||||
cartType: 0,
|
||||
isShow: false,
|
||||
cartLists: [],
|
||||
delPopup: false,
|
||||
totalPrice: "",
|
||||
}
|
||||
},
|
||||
|
||||
onPullDownRefresh() {
|
||||
this.getCartListFun();
|
||||
},
|
||||
|
||||
onShow() {
|
||||
console.log(this.isLogin)
|
||||
}
|
||||
this.isLogin && this.getCartListFun();
|
||||
},
|
||||
|
||||
methods: {
|
||||
...mapActions(["getCartNum"]),
|
||||
|
||||
// 获取购物车商品
|
||||
getCartListFun() {
|
||||
getCartList().then((res) => {
|
||||
uni.stopPullDownRefresh({
|
||||
success: (res) => {},
|
||||
});
|
||||
|
||||
if (res.code == 1) {
|
||||
let {
|
||||
lists,
|
||||
total_amount
|
||||
} = res.data;
|
||||
let cartType = 0;
|
||||
|
||||
if (lists.length == 0) {
|
||||
cartType = 2;
|
||||
} else {
|
||||
cartType = 1;
|
||||
}
|
||||
|
||||
this.cartLists = lists;
|
||||
this.cartType = cartType;
|
||||
this.totalPrice = total_amount;
|
||||
this.isShow = true;
|
||||
this.getCartNum();
|
||||
}
|
||||
});
|
||||
},
|
||||
|
||||
// 购物车数组加减
|
||||
countChange({
|
||||
value
|
||||
}, cartId, item) {
|
||||
console.log("countChange", value, cartId, item);
|
||||
changeGoodsCount({
|
||||
cart_id: cartId,
|
||||
goods_num: value,
|
||||
}).then((res) => {
|
||||
if (res.code == 1) {
|
||||
this.getCartListFun();
|
||||
} else {
|
||||
this.getCartListFun();
|
||||
}
|
||||
});
|
||||
},
|
||||
|
||||
// 删除购物车商品
|
||||
deleteCartGoods(cartId) {
|
||||
uni.showModal({
|
||||
title: "温馨提示",
|
||||
content: "是否确认删除该商品?",
|
||||
success: ({ confirm }) => {
|
||||
if (!confirm) return;
|
||||
deleteGoods({
|
||||
cart_id: cartId,
|
||||
}).then((res) => {
|
||||
if (res.code == 1) {
|
||||
this.getCartListFun();
|
||||
}
|
||||
});
|
||||
},
|
||||
});
|
||||
},
|
||||
|
||||
|
||||
// 更改全选状态
|
||||
changeAllSelect() {
|
||||
const {
|
||||
isSelectedAll,
|
||||
cartLists
|
||||
} = this
|
||||
let cartid = cartLists.map((item) => item.cart_id);
|
||||
this.changeCartSelectFun(cartid, !isSelectedAll);
|
||||
},
|
||||
|
||||
changeCartSelectFun(cartId, selected) {
|
||||
console.log("selected ", selected);
|
||||
changeCartSelect({
|
||||
cart_id: cartId,
|
||||
selected: selected ? 1 : 0,
|
||||
}).then((res) => {
|
||||
if (res.code == 1) {
|
||||
this.getCartListFun();
|
||||
}
|
||||
});
|
||||
},
|
||||
|
||||
// 去结算
|
||||
goToConfirm() {
|
||||
let {
|
||||
cartLists
|
||||
} = this;
|
||||
let goods = [];
|
||||
cartLists.forEach((item) => {
|
||||
if (item.selected && item.cart_status == 0) {
|
||||
goods.push({
|
||||
item_id: item.item_id,
|
||||
num: item.goods_num,
|
||||
});
|
||||
}
|
||||
});
|
||||
if (goods.length == 0)
|
||||
return this.$toast({
|
||||
title: "您还没有选择商品哦",
|
||||
});
|
||||
uni.navigateTo({
|
||||
url: "/pages/confirm_order/confirm_order?data=" +
|
||||
encodeURIComponent(
|
||||
JSON.stringify({
|
||||
goods,
|
||||
type: "cart",
|
||||
})
|
||||
),
|
||||
});
|
||||
},
|
||||
},
|
||||
|
||||
computed: {
|
||||
...mapGetters(["cartNum"]),
|
||||
nullSelect() {
|
||||
let index = this.cartLists.findIndex(
|
||||
(item) => item.selected == 1 && item.cart_status == 0
|
||||
);
|
||||
|
||||
if (index == -1) {
|
||||
return true;
|
||||
}
|
||||
|
||||
return false;
|
||||
},
|
||||
isSelectedAll() {
|
||||
let index = this.cartLists.findIndex(
|
||||
(item) => item.selected == 0 && item.cart_status == 0
|
||||
);
|
||||
|
||||
if (index == -1) {
|
||||
return true;
|
||||
}
|
||||
|
||||
return false;
|
||||
},
|
||||
},
|
||||
|
||||
}
|
||||
</script>
|
||||
|
||||
|
||||
@ -1,7 +1,7 @@
|
||||
<template>
|
||||
<view class="content">
|
||||
<view>
|
||||
<u-search placeholder="请输入商品名" :disabled="true" @click="toSearch" ></u-search>
|
||||
<view class="search" @click="toSearch">
|
||||
<u-search placeholder="请输入商品名" :disabled="true" ></u-search>
|
||||
</view>
|
||||
<view>
|
||||
<view class="store u-flex u-row-between u-p-32">
|
||||
|
||||
Reference in New Issue
Block a user