You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 
 
 

747 lines
18 KiB

<template>
<view>
<view class="content-right" style="height:100%;background: #fff;padding: 0 50rpx 180rpx;">
<view style="height: 80rpx;position: relative;">
<view v-if="isCheck" @tap="checkGoods('1')" style="border-radius: 10px;color: #fff;background: #088FEB;width: 130rpx;height: 60rpx;position: absolute;right: 0;line-height: 60rpx;text-align: center;">全部选中</view>
<view v-if="isCheck == false" @tap="checkGoods('2')" style="border-radius: 10px;color: #fff;background: #088FEB;width: 130rpx;height: 60rpx;position: absolute;right: 0;line-height: 60rpx;text-align: center;">全部取消</view>
</view>
<view class="right-box" v-for="(item,index) in shopList" :key="index">
<view class="box-left" @tap.stop="largeImg(item)">
<img class="img-radius" :src="item.productPicture" alt="" v-if="item.productPicture">
<view class="noPic" v-else>暂无图片</view>
</view>
<view class="box-right">
<view class="box-right-name">
{{item.productName == null ?'':item.productName}}
</view>
<view class="box-right-num">{{item.productSn==null?'':item.productSn}}</view>
<view class="box-right-num">供应商:{{item.supplierName == null ?'':item.supplierName}}</view>
<view class="box-right-price">
<view class="price-box" v-if="type==0">
<text>{{item.purchasePrice?item.purchasePrice:'暂无'}}</text>
<text>采购价</text>
</view>
<view class="price-box">
<text>{{item.wholesalePrice}}</text>
<text>批发价</text>
</view>
<view class="price-box">
<text>{{item.price}}</text>
<text>零售价</text>
</view>
</view>
</view>
<checkbox-group @tap="checkboxChange(item)">
<label>
<checkbox :checked="item.checked" class="checkbox" />
</label>
</checkbox-group>
</view>
</view>
<view class="bottom-box">
<view class="bottom-left" @tap="toggle('carPopup')">
<view class="bottom-left-box">
<uni-icons type="cart" size="20" color="#646566"></uni-icons>
<text class="uni-tab__text">已选择</text>
</view>
<text style="background-color:#ff0000;color:#fff;position: absolute;top: 0;right: 10rpx;"
class="uni-tab__dot">{{ carList.length }}</text>
</view>
<view class="bottom-right">
<button class="bottom-btn" style="width:100%" @tap="$refs.upNewPopup.open()">上新推送</button>
</view>
</view>
<!-- 上新提醒弹出 -->
<uni-popup ref="upNewPopup" background-color="#fff">
<view class="popup-pay-content" style="height:auto;">
<view class="content-list">
<view class="list-name">客户</view>
<view class="list-val">
<input type="text" @tap="goPopleList('khName')" placeholder="可选择客户" disabled
:value="khName.name" style="text-align: center;margin-top: 20rpx;">
<uni-icons type="close" @tap="clearkhName" v-if="khName!=''" size="18"
style="margin-left: 80rpx;line-height: 80rpx;"></uni-icons>
<view v-else style="margin-left: 80rpx;line-height: 80rpx;">
<uni-icons type="right" size="16"></uni-icons>
</view>
</view>
</view>
<view v-if="khName == ''">
<view class="popup-pay-title">
<text>选择推送群体</text>
</view>
<view v-if="customerCategoryList != null" class="popup-pay-container" @tap="checkUserClass('31','')">
<text style="display: inline-block">全部客户</text>
</view>
<view class="popup-pay-container" @tap="checkUserClass('0','')">
<text style="display: inline-block">全部客户(零售价)</text>
</view>
<view class="popup-pay-container" @tap="checkUserClass('1','')">
<text style="display: inline-block">全部客户(批发价)</text>
</view>
<view v-for="(item,index) in customerCategoryList" :key="index" @tap="checkUserClass('3',item)"
class="popup-pay-container">
<text style="display: inline-block">{{item.categoryName}}</text>
</view>
</view>
<view @tap="upNewRemind" v-else
style="height: 80rpx;background: blue;color: #fff;border-radius: 10px;text-align: center;line-height: 80rpx;margin-top: 20rpx;">
推送
</view>
</view>
</uni-popup>
<!-- 购物车弹出层 -->
<uni-popup ref="carPopup" background-color="#fff">
<view class="popup-content">
<view v-for="(item,index) in gwcList" style="position: relative;" :key="index">
<view class="popup-title">
<view class="popup-title-left">
<img class="img-radius" :src="item.productPicture" alt="" v-if="item.productPicture">
<view class="noPic" v-else>暂无图片</view>
</view>
<view class="popup-title-right">
<view class="popup-title-right-box" style="color: #088FEB;">{{item.productName}}</view>
<view class="popup-title-right-box">{{item.productSn}}</view>
<view class="popup-title-right-box" style="color: darkorange;" @tap="inputDialogToggle">
<text style="margin-right:20rpx;">¥{{item.price}}</text>
<view style="position: absolute;top: 30rpx;right: 30rpx;" @tap.stop="delShop(item.id)">
<uni-icons color="red" type="trash" size="26"></uni-icons>
</view>
</view>
</view>
</view>
</view>
</view>
<view class="popup-bottom">
<view class="popup-bottom-left">
<text>共 {{carType}} 款</text>
</view>
<view class="popup-bottom-right">
<view class="bottom-btn" @tap="closeCar">关闭</view>
</view>
</view>
</uni-popup>
<!-- 弹出多图轮播 -->
<uni-popup ref="imgPopup" background-color="#fff">
<view class="showImg-box">
<swiper indicator-dots class="swiper-box" @change="lunbochange" circular autoplay
:current="swiperDotIndex">
<swiper-item v-for="(item, index) in bigImg" :key="index">
<view class="swiper-item">
<image mode='aspectFit' show-menu-by-longpress :src="item.productPicture" alt=""
style="width: 100%;height: 100%;border-radius: 10px;" />
</image>
</view>
</swiper-item>
</swiper>
</view>
</uni-popup>
</view>
</template>
<script>
export default {
components: {},
data() {
return {
bigImg: [],
swiperDotIndex: 0,
canvasshow: false,
indexList: [],
isCheck:true,
pageNum: 1, //分页的页码
shopList: [],
info: 0,
classId: '',
gateType: '',
goodsList: [],
categoryId: '', //分类id
searchName: '', //搜索框输入值
shopId: '', //店铺id,
checkbox: '', //需要分享的商品id
id: '',
carList: [],
zheng: '',
fu: '',
khName: [],
carNum: 0,
carType: 0,
type: '',
gwcList: [],
data: {},
height: 0,
base64: '',
shareSuccess: false,
tempFilePath: '',
mini_program_openid: '',
unionid: '',
official_account_openid: '',
customerCategoryList: [],
FWHPic: 'https://jewel-shop.oss-cn-beijing.aliyuncs.com/f2ba2080aaa54c618c2e47df4f220087.png'
}
},
onLoad(option) {
this.geetGoodsInfo(option.id)
this.getCustomerCategoryList()
},
methods: {
//获取客户分类
getCustomerCategoryList() {
this.tui.request("/app/customerCategory/getCustomerCategoryListByShopId", "POST", {
shopId: uni.getStorageSync('shopId')
}, false, true).then((res) => {
if (res.code == 200) {
if (res.result.length > 0) {
this.customerCategoryList = res.result
for (let i = 0; i < this.customerCategoryList.length; i++) {
let data = {
categoryName: this.customerCategoryList[i].categoryName,
categoryId: this.customerCategoryList[i].id,
categoryPrice: ""
}
this.customerCategoryList[i] = data
}
} else {
this.customerCategoryList = null
}
} else {
this.tui.toast(res.message)
}
}).catch((res) => {})
},
geetGoodsInfo(id){
this.tui.request("/app/purchase/getPurchaseAllData", "post", {
id: id
}, false, true).then((res) => {
if (res.code == 200) {
for (var i = 0; i < res.result.purchaseDetails.length; i++) {
if (res.result.purchaseDetails != '') {
res.result.purchaseDetails[i].checked = false
}
}
this.$nextTick(() => {
this.shopList = res.result.purchaseDetails
})
} else {
this.tui.toast(res.message)
}
}).catch((res) => {})
},
lunbochange(e) {
this.current = e.detail.current
},
largeImg(img) {
if ((img.productPicture == null && img.productPictures == null) || (img.productPicture == '' && img.productPictures == null)) {
this.tui.toast("暂无可展示的图片", 300)
return
}
this.bigImg = []
if (img.productPicture != null) {
let data = {
productPicture: img.productPicture
}
this.bigImg.push(data)
}
if (img.productPictures != null) {
for (let i = 0; i < img.productPictures.length; i++) {
this.bigImg.push(img.productPictures[i])
}
}
this.$refs.imgPopup.open()
},
//上新推送按钮
upNewRemind() {
this.checkUserClass('4')
this.$refs.upNewPopup.close()
},
checkUserClass(type, item) {
if(this.carList.length == 0){
this.tui.toast('请选择商品后再推送')
return
}
let that = this;
if (type == '31') {
for (let i = 0; i < this.customerCategoryList.length; i++) {
this.upNew('3',this.customerCategoryList[i])
}
//给没有客户价格的客户发送
this.upNew('5','')
} else if (type == '3') { //某一个客户价格
this.upNew('3',item)
} else if (type == '0') { //零售价
this.upNew('0','')
} else if (type == '1') { //批发价
this.upNew('1','')
} else if (type == '4') { //单独给一个客户发送
this.upNew('3',this.khName)
}
},
upNew(type,item){
let that = this;
this.$refs.upNewPopup.close()
this.data = {
shareType: '2', //2 分享勾选商品
shareProductId: this.carList //勾选商品的id string类型 中间通过”,“连接
}
this.data.priceType = type == '5' ?'1' : type == '4' ? ((this.khName.categoryId != '' && this.khName.categoryId != null && this.khName.categoryId != 'null') ? '3' : '1') : type
if(type == '3'){
let obj = {
id: item.categoryId,
name: item.categoryName,
userId: this.khName.userId,
customId:this.khName.id,
mini_program_openid :this.khName.mini_program_openid,
unionid:this.khName.unionid,
official_account_openid:this.khName.official_account_openid
}
this.data.scene = JSON.stringify(obj)
}
this.tui.request("/app/productShare/save", "POST", this.data, false, true).then((res) => {
if (res.code == 200) {
this.khid = res.result.id
let content = {
thing3:'【'+uni.getStorageSync('shopName')+'】'+'上新啦!点击查看详情',
time2:res.result.createTime
}
this.tui.request("/social/wechat/sendWechatTempMessage", "post", {
tempId:'M45X8AmPi58c16M9YVTMEOhwEVEa9s5md-6i3TwjpRQ',
title:'店铺上新',
content:JSON.stringify(content),
pagePath:'package1/index/downStearmList?khid=' + this.khid + '&userId=' + this.khName.userId +
'&shareType=' + this.data.shareType + '&mini_program_openid=' + this.khName.miniProgramOpenid +
'&unionid=' + this.khName.unionid + '&official_account_openid=' + this.khName.officialAccountOpenid + '&customId=' + this.khName.id,
upNewType:(type == '0' || type == '1')?type:'',
userId:type == '4'?this.khName.userId:"",
categoryId:type == '4'? this.khName.categoryId : item.categoryId?item.categoryId:'',
isAll:type== '5'?'1':''
}, false, false).then((res) => {
if (res.code == 200) {
this.tui.toast("推送成功")
uni.navigateBack({
delta: 3
})
} else {
this.tui.toast(res.message)
}
}).catch((res) => {})
} else {
this.tui.toast(res.message)
}
}).catch((res) => {})
},
clearkhName() {
this.khName = ''
this.$forceUpdate()
},
goPopleList() {
uni.navigateTo({
url: '/package1/index/peopleList?popleType=khName'
})
},
//选中商品
checkboxChange(item) {
item.checked = !item.checked
if (this.carList.indexOf(item.productId) != -1) {
this.carList.splice(this.carList.indexOf(item.productId), 1)
} else {
this.carList.push(item.productId)
}
if (this.gwcList.length == 0) {
this.gwcList.push(item)
} else {
for (let i = 0; i < this.gwcList.length; i++) {
if (this.gwcList[i].productId == item.productId) {
this.gwcList.splice(i, 1)
} else {
if (this.gwcList.length == (i + 1)) {
this.gwcList.push(item)
return
}
}
}
}
},
checkGoods(type){
for(let i=0;i<this.shopList.length;i++){
this.checkboxChange(this.shopList[i])
}
if(type == '1'){
this.isCheck = false
}else{
this.isCheck = true
}
},
//关闭购物车弹窗
closeCar() {
this.$refs.carPopup.close()
}
}
}
</script>
<style lang="scss">
page {
height: 100%;
}
.page1 {
display: flex;
flex-direction: column;
height: 100%;
}
.uni-tab__dot {
padding: 0 4px;
line-height: 15px;
color: #ffffff;
text-align: center;
font-size: 12px;
background-color: #ff0000;
border-radius: 15px;
}
.uni-tab__text {
font-size: 12px;
color: #646566;
}
.title-box {
background: #fff;
position: fixed;
z-index: 99;
width: 100%;
top: 0;
}
.bottom-box {
width: 100%;
height: 120rpx;
position: fixed;
bottom: 0;
display: flex;
background: #fff;
z-index: 98;
}
.bottom-left {
width: 15%;
position: relative;
}
.bottom-right {
width: 85%;
display: flex;
.bottom-btn {
margin: 0;
padding: 0;
width: 45%;
line-height: 35px;
height: 70rpx;
text-align: center;
margin-top: 10rpx;
color: #fff;
font-size: 28rpx;
}
.bottom-btn:first-child {
background: linear-gradient(90deg, #FF9797, #FFC1E0);
border-top-left-radius: 70rpx;
border-bottom-left-radius: 70rpx;
margin-left: 20rpx;
}
.bottom-btn:last-child {
background: linear-gradient(90deg, #60F3FF, #088FEB);
border-top-right-radius: 70rpx;
border-bottom-right-radius: 70rpx;
}
}
.bottom-left-box {
display: flex;
flex-direction: column;
text-align: center;
}
.content-box {
background: #fff;
flex: 1;
display: flex;
margin-top: 113rpx;
overflow: scroll;
}
.content-left {
width: 170rpx;
background: #eee;
height: 100%;
overflow: scroll;
}
.left-box {
width: 100%;
height: 90rpx;
font-size: 30rpx;
text-align: center;
line-height: 90rpx;
border-bottom: 1px solid #fff;
}
.left-box-hover {
width: 100%;
height: 90rpx;
font-size: 30rpx;
text-align: center;
line-height: 90rpx;
border-bottom: 1px solid #fff;
background-color: #fff;
}
.red {
border-right: 3px solid red;
}
.content-right {
flex: 1;
height: 100%;
overflow-y: scroll;
}
.right-box {
width: 100%;
height: 240rpx;
display: flex;
border-bottom: 1px solid #eee;
position: relative;
}
.box-left {
width: 130rpx;
height: 131rpx;
background-size: 100%;
margin: 25rpx 30rpx 35rpx 10rpx;
border-radius: 20rpx;
}
.box-left img {
width: 100%;
height: 100%;
}
.box-right {
margin-top: 17rpx;
}
.box-right-name {
font-size: 30rpx;
font-weight: bold;
}
.box-right-num {
padding: 5rpx 0;
color: #777;
}
.box-right-price {
display: flex;
font-size: 25rpx;
}
.checkbox {
width: 40rpx;
height: 40rpx;
position: absolute;
top: 20rpx;
right: 30rpx;
}
.price-box {
display: flex;
flex-direction: column;
margin-right: 20rpx;
}
.price-box text:first-child {
color: #ffa200
}
.uni-tab__cart-button-right,
.uni-tab__cart-sub-right {
display: none;
flex: none;
}
.popup-content {
align-items: center;
justify-content: center;
padding: 15px;
height: 1200rpx;
background-color: #fff;
margin-bottom: 30rpx;
overflow: scroll;
}
.popup-title-right-box {
height: 50rpx;
line-height: 50rpx;
}
.popup-title-right {
width: 400rpx;
margin-left: 30rpx;
}
.popup-title-left {
width: 150rpx;
height: 150rpx;
}
.popup-title-left image {
width: 150rpx;
height: 150rpx;
}
.popup-title {
display: flex;
height: 180rpx;
border-bottom: 1px solid #eee;
margin-top: 20rpx;
}
.popup-bottom {
width: 95%;
height: 100rpx;
position: fixed;
bottom: 0;
left: 2.5%;
display: flex;
z-index: 99;
background: #fff;
}
.popup-bottom-left {
width: 50%;
line-height: 80rpx;
}
.popup-bottom-right {
width: 50%;
line-height: 100rpx;
.bottom-btn {
width: 70%;
line-height: 35px;
height: 70rpx;
text-align: center;
/* margin-top: 10rpx; */
color: #fff;
font-size: 28rpx;
margin: 0 auto;
background: linear-gradient(90deg, #60F3FF, #088FEB);
border-radius: 70rpx;
}
}
.shop-mask {
width: 100%;
height: 190rpx;
position: absolute;
top: 0;
left: 0;
background: rgba(0, 0, 0, 0.1);
z-index: 99;
}
.popup-pay-content {
align-items: center;
justify-content: center;
padding: 15px;
width: 500rpx;
height: 800rpx;
overflow: scroll;
background-color: #fff;
}
.popup-pay-title {
margin-top: 20rpx;
font-size: 36rpx;
font-weight: bold;
text-align: center;
position: relative;
}
.popup-pay-container {
margin-top: 20rpx;
height: 100rpx;
border-radius: 10px;
background: #088FEB;
line-height: 100rpx;
text-align: center;
border-bottom: 1px solid #eee;
border-top: 1px solid #eee;
color: #fff;
}
.noPic {
border-radius: 10px;
width: 130rpx;
height: 130rpx;
text-align: center;
line-height: 140rpx;
color: #777;
background: #eee;
}
.content-list {
width: 100%;
display: flex;
height: 80rpx;
border-bottom: 1px solid #eee;
}
.list-name {
width: 100rpx;
text-align: left;
line-height: 80rpx;
height: 80rpx;
font-size: 36rpx;
}
.list-val {
width: 345rpx;
height: 80rpx;
line-height: 80rpx;
display: flex;
}
.showImg-box {
width: 700rpx;
height: 1000rpx;
border-radius: 10px;
}
.swiper-box {
height: 1000rpx;
}
.swiper-item {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
height: 1000rpx;
color: #fff;
background-color: #cee1fd;
border-radius: 10px;
}
</style>