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.
 
 
 
 
 

920 lines
24 KiB

<template>
<view class="page1">
<view class="title-box" style="height:8%;">
<uni-search-bar class="uni-mt-10" radius="5" placeholder="商品名称/货号/供应商" cancelButton="none"
@blur="search" @clear="clearSearch" />
</view>
<view class="content-left" style="height: 84%;float: left;position: fixed;top: 8%;">
<view class="left-box" v-if="gateType == ''" v-for="(item, index) in indexList" :key="index"
:class="item.parentId ? 'left-box-hover':''" @tap="clickLeftBtn(index)">
<text style="width: 100%;height: 90rpx;line-height: 90rpx;display: inline-block;overflow: hidden;"
:class="item.parentId ? 'red' :''">{{item.categoryName}}</text>
</view>
</view>
<view class="content-right" style="width: 570rpx;background: #fff;margin:0 0 0 170rpx;padding-top: 16%;">
<view class="right-box" v-for="(item,index) in shopList" :key="index" @tap="toggle('bottom',item)">
<!-- 当商品的delFlag=0和未入库状态时,显示此遮罩,点击弹出弹窗提示不能操作 -->
<!-- <view class="shop-mask" v-if="item.delFlag == 0 || item.purchasePrice==null || item.inStorageStatus == 0" @tap.stop="clickMask(item)"></view> -->
<view class="box-left">
<view v-if="(item.hasCheck!= null && item.hasCheck!= undefined)" style="position: absolute;color: #fff;background: red;width: 45rpx;height: 40rpx;font-size: 20rpx;text-align: center;line-height: 40rpx;border-radius: 5px;">
已选
</view>
<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.productSn==null?'':item.productSn}}
<text v-if="item.productName">({{item.productName == null ?'':item.productName}})</text>
<text style="color: red;" v-if="item.delFlag == 0">(已下架)</text>
</view>
<view class="box-right-num">{{item.supplierName == null ?'':item.supplierName}}</view>
<view class="box-right-price" v-if="shopId != '1960543009070256129'">
<view class="price-box" v-if="storageType== 0">
<text>{{item.inStorageStatus==0?'待入库':item.purchasePrice == null ?'新商品':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 class="price-box" @tap.stop="seeStockCount(item.stockCount,item.minusStockCount)">
<text>{{item.stockCount + item.minusStockCount}}</text>
<view>
库存
<uni-icons type="help" size="15"></uni-icons>
</view>
</view>
</view>
<view class="box-right-price" v-else>
<view class="price-box" v-if='shopOwnerPhone == username || username == item.createBy'>
<text>{{item.inStorageStatus==0?'待入库':item.purchasePrice == null ?'新商品':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 class="price-box" @tap.stop="seeStockCount(item.stockCount,item.minusStockCount)">
<text>{{item.stockCount + item.minusStockCount}}</text>
<view>
库存
<uni-icons type="help" size="15"></uni-icons>
</view>
</view>
</view>
</view>
</view>
<view class="right-box" v-for="(item,index) in shopList1" :key="index" @tap="toggle('bottom',item)">
<!-- 当商品的delFlag=0和未入库状态时,显示此遮罩,点击弹出弹窗提示不能操作 -->
<!-- <view class="shop-mask" v-if="item.delFlag == 0 || item.purchasePrice==null || item.inStorageStatus == 0" @tap.stop="clickMask(item)"></view> -->
<view class="box-left">
<view v-if="(item.hasCheck!= null && item.hasCheck!= undefined)" style="position: absolute;color: #fff;background: red;width: 45rpx;height: 40rpx;font-size: 20rpx;text-align: center;line-height: 40rpx;border-radius: 5px;">
已选
</view>
<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.productSn}}
<text v-if="item.productName">({{item.productName == null ?'':item.productName}})</text>
<text style="color: red;" v-if="item.delFlag == 0">(已下架)</text>
</view>
<view class="box-right-num">{{item.supplierName == null ?'':item.supplierName}}</view>
<view class="box-right-price" v-if="shopId != '1960543009070256129'">
<view class="price-box" v-if="storageType== 0">
<text>{{item.inStorageStatus==0?'待入库':item.purchasePrice == null ?'新商品':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 class="price-box" @tap.stop="seeStockCount(item.stockCount,item.minusStockCount)">
<text>{{item.stockCount + item.minusStockCount}}</text>
<view>
库存
<uni-icons type="help" size="15"></uni-icons>
</view>
</view>
</view>
<view class="box-right-price" v-else>
<view class="price-box" v-if="shopOwnerPhone == username || username == item.createBy">
<text>{{item.inStorageStatus==0?'待入库':item.purchasePrice == null ?'新商品':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 class="price-box" @tap.stop="seeStockCount(item.stockCount,item.minusStockCount)">
<text>{{item.stockCount + item.minusStockCount}}</text>
<view>
库存
<uni-icons type="help" size="15"></uni-icons>
</view>
</view>
</view>
</view>
</view>
<view style="width: 100%;height: 136rpx;"></view>
<u-loadmore :status="status" />
</view>
<view class="bottom-box" style="position: fixed;bottom: 0;">
<view class="bottom-left" >
<!-- <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.size}}</text> -->
</view>
<view class="bottom-right">
<view class="bottom-btn" @tap="backPrevPage">选好了</view>
</view>
</view>
<!-- 购物车弹出层 -->
<uni-popup ref="carPopup" background-color="#fff">
<view class="popup-content">
<view v-for="(item,index) in stockList" :key="index" style="position: relative;margin-top: 60rpx;">
<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 v-if="item.productName != null" 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">
<view style="position: absolute;top: 30rpx;right: 30rpx;" @tap.stop="delShop(item)">
<uni-icons color="red" type="trash" size="26"></uni-icons>
</view>
</view>
</view>
</view>
<view class="popup-container" v-for="(item1,index1) in item.checkStockAttributeVos" :key="index1">
<view class="checkList" style="padding-bottom:160rpx;">
<!-- <view style="margin-right:5%;" @tap="delShopSpec(item.id,item1.attributeList)">
<uni-icons color="red" type="minus" size="26"></uni-icons>
</view> -->
<view class="checkList-box">
{{item1.attributeList | sliceMsg}}
</view>
<view class="checkList-box">
{{item1.stockCount}}
</view>
<uni-number-box min="-10000" max="100000" v-model="item1.pdNum" />
</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="this.$refs.carPopup.close()">关闭</view>
</view>
</view>
</view>
</uni-popup>
<!-- 显示正负库存弹窗 -->
<uni-popup ref="showPopup" background-color="#fff">
<view class="popup-pay-content" style="width: 550rpx;">
<view class="popup-pay-title">
<text>库存数</text>
</view>
<view style="width: 100%;height: 150rpx;">
<view
style="width: 200rpx;height: 130rpx;border: 3px solid #FFE4C4;border-radius: 10px;margin-top: 20rpx;padding-top: 20rpx;display: flex;flex-direction: column;text-align: center;float: left;margin-left: 20rpx;">
<text style="font-weight: bold;">
正数库存
</text>
<text style="font-size: 30rpx;color: #000;font-weight: bold;">
{{zheng}}
</text>
</view>
<view
style="width: 200rpx;height: 130rpx;border: 3px solid #FFE4C4;border-radius: 10px;margin-top: 20rpx;padding-top: 20rpx;display: flex;flex-direction: column;text-align: center;float: left;margin-left: 40rpx;">
<text style="font-weight: bold;">
负数库存
</text>
<text style="font-size: 30rpx;color: #000;font-weight: bold;">
{{fu}}
</text>
</view>
</view>
<view class="popup-pay-container" style="display: flex;margin-top: 50rpx;background: #89CFF0;">
<view @tap='$refs.showPopup.close()'
style="flex:1;text-align: center;border-right: 1px solid #eee;background: #088FEB;font-size:32rpx;">
确认
</view>
</view>
</view>
</uni-popup>
</view>
</template>
<script>
import base from '@/utils/ossUploadFile/base64.js';
export default {
components: {},
data() {
return {
indexList: [],
status: 'loadmore',
pageNum: 1, //分页的页码
shopList: [],
shopList1: [],
shopOwnerPhone:uni.getStorageSync('shopOwnerPhone'),
username:uni.getStorageSync('username'),
carPages:1,
zheng:'',
fu:'',
pages: 1,
totalPages: 0,
info: 0,
categoryId: '', //分类id
searchName: '', //搜索框输入值
shopId: '', //店铺id,
carList: new Map(),
attributeList: [],
purchasePrice: 0,
storageType: '',
carType: 0,
type: '',
productId:'',
pdList:[],
stockList:[],
height:0,
gateType:''
}
},
filters: {
sliceMsg(val) {
var name = ''
if (typeof(val) == 'string') {
let newObj = JSON.parse(val)
for (let as in newObj) {
name += newObj[as] + '/'
}
}
return name;
},
maxNum(val) {
if (val >= 10) {
return 10
} else if (val < 0) {
return 0
}
}
},
onReachBottom() {
if (this.pageNum >= this.pages) return;
this.status = 'loading';
this.pageNum ++
if(this.gateType == 'search'){
this.getShareList('search');
}else{
this.getShareList();
}
},
onShow(){
let that = this;
this.pdList = this.pdList
this.shopId = uni.getStorageSync('shopId')
for(let i = 0;i<this.shopList.length;i++){
if(this.shopList[i].id == this.pdList.id){
this.shopList[i].hasCheck = true
}
}
for(let i = 0;i<this.shopList1.length;i++){
if(this.shopList1[i].id == this.pdList.id){
this.shopList1[i].hasCheck = true
}
}
if(this.pdList.saleDetailQueryDTO){
if (this.carList.size == 0) { //当前页没有数据
let obj = {
id: this.pdList.id,
productName: this.pdList.productName,
productPicture: this.pdList.productPicture,
productSn: this.pdList.productSn,
supplierName:this.pdList.supplierName,
stockLogList: new Map(),
}
for (let m = 0; m < this.pdList.saleDetailQueryDTO.length; m++) {
obj.stockLogList.set(this.pdList.saleDetailQueryDTO[m].attributeList, this.pdList.saleDetailQueryDTO[m])
}
this.carList.set(this.pdList.id, obj)
} else { //当前页有数据
if (this.carList.has(this.pdList.id) == true) { //商品相同
for (let m = 0; m < this.pdList.saleDetailQueryDTO.length; m++) {
this.carList.get(this.pdList.id).stockLogList.set(this.pdList.saleDetailQueryDTO[m].attributeList,this.pdList.saleDetailQueryDTO[m])
}
} else { //商品不同
let obj = {
id: this.pdList.id,
productName: this.pdList.productName,
productPicture: this.pdList.productPicture,
productSn: this.pdList.productSn,
supplierName:this.pdList.supplierName,
stockLogList: new Map(),
}
for (let m = 0; m < this.pdList.saleDetailQueryDTO.length; m++) {
obj.stockLogList.set(this.pdList.saleDetailQueryDTO[m].attributeList, this.pdList.saleDetailQueryDTO[m])
}
this.carList.set(this.pdList.id, obj)
}
}
}
this.carPages = 1
this.stockList = []
this.$forceUpdate()
//this.stockSelect()
},
onLoad(option) {
this.height = wx.getSystemInfoSync().windowHeight
this.getGategoryList()
this.storageType = uni.getStorageSync('type')
},
methods: {
seeStockCount(zheng,fu){
this.zheng = zheng;
this.fu = fu;
this.$refs.showPopup.open()
},
//初始化获取分类列表
getGategoryList() {
this.tui.request("/app/productCategory/list", "get", {}, false, true).then((res) => {
if (res.code == 200) {
this.indexList = res.result;
for (var i = 0; i < this.indexList.length; i++) {
if (i == 0) {
this.indexList[i].parentId = true
} else {
this.indexList[i].parentId = false
}
}
this.categoryId = this.indexList[0].id
this.getShareList();
} else {
this.tui.toast(res.message)
}
}).catch((res) => {})
},
//点击底部选好了,返回上一页
backPrevPage() {
var data = []
this.carList.forEach(item => {
data.push(item)
item.stockLogList1 = []
item.stockLogList.forEach(item1 => {
item.stockLogList1.push(item1)
})
})
uni.navigateBack({
delta: 1
})
},
getShareList(type) {
let data = {}
let that = this
if(type=='search'){
this.gateType = 'search'
data = {
checkStockId:uni.getStorageSync('stockId'),
categoryId: "",
searchStr: this.searchName,
pageNum: this.pageNum,
pageSize: '10'
}
}else{
this.gateType = ''
data = {
checkStockId:uni.getStorageSync('stockId'),
categoryId: this.categoryId,
searchStr: this.searchName,
pageNum: this.pageNum,
pageSize: '10'
}
}
this.tui.request("/app/product/getShareList", "POST", data, false, false).then((res) => {
if (res.code == 200) {
if (type == 'search') {
this.shopList = []
this.status = 'nomore';
if (this.pages == 1) {
this.shopList1 = res.result.records
} else {
this.shopList1 = [...this.shopList1, ...res.result.records]
}
for(let i = 0;i<this.shopList1.length;i++){
if(this.shopList1[i].checkStockAttributeVos != null){
this.shopList1[i].hasCheck = true
}
}
this.pages = res.result.pages
} else {
this.shopList1 = []
this.status = 'nomore';
if (this.pages == 1) {
this.shopList = res.result.records
} else {
this.shopList = [...this.shopList, ...res.result.records]
}
for(let i = 0;i<this.shopList.length;i++){
if(this.shopList[i].checkStockAttributeVos != null){
this.shopList[i].hasCheck = true
}
}
this.pages = res.result.pages
}
} else {
this.tui.toast(res.message)
}
}).catch((res) => {})
},
//弹出购物车或者商品规格选择弹窗
toggle(type, item) {
if (type == 'carPopup') {
this.$refs.carPopup.open('bottom')
} else {
this.productId = item.id
// this.checkGoods(item);
uni.navigateTo({
url: '/package2/stock/stockDetail?item=' + JSON.stringify(item)
})
}
},
//未入库遮罩
clickMask(item) {
let title = ''
if (item.delFlag == 0) {
title = '请将商品上架后再操作!'
} else {
title = '请将上次入库的采购价维护后再进行操作!'
}
uni.showToast({
title: title,
icon: 'none'
})
},
/* stockSelect(){
this.tui.request("/app/checkStock/getCheckStock", "POST", {
checkStockId:uni.getStorageSync('stockId'),
pageNum:this.carPages,
pageSize:10
}, false, false).then((res) => {
if (res.code == 200) {
if (this.carPages == 1) {
this.stockList = res.result.checkStockDetailVoList.records
} else {
this.stockList = [...this.stockList, ...res.result.checkStockDetailVoList.records]
}
this.carType = this.stockList.length
if(this.carPages >=res.result.checkStockDetailVoList.pages)return
this.carPages++
this.stockSelect()
} else {
this.tui.toast(res.message)
}
}).catch((res) => {})
}, */
//扫一扫功能
scanCode() {
uni.scanCode({
success: (res) => {
this.tui.request("/app/product/getById/" + base.decode(res.result.split(',')[0]), "POST", {
}, false, true).then((res1) => {
if (res1.code == 200) {
let shopId = base.decode(res.result.split(',')[1])
if(shopId == uni.getStorageSync('shopId')){
uni.navigateTo({
url: '/package2/stock/stockDetail?item=' + JSON.stringify(res1.result)
})
}else{
this.tui.toast('您的店铺中暂无该商品!')
}
} else {
this.tui.toast(res1.message)
}
}).catch((res) => {})
},
fail: (res) => {
uni.showToast({
title: '扫描失败',
icon: 'none'
})
}
})
},
//顶部搜索框
search(e) {
if(e.value == ''){
this.pageNum = 1
this.searchName = ""
this.getShareList()
}else{
this.pageNum = 1
this.searchName = e.value
this.getShareList('search')
}
},
//清空搜索条件
clearSearch(){
this.searchName = ''
this.getShareList()
},
//点击左侧菜单切换
clickLeftBtn(index) {
for (var i = 0; i < this.indexList.length; i++) {
if (i == index) {
this.indexList[i].parentId = true
} else {
this.indexList[i].parentId = false
}
}
this.categoryId = this.indexList[index].id
this.pageNum = 1
this.searchName = ""
this.shopList1 = []
this.shopList = []
this.getShareList()
},
//删除整条商品
delShop(item) {
var that = this;
let dataList = []
var itemData;
itemData = {
checkStockId:uni.getStorageSync('stockId'),
productId: item.productId,
productName:item.productName,
productPicture:item.productPicture,
productSn:item.productSn,
checkStockAttributeVos:[]
}
dataList.push(itemData)
this.tui.request("/app/checkStockDetail/addCheckStockDetail", "POST", dataList, false, false).then((res) => {
if (res.code == 200) {
/* this.stockSelect() */
} else {
this.tui.toast(res.message)
}
}).catch((res) => {})
}
}
}
</script>
<style lang="scss">
page {
height: 100%;
}
.page1 {
/* height: 100%; */
font-size: 28rpx;
}
.uni-tab__dot {
padding: 0 8rpx;
line-height: 30rpx;
color: #ffffff;
text-align: center;
font-size: 24rpx;
background-color: #ff0000;
border-radius: 30rpx;
}
.popup-content {
align-items: center;
justify-content: center;
padding: 30rpx;
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-container {
width: 100%;
background: #fff;
height: 50rpx;
}
.uni-tab__text {
font-size: 24rpx;
color: #646566;
}
.title-box {
background: #fff;
position: fixed;
top: 0;
width: 100%;
z-index: 99;
}
.bottom-box {
width: 100%;
height: 120rpx;
display: flex;
background: #fff;
z-index: 98;
}
.bottom-left {
/* width: 15%; */
position: relative;
padding-top: 20rpx;
}
.bottom-right {
width: 100%;
padding-top: 20rpx;
.bottom-btn {
width: 85%;
line-height: 70rpx;
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;
}
}
.bottom-left-box {
display: flex;
flex-direction: column;
text-align: center;
}
.content-box {
background: #fff;
flex: 1;
display: flex;
height: 93%;
}
.content-left {
width: 170rpx;
background: #eee;
height: 89%;
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%;
}
.right-box {
width: 100%;
height: 190rpx;
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;
}
.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;
}
.name {
font-size: 30rpx;
width: 50%;
float: left;
height: 70rpx;
line-height: 70rpx;
}
.checkList {
display: flex;
height: 50rpx;
font-size: 28rpx;
line-height: 50rpx;
margin: 20rpx 0;
}
.checkList-box {
height: 50rpx;
width: 60%;
}
.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: 70rpx;
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);
}
.noPic{
width: 150rpx;
height: 150rpx;
border-radius: 10px;
text-align: center;
line-height: 140rpx;
color: #777;
background: #eee;
}
button {
color: #ffffff !important;
background: #5fd9ee !important;
width: 90%;
// margin-top: 20upx;
}
.popup-pay-content {
align-items: center;
justify-content: center;
padding: 30rpx;
width: 500rpx;
height: auto;
background-color: #fff;
}
.popup-pay-title {
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;
}
</style>