<template>
|
<view class="flow-manage">
|
<view class="top-buttons" v-if="type==='all'">
|
<view @click.stop="clickButton('add')" class="button button-add"></view>
|
<view @click.stop="clickButton('in')" class="button button-search-in"></view>
|
<view @click.stop="clickButton('unpass')" class="button button-search-unpass"></view>
|
<view @click.stop="clickButton('inpass')" class="button button-search-inpass" style="flex:5"></view>
|
<view @click.stop="clickButton('delete')" class="button button-search-delete" style="margin-top: -1rpx;">
|
</view>
|
|
</view>
|
<view class="p15" style="min-height: calc(100vh - 500rpx);">
|
<no-data v-if="!list||list.length==0" style="width: 100%;"></no-data>
|
<view v-for="(item,index) in list" :key="index" class="m-b-24 flow-manage-list">
|
<view class="flow-manage-list-item">
|
<view class="flex m-r-6">
|
<view class="img flower-img m-r-6">
|
<image class="flower-img img100 " :src="item.cover"
|
:class="[!item.stock?'component-stock-zero':'']" @click="previewImg(item.cover)">
|
|
</image>
|
<view class="status" :class="[!item.stock?'zero':'']" v-if="item.statusStr">
|
{{ item.statusStr}}
|
</view>
|
</view>
|
|
<view class="flex1">
|
<view class=" flex">
|
<view class="title">{{item.name}}<span class="level">{{item.levelStr}}</span></view>
|
<view class="m-l-a m-r-0">
|
{{item.categoryStr || '-'}}
|
</view>
|
</view>
|
<view class="each-list">
|
<view class="each-item">
|
<view class="label">状态</view>
|
<view class="value">{{item.statusStr || '-'}}</view>
|
|
</view>
|
<view class="each-item">
|
<view class="label">颜色</view>
|
<view class="value">{{item.color || '-'}}</view>
|
|
</view>
|
<view class="each-item">
|
<view class="label">规格</view>
|
<view class="value">{{item.unit || '-'}}</view>
|
|
</view>
|
<view class="each-item">
|
<view class="label">库存</view>
|
<view class="value">{{item.stock || 0}}</view>
|
|
</view>
|
<view class="each-item">
|
<view class="label">销量</view>
|
<view class="value">{{item.sales || 0}}</view>
|
</view>
|
<view class="each-item">
|
<view class="label">价格</view>
|
<view class="value">{{item.price||'-'}}</view>
|
</view>
|
</view>
|
</view>
|
</view>
|
<view class="line-gray">
|
|
</view>
|
<view class="buttons">
|
<view class="button" @click.stop="toDetail(item)">编辑</view>
|
|
<view class="button" @click.stop="buttonStatus(item,'off')"
|
v-if="item.status=='UP'||item.status=='up'">下架</view>
|
<view class="button" @click.stop="buttonStatus(item,'up')"
|
v-if="item.status=='OFF'||item.status=='off'||item.status=='FORCE_OFF'">上架</view>
|
<view class="button" @click.stop="openValue(item,'price')">价格</view>
|
<view class="button" @click.stop="openValue(item,'stock')">库存</view>
|
<view class="button" @click.stop="toDetailAdd(item)">复制</view>
|
|
<view class="button t-red" @click.stop="buttonDelete(item)">删除</view>
|
|
</view>
|
</view>
|
</view>
|
</view>
|
|
<!-- 判断是否到底了，自动吧 -->
|
<footer-msg :more="page.total>0&&page.total>page.current*page.size"></footer-msg>
|
|
<uni-popup ref="popup_input" type="bottom" :mask-click="false">
|
<view class="component-popup_input white w-fit" style="padding-bottom: 0rpx;padding: 0px;">
|
<view class="p20" style="padding-bottom: 10rpx;">
|
<view class="title" v-if="currentInputKey=='price'">
|
修改价格
|
</view>
|
<view class="title" v-if="currentInputKey=='stock'">
|
修改库存
|
</view>
|
|
<!-- 输入框-->
|
<view class="flex w-fit ">
|
|
<u-input v-model="content" :placeholder="inputplaceholder" type="digit"
|
style="max-width: 390rpx;background-color: #F2F2F2;" v-if="currentInputKey=='price'" />
|
<view v-if="currentInputKey=='price'" class="m-l-10" style="line-height: 78rpx;">元</view>
|
|
<u-input v-model="content" :placeholder="inputplaceholder" type="number"
|
style="max-width: 390rpx;background-color: #F2F2F2;" v-if="currentInputKey=='stock'" />
|
</view>
|
</view>
|
<!-- 提交按钮 -->
|
<view class="line-gray" style="margin-bottom: 0px;"></view>
|
<view class="flex flex-wrap-normal">
|
<u-button type="default" class="w-fit flex1 " text="取消"
|
@click="()=>{$refs.popup_input.close()}"></u-button>
|
<view class="component-line-vert"></view>
|
<u-button type="default" class="w-fit flex1 topic-font" t text="确定" @click="submitValue"></u-button>
|
</view>
|
</view>
|
</uni-popup>
|
</view>
|
</template>
|
|
<script>
|
export default {
|
data() {
|
return {
|
type: 'all',
|
query: {
|
type: ''
|
},
|
content: '',
|
currentInputDto: {},
|
currentInputKey: '',
|
inputplaceholder: '',
|
}
|
},
|
onShow() {
|
if (this.sign['flower']) {
|
this.$store.dispatch('sign_clear', 'flower');
|
this.refreshList()
|
}
|
},
|
async onLoad(options) {
|
this.type = options.type || 'all'
|
var title = ''
|
this.page.size = 5
|
//todo 根据type切换查询条件
|
if (this.type === 'delete') {
|
this.listApi = '/api/supplier/flower/list/rc'
|
title = '商品管理-已删除'
|
} else {
|
|
this.listApi = '/api/supplier/flower/list'
|
this.query.status = ''
|
if (this.type === 'inpass') {
|
this.query.status = 'PENDING'
|
title = '商品管理-待审核'
|
}
|
if (this.type === 'in') {
|
this.query.status = 'UP'
|
title = '商品管理-已上架'
|
}
|
if (this.type === 'unpass') {
|
this.query.status = 'DRAFT,OFF,FORCE_OFF'
|
title = '商品管理-仓库中'
|
}
|
if (this.type === 'rejectpass') {
|
this.query.status = 'REJECT'
|
title = '商品管理-未审核通过'
|
}
|
}
|
if (title) {
|
uni.setNavigationBarTitle({
|
title: title
|
})
|
}
|
await this.$store.dispatch('sign_clear', 'flower');
|
this.getList()
|
},
|
onReachBottom() {
|
console.log('onReachBottom')
|
this.getMore()
|
},
|
async onPullDownRefresh() {
|
this.page.current = 1
|
await this.getList()
|
uni.stopPullDownRefresh()
|
},
|
methods: {
|
async openValue(item, key) {
|
this.content = item[key] || ''
|
this.currentInputDto = item
|
this.currentInputKey = key
|
this.inputplaceholder = key == 'price' && '请输入价格(元)' || key == 'stock' && '请输入库存(整数)' || '请输入'
|
this.$refs.popup_input.open('top')
|
},
|
async submitValue() {
|
let item = this.currentInputDto,
|
key = this.currentInputKey
|
const res = await this.$message.confirm(`确定修改此商品的${key==='price'&&'价格'|| key==='stock'&&'库存'}吗`, {
|
editable: false
|
})
|
|
if (!this.content) {
|
this.$message.showToast('输入不能为空')
|
return
|
}
|
var value = ''
|
if (key == 'price') {
|
value = parseFloat(this.content).toFixed(2)
|
} else {
|
value = parseInt(this.content)
|
}
|
if (isNaN(value)) {
|
this.$message.showToast('输入格式不正确')
|
return
|
}
|
if (key == 'price') {
|
if (value <= 0) {
|
this.$message.showToast('价格需要大于0')
|
return
|
}
|
} else {
|
if (value < 0) {
|
this.$message.showToast('库存不能小于0')
|
return
|
}
|
}
|
|
var dto = {
|
id: item.id,
|
}
|
dto[key] = value
|
|
|
this.$message.showLoading()
|
this.$http.request('post', '/api/supplier/flower/list/' + key, {
|
data: dto
|
}).then(res => {
|
if (res.code == 0) {
|
this.$message.showToast('操作成功')
|
item[key] = value
|
this.$refs.popup_input.close()
|
|
}
|
}).finally(() => {
|
this.$message.hideLoading()
|
})
|
},
|
async buttonStatus(item, status) {
|
await this.$message.confirm(`确定${status==='off'?'下架':'上架'}此商品吗`)
|
this.$message.showLoading()
|
this.$http.request('get', '/api/supplier/flower/list/' + status, {
|
params: {
|
id: item.id
|
}
|
}).then(res => {
|
this.$message.hideLoading()
|
if (res.code == 0) {
|
this.$message.showToast('操作成功')
|
item.status = (status == 'off' ? 'OFF' : 'UP')
|
item.statusStr = (status == 'off' ? '下架' : '上架')
|
}
|
}).catch(e => {
|
this.$message.hideLoading()
|
}).finally(() => {})
|
},
|
async buttonDelete(item) {
|
await this.$message.confirm('确定删除此商品吗')
|
this.$message.showLoading()
|
this.$http.request('get', '/api/supplier/flower/list/delete', {
|
params: {
|
id: item.id
|
}
|
}).then(res => {
|
if (res.code == 0) {
|
this.$message.showToast('删除成功')
|
this.refreshList()
|
}
|
}).finally(() => {
|
this.$message.hideLoading()
|
})
|
},
|
toDetail(item) {
|
uni.navigateTo({
|
url: '/sub_pages/supplier/flower-manage/flower-add?id=' + item.id
|
})
|
},
|
toDetailAdd(item) {
|
uni.navigateTo({
|
url: '/sub_pages/supplier/flower-manage/flower-add?copyId=' + item.id
|
})
|
},
|
clickButton(type) {
|
if (type == 'add') {
|
//添加页面
|
uni.navigateTo({
|
url: '/sub_pages/supplier/flower-manage/flower-add'
|
})
|
} else {
|
uni.navigateTo({
|
url: '/sub_pages/supplier/flower-manage/flower-manage?type=' + type
|
})
|
}
|
},
|
}
|
}
|
</script>
|
|
<style lang="scss" scoped>
|
.flow-manage {
|
overflow-y: scroll;
|
|
// min-height: ;
|
.flow-manage-list {
|
// padding: 20rpx 30rpx;
|
padding: 22rpx 22rpx 20rpx 22rpx;
|
background-color: #fff;
|
|
.flow-manage-list-item {
|
.title {
|
font-weight: 600;
|
font-size: 28rpx;
|
color: #000000;
|
line-height: 40rpx;
|
|
.level {
|
font-weight: 400;
|
font-size: 28rpx;
|
color: #20613D;
|
line-height: 40rpx;
|
margin-left: 20rpx;
|
}
|
}
|
|
.buttons {
|
display: flex;
|
|
.button {
|
margin: 0 auto;
|
width: 98rpx;
|
line-height: 48rpx;
|
border-radius: 24rpx;
|
border: 2rpx solid #CECECE;
|
text-align: center;
|
font-size: 24rpx;
|
color: #666666;
|
line-height: 34rpx;
|
}
|
}
|
|
.flower-img {
|
width: 128rpx;
|
height: 118rpx;
|
min-width: 128rpx;
|
min-height: 118rpx;
|
position: relative;
|
|
.status {
|
position: absolute;
|
min-width: 66rpx;
|
height: 34rpx;
|
background: #20613D;
|
left: 0;
|
top: 0;
|
border-top-left-radius: 8rpx;
|
border-bottom-right-radius: 8rpx;
|
color: #FFFFFF;
|
line-height: 34rpx;
|
font-size: 22rpx;
|
text-align: center;
|
}
|
|
.status.zero {
|
// background: unset;
|
// font-size: 24rpx;
|
|
}
|
}
|
|
.each-list {
|
display: flex;
|
flex-wrap: wrap;
|
margin-top: 6rpx;
|
|
.each-item {
|
min-width: 30%;
|
max-width: 40%;
|
text-align: center;
|
margin-left: 0rpx;
|
margin-right: auto;
|
display: flex;
|
|
.label {
|
font-weight: 400;
|
font-size: 24rpx;
|
color: #666666;
|
text-align: left;
|
padding-right: 10rpx;
|
}
|
|
.label::after {
|
content: ": "
|
}
|
|
.value {
|
font-weight: 400;
|
font-size: 24rpx;
|
color: #666666;
|
}
|
}
|
}
|
}
|
}
|
|
.top-buttons {
|
display: flex;
|
padding: 22rpx 42rpx;
|
background-color: #fff;
|
|
.button {
|
// flex:1;
|
margin: 0 auto;
|
width: 90rpx;
|
height: 146rpx;
|
background-size: 100% 100%;
|
text-align: center;
|
// min-width: 90rpx;
|
flex: 4;
|
// max-width: 90rpx;
|
margin-left: 14rpx;
|
margin-right: 14rpx;
|
font-weight: 400;
|
|
}
|
|
.button:first-child {
|
margin-left: 0rpx
|
}
|
|
.button:last-child {
|
margin-right: 0rpx
|
}
|
|
.button-add {
|
background-image: url('@/static/images/supplier/flower/flower-mange-icon-add-flower.png');
|
|
}
|
|
.button-search-in {
|
background-image: url('@/static/images/supplier/flower/flower-mange-icon-flower-in.png');
|
|
}
|
|
.button-search-unpass {
|
background-image: url('@/static/images/supplier/flower/flower-mange-icon-flower-unpass.png');
|
|
}
|
|
.button-search-inpass {
|
background-image: url('@/static/images/supplier/flower/flower-mange-icon-flower-inpass.png');
|
|
}
|
|
.button-search-delete {
|
background-image: url('@/static/images/supplier/flower/flower-mange-icon-flower-delete.png');
|
|
}
|
}
|
}
|
</style>
|
