d6451cf188
- 拆分 AdminView 为多个子页面组件，使用嵌套路由 - 拆分 MerchantView 为多个子页面组件，使用嵌套路由 - 创建 AdminLayout 和 MerchantLayout 布局组件 - 修复编译错误：IconSend 重复导入、IconDatabase 不存在 - 修复 HomeView 缺失 onMounted 导入 - 添加文件上传后端接口和静态资源映射 - 为商品和轮播图添加图片上传功能（支持预览、清除）
64 lines
1.8 KiB
Vue
64 lines
1.8 KiB
Vue
<template>
|
|
<a-card :bordered="false" class="content-card">
|
|
<template #title>库存管理</template>
|
|
<template #extra>
|
|
<a-button @click="loadInventory">
|
|
<template #icon><icon-refresh /></template>
|
|
刷新
|
|
</a-button>
|
|
</template>
|
|
<a-table :columns="inventoryColumns" :data="inventory" :pagination="{ pageSize: 8 }" :bordered="false">
|
|
<template #changeQty="{ record }">
|
|
<a-tag :color="record.changeQty > 0 ? 'green' : 'red'">
|
|
{{ record.changeQty > 0 ? '+' : '' }}{{ record.changeQty }}
|
|
</a-tag>
|
|
</template>
|
|
<template #actions="{ record }">
|
|
<a-popconfirm content="确定删除此库存记录吗？" @ok="deleteInventory(record.id)">
|
|
<a-button size="mini" status="danger" shape="round">删除</a-button>
|
|
</a-popconfirm>
|
|
</template>
|
|
</a-table>
|
|
</a-card>
|
|
</template>
|
|
|
|
<script setup>
|
|
import { ref, onMounted } from 'vue'
|
|
import { Message } from '@arco-design/web-vue'
|
|
import { api } from '../../api'
|
|
import { IconRefresh } from '@arco-design/web-vue/es/icon'
|
|
|
|
const inventory = ref([])
|
|
|
|
const inventoryColumns = [
|
|
{ title: 'ID', dataIndex: 'id', width: 60 },
|
|
{ title: '商品名称', dataIndex: 'productName' },
|
|
{ title: '变动', slotName: 'changeQty', width: 100 },
|
|
{ title: '备注', dataIndex: 'note' },
|
|
{ title: '时间', dataIndex: 'createdAt', width: 160 },
|
|
{ title: '操作', slotName: 'actions', width: 80 }
|
|
]
|
|
|
|
const loadInventory = async () => { inventory.value = await api.merchantInventory() }
|
|
|
|
const deleteInventory = async (id) => {
|
|
await api.deleteMerchantInventory(id)
|
|
Message.success('库存记录已删除')
|
|
await loadInventory()
|
|
}
|
|
|
|
onMounted(() => {
|
|
loadInventory()
|
|
})
|
|
</script>
|
|
|
|
<style scoped>
|
|
.content-card {
|
|
border-radius: 12px;
|
|
}
|
|
|
|
:deep(.arco-card-header) {
|
|
border-bottom: 1px solid #f0f0f0;
|
|
}
|
|
</style>
|