173 lines
3.6 KiB
Vue
173 lines
3.6 KiB
Vue
<script setup>
|
||
// 商品管理
|
||
import {
|
||
ref,
|
||
reactive,
|
||
} from 'vue'
|
||
import {
|
||
onLoad,
|
||
onReachBottom,
|
||
onPullDownRefresh
|
||
} from "@dcloudio/uni-app"
|
||
|
||
// 顶部导航
|
||
import apex from "@/components/header/apex.vue"
|
||
// api
|
||
import api from '@/api/index.js'
|
||
// 工具库
|
||
import util from '@/common/js/util.js'
|
||
// 产品列表
|
||
const product = reactive({
|
||
list: [],
|
||
pageNum: 1,
|
||
pageSize: 10,
|
||
})
|
||
|
||
onLoad(() => {
|
||
// 获取列表
|
||
getList()
|
||
})
|
||
|
||
onReachBottom(() => {
|
||
// 获取更多商品
|
||
getMoreList()
|
||
})
|
||
|
||
onPullDownRefresh(() => {
|
||
// 重载商品列表
|
||
refeshList()
|
||
})
|
||
|
||
// 重载商品列表
|
||
function refeshList() {
|
||
if (product.list.length >= product.total) return
|
||
product.pageNum++
|
||
getList()
|
||
}
|
||
|
||
// 获取更多商品
|
||
function getMoreList() {
|
||
if (product.list.length >= product.total) return
|
||
product.pageNum++
|
||
getList()
|
||
}
|
||
|
||
// 请求列表
|
||
function getList() {
|
||
//
|
||
api.shop.getProductionListByUserId({
|
||
data: {
|
||
pageSize: product.pageSize,
|
||
pageNum: product.pageNum,
|
||
}
|
||
}).then(rs => {
|
||
if (rs.code === 200) {
|
||
if (product.pageNum == 1) product.list.length = 0
|
||
product.list.push(...rs.rows)
|
||
product.total = rs.total
|
||
return
|
||
}
|
||
util.alert({
|
||
content: rs.msg,
|
||
showCancel: false,
|
||
})
|
||
})
|
||
}
|
||
|
||
/**
|
||
* 编辑
|
||
* @param {Object} item 商品对象
|
||
*/
|
||
function handleEdit(item) {
|
||
uni.navigateTo({
|
||
url: util.setUrl('/pages/release/commodity', {
|
||
id: item.id
|
||
})
|
||
})
|
||
}
|
||
|
||
/**
|
||
* 跳转
|
||
* @param {String} url 路径
|
||
*/
|
||
function link(url) {
|
||
uni.navigateTo({
|
||
url
|
||
})
|
||
}
|
||
|
||
/**
|
||
* 删除发布的商品
|
||
* @param {Object} item 商品对象
|
||
* @param {Object} index 操作的下标
|
||
*/
|
||
function handleRemove(item, index) {
|
||
util.alert({
|
||
content: '确定删除该商品吗？',
|
||
}).then(res => {
|
||
if (!res.confirm) return
|
||
// 删除商品
|
||
api.shop.removeProduct({
|
||
path: [item.id]
|
||
}).then(rs => {
|
||
if (rs.code === 200) {
|
||
product.list.splice(index, 1)
|
||
return
|
||
}
|
||
util.alert({
|
||
content: rs.msg,
|
||
showCancel: false,
|
||
})
|
||
})
|
||
})
|
||
}
|
||
</script>
|
||
|
||
<template>
|
||
<view class="app">
|
||
<apex title="商品管理">
|
||
<template #right>
|
||
<view class="f24" @click="link('/pages/release/commodity')">添加</view>
|
||
</template>
|
||
</apex>
|
||
|
||
<view class="listBox oh">
|
||
<view class="item oh mtb20 mlr20 plr20 bfff br20" v-for="(item,index) in product.list" :key="index">
|
||
<!-- 商品信息 -->
|
||
<view class="product line df ptb20">
|
||
<view class="poster wh160">
|
||
<image class="wh160 br10" :src="item.sliderImage.split(',')[0]" mode="aspectFill" />
|
||
</view>
|
||
|
||
<view class="info df fdc jcsb f1 ml20">
|
||
<view class="name t2hd c333 f28">{{item.name}}</view>
|
||
|
||
<view class="count fs0 c999 f24">销量：{{item.sales}}</view>
|
||
|
||
<view class="other df aic">
|
||
<view class="price f1 cFF9B27">
|
||
<text class="f30">价格：</text>
|
||
<text class="f20">￥</text>
|
||
<text class="f30">{{item.price}}</text>
|
||
</view>
|
||
<!-- <view class="f1 c999 f24">库存：×1</view> -->
|
||
</view>
|
||
</view>
|
||
</view>
|
||
|
||
<view class="menu ptb20 df jcr">
|
||
<!-- <view class="btn sm bar closeHollow plr30">上架</view> -->
|
||
<!-- <view class="btn sm bar closeHollow plr30">下架</view> -->
|
||
<!-- <view class="btn sm bar closeHollow plr30">改价</view> -->
|
||
<!-- 在没有进行中的订单才能删除 -->
|
||
<view class="btn sm bar closeHollow plr30" @click="handleRemove(item,index)">删除</view>
|
||
<view class="btn sm bar warmHollow plr30" @click="handleEdit(item)">编辑</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</template>
|
||
|
||
<style lang="scss" scoped>
|
||
//
|
||
</style> |