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.
 
 
 
 
 

560 lines
15 KiB

<template>
<view class="page1">
<view class="title" style="z-index: 81;">
<view class="title-sreach">
<view class="back-btn" @tap="back" :style="{'padding-top': menuButtonInfo.top +'px'}">
<uni-icons type="left" size="28"></uni-icons>
</view>
<view class="title-search" :style="{'padding-top': menuButtonInfo.top +'px'}" @tap="goDetail('search')">
<uni-icons type="search" size="18" style="margin: 9rpx;"></uni-icons>
<input type="text" placeholder="搜索" @input="search" />
</view>
</view>
</view>
<view style="width: 100%;display: flex;height: 100%;padding-bottom: 60rpx;padding-top: 28%;position: fixed;top: 0;z-index:80;">
<view class="content-left">
<view class="left-box" 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="padding-bottom: 140rpx;margin-bottom: 200rpx;">
<view class="right-box" v-for="(item,index) in shopList" :key="index">
<view style="position: relative;display: flex;">
<view class="box-left" @tap="largeImg(item)">
<view v-if="(item.buyCountNew!= null && item.buyCountNew!= undefined)" style="position: absolute;left: 110rpx;color: #fff;background: red;width: 45rpx;height: 40rpx;font-size: 28rpx;text-align: center;line-height: 40rpx;border-radius: 10rpx;">
{{item.buyCountNew}}
</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.productName == null ?'':item.productName}}
<text style="color: red;" v-if="item.delFlag == 0">(已下架)</text>
</view>
<view class="box-right-num"></view>
<view class="box-right-price">
<view class="price-box">
<text>{{item.lunchBox}}</text>
<text>餐盒费</text>
</view>
<view class="price-box">
<text>{{item.startPayNum}}</text>
<text>起售数量</text>
</view>
<view class="price-box" @tap="changeShow(index,'shopList')" style="flex: 1;text-align: right;padding-top: 26rpx;">
<uni-icons type="down" size="18"></uni-icons>
</view>
</view>
</view>
</view>
<view class="show-box" v-show="item.isShow">
<view class="show-text" @tap="goDetail('goods',item)" style="border-right: 1px solid #fff;">
<uni-icons type="compose" size="18"></uni-icons>
编辑
</view>
<view class="show-text" @tap="isPush('shopList',index,item,item.isPush==1?0:1)" style="border-right: 1px solid #fff;">
<uni-icons type="hand-up" size="18"></uni-icons>
{{item.isPush == 0?'设为推荐':'取消推荐'}}
</view>
<view class="show-text" @tap="isMust('shopList',index,item,item.isMust==1?0:1)" style="border-right: 1px solid #fff;">
<uni-icons type="star" size="18"></uni-icons>
{{item.isMust == 0?'设为必点':'取消必点'}}
</view>
<view class="show-text" @tap="upDown('shopList',index,item,item.delFlag==1?0:1)" style="border-right: 1px solid #fff;">
<uni-icons type="upload" size="18"></uni-icons>
{{item.delFlag == 1?'下架':'上架'}}
</view>
<view class="show-text" @tap="remove(item)">
<uni-icons type="trash" size="18"></uni-icons>
删除
</view>
</view>
</view>
<view class="right-box" v-for="(item,index) in shopList1" :key="index">
<view style="position: relative;display: flex;">
<view class="box-left" @tap="largeImg(item)">
<view v-if="(item.buyCountNew!= null && item.buyCountNew!= undefined)" style="position: absolute;left: 110rpx;color: #fff;background: red;width: 45rpx;height: 40rpx;font-size: 28rpx;text-align: center;line-height: 40rpx;border-radius: 10rpx;">
{{item.buyCountNew}}
</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.productName == null ?'':item.productName}}
</view>
<view class="box-right-num"></view>
<view class="box-right-price">
<view class="price-box">
<text>{{item.lunchBox}}</text>
<text>餐盒费</text>
</view>
<view class="price-box">
<text>{{item.startPayNum}}</text>
<text>起售数量</text>
</view>
<view class="price-box" @tap="changeShow(index,'shopList1')" style="flex: 1;text-align: right;padding-top: 26rpx;">
<uni-icons type="down" size="18"></uni-icons>
</view>
</view>
</view>
</view>
<view class="show-box" v-show="item.isShow">
<view class="show-text" @tap="goDetail('goods',item)" style="border-right: 1px solid #fff;">
编辑
</view>
<view class="show-text" @tap="isPush('shopList1',index,item,item.isPush==1?0:1)" style="border-right: 1px solid #fff;">
<uni-icons type="hand-up" size="18"></uni-icons>
{{item.isPush == 0?'设为推荐':'取消推荐'}}
</view>
<view class="show-text" @tap="isMust('shopList1',index,item,item.isMust==1?0:1)" style="border-right: 1px solid #fff;">
<uni-icons type="star" size="18"></uni-icons>
{{item.isMust == 0?'设为必点':'取消必点'}}
</view>
<view class="show-text" @tap="upDown('shopList1',index,item,item.delFlag==1?0:1)" style="border-right: 1px solid #fff;">
<uni-icons type="upload" size="18"></uni-icons>
{{item.delFlag == 1?'下架':'上架'}}
</view>
<view class="show-text" @tap="remove(item)" style="border-right: 1px solid #fff;">
<uni-icons type="trash" size="18"></uni-icons>
删除
</view>
</view>
</view>
</view>
</view>
<view class="bottom-box">
<view class="bottom-btn" @tap="goDetail('goods')" style="background: rgba(0, 35, 28, 1);color: rgba(166, 255, 234, 1);">新增商品</view>
<view class="bottom-btn" @tap="goDetail('type')">新增分类</view>
</view>
<u-loadmore :status="status" />
</view>
</template>
<script>
export default {
data() {
return {
indexList: [],
shopList: [],
shopList1: [],
pageNum: 1,
searchName: '',
shopId:'',
categoryId: '',
}
},
filters: {
},
onShow() {
this.menuButtonInfo = uni.getMenuButtonBoundingClientRect()
this.getGategoryList()
},
onLoad(option) {
this.shopId = uni.getStorageSync('shopId')
},
onReachBottom() {
if (this.pageNum >= this.pages) return;
// this.status = 'loading';
this.pageNum++;
if(this.gateType == 'search'){
this.getShareList('search');
}else{
this.getShareList();
}
},
methods: {
back() {
uni.navigateBack()
},
//顶部搜索框
search(e) {
this.pageNum = 1
this.shopList1 = []
this.shopList = []
if (e == '') {
this.searchName = ""
this.getShareList()
} else {
this.searchName = e
this.getShareList('search')
}
},
changeShow(index,type){
console.log("1111",index)
console.log("1111",type)
if(type == 'shopList'){
this.shopList[index].isShow = !this.shopList[index].isShow
console.log(this.shopList[index])
}else{
this.shopList1[index].isShow = !this.shopList1[index].isShow
console.log(this.shopList1[index])
}
this.$forceUpdate()
},
isPush(type,index,item,value) {
this.tui.request("/app/product/isPush", "POST", {
id: item.id,
isPush:value
}, false, true).then((res) => {
if (res.code == 200) {
if(type == 'shopList'){
this.shopList[index].isPush = value
}else{
this.shopList1[index].isPush = value
}
this.tui.toast('设置成功')
} else {
this.tui.toast(res.message)
}
}).catch((res) => {})
},
remove(v) {
let that = this;
uni.showModal({
title: '提示',
content: '确定要删除该商品吗?',
success: function (res) {
if (res.confirm) {
that.tui.request("/app/product/delById", "POST", {
id: v.id
}, false, true).then((res) => {
if (res.code == 200) {
that.getShareList()
that.tui.toast('删除成功')
} else {
that.tui.toast(res.message)
}
}).catch((res) => {})
}
}
});
},
isMust(type,index,item,value) {
this.tui.request("/app/product/isMust", "POST", {
id: item.id,
isMust:value
}, false, true).then((res) => {
if (res.code == 200) {
if(type == 'shopList'){
this.shopList[index].isMust = value
}else{
this.shopList1[index].isMust = value
}
this.tui.toast('设置成功')
} else {
this.tui.toast(res.message)
}
}).catch((res) => {})
},
upDown(type,index,item,value) {
if(value == 0){
this.tui.request("/app/product/down", "POST", {
id: item.id
}, false, true).then((res) => {
if (res.code == 200) {
if(type == 'shopList'){
this.shopList[index].delFlag = value
}else{
this.shopList1[index].delFlag = value
}
this.tui.toast('设置成功')
} else {
this.tui.toast(res.message)
}
}).catch((res) => {})
}else{
this.tui.request("/app/product/up", "POST", {
id: item.id
}, false, true).then((res) => {
if (res.code == 200) {
if(type == 'shopList'){
this.shopList[index].delFlag = value
}else{
this.shopList1[index].delFlag = value
}
this.tui.toast('设置成功')
} else {
this.tui.toast(res.message)
}
}).catch((res) => {})
}
},
goDetail(type,item){
let url=""
if(type == 'goods'){
url = '/package1/myCenter/addGoods?dataList='+ JSON.stringify(item)
}else{
url = '/package1/myCenter/addType'
}
uni.navigateTo({
url:url
})
},
//点击分类获取商品列表
getShareList(type) {
let data = {}
if (type == 'search') {
this.gateType = 'search'
data = {
categoryId: "",
searchStr: this.searchName,
pageNum: this.pageNum,
pageSize: '10'
}
} else {
this.gateType = ''
data = {
categoryId: this.categoryId,
searchStr: this.searchName,
pageNum: this.pageNum,
pageSize: '10'
}
}
let that = this
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++){
this.shopList1[i].isShow = false
}
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++){
this.shopList[i].isShow = false
}
this.pages = res.result.pages
}
} else {
this.tui.toast(res.message)
}
}).catch((res) => {})
},
//点击左侧菜单切换
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()
},
//初始化获取分类列表
getGategoryList() {
this.tui.request("/app/productCategory/list", "get", {
shopId:this.shopId
}, 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) => {})
},
}
}
</script>
<style lang="scss">
page {
width: 100%;
height: 100%;
font-size: 24rpx;
background: #F5F8F5;
color: #00231C;
}
.page1 {
width: 100%;
height: 100%;
font-size: 24rpx;
position: relative;
}
.title{
background: url('https://jewel-shop.oss-cn-beijing.aliyuncs.com/8bc15960c2dc40268e295d6dd23aecce.png') no-repeat;
width: 100%;
height: 13%;
position: fixed;
top: 0;
}
.title-sreach{
width: 75%;
display: flex;
height: 200rpx;
}
.back-btn{
padding-top: 110rpx;
}
.title-search{
margin-top: 110rpx;
display: flex;
background: #fff;
height: 54rpx;
margin-left: 20rpx;
border-radius: 54rpx;
flex: 1;
input{
height: 54rpx;
line-height: 54rpx;
}
}
.content-left {
width: 170rpx;
background: #eee;
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: 6rpx solid red;
}
.content-right {
flex: 1;
overflow-y: scroll;
height: 100%;
background: #fff;
}
.right-box {
width: 100%;
height: auto;
border-bottom: 1px solid #eee;
}
.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;
flex: 1;
}
.box-right-name {
font-size: 30rpx;
font-weight: bold;
}
.box-right-num {
padding: 5rpx 0;
color: #777;
text-align: right;
padding-right: 20rpx;
height: 40rpx;
}
.box-right-price {
display: flex;
font-size: 25rpx;
text-align: center;
}
.price-box {
display: flex;
flex-direction: column;
margin-right: 20rpx;
}
.price-box text:first-child {
color: #ffa200
}
.bottom-box {
width: 100%;
height: 140rpx;
display: flex;
background: #fff;
z-index: 98;
position: fixed;
bottom: 0;
display: flex;
padding-top: 20rpx;
}
.bottom-btn {
width: 50%;
height: 90rpx;
line-height: 90rpx;
border-radius: 90rpx;
font-size: 28rpx;
font-weight: 700;
background: linear-gradient(90deg, rgba(227, 255, 150, 1), rgba(166, 255, 234, 1));
text-align: center;
margin: 0 20rpx;
}
.show-box{
display: flex;
height: 100rpx;
background: #eee;
}
.show-text{
display: flex;
flex-direction: column;
text-align: center;
flex: 1;
padding-top: 14rpx;
}
</style>