You cannot select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

150 lines
3.2 KiB
Vue

<template>
<view class="content">
<wd-notify />
<wd-search @search="search" v-model="params.keywords" hide-cancel>
<template #prefix>
<wd-popover v-model="popover" mode="menu" :content="menu" @menuclick="changeSearchType">
<view class="search-type">
<text>{{ searchType }}</text>
<wd-icon custom-class="icon-arrow" name="fill-arrow-down"></wd-icon>
</view>
</wd-popover>
</template>
</wd-search>
<myTable ref="table" :apiObj="goods.list" :params="params">
<wd-table-col fixed prop="id" width="60" align="center" label="ID"></wd-table-col>
<wd-table-col prop="name" width="180" label="商品名称"></wd-table-col>
<wd-table-col prop="stock_num" align="center" width="80" label="库存">
<template #value="{ row }">
<view class="custom-class">
<wd-tag v-if="row.stock_num > 0" type="primary">{{ row.stock_num }}</wd-tag>
<wd-tag v-else type="warning">{{ row.stock_num }}</wd-tag>
</view>
</template>
</wd-table-col>
<wd-table-col prop="stock_num" align="center" width="80" label="状态">
<template #value="{ row }">
<view class="custom-class">
<wd-switch @change="changeS(row)" v-model="row.status" :inactive-value="0" :active-value="1" size="16px" />
</view>
</template>
</wd-table-col>
<wd-table-col width="120" align="center" label="操作">
<template #value="{ row }">
<view class="custom-class">
<wd-button :round="false" size="small"></wd-button>
</view>
</template>
</wd-table-col>
</myTable>
</view>
</template>
<script setup>
import { ref } from 'vue'
import myTable from "/components/myTable/index.vue"
import goods from '@/api/store/goods.js'
import utils from '@/utils/utils.js'
import { useNotify } from '@/uni_modules/wot-design-uni'
const { showNotify, closeNotify } = useNotify()
const params = {
keywords: "",
calssify_id: "",
status: "",
}
const searchType = ref('全部')
const popover = ref(false)
const menu = ref([
{
content: '全部'
},
{
content: '已上架'
},
{
content: '已下架'
}
])
const table = ref(null)
const search = ({ value }) => {
table.value.upData({
keywords: value
})
}
function changeSearchType({ item, index }) {
searchType.value = item.content
if (item.content == '全部') {
params.status = ""
}
if (item.content == '已上架') {
params.status = 1
}
if (item.content == '已下架') {
params.status = 0
}
search({
value: ""
})
}
const changeS = (row) => {
goods.goodsEditAttribute({
id: row.id,
value: [1, 0][row.status],
type: "status"
}).then(res => {
if (res.code == 0) {
showNotify({ type: 'primary', message: '操作成功' })
} else {
showNotify({ type: 'error', message: '出错了' })
}
})
}
</script>
<style lang="scss" scoped>
.search-type {
position: relative;
height: 30px;
line-height: 30px;
padding: 0 8px 0 16px;
font-size: 24rpx;
color: rgba(0, 0, 0, .45);
}
.search-type::after {
position: absolute;
content: '';
width: 1px;
right: 0;
top: 5px;
bottom: 5px;
background: rgba(0, 0, 0, 0.25);
}
.search-type {
:deep(.icon-arrow) {
display: inline-block;
font-size: 20px;
vertical-align: middle;
}
}
</style>