shop-applet/pages/cashier/cashier.vue

1785 lines
53 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 :style="viewColor">
<view class='shoppingCart' :class="(newData.status && newData.status.status) ? 'showFoot' : ''">
<!-- <view class='labelNav acea-row row-around row-middle'>
<text>PC端收银台地址:</text> <text>{{PC_URL}}</text> <text @click="copyText(PC_URL)">复制</text>
</view> -->
<view class='labelNav acea-row row-around row-middle tabs-nav'>
<view :class="{'active': navTab==1}" @click="changeNavTab(1)">收银</view>
<view :class="{'active': navTab==2}" @click="changeNavTab(2)">订单</view>
</view>
<block v-if="navTab==1">
<view class='nav acea-row row-between-wrapper'>
<view>购物数量 <text class='num t-color'>{{cartTotalCount}}</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'>
<block v-for="(item,index) in cartList.valid" :key="index">
<view class='item acea-row row-between-wrapper'>
<view class="store-title">
<view class="checkbox" @click="storeAllCheck(item,index)">
<text v-if="!item.allCheck" class="iconfont icon-weixuanzhong"></text>
<text v-else class="iconfont icon-xuanzhong1"></text>
</view>
<navigator :url="hide_mer_status == 0 ? '/pages/store/home/index?id='+item.mer_id : '#'" class="info">
<text class="iconfont icon-shangjiadingdan"></text>
<view class="name">{{item.mer_name}}</view>
<text class="iconfont icon-xiangyou"></text>
</navigator>
<!-- <view class="coupon-btn" v-if="item.hasCoupon>0" @click="giveCoupon(item)">优惠券</view> -->
</view>
<navigator v-for="goods in item.list" :key="goods.cart_id"
:url='"/pages/goods_details/index?id="+goods.product.product_id' hover-class='none'
class='picTxt acea-row'>
<view class="checkbox" @click.stop="goodsCheck(goods,index)">
<text v-if="!goods.check" class="iconfont icon-weixuanzhong"></text>
<text v-else class="iconfont icon-xuanzhong1"></text>
</view>
<view class='pictrue'>
<image :src='(goods.productAttr && goods.productAttr.image) || goods.product.image'>
</image>
<!-- <image v-else :src='item.productInfo.image'></image> -->
</view>
<view class='text'>
<view class='line1'>{{goods.product.store_name}}</view>
<view class='infor line1' v-if="goods.productAttr.sku"
@click.stop='changeCart(goods,goods.product_id)'>
{{goods.productAttr.sku}}
<text class="iconfont icon-xiala1"></text>
</view>
<view v-if="goods.product.once_max_count>0 && goods.product.once_min_count>0" class="buy_limit">
<text v-if="goods.product.once_min_count>0">{{goods.product.once_min_count}}件起购,</text><text
v-if="goods.product.once_max_count>0">最多{{goods.product.once_max_count}}件</text>
</view>
<view class='money acea-row row-middle'>
<text>¥{{goods.productAttr.price}}</text>
<!-- <view v-if="goods.productAttr.show_svip_price" class="vipImg">
<image src="/static/images/svip.png"></image>
</view> -->
</view>
</view>
<view class='carnum acea-row row-center-wrapper'>
<view class="reduce" :class="goods.numSub ? 'on' : ''" @click.stop='subCart(goods)'>
-</view>
<view class='num'>{{goods.cart_num}}</view>
<view class="plus" :class="goods.numAdd ? 'on' : ''" @click.stop='addCart(goods)'>+
</view>
</view>
</navigator>
</view>
</block>
</view>
</view>
<view class='noCart' v-if="recommend"
:style="{marginTop:cartList.invalid.length ==0 && cartList.invalid.length ==0?'170rpx':'' }">
<view class='pictrue'>
<image src='https://lihai001.oss-cn-chengdu.aliyuncs.com/def/noCart.png'></image>
<view>暂无商品,去添加点什么吧</view>
</view>
<!-- <recommend v-if="recommend_switch == 1" :hostProduct='hostProduct' :isLogin="isLogin"></recommend>
<view class='loadingicon acea-row row-center-wrapper'
v-if="hostProduct.length>5 && recommend_switch == 1">
<text class='loading iconfont icon-jiazai' :hidden='loading==false'></text>{{loadTitle}}
</view> -->
</view>
<view style="text-align: center;color: #999;font-size: 22rpx;" @click="copyText(PC_URL)">PC收银台网址: <text style="margin-left: 20rpx;">{{PC_URL}}</text></view>
<view class='footer acea-row row-between-wrapper' :class="isFooter?'':'on'">
<block v-if="footerswitch==true">
<view class='money acea-row row-middle'>
<text class='t-color' style="font-weight: bold;font-size: 32rpx;">¥{{selectCountPrice}}</text>
<!-- <form @submit="updatePrice" report-submit='true'>
<button class='placeOrder update-price' formType="submit">改价</button>
</form> -->
</view>
<view class='money acea-row row-middle'>
<!-- <text class='t-color'>¥{{selectCountPrice}}</text> -->
<form @submit="subOrder" report-submit='true'>
<button class='placeOrder' formType="submit"><u-icon name="scan" size="24"
color="#fff"></u-icon>扫码结账</button>
</form>
</view>
</block>
<block v-else>
<view>
<view class="allcheckbox" @click.stop="checkboxAllChange">
<text v-if="!isAllSelect" class="iconfont icon-weixuanzhong"></text>
<text v-else class="iconfont icon-xuanzhong1"></text>
全选 ({{cartCount}})
</view>
</view>
<view class='button acea-row row-middle'>
<!-- <form @submit="subCollect" report-submit='true'>
<button class='bnt bt-color' formType="submit">收藏</button>
</form> -->
<form @submit="subDel" report-submit='true'>
<button class='bnt' formType="submit">删除</button>
</form>
</view>
</block>
<button class='placeOrder add-shop' @click="scanShopCode"><u-icon name="scan" size="24"
color="#fff"></u-icon>扫描条码添加商品</button>
</view>
</block>
<block v-else>
<view class="order-list">
<view class="item" v-for="(item, index) in orderList" :key="index" @click="navTo(item)">
<view class="top">
<view class="sn" :class="
item.pay_type === 11 ||
item.pay_type === 12 ||
item.pay_type === 13
? 'cahier'
: 'cahier2'
">
{{ item.order_sn }}
</view>
<view class="create-time">{{ item.create_time }}</view>
</view>
<view class="shop">
<view class="left" v-if="item.orderProduct">
<image v-for="(shop, imgkey) in item.orderProduct.slice(0, 5)" :key="imgkey" :src="
shop.cart_info.productAttr.image || shop.cart_info.product.image
" class="shop-img"></image>
<view v-if="item.orderProduct.length == 1" class="shop-name">
{{ item.orderProduct[0].cart_info.product.store_name }}
</view>
</view>
<view class="right">
<view class="money">¥{{ item.pay_price }}</view>
<view class="count">共{{ item.total_num }}件商品</view>
</view>
</view>
<view class="bottom">
<view class="pay">
<view v-if="item.paid">
已支付
<span v-if="item.pay_type == 13">(支付宝收款)</span>
<span v-if="item.pay_type == 12">(现金支付)</span>
<span v-if="item.pay_type == 11">(微信收款)</span>
<span v-if="item.pay_type == 0">(余额支付)</span>
<span v-if="item.pay_type == 1">(微信支付)</span>
<span v-if="item.pay_type == 9">(商户余额支付)</span>
<span v-if="item.pay_type == 10">(对公转账)</span>
</view>
<view v-else style="color: #ff4a00">未支付</view>
</view>
<view class="cashier" v-if="item.service_info">
收银员: {{ item.service_info.nickname }}
</view>
<view class="cashier" v-else>平台订单</view>
</view>
<view v-if="!item.paid" class="b-button">
<button @click.stop="reOrderPay(item)">重新支付</button>
<button @click.stop="micropayQuery(item)">检测状态</button>
<button @click.stop="orderLading(item)" style="background-color: #1890ff;">提单</button>
</view>
</view>
</view>
</block>
</view>
<!-- 优惠券弹窗 -->
<block v-if="coupon.coupon">
<couponListWindow :coupon='coupon' @ChangCouponsClone="ChangCouponsClone"
@ChangCouponsUseState="ChangCouponsUseState"></couponListWindow>
</block>
<!-- 组件 -->
<addcartWindow :attr="attr" :isShow='1' :iSplus='1' :destri='1' @myevent="onMyEvent" @ChangeAttr="ChangeAttr"
@goCat="goCat" @attrVal="attrVal" id='product-window'></addcartWindow>
<authorize :isAuto="isAuto" :isShowAuth="isShowAuth" @authColse="authColse" @onLoadFun="onLoadFun"></authorize>
<view class="foot" v-if="newData.status && newData.status.status">
<view class="page-footer" id="target" :style="{'background-color':newData.bgColor.color[0].item}">
<view class="foot-item" v-for="(item,index) in newData.menuList" :key="index" @click="goRouter(item)">
<block v-if="item.link == activeRouter">
<image :src="item.imgList[0]"></image>
<view class="txt" :style="{color:newData.activeTxtColor.color[0].item}">{{item.name}}
</view>
</block>
<block v-else>
<image :src="item.imgList[1]"></image>
<view class="txt" :style="{color:newData.txtColor.color[0].item}">{{item.name}}</view>
</block>
</view>
</view>
</view>
</view>
</template>
<script>
// +----------------------------------------------------------------------
// | CRMEB [ CRMEB赋能开发者助力企业发展 ]
// +----------------------------------------------------------------------
// | Copyright (c) 2016~2021 https://www.crmeb.com All rights reserved.
// +----------------------------------------------------------------------
// | Licensed CRMEB并不是自由软件未经许可不能去掉CRMEB相关版权
// +----------------------------------------------------------------------
// | Author: CRMEB Team <admin@crmeb.com>
// +----------------------------------------------------------------------
import couponListWindow from '@/components/couponListWindow';
import addcartWindow from '@/components/addcartWindow';
import {
getCartList,
getCartCounts,
changeCartNum,
cartDel,
cartProductAttr,
createOrder,
getOrderConfirm,
orderPay
} from '@/api/order.js';
import {
getCoupons,
getShopCoupons
} from '@/api/api.js';
import {
getProductHot,
collectAll
} from '@/api/store.js';
import {
productLstApi,
micropayQueryApi,
orderLadingApi
} from "@/api/product.js";
import {
getOrderList
} from "@/api/admin.js";
import {
mapGetters
} from "vuex";
import recommend from '@/components/recommend';
import authorize from '@/components/Authorize';
import {
configMap
} from '@/utils';
import { ENV } from "@/config/app.js"
import { Toast } from '../../libs/uniApi';
const app = getApp();
export default {
props: {
image: {
type: String,
default: '',
}
},
components: {
recommend,
couponListWindow,
addcartWindow,
authorize
},
data() {
return {
PC_URL: 'https://test-cashier.lihaink.cn', // 收银台地址
appInfo: null,
loading: false, //是否加载中
loadend: false, //是否加载完毕
loadTitle: '加载更多', //提示语
isFooter: false,
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,
//属性是否打开
coupon: {
'coupon': false,
list: [],
},
// 购物车总数
cartTotalCount: 0,
recommend: false,
productValue: [], //系统属性
attr: {
cartAttr: false,
productAttr: [],
productSelect: {}
},
isOpen: false, //是否打开属性组件
source: '',
attrImage: '',
isCart: true,
cart_id: '',
attrValue: '', //已选属性
uniqueValue: "",
newVal: {},
goods: {},
currSku: '',
newData: {},
activeRouter: '',
userInfo: '',
navTab: 1,
orderList: []
};
},
computed: configMap({
hide_mer_status: 1,
recommend_switch: 0,
navigation: {}
}, mapGetters(['isLogin', 'viewColor'])),
onReady() {},
mounted: function() {},
onLoad: function(options) {
if (ENV == 'prod') this.PC_URL = 'https://cashier.lihaink.cn'
},
onShow: function() {
this.userInfo = this.$store.state.app.userInfo;
this.appInfo = this.$appInfo.safeAreaInsets
let that = this
let routes = getCurrentPages();
let curRoute = routes[routes.length - 1].route
this.activeRouter = '/' + curRoute
this.getNav();
// uni.showTabBar();
if (this.isLogin == true) {
this.getOrderList();
this.getCartList();
this.getCartNum();
this.goodsHidden = true;
this.footerswitch = true;
this.isAllSelect = false; //全选
this.selectValue = []; //选中的数据
this.isShowAuth = false;
uni.setStorage({
key: 'invoice_Data',
data: {},
success: function() {}
})
} else {
setTimeout(() => {
this.isAuto = true;
this.isShowAuth = true
}, 300);
}
},
onPullDownRefresh() {
if (this.isLogin == true) {
this.getCartList();
this.getCartNum();
this.goodsHidden = true;
this.footerswitch = true;
this.isAllSelect = false; //全选
this.selectValue = []; //选中的数据
this.isShowAuth = false;
uni.setStorage({
key: 'invoice_Data',
data: {},
success: function() {}
})
} else {
setTimeout(() => {
this.isAuto = true;
this.isShowAuth = true
}, 300);
}
setTimeout(() => {
uni.stopPullDownRefresh()
}, 800)
},
methods: {
// 授权关闭
authColse: function(e) {
console.log(e, 'authColse')
this.isShowAuth = e;
},
changeNavTab(type) {
this.navTab = type;
},
onLoadFun() {
this.isShowAuth = false;
},
goRouter(item) {
var pages = getCurrentPages();
var page = (pages[pages.length - 1]).$page.fullPath;
if (item.link == page) return
uni.switchTab({
url: item.link,
fail(err) {
uni.redirectTo({
url: item.link
})
}
})
},
getNav() {
this.newData = this.navigation
if (this.newData.status && this.newData.status.status) {
uni.hideTabBar()
this.isFooter = true
} else {
uni.showTabBar()
this.isFooter = false
}
},
// 删除
subDel: function(event) {
let that = this
let type_id = []
this.cartList.valid.forEach(el => {
el.list.forEach(goods => {
if (goods.check) {
type_id.push(goods.cart_id)
}
})
})
if (type_id.length == 0) {
return that.$util.Tips({
title: '请选择产品'
});
} else {
cartDel({
cart_id: type_id,
}).then(res => {
this.getCartList();
this.getCartNum();
return that.$util.Tips({
title: res.message,
icon: 'success'
});
}).catch(err => {
return that.$util.Tips({
title: err
});
});
}
},
// 收藏
subCollect: function(event) {
let that = this
let type_id = []
this.cartList.valid.forEach(el => {
el.list.forEach(goods => {
if (goods.check) {
type_id.push(goods.spu.spu_id)
}
})
})
if (type_id.length == 0) {
return that.$util.Tips({
title: '请选择产品'
});
} else {
collectAll({
type_id: type_id,
type: 1
}).then(res => {
return that.$util.Tips({
title: res.message,
icon: 'success'
});
}).catch(err => {
return that.$util.Tips({
title: err
});
});
}
},
onMyEvent: function() {
this.$set(this.attr, 'cartAttr', false);
this.$set(this, 'isOpen', false);
},
/*
* 更改商品属性
*/
changeCart: function(goods, id) {
let that = this;
if (that.goods == goods) {
that.isOpen = that.attr.cartAttr = true;
return
} else {
cartProductAttr(id).then(res => {
goods.attr = res.data.attr;
goods.attrValue = res.data.attrValue
that.attrValue = goods.productAttr.sku
that.attrImage = goods.product.image
that.goods = JSON.parse((JSON.stringify(goods)));
that.currSku = goods.productAttr.sku.split(",");
that.$set(that.attr, 'productAttr', res.data.attr);
const sku = {}
res.data.attrValue.forEach((itemn) => {
sku[itemn.sku] = itemn;
})
that.$set(that, 'productValue', sku);
let productSelect = sku[that.attrValue];
that.isOpen = that.attr.cartAttr = true;
that.DefaultSelect(goods)
}).catch(err => {
return that.$util.Tips({
title: err
});
});
}
},
/**
* 默认选中属性
*
*/
DefaultSelect: function(goods) {
let productAttr = this.attr.productAttr;
let value = [];
let arr = []
console.log(arr, 'arr')
if (this.currSku) {
value = this.currSku
} else {
for (var key in this.productValue) {
if (this.productValue[key].stock > 0) {
value = this.attr.productAttr.length ? key.split(",") : [];
break;
}
}
}
for (let i = 0; i < productAttr.length; i++) {
this.$set(productAttr[i], "index", value[i]);
}
let productSelect = this.productValue[value.join(",")];
if (productSelect && productAttr.length) {
this.$set(
this.attr.productSelect,
"store_name",
goods.product.store_name
);
this.$set(this.attr.productSelect, "image", productSelect.image ? productSelect.image : goods
.product.image);
this.$set(this.attr.productSelect, "price", productSelect.price);
this.$set(this.attr.productSelect, "stock", productSelect.stock);
this.$set(this.attr.productSelect, "unique", productSelect.unique);
this.$set(this.attr.productSelect, "svip_price", productSelect.svip_price);
this.$set(this, "uniqueValue", productSelect.unique);
this.$set(this, "attrValue", value.join(","));
this.$set(this, "attrTxt", "已选择");
if (productSelect.stock == 0) {
this.$set(this.attr.productSelect, "cart_num", 0);
} else {
this.$set(this.attr.productSelect, "cart_num", 1);
}
} else if (!productSelect && productAttr.length) {
this.$set(
this.attr.productSelect,
"store_name",
goods.product.store_name
);
this.$set(this.attr.productSelect, "image", goods.product.image);
this.$set(this.attr.productSelect, "price", goods.product.price);
this.$set(this.attr.productSelect, "svip_price", productSelect.svip_price);
this.$set(this.attr.productSelect, "stock", 0);
this.$set(this.attr.productSelect, "unique", "");
this.$set(this, "uniqueValue", "");
this.$set(this.attr.productSelect, "cart_num", 0);
this.$set(this, "attrValue", "");
this.$set(this, "attrTxt", "请选择");
} else if (!productSelect && !productAttr.length) {
this.$set(
this.attr.productSelect,
"store_name",
goods.product.store_name
);
this.$set(this.attr.productSelect, "image", goods.product.image);
this.$set(this.attr.productSelect, "price", goods.product.price);
this.$set(this.attr.productSelect, "svip_price", productSelect.svip_price);
this.$set(this.attr.productSelect, "stock", goods.product.stock);
this.$set(this.attr.productSelect, "unique", goods.product.unique || "");
this.$set(this, "uniqueValue", goods.product.unique || "");
this.$set(this.attr.productSelect, "cart_num", 1);
this.$set(this, "attrValue", "");
this.$set(this, "attrTxt", "请选择");
} else if (productSelect && !productAttr.length) {
this.$set(this.attr.productSelect, "store_name", goods.product.store_name);
this.$set(this.attr.productSelect, "image", productSelect.image);
this.$set(this.attr.productSelect, "price", productSelect.price);
this.$set(this.attr.productSelect, "svip_price", productSelect.svip_price);
this.$set(this.attr.productSelect, "stock", productSelect.stock);
this.$set(this.attr.productSelect, "unique", productSelect.unique);
this.$set(this, "uniqueValue", productSelect.unique);
this.$set(this, "attrValue", value.join(","));
this.$set(this, "attrTxt", "已选择");
if (productSelect.stock == 0) {
this.$set(this.attr.productSelect, "cart_num", 0);
} else {
this.$set(this.attr.productSelect, "cart_num", 1);
}
}
this.goCart(productSelect);
},
goCart(productSelect) {
let that = this;
//如果有属性,没有选择,提示用户选择
if (
that.attr.productAttr.length &&
that.isOpen === true &&
productSelect.stock == 0
)
return that.$util.Tips({
title: "产品库存不足,请选择其它"
});
if (that.attr.productSelect.cart_num == 0) {
return that.$util.Tips({
title: '购买个数不能为0'
})
}
},
attrVal(val) {
this.$set(this.attr.productAttr[val.indexw], 'index', this.attr.productAttr[val.indexw].attr_values[val
.indexn]);
},
/**
* 属性变动赋值
*
*/
ChangeAttr: function(res) {
let productSelect = this.productValue[res];
this.currSku = res;
this.newVal = this.productValue[res];
if (productSelect) this.$set(this, "uniqueValue", productSelect.unique);
if (productSelect && productSelect.stock > 0) {
this.$set(this.attr.productSelect, "image", productSelect.image ? productSelect.image : this
.attrImage);
this.$set(this.attr.productSelect, "price", productSelect.price);
this.$set(this.attr.productSelect, "stock", productSelect.stock);
this.$set(this.attr.productSelect, "unique", productSelect.unique);
this.$set(this, "uniqueValue", productSelect.unique);
this.$set(this.attr.productSelect, "cart_num", 1);
this.$set(this, "attrValue", res);
} else {
this.$set(this.attr.productSelect, "image", productSelect.image ? productSelect.image : this
.attrImage);
this.$set(this.attr.productSelect, "price", productSelect.price);
this.$set(this.attr.productSelect, "stock", 0);
this.$set(this.attr.productSelect, "unique", "");
this.$set(this.attr.productSelect, "cart_num", 0);
this.$set(this, "attrValue", "");
}
},
updatePrice() {
console.log('改价');
},
// 重新支付
reOrderPay(item) {
uni.scanCode({
onlyFromCamera: true,
hideAlbum: true,
success: (res) => {
if (res.result) {
const regexWechat = /^(10|11|12|13|14|15)\d{16}$/; //微信条码正则 10-15开头18位
const regexPay = /^(25|26|27|28|29|30)\d{14,22}$/; //支付宝条码正则 25-30开头16-24位
let pay_type;
if (regexWechat.test(res.result)) pay_type = "micropay";
else if (regexPay.test(res.result)) pay_type = "alipayBar";
else {
return uni.showToast({
icon: 'none',
title: '请输入正确的支付码'
})
}
orderPay(item.group_order_id, {
type: pay_type,
auth_code: res.result
}).then(res => {
uni.showToast({
title: '支付成功',
icon: 'success'
})
}).catch(err => {
console.log(err);
Toast(err)
})
}
}
})
},
// 检测支付状态
micropayQuery(item) {
console.log(item);
micropayQueryApi({
order_sn: item.order_sn
}).then(res => {
uni.showToast({
title: '支付成功',
icon: 'success'
})
}).catch(err => {
console.log(err);
Toast(err)
})
},
// 提单
orderLading(item) {
orderLadingApi({
order_sn: item.order_sn,
staff_id: this.$store.state.app.userInfo.service.service_id
}).then(res => {
console.log(res);
Toast(res.message);
this.changeNavTab(1);
}).catch(err => {
console.log(err);
Toast(err);
})
},
// 添加购物车
scanShopCode() {
productLstApi(this.$store.state.app.userInfo.service.mer_id, {
bar_code: '6939710501092',
page: 1,
limit: 1,
staff_id: this.$store.state.app.userInfo.service.service_id
}).then(({ data }) => {
console.log(data);
}).catch(err => {
console.error(err);
})
uni.scanCode({
success: (res) => {
productLstApi(this.$store.state.app.userInfo.service.mer_id, {
bar_code: '6939710501092',
page: 1,
limit: 1,
staff_id: this.$store.state.app.userInfo.service.service_id
}).then(({ data }) => {
console.log(data);
})
}
})
},
// 立即下单
subOrder: function(event) {
if (this.cartList.valid.length == 0) return Toast('请先添加商品')
let selectValue = []
this.cartList.valid.forEach(el => {
el.list.forEach(goods => {
if (goods.check) {
selectValue.push(goods.cart_id)
}
})
})
if (selectValue.length > 0) {
this.scanPayCode(selectValue.join(','));
// uni.navigateTo({
// url: '/pages/users/order_confirm/index?cartId=' + selectValue.join(',')
// });
} else {
return this.$util.Tips({
title: '请选择产品'
});
}
},
// 扫描付款码
scanPayCode(cart_id) {
// return this.scanPay('151234567890123456', "micropay", cart_id);
uni.scanCode({
onlyFromCamera: true,
hideAlbum: true,
success: (res) => {
if (res.result) {
const regexWechat = /^(10|11|12|13|14|15)\d{16}$/; //微信条码正则 10-15开头18位
const regexPay = /^(25|26|27|28|29|30)\d{14,22}$/; //支付宝条码正则 25-30开头16-24位
let pay_type;
if (regexWechat.test(res.result)) pay_type = "micropay";
else if (regexPay.test(res.result)) pay_type = "alipayBar";
else {
return uni.showToast({
icon: 'none',
title: '请输入正确的支付码'
})
}
this.scanPay(res.result, pay_type, cart_id);
}
}
})
},
// 支付
async scanPay(code, pay_type, cart_id) {
// return console.log(code, pay_type, cart_id);
// 选择购物车信息生成订单信息
let res = await getOrderConfirm({
takes: [],
use_coupon: {},
use_integral: false,
cart_id: cart_id,
pay_type: pay_type
})
// 生成订单并支付
createOrder({
address_id: "",
key: res.data.key,
cart_id: cart_id,
pay_type: pay_type,
auth_code: code,
staff_id: this.$store.state.app.userInfo.service.service_id,
}).then(res => {
if (res.status == 200 && (res.message == "支付成功" || res.message == "success")) {
uni.showToast({
icon: "success",
title: res.message == 'success' ? '支付成功' : res.message
})
} else {
if (!res.data.group_order_sn) {
// order_id.value = res.data.result.order_id;
uni.showToast({
icon: 'error',
title: res.message
})
}
}
}).catch(err => {
uni.showToast({
icon: 'error',
title: err
})
})
},
// 购物车增加
addCart: function(goods, index) {
let that = this;
changeCartNum(goods.cart_id, {
cart_num: goods.cart_num + 1
}).then(res => {
goods.cart_num = Number(goods.cart_num) + 1
// that.cartTotalCount = Number(that.cartTotalCount) + 1;
if (goods.hasOwnProperty('productAttr') && goods.cart_num > goods.productAttr.stock) {
goods.cart_num = goods.productAttr.stock;
goods.numAdd = true;
goods.numSub = false;
return
} else {
goods.numAdd = false;
goods.numSub = false;
}
this.cartAllCheck('goodsCheck')
}).catch(error => {
that.$util.Tips({
title: error
});
// goods.cart_num = Number(goods.cart_num) - 1
})
},
goCat: function() {
let that = this;
changeCartNum(that.goods.cart_id, {
cart_num: that.goods.cart_num,
product_attr_unique: that.newVal.unique
}).then(res => {
if (that.goods.hasOwnProperty('productAttr') && that.goods.cart_num > that.goods
.productAttr.stock) {
that.goods.cart_num = that.goods.productAttr.stock;
that.goods.numAdd = true;
that.goods.numSub = false;
return
} else {
that.goods.numAdd = false;
that.goods.numSub = false;
}
that.onMyEvent();
that.getCartList(true);
that.isAllSelect = false
}).catch(error => {
that.$util.Tips({
title: error
});
// goods.cart_num = Number(goods.cart_num) - 1
})
},
// 购物车递减
subCart(goods) {
let status = false;
if (goods.cart_num < 1) status = true;
if (goods.cart_num <= 1) {
goods.cart_num = 1;
goods.numSub = true;
status = true;
} else {
// goods.cart_num = Number(goods.cart_num) - 1
// this.cartTotalCount = Number(this.cartTotalCount) - 1;
if (false == status) {
changeCartNum(goods.cart_id, {
cart_num: Number(goods.cart_num) - 1
}).then(res => {
goods.numSub = false;
goods.numAdd = false;
if (goods.cart_num <= 1) {
goods.numSub = true;
}
goods.cart_num = Number(goods.cart_num) - 1
// this.cartTotalCount = Number(this.cartTotalCount) - 1;
this.cartAllCheck('goodsCheck')
}).catch(error => {
this.$util.Tips({
title: error
});
})
}
}
},
getCartNum: function() {
let that = this;
getCartCounts({
staff_id: this.userInfo.service.service_id
}).then(res => {
that.cartTotalCount = res.data[0].count || 0;
});
},
// 购物车列表
getCartList: function(isChange) {
let that = this;
getCartList({
staff_id: this.userInfo.service.service_id
}).then(res => {
res.data.list.forEach((item, index) => {
item.allCheck = true
item.list.forEach((goods, j) => {
goods.check = true
if (goods.cart_num == 1) {
goods.numSub = true;
} else {
goods.numSub = false;
}
if (goods.cart_num == goods.productAttr.stock) {
goods.numAdd = true;
} else {
goods.numAdd = false;
}
})
})
this.cartList.valid = res.data.list
this.cartList.invalid = res.data.fail
if (res.data.list.length == 0 && res.data.list.length == 0) {
this.recommend = true;
// if (!this.hostProduct.length) {
// this.getHostProduct();
// }
} else {
this.recommend = false
}
const sku = {}
this.checkboxAllChange()
});
},
//订单列表
getOrderList() {
getOrderList({
staff_id: this.userInfo.service.service_id
}, this.userInfo.service.mer_id).then(res => {
this.orderList = res.data.list;
console.log(this.orderList);
})
},
// 商铺全选
storeAllCheck(item, index) {
// 店铺取消
if (item.allCheck) {
item.allCheck = false
item.list.forEach((el, index) => {
el.check = false
})
} else {
item.allCheck = true
item.list.forEach((el, index) => {
el.check = true
})
}
this.cartAllCheck('goodsCheck')
},
// 商品选中
goodsCheck(goods) {
goods.check = !goods.check
this.cartAllCheck('goodsCheck')
},
// 全选判断
cartAllCheck(type) {
let allArr = [];
let totalMoney = 0
let totalNum = 0
console.log(this.cartList)
this.cartList.valid.forEach((el, index) => {
if (type == 'goodsCheck') {
let tempArr = el.list.filter(goods => {
return goods.check == true
})
if (el.list.length == tempArr.length) {
el.allCheck = true
allArr.push(el)
} else {
el.allCheck = false
}
} else {
el.list.forEach((goods) => {
goods.check = this.isAllSelect
})
el.allCheck = this.isAllSelect
if (el.allCheck) allArr.push(el)
}
// 总金额 //总数
el.list.forEach(e => {
if (e.check) {
totalMoney = this.$util.$h.Add(totalMoney, this.$util.$h.Mul(e.productAttr
.price, e.cart_num))
totalNum += e.cart_num
}
})
})
this.cartCount = totalNum
this.selectCountPrice = totalMoney
// 全选
this.isAllSelect = allArr.length == this.cartList.valid.length ? true : false
},
// 购物车全选
checkboxAllChange() {
this.isAllSelect = !this.isAllSelect
this.cartAllCheck('cartCheck')
},
// 推荐列表
getHostProduct: function() {
let that = this;
if (that.loadend) return;
if (that.hotScroll) return;
that.loading = true;
that.loadTitle = "加载更多";
getProductHot(
that.hotPage,
that.hotLimit,
).then(res => {
let list = res.data.list || [];
that.hotPage++
that.hotScroll = res.data.list.length < that.hotLimit
that.hostProduct = that.hostProduct.concat(res.data.list)
that.loading = false;
that.loadTitle = that.hotScroll ? "我也是有底线的" : '加载更多';
});
},
// 失效商品展开
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].cart_id);
}
cartDel({
cart_id: ids
}).then(res => {
that.$util.Tips({
title: '清除成功'
});
that.getCartNum();
that.$set(that.cartList, 'invalid', []);
}).catch(res => {});
},
// 店铺优惠券
giveCoupon(item) {
let that = this;
let goodsArr = []
let couponList = [];
let activeList = [];
let ids = []
item.list.map(el => {
ids.push(el.product_id)
})
uni.showLoading({
title: '加载中...',
mask: true
});
getCoupons({
ids: ids.join(',')
}).then(res => {
goodsArr = res.data
getShopCoupons(item.mer_id).then(({
data
}) => {
uni.hideLoading();
couponList = goodsArr.concat(data)
this.$set(this.coupon, 'list', couponList);
this.$set(this.coupon, 'coupon', true);
}).catch(error => {})
});
},
ChangCouponsClone: function() {
this.$set(this.coupon, 'coupon', false)
},
ChangCouponsUseState(index) {
let that = this;
that.coupon.list[index].issue = true;
console.log(that.coupon.list[index])
},
// 复制
copyText(text) {
uni.setClipboardData({
data: text,
success: function(res) {
uni.showToast({
icon: 'none',
title: '复制成功',
});
}
});
},
navTo(item) {
if (item.paid == 0) return Toast('订单未支付!');
uni.navigateTo({
url: `/pages/admin/orderDetail/index?id=${item.order_id}&mer_id=${this.userInfo.service.mer_id}`
})
}
},
onReachBottom() {
this.recommend && this.getHostProduct();
},
// 滚动监听
onPageScroll(e) {
// 传入scrollTop值并触发所有easy-loadimage组件下的滚动监听事件
uni.$emit('scroll');
}
}
</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;
}
.icon-xiala1 {
display: inline-block;
transform: rotate(180deg);
font-size: 14rpx;
padding: 0 5rpx;
}
.shoppingCart .labelNav .item .iconfont {
font-size: 25rpx;
margin-right: 10rpx;
}
.t-color {
color: var(--view-theme);
}
.shoppingCart {
/* #ifndef MP */
padding-bottom: 250rpx;
/* #endif */
/* #ifdef MP */
padding-bottom: calc(0rpx+ constant(safe-area-inset-bottom));
padding-bottom: calc(0rpx + env(safe-area-inset-bottom));
/* #endif */
&.showFoot {
padding-bottom: calc(250rpx+ constant(safe-area-inset-bottom));
padding-bottom: calc(250rpx + env(safe-area-inset-bottom));
}
}
.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: 20rpx;
margin-bottom: 20rpx;
background-color: #fff;
padding-top: 0.1rpx;
}
.shoppingCart .noCart .pictrue {
text-align: center;
margin: 78rpx auto 56rpx auto;
padding-bottom: 60rpx;
}
.shoppingCart .noCart .pictrue image {
width: 414rpx;
height: 305rpx;
}
.shoppingCart .noCart .pictrue view {
color: #999;
}
.shoppingCart .list {
margin: 171rpx 0 20rpx;
}
.shoppingCart .list .item {
background-color: #fff;
margin-bottom: 15rpx;
.store-title {
display: flex;
align-items: center;
width: 100%;
padding: 0 30rpx;
height: 85rpx;
border-bottom: 1px solid #f0f0f0;
.checkbox {
width: 60rpx;
.iconfont {
font-size: 40rpx;
color: #CCCCCC;
}
.icon-xuanzhong1 {
color: var(--view-theme);
}
}
.info {
flex: 1;
display: flex;
align-items: center;
.iconfont {
font-size: 36rpx;
}
.name {
margin: 0 0 0 10rpx;
font-size: 28rpx;
color: #282828;
font-weight: bold;
}
.icon-xiangyou {
margin-top: 6rpx;
font-size: 22rpx;
color: #999;
}
}
.coupon-btn {
color: var(--view-theme);
font-size: 22rpx;
width: 100rpx;
line-height: 36rpx;
background: var(--view-minorColor);
border-radius: 18rpx;
text-align: center;
}
}
}
.vipImg {
width: 65rpx;
height: 28rpx;
margin-left: 10rpx;
image {
width: 100%;
height: 100%;
display: block;
}
}
.shoppingCart .list .item .picTxt {
width: 100%;
padding: 25rpx 30rpx;
position: relative;
align-items: center;
border-bottom: 1px solid #f0f0f0;
.checkbox {
width: 60rpx;
.iconfont {
font-size: 40rpx;
color: #CCCCCC;
}
.icon-xuanzhong1 {
color: var(--view-theme);
}
}
}
.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;
margin-left: 20rpx;
font-size: 28rpx;
color: #282828;
}
.shoppingCart .list .item .picTxt .buy_limit {
margin-top: 10rpx;
color: #E93323;
font-size: 22rpx;
}
.shoppingCart .list .item .picTxt .text .infor {
display: inline-block;
padding: 6rpx;
border-radius: 4rpx;
font-size: 24rpx;
color: #868686;
margin-top: 16rpx;
background-color: #F5F5F5;
max-width: 460rpx;
}
.shoppingCart .list .item .picTxt .text .money {
font-size: 32rpx;
color: #282828;
margin-top: 28rpx;
}
.shoppingCart .list .item .picTxt .carnum {
height: 47rpx;
position: absolute;
bottom: 30rpx;
right: 30rpx;
}
.shoppingCart .list .item .picTxt .carnum view {
border: 1px solid #a4a4a4;
min-width: 66rpx;
text-align: center;
height: 100%;
line-height: 46rpx;
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: 1px 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;
height: 230rpx;
background-color: #fafafa;
position: fixed;
padding: 0 30rpx;
box-sizing: border-box;
border-top: 1px solid #eee;
bottom: 0px;
padding-bottom: 150rpx;
padding-top: 30rpx;
}
.shoppingCart .footer.on {
// #ifndef H5
bottom: 0rpx;
// #endif
}
.shoppingCart .footer .checkAll {
font-size: 28rpx;
color: #282828;
margin-left: 16rpx;
}
.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;
background-color: var(--view-theme);
display: flex;
justify-content: center;
align-items: center;
}
.shoppingCart .footer .update-price {
width: 100rpx;
height: 60rpx;
line-height: 60rpx;
background-color: #e6852c;
}
.shoppingCart .footer .add-shop {
margin-left: 0;
width: 100%;
margin: 20rpx 0;
}
.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;
&.bt-color {
color: var(--view-theme);
border: 1px solid var(--view-theme);
}
}
.shoppingCart .footer .button form~form {
margin-left: 17rpx;
}
.allcheckbox {
display: flex;
align-items: center;
width: 260rpx;
.iconfont {
margin-right: 20rpx;
font-size: 40rpx;
color: #CCCCCC;
}
.icon-xuanzhong1 {
color: var(--view-theme);
}
}
.page-footer {
position: fixed;
bottom: 0;
z-index: 30;
display: flex;
align-items: center;
justify-content: space-around;
width: 100%;
height: calc(98rpx+ constant(safe-area-inset-bottom)); ///兼容 IOS<11.2/
height: calc(98rpx + env(safe-area-inset-bottom)); ///兼容 IOS>11.2/
box-sizing: border-box;
border-top: solid 1px #F3F3F3;
background-color: #fff;
box-shadow: 0px 0px 17rpx 1rpx rgba(206, 206, 206, 0.32);
padding-bottom: constant(safe-area-inset-bottom); ///兼容 IOS<11.2/
padding-bottom: env(safe-area-inset-bottom); ///兼容 IOS>11.2/
&.filter {
filter: blur(2rpx);
}
.foot-item {
display: flex;
width: max-content;
align-items: center;
justify-content: center;
flex-direction: column;
position: relative;
.count-num {
position: absolute;
display: flex;
justify-content: center;
align-items: center;
width: 40rpx;
height: 40rpx;
top: 0rpx;
right: -15rpx;
color: #fff;
font-size: 20rpx;
background-color: #FD502F;
border-radius: 50%;
padding: 4rpx;
}
}
.foot-item image {
height: 50rpx;
width: 50rpx;
text-align: center;
margin: 0 auto;
}
.foot-item .txt {
font-size: 24rpx;
}
}
.tabs-nav {
font-size: 32rpx !important;
.active {
color: #40ae36 !important;
}
}
.order-list {
background-color: #fff;
margin-top: 76rpx;
.item {
padding: 20rpx;
border-bottom: 1px solid #eee;
.top {
display: flex;
justify-content: space-between;
align-items: flex-end;
.sn {
font-weight: bold;
font-size: 26rpx;
}
.cahier {
&::before {
content: "收银";
font-weight: 400;
font-size: 20rpx;
padding: 2rpx 2rpx;
margin-right: 4rpx;
border: 1px solid #2ec479;
color: #2ec479;
border-radius: 3px;
}
}
.cahier2 {
&::before {
content: "平台";
font-weight: 400;
font-size: 20rpx;
padding: 2rpx 2rpx;
margin-right: 4rpx;
border: 1px solid #ff4a00;
color: #ff4a00;
border-radius: 3px;
}
}
.create-time {
font-size: 22rpx;
}
}
.shop {
display: flex;
justify-content: space-between;
.right {
flex-shrink: 0;
display: flex;
flex-direction: column;
justify-content: center;
.money {
font-size: 30rpx;
color: #ff4a00;
font-weight: bold;
}
.count {
font-size: 22rpx;
color: #999;
}
}
.left {
height: 140rpx;
display: flex;
align-items: center;
.shop-img {
width: 100rpx;
height: 100rpx;
border-radius: 10rpx;
margin-right: 10rpx;
flex-shrink: 0;
}
.shop-name {
font-size: 26rpx;
color: #333;
display: -webkit-box;
-webkit-box-orient: vertical;
overflow: hidden;
/* 将文本限制为三行 */
-webkit-line-clamp: 3;
}
}
}
.bottom {
display: flex;
justify-content: space-between;
font-size: 26rpx;
color: #777;
}
.b-button {
display: flex;
justify-content: flex-end;
margin-top: 20rpx;
button {
font-size: 26rpx;
background-color: #2ec479;
color: #fff;
padding: 10rpx 20rpx;
border-radius: 40rpx;
margin: 0 10rpx;
}
}
}
.item-active {
background-color: #efefef;
}
}
</style>