feat: 存酒模块
This commit is contained in:
duan
parent
cff5363260
commit
8838df65fb
|
|
@ -438,6 +438,16 @@ export const constantRoutes: RouteRecordRaw[] = [
|
|||
hidden: true
|
||||
},
|
||||
},
|
||||
{
|
||||
path: "storingWine",
|
||||
component: () => import("@/views/application/list/storingWine/index.vue"),
|
||||
name: "storingWine",
|
||||
meta: {
|
||||
title: "存酒",
|
||||
affix: false,
|
||||
hidden: true
|
||||
},
|
||||
},
|
||||
|
||||
/**列表end */
|
||||
|
||||
|
|
|
|||
|
|
@ -22,7 +22,7 @@ import ad from "@/assets/images/application/ad.png";
|
|||
import call from "@/assets/images/application/call.png";
|
||||
|
||||
const list = ref([
|
||||
{ name: "存酒", icon: bear, path: "", desc: "用户未喝完的酒可暂存在店里" },
|
||||
{ name: "存酒", icon: bear, path: "storingWine", desc: "用户未喝完的酒可暂存在店里" },
|
||||
{ name: "点歌", icon: song, path: "", desc: "用户可以付费点歌" },
|
||||
{ name: "广告", icon: ad, path: "advertisement", desc: "添加弹窗广告" },
|
||||
{ name: "叫号", icon: call, path: "lineUplist", desc: "" },
|
||||
|
|
|
|||
|
|
@ -0,0 +1,26 @@
|
|||
<template>
|
||||
<div style="padding: 15px;">
|
||||
<el-tabs type="border-card" v-model="datas.activeName" @tab-click="handleClick">
|
||||
<el-tab-pane label="存酒记录" name="Winerecord">
|
||||
<Winerecord v-if="datas.activeName == 'Winerecord'" />
|
||||
</el-tab-pane>
|
||||
<el-tab-pane label="可存酒管理" name="Storingwine">
|
||||
<Storingwine v-if="datas.activeName == 'Storingwine'" />
|
||||
</el-tab-pane>
|
||||
<el-tab-pane label="存酒统计" name="statistics">
|
||||
<statistics v-if="datas.activeName == 'statistics'" />
|
||||
</el-tab-pane>
|
||||
</el-tabs>
|
||||
</div>
|
||||
</template>
|
||||
<script setup>
|
||||
import Winerecord from './storingWineconfig/Winerecord.vue'
|
||||
import statistics from './storingWineconfig/statistics.vue'
|
||||
import Storingwine from './storingWineconfig/Storingwine.vue'
|
||||
let datas = reactive({
|
||||
activeName: "Winerecord",
|
||||
})
|
||||
function handleClick(tab) {
|
||||
datas.activeName = tab.props.name;
|
||||
}
|
||||
</script>
|
||||
|
|
@ -0,0 +1,13 @@
|
|||
<template>
|
||||
<!-- 存酒模块 -->
|
||||
<div style="padding: 15px;">
|
||||
<!-- 搜索 -->
|
||||
<Search></Search>
|
||||
<!-- 表格 -->
|
||||
<Content></Content>
|
||||
</div>
|
||||
</template>
|
||||
<script setup>
|
||||
import Search from './Storingwineconfig/Search.vue'
|
||||
import Content from './Storingwineconfig/Content.vue'
|
||||
</script>
|
||||
|
|
@ -0,0 +1,315 @@
|
|||
<template>
|
||||
<div class="Table">
|
||||
<!-- 按钮 -->
|
||||
<AddButton @add="add"></AddButton>
|
||||
<!-- 表格 -->
|
||||
<Table :list="datas.tableData" @handleDelete="handleDelete" @handleEdit="handleEdit"
|
||||
@myDialogRefqs="myDialogRefqsevent">
|
||||
</Table>
|
||||
<!-- 分页 -->
|
||||
<Paging :pagingConfig="datas.pagingConfig" @sizeChange="sizeChange" @currentChange="currentChange"></Paging>
|
||||
<!-- 其他模板 -->
|
||||
<!-- 新增/编辑 -->
|
||||
<myDialog ref="myDialogRef" :title="datas.title" @confirm="confirm" width="30%">
|
||||
<el-form ref="ruleFormRef" :rules="datas.rules" :model="datas.DialogForm" label-width="120px">
|
||||
<div class="sourceStyle">
|
||||
<div :class="[datas.DialogForm.source == 0 ? 'active' : '']" @click="datas.DialogForm.source = 0">手动添加</div>
|
||||
<div :class="[datas.DialogForm.source == 1 ? 'active' : '']" @click="datas.DialogForm.source = 1">从商品添加</div>
|
||||
</div>
|
||||
<template v-if="datas.DialogForm.source == 0">
|
||||
<el-form-item label="酒品名" prop="name">
|
||||
<el-input v-model="datas.DialogForm.name" placeholder="请输入酒品名" />
|
||||
</el-form-item>
|
||||
<el-form-item label="酒品图片">
|
||||
<div style="display: flex; flex-wrap: wrap">
|
||||
<div v-for="(item, index) in datas.DialogForm.imgUrl" :key="index" style="position: relative"
|
||||
class="showStyle">
|
||||
<el-icon class="buttonstyle" @click="deleteEvent(item)">
|
||||
<DeleteFilled />
|
||||
</el-icon>
|
||||
<img style="width: 148px; height: 148px; margin-right: 6px" class="imgStyle" :src="item" alt="" />
|
||||
</div>
|
||||
<div class="upImgStyle" @click="addimgEvent" v-if="datas.DialogForm.imgUrl.length < 1">+</div>
|
||||
</div>
|
||||
</el-form-item>
|
||||
</template>
|
||||
<template v-else>
|
||||
<el-form-item label="选择商品">
|
||||
<div>
|
||||
<el-button type="primary" @click="addgoods(index);">添加商品</el-button><br />
|
||||
</div>
|
||||
</el-form-item>
|
||||
</template>
|
||||
<template v-if="datas.DialogForm.source == 1">
|
||||
<el-form-item label="商品名称">
|
||||
{{ datas.seleteData.name }}
|
||||
</el-form-item>
|
||||
<el-form-item label="商品图片">
|
||||
<img :src="datas.seleteData.coverImg" style="width: 120px;height: 120px;" alt="">
|
||||
</el-form-item>
|
||||
</template>
|
||||
<el-form-item label="单位" v-if="datas.DialogForm.source == 0">
|
||||
<el-input v-model="datas.DialogForm.unit" placeholder="请输入单位" />
|
||||
</el-form-item>
|
||||
<el-form-item label="有效期（天）">
|
||||
<el-input-number v-model="datas.DialogForm.period" />
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</myDialog>
|
||||
<!-- 存酒 -->
|
||||
<myDialog ref="myDialogRefqs" title="记录" @confirm="confirmqs" width="30%">
|
||||
<el-form-item label="选择用户">
|
||||
<el-select v-model="datas.DialogForm.userId" filterable placeholder="请选择选择用户" style="width: 240px">
|
||||
<el-option v-for="item in datas.options" :key="item.userId" :label="item.nickName" :value="item.userId" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="数量">
|
||||
<el-input-number v-model="datas.winereNum" />
|
||||
</el-form-item>
|
||||
</myDialog>
|
||||
<!-- 选择图片 -->
|
||||
<shopList ref="shopListRef" @success="selectShopRes" />
|
||||
<AddImg ref="addImg" @successEvent="successEvent"></AddImg>
|
||||
</div>
|
||||
</template>
|
||||
<script setup>
|
||||
import AddButton from './component/AddButton.vue'
|
||||
import Table from './component/Table.vue'
|
||||
import shopList from "@/components/mycomponents/shopList.vue";
|
||||
import Paging from './component/Paging.vue'
|
||||
import myDialog from '@/components/mycomponents/myDialog.vue'
|
||||
import eventBus from '@/utils/eventBus'
|
||||
import API from './api'
|
||||
|
||||
const datas = reactive({
|
||||
tableData: [], // 表格数据
|
||||
title: '新增数据',
|
||||
pagingConfig: {
|
||||
total: 0, // 总数
|
||||
pageSize: 10, // 每页数据数量
|
||||
pageNumber: 1, // 当前页码
|
||||
},
|
||||
DialogForm: { // 弹窗表单数据
|
||||
source: 0,
|
||||
name: "",
|
||||
period: 1,
|
||||
imgUrl: []
|
||||
},
|
||||
options: [],
|
||||
rules: {
|
||||
name: [
|
||||
{ required: true, message: '请输入酒名', trigger: 'blur' },
|
||||
],
|
||||
},
|
||||
// 选择商品的数据
|
||||
seleteData: {},
|
||||
winereNum: 1
|
||||
})
|
||||
const myDialogRef = ref(null)
|
||||
const ruleFormRef = ref(null)
|
||||
const shopListRef = ref(null)
|
||||
const myDialogRefqsdata = ref(null)
|
||||
const myDialogRefqs = ref(null)
|
||||
onMounted(() => {
|
||||
getList()
|
||||
eventBus.on('search', (res) => {
|
||||
getList(res)
|
||||
})
|
||||
getshopUser()
|
||||
})
|
||||
function addgoods(index) {
|
||||
shopListRef.value.opens()
|
||||
}
|
||||
onBeforeUnmount(() => {
|
||||
eventBus.off('search')
|
||||
})
|
||||
function myDialogRefqsevent(item) {
|
||||
myDialogRefqsdata.value = item
|
||||
myDialogRefqs.value.open()
|
||||
}
|
||||
async function getshopUser(params) {
|
||||
const res = await API.getshopUser({})
|
||||
datas.options = res.records
|
||||
}
|
||||
async function getList(data = {}) {
|
||||
const res = await API.getPage({ page: datas.pagingConfig.pageNumber, size: datas.pagingConfig.pageSize, ...data })
|
||||
datas.tableData = res.records
|
||||
datas.pagingConfig.total = res.totalRow
|
||||
datas.pagingConfig.pageSize = res.pageSize
|
||||
datas.pagingConfig.pageNumber = res.pageNumber
|
||||
}
|
||||
// 分组选择商品
|
||||
function selectShopRes(res) {
|
||||
console.log(res, '选择图片')
|
||||
datas.seleteData = res[0]
|
||||
}
|
||||
async function confirmqs() {
|
||||
// 存酒
|
||||
let obj = { userId: datas.DialogForm.userId, shopStorageGoodId: myDialogRefqsdata.value.id, num: datas.winereNum, expDay: 1 }
|
||||
let res = await API.adds(obj)
|
||||
ElMessage({
|
||||
message: '成功',
|
||||
type: 'success',
|
||||
})
|
||||
getList()
|
||||
myDialogRefqs.value.close()
|
||||
}
|
||||
function add() {
|
||||
if (datas.DialogForm.id) {
|
||||
rest()
|
||||
}
|
||||
datas.title = '新增数据'
|
||||
myDialogRef.value.open()
|
||||
}
|
||||
async function handleEdit(row) {
|
||||
datas.title = '编辑数据'
|
||||
const res = await API.getinfo(row.id)
|
||||
datas.DialogForm = res
|
||||
if (datas.DialogForm.source == 0) {
|
||||
// 图片处理
|
||||
// datas.DialogForm.imgUrl = datas.DialogForm.imgUrl.join(',')
|
||||
} else {
|
||||
datas.seleteData.id = datas.DialogForm.prodId
|
||||
datas.seleteData.name = datas.DialogForm.name
|
||||
datas.seleteData.coverImg = datas.DialogForm.imgUrl
|
||||
}
|
||||
// 有图片
|
||||
let imgu = res.imgUrl.split(',')
|
||||
datas.DialogForm.imgUrl = imgu
|
||||
myDialogRef.value.open()
|
||||
}
|
||||
async function confirm() {
|
||||
ruleFormRef.value.validate(async valid => {
|
||||
if (valid) {
|
||||
let res = null
|
||||
if (datas.DialogForm.source == 0) {
|
||||
// 图片处理
|
||||
datas.DialogForm.imgUrl = datas.DialogForm.imgUrl.join(',')
|
||||
} else {
|
||||
datas.DialogForm.prodId = datas.seleteData.id
|
||||
datas.DialogForm.name = datas.seleteData.name
|
||||
datas.DialogForm.imgUrl = datas.seleteData.coverImg
|
||||
}
|
||||
if (datas.title == '新增数据') {
|
||||
res = await API.add(datas.DialogForm)
|
||||
} else {
|
||||
res = await API.update(datas.DialogForm)
|
||||
}
|
||||
ElMessage({
|
||||
message: '成功',
|
||||
type: 'success',
|
||||
})
|
||||
datas.seleteData = {}
|
||||
rest()
|
||||
getList()
|
||||
myDialogRef.value.close()
|
||||
}
|
||||
})
|
||||
}
|
||||
// 重置
|
||||
function rest() {
|
||||
datas.DialogForm = { sort: 1, source: 0, imgUrl: [], period: 1 }
|
||||
}
|
||||
async function handleDelete(id) {
|
||||
ElMessageBox.confirm("是否删除数据项?", "提示", {
|
||||
confirmButtonText: "确定",
|
||||
cancelButtonText: "取消",
|
||||
type: "warning",
|
||||
}).then(
|
||||
async () => {
|
||||
let res = await API.deleteByIds(id)
|
||||
ElMessage({
|
||||
message: '删除成功',
|
||||
type: 'success',
|
||||
})
|
||||
getList()
|
||||
}
|
||||
);
|
||||
}
|
||||
|
||||
// 图片
|
||||
const addImg = ref(null)
|
||||
function addimgEvent() {
|
||||
(addImg.value)?.show()
|
||||
}
|
||||
function successEvent(d) {
|
||||
datas.DialogForm['imgUrl'].push(d[0].url);
|
||||
}
|
||||
function deleteEvent(d) {
|
||||
let index = datas.DialogForm.imgUrl.findIndex((ele) => ele == d);
|
||||
datas.DialogForm.imgUrl.splice(index, 1);
|
||||
}
|
||||
// 分页
|
||||
function sizeChange(val) {
|
||||
datas.pagingConfig.pageSize = val
|
||||
getList()
|
||||
}
|
||||
function currentChange(val) {
|
||||
datas.pagingConfig.pageNumber = val
|
||||
getList()
|
||||
}
|
||||
|
||||
</script>
|
||||
<style scoped lang="scss">
|
||||
.Table {
|
||||
padding: 20px;
|
||||
background-color: #fff;
|
||||
border: 1px solid #e4e7ed;
|
||||
margin-top: 20px;
|
||||
border-radius: 4px;
|
||||
}
|
||||
|
||||
.sourceStyle {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
margin-bottom: 20px;
|
||||
|
||||
>div {
|
||||
width: 20%;
|
||||
height: 40px;
|
||||
line-height: 40px;
|
||||
text-align: center;
|
||||
background-color: #dcf0e8;
|
||||
color: #74dfa3;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.active {
|
||||
background-color: #39d47a !important;
|
||||
color: #fff;
|
||||
width: 20%;
|
||||
line-height: 30px;
|
||||
border: 6px solid #dcf0e8;
|
||||
}
|
||||
}
|
||||
|
||||
// 图片库样式
|
||||
.showStyle:hover>.buttonstyle {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.upImgStyle {
|
||||
cursor: pointer;
|
||||
width: 148px;
|
||||
height: 148px;
|
||||
line-height: 148px;
|
||||
text-align: center;
|
||||
border: 1px dashed #ccc;
|
||||
border-radius: 1%;
|
||||
font-size: 30px;
|
||||
color: #ccc;
|
||||
}
|
||||
|
||||
.buttonstyle {
|
||||
border-radius: 50%;
|
||||
color: #db1616;
|
||||
background-color: #fff;
|
||||
font-size: 20px;
|
||||
display: none;
|
||||
position: absolute;
|
||||
right: 0px;
|
||||
top: -10px;
|
||||
z-index: 10;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,47 @@
|
|||
<template>
|
||||
<div class="Search">
|
||||
<el-form :inline="true" :model="formInline" class="demo-form-inline">
|
||||
<el-form-item label="酒名">
|
||||
<el-input v-model="formInline.name" placeholder="请输入酒名" clearable />
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button type="primary" icon="Search" @click="onSubmit">搜索</el-button>
|
||||
<el-button icon="Refresh" @click="reset">重置</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import eventBus from '@/utils/eventBus'
|
||||
const formInline = reactive({
|
||||
name: '',
|
||||
})
|
||||
const onSubmit = () => {
|
||||
eventBus.emit('search', formInline)
|
||||
}
|
||||
const reset = () => {
|
||||
for (let key in formInline) {
|
||||
formInline[key] = ''
|
||||
}
|
||||
eventBus.emit('search', formInline)
|
||||
}
|
||||
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.Search {
|
||||
padding: 20px;
|
||||
background-color: #fff;
|
||||
border: 1px solid #e4e7ed;
|
||||
border-radius: 4px;
|
||||
}
|
||||
|
||||
.demo-form-inline .el-input {
|
||||
--el-input-width: 220px;
|
||||
}
|
||||
|
||||
.demo-form-inline .el-select {
|
||||
--el-select-width: 220px;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,81 @@
|
|||
import request from "@/utils/request";
|
||||
const baseURL = "/product/admin/storageGood";
|
||||
// XXX-配置
|
||||
const AuthAPI = {
|
||||
// 列表
|
||||
getList(params: any) {
|
||||
return request<any, Responseres>({
|
||||
url: `${baseURL}/list`,
|
||||
method: "get",
|
||||
params,
|
||||
});
|
||||
},
|
||||
/** 分页*/
|
||||
getPage(params: any) {
|
||||
return request<any, Responseres>({
|
||||
url: `${baseURL}`,
|
||||
method: "get",
|
||||
params,
|
||||
});
|
||||
},
|
||||
// 获取用户店铺列表
|
||||
getshopUser() {
|
||||
return request<any, Responseres>({
|
||||
url: `/account/admin/shopUser`,
|
||||
method: "get",
|
||||
});
|
||||
},
|
||||
// 新增
|
||||
add(data: any) {
|
||||
return request<any, Responseres>({
|
||||
url: `${baseURL}`,
|
||||
method: "post",
|
||||
data: { ...data },
|
||||
});
|
||||
},
|
||||
adds(data: any) {
|
||||
return request<any, Responseres>({
|
||||
url: `/product/admin/shopStorage`,
|
||||
method: "post",
|
||||
data: { ...data },
|
||||
});
|
||||
},
|
||||
// 详情
|
||||
getinfo(id: number) {
|
||||
return request<any, Responseres>({
|
||||
url: `${baseURL}/detail?id=${id}`,
|
||||
method: "get",
|
||||
});
|
||||
},
|
||||
// 编辑
|
||||
update(data: Object) {
|
||||
return request<any, Responseres>({
|
||||
url: `${baseURL}/edit`,
|
||||
method: "put",
|
||||
data,
|
||||
});
|
||||
},
|
||||
updates(data: Object) {
|
||||
return request<any, Responseres>({
|
||||
url: `/product/admin/shopStorage`,
|
||||
method: "put",
|
||||
data,
|
||||
});
|
||||
},
|
||||
// 删除
|
||||
deleteByIds(data: number | String) {
|
||||
return request<any, Responseres>({
|
||||
url: `${baseURL}?id=${data}`,
|
||||
method: "delete",
|
||||
});
|
||||
},
|
||||
|
||||
};
|
||||
export interface Responseres {
|
||||
code?: number | null;
|
||||
data?: any;
|
||||
msg?: null | string;
|
||||
[property: string]: any;
|
||||
}
|
||||
|
||||
export default AuthAPI;
|
||||
|
|
@ -0,0 +1,14 @@
|
|||
<template>
|
||||
<el-button type="primary" icon="Plus" @click="addEvent">新增</el-button>
|
||||
</template>
|
||||
<script setup>
|
||||
import { useRouter } from 'vue-router';
|
||||
const router = useRouter();
|
||||
const emit = defineEmits(['add']);
|
||||
function toUrl(name) {
|
||||
router.push({ name });
|
||||
}
|
||||
function addEvent() {
|
||||
emit('add');
|
||||
}
|
||||
</script>
|
||||
|
|
@ -0,0 +1,24 @@
|
|||
<template>
|
||||
<div style="margin-top: 10px;">
|
||||
<el-pagination background :page-size="props.pagingConfig.pageSize" :page-sizes="[10, 20, 30, 40]"
|
||||
layout="prev,pager,next,jumper,total,sizes" v-model:current-page="props.pagingConfig.pageNumber"
|
||||
:total="props.pagingConfig.total" @size-change="handleSizeChange" @current-change="handleCurrentChange" />
|
||||
</div>
|
||||
</template>
|
||||
<script setup>
|
||||
const props = defineProps({
|
||||
pagingConfig: {
|
||||
type: Object,
|
||||
default: () => { }
|
||||
}
|
||||
})
|
||||
const emit = defineEmits(['sizeChange', 'currentChange'])
|
||||
// 当前条改变
|
||||
function handleSizeChange(val) {
|
||||
emit('sizeChange', val)
|
||||
}
|
||||
// 当前页改变
|
||||
function handleCurrentChange(val) {
|
||||
emit('currentChange', val)
|
||||
}
|
||||
</script>
|
||||
|
|
@ -0,0 +1,50 @@
|
|||
<template>
|
||||
<div style="margin-top: 10px;">
|
||||
<el-table :data="props.list" border style="width: 100%">
|
||||
<el-table-column prop="name" align="center" label="酒名">
|
||||
<template v-slot="scope">
|
||||
<div style="display: flex;align-items: center;justify-content: center;">
|
||||
<el-image style="width: 40px; height: 40px" :src="scope.row.imgUrl" fit="contain" />
|
||||
{{ scope.row.name }}
|
||||
</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="unit" align="center" label="单位" />
|
||||
<el-table-column prop="period" align="center" label="有效期（天）" />
|
||||
<el-table-column prop="source" align="center" label="来源">
|
||||
<template v-slot="scope">
|
||||
{{ scope.row.source == 1 ? '商品' : '手动' }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="操作" align="center">
|
||||
<template #default="scope">
|
||||
<el-button size="small" type="primary" link icon="Edit" @click="myDialogRefqs(scope.row)">存酒</el-button>
|
||||
<el-button size="small" type="primary" link icon="Edit" @click="handleEdit(scope.row)">编辑</el-button>
|
||||
<el-button size="small" type="danger" link icon="Delete" style="color: #f89797;"
|
||||
@click="handleDelete(scope.$index, scope.row)"> 删除 </el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
const emit = defineEmits(['handleDelete', 'handleEdit', 'myDialogRefqs'])
|
||||
const props = defineProps({
|
||||
list: {
|
||||
type: Array,
|
||||
default: () => []
|
||||
}
|
||||
})
|
||||
|
||||
function handleEdit(row) {
|
||||
emit('handleEdit', row)
|
||||
}
|
||||
function myDialogRefqs(row) {
|
||||
emit('myDialogRefqs', row)
|
||||
}
|
||||
function handleDelete(index, row) {
|
||||
emit('handleDelete', row.id)
|
||||
}
|
||||
|
||||
</script>
|
||||
|
|
@ -0,0 +1,13 @@
|
|||
<template>
|
||||
<!-- XXX模块 -->
|
||||
<div style="padding: 15px;">
|
||||
<!-- 搜索 -->
|
||||
<Search></Search>
|
||||
<!-- 表格 -->
|
||||
<Content></Content>
|
||||
</div>
|
||||
</template>
|
||||
<script setup>
|
||||
import Search from './Winerecordconfig/Search.vue'
|
||||
import Content from './Winerecordconfig/Content.vue'
|
||||
</script>
|
||||
|
|
@ -0,0 +1,236 @@
|
|||
<template>
|
||||
<div class="Table">
|
||||
<!-- 按钮 -->
|
||||
<AddButton @add="add"></AddButton>
|
||||
<!-- 表格 -->
|
||||
<Table :list="datas.tableData" @handleDelete="handleDelete" @handleEdit="handleEdit"></Table>
|
||||
<!-- 分页 -->
|
||||
<Paging :pagingConfig="datas.pagingConfig" @sizeChange="sizeChange" @currentChange="currentChange"></Paging>
|
||||
<!-- 其他模板 -->
|
||||
<!-- 新增/编辑 -->
|
||||
<myDialog ref="myDialogRef" :title="datas.title" @confirm="confirm" width="30%">
|
||||
<el-form ref="ruleFormRef" :rules="datas.rules" :model="datas.DialogForm" label-width="80px">
|
||||
<el-form-item label="选择用户">
|
||||
<el-select v-model="datas.DialogForm.userId" filterable placeholder="请选择选择用户" style="width: 240px">
|
||||
<el-option v-for="item in datas.options" :key="item.userId" :label="item.nickName" :value="item.userId" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="选择酒品">
|
||||
<el-select v-model="datas.DialogForm.shopStorageGoodId" placeholder="请选择选择酒品" style="width: 240px">
|
||||
<el-option v-for="item in datas.options2" :key="item.id" :label="item.name" :value="item.id" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="数量">
|
||||
<el-col :span="3">
|
||||
<el-input-number v-model="datas.DialogForm.num" />
|
||||
</el-col>
|
||||
</el-form-item>
|
||||
<el-form-item label="过期时间">
|
||||
<el-input-number v-model="datas.DialogForm.expDay" />
|
||||
<!-- <el-date-picker v-model="datas.DialogForm.expDay" type="date" value-format="YYYY-MM-DD" /> -->
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</myDialog>
|
||||
<!-- 选择图片 -->
|
||||
<!-- <AddImg ref="addImg" @successEvent="successEvent"></AddImg> -->
|
||||
<!-- 查看记录 -->
|
||||
<myDialog ref="myDialogRefs" title="记录" @confirm="confirms" width="30%">
|
||||
<el-table :data="datas.storingWineList" border style="width: 100%">
|
||||
<el-table-column prop="content" align="center" label="记录"> </el-table-column>
|
||||
<el-table-column prop="time" align="center" label="操作时间"> </el-table-column>
|
||||
</el-table>
|
||||
</myDialog>
|
||||
<!-- 取酒 -->
|
||||
<myDialog ref="myDialogRefqs" title="记录" @confirm="confirmqs" width="30%">
|
||||
<el-col :span="3">
|
||||
<el-input-number v-model="datas.winereNum" min="0" :max="myDialogRefqsdata.num" />
|
||||
</el-col>
|
||||
</myDialog>
|
||||
</div>
|
||||
</template>
|
||||
<script setup>
|
||||
import AddButton from './component/AddButton.vue'
|
||||
import Table from './component/Table.vue'
|
||||
import Paging from './component/Paging.vue'
|
||||
import myDialog from '@/components/mycomponents/myDialog.vue'
|
||||
import eventBus from '@/utils/eventBus'
|
||||
import API from './api'
|
||||
|
||||
const datas = reactive({
|
||||
tableData: [], // 表格数据
|
||||
title: '新增数据',
|
||||
pagingConfig: {
|
||||
total: 0, // 总数
|
||||
pageSize: 10, // 每页数据数量
|
||||
pageNumber: 1, // 当前页码
|
||||
},
|
||||
DialogForm: { // 弹窗表单数据
|
||||
num: 1,
|
||||
expDay: 1
|
||||
},
|
||||
// 取酒
|
||||
winereNum: 1,
|
||||
// 存酒记录
|
||||
storingWineList: [],
|
||||
options: [],
|
||||
options2: [],
|
||||
rules: {
|
||||
name: [
|
||||
{ required: true, message: '请输入供应商名称', trigger: 'blur' },
|
||||
{ min: 3, max: 5, message: 'Length should be 3 to 5', trigger: 'blur' },
|
||||
],
|
||||
}
|
||||
})
|
||||
const myDialogRef = ref(null)
|
||||
const myDialogRefs = ref(null)
|
||||
const myDialogRefqs = ref(null)
|
||||
const myDialogRefqsdata = ref(null)
|
||||
const ruleFormRef = ref(null)
|
||||
onMounted(() => {
|
||||
getList()
|
||||
// 获取店铺用户信息
|
||||
getshopUser()
|
||||
// 获取酒品列表
|
||||
getstorageGood()
|
||||
eventBus.on('search', (res) => {
|
||||
getList(res)
|
||||
})
|
||||
})
|
||||
onBeforeUnmount(() => {
|
||||
eventBus.off('search')
|
||||
})
|
||||
async function getList(data = {}) {
|
||||
const res = await API.getPage({ page: datas.pagingConfig.pageNumber, size: datas.pagingConfig.pageSize, ...data })
|
||||
datas.tableData = res.records
|
||||
datas.pagingConfig.total = res.totalRow
|
||||
datas.pagingConfig.pageSize = res.pageSize
|
||||
datas.pagingConfig.pageNumber = res.pageNumber
|
||||
}
|
||||
async function getshopUser(params) {
|
||||
const res = await API.getshopUser({})
|
||||
datas.options = res.records
|
||||
}
|
||||
async function getstorageGood() {
|
||||
const res = await API.storageGood({})
|
||||
datas.options2 = res.records
|
||||
}
|
||||
function add() {
|
||||
if (datas.DialogForm.id) {
|
||||
rest()
|
||||
}
|
||||
datas.title = '新增数据'
|
||||
myDialogRef.value.open()
|
||||
}
|
||||
async function handleEdit(row) {
|
||||
// 查看记录
|
||||
const res = await API.record(row.id)
|
||||
console.log(res, '2222')
|
||||
datas.storingWineList = res
|
||||
// 有图片
|
||||
// datas.DialogForm.goodsImageUrl = res.goodsImageUrl.split(',')
|
||||
myDialogRefs.value.open()
|
||||
}
|
||||
async function confirm() {
|
||||
ruleFormRef.value.validate(async valid => {
|
||||
if (valid) {
|
||||
let res = null
|
||||
if (datas.title == '新增数据') {
|
||||
// 图片处理
|
||||
// datas.DialogForm.goodsImageUrl = datas.DialogForm.goodsImageUrl.join(',')
|
||||
res = await API.add(datas.DialogForm)
|
||||
} else {
|
||||
// datas.DialogForm.goodsImageUrl = datas.DialogForm.goodsImageUrl.join(',')
|
||||
res = await API.update(datas.DialogForm)
|
||||
}
|
||||
ElMessage({
|
||||
message: '成功',
|
||||
type: 'success',
|
||||
})
|
||||
rest()
|
||||
getList()
|
||||
myDialogRef.value.close()
|
||||
}
|
||||
})
|
||||
}
|
||||
function confirms() {
|
||||
myDialogRefs.value.close()
|
||||
}
|
||||
async function confirmqs() {
|
||||
let res = await API.update({ id: myDialogRefqsdata.value.id, num: -datas.winereNum })
|
||||
ElMessage({
|
||||
message: '成功',
|
||||
type: 'success',
|
||||
})
|
||||
getList()
|
||||
myDialogRefqs.value.close()
|
||||
}
|
||||
// 重置
|
||||
function rest() {
|
||||
datas.DialogForm = { sort: 1, images: [] }
|
||||
}
|
||||
function handleDelete(item) {
|
||||
myDialogRefqsdata.value = item
|
||||
myDialogRefqs.value.open()
|
||||
}
|
||||
|
||||
// 图片
|
||||
const addImg = ref(null)
|
||||
function addimgEvent() {
|
||||
(addImg.value)?.show()
|
||||
}
|
||||
function successEvent(d) {
|
||||
datas.DialogForm['images'].push(d[0].url);
|
||||
}
|
||||
function deleteEvent(d) {
|
||||
let index = datas.DialogForm.images.findIndex((ele) => ele == d);
|
||||
datas.DialogForm.images.splice(index, 1);
|
||||
}
|
||||
// 分页
|
||||
function sizeChange(val) {
|
||||
datas.pagingConfig.pageSize = val
|
||||
getList()
|
||||
}
|
||||
function currentChange(val) {
|
||||
datas.pagingConfig.pageNumber = val
|
||||
getList()
|
||||
}
|
||||
|
||||
</script>
|
||||
<style scoped lang="scss">
|
||||
.Table {
|
||||
padding: 20px;
|
||||
background-color: #fff;
|
||||
border: 1px solid #e4e7ed;
|
||||
margin-top: 20px;
|
||||
border-radius: 4px;
|
||||
}
|
||||
|
||||
// 图片库样式
|
||||
.showStyle:hover>.buttonstyle {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.upImgStyle {
|
||||
cursor: pointer;
|
||||
width: 148px;
|
||||
height: 148px;
|
||||
line-height: 148px;
|
||||
text-align: center;
|
||||
border: 1px dashed #ccc;
|
||||
border-radius: 1%;
|
||||
font-size: 30px;
|
||||
color: #ccc;
|
||||
}
|
||||
|
||||
.buttonstyle {
|
||||
border-radius: 50%;
|
||||
color: #db1616;
|
||||
background-color: #fff;
|
||||
font-size: 20px;
|
||||
display: none;
|
||||
position: absolute;
|
||||
right: 0px;
|
||||
top: -10px;
|
||||
z-index: 10;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,59 @@
|
|||
<template>
|
||||
<div class="Search">
|
||||
<el-form :inline="true" :model="formInline" class="demo-form-inline">
|
||||
<el-form-item label="酒名/用户昵称">
|
||||
<el-input v-model="formInline.key" placeholder="请输入酒名/用户昵称" clearable />
|
||||
</el-form-item>
|
||||
<el-form-item label="手机号">
|
||||
<el-input v-model="formInline.phone" placeholder="请输入手机号" clearable />
|
||||
</el-form-item>
|
||||
<el-form-item label="状态">
|
||||
<el-select v-model="formInline.status" placeholder="请选择状态" clearable>
|
||||
<el-option label="全部" value="" />
|
||||
<el-option label="已取完" value="0" />
|
||||
<el-option label="储存中" value="1" />
|
||||
<el-option label="已过期" value="2" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button type="primary" icon="Search" @click="onSubmit">搜索</el-button>
|
||||
<el-button icon="Refresh" @click="reset">重置</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import eventBus from '@/utils/eventBus'
|
||||
const formInline = reactive({
|
||||
key: '',
|
||||
phone: '',
|
||||
status: '',
|
||||
})
|
||||
const onSubmit = () => {
|
||||
eventBus.emit('search', formInline)
|
||||
}
|
||||
const reset = () => {
|
||||
for (let key in formInline) {
|
||||
formInline[key] = ''
|
||||
}
|
||||
eventBus.emit('search', formInline)
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.Search {
|
||||
padding: 20px;
|
||||
background-color: #fff;
|
||||
border: 1px solid #e4e7ed;
|
||||
border-radius: 4px;
|
||||
}
|
||||
|
||||
.demo-form-inline .el-input {
|
||||
--el-input-width: 220px;
|
||||
}
|
||||
|
||||
.demo-form-inline .el-select {
|
||||
--el-select-width: 220px;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,82 @@
|
|||
import request from "@/utils/request";
|
||||
const baseURL = "/product/admin/shopStorage";
|
||||
// 存酒-配置
|
||||
const AuthAPI = {
|
||||
// 列表
|
||||
getList(params: any) {
|
||||
return request<any, Responseres>({
|
||||
url: `${baseURL}/list`,
|
||||
method: "get",
|
||||
params,
|
||||
});
|
||||
},
|
||||
// 查看记录
|
||||
record(params: any) {
|
||||
return request<any, Responseres>({
|
||||
url: `${baseURL}/record?id=${params}`,
|
||||
method: "get",
|
||||
});
|
||||
},
|
||||
// 获取用户店铺列表
|
||||
getshopUser() {
|
||||
return request<any, Responseres>({
|
||||
url: `/account/admin/shopUser`,
|
||||
method: "get",
|
||||
});
|
||||
},
|
||||
// 获取酒品列表
|
||||
storageGood() {
|
||||
return request<any, Responseres>({
|
||||
url: `/product/admin/storageGood?name=`,
|
||||
method: "get",
|
||||
});
|
||||
},
|
||||
|
||||
/** 分页*/
|
||||
getPage(params: any) {
|
||||
return request<any, Responseres>({
|
||||
url: `${baseURL}`,
|
||||
method: "get",
|
||||
params,
|
||||
});
|
||||
},
|
||||
// 新增
|
||||
add(data: any) {
|
||||
return request<any, Responseres>({
|
||||
url: `${baseURL}`,
|
||||
method: "post",
|
||||
data: { ...data },
|
||||
});
|
||||
},
|
||||
// 详情
|
||||
getinfo(id: number) {
|
||||
return request<any, Responseres>({
|
||||
url: `${baseURL}/${id}`,
|
||||
method: "get",
|
||||
});
|
||||
},
|
||||
// 编辑
|
||||
update(data: Object) {
|
||||
return request<any, Responseres>({
|
||||
url: `${baseURL}`,
|
||||
method: "put",
|
||||
data,
|
||||
});
|
||||
},
|
||||
// 删除
|
||||
deleteByIds(id: number | String) {
|
||||
return request<any, Responseres>({
|
||||
url: `${baseURL}/${id}`,
|
||||
method: "delete",
|
||||
});
|
||||
},
|
||||
|
||||
};
|
||||
export interface Responseres {
|
||||
code?: number | null;
|
||||
data?: any;
|
||||
msg?: null | string;
|
||||
[property: string]: any;
|
||||
}
|
||||
|
||||
export default AuthAPI;
|
||||
|
|
@ -0,0 +1,10 @@
|
|||
<template>
|
||||
<el-button type="primary" icon="Plus" @click="addEvent">新增</el-button>
|
||||
</template>
|
||||
<script setup>
|
||||
const emit = defineEmits(['add']);
|
||||
|
||||
function addEvent() {
|
||||
emit('add');
|
||||
}
|
||||
</script>
|
||||
|
|
@ -0,0 +1,24 @@
|
|||
<template>
|
||||
<div style="margin-top: 10px;">
|
||||
<el-pagination background :page-size="props.pagingConfig.pageSize" :page-sizes="[10, 20, 30, 40]"
|
||||
layout="prev,pager,next,jumper,total,sizes" v-model:current-page="props.pagingConfig.pageNumber"
|
||||
:total="props.pagingConfig.total" @size-change="handleSizeChange" @current-change="handleCurrentChange" />
|
||||
</div>
|
||||
</template>
|
||||
<script setup>
|
||||
const props = defineProps({
|
||||
pagingConfig: {
|
||||
type: Object,
|
||||
default: () => { }
|
||||
}
|
||||
})
|
||||
const emit = defineEmits(['sizeChange', 'currentChange'])
|
||||
// 当前条改变
|
||||
function handleSizeChange(val) {
|
||||
emit('sizeChange', val)
|
||||
}
|
||||
// 当前页改变
|
||||
function handleCurrentChange(val) {
|
||||
emit('currentChange', val)
|
||||
}
|
||||
</script>
|
||||
|
|
@ -0,0 +1,66 @@
|
|||
<template>
|
||||
<div style="margin-top: 10px;">
|
||||
<el-table :data="props.list" border style="width: 100%">
|
||||
<el-table-column prop="name" align="center" label="用户名">
|
||||
<template v-slot="scope">
|
||||
<div style="display: flex;align-items: center;justify-content: center;">
|
||||
<el-image style="width: 40px; height: 40px" :src="scope.row.headImg" fit="contain" />
|
||||
{{ scope.row.nickName }}
|
||||
</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="name" align="center" label="酒品名">
|
||||
<template v-slot="scope">
|
||||
<div style="display: flex;align-items: center;justify-content: center;">
|
||||
<el-image style="width: 40px; height: 40px" :src="scope.row.imgUrl" fit="contain" />
|
||||
{{ scope.row.name }}
|
||||
</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="name" align="center" label="数量">
|
||||
<template v-slot="scope">
|
||||
<div style="display: flex;align-items: center;justify-content: center;">
|
||||
{{ scope.row.num }} {{ scope.row.unit }}
|
||||
</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="savTime" align="center" label="存酒时间" />
|
||||
<el-table-column prop="expTime" align="center" label="到期时间" />
|
||||
<el-table-column label="状态" align="center" prop="status">
|
||||
<template #default="scope">
|
||||
<el-tag type="info">{{
|
||||
scope.row.status == 0 ? '已取完' : scope.row.status === 1 ? '未取完' : '已过期'
|
||||
}}</el-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="操作" align="center">
|
||||
<template #default="scope">
|
||||
<el-button size="small" type="primary" link @click="handleEdit(scope.row)">查看记录</el-button>
|
||||
<el-button size="small" :type="scope.row.status == 1 ? 'primary' : 'info'" link
|
||||
@click="handleDelete(scope.row)">{{ scope.row.status == 0 ? '已取完'
|
||||
: scope.row.status === 1 ? '取酒' : '已过期' }}</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
const emit = defineEmits(['handleDelete', 'handleEdit'])
|
||||
const props = defineProps({
|
||||
list: {
|
||||
type: Array,
|
||||
default: () => []
|
||||
}
|
||||
})
|
||||
|
||||
function handleEdit(row) {
|
||||
emit('handleEdit', row)
|
||||
}
|
||||
function handleDelete(row) {
|
||||
if (row.status == 1) {
|
||||
emit('handleDelete', row)
|
||||
}
|
||||
}
|
||||
|
||||
</script>
|
||||
|
|
@ -0,0 +1,67 @@
|
|||
import request from "@/utils/request";
|
||||
const baseURL = "/product/admin/shopStorage";
|
||||
// 存酒-配置
|
||||
const AuthAPI = {
|
||||
// 列表
|
||||
getList(params: any) {
|
||||
return request<any, Responseres>({
|
||||
url: `${baseURL}/list`,
|
||||
method: "get",
|
||||
params,
|
||||
});
|
||||
},
|
||||
/** 分页*/
|
||||
getPage(params: any) {
|
||||
return request<any, Responseres>({
|
||||
url: `${baseURL}/page`,
|
||||
method: "get",
|
||||
params,
|
||||
});
|
||||
},
|
||||
// 新增
|
||||
add(data: any) {
|
||||
return request<any, Responseres>({
|
||||
url: `${baseURL}`,
|
||||
method: "post",
|
||||
data: { ...data },
|
||||
});
|
||||
},
|
||||
// 详情
|
||||
getinfo(id: number) {
|
||||
return request<any, Responseres>({
|
||||
url: `${baseURL}/${id}`,
|
||||
method: "get",
|
||||
});
|
||||
},
|
||||
// 编辑
|
||||
update(data: Object) {
|
||||
return request<any, Responseres>({
|
||||
url: `${baseURL}`,
|
||||
method: "put",
|
||||
data,
|
||||
});
|
||||
},
|
||||
// 删除
|
||||
deleteByIds(id: number | String) {
|
||||
return request<any, Responseres>({
|
||||
url: `${baseURL}/${id}`,
|
||||
method: "delete",
|
||||
});
|
||||
},
|
||||
// 存酒统计
|
||||
getcount() {
|
||||
return request<any, Responseres>({
|
||||
url: `${baseURL}/count`,
|
||||
method: "get",
|
||||
});
|
||||
},
|
||||
|
||||
};
|
||||
export interface Responseres {
|
||||
code?: number | null;
|
||||
data?: any;
|
||||
msg?: null | string;
|
||||
[property: string]: any;
|
||||
}
|
||||
|
||||
export default AuthAPI;
|
||||
|
|
@ -0,0 +1,30 @@
|
|||
<template>
|
||||
<div style="margin-top: 10px;">
|
||||
<el-table :data="list" border style="width: 100%">
|
||||
<el-table-column prop="name" align="center" label="商品信息">
|
||||
<template v-slot="scope">
|
||||
<div style="display: flex;align-items: center;justify-content: center;">
|
||||
<el-image style="width: 40px; height: 40px" :src="scope.row.imgUrl" fit="contain" />
|
||||
{{ scope.row.name }}
|
||||
</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="savNum" align="center" label="有效存酒" />
|
||||
<el-table-column prop="expNum" align="center" label="已过期存酒" />
|
||||
</el-table>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import API from './api'
|
||||
onMounted(() => {
|
||||
getList()
|
||||
})
|
||||
let list = ref([])
|
||||
async function getList() {
|
||||
let res = await API.getcount()
|
||||
list.value = res
|
||||
|
||||
}
|
||||
|
||||
</script>
|
||||
Loading…
Reference in New Issue