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.

295 lines
6.3 KiB

<template>
<view class="goodsManage-page">
<view class="nav acea-row row-around">
3 years ago
<view class="item" :class="{ on: type == 1 }" @click="changeType(1)">
<view>出售中</view>
</view>
3 years ago
<view class="item" :class="{ on: type == 0 }" @click="changeType(0)">
<view>待上架</view>
</view>
</view>
<view class="goods-list-box">
3 years ago
<view class="no-order" v-if="goodsList.length == 0"><image src="https://download.cyjyyjy.com/no-goods.png"></image></view>
<view class="goods-item" v-else v-for="item in goodsList" :key="item" @click="goGoodsCon(item)">
<view class="review-box acea-row row-right">
<view class="info" v-if="item.status == 0">等待审核</view>
<view class="succsess" v-if="item.status == 1">审核通过</view>
<view class="status" v-if="item.status == -1">审核不通过</view>
<view class="message" v-if="item.status == -1">{{item.refuseMessage}}</view>
3 years ago
</view>
<view class="item-top acea-row">
3 years ago
<image class="goods-img" :src="item.image" mode="aspectFill"></image>
<view class="info-box">
3 years ago
<view class="title line1">{{item.storeName}}</view>
<view class="colG">规格 {{item.unitName}}</view>
<view class="price-box acea-row row-between-wrapper">
3 years ago
<view class="money">{{item.price}}</view>
<view class="colG">库存{{item.stock}}</view>
</view>
</view>
</view>
<view class="btn-box acea-row row-right">
3 years ago
<view class="edit-btn acea-row row-middle" @click="toAddGoods(item)" v-if="type == 0">
<image src="../../../static/images/edit-goods.png"></image>
<text>编辑商品</text>
</view>
3 years ago
<view class="off-shelf-btn acea-row row-middle" @tap.stop="showProduct(item)">
<image src="../../../static/images/off-shelf.png" :class="type == 0 ? 'flip' : ''"></image>
<text>{{type == 1 ? '下架' : '上架' }}商品</text>
</view>
3 years ago
<view class="del-btn acea-row row-middle" v-if="type == 0" @click="delProduct(item)">
<image src="../../../static/images/del-goods.png"></image>
<text>删除商品</text>
</view>
</view>
</view>
</view>
3 years ago
<view class="add-btn" @click="toAddGoods('')">新增商品</view>
</view>
</template>
<script>
3 years ago
import { getProducts, prodcutShow ,prodcutDel } from '@/api/store.js'
export default{
data(){
return {
3 years ago
type: 1,
goodsList: [],
3 years ago
page: 1,
loading: true
}
},
3 years ago
onShow() {
3 years ago
this.$yroute.query.type ? this.type = this.$yroute.query.type : this.type = 1
3 years ago
this.getProducts()
let pages = getCurrentPages();
3 years ago
},
onReachBottom() {
3 years ago
if(this.loading){
this.page= this.page + 1
this.getProducts()
}
3 years ago
},
onPullDownRefresh() {
this.goodsList = []
this.page = 1
this.loading = true
this.getProducts()
},
methods:{
3 years ago
goGoodsCon(item) {
if(this.type == 1){
this.$yrouter.push({
path: "/pages/shop/GoodsCon/index",
query: {
id: item.id
}
});
}
},
getProducts(){
let data = {
orderType: 'SELL',
limit: 200,
page: 1,
isShow: this.type
}
if(this.loading){
getProducts(data).then((res)=>{
if(res.success){
if(this.page > 1){
this.goodsList = this.goodsList.concat(res.data)
} else{
this.goodsList = res.data
}
this.loading = res.data.length >= this.limit
uni.stopPullDownRefresh()
}
})
}
},
// 商品上下架
showProduct(item){
let data = {
id: item.id,
status: this.type
}
prodcutShow(data).then((res)=>{
if(res.success){
uni.showToast({
title: res.msg
})
this.changeType(this.type)
} else{
uni.showToast({
title: res.msg,
icon: 'none'
})
3 years ago
}
})
},
//删除商品
delProduct(item){
prodcutDel({id: item.id}).then((res)=>{
if(res.success){
uni.showToast({
title: res.msg
})
this.changeType(this.type)
}
})
},
changeType(idx){
3 years ago
this.type = idx
this.goodsList = []
this.page = 1
3 years ago
this.loading = true
this.getProducts();
},
//编辑商品,新增或商品
toAddGoods(item){
let id = item.id || ''
this.$yrouter.push({
path: '/pages/life/addGoods/index',
query:{
id: id
}
})
},
},
}
</script>
<style lang="less">
.goodsManage-page{
width: 100%;
min-height: 100vh;
background: #EEEEEE;
3 years ago
position: relative;
}
.no-order{
padding: 90rpx 0;
width: 100%;
text-align: center;
image{
width: 422rpx;
height: 508rpx;
}
}
.nav{
3 years ago
width: 100%;
position: fixed;
top: 0;
left: 0;
background-color: #fff;
color: #707070;
font-size: 28rpx;
.item{
padding-bottom: 12rpx;
}
.on{
font-weight: 500;
color: #000;
border-bottom: 6rpx solid #000;
}
}
.goods-list-box{
width: 100%;
3 years ago
padding: 90rpx 40rpx 126rpx;
.goods-item{
width: 100%;
padding: 16rpx 22rpx 16rpx;
border-radius: 12rpx;
background: #fff;
font-size: 28rpx;
margin-bottom: 32rpx;
.goods-img{
width: 116rpx;
height: 116rpx;
border-radius: 12rpx;
margin-right: 24rpx;
}
.info-box{
width: calc(100% - 140rpx);
display: flex;
flex-direction: column;
justify-content: space-around;
}
.title{
line-height: 40rpx;
color: #333333;
}
.colG{
font-size: 22rpx;
color: #b7b7b7;
}
.money{
color: #000;
font-weight: 500;
line-height: 40rpx;
}
.btn-box{
border-top: 2rpx solid #ECECEC;
width: 100%;
padding: 16rpx 0 0;
margin-top: 28rpx;
font-size: 28rpx;
image{
width: 28rpx;
height: 28rpx;
margin-right: 6rpx;
}
3 years ago
.flip{
transform: rotate(180deg);
}
view{
margin-left: 28rpx;
}
.off-shelf-btn{
color: #000;
font-weight: 500;
}
.edit-btn{
color: #5C96E8;
font-weight: 500;
}
.del-btn{
color: #B7B7B7;
font-weight: 500;
}
}
}
}
3 years ago
.review-box{
font-size: 24rpx;
margin: 0rpx 0 16rpx;
3 years ago
.status{
color: #ff4949;
}
.info{
color: #67c23a;
}
.succsess{
color: #409eff;
}
.message{
color:#ff4949;
// width: 60%;
3 years ago
}
}
3 years ago
.add-btn{
width: 670rpx;
height: 80rpx;
line-height: 80rpx;
text-align: center;
color: #fff;
background: #000;
3 years ago
border-radius: 40rpx;
position: absolute;
bottom: 50rpx;
left: 50%;
margin-left: -335rpx;
}
</style>