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.
722 lines
18 KiB
722 lines
18 KiB
<template>
|
|
<view class="page1">
|
|
<view class="title-box">
|
|
<uni-search-bar class="uni-mt-10" radius="5" placeholder="商品名称/货号/供应商" cancelButton="none"
|
|
@confirm="search" @blur="search" @clear="clearSearch" />
|
|
</view>
|
|
<view class="content-box" :style="{height:(height - 240) + 'rpx'}">
|
|
<view class="content-left">
|
|
<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">
|
|
<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"></view>
|
|
<view class="box-left">
|
|
<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}}</view>
|
|
<view class="box-right-num">{{item.productSn}}</view>
|
|
<view class="box-right-price">
|
|
<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">
|
|
<text>{{item.stockCount}}</text>
|
|
<text>库存</text>
|
|
</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"></view>
|
|
<view class="box-left">
|
|
<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}}</view>
|
|
<view class="box-right-num">{{item.productSn}}</view>
|
|
<view class="box-right-price">
|
|
<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">
|
|
<text>{{item.stockCount}}</text>
|
|
<text>库存</text>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</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.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 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 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>
|
|
<u-loadmore :status="status" />
|
|
</view>
|
|
</uni-popup>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
export default {
|
|
components: {},
|
|
data() {
|
|
return {
|
|
indexList: [],
|
|
status: 'loadmore',
|
|
pageNum: 1, //分页的页码
|
|
shopList: [],
|
|
shopList1: [],
|
|
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.pages >= this.totalPages) return;
|
|
this.status = 'loading';
|
|
this.pages = ++this.pages;
|
|
this.stockSelect();
|
|
},
|
|
onShow(){
|
|
let that = this;
|
|
this.pdList = this.pdList
|
|
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)
|
|
}
|
|
}
|
|
}
|
|
console.log(this.carList)
|
|
},
|
|
onLoad() {
|
|
this.height = wx.getSystemInfoSync().windowHeight
|
|
this.getGategoryList()
|
|
this.storageType = uni.getStorageSync('type')
|
|
},
|
|
methods: {
|
|
//初始化获取分类列表
|
|
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 => {
|
|
console.log(item)
|
|
data.push(item)
|
|
item.stockLogList1 = []
|
|
item.stockLogList.forEach(item1 => {
|
|
|
|
item.stockLogList1.push(item1)
|
|
})
|
|
})
|
|
|
|
uni.navigateBack({
|
|
delta: 1
|
|
})
|
|
},
|
|
getShareList(type) {
|
|
let data = {}
|
|
if(type=='search'){
|
|
this.gateType = 'search'
|
|
data = {
|
|
categoryId: "",
|
|
searchStr: this.searchName,
|
|
pageNum: this.pageNum,
|
|
pageSize: '100'
|
|
}
|
|
}else{
|
|
this.gateType = ''
|
|
data = {
|
|
categoryId: this.categoryId,
|
|
searchStr: this.searchName,
|
|
pageNum: this.pageNum,
|
|
pageSize: '100'
|
|
}
|
|
}
|
|
this.tui.request("/app/product/getShareList", "POST", data, false, false).then((res) => {
|
|
if (res.code == 200) {
|
|
if(type=='search'){
|
|
this.shopList = []
|
|
this.shopList1 = res.result.records
|
|
}else{
|
|
this.shopList1 = []
|
|
this.shopList = res.result.records
|
|
}
|
|
} else {
|
|
this.tui.toast(res.message)
|
|
}
|
|
}).catch((res) => {})
|
|
},
|
|
//弹出购物车或者商品规格选择弹窗
|
|
toggle(type, item) {
|
|
if (type == 'carPopup') {
|
|
|
|
this.stockSelect()
|
|
this.$refs.carPopup.open('bottom')
|
|
|
|
} else {
|
|
|
|
this.productId = item.id
|
|
// this.checkGoods(item);
|
|
uni.navigateTo({
|
|
url: '/package1/stock/stockDetail?item=' + JSON.stringify(item)
|
|
})
|
|
}
|
|
|
|
},
|
|
stockSelect(){
|
|
this.stockList = []
|
|
this.tui.request("/app/checkStock/getCheckStock", "POST", {
|
|
checkStockId:uni.getStorageSync('stockId'),
|
|
pageNum:this.pages,
|
|
pageSize:10
|
|
}, false, false).then((res) => {
|
|
if (res.code == 200) {
|
|
if (this.pages == 1) {
|
|
this.stockList = res.result.checkStockDetailVoList.records
|
|
} else {
|
|
this.stockList = [...this.stockList, ...res.result.checkStockDetailVoList.records]
|
|
}
|
|
this.totalPages = res.result.pages
|
|
this.carType = this.stockList.length
|
|
} else {
|
|
this.tui.toast(res.message)
|
|
}
|
|
|
|
}).catch((res) => {})
|
|
},
|
|
//扫一扫功能
|
|
scanCode() {
|
|
uni.scanCode({
|
|
success: (res) => {
|
|
this.tui.request("/app/product/getById/" + res.result.split(',')[0], "POST", {}, false, true).then((res1) => {
|
|
if (res1.code == 200) {
|
|
let shopId = res.result.split(',')[1]
|
|
if(shopId == uni.getStorageSync('shopId')){
|
|
uni.navigateTo({
|
|
url: '/package1/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.searchName = ""
|
|
this.getShareList()
|
|
}else{
|
|
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.getShareList()
|
|
},
|
|
//删除整条商品
|
|
delShop(item) {
|
|
var that = this;
|
|
console.log(item)
|
|
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 {
|
|
display: flex;
|
|
flex-direction: column;
|
|
height: 92%;
|
|
}
|
|
|
|
.uni-tab__dot {
|
|
padding: 0 4px;
|
|
line-height: 15px;
|
|
color: #ffffff;
|
|
text-align: center;
|
|
font-size: 12px;
|
|
background-color: #ff0000;
|
|
border-radius: 15px;
|
|
}
|
|
|
|
.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-container {
|
|
width: 100%;
|
|
background: #fff;
|
|
height: 50rpx;
|
|
}
|
|
|
|
.uni-tab__text {
|
|
font-size: 12px;
|
|
color: #646566;
|
|
}
|
|
|
|
.title-box {
|
|
background: #fff;
|
|
}
|
|
|
|
.bottom-box {
|
|
width: 100%;
|
|
height: 120rpx;
|
|
position: fixed;
|
|
bottom: 0;
|
|
display: flex;
|
|
background: #fff;
|
|
z-index: 98;
|
|
}
|
|
|
|
.bottom-left {
|
|
width: 15%;
|
|
position: relative;
|
|
padding-top: 20rpx;
|
|
}
|
|
|
|
.bottom-right {
|
|
width: 85%;
|
|
padding-top: 20rpx;
|
|
.bottom-btn {
|
|
width: 85%;
|
|
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;
|
|
}
|
|
}
|
|
|
|
.bottom-left-box {
|
|
display: flex;
|
|
flex-direction: column;
|
|
text-align: center;
|
|
}
|
|
|
|
.content-box {
|
|
background: #fff;
|
|
flex: 1;
|
|
display: flex;
|
|
}
|
|
|
|
.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;
|
|
overflow-y: scroll;
|
|
}
|
|
|
|
.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: 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);
|
|
}
|
|
.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;
|
|
}
|
|
</style>
|