上传代码
This commit is contained in:
259
p-BluPrint_1.0.288888/pages/product/addDish.vue
Normal file
259
p-BluPrint_1.0.288888/pages/product/addDish.vue
Normal file
@ -0,0 +1,259 @@
|
||||
<template>
|
||||
<view>
|
||||
<view class="item" v-for="(tab, index) in resultArray" :key="index" @click="showDrawer('showLeft', tab)">
|
||||
{{ tab.groupName }}
|
||||
</view>
|
||||
<uni-drawer ref="showLeft" mode="left" :mask-click="true" @change="handleDrawerChange">
|
||||
|
||||
<view class="drawer-content">
|
||||
<input class="styled-input" v-model="form.dishesName" placeholder="请输入菜品名" />
|
||||
<button @click="chooseImage" class="styled-button">选择图片</button>
|
||||
<view v-if="form.dishesImage">
|
||||
<image :src="'http://'+form.dishesImage" style="width:30px; height:30px;" />
|
||||
|
||||
</view>
|
||||
<input class="styled-input" v-model="form.dishesPrice" type="number" step="0.01" placeholder="请输入菜品价格" />
|
||||
<button @click="addDishes" class="styled-button confirm">添加菜品</button>
|
||||
<view v-if="result !== null">{{ result }}</view>
|
||||
</view>
|
||||
</uni-drawer>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { apiImageUrl } from '../../API/api';
|
||||
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
businessId: '',
|
||||
resultArray: [],
|
||||
result: null,
|
||||
currentGroupId: '',
|
||||
form: {
|
||||
dishesName: '',
|
||||
dishesImage: '',
|
||||
dishesPrice: '',
|
||||
dishesGroup: '',
|
||||
inventoryStatus: 0,
|
||||
packPrice: 0,
|
||||
specificationsIds: [],
|
||||
status: 0,
|
||||
}
|
||||
};
|
||||
},
|
||||
mounted() {
|
||||
this.loadCurrentBusinessId();
|
||||
this.leftGroup();
|
||||
},
|
||||
methods: {
|
||||
loadCurrentBusinessId() {
|
||||
const storedBusinessId = uni.getStorageSync('businessId');
|
||||
if (storedBusinessId) {
|
||||
this.businessId = storedBusinessId;
|
||||
} else {
|
||||
console.error('currentBusinessId not found in storage');
|
||||
}
|
||||
},
|
||||
|
||||
leftGroup() {
|
||||
const DishesGroupQueryRequest = {
|
||||
businessId: this.businessId
|
||||
};
|
||||
|
||||
uni.request({
|
||||
url: apiImageUrl + '/api/dishesGroup/list/dishesGroup',
|
||||
method: 'POST',
|
||||
data: JSON.stringify(DishesGroupQueryRequest),
|
||||
header: {
|
||||
'Content-Type': 'application/json'
|
||||
}
|
||||
}).then((res) => {
|
||||
console.log(res);
|
||||
if (res[1] && res[1].data && res[1].data.code === 0) {
|
||||
this.resultArray = res[1].data.data.map(item => ({
|
||||
id: item.id,
|
||||
groupName: item.groupName
|
||||
}));
|
||||
console.log(this.resultArray);
|
||||
} else {
|
||||
console.error('Unexpected response structure:', res);
|
||||
}
|
||||
}).catch((error) => {
|
||||
console.error('Error fetching dishes groups:', error);
|
||||
});
|
||||
},
|
||||
|
||||
showDrawer(drawer, tab) {
|
||||
this.currentGroupId = tab.id;
|
||||
this.form.dishesGroup = tab.id;
|
||||
this.$refs[drawer].open();
|
||||
},
|
||||
|
||||
closeDrawer() {
|
||||
this.$refs.showLeft.close();
|
||||
},
|
||||
|
||||
chooseImage() {
|
||||
console.log('选择图片按钮被点击');
|
||||
uni.chooseImage({
|
||||
count: 1,
|
||||
sizeType: ['original', 'compressed'],
|
||||
sourceType: ['album', 'camera'],
|
||||
success: (res) => {
|
||||
console.log('图片选择成功:', res);
|
||||
const tempFilePaths = res.tempFilePaths;
|
||||
const filePath = tempFilePaths[0];
|
||||
this.uploadFile(filePath);
|
||||
},
|
||||
fail: (err) => {
|
||||
console.error('选择图片失败:', err);
|
||||
}
|
||||
});
|
||||
},
|
||||
|
||||
uploadFile(filePath) {
|
||||
console.log('开始上传图片:', filePath);
|
||||
uni.uploadFile({
|
||||
url: apiImageUrl + '/api/file/upload/server',
|
||||
filePath: filePath,
|
||||
name: 'file',
|
||||
formData: { biz: 'dishes' },
|
||||
success: (uploadFileRes) => {
|
||||
try {
|
||||
const responseData = JSON.parse(uploadFileRes.data);
|
||||
console.log('上传结果:', responseData);
|
||||
|
||||
|
||||
if (responseData && responseData.data) {
|
||||
this.form.dishesImage = responseData.data;
|
||||
console.log('上传成功,图片URL:', this.form.dishesImage);
|
||||
} else {
|
||||
console.error('未找到有效图片路径:', responseData);
|
||||
}
|
||||
} catch (e) {
|
||||
console.error('解析上传结果失败:', e);
|
||||
}
|
||||
},
|
||||
fail: (err) => {
|
||||
console.error('上传文件失败:', err);
|
||||
}
|
||||
});
|
||||
},
|
||||
|
||||
addDishes() {
|
||||
const data = {
|
||||
businessId: this.businessId,
|
||||
dishesGroupId: parseInt(this.form.dishesGroup, 10),
|
||||
dishesImage: this.form.dishesImage,
|
||||
dishesName: this.form.dishesName,
|
||||
dishesPrice: parseFloat(this.form.dishesPrice),
|
||||
inventoryStatus: 0,
|
||||
packPrice: 0,
|
||||
specificationsIds: [],
|
||||
status: 0,
|
||||
};
|
||||
|
||||
uni.request({
|
||||
url: apiImageUrl + '/api/dishes/add',
|
||||
method: 'POST',
|
||||
header: {
|
||||
'content-type': 'application/json'
|
||||
},
|
||||
data: data,
|
||||
success: (res) => {
|
||||
console.log('成功返回:', res.data);
|
||||
|
||||
this.result = '菜品添加成功!';
|
||||
this.closeDrawer();
|
||||
uni.showModal({
|
||||
title: '提示',
|
||||
content: '菜品添加成功!',
|
||||
showCancel: false
|
||||
});
|
||||
},
|
||||
fail: (err) => {
|
||||
console.error('请求失败:', err);
|
||||
|
||||
this.result = '菜品添加失败,请重试。';
|
||||
uni.showModal({
|
||||
title: '提示',
|
||||
content: '菜品添加失败,请重试!',
|
||||
showCancel: false
|
||||
});
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
|
||||
|
||||
<style lang="scss">
|
||||
.item {
|
||||
font-size: 13px;
|
||||
padding: 10px 20px;
|
||||
display: inline-block;
|
||||
background-color: rgba(245, 245, 220, 0.8);
|
||||
margin: 10px;
|
||||
border-radius: 20px;
|
||||
box-shadow: 0 4px #ccc, 0 6px 10px rgba(0,0,0,0.1), inset 0 2px #fff, inset 0 -2px 2px rgba(0,0,0,0.1);
|
||||
transition: transform 0.2s;
|
||||
|
||||
&:hover {
|
||||
transform: translateY(-2px);
|
||||
box-shadow: 0 6px #ccc, 0 8px 15px rgba(0,0,0,0.1), inset 0 4px #fff, inset 0 -2px 3px rgba(0,0,0,0.1);
|
||||
}
|
||||
}
|
||||
.styled-input {
|
||||
font-size: 14px;
|
||||
width: calc(100% - 20px);
|
||||
padding: 10px;
|
||||
margin: 10px 0;
|
||||
display: block;
|
||||
background-color: rgba(245, 245, 220, 0.8);
|
||||
border-radius: 20px;
|
||||
box-shadow: 0 4px #ccc, 0 6px 10px rgba(0,0,0,0.1), inset 0 2px #fff, inset 0 -2px 2px rgba(0,0,0,0.1);
|
||||
border: none;
|
||||
outline: none;
|
||||
transition: box-shadow 0.2s;
|
||||
|
||||
&:focus {
|
||||
box-shadow: 0 6px #ccc, 0 8px 15px rgba(0,0,0,0.1), inset 0 4px #fff, inset 0 -2px 3px rgba(0,0,0,0.1);
|
||||
}
|
||||
}
|
||||
|
||||
.button-container {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
.styled-button {
|
||||
font-size: 14px;
|
||||
flex: 1;
|
||||
margin: 5px;
|
||||
padding: 10px;
|
||||
background-color: rgba(173, 216, 230, 0.8);
|
||||
border: none;
|
||||
border-radius: 15px;
|
||||
box-shadow: 0 4px #ccc, 0 6px 10px rgba(0,0,0,0.1), inset 0 2px #fff, inset 0 -2px 2px rgba(0,0,0,0.1);
|
||||
cursor: pointer;
|
||||
transition: box-shadow 0.2s, background-color 0.2s;
|
||||
|
||||
&:hover {
|
||||
background-color: rgba(173, 216, 230, 1);
|
||||
box-shadow: 0 6px #ccc, 0 8px 15px rgba(0,0,0,0.1), inset 0 4px #fff, inset 0 -2px 3px rgba(0,0,0,0.1);
|
||||
}
|
||||
}
|
||||
|
||||
.confirm {
|
||||
font-size: 14px;
|
||||
background-color: rgba(135, 206, 235, 0.8);
|
||||
}
|
||||
|
||||
.delete {
|
||||
font-size: 14px;
|
||||
background-color: rgba(255, 99, 71, 0.8);
|
||||
}
|
||||
</style>
|
359
p-BluPrint_1.0.288888/pages/product/group.vue
Normal file
359
p-BluPrint_1.0.288888/pages/product/group.vue
Normal file
@ -0,0 +1,359 @@
|
||||
<template>
|
||||
<view>
|
||||
<view class="navbar">
|
||||
<view class="search">
|
||||
<text class="icon-search">
|
||||
<input type="text" placeholder="输入菜品组名称" class="transparent-input" v-model="form.groupName"/>
|
||||
</text>
|
||||
</view>
|
||||
<button class="search-button" @click="addDishesGroup">添加</button>
|
||||
|
||||
</view>
|
||||
<view class="item"
|
||||
v-for="(tab, index) in resultArray"
|
||||
:key="index"
|
||||
@click="showDrawer('showLeft', tab)">
|
||||
{{ tab.groupName }}
|
||||
</view>
|
||||
<uni-drawer ref="showLeft" mode="left" :mask-click="true" @change="change($event,'showLeft')">
|
||||
<!-- 组件内部-->
|
||||
<view class="edit-dishes-group">
|
||||
<view class="drawer-content">
|
||||
<input class="styled-input" type="text" v-model="newGroupName" placeholder="请输入新的菜品组名" />
|
||||
</view>
|
||||
<view class="button-container">
|
||||
<button class="styled-button confirm" @click="updateDishesGroup">确认</button>
|
||||
<button class="styled-button delete" @click="deleteDishesGroup(currentGroupId)">删除菜品组</button>
|
||||
</view>
|
||||
</view>
|
||||
</uni-drawer>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { apiImageUrl } from '../../API/api';
|
||||
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
businessId: '',
|
||||
resultArray: [],
|
||||
result: null,
|
||||
currentGroupName: '',
|
||||
currentGroupId: '',
|
||||
newGroupName: '',
|
||||
id: 0,
|
||||
form: {
|
||||
groupName: '',
|
||||
isTopping: 0
|
||||
}
|
||||
};
|
||||
},
|
||||
mounted() {
|
||||
this.loadCurrentBusinessId();
|
||||
this.leftGroup();
|
||||
},
|
||||
methods: {
|
||||
loadCurrentBusinessId() {
|
||||
const storedBusinessId = uni.getStorageSync('businessId');
|
||||
console.log(storedBusinessId);
|
||||
if (storedBusinessId) {
|
||||
this.businessId = storedBusinessId;
|
||||
} else {
|
||||
console.error('currentBusinessId not found in storage');
|
||||
}
|
||||
},
|
||||
|
||||
leftGroup() {
|
||||
const DishesGroupQueryRequest = {
|
||||
businessId: this.businessId
|
||||
};
|
||||
|
||||
uni.request({
|
||||
url: apiImageUrl + '/api/dishesGroup/list/dishesGroup',
|
||||
method: 'POST',
|
||||
data: JSON.stringify(DishesGroupQueryRequest),
|
||||
header: {
|
||||
'Content-Type': 'application/json'
|
||||
}
|
||||
}).then((res) => {
|
||||
console.log(res);
|
||||
if (res[1] && res[1].data && res[1].data.code === 0) {
|
||||
this.resultArray = res[1].data.data.map(item => ({
|
||||
id: item.id,
|
||||
groupName: item.groupName
|
||||
}));
|
||||
console.log(this.resultArray);
|
||||
} else {
|
||||
console.error('Unexpected response structure:', res);
|
||||
}
|
||||
}).catch((error) => {
|
||||
console.error('Error fetching dishes groups:', error);
|
||||
});
|
||||
},
|
||||
|
||||
showDrawer(drawer, tab) {
|
||||
this.currentGroupName = tab.groupName;
|
||||
this.currentGroupId = tab.id;
|
||||
this.newGroupName = tab.groupName;
|
||||
this.id = tab.id;
|
||||
if (this.$refs.showLeft) {
|
||||
this.$refs.showLeft.open();
|
||||
}
|
||||
},
|
||||
|
||||
closeDrawer() {
|
||||
if (this.$refs.showLeft) {
|
||||
this.$refs.showLeft.close();
|
||||
}
|
||||
},
|
||||
|
||||
change(e, type) {
|
||||
console.log((type === 'showLeft' ? '左窗口' : '右窗口') + (e ? '打开' : '关闭'));
|
||||
this[type] = e;
|
||||
},
|
||||
|
||||
updateDishesGroup() {
|
||||
if (!this.newGroupName || !this.id) return;
|
||||
|
||||
uni.request({
|
||||
url: apiImageUrl + '/api/dishesGroup/update',
|
||||
method: 'POST',
|
||||
header: {
|
||||
'Content-Type': 'application/json',
|
||||
},
|
||||
data: {
|
||||
id: this.id,
|
||||
groupName: this.newGroupName,
|
||||
isTopping: 0,
|
||||
},
|
||||
}).then((res) => {
|
||||
if (res[1] && res[1].data && res[1].data.code === 0) {
|
||||
this.closeDrawer();
|
||||
this.leftGroup();
|
||||
uni.showModal({
|
||||
title: '提示',
|
||||
content: '菜品组更新成功',
|
||||
showCancel: false
|
||||
});
|
||||
} else {
|
||||
uni.showModal({
|
||||
title: '提示',
|
||||
content: '菜品组更新失败',
|
||||
showCancel: false
|
||||
});
|
||||
}
|
||||
}).catch((error) => {
|
||||
console.error('Error updating dishes group:', error);
|
||||
uni.showModal({
|
||||
title: '提示',
|
||||
content: '菜品组更新失败',
|
||||
showCancel: false
|
||||
});
|
||||
});
|
||||
},
|
||||
|
||||
removeGroupFromList(id) {
|
||||
const index = this.resultArray.findIndex(item => item.id === id);
|
||||
if (index > -1) {
|
||||
this.resultArray.splice(index, 1);
|
||||
}
|
||||
},
|
||||
|
||||
deleteDishesGroup(id) {
|
||||
uni.request({
|
||||
url: `${apiImageUrl}/api/dishesGroup/delete`,
|
||||
method: 'POST',
|
||||
data: {
|
||||
id: id
|
||||
}
|
||||
}).then((res) => {
|
||||
if (res[1] && res[1].data && res[1].data.code === 0) {
|
||||
uni.showModal({
|
||||
title: '提示',
|
||||
content: '成功删除菜品组',
|
||||
showCancel: false
|
||||
});
|
||||
this.removeGroupFromList(id);
|
||||
this.closeDrawer();
|
||||
} else {
|
||||
uni.showModal({
|
||||
title: '提示',
|
||||
content: '删除失败,请检查输入或联系管理员',
|
||||
showCancel: false
|
||||
});
|
||||
}
|
||||
}).catch((error) => {
|
||||
console.error('Error:', error);
|
||||
uni.showModal({
|
||||
title: '提示',
|
||||
content: '请求失败,请稍后重试',
|
||||
showCancel: false
|
||||
});
|
||||
});
|
||||
},
|
||||
|
||||
addDishesGroup() {
|
||||
if (!this.form.groupName.trim()) {
|
||||
uni.showToast({
|
||||
title: '请输入菜品组名!',
|
||||
icon: 'none'
|
||||
});
|
||||
return;
|
||||
}
|
||||
|
||||
uni.request({
|
||||
url: `${apiImageUrl}/api/dishesGroup/add`,
|
||||
method: 'POST',
|
||||
header: {
|
||||
'Content-Type': 'application/json'
|
||||
},
|
||||
data: this.form,
|
||||
}).then((res) => {
|
||||
if (res[1] && res[1].data && res[1].data.code === 0) {
|
||||
this.result = '添加成功!';
|
||||
this.form.groupName = '';
|
||||
|
||||
this.leftGroup();
|
||||
uni.showModal({
|
||||
title: '提示',
|
||||
content: '成功添加菜品组!',
|
||||
showCancel: false
|
||||
});
|
||||
} else {
|
||||
this.result = '添加失败,请检查输入或联系管理员';
|
||||
uni.showModal({
|
||||
title: '提示',
|
||||
content: '添加失败,请检查输入或联系管理员!',
|
||||
showCancel: false
|
||||
});
|
||||
}
|
||||
}).catch((error) => {
|
||||
console.error('Error:', error);
|
||||
this.result = '请求失败,请稍后重试';
|
||||
uni.showModal({
|
||||
title: '提示',
|
||||
content: '请求失败,请稍后重试!',
|
||||
showCancel: false
|
||||
});
|
||||
});
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.item {
|
||||
font-size: 13px;
|
||||
padding: 10px 20px;
|
||||
display: inline-block;
|
||||
background-color: rgba(245, 245, 220, 0.8);
|
||||
margin: 10px;
|
||||
border-radius: 20px;
|
||||
box-shadow: 0 4px #ccc, 0 6px 10px rgba(0,0,0,0.1), inset 0 2px #fff, inset 0 -2px 2px rgba(0,0,0,0.1);
|
||||
transition: transform 0.2s;
|
||||
|
||||
&:hover {
|
||||
transform: translateY(-2px);
|
||||
box-shadow: 0 6px #ccc, 0 8px 15px rgba(0,0,0,0.1), inset 0 4px #fff, inset 0 -2px 3px rgba(0,0,0,0.1);
|
||||
}
|
||||
}
|
||||
|
||||
.navbar {
|
||||
background-color: #4095e5;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
padding: 10px;
|
||||
.search {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 0 10rpx 0 26rpx;
|
||||
height: 50rpx;
|
||||
color: #fff;
|
||||
font-size: 28rpx;
|
||||
border-radius: 32rpx;
|
||||
background-color: rgba(255, 255, 255, 0.5);
|
||||
width: 70%;
|
||||
margin: 0 auto;
|
||||
}
|
||||
.icon-search {
|
||||
margin-right: 10rpx;
|
||||
}
|
||||
.search-button {
|
||||
margin-left: auto;
|
||||
height: 50rpx;
|
||||
background-color: #fff;
|
||||
color: #4095e5;
|
||||
border: none;
|
||||
border-radius: 32rpx;
|
||||
padding: 0 20rpx;
|
||||
line-height: 50rpx;
|
||||
font-size: 15px;
|
||||
|
||||
}
|
||||
|
||||
|
||||
.transparent-input {
|
||||
background-color: transparent;
|
||||
border: none;
|
||||
color: #fff;
|
||||
outline: none;
|
||||
width: 100%;
|
||||
padding: 0 10rpx;
|
||||
font-size: 28rpx;
|
||||
}
|
||||
}
|
||||
.styled-input {
|
||||
font-size: 14px;
|
||||
width: calc(100% - 20px);
|
||||
padding: 10px;
|
||||
margin: 10px 0;
|
||||
display: block;
|
||||
background-color: rgba(245, 245, 220, 0.8);
|
||||
border-radius: 20px;
|
||||
box-shadow: 0 4px #ccc, 0 6px 10px rgba(0,0,0,0.1), inset 0 2px #fff, inset 0 -2px 2px rgba(0,0,0,0.1);
|
||||
border: none;
|
||||
outline: none;
|
||||
transition: box-shadow 0.2s;
|
||||
|
||||
&:focus {
|
||||
box-shadow: 0 6px #ccc, 0 8px 15px rgba(0,0,0,0.1), inset 0 4px #fff, inset 0 -2px 3px rgba(0,0,0,0.1);
|
||||
}
|
||||
}
|
||||
|
||||
.button-container {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
.styled-button {
|
||||
flex: 1;
|
||||
margin: 5px;
|
||||
padding: 10px;
|
||||
background-color: rgba(173, 216, 230, 0.8);
|
||||
border: none;
|
||||
border-radius: 15px;
|
||||
box-shadow: 0 4px #ccc, 0 6px 10px rgba(0,0,0,0.1), inset 0 2px #fff, inset 0 -2px 2px rgba(0,0,0,0.1);
|
||||
cursor: pointer;
|
||||
transition: box-shadow 0.2s, background-color 0.2s;
|
||||
|
||||
&:hover {
|
||||
background-color: rgba(173, 216, 230, 1);
|
||||
box-shadow: 0 6px #ccc, 0 8px 15px rgba(0,0,0,0.1), inset 0 4px #fff, inset 0 -2px 3px rgba(0,0,0,0.1);
|
||||
}
|
||||
}
|
||||
|
||||
.confirm {
|
||||
background-color: rgba(135, 206, 235, 0.8);
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
.delete {
|
||||
background-color: rgba(255, 99, 71, 0.8);
|
||||
font-size: 14px;
|
||||
}
|
||||
</style>
|
||||
|
||||
|
||||
|
139
p-BluPrint_1.0.288888/pages/product/product.vue
Normal file
139
p-BluPrint_1.0.288888/pages/product/product.vue
Normal file
@ -0,0 +1,139 @@
|
||||
<template>
|
||||
<scroll-view scroll-y class="viewport">
|
||||
<view class="preview">
|
||||
<swiper :circular="true" :autoplay="true" :interval="3000" indicator-dots>
|
||||
<swiper-item>
|
||||
<image
|
||||
mode="aspectFill"
|
||||
class="image"
|
||||
src="https://ts1.cn.mm.bing.net/th/id/R-C.8f2db93b542db8adf6c850762c1cce4d?rik=erpuvqVy64IJzQ&riu=http%3a%2f%2fimg95.699pic.com%2fphoto%2f50044%2f9286.jpg_wh860.jpg&ehk=dnizwrPBuCaHnaxfih%2fryK7p%2fXZMbmolNORKknXvL%2bI%3d&risl=&pid=ImgRaw&r=0"
|
||||
></image>
|
||||
</swiper-item>
|
||||
<swiper-item>
|
||||
<image
|
||||
mode="aspectFill"
|
||||
class="image"
|
||||
src="https://img95.699pic.com/photo/50127/2949.jpg_wh860.jpg"
|
||||
></image>
|
||||
</swiper-item>
|
||||
<swiper-item>
|
||||
<image
|
||||
mode="aspectFill"
|
||||
class="image"
|
||||
src="https://img95.699pic.com/photo/50070/9636.jpg_wh860.jpg"
|
||||
></image>
|
||||
</swiper-item>
|
||||
</swiper>
|
||||
</view>
|
||||
|
||||
<view class="tab-menu">
|
||||
<view
|
||||
class="tab-item"
|
||||
v-for="(tab, index) in tabs"
|
||||
:key="index"
|
||||
:class="{ active: currentIndex === index }"
|
||||
@click="switchTab(index)"
|
||||
>
|
||||
{{ tab.name }}
|
||||
</view>
|
||||
</view>
|
||||
<view class="content">
|
||||
<block v-if="currentIndex === 0">
|
||||
<sort></sort>
|
||||
</block>
|
||||
<block v-if="currentIndex === 1">
|
||||
<groupVue></groupVue>
|
||||
</block>
|
||||
<block v-if="currentIndex === 2">
|
||||
<addDishVue></addDishVue>
|
||||
</block>
|
||||
</view>
|
||||
</scroll-view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { apiImageUrl } from '../../API/api';
|
||||
import sort from './sort.vue'
|
||||
import groupVue from './group.vue';
|
||||
import addDishVue from './addDish.vue';
|
||||
export default {
|
||||
components: {
|
||||
sort,
|
||||
groupVue,
|
||||
addDishVue
|
||||
},
|
||||
data(){
|
||||
return {
|
||||
businessId: '1830063677349658625',
|
||||
currentIndex: 0,
|
||||
resultArray: [],
|
||||
historyList: [],
|
||||
tabs: [
|
||||
{ name: '总览' },
|
||||
{ name: '菜品组操作' },
|
||||
{ name: '新增菜品' },
|
||||
],
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
switchTab(index) {
|
||||
this.currentIndex = index;
|
||||
},
|
||||
leftGroup(){
|
||||
uni.request({
|
||||
url:apiImageUrl+'/api/dishesGroup/list/dishesGroup',
|
||||
method:'POST',
|
||||
data: '1830063677349658625',
|
||||
header: {
|
||||
'cookie': uni.getStorageSync("cookie")
|
||||
},
|
||||
success(res) {
|
||||
if(res.data.code===0){
|
||||
console.log(res);
|
||||
console.log("5555555555");
|
||||
}
|
||||
},
|
||||
fail(res) {
|
||||
console.log("失败啦");
|
||||
}
|
||||
});
|
||||
|
||||
},
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.viewport {
|
||||
height: 100vh;
|
||||
overflow: hidden;
|
||||
image {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
.preview {
|
||||
image {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
.tab-menu {
|
||||
display: flex;
|
||||
justify-content: space-around;
|
||||
padding: 10px 0;
|
||||
background-color: #f5f5f5;
|
||||
}
|
||||
|
||||
.tab-item {
|
||||
padding: 10px;
|
||||
cursor: pointer;
|
||||
|
||||
&.active {
|
||||
color: #4095e5;
|
||||
font-weight: bold;
|
||||
}
|
||||
}
|
||||
</style>
|
585
p-BluPrint_1.0.288888/pages/product/sort.vue
Normal file
585
p-BluPrint_1.0.288888/pages/product/sort.vue
Normal file
@ -0,0 +1,585 @@
|
||||
<template>
|
||||
<view class="viewport">
|
||||
<view class="categories">
|
||||
<scroll-view class="primary" scroll-y>
|
||||
<view
|
||||
class="item"
|
||||
v-for="(group, index) in resultArray"
|
||||
:key="index"
|
||||
:class="{ active: currentIndex === index }"
|
||||
@click="switchTab(index)">
|
||||
{{ group.groupName }}
|
||||
</view>
|
||||
</scroll-view>
|
||||
|
||||
<scroll-view class="secondary" scroll-y>
|
||||
<view class="panel">
|
||||
<view
|
||||
class="container2"
|
||||
v-for="(item, index) in filteredHistoryList"
|
||||
:key="index"
|
||||
@click="showDrawer('showLeft',item)">
|
||||
<view class="box box-1">
|
||||
<image :src="item.dishesImage" class="imageList"></image>
|
||||
</view>
|
||||
<view class="box box-2">
|
||||
<view class="title">{{ item.dishesName }}</view>
|
||||
<text class="sale">¥{{ item.dishesPrice }}</text>
|
||||
<view class="money">¥{{ item.dishesPrice }}</view>
|
||||
<view class="buttonList">
|
||||
<view
|
||||
class="button1"
|
||||
@click.stop="deleteDish(item.id)">删除菜品</view>
|
||||
<view
|
||||
v-if="item.status === '0'"
|
||||
class="button2"
|
||||
@click.stop="toggleStatus(item, '1')">已上架</view>
|
||||
<view
|
||||
v-else
|
||||
class="button2"
|
||||
@click.stop="toggleStatus(item, '0')">已下架</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</scroll-view>
|
||||
</view>
|
||||
<uni-drawer ref="showLeft" mode="left" :mask-click="true" @change="change($event, 'showLeft')">
|
||||
<view class="drawer-content">
|
||||
<form>
|
||||
<input v-model="editDish.dishesName" placeholder="菜品名称" />
|
||||
<input v-model="editDish.dishesPrice" type="number" step="0.01" placeholder="价格" />
|
||||
<button type="submit" @click.prevent="updateDish">保存</button>
|
||||
</form>
|
||||
</view>
|
||||
</uni-drawer>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { apiImageUrl } from '../../API/api';
|
||||
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
showLeft: false,
|
||||
businessId: '',
|
||||
currentIndex: 0,
|
||||
newGroupName: '',
|
||||
resultArray: [],
|
||||
historyList: [],
|
||||
editDish: {
|
||||
businessId: '',
|
||||
dishesGroupId: '',
|
||||
dishesImage: '',
|
||||
dishesName: '',
|
||||
dishesPrice: 0,
|
||||
},
|
||||
loading: false,
|
||||
};
|
||||
},
|
||||
created() {
|
||||
this.getLoginUser();
|
||||
},
|
||||
methods: {
|
||||
getLoginUser() {
|
||||
uni.request({
|
||||
url: `${apiImageUrl}/api/business/get/current`,
|
||||
method: 'POST',
|
||||
data: {},
|
||||
header: {
|
||||
'cookie': uni.getStorageSync("cookie")
|
||||
},
|
||||
success: (res) => {
|
||||
if (res.data.code === 0) {
|
||||
this.businessId = res.data.data.id;
|
||||
this.leftGroup();
|
||||
this.rightList();
|
||||
}
|
||||
},
|
||||
fail: (error) => {
|
||||
console.error('获取用户信息失败:', error);
|
||||
uni.showModal({
|
||||
title: '提示',
|
||||
content: '获取用户信息失败!',
|
||||
showCancel: false
|
||||
});
|
||||
}
|
||||
});
|
||||
},
|
||||
leftGroup() {
|
||||
uni.request({
|
||||
url: `${apiImageUrl}/api/dishesGroup/list/dishesGroup`,
|
||||
method: 'POST',
|
||||
data: JSON.stringify({ businessId: this.businessId }),
|
||||
header: {
|
||||
'Content-Type': 'application/json',
|
||||
'cookie': uni.getStorageSync("cookie")
|
||||
},
|
||||
success: (res) => {
|
||||
if (res.data.code === 0) {
|
||||
this.resultArray = res.data.data.map(item => ({ id: item.id, groupName: item.groupName }));
|
||||
}
|
||||
},
|
||||
fail: (error) => {
|
||||
console.error('获取菜品组失败:', error);
|
||||
uni.showModal({
|
||||
title: '提示',
|
||||
content: '获取菜品组失败!',
|
||||
showCancel: false
|
||||
});
|
||||
}
|
||||
});
|
||||
},
|
||||
rightList() {
|
||||
uni.request({
|
||||
url: `${apiImageUrl}/api/dishes/list/dishes`,
|
||||
method: 'POST',
|
||||
data: JSON.stringify({ businessId: this.businessId }),
|
||||
header: {
|
||||
'Content-Type': 'application/json',
|
||||
'cookie': uni.getStorageSync("cookie")
|
||||
},
|
||||
success: (res) => {
|
||||
if (res.data.code === 0) {
|
||||
this.historyList = res.data.data;
|
||||
}
|
||||
},
|
||||
fail: (error) => {
|
||||
console.error('获取菜品列表失败:', error);
|
||||
uni.showModal({
|
||||
title: '提示',
|
||||
content: '获取菜品列表失败',
|
||||
showCancel: false
|
||||
});
|
||||
}
|
||||
});
|
||||
},
|
||||
switchTab(index) {
|
||||
this.currentIndex = index;
|
||||
const selectedGroupId = this.resultArray[index]?.id;
|
||||
if (selectedGroupId) {
|
||||
uni.request({
|
||||
url: `${apiImageUrl}/api/dishes/list/dishesVO`,
|
||||
method: 'POST',
|
||||
data: JSON.stringify({ businessId: this.businessId, dishesGroupId: selectedGroupId }),
|
||||
header: {
|
||||
'Content-Type': 'application/json',
|
||||
'cookie': uni.getStorageSync("cookie")
|
||||
},
|
||||
success: (res) => {
|
||||
if (res.data.code === 0) {
|
||||
this.historyList = res.data.data;
|
||||
}
|
||||
},
|
||||
fail: (error) => {
|
||||
console.error('Error fetching data:', error);
|
||||
}
|
||||
});
|
||||
}
|
||||
},
|
||||
deleteDish(dishId) {
|
||||
uni.request({
|
||||
url: `${apiImageUrl}/api/dishes/delete`,
|
||||
method: 'POST',
|
||||
data: { id: dishId },
|
||||
header: {
|
||||
'cookie': uni.getStorageSync("cookie")
|
||||
},
|
||||
success: (res) => {
|
||||
if (res.data.code === 0) {
|
||||
this.rightList();
|
||||
uni.showModal({
|
||||
title: '提示',
|
||||
content: '菜品删除成功',
|
||||
showCancel: false
|
||||
});
|
||||
}
|
||||
},
|
||||
fail: (error) => {
|
||||
console.error('删除菜品失败:', error);
|
||||
uni.showModal({
|
||||
title: '提示',
|
||||
content: '菜品删除失败',
|
||||
showCancel: false
|
||||
});
|
||||
}
|
||||
});
|
||||
},
|
||||
// confirm() {},
|
||||
// //打开窗口
|
||||
// showDrawer(e) {
|
||||
// this.$refs[e].open()
|
||||
// },
|
||||
// // 关闭窗口
|
||||
// closeDrawer(e) {
|
||||
// this.$refs[e].close()
|
||||
// },
|
||||
// // 抽屉状态发生变化触发
|
||||
// change(e, type) {
|
||||
// console.log((type === 'showLeft' ? '左窗口' : '右窗口') + (e ? '打开' : '关闭'));
|
||||
// this[type] = e
|
||||
// },
|
||||
|
||||
// showDrawer(drawer, item) {
|
||||
// if (this.$refs[drawer]) {
|
||||
// this.editDish = { ...item, businessId: this.businessId, dishesPrice: parseFloat(item.dishesPrice).toFixed(2) };
|
||||
// this.$refs[drawer].open();
|
||||
// }
|
||||
// },
|
||||
// closeDrawer() {
|
||||
// if (this.$refs.showLeft) {
|
||||
// this.$refs.showLeft.close();
|
||||
// }
|
||||
// this.editDish = {};
|
||||
// },
|
||||
|
||||
showDrawer(drawer, item) {
|
||||
if (this.$refs[drawer]) {
|
||||
this.editDish = { ...item, businessId: this.businessId, dishesPrice: parseFloat(item.dishesPrice).toFixed(2) };
|
||||
this.$refs[drawer].open();
|
||||
}
|
||||
},
|
||||
|
||||
// 关闭窗口
|
||||
closeDrawer(e) {
|
||||
if (this.$refs[e]) {
|
||||
this.$refs[e].close();
|
||||
}
|
||||
this.editDish = {}; // 清空编辑菜品对象
|
||||
},
|
||||
|
||||
// 抽屉状态发生变化触发
|
||||
change(e, type) {
|
||||
console.log((type === 'showLeft' ? '左窗口' : '右窗口') + (e ? '打开' : '关闭'));
|
||||
this[type] = e;
|
||||
},
|
||||
// 显示侧边抽屉
|
||||
/*updateDish() {
|
||||
if (!this.editDish.dishesName || !this.editDish.dishesPrice || !this.editDish.dishesGroupId) {
|
||||
console.error('请填写完整信息');
|
||||
return;
|
||||
}
|
||||
|
||||
this.editDish.dishesName = this.editDish.dishesName.trim();
|
||||
this.editDish.dishesPrice = parseFloat(this.editDish.dishesPrice).toFixed(2);
|
||||
|
||||
uni.request({
|
||||
url: `${apiImageUrl}/api/dishes/update`,
|
||||
method: 'POST',
|
||||
data: JSON.stringify(this.editDish),
|
||||
header: {
|
||||
'Content-Type': 'application/json',
|
||||
'cookie': uni.getStorageSync("cookie")
|
||||
},
|
||||
success: (res) => {
|
||||
if (res.data.code === 0) {
|
||||
this.rightList();
|
||||
this.closeDrawer();
|
||||
} else {
|
||||
console.error('菜品更新失败:', res.data.message);
|
||||
}
|
||||
},
|
||||
fail: (error) => {
|
||||
console.error('菜品更新请求失败:', error);
|
||||
}
|
||||
});
|
||||
},
|
||||
|
||||
*/
|
||||
toggleStatus(item, newStatus) {
|
||||
uni.request({
|
||||
url: `${apiImageUrl}/api/dishes/update/status`,
|
||||
method: 'POST',
|
||||
data: JSON.stringify({ id: item.id, status: newStatus }),
|
||||
header: {
|
||||
'Content-Type': 'application/json',
|
||||
'cookie': uni.getStorageSync("cookie")
|
||||
},
|
||||
success: (res) => {
|
||||
if (res.data.code !== 0) {
|
||||
throw new Error(res.data.message);
|
||||
}
|
||||
item.status = newStatus;
|
||||
uni.showModal({
|
||||
title: '提示',
|
||||
content: '菜品状态更新成功',
|
||||
showCancel: false
|
||||
});
|
||||
},
|
||||
fail: (error) => {
|
||||
console.error('Update status failed:', error);
|
||||
}
|
||||
});
|
||||
},
|
||||
// 更新菜品
|
||||
updateDish() {
|
||||
if (!this.editDish.dishesName || !this.editDish.dishesPrice || !this.editDish.dishesGroupId) {
|
||||
uni.showToast({
|
||||
title: '请填写完整信息',
|
||||
icon: 'none'
|
||||
});
|
||||
return;
|
||||
}
|
||||
|
||||
// this.editDish.dishesName = this.editDish.dishesName.trim();
|
||||
// this.editDish.dishesPrice = parseFloat(this.editDish.dishesPrice).toFixed(2);
|
||||
|
||||
uni.request({
|
||||
url: `${apiImageUrl}/api/dishes/update`,
|
||||
method: 'POST',
|
||||
data: JSON.stringify(this.editDish),
|
||||
header: {
|
||||
'Content-Type': 'application/json',
|
||||
'cookie': uni.getStorageSync("cookie")
|
||||
},
|
||||
success: (res) => {
|
||||
if (res.data.code === 0) {
|
||||
this.rightList(); // 刷新菜品列表
|
||||
this.closeDrawer('showLeft'); // 关闭抽屉
|
||||
uni.showToast({
|
||||
title: '菜品更新成功',
|
||||
icon: 'success'
|
||||
});
|
||||
} else {
|
||||
uni.showToast({
|
||||
title: res.data.message,
|
||||
icon: 'none'
|
||||
});
|
||||
}
|
||||
},
|
||||
fail: (error) => {
|
||||
console.error('菜品更新请求失败:', error);
|
||||
uni.showToast({
|
||||
title: '菜品更新失败',
|
||||
icon: 'none'
|
||||
});
|
||||
}
|
||||
});
|
||||
},
|
||||
},
|
||||
computed: {
|
||||
filteredHistoryList() {
|
||||
const groupId = this.resultArray[this.currentIndex]?.id;
|
||||
return groupId ? this.historyList.filter(item => item.dishesGroupId === groupId) : [];
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
page {
|
||||
height: 100%;
|
||||
overflow: hidden;
|
||||
}
|
||||
.viewport {
|
||||
height: 100%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
.search {
|
||||
padding: 0 30rpx 20rpx;
|
||||
background-color: #fff;
|
||||
.input {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
height: 64rpx;
|
||||
padding-left: 26rpx;
|
||||
color: #8b8b8b;
|
||||
font-size: 28rpx;
|
||||
border-radius: 32rpx;
|
||||
background-color: #f3f4f4;
|
||||
}
|
||||
}
|
||||
.icon-search {
|
||||
&::before {
|
||||
margin-right: 10rpx;
|
||||
}
|
||||
}
|
||||
/* 分类 */
|
||||
.categories {
|
||||
flex: 1;
|
||||
min-height: 400rpx;
|
||||
display: flex;
|
||||
}
|
||||
/* 一级分类 */
|
||||
.primary {
|
||||
overflow: hidden;
|
||||
width: 180rpx;
|
||||
flex: none;
|
||||
background-color: #f6f6f6;
|
||||
.item {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
height: 96rpx;
|
||||
font-size: 26rpx;
|
||||
color: #595c63;
|
||||
position: relative;
|
||||
&::after {
|
||||
content: '';
|
||||
position: absolute;
|
||||
left: 42rpx;
|
||||
bottom: 0;
|
||||
width: 96rpx;
|
||||
border-top: 1rpx solid #e3e4e7;
|
||||
}
|
||||
}
|
||||
.active {
|
||||
background-color: #fff;
|
||||
&::before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 0;
|
||||
width: 8rpx;
|
||||
height: 100%;
|
||||
background-color: #4095e5;
|
||||
}
|
||||
}
|
||||
}
|
||||
.primary .item:last-child::after,
|
||||
.primary .active::after {
|
||||
display: none;
|
||||
}
|
||||
/* 二级分类 */
|
||||
.secondary {
|
||||
background-color: #fff;
|
||||
width: 100%;
|
||||
.carousel {
|
||||
height: 400rpx;
|
||||
margin: 0 30rpx 20rpx;
|
||||
border-radius: 4rpx;
|
||||
overflow: hidden;
|
||||
}
|
||||
.panel {
|
||||
margin: 0 30rpx 0rpx;
|
||||
}
|
||||
.container {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
padding: 20rpx;
|
||||
}
|
||||
|
||||
.history-list {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.history-item {
|
||||
display: flex;
|
||||
margin-bottom: 20rpx;
|
||||
flex-direction: row;
|
||||
}
|
||||
|
||||
.history-img {
|
||||
width: 200rpx;
|
||||
height: 150rpx;
|
||||
margin-right: 20rpx;
|
||||
border-radius: 10px;
|
||||
}
|
||||
|
||||
.history-info {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: space-between;
|
||||
width: 100px;
|
||||
}
|
||||
|
||||
.history-title {
|
||||
font-size: 32rpx;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.history-description {
|
||||
font-size: 28rpx;
|
||||
}
|
||||
|
||||
.history-time{
|
||||
font-size: 20rpx;
|
||||
color: #999;
|
||||
}
|
||||
.history-money{
|
||||
font-size: 30rpx;
|
||||
color: black;
|
||||
font-weight: 700;
|
||||
}
|
||||
}
|
||||
.icon {
|
||||
margin-top: 30rpx;
|
||||
}
|
||||
|
||||
//内容区域
|
||||
.container2 {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.box-1 {
|
||||
width: 30%;
|
||||
height: 250rpx;
|
||||
float: left;
|
||||
padding: 10px;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.box-2 {
|
||||
width: 70%;
|
||||
height: 250rpx;
|
||||
float: left;
|
||||
padding: 10px;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.imageList {
|
||||
height: 70%;
|
||||
}
|
||||
.title {
|
||||
font-weight: 700;
|
||||
}
|
||||
.sale {
|
||||
font-size: 25rpx;
|
||||
color: #8b8b8b;
|
||||
margin-top: 10px;
|
||||
}
|
||||
.inventory {
|
||||
font-size: 25rpx;
|
||||
color: #8b8b8b;
|
||||
margin-left: 20px;
|
||||
margin-top: 10px;
|
||||
}
|
||||
.money {
|
||||
font-size: 35rpx;
|
||||
color: #eb5354;
|
||||
font-weight: 700;
|
||||
margin-top: 17px;
|
||||
}
|
||||
.buttonList {
|
||||
width: 100%;
|
||||
height: 30%;
|
||||
margin-top: 5px;
|
||||
}
|
||||
.button1 {
|
||||
font-size: 24rpx;
|
||||
display: inline-block;
|
||||
border: 1px solid #999;
|
||||
padding: 5px 10px;
|
||||
border-radius: 5px;
|
||||
}
|
||||
.button2 {
|
||||
font-size: 24rpx;
|
||||
display: inline-block;
|
||||
border: 1px solid #999;
|
||||
margin-left: 10px;
|
||||
padding: 5px 10px;
|
||||
border-radius: 5px;
|
||||
}
|
||||
.button3 {
|
||||
font-size: 24rpx;
|
||||
display: inline-block;
|
||||
border: 1px solid #999;
|
||||
margin-left: 10px;
|
||||
padding: 5px 10px;
|
||||
border-radius: 5px;
|
||||
}
|
||||
</style>
|
Reference in New Issue
Block a user