68 lines
1.9 KiB
Vue
68 lines
1.9 KiB
Vue
<template>
|
|
<view class="page">
|
|
<view class="toolbar">
|
|
<input v-model.trim="name" placeholder="新类别名称" />
|
|
<button size="mini" @click="create">新增</button>
|
|
</view>
|
|
<scroll-view scroll-y class="list">
|
|
<view class="item" v-for="c in list" :key="c.id">
|
|
<input v-model.trim="c.name" />
|
|
<view class="ops">
|
|
<button size="mini" @click="update(c)">保存</button>
|
|
<button size="mini" type="warn" @click="remove(c)">删除</button>
|
|
</view>
|
|
</view>
|
|
</scroll-view>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
import { get, post, put, del } from '../../common/http.js'
|
|
|
|
export default {
|
|
data() {
|
|
return { name: '', list: [] }
|
|
},
|
|
onLoad() { this.reload() },
|
|
methods: {
|
|
async reload() {
|
|
try {
|
|
const res = await get('/api/product-categories')
|
|
this.list = Array.isArray(res?.list) ? res.list : (Array.isArray(res) ? res : [])
|
|
} catch (_) {}
|
|
},
|
|
async create() {
|
|
if (!this.name) return
|
|
await post('/api/product-categories', { name: this.name })
|
|
this.name = ''
|
|
this.reload()
|
|
},
|
|
async update(c) {
|
|
await put('/api/product-categories/' + c.id, { name: c.name })
|
|
uni.showToast({ title: '已保存', icon: 'success' })
|
|
},
|
|
async remove(c) {
|
|
uni.showModal({ content: '确定删除该类别？', success: async (r) => {
|
|
if (!r.confirm) return
|
|
await del('/api/product-categories/' + c.id)
|
|
this.reload()
|
|
}})
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style>
|
|
.page { display:flex; flex-direction: column; height: 100vh; }
|
|
.toolbar { display:flex; gap: 12rpx; padding: 16rpx; background:#fff; }
|
|
.toolbar input { flex:1; background:#f6f6f6; border-radius: 12rpx; padding: 12rpx; }
|
|
.list { flex:1; }
|
|
.item { display:flex; gap: 12rpx; align-items:center; padding: 16rpx; background:#fff; border-bottom: 1rpx solid #f1f1f1; }
|
|
.item input { flex:1; background:#f7f7f7; border-radius: 10rpx; padding: 12rpx; }
|
|
.ops { display:flex; gap: 10rpx; }
|
|
</style>
|
|
|
|
|
|
|
|
|