Files
crmeb_java/app/pages/order_addcart/order_addcart01.vue
stivepeim be34f57322 ## v1.3.1 更新列表
1. 【修复】申请退款后积分等操作可能出现错误的问题
	2. 【修复】拼团支付可能出现支付错误的问题
	3. 【修复】退款申请后的订单流程优化和积分赠送的问题
	4. 【修复】回收站中的商品无法恢复的问题
	5. 【修复】一号通短信查询记录不完整的问题
	6. 【修复】用户管理批量加分组,标签的问题
	7. 【修复】积分日志搜索显示有误的问题
	8. 【修复】手动发送优惠券可能会出错的问题
	9. 【修复】核销订单创建在某种条件下会出错的问题
	10. 【修复】移动端商品详情,购物车等样式兼容问题
	11. 【修复】业务流程性的优化
2021-01-19 10:16:45 +08:00

755 lines
20 KiB
Vue
Raw Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
<template>
<view>
<view class='shoppingCart'>
<view class='labelNav acea-row row-around row-middle'>
<view class='item'><text class='iconfont icon-xuanzhong'></text>100%正品保证</view>
<view class='item'><text class='iconfont icon-xuanzhong'></text>所有商品精挑细选</view>
<view class='item'><text class='iconfont icon-xuanzhong'></text>售后无忧</view>
</view>
<view class='nav acea-row row-between-wrapper'>
<view>购物数量 <text class='num font-color'>{{cartCount}}</text></view>
<view v-if="cartList.valid.length > 0 || cartList.invalid.length > 0" class='administrate acea-row row-center-wrapper'
@click='manage'>{{ footerswitch ? '管理' : '取消'}}</view>
</view>
<view v-if="cartList.valid.length > 0 || cartList.invalid.length > 0">
<view class='list'>
<checkbox-group @change="checkboxChange">
<block v-for="(item,index) in cartList.valid" :key="index">
<view class='item acea-row row-between-wrapper'>
<!-- #ifndef MP -->
<checkbox :value="(item.id).toString()" :checked="item.checked" />
<!-- #endif -->
<!-- #ifdef MP -->
<checkbox :value="item.id" :checked="item.checked" />
<!-- #endif -->
<navigator :url='"/pages/goods_details/index?id="+item.product_id' hover-class='none' class='picTxt acea-row row-between-wrapper'>
<view class='pictrue'>
<image v-if="item.productInfo.attrInfo" :src='item.productInfo.attrInfo.image'></image>
<image v-else :src='item.productInfo.image'></image>
</view>
<view class='text'>
<view class='line1'>{{item.productInfo.store_name}}</view>
<view class='infor line1' v-if="item.productInfo.attrInfo">属性{{item.productInfo.attrInfo.suk}}</view>
<view class='money'>{{item.truePrice}}</view>
</view>
<view class='carnum acea-row row-center-wrapper'>
<view class="reduce" :class="item.numSub ? 'on' : ''" @click.stop='subCart(index)'>-</view>
<view class='num'>{{item.cart_num}}</view>
<!-- <view class="num">
<input type="number" v-model="item.cart_num" @click.stop @input="iptCartNum(index)" @blur="blurInput(index)"/>
</view> -->
<view class="plus" :class="item.numAdd ? 'on' : ''" @click.stop='addCart(index)'>+</view>
</view>
</navigator>
</view>
</block>
</checkbox-group>
</view>
<view class='invalidGoods' v-if="cartList.invalid.length > 0">
<view class='goodsNav acea-row row-between-wrapper'>
<view @click='goodsOpen'><text class='iconfont' :class='goodsHidden==true?"icon-xiangxia":"icon-xiangshang"'></text>失效商品</view>
<view class='del' @click='unsetCart'><text class='iconfont icon-shanchu1'></text>清空</view>
</view>
<view class='goodsList' :hidden='goodsHidden'>
<block v-for="(item,index) in cartList.invalid" :key='index'>
<view class='item acea-row row-between-wrapper'>
<view class='invalid'>失效</view>
<view class='pictrue'>
<image v-if="item.productInfo.attrInfo" :src='item.productInfo.attrInfo.image'></image>
<image v-else :src='item.productInfo.image'></image>
</view>
<view class='text acea-row row-column-between'>
<view class='line1 name'>{{item.productInfo.store_name}}</view>
<view class='infor line1' v-if="item.productInfo.attrInfo">属性{{item.productInfo.attrInfo.suk}}</view>
<view class='acea-row row-between-wrapper'>
<!-- <view>{{item.truePrice}}</view> -->
<view class='end'>该商品已失效</view>
</view>
</view>
</view>
</block>
</view>
</view>
</view>
<view class='noCart' v-if="cartList.valid.length == 0 && cartList.invalid.length == 0">
<view class='pictrue'>
<image src='../../static/images/noCart.png'></image>
</view>
<recommend :hostProduct='hostProduct'></recommend>
</view>
<view style='height:120rpx;'></view>
<view class='footer acea-row row-between-wrapper' v-if="cartList.valid.length > 0">
<view>
<checkbox-group @change="checkboxAllChange">
<checkbox value="all" :checked="!!isAllSelect" /><text class='checkAll'>全选 ({{cartCount}})</text>
</checkbox-group>
</view>
<view class='money acea-row row-middle' v-if="footerswitch==true">
<text class='font-color'>{{selectCountPrice}}</text>
<form @submit="subOrder" report-submit='true'>
<button class='placeOrder bg-color' formType="submit">立即下单</button>
</form>
</view>
<view class='button acea-row row-middle' v-else>
<form @submit="subCollect" report-submit='true'>
<button class='bnt cart-color' formType="submit">收藏</button>
</form>
<form @submit="subDel" report-submit='true'>
<button class='bnt' formType="submit">删除</button>
</form>
</view>
</view>
</view>
<!-- #ifdef MP -->
<authorize :isAuto="isAuto" :isShowAuth="isShowAuth" @authColse="authColse"></authorize>
<!-- #endif -->
</view>
</template>
<script>
import {
getCartList,
getCartCounts,
changeCartNum,
cartDel
} from '@/api/order.js';
import {
getProductHot,
collectAll
} from '@/api/store.js';
import {
toLogin
} from '@/libs/login.js';
import {
mapGetters
} from "vuex";
import recommend from '@/components/recommend';
import ClipboardJS from "@/plugin/clipboard/clipboard.js";
// #ifdef MP
import authorize from '@/components/Authorize';
// #endif
export default {
components: {
recommend,
// #ifdef MP
authorize
// #endif
},
data() {
return {
cartCount: 0,
goodsHidden: true,
footerswitch: true,
hostProduct: [],
cartList: {
valid: [],
invalid: []
},
isAllSelect: false, //全选
selectValue: [], //选中的数据
selectCountPrice: 0.00,
isAuto: false, //没有授权的不会自动授权
isShowAuth: false, //是否隐藏授权
hotScroll:false,
hotPage:1,
hotLimit:10
};
},
computed: mapGetters(['isLogin']),
onLoad: function(options) {
let that = this;
if (that.isLogin == false) {
// #ifdef H5 || APP-PLUS
toLogin();
// #endif
// #ifdef MP
that.isAuto = true;
that.$set(that, 'isShowAuth', true);
// #endif
}
},
onShow: function() {
if (this.isLogin == true) {
this.getHostProduct();
this.getCartList();
this.getCartNum();
this.goodsHidden = true;
this.footerswitch = true;
this.hostProduct = [];
this.hotScroll = false;
this.hotPage = 1;
this.hotLimit = 10;
this.cartList = {
valid: [],
invalid: []
},
this.isAllSelect = false; //全选
this.selectValue = []; //选中的数据
this.selectCountPrice = 0.00;
this.cartCount = 0;
this.isShowAuth = false;
};
},
methods: {
/**
* 手动输入数量失焦事件
*/
// inputBlur(index,val) {
// if (val <= 1) {
// // let index = e.currentTarget.dataset.index;
// let item = this.cartList.valid[index];
// item.cart_num = 1;
// if (item.cart_num) this.setCartNum(item.id, item.cart_num);
// this.cartList.valid[index] = item;
// this.$set(this.cartList,'valid',this.cartList.valid);
// this.switchSelect();
// }
// },
// 授权关闭
authColse: function(e) {
this.isShowAuth = e;
},
subDel: function(event) {
let that = this,
selectValue = that.selectValue;
if (selectValue.length > 0)
cartDel(selectValue).then(res => {
that.getCartList();
that.getCartNum();
});
else
return that.$util.Tips({
title: '请选择产品'
});
},
getSelectValueProductId: function() {
let that = this;
let validList = that.cartList.valid;
let selectValue = that.selectValue;
let productId = [];
if (selectValue.length > 0) {
for (let index in validList) {
if (that.inArray(validList[index].id, selectValue)) {
productId.push(validList[index].product_id);
}
}
};
return productId;
},
subCollect: function(event) {
let that = this,
selectValue = that.selectValue;
if (selectValue.length > 0) {
let selectValueProductId = that.getSelectValueProductId();
collectAll(that.getSelectValueProductId().join(',')).then(res => {
return that.$util.Tips({
title: res.msg,
icon: 'success'
});
}).catch(err => {
return that.$util.Tips({
title: err
});
});
} else {
return that.$util.Tips({
title: '请选择产品'
});
}
},
subOrder: function(event) {
let that = this,
selectValue = that.selectValue;
if (selectValue.length > 0) {
uni.navigateTo({
url: '/pages/users/order_confirm/index?cartId=' + selectValue.join(',')
});
} else {
return that.$util.Tips({
title: '请选择产品'
});
}
},
checkboxAllChange: function(event) {
let value = event.detail.value;
if (value.length > 0) {
this.setAllSelectValue(1)
} else {
this.setAllSelectValue(0)
}
},
setAllSelectValue: function(status) {
let that = this;
let selectValue = [];
let valid = that.cartList.valid;
if (valid.length > 0) {
for (let index in valid) {
if (status == 1) {
valid[index].checked = true;
selectValue.push(valid[index].id);
} else valid[index].checked = false;
}
that.$set(that.cartList, 'valid', valid);
that.selectValue = selectValue;
that.switchSelect();
}
},
checkboxChange: function(event) {
let that = this;
let value = event.detail.value;
let valid = that.cartList.valid;
for (let index in valid) {
if (that.inArray(valid[index].id, value)) valid[index].checked = true;
else valid[index].checked = false;
}
that.$set(that.cartList, 'valid', valid);
that.isAllSelect = value.length == that.cartList.valid.length;
that.selectValue = value;
that.switchSelect();
},
inArray: function(search, array) {
for (let i in array) {
if (array[i] == search) {
return true;
}
}
return false;
},
switchSelect: function() {
let that = this;
let validList = that.cartList.valid;
let selectValue = that.selectValue;
let selectCountPrice = 0.00;
if (selectValue.length < 1) {
that.selectCountPrice = selectCountPrice;
} else {
for (let index in validList) {
if (that.inArray(validList[index].id, selectValue)) {
selectCountPrice = that.$util.$h.Add(selectCountPrice, that.$util.$h.Mul(validList[index].cart_num, validList[
index].truePrice))
}
}
that.selectCountPrice = selectCountPrice;
}
},
/**
* 购物车手动填写
*
*/
iptCartNum: function (index) {
let item = this.cartList.valid[index];
if(item.cart_num){
this.setCartNum(item.id, item.cart_num);
}
this.switchSelect();
},
blurInput:function (index) {
let item = this.cartList.valid[index];
if(!item.cart_num){
item.cart_num = 1;
this.$set(this.cartList,'valid',this.cartList.valid)
}
},
subCart: function(index) {
let that = this;
let status = false;
let item = that.cartList.valid[index];
item.cart_num = Number(item.cart_num) - 1;
if (item.cart_num < 1) status = true;
if (item.cart_num <= 1) {
item.cart_num = 1;
item.numSub = true;
} else {
item.numSub = false;
item.numAdd = false;
}
if (false == status) {
that.setCartNum(item.id, item.cart_num, function(data) {
that.cartList.valid[index] = item;
that.switchSelect();
});
}
},
addCart: function(index) {
let that = this;
let item = that.cartList.valid[index];
item.cart_num = Number(item.cart_num) + 1;
let productInfo = item.productInfo;
if (productInfo.hasOwnProperty('attrInfo') && item.cart_num >= item.productInfo.attrInfo.stock) {
item.cart_num = item.productInfo.attrInfo.stock;
item.numAdd = true;
item.numSub = false;
}else {
item.numAdd = false;
item.numSub = false;
}
that.setCartNum(item.id, item.cart_num, function(data) {
that.cartList.valid[index] = item;
that.switchSelect();
});
},
setCartNum(cartId, cartNum, successCallback) {
let that = this;
changeCartNum(cartId, cartNum).then(res => {
successCallback && successCallback(res.data);
});
},
getCartNum: function() {
let that = this;
getCartCounts().then(res => {
that.cartCount = res.data.count;
});
},
getCartList: function() {
let that = this;
getCartList().then(res => {
let cartList = res.data;
let valid = cartList.valid;
let numSub = [{
numSub: true
}, {
numSub: false
}];
let numAdd = [{
numAdd: true
}, {
numAdd: false
}],
selectValue = [];
if (valid.length > 0) {
for (let index in valid) {
if (valid[index].cart_num == 1) {
valid[index].numSub = true;
} else {
valid[index].numSub = false;
}
let productInfo = valid[index].productInfo;
if (productInfo.hasOwnProperty('attrInfo') && valid[index].cart_num == valid[index].productInfo.attrInfo.stock) {
valid[index].numAdd = true;
} else if (valid[index].cart_num == valid[index].productInfo.stock) {
valid[index].numAdd = true;
} else {
valid[index].numAdd = false;
}
valid[index].checked = true;
selectValue.push(valid[index].id);
}
}
that.$set(that, 'cartList', cartList);
that.goodsHidden = cartList.valid.length <= 0 ? false : true;
that.selectValue = selectValue;
that.isAllSelect = valid.length == selectValue.length && valid.length;
that.switchSelect();
});
},
getHostProduct: function() {
let that = this;
if(that.hotScroll) return
getProductHot(
that.hotPage,
that.hotLimit,
).then(res => {
that.hotPage++
that.hotScroll = res.data.list.length<that.hotLimit
that.hostProduct = that.hostProduct.concat(res.data.list)
});
},
goodsOpen: function() {
let that = this;
that.goodsHidden = !that.goodsHidden;
},
manage: function() {
let that = this;
that.footerswitch = !that.footerswitch;
},
unsetCart: function() {
let that = this,
ids = [];
for (let i = 0, len = that.cartList.invalid.length; i < len; i++) {
ids.push(that.cartList.invalid[i].id);
}
cartDel(ids).then(res => {
that.$util.Tips({
title: '清除成功'
});
that.$set(that.cartList, 'invalid', []);
}).catch(res => {
});
}
},
onReachBottom() {
this.getHostProduct();
}
}
</script>
<style scoped lang="scss">
.shoppingCart .labelNav {
height: 76rpx;
padding: 0 30rpx;
font-size: 22rpx;
color: #8c8c8c;
position: fixed;
left: 0;
width: 100%;
box-sizing: border-box;
background-color: #f5f5f5;
z-index: 5;
top: 0;
}
.shoppingCart .labelNav .item .iconfont {
font-size: 25rpx;
margin-right: 10rpx;
}
.shoppingCart .nav {
width: 100%;
height: 80rpx;
background-color: #fff;
padding: 0 30rpx;
box-sizing: border-box;
font-size: 28rpx;
color: #282828;
position: fixed;
left: 0;
z-index: 5;
top: 76rpx;
}
.shoppingCart .nav .administrate {
font-size: 26rpx;
color: #282828;
width: 110rpx;
height: 46rpx;
border-radius: 6rpx;
border: 1px solid #868686;
}
.shoppingCart .noCart {
margin-top: 171rpx;
background-color: #fff;
padding-top: 0.1rpx;
}
.shoppingCart .noCart .pictrue {
width: 414rpx;
height: 336rpx;
margin: 78rpx auto 56rpx auto;
}
.shoppingCart .noCart .pictrue image {
width: 100%;
height: 100%;
}
.shoppingCart .list {
margin-top: 171rpx;
}
.shoppingCart .list .item {
padding: 25rpx 30rpx;
background-color: #fff;
margin-bottom: 15rpx;
}
.shoppingCart .list .item .picTxt {
width: 627rpx;
position: relative;
}
.shoppingCart .list .item .picTxt .pictrue {
width: 160rpx;
height: 160rpx;
}
.shoppingCart .list .item .picTxt .pictrue image {
width: 100%;
height: 100%;
border-radius: 6rpx;
}
.shoppingCart .list .item .picTxt .text {
width: 444rpx;
font-size: 28rpx;
color: #282828;
}
.shoppingCart .list .item .picTxt .text .infor {
font-size: 24rpx;
color: #868686;
margin-top: 16rpx;
}
.shoppingCart .list .item .picTxt .text .money {
font-size: 32rpx;
color: #282828;
margin-top: 28rpx;
}
.shoppingCart .list .item .picTxt .carnum {
height: 47rpx;
position: absolute;
bottom: 7rpx;
right: 0;
}
.shoppingCart .list .item .picTxt .carnum view {
border: 1rpx solid #a4a4a4;
width: 66rpx;
text-align: center;
height: 100%;
line-height: 40rpx;
font-size: 28rpx;
color: #a4a4a4;
}
.shoppingCart .list .item .picTxt .carnum .reduce {
border-right: 0;
border-radius: 3rpx 0 0 3rpx;
}
.shoppingCart .list .item .picTxt .carnum .reduce.on {
border-color: #e3e3e3;
color: #dedede;
}
.shoppingCart .list .item .picTxt .carnum .plus {
border-left: 0;
border-radius: 0 3rpx 3rpx 0;
}
.shoppingCart .list .item .picTxt .carnum .num {
color: #282828;
}
.shoppingCart .invalidGoods {
background-color: #fff;
}
.shoppingCart .invalidGoods .goodsNav {
width: 100%;
height: 66rpx;
padding: 0 30rpx;
box-sizing: border-box;
font-size: 28rpx;
color: #282828;
}
.shoppingCart .invalidGoods .goodsNav .iconfont {
color: #424242;
font-size: 28rpx;
margin-right: 17rpx;
}
.shoppingCart .invalidGoods .goodsNav .del {
font-size: 26rpx;
color: #999;
}
.shoppingCart .invalidGoods .goodsNav .del .icon-shanchu1 {
color: #999;
font-size: 33rpx;
vertical-align: -2rpx;
margin-right: 8rpx;
}
.shoppingCart .invalidGoods .goodsList .item {
padding: 20rpx 30rpx;
border-top: 1rpx solid #f5f5f5;
}
.shoppingCart .invalidGoods .goodsList .item .invalid {
font-size: 22rpx;
color: #fff;
width: 70rpx;
height: 36rpx;
background-color: #aaa;
border-radius: 3rpx;
text-align: center;
line-height: 36rpx;
}
.shoppingCart .invalidGoods .goodsList .item .pictrue {
width: 140rpx;
height: 140rpx;
}
.shoppingCart .invalidGoods .goodsList .item .pictrue image {
width: 100%;
height: 100%;
border-radius: 6rpx;
}
.shoppingCart .invalidGoods .goodsList .item .text {
width: 433rpx;
font-size: 28rpx;
color: #999;
height: 140rpx;
}
.shoppingCart .invalidGoods .goodsList .item .text .name{width:100%;}
.shoppingCart .invalidGoods .goodsList .item .text .infor {
font-size: 24rpx;
}
.shoppingCart .invalidGoods .goodsList .item .text .end {
font-size: 26rpx;
color: #bbb;
}
.shoppingCart .footer {
z-index:9;
width: 100%;
height: 96rpx;
background-color: #fafafa;
position: fixed;
padding: 0 30rpx;
box-sizing: border-box;
border-top: 1rpx solid #eee;
//
bottom: 0;
//
// #ifndef MP
bottom: 50px;
// #endif
}
.shoppingCart .footer .checkAll {
font-size: 28rpx;
color: #282828;
margin-left: 16rpx;
}
// .shoppingCart .footer checkbox .wx-checkbox-input{background-color:#fafafa;}
.shoppingCart .footer .money {
font-size: 30rpx;
}
.shoppingCart .footer .placeOrder {
color: #fff;
font-size: 30rpx;
width: 226rpx;
height: 70rpx;
border-radius: 50rpx;
text-align: center;
line-height: 70rpx;
margin-left: 22rpx;
}
.shoppingCart .footer .button .bnt {
font-size: 28rpx;
color: #999;
border-radius: 50rpx;
border: 1px solid #999;
width: 160rpx;
height: 60rpx;
text-align: center;
line-height: 60rpx;
}
.shoppingCart .footer .button form~form {
margin-left: 17rpx;
}
</style>