Merge branch 'master' of https://gitea.zianxin.com/zax/biz-pc-cloud
This commit is contained in:
commit
2b8a1f0755
20 files changed
+1362
-486
No files matched your search
@@ -0,0 +1,41 @@
|
|||||||
|
import request from "/@/utils/request"
|
||||||
|
|
||||||
|
export function fetchList(query?: Object) {
|
||||||
|
return request({
|
||||||
|
url: '/canteen/timeSlotConfig/page',
|
||||||
|
method: 'get',
|
||||||
|
params: query
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
export function addObj(obj?: Object) {
|
||||||
|
return request({
|
||||||
|
url: '/canteen/timeSlotConfig',
|
||||||
|
method: 'post',
|
||||||
|
data: obj
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
export function getObj(id?: string) {
|
||||||
|
return request({
|
||||||
|
url: '/canteen/timeSlotConfig/' + id,
|
||||||
|
method: 'get'
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
export function delObjs(ids?: Object) {
|
||||||
|
return request({
|
||||||
|
url: '/canteen/timeSlotConfig',
|
||||||
|
method: 'delete',
|
||||||
|
data: ids
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
export function putObj(obj?: Object) {
|
||||||
|
return request({
|
||||||
|
url: '/canteen/timeSlotConfig',
|
||||||
|
method: 'put',
|
||||||
|
data: obj
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
@@ -3,7 +3,9 @@
|
|||||||
<div v-loading="mainLoading" class="msg-main">
|
<div v-loading="mainLoading" class="msg-main">
|
||||||
<div id="msg-div" class="msg-div">
|
<div id="msg-div" class="msg-div">
|
||||||
<div v-if="!tableLoading">
|
<div v-if="!tableLoading">
|
||||||
<div v-if="loadMore" class="el-table__empty-block" @click="loadingMore"><span class="el-table__empty-text">点击加载更多</span></div>
|
<div v-if="loadMore" class="el-table__empty-block" @click="loadingMore">
|
||||||
|
<span class="el-table__empty-text">点击加载更多</span>
|
||||||
|
</div>
|
||||||
<div v-if="!loadMore" class="el-table__empty-block"><span class="el-table__empty-text">没有更多了</span></div>
|
<div v-if="!loadMore" class="el-table__empty-block"><span class="el-table__empty-text">没有更多了</span></div>
|
||||||
</div>
|
</div>
|
||||||
<div v-for="item in tableData" :key="item.id" class="execution" id="msgTable">
|
<div v-for="item in tableData" :key="item.id" class="execution" id="msgTable">
|
||||||
@@ -109,125 +111,125 @@
|
|||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script setup lang="ts" name="wx-msg">
|
<script setup lang="ts" name="wx-msg">
|
||||||
import { fetchList, addObj } from '/@/api/mp/wx-fans-msg';
|
import { fetchList, addObj } from "/@/api/mp/wx-fans-msg"
|
||||||
import { useMessage } from '/@/hooks/message';
|
import { useMessage } from "/@/hooks/message"
|
||||||
import { getMaterialVideo } from '/@/api/mp/wx-material';
|
import { getMaterialVideo } from "/@/api/mp/wx-material"
|
||||||
|
|
||||||
const WxReply = defineAsyncComponent(() => import('../wx-reply/index.vue'));
|
const WxReply = defineAsyncComponent(() => import("../wx-reply/index.vue"))
|
||||||
const WxNews = defineAsyncComponent(() => import('../wx-news/index.vue'));
|
const WxNews = defineAsyncComponent(() => import("../wx-news/index.vue"))
|
||||||
|
|
||||||
const NameAvatar = defineAsyncComponent(() => import('/@/components/NameAvatar/index.vue'));
|
const NameAvatar = defineAsyncComponent(() => import("/@/components/NameAvatar/index.vue"))
|
||||||
|
|
||||||
const visible = ref(false);
|
const visible = ref(false)
|
||||||
|
|
||||||
// 各种loading
|
// 各种loading
|
||||||
const mainLoading = ref(false);
|
const mainLoading = ref(false)
|
||||||
const sendLoading = ref(false);
|
const sendLoading = ref(false)
|
||||||
|
|
||||||
const loadMore = ref(false);
|
const loadMore = ref(false)
|
||||||
|
|
||||||
const objData = ref({
|
const objData = ref({
|
||||||
repType: 'text',
|
repType: "text",
|
||||||
appId: '',
|
appId: "",
|
||||||
}) as any;
|
}) as any
|
||||||
|
|
||||||
const page = reactive({
|
const page = reactive({
|
||||||
total: 0, // 总页数
|
total: 0, // 总页数
|
||||||
currentPage: 1, // 当前页数
|
currentPage: 1, // 当前页数
|
||||||
pageSize: 10, // 每页显示多少条
|
pageSize: 10, // 每页显示多少条
|
||||||
ascs: [], //升序字段
|
ascs: [], //升序字段
|
||||||
descs: 'create_time', //降序字段
|
descs: "create_time", //降序字段
|
||||||
});
|
})
|
||||||
|
|
||||||
const wxData = reactive({
|
const wxData = reactive({
|
||||||
appId: '',
|
appId: "",
|
||||||
wxUserId: '',
|
wxUserId: "",
|
||||||
});
|
})
|
||||||
|
|
||||||
const sendMsg = () => {
|
const sendMsg = () => {
|
||||||
if (objData.value) {
|
if (objData.value) {
|
||||||
if (objData.value.repType === 'news') {
|
if (objData.value.repType === "news") {
|
||||||
if (JSON.parse(objData.value.content).length > 1) {
|
if (JSON.parse(objData.value.content).length > 1) {
|
||||||
useMessage().error('图文消息条数限制在1条以内,已默认发送第一条');
|
useMessage().error("图文消息条数限制在1条以内,已默认发送第一条")
|
||||||
objData.value.content = JSON.parse(objData.value.content)[0];
|
objData.value.content = JSON.parse(objData.value.content)[0]
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
sendLoading.value = true;
|
sendLoading.value = true
|
||||||
addObj(
|
addObj(
|
||||||
Object.assign(
|
Object.assign(
|
||||||
{
|
{
|
||||||
wxUserId: wxData.wxUserId,
|
wxUserId: wxData.wxUserId,
|
||||||
appId: wxData.appId,
|
appId: wxData.appId,
|
||||||
},
|
},
|
||||||
objData.value
|
objData.value,
|
||||||
)
|
),
|
||||||
)
|
)
|
||||||
.then(() => {
|
.then(() => {
|
||||||
tableData.value = [];
|
tableData.value = []
|
||||||
getData().then(() => {
|
getData().then(() => {
|
||||||
//box-container是添加overflow的父div,也就是出现滚动条的div
|
//box-container是添加overflow的父div,也就是出现滚动条的div
|
||||||
var scrollTarget = document.getElementById('msg-div');
|
var scrollTarget = document.getElementById("msg-div")
|
||||||
//scrollTarget.scrollHeight是获取dom元素的高度,然后设置scrollTop
|
//scrollTarget.scrollHeight是获取dom元素的高度,然后设置scrollTop
|
||||||
scrollTarget.scrollTop = scrollTarget.scrollHeight;
|
scrollTarget.scrollTop = scrollTarget.scrollHeight
|
||||||
});
|
})
|
||||||
})
|
})
|
||||||
.finally(() => {
|
.finally(() => {
|
||||||
sendLoading.value = false;
|
sendLoading.value = false
|
||||||
});
|
})
|
||||||
}
|
}
|
||||||
};
|
}
|
||||||
|
|
||||||
const tableData = ref([] as any);
|
const tableData = ref([] as any)
|
||||||
const tableLoading = ref(false);
|
const tableLoading = ref(false)
|
||||||
|
|
||||||
const openDialog = (data: any) => {
|
const openDialog = (data: any) => {
|
||||||
wxData.wxUserId = data.wxUserId;
|
wxData.wxUserId = data.wxUserId
|
||||||
wxData.appId = data.appId;
|
wxData.appId = data.appId
|
||||||
objData.value.appId = data.appId;
|
objData.value.appId = data.appId
|
||||||
getData();
|
getData()
|
||||||
visible.value = true;
|
visible.value = true
|
||||||
};
|
}
|
||||||
|
|
||||||
const getData = () => {
|
const getData = () => {
|
||||||
tableLoading.value = true;
|
tableLoading.value = true
|
||||||
return fetchList({
|
return fetchList({
|
||||||
...page,
|
...page,
|
||||||
...wxData,
|
...wxData,
|
||||||
}).then((res) => {
|
}).then((res) => {
|
||||||
const data = res.data.records.reverse();
|
const data = res.data.records.reverse()
|
||||||
tableData.value = [...data, ...tableData.value];
|
tableData.value = [...data, ...tableData.value]
|
||||||
page.total = res.data.total;
|
page.total = res.data.total
|
||||||
tableLoading.value = false;
|
tableLoading.value = false
|
||||||
if (data.length < page.pageSize || data.length === 0) {
|
if (data.length < page.pageSize || data.length === 0) {
|
||||||
loadMore.value = false;
|
loadMore.value = false
|
||||||
}
|
}
|
||||||
});
|
})
|
||||||
};
|
}
|
||||||
|
|
||||||
const loadVideo = (item) => {
|
const loadVideo = (item) => {
|
||||||
getMaterialVideo({
|
getMaterialVideo({
|
||||||
mediaId: item.repMediaId,
|
mediaId: item.repMediaId,
|
||||||
appId: item.appId,
|
appId: item.appId,
|
||||||
}).then((response) => {
|
}).then((response) => {
|
||||||
const data = response.data;
|
// const data = response.data
|
||||||
window.open(data.downUrl, 'target', '');
|
// window.open(data.downUrl, 'target', '');
|
||||||
});
|
})
|
||||||
};
|
}
|
||||||
|
|
||||||
const loadingMore = () => {
|
const loadingMore = () => {
|
||||||
page.currentPage = page.currentPage + 1;
|
page.currentPage = page.currentPage + 1
|
||||||
getData();
|
getData()
|
||||||
};
|
}
|
||||||
|
|
||||||
// 暴露变量
|
// 暴露变量
|
||||||
defineExpose({
|
defineExpose({
|
||||||
openDialog,
|
openDialog,
|
||||||
});
|
})
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style lang="scss" scoped>
|
<style lang="scss" scoped>
|
||||||
@import './comment.scss';
|
@import "./comment.scss";
|
||||||
@import './card.scss';
|
@import "./card.scss";
|
||||||
|
|
||||||
.msg-main {
|
.msg-main {
|
||||||
margin-top: -30px;
|
margin-top: -30px;
|
||||||
|
|||||||
@@ -99,136 +99,136 @@
|
|||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script setup lang="ts" name="wx-reply">
|
<script setup lang="ts" name="wx-reply">
|
||||||
import { getMaterialVideo } from '/@/api/mp/wx-material';
|
import { getMaterialVideo } from "/@/api/mp/wx-material"
|
||||||
import { useMessage } from '/@/hooks/message';
|
import { useMessage } from "/@/hooks/message"
|
||||||
const WxMaterialSelect = defineAsyncComponent(() => import('/@/components/Wechat/wx-material-select/main.vue'));
|
const WxMaterialSelect = defineAsyncComponent(() => import("/@/components/Wechat/wx-material-select/main.vue"))
|
||||||
|
|
||||||
const WxFileUpload = defineAsyncComponent(() => import('/@/components/Wechat/fileUpload/index.vue'));
|
const WxFileUpload = defineAsyncComponent(() => import("/@/components/Wechat/fileUpload/index.vue"))
|
||||||
|
|
||||||
const WxNews = defineAsyncComponent(() => import('/@/components/Wechat/wx-news/index.vue'));
|
const WxNews = defineAsyncComponent(() => import("/@/components/Wechat/wx-news/index.vue"))
|
||||||
|
|
||||||
const props = defineProps({
|
const props = defineProps({
|
||||||
objData: {
|
objData: {
|
||||||
type: Object,
|
type: Object,
|
||||||
default: () => {
|
default: () => {
|
||||||
return {
|
return {
|
||||||
repType: '',
|
repType: "",
|
||||||
repContent: '',
|
repContent: "",
|
||||||
repName: '',
|
repName: "",
|
||||||
repDesc: '',
|
repDesc: "",
|
||||||
repUrl: '',
|
repUrl: "",
|
||||||
};
|
}
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
});
|
})
|
||||||
|
|
||||||
const uploadData = reactive({
|
const uploadData = reactive({
|
||||||
mediaType: props.objData.repType,
|
mediaType: props.objData.repType,
|
||||||
title: '',
|
title: "",
|
||||||
introduction: '',
|
introduction: "",
|
||||||
appId: props.objData.appId,
|
appId: props.objData.appId,
|
||||||
});
|
})
|
||||||
|
|
||||||
const tempObj = ref({}) as any;
|
const tempObj = ref({}) as any
|
||||||
|
|
||||||
const handleClick = (tab) => {
|
const handleClick = (tab) => {
|
||||||
uploadData.mediaType = tab.paneName;
|
uploadData.mediaType = tab.paneName
|
||||||
uploadData.appId = props.objData.appId;
|
uploadData.appId = props.objData.appId
|
||||||
|
|
||||||
const tempObjItem = tempObj.value[tab.paneName];
|
const tempObjItem = tempObj.value[tab.paneName]
|
||||||
if (tempObjItem) {
|
if (tempObjItem) {
|
||||||
props.objData.repName = tempObjItem.repName ? tempObjItem.repName : null;
|
props.objData.repName = tempObjItem.repName ? tempObjItem.repName : null
|
||||||
props.objData.repMediaId = tempObjItem.repMediaId ? tempObjItem.repMediaId : null;
|
props.objData.repMediaId = tempObjItem.repMediaId ? tempObjItem.repMediaId : null
|
||||||
props.objData.media_id = tempObjItem.media_id ? tempObjItem.media_id : null;
|
props.objData.media_id = tempObjItem.media_id ? tempObjItem.media_id : null
|
||||||
props.objData.repUrl = tempObjItem.repUrl ? tempObjItem.repUrl : null;
|
props.objData.repUrl = tempObjItem.repUrl ? tempObjItem.repUrl : null
|
||||||
props.objData.content = tempObjItem.content ? tempObjItem.content : null;
|
props.objData.content = tempObjItem.content ? tempObjItem.content : null
|
||||||
props.objData.repDesc = tempObjItem.repDesc ? tempObjItem.repDesc : null;
|
props.objData.repDesc = tempObjItem.repDesc ? tempObjItem.repDesc : null
|
||||||
} else {
|
} else {
|
||||||
props.objData.repName = '';
|
props.objData.repName = ""
|
||||||
props.objData.repMediaId = '';
|
props.objData.repMediaId = ""
|
||||||
props.objData.media_id = '';
|
props.objData.media_id = ""
|
||||||
props.objData.repUrl = '';
|
props.objData.repUrl = ""
|
||||||
props.objData.content = '';
|
props.objData.content = ""
|
||||||
props.objData.repDesc = '';
|
props.objData.repDesc = ""
|
||||||
}
|
}
|
||||||
};
|
}
|
||||||
|
|
||||||
const deleteObj = () => {
|
const deleteObj = () => {
|
||||||
props.objData.repName = '';
|
props.objData.repName = ""
|
||||||
props.objData.repUrl = '';
|
props.objData.repUrl = ""
|
||||||
props.objData.content = '';
|
props.objData.content = ""
|
||||||
};
|
}
|
||||||
|
|
||||||
const openMaterial = (data: any) => {
|
const openMaterial = (data: any) => {
|
||||||
dialogNewsRef.value.openDialog(data);
|
dialogNewsRef.value.openDialog(data)
|
||||||
};
|
}
|
||||||
|
|
||||||
const dialogNewsRef = ref();
|
const dialogNewsRef = ref()
|
||||||
|
|
||||||
const selectMaterial = (item, appId) => {
|
const selectMaterial = (item, appId) => {
|
||||||
let tempObjItem = {
|
let tempObjItem = {
|
||||||
repType: '',
|
repType: "",
|
||||||
repMediaId: '',
|
repMediaId: "",
|
||||||
media_id: '',
|
media_id: "",
|
||||||
content: '',
|
content: "",
|
||||||
} as any;
|
} as any
|
||||||
|
|
||||||
tempObjItem.repType = props.objData.repType;
|
tempObjItem.repType = props.objData.repType
|
||||||
tempObjItem.repMediaId = item.mediaId;
|
tempObjItem.repMediaId = item.mediaId
|
||||||
tempObjItem.media_id = item.mediaId;
|
tempObjItem.media_id = item.mediaId
|
||||||
tempObjItem.content = item.content;
|
tempObjItem.content = item.content
|
||||||
|
|
||||||
props.objData.repMediaId = item.mediaId;
|
props.objData.repMediaId = item.mediaId
|
||||||
props.objData.media_id = item.mediaId;
|
props.objData.media_id = item.mediaId
|
||||||
props.objData.content = item.content;
|
props.objData.content = item.content
|
||||||
if (props.objData.repType === 'music') {
|
if (props.objData.repType === "music") {
|
||||||
tempObjItem.repThumbMediaId = item.mediaId;
|
tempObjItem.repThumbMediaId = item.mediaId
|
||||||
tempObjItem.repThumbUrl = item.url;
|
tempObjItem.repThumbUrl = item.url
|
||||||
props.objData.repThumbMediaId = item.mediaId;
|
props.objData.repThumbMediaId = item.mediaId
|
||||||
props.objData.repThumbUrl = item.url;
|
props.objData.repThumbUrl = item.url
|
||||||
} else {
|
} else {
|
||||||
tempObjItem.repName = item.name;
|
tempObjItem.repName = item.name
|
||||||
tempObjItem.repUrl = item.url;
|
tempObjItem.repUrl = item.url
|
||||||
props.objData.repName = item.name;
|
props.objData.repName = item.name
|
||||||
props.objData.repUrl = item.url;
|
props.objData.repUrl = item.url
|
||||||
}
|
}
|
||||||
if (props.objData.repType === 'video') {
|
if (props.objData.repType === "video") {
|
||||||
getMaterialVideo({
|
getMaterialVideo({
|
||||||
mediaId: item.mediaId,
|
mediaId: item.mediaId,
|
||||||
appId: appId,
|
appId: appId,
|
||||||
}).then((response) => {
|
}).then((response) => {
|
||||||
const data = response.data;
|
const data = response.data
|
||||||
tempObjItem.repDesc = data.description || '';
|
tempObjItem.repDesc = data.description || ""
|
||||||
tempObjItem.repUrl = data.downUrl;
|
tempObjItem.repUrl = data.downUrl
|
||||||
props.objData.repName = data.title;
|
props.objData.repName = data.title
|
||||||
props.objData.repDesc = data.description || '';
|
props.objData.repDesc = data.description || ""
|
||||||
props.objData.repUrl = data.downUrl;
|
props.objData.repUrl = data.downUrl
|
||||||
});
|
})
|
||||||
}
|
}
|
||||||
if (props.objData.repType === 'news') {
|
if (props.objData.repType === "news") {
|
||||||
props.objData.content = JSON.stringify(item.content.newsItem);
|
props.objData.content = JSON.stringify(item.content.newsItem)
|
||||||
}
|
}
|
||||||
tempObj.value[props.objData.repType] = tempObjItem;
|
tempObj.value[props.objData.repType] = tempObjItem
|
||||||
};
|
}
|
||||||
|
|
||||||
const handelUpload = (response) => {
|
const handelUpload = (response) => {
|
||||||
if (response.code === 0) {
|
if (response.code === 0) {
|
||||||
const item = response.data;
|
const item = response.data
|
||||||
selectMaterial(item, props.objData.appId);
|
selectMaterial(item, props.objData.appId)
|
||||||
} else {
|
} else {
|
||||||
useMessage().error('上传错误' + response.msg);
|
useMessage().error("上传错误" + response.msg)
|
||||||
}
|
}
|
||||||
};
|
}
|
||||||
|
|
||||||
const loadVideo = (item) => {
|
const loadVideo = (item) => {
|
||||||
getMaterialVideo({
|
getMaterialVideo({
|
||||||
mediaId: item.repMediaId,
|
mediaId: item.repMediaId,
|
||||||
appId: item.appId,
|
appId: item.appId,
|
||||||
}).then((response) => {
|
}).then((response) => {
|
||||||
const data = response.data;
|
// const data = response.data
|
||||||
window.open(data.downUrl, 'target', '');
|
// window.open(data.downUrl, 'target', '');
|
||||||
});
|
})
|
||||||
};
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style scoped lang="scss">
|
<style scoped lang="scss">
|
||||||
|
|||||||
@@ -28,74 +28,77 @@
|
|||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script setup lang="ts" name="layoutBreadcrumbSearch">
|
<script setup lang="ts" name="layoutBreadcrumbSearch">
|
||||||
import { useI18n } from 'vue-i18n';
|
import { useI18n } from "vue-i18n"
|
||||||
import { useTagsViewRoutes } from '/@/stores/tagsViewRoutes';
|
import { useTagsViewRoutes } from "/@/stores/tagsViewRoutes"
|
||||||
|
|
||||||
// 定义变量内容
|
// 定义变量内容
|
||||||
const storesTagsViewRoutes = useTagsViewRoutes();
|
const storesTagsViewRoutes = useTagsViewRoutes()
|
||||||
const { tagsViewRoutes } = storeToRefs(storesTagsViewRoutes);
|
const { tagsViewRoutes } = storeToRefs(storesTagsViewRoutes)
|
||||||
const layoutMenuAutocompleteRef = ref();
|
const layoutMenuAutocompleteRef = ref()
|
||||||
const { t } = useI18n();
|
const { t } = useI18n()
|
||||||
const router = useRouter();
|
const router = useRouter()
|
||||||
const state = reactive<SearchState>({
|
const state = reactive<SearchState>({
|
||||||
isShowSearch: false,
|
isShowSearch: false,
|
||||||
menuQuery: '',
|
menuQuery: "",
|
||||||
tagsViewList: [],
|
tagsViewList: [],
|
||||||
});
|
})
|
||||||
|
|
||||||
// 搜索弹窗打开
|
// 搜索弹窗打开
|
||||||
const openSearch = () => {
|
const openSearch = () => {
|
||||||
state.menuQuery = '';
|
state.menuQuery = ""
|
||||||
state.isShowSearch = true;
|
state.isShowSearch = true
|
||||||
initTageView();
|
initTageView()
|
||||||
nextTick(() => {
|
nextTick(() => {
|
||||||
setTimeout(() => {
|
setTimeout(() => {
|
||||||
layoutMenuAutocompleteRef.value.focus();
|
layoutMenuAutocompleteRef.value.focus()
|
||||||
});
|
})
|
||||||
});
|
})
|
||||||
};
|
}
|
||||||
// 搜索弹窗关闭
|
// 搜索弹窗关闭
|
||||||
const closeSearch = () => {
|
const closeSearch = () => {
|
||||||
state.isShowSearch = false;
|
state.isShowSearch = false
|
||||||
};
|
}
|
||||||
// 菜单搜索数据过滤
|
// 菜单搜索数据过滤
|
||||||
const menuSearch = (queryString: string, cb: Function) => {
|
const menuSearch = (queryString: string, cb: Function) => {
|
||||||
let results = queryString ? state.tagsViewList.filter(createFilter(queryString)) : state.tagsViewList;
|
let results = queryString ? state.tagsViewList.filter(createFilter(queryString)) : state.tagsViewList
|
||||||
cb(results);
|
cb(results)
|
||||||
};
|
}
|
||||||
// 菜单搜索过滤
|
// 菜单搜索过滤
|
||||||
const createFilter = (queryString: string) => {
|
const createFilter = (queryString: string) => {
|
||||||
return (restaurant: RouteItem) => {
|
return (restaurant: RouteItem) => {
|
||||||
return restaurant.path.toLowerCase().indexOf(queryString.toLowerCase()) > -1 || t(restaurant!.name!).indexOf(queryString.toLowerCase()) > -1;
|
return (
|
||||||
};
|
restaurant.path.toLowerCase().indexOf(queryString.toLowerCase()) > -1 || t(restaurant!.name!).indexOf(queryString.toLowerCase()) > -1
|
||||||
};
|
)
|
||||||
|
}
|
||||||
|
}
|
||||||
// 初始化菜单数据
|
// 初始化菜单数据
|
||||||
const initTageView = () => {
|
const initTageView = () => {
|
||||||
if (state.tagsViewList.length > 0) return false;
|
if (state.tagsViewList.length > 0) return false
|
||||||
tagsViewRoutes.value.map((v: RouteItem) => {
|
tagsViewRoutes.value.map((v: RouteItem) => {
|
||||||
if (!v.meta?.isHide) state.tagsViewList.push({ ...v });
|
if (!v.meta?.isHide) state.tagsViewList.push({ ...v })
|
||||||
});
|
})
|
||||||
};
|
}
|
||||||
// 当前菜单选中时
|
// 当前菜单选中时
|
||||||
const onHandleSelect = (item: RouteItem) => {
|
const onHandleSelect = (item: RouteItem) => {
|
||||||
let { path, redirect } = item;
|
let { path, redirect } = item
|
||||||
if (item.meta?.isLink && !item.meta?.isIframe) window.open(item.meta?.isLink);
|
if (item.meta?.isLink && !item.meta?.isIframe) {
|
||||||
else if (redirect) router.push(redirect);
|
// window.open(item.meta?.isLink)
|
||||||
else router.push(path);
|
} else if (redirect) router.push(redirect)
|
||||||
closeSearch();
|
else router.push(path)
|
||||||
};
|
closeSearch()
|
||||||
|
}
|
||||||
|
|
||||||
// 暴露变量
|
// 暴露变量
|
||||||
defineExpose({
|
defineExpose({
|
||||||
openSearch,
|
openSearch,
|
||||||
});
|
})
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style scoped lang="scss">
|
<style scoped lang="scss">
|
||||||
.layout-search-dialog {
|
.layout-search-dialog {
|
||||||
position: relative;
|
position: relative;
|
||||||
:deep(.el-dialog) {
|
:deep(.el-dialog) {
|
||||||
width: 560px;
|
width: 560px;
|
||||||
.el-dialog__header,
|
.el-dialog__header,
|
||||||
.el-dialog__body {
|
.el-dialog__body {
|
||||||
display: none;
|
display: none;
|
||||||
@@ -108,8 +111,8 @@ defineExpose({
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
:deep(.el-autocomplete) {
|
:deep(.el-autocomplete) {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
width: 560px;
|
width: 560px;
|
||||||
top: 53vh;
|
top: 53vh;
|
||||||
left: 50%;
|
left: 50%;
|
||||||
transform: translateX(-50%);
|
transform: translateX(-50%);
|
||||||
|
|||||||
@@ -14,31 +14,34 @@
|
|||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script setup lang="ts" name="layoutLinkView">
|
<script setup lang="ts" name="layoutLinkView">
|
||||||
import { verifyUrl } from '/@/utils/toolsValidate';
|
import { verifyUrl } from "/@/utils/toolsValidate"
|
||||||
|
|
||||||
// 定义变量内容
|
// 定义变量内容
|
||||||
const route = useRoute();
|
const route = useRoute()
|
||||||
const state = reactive<LinkViewState>({
|
const state = reactive<LinkViewState>({
|
||||||
title: '',
|
title: "",
|
||||||
isLink: '',
|
isLink: "",
|
||||||
});
|
})
|
||||||
|
|
||||||
// 立即前往
|
// 立即前往
|
||||||
const onGotoFullPage = () => {
|
const onGotoFullPage = () => {
|
||||||
if (verifyUrl(<string>state.isLink)) window.open(state.isLink);
|
if (verifyUrl(<string>state.isLink)) {
|
||||||
else window.open(`${state.isLink}`);
|
window.open(state.isLink)
|
||||||
};
|
} else {
|
||||||
|
window.open(`${state.isLink}`)
|
||||||
|
}
|
||||||
|
}
|
||||||
// 监听路由的变化,设置内容
|
// 监听路由的变化,设置内容
|
||||||
watch(
|
watch(
|
||||||
() => route.path,
|
() => route.path,
|
||||||
() => {
|
() => {
|
||||||
state.title = <string>route.name;
|
state.title = <string>route.name
|
||||||
state.isLink = <string>route.meta.isLink;
|
state.isLink = <string>route.meta.isLink
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
immediate: true,
|
immediate: true,
|
||||||
}
|
},
|
||||||
);
|
)
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style scoped lang="scss">
|
<style scoped lang="scss">
|
||||||
@@ -56,7 +59,7 @@ watch(
|
|||||||
color: var(--el-color-primary);
|
color: var(--el-color-primary);
|
||||||
|
|
||||||
&::after {
|
&::after {
|
||||||
content: '';
|
content: "";
|
||||||
position: absolute;
|
position: absolute;
|
||||||
left: 50px;
|
left: 50px;
|
||||||
top: 0;
|
top: 0;
|
||||||
|
|||||||
+93
-25
@@ -167,13 +167,13 @@ export const openWindow = (url: string, title: string, w: number, h: number) =>
|
|||||||
const width = window.innerWidth
|
const width = window.innerWidth
|
||||||
? window.innerWidth
|
? window.innerWidth
|
||||||
: document.documentElement.clientWidth
|
: document.documentElement.clientWidth
|
||||||
? document.documentElement.clientWidth
|
? document.documentElement.clientWidth
|
||||||
: screen.width
|
: screen.width
|
||||||
const height = window.innerHeight
|
const height = window.innerHeight
|
||||||
? window.innerHeight
|
? window.innerHeight
|
||||||
: document.documentElement.clientHeight
|
: document.documentElement.clientHeight
|
||||||
? document.documentElement.clientHeight
|
? document.documentElement.clientHeight
|
||||||
: screen.height
|
: screen.height
|
||||||
|
|
||||||
const left = width / 2 - w / 2 + dualScreenLeft
|
const left = width / 2 - w / 2 + dualScreenLeft
|
||||||
const top = height / 2 - h / 2 + dualScreenTop
|
const top = height / 2 - h / 2 + dualScreenTop
|
||||||
@@ -181,13 +181,13 @@ export const openWindow = (url: string, title: string, w: number, h: number) =>
|
|||||||
url,
|
url,
|
||||||
title,
|
title,
|
||||||
"toolbar=no, location=no, directories=no, status=no, menubar=no, scrollbars=no, resizable=yes, copyhistory=no, width=" +
|
"toolbar=no, location=no, directories=no, status=no, menubar=no, scrollbars=no, resizable=yes, copyhistory=no, width=" +
|
||||||
w +
|
w +
|
||||||
", height=" +
|
", height=" +
|
||||||
h +
|
h +
|
||||||
", top=" +
|
", top=" +
|
||||||
top +
|
top +
|
||||||
", left=" +
|
", left=" +
|
||||||
left,
|
left,
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -290,25 +290,93 @@ export function postDownBlobFile(url: any, data: any, fileName: string) {
|
|||||||
*/
|
*/
|
||||||
export function handleBlobFile(response: any, fileName: string) {
|
export function handleBlobFile(response: any, fileName: string) {
|
||||||
// 处理返回的文件流
|
// 处理返回的文件流
|
||||||
const blob = response
|
// const blob = response
|
||||||
if (blob && blob.size === 0) {
|
// if (blob && blob.size === 0) {
|
||||||
useMessage().error("内容为空,无法下载")
|
// useMessage().error("内容为空,无法下载")
|
||||||
|
// return
|
||||||
|
// }
|
||||||
|
// const link = document.createElement("a")
|
||||||
|
|
||||||
|
// // 兼容一下 入参不是 File Blob 类型情况
|
||||||
|
// var binaryData = [] as any
|
||||||
|
// binaryData.push(response)
|
||||||
|
// link.href = window.URL.createObjectURL(new Blob(binaryData))
|
||||||
|
// link.download = fileName
|
||||||
|
// document.body.appendChild(link)
|
||||||
|
// link.click()
|
||||||
|
// window.setTimeout(function () {
|
||||||
|
// // @ts-ignore
|
||||||
|
// URL.revokeObjectURL(blob)
|
||||||
|
// document.body.removeChild(link)
|
||||||
|
// }, 0)
|
||||||
|
|
||||||
|
// 1. 验证response类型和结构
|
||||||
|
if (!response || typeof response !== "object" || response.size === 0) {
|
||||||
|
useMessage().error("无效的响应数据")
|
||||||
return
|
return
|
||||||
}
|
}
|
||||||
const link = document.createElement("a")
|
|
||||||
|
|
||||||
// 兼容一下 入参不是 File Blob 类型情况
|
// 2. 验证blob类型
|
||||||
var binaryData = [] as any
|
let blob: Blob
|
||||||
binaryData.push(response)
|
try {
|
||||||
link.href = window.URL.createObjectURL(new Blob(binaryData))
|
if (response instanceof Blob) {
|
||||||
link.download = fileName
|
blob = response
|
||||||
|
} else if (response instanceof File) {
|
||||||
|
blob = response
|
||||||
|
} else if (response.data && response.data instanceof Blob) {
|
||||||
|
blob = response.data
|
||||||
|
} else {
|
||||||
|
// 尝试构造安全的blob
|
||||||
|
const safeData = Array.isArray(response) ? response : [response]
|
||||||
|
blob = new Blob(safeData, { type: "application/octet-stream" })
|
||||||
|
}
|
||||||
|
} catch (error) {
|
||||||
|
useMessage().error("文件数据格式错误")
|
||||||
|
return
|
||||||
|
}
|
||||||
|
|
||||||
|
// 3. 验证文件大小 (防止过大文件)
|
||||||
|
const MAX_FILE_SIZE = 100 * 1024 * 1024 // 100MB限制
|
||||||
|
if (blob.size > MAX_FILE_SIZE) {
|
||||||
|
useMessage().error("文件过大,无法下载")
|
||||||
|
return
|
||||||
|
}
|
||||||
|
|
||||||
|
// 4. 验证文件类型 (白名单)
|
||||||
|
const allowedTypes = [
|
||||||
|
"application/pdf",
|
||||||
|
"application/msword",
|
||||||
|
"application/vnd.openxmlformats-officedocument.wordprocessingml.document",
|
||||||
|
"application/vnd.ms-excel",
|
||||||
|
"application/vnd.openxmlformats-officedocument.spreadsheetml.sheet",
|
||||||
|
"text/plain",
|
||||||
|
"image/jpeg",
|
||||||
|
"image/png",
|
||||||
|
]
|
||||||
|
|
||||||
|
if (!allowedTypes.includes(blob.type) && blob.type !== "") {
|
||||||
|
useMessage().error("不支持的文件类型")
|
||||||
|
return
|
||||||
|
}
|
||||||
|
|
||||||
|
// 5. 安全的文件下载
|
||||||
|
const link = document.createElement("a")
|
||||||
|
link.href = window.URL.createObjectURL(blob)
|
||||||
|
link.download = fileName.replace(/[<>:"/\\|?*]/g, "_").substring(0, 255) // 文件名清理,移除危险字符
|
||||||
|
link.style.display = "none" // 隐藏链接
|
||||||
|
|
||||||
document.body.appendChild(link)
|
document.body.appendChild(link)
|
||||||
link.click()
|
link.click()
|
||||||
window.setTimeout(function () {
|
|
||||||
// @ts-ignore
|
// 6. 安全的清理操作
|
||||||
URL.revokeObjectURL(blob)
|
setTimeout(() => {
|
||||||
document.body.removeChild(link)
|
try {
|
||||||
}, 0)
|
window.URL.revokeObjectURL(link.href)
|
||||||
|
document.body.removeChild(link)
|
||||||
|
} catch (error) {
|
||||||
|
// 静默处理清理错误
|
||||||
|
}
|
||||||
|
}, 10)
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
|
|||||||
@@ -133,117 +133,117 @@
|
|||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script setup lang="ts" name="wx-material">
|
<script setup lang="ts" name="wx-material">
|
||||||
import {fetchAccountList} from '/@/api/mp/wx-account';
|
import { fetchAccountList } from "/@/api/mp/wx-account"
|
||||||
import {useMessage, useMessageBox} from '/@/hooks/message';
|
import { useMessage, useMessageBox } from "/@/hooks/message"
|
||||||
import {BasicTableProps, useTable} from '/@/hooks/table';
|
import { BasicTableProps, useTable } from "/@/hooks/table"
|
||||||
import {delObj, getMaterialOther, getMaterialVideo, getPage} from '/@/api/mp/wx-material';
|
import { delObj, getMaterialOther, getMaterialVideo, getPage } from "/@/api/mp/wx-material"
|
||||||
|
|
||||||
const QueryTree = defineAsyncComponent(() => import('/@/components/QueryTree/index.vue'));
|
const QueryTree = defineAsyncComponent(() => import("/@/components/QueryTree/index.vue"))
|
||||||
const NewsForm = defineAsyncComponent(() => import('./components/news-form.vue'));
|
const NewsForm = defineAsyncComponent(() => import("./components/news-form.vue"))
|
||||||
const WxFileUpload = defineAsyncComponent(() => import('/@/components/Wechat/fileUpload/index.vue'));
|
const WxFileUpload = defineAsyncComponent(() => import("/@/components/Wechat/fileUpload/index.vue"))
|
||||||
const WxNews = defineAsyncComponent(() => import('/@/components/Wechat/wx-news/index.vue'));
|
const WxNews = defineAsyncComponent(() => import("/@/components/Wechat/wx-news/index.vue"))
|
||||||
|
|
||||||
const deptData = reactive({
|
const deptData = reactive({
|
||||||
queryList: (name?: string) => {
|
queryList: (name?: string) => {
|
||||||
return fetchAccountList({
|
return fetchAccountList({
|
||||||
name: name,
|
name: name,
|
||||||
});
|
})
|
||||||
},
|
},
|
||||||
});
|
})
|
||||||
|
|
||||||
const checkAppId = ref();
|
const checkAppId = ref()
|
||||||
|
|
||||||
const uploadData = ref({
|
const uploadData = ref({
|
||||||
appId: '',
|
appId: "",
|
||||||
mediaType: 'image',
|
mediaType: "image",
|
||||||
title: '',
|
title: "",
|
||||||
introduction: '',
|
introduction: "",
|
||||||
});
|
})
|
||||||
|
|
||||||
const materialType = ref('image');
|
const materialType = ref("image")
|
||||||
|
|
||||||
// 点击树
|
// 点击树
|
||||||
const handleNodeClick = (data: any) => {
|
const handleNodeClick = (data: any) => {
|
||||||
checkAppId.value = data.appid;
|
checkAppId.value = data.appid
|
||||||
uploadData.value.appId = data.appid;
|
uploadData.value.appId = data.appid
|
||||||
state.queryForm.appId = data.appid;
|
state.queryForm.appId = data.appid
|
||||||
state.queryForm.type = materialType.value;
|
state.queryForm.type = materialType.value
|
||||||
getDataList();
|
getDataList()
|
||||||
};
|
}
|
||||||
|
|
||||||
const handleClick = (tab) => {
|
const handleClick = (tab) => {
|
||||||
if (checkAppId.value) {
|
if (checkAppId.value) {
|
||||||
// getPage(this.page)
|
// getPage(this.page)
|
||||||
} else {
|
} else {
|
||||||
useMessage().error('请选择公众号');
|
useMessage().error("请选择公众号")
|
||||||
}
|
}
|
||||||
materialType.value = tab.paneName;
|
materialType.value = tab.paneName
|
||||||
uploadData.value.mediaType = tab.paneName;
|
uploadData.value.mediaType = tab.paneName
|
||||||
state.queryForm.type = materialType.value;
|
state.queryForm.type = materialType.value
|
||||||
getDataList();
|
getDataList()
|
||||||
};
|
}
|
||||||
|
|
||||||
const state: BasicTableProps = reactive<BasicTableProps>({
|
const state: BasicTableProps = reactive<BasicTableProps>({
|
||||||
queryForm: {
|
queryForm: {
|
||||||
appId: '',
|
appId: "",
|
||||||
type: '',
|
type: "",
|
||||||
},
|
},
|
||||||
pageList: getPage,
|
pageList: getPage,
|
||||||
createdIsNeed: false,
|
createdIsNeed: false,
|
||||||
props: {
|
props: {
|
||||||
item: 'items',
|
item: "items",
|
||||||
totalCount: 'totalCount',
|
totalCount: "totalCount",
|
||||||
},
|
},
|
||||||
});
|
})
|
||||||
|
|
||||||
const { getDataList, currentChangeHandle, sizeChangeHandle, tableStyle } = useTable(state);
|
const { getDataList, currentChangeHandle, sizeChangeHandle, tableStyle } = useTable(state)
|
||||||
|
|
||||||
const delMaterial = (item: any) => {
|
const delMaterial = (item: any) => {
|
||||||
useMessageBox()
|
useMessageBox()
|
||||||
.confirm('此操作将永久删除该文件, 是否继续?')
|
.confirm("此操作将永久删除该文件, 是否继续?")
|
||||||
.then(() => {
|
.then(() => {
|
||||||
delObj({
|
delObj({
|
||||||
id: item.mediaId,
|
id: item.mediaId,
|
||||||
appId: checkAppId.value,
|
appId: checkAppId.value,
|
||||||
})
|
})
|
||||||
.then(() => {
|
.then(() => {
|
||||||
getDataList();
|
getDataList()
|
||||||
})
|
})
|
||||||
.catch((err) => {
|
.catch((err) => {
|
||||||
useMessage().error(err.msg);
|
useMessage().error(err.msg)
|
||||||
});
|
})
|
||||||
});
|
})
|
||||||
};
|
}
|
||||||
|
|
||||||
// 视频
|
// 视频
|
||||||
|
|
||||||
const dialogVideoVisible = ref(false);
|
const dialogVideoVisible = ref(false)
|
||||||
|
|
||||||
const addMaterialLoading = ref(false);
|
const addMaterialLoading = ref(false)
|
||||||
|
|
||||||
const handleAddVideo = () => {
|
const handleAddVideo = () => {
|
||||||
dialogVideoVisible.value = true;
|
dialogVideoVisible.value = true
|
||||||
};
|
}
|
||||||
|
|
||||||
const uploadRules = reactive({
|
const uploadRules = reactive({
|
||||||
title: [{ required: true, message: '请输入标题', trigger: 'blur' }],
|
title: [{ required: true, message: "请输入标题", trigger: "blur" }],
|
||||||
introduction: [{ required: true, message: '请输入描述', trigger: 'blur' }],
|
introduction: [{ required: true, message: "请输入描述", trigger: "blur" }],
|
||||||
});
|
})
|
||||||
|
|
||||||
const uploadForm = ref();
|
const uploadForm = ref()
|
||||||
|
|
||||||
const uploadFileVideo = ref();
|
const uploadFileVideo = ref()
|
||||||
|
|
||||||
const subVideo = () => {
|
const subVideo = () => {
|
||||||
uploadForm.value.validate((valid: boolean) => {
|
uploadForm.value.validate((valid: boolean) => {
|
||||||
if (!valid) {
|
if (!valid) {
|
||||||
return false;
|
return false
|
||||||
}
|
}
|
||||||
uploadFileVideo.value.submit().then(() => {
|
uploadFileVideo.value.submit().then(() => {
|
||||||
dialogVideoVisible.value = false;
|
dialogVideoVisible.value = false
|
||||||
});
|
})
|
||||||
});
|
})
|
||||||
};
|
}
|
||||||
|
|
||||||
const handleDown = (row: any) => {
|
const handleDown = (row: any) => {
|
||||||
getMaterialOther({
|
getMaterialOther({
|
||||||
@@ -251,25 +251,25 @@ const handleDown = (row: any) => {
|
|||||||
fileName: row.name,
|
fileName: row.name,
|
||||||
appId: checkAppId.value,
|
appId: checkAppId.value,
|
||||||
}).then((response) => {
|
}).then((response) => {
|
||||||
const url = window.URL.createObjectURL(new Blob([response.data]));
|
const url = window.URL.createObjectURL(new Blob([response.data]))
|
||||||
const link = document.createElement('a');
|
const link = document.createElement("a")
|
||||||
link.style.display = 'none';
|
link.style.display = "none"
|
||||||
link.href = url;
|
link.href = url
|
||||||
link.setAttribute('download', row.name);
|
link.setAttribute("download", row.name)
|
||||||
document.body.appendChild(link);
|
document.body.appendChild(link)
|
||||||
link.click();
|
link.click()
|
||||||
});
|
})
|
||||||
};
|
}
|
||||||
|
|
||||||
// 图文
|
// 图文
|
||||||
|
|
||||||
const dialogNewsRef = ref();
|
const dialogNewsRef = ref()
|
||||||
|
|
||||||
const handleAddNews = () => {
|
const handleAddNews = () => {
|
||||||
dialogNewsRef.value.openDialog({
|
dialogNewsRef.value.openDialog({
|
||||||
accountId: checkAppId.value,
|
accountId: checkAppId.value,
|
||||||
});
|
})
|
||||||
};
|
}
|
||||||
|
|
||||||
const handleEditNews = (item) => {
|
const handleEditNews = (item) => {
|
||||||
dialogNewsRef.value.openDialog(
|
dialogNewsRef.value.openDialog(
|
||||||
@@ -278,9 +278,9 @@ const handleEditNews = (item) => {
|
|||||||
},
|
},
|
||||||
JSON.parse(JSON.stringify(item.content.newsItem)),
|
JSON.parse(JSON.stringify(item.content.newsItem)),
|
||||||
item.mediaId,
|
item.mediaId,
|
||||||
'edit'
|
"edit",
|
||||||
);
|
)
|
||||||
};
|
}
|
||||||
|
|
||||||
const handleInfo = (row) => {
|
const handleInfo = (row) => {
|
||||||
getMaterialVideo({
|
getMaterialVideo({
|
||||||
@@ -288,21 +288,21 @@ const handleInfo = (row) => {
|
|||||||
appId: checkAppId.value,
|
appId: checkAppId.value,
|
||||||
})
|
})
|
||||||
.then((response) => {
|
.then((response) => {
|
||||||
const downUrl = response.data.downUrl;
|
// const downUrl = response.data.downUrl
|
||||||
window.open(downUrl, '_blank');
|
// window.open(downUrl, '_blank');
|
||||||
})
|
})
|
||||||
.catch((err) => {
|
.catch((err) => {
|
||||||
useMessage().error(err.msg);
|
useMessage().error(err.msg)
|
||||||
});
|
})
|
||||||
};
|
}
|
||||||
|
|
||||||
// 默认选择第一个公众号
|
// 默认选择第一个公众号
|
||||||
onMounted(async () => {
|
onMounted(async () => {
|
||||||
const { data } = await deptData.queryList();
|
const { data } = await deptData.queryList()
|
||||||
if (data?.length > 0) {
|
if (data?.length > 0) {
|
||||||
handleNodeClick(data[0]);
|
handleNodeClick(data[0])
|
||||||
}
|
}
|
||||||
});
|
})
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style lang="scss" scoped>
|
<style lang="scss" scoped>
|
||||||
|
|||||||
@@ -1,46 +1,80 @@
|
|||||||
<template>
|
<template>
|
||||||
<el-dialog :title="form.id ? '编辑' : '新增'" v-model="visible" :close-on-click-modal="false" draggable>
|
<el-dialog :title="form.id ? '编辑' : '新增'" v-model="visible" :close-on-click-modal="false" draggable width="700px">
|
||||||
<el-form ref="dataFormRef" :model="form" :rules="dataRules" formDialogRef label-width="90px" v-loading="loading">
|
<el-form ref="dataFormRef" :model="form" :rules="dataRules" formDialogRef label-width="120px" v-loading="loading">
|
||||||
<el-row :gutter="24">
|
<el-row :gutter="24">
|
||||||
<el-col :span="12" class="mb20">
|
<el-col :span="12" class="mb20">
|
||||||
<el-form-item label="包厢Id" prop="boxesId">
|
<el-form-item label="商户" prop="merchantId">
|
||||||
<el-input v-model="form.boxesId" placeholder="请输入包厢Id" />
|
<select-mch v-model="form.merchantId" @change="onMerchantChange" />
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
</el-col>
|
</el-col>
|
||||||
|
|
||||||
<el-col :span="12" class="mb20">
|
<el-col :span="12" class="mb20">
|
||||||
<el-form-item label="预约id" prop="bookingId">
|
<el-form-item label="餐桌" prop="boxesId">
|
||||||
<el-input v-model="form.bookingId" placeholder="请输入预约id" />
|
<el-select v-model="form.boxesId" placeholder="请选择餐桌" clearable>
|
||||||
|
<el-option
|
||||||
|
v-for="item in tableList"
|
||||||
|
:key="item.id"
|
||||||
|
:label="`${item.tableNumber} - ${item.name}`"
|
||||||
|
:value="item.id"
|
||||||
|
/>
|
||||||
|
</el-select>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
</el-col>
|
</el-col>
|
||||||
|
|
||||||
<el-col :span="12" class="mb20">
|
<el-col :span="12" class="mb20">
|
||||||
<el-form-item label="状态 0空闲 1已使用" prop="status">
|
<el-form-item label="餐次类型" prop="mealType">
|
||||||
<el-input v-model="form.status" placeholder="请输入状态 0空闲 1已使用" />
|
<el-select v-model="form.mealType" placeholder="请选择餐次类型" @change="onMealTypeChange">
|
||||||
|
<el-option label="早餐" value="1" />
|
||||||
|
<el-option label="中餐" value="2" />
|
||||||
|
<el-option label="晚餐" value="3" />
|
||||||
|
</el-select>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
</el-col>
|
</el-col>
|
||||||
|
|
||||||
<el-col :span="12" class="mb20">
|
<el-col :span="12" class="mb20">
|
||||||
<el-form-item label="用户id" prop="userId">
|
<el-form-item label="日期" prop="bxDate">
|
||||||
<el-input v-model="form.userId" placeholder="请输入用户id" />
|
<el-date-picker
|
||||||
|
v-model="form.bxDate"
|
||||||
|
type="date"
|
||||||
|
placeholder="请选择日期"
|
||||||
|
format="YYYY-MM-DD"
|
||||||
|
value-format="YYYY-MM-DD"
|
||||||
|
:disabled-date="disabledDate"
|
||||||
|
/>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
</el-col>
|
</el-col>
|
||||||
|
|
||||||
<el-col :span="12" class="mb20">
|
<el-col :span="12" class="mb20">
|
||||||
<el-form-item label="格式为 YYYY-MM-DD" prop="bxDate">
|
<el-form-item label="开始时间" prop="startTime">
|
||||||
<el-input v-model="form.bxDate" placeholder="请输入格式为 YYYY-MM-DD" />
|
<el-time-select
|
||||||
|
v-model="form.startTime"
|
||||||
|
placeholder="请选择开始时间"
|
||||||
|
:selectable-range="getSelectableTimeRange()"
|
||||||
|
:step="30"
|
||||||
|
format="HH:mm"
|
||||||
|
value-format="HH:mm"
|
||||||
|
/>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
</el-col>
|
</el-col>
|
||||||
|
|
||||||
<el-col :span="12" class="mb20">
|
<el-col :span="12" class="mb20">
|
||||||
<el-form-item label="时间" prop="hour">
|
<el-form-item label="结束时间" prop="endTime">
|
||||||
<el-date-picker type="datetime" placeholder="请选择时间" v-model="form.hour" :value-format="dateTimeStr"></el-date-picker>
|
<el-time-select
|
||||||
|
v-model="form.endTime"
|
||||||
|
placeholder="请选择结束时间"
|
||||||
|
:selectable-range="getSelectableTimeRange()"
|
||||||
|
:step="30"
|
||||||
|
format="HH:mm"
|
||||||
|
value-format="HH:mm"
|
||||||
|
/>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
</el-col>
|
</el-col>
|
||||||
|
|
||||||
<el-col :span="12" class="mb20">
|
<el-col :span="12" class="mb20">
|
||||||
<el-form-item label="时间索引(0-24)" prop="hourIndex">
|
<el-form-item label="状态" prop="status">
|
||||||
<el-input v-model="form.hourIndex" placeholder="请输入时间索引(0-24)" />
|
<el-radio-group v-model="form.status">
|
||||||
|
<el-radio :label="0">空闲</el-radio>
|
||||||
|
<el-radio :label="1">已使用</el-radio>
|
||||||
|
</el-radio-group>
|
||||||
|
</el-form-item>
|
||||||
|
</el-col>
|
||||||
|
<el-col :span="24" class="mb20">
|
||||||
|
<el-form-item label="备注" prop="remark">
|
||||||
|
<el-input type="textarea" v-model="form.remark" placeholder="请输入备注信息" :rows="3" />
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
</el-col>
|
</el-col>
|
||||||
</el-row>
|
</el-row>
|
||||||
@@ -58,6 +92,7 @@
|
|||||||
import { useDict } from '/@/hooks/dict';
|
import { useDict } from '/@/hooks/dict';
|
||||||
import { useMessage } from '/@/hooks/message';
|
import { useMessage } from '/@/hooks/message';
|
||||||
import { getObj, addObj, putObj } from '/@/api/canteen/boxesAvailability';
|
import { getObj, addObj, putObj } from '/@/api/canteen/boxesAvailability';
|
||||||
|
import { fetchList as fetchTableList } from '/@/api/canteen/boxesInfo';
|
||||||
import { rule } from '/@/utils/validate';
|
import { rule } from '/@/utils/validate';
|
||||||
const emit = defineEmits(['refresh']);
|
const emit = defineEmits(['refresh']);
|
||||||
|
|
||||||
@@ -65,35 +100,88 @@ const emit = defineEmits(['refresh']);
|
|||||||
const dataFormRef = ref();
|
const dataFormRef = ref();
|
||||||
const visible = ref(false);
|
const visible = ref(false);
|
||||||
const loading = ref(false);
|
const loading = ref(false);
|
||||||
// 定义字典
|
const tableList = ref<any[]>([]);
|
||||||
const { booking_status } = useDict('booking_status');
|
|
||||||
|
|
||||||
// 提交表单数据
|
// 提交表单数据
|
||||||
const form = reactive({
|
const form = reactive({
|
||||||
id: '',
|
id: '',
|
||||||
|
merchantId: '',
|
||||||
boxesId: '',
|
boxesId: '',
|
||||||
bookingId: '',
|
mealType: '',
|
||||||
status: '',
|
|
||||||
userId: '',
|
|
||||||
bxDate: '',
|
bxDate: '',
|
||||||
hour: '',
|
startTime: '',
|
||||||
hourIndex: '',
|
endTime: '',
|
||||||
|
status: 0,
|
||||||
|
remark: '',
|
||||||
});
|
});
|
||||||
|
|
||||||
// 定义校验规则
|
// 定义校验规则
|
||||||
const dataRules = ref({});
|
const dataRules = ref({
|
||||||
|
merchantId: [{ required: true, message: '商户不能为空', trigger: 'change' }],
|
||||||
|
boxesId: [{ required: true, message: '餐桌不能为空', trigger: 'change' }],
|
||||||
|
mealType: [{ required: true, message: '餐次类型不能为空', trigger: 'change' }],
|
||||||
|
bxDate: [{ required: true, message: '日期不能为空', trigger: 'change' }],
|
||||||
|
startTime: [{ required: true, message: '开始时间不能为空', trigger: 'change' }],
|
||||||
|
endTime: [{ required: true, message: '结束时间不能为空', trigger: 'change' }],
|
||||||
|
status: [{ required: true, message: '状态不能为空', trigger: 'change' }],
|
||||||
|
});
|
||||||
|
|
||||||
|
// 禁用过去的日期
|
||||||
|
const disabledDate = (time: Date) => {
|
||||||
|
return time.getTime() < Date.now() - 8.64e7;
|
||||||
|
};
|
||||||
|
|
||||||
|
// 获取可选时间范围
|
||||||
|
const getSelectableTimeRange = () => {
|
||||||
|
switch (form.mealType) {
|
||||||
|
case '1': return '07:00:00,09:00:00'; // 早餐
|
||||||
|
case '2': return '11:30:00,13:30:00'; // 中餐
|
||||||
|
case '3': return '17:30:00,19:30:00'; // 晚餐
|
||||||
|
default: return '00:00:00,23:59:59';
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
// 商户变化时加载餐桌列表
|
||||||
|
const onMerchantChange = async (merchantId: string) => {
|
||||||
|
if (merchantId) {
|
||||||
|
try {
|
||||||
|
const res = await fetchTableList({ merchantId, status: '0' });
|
||||||
|
tableList.value = res.data?.records || [];
|
||||||
|
} catch (error) {
|
||||||
|
console.error('加载餐桌列表失败:', error);
|
||||||
|
}
|
||||||
|
} else {
|
||||||
|
tableList.value = [];
|
||||||
|
}
|
||||||
|
form.boxesId = '';
|
||||||
|
};
|
||||||
|
|
||||||
|
// 餐次类型变化时重置时间
|
||||||
|
const onMealTypeChange = () => {
|
||||||
|
form.startTime = '';
|
||||||
|
form.endTime = '';
|
||||||
|
};
|
||||||
|
|
||||||
// 打开弹窗
|
// 打开弹窗
|
||||||
const openDialog = (id: string) => {
|
const openDialog = (id: string) => {
|
||||||
visible.value = true;
|
visible.value = true;
|
||||||
form.id = '';
|
form.id = '';
|
||||||
|
form.merchantId = '';
|
||||||
|
form.boxesId = '';
|
||||||
|
form.mealType = '';
|
||||||
|
form.bxDate = '';
|
||||||
|
form.startTime = '';
|
||||||
|
form.endTime = '';
|
||||||
|
form.status = 0;
|
||||||
|
form.remark = '';
|
||||||
|
tableList.value = [];
|
||||||
|
|
||||||
// 重置表单数据
|
// 重置表单数据
|
||||||
nextTick(() => {
|
nextTick(() => {
|
||||||
dataFormRef.value?.resetFields();
|
dataFormRef.value?.resetFields();
|
||||||
});
|
});
|
||||||
|
|
||||||
// 获取boxesAvailability信息
|
// 获取可用时间段信息
|
||||||
if (id) {
|
if (id) {
|
||||||
form.id = id;
|
form.id = id;
|
||||||
getboxesAvailabilityData(id);
|
getboxesAvailabilityData(id);
|
||||||
@@ -120,11 +208,14 @@ const onSubmit = async () => {
|
|||||||
|
|
||||||
// 初始化表单数据
|
// 初始化表单数据
|
||||||
const getboxesAvailabilityData = (id: string) => {
|
const getboxesAvailabilityData = (id: string) => {
|
||||||
// 获取数据
|
|
||||||
loading.value = true;
|
loading.value = true;
|
||||||
getObj(id)
|
getObj(id)
|
||||||
.then((res: any) => {
|
.then((res: any) => {
|
||||||
Object.assign(form, res.data);
|
Object.assign(form, res.data);
|
||||||
|
// 加载餐桌列表
|
||||||
|
if (form.merchantId) {
|
||||||
|
onMerchantChange(form.merchantId);
|
||||||
|
}
|
||||||
})
|
})
|
||||||
.finally(() => {
|
.finally(() => {
|
||||||
loading.value = false;
|
loading.value = false;
|
||||||
|
|||||||
@@ -1,84 +1,101 @@
|
|||||||
<template>
|
<template>
|
||||||
<el-dialog :title="form.id ? '编辑' : '新增'" v-model="visible" :close-on-click-modal="false" draggable>
|
<el-dialog :title="form.id ? '编辑' : '新增'" v-model="visible" :close-on-click-modal="false" draggable width="800px">
|
||||||
<el-form ref="dataFormRef" :model="form" :rules="dataRules" formDialogRef label-width="90px" v-loading="loading">
|
<el-form ref="dataFormRef" :model="form" :rules="dataRules" formDialogRef label-width="120px" v-loading="loading">
|
||||||
<el-row :gutter="24">
|
<el-row :gutter="24">
|
||||||
<el-col :span="12" class="mb20">
|
<el-col :span="12" class="mb20">
|
||||||
<el-form-item label="包厢" prop="boxesId">
|
<el-form-item label="商户" prop="merchantId">
|
||||||
<el-input v-model="form.boxesId" placeholder="请输入包厢Id" />
|
<select-mch v-model="form.merchantId" @change="onMerchantChange" />
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
</el-col>
|
</el-col>
|
||||||
|
|
||||||
<el-col :span="12" class="mb20">
|
<el-col :span="12" class="mb20">
|
||||||
<el-form-item label="开始时间" prop="startTime">
|
<el-form-item label="餐桌" prop="boxesId">
|
||||||
<el-input v-model="form.startTime" placeholder="请输入开始时间" />
|
<el-select v-model="form.boxesId" placeholder="请选择餐桌" clearable>
|
||||||
</el-form-item>
|
<el-option
|
||||||
</el-col>
|
v-for="item in tableList"
|
||||||
|
:key="item.id"
|
||||||
<el-col :span="12" class="mb20">
|
:label="`${item.tableNumber} - ${item.name} (${item.capacity}人)`"
|
||||||
<el-form-item label="结束时间" prop="endTime">
|
:value="item.id"
|
||||||
<el-input v-model="form.endTime" placeholder="请输入结束时间" />
|
/>
|
||||||
</el-form-item>
|
|
||||||
</el-col>
|
|
||||||
|
|
||||||
<el-col :span="12" class="mb20">
|
|
||||||
<el-form-item label="审核人id" prop="checkUserId">
|
|
||||||
<el-input v-model="form.checkUserId" placeholder="请输入审核人id" />
|
|
||||||
</el-form-item>
|
|
||||||
</el-col>
|
|
||||||
|
|
||||||
<el-col :span="12" class="mb20">
|
|
||||||
<el-form-item label="1审核中 2通过 3驳回 4" prop="checkStatus">
|
|
||||||
<el-select v-model="form.checkStatus" placeholder="请选择1审核中 2通过 3驳回 4">
|
|
||||||
<el-option :value="item.value" :label="item.label" v-for="(item, index) in check_status" :key="index"></el-option>
|
|
||||||
</el-select>
|
</el-select>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
</el-col>
|
</el-col>
|
||||||
|
|
||||||
<el-col :span="12" class="mb20">
|
<el-col :span="12" class="mb20">
|
||||||
<el-form-item label="创建人" prop="creator">
|
<el-form-item label="餐次类型" prop="mealType">
|
||||||
<el-input v-model="form.creator" placeholder="请输入创建人" />
|
<el-select v-model="form.mealType" placeholder="请选择餐次类型" @change="onMealTypeChange">
|
||||||
|
<el-option label="早餐(07:00-09:00)" value="1" />
|
||||||
|
<el-option label="中餐(11:30-13:30)" value="2" />
|
||||||
|
<el-option label="晚餐(17:30-19:30)" value="3" />
|
||||||
|
</el-select>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
</el-col>
|
</el-col>
|
||||||
|
|
||||||
<el-col :span="12" class="mb20">
|
|
||||||
<el-form-item label="更新人" prop="updater">
|
|
||||||
<el-input v-model="form.updater" placeholder="请输入更新人" />
|
|
||||||
</el-form-item>
|
|
||||||
</el-col>
|
|
||||||
|
|
||||||
<el-col :span="12" class="mb20">
|
|
||||||
<el-form-item label="是否删除" prop="deleted">
|
|
||||||
<el-input v-model="form.deleted" placeholder="请输入是否删除" />
|
|
||||||
</el-form-item>
|
|
||||||
</el-col>
|
|
||||||
|
|
||||||
<el-col :span="12" class="mb20">
|
<el-col :span="12" class="mb20">
|
||||||
<el-form-item label="预约日期" prop="bookingDate">
|
<el-form-item label="预约日期" prop="bookingDate">
|
||||||
<el-input v-model="form.bookingDate" placeholder="请输入预约日期" />
|
<el-date-picker
|
||||||
|
v-model="form.bookingDate"
|
||||||
|
type="date"
|
||||||
|
placeholder="请选择预约日期"
|
||||||
|
format="YYYY-MM-DD"
|
||||||
|
value-format="YYYY-MM-DD"
|
||||||
|
:disabled-date="disabledDate"
|
||||||
|
/>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
</el-col>
|
</el-col>
|
||||||
|
|
||||||
<el-col :span="12" class="mb20">
|
<el-col :span="12" class="mb20">
|
||||||
<el-form-item label="用户id" prop="userId">
|
<el-form-item label="预约人数" prop="bookingPeople">
|
||||||
<el-input v-model="form.userId" placeholder="请输入用户id" />
|
<el-input-number v-model="form.bookingPeople" :min="1" :max="20" placeholder="请输入预约人数" />
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
</el-col>
|
</el-col>
|
||||||
|
|
||||||
<el-col :span="12" class="mb20">
|
<el-col :span="12" class="mb20">
|
||||||
<el-form-item label="预约状态(0 预约成功,1预约失败 2取消预约 )" prop="status">
|
<el-form-item label="开始时间" prop="startTime">
|
||||||
<el-select v-model="form.status" placeholder="请选择预约状态(0 预约成功,1预约失败 2取消预约 )">
|
<el-time-select
|
||||||
<el-option label="??" :value="0" />
|
v-model="form.startTime"
|
||||||
<el-option label="??" :value="1" />
|
placeholder="请选择开始时间"
|
||||||
</el-select>
|
:disabled="!form.mealType || !form.bookingDate"
|
||||||
|
:selectable-range="getSelectableTimeRange()"
|
||||||
|
:step="30"
|
||||||
|
format="HH:mm"
|
||||||
|
value-format="HH:mm"
|
||||||
|
/>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
</el-col>
|
</el-col>
|
||||||
|
|
||||||
<el-col :span="12" class="mb20">
|
<el-col :span="12" class="mb20">
|
||||||
<el-form-item label="总价单位分" prop="totalPrice">
|
<el-form-item label="结束时间" prop="endTime">
|
||||||
<el-input v-model="form.totalPrice" placeholder="请输入总价单位分" />
|
<el-time-select
|
||||||
|
v-model="form.endTime"
|
||||||
|
placeholder="请选择结束时间"
|
||||||
|
:disabled="!form.startTime"
|
||||||
|
:selectable-range="getSelectableTimeRange()"
|
||||||
|
:step="30"
|
||||||
|
format="HH:mm"
|
||||||
|
value-format="HH:mm"
|
||||||
|
/>
|
||||||
|
</el-form-item>
|
||||||
|
</el-col>
|
||||||
|
<el-col :span="24" class="mb20">
|
||||||
|
<el-form-item label="备注" prop="remark">
|
||||||
|
<el-input type="textarea" v-model="form.remark" placeholder="请输入备注信息" :rows="3" />
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
</el-col>
|
</el-col>
|
||||||
</el-row>
|
</el-row>
|
||||||
|
|
||||||
|
<!-- 时间段选择区域 -->
|
||||||
|
<div v-if="form.boxesId && form.mealType && form.bookingDate" class="time-slot-section">
|
||||||
|
<el-divider content-position="left">可用时间段</el-divider>
|
||||||
|
<div class="time-slots">
|
||||||
|
<div v-for="slot in availableTimeSlots" :key="slot.startTime" class="time-slot-item">
|
||||||
|
<el-button
|
||||||
|
:type="isTimeSlotSelected(slot) ? 'success' : 'primary'"
|
||||||
|
:plain="!isTimeSlotSelected(slot)"
|
||||||
|
size="small"
|
||||||
|
@click="toggleTimeSlot(slot)"
|
||||||
|
:disabled="slot.status === 'booked'"
|
||||||
|
>
|
||||||
|
{{ slot.startTime }} - {{ slot.endTime }}
|
||||||
|
<el-tag v-if="slot.status === 'booked'" type="danger" size="small">已预约</el-tag>
|
||||||
|
</el-button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
</el-form>
|
</el-form>
|
||||||
<template #footer>
|
<template #footer>
|
||||||
<span class="dialog-footer">
|
<span class="dialog-footer">
|
||||||
@@ -93,6 +110,7 @@
|
|||||||
import { useDict } from '/@/hooks/dict';
|
import { useDict } from '/@/hooks/dict';
|
||||||
import { useMessage } from '/@/hooks/message';
|
import { useMessage } from '/@/hooks/message';
|
||||||
import { getObj, addObj, putObj } from '/@/api/canteen/boxesBooking';
|
import { getObj, addObj, putObj } from '/@/api/canteen/boxesBooking';
|
||||||
|
import { fetchList as fetchTableList } from '/@/api/canteen/boxesInfo';
|
||||||
import { rule } from '/@/utils/validate';
|
import { rule } from '/@/utils/validate';
|
||||||
const emit = defineEmits(['refresh']);
|
const emit = defineEmits(['refresh']);
|
||||||
|
|
||||||
@@ -100,40 +118,170 @@ const emit = defineEmits(['refresh']);
|
|||||||
const dataFormRef = ref();
|
const dataFormRef = ref();
|
||||||
const visible = ref(false);
|
const visible = ref(false);
|
||||||
const loading = ref(false);
|
const loading = ref(false);
|
||||||
// 定义字典
|
const tableList = ref<any[]>([]);
|
||||||
const { check_status } = useDict('check_status');
|
const availableTimeSlots = ref<any[]>([]);
|
||||||
|
const selectedTimeSlots = ref<any[]>([]);
|
||||||
|
|
||||||
// 提交表单数据
|
// 提交表单数据
|
||||||
const form = reactive({
|
const form = reactive({
|
||||||
id: '',
|
id: '',
|
||||||
|
merchantId: '',
|
||||||
boxesId: '',
|
boxesId: '',
|
||||||
|
mealType: '',
|
||||||
|
bookingDate: '',
|
||||||
startTime: '',
|
startTime: '',
|
||||||
endTime: '',
|
endTime: '',
|
||||||
checkUserId: '',
|
bookingPeople: 1,
|
||||||
checkStatus: '',
|
remark: '',
|
||||||
creator: '',
|
status: '0',
|
||||||
updater: '',
|
|
||||||
deleted: '',
|
|
||||||
bookingDate: '',
|
|
||||||
userId: '',
|
|
||||||
status: '',
|
|
||||||
totalPrice: '',
|
|
||||||
});
|
});
|
||||||
|
|
||||||
// 定义校验规则
|
// 定义校验规则
|
||||||
const dataRules = ref({});
|
const dataRules = ref({
|
||||||
|
merchantId: [{ required: true, message: '商户不能为空', trigger: 'change' }],
|
||||||
|
boxesId: [{ required: true, message: '餐桌不能为空', trigger: 'change' }],
|
||||||
|
mealType: [{ required: true, message: '餐次类型不能为空', trigger: 'change' }],
|
||||||
|
bookingDate: [{ required: true, message: '预约日期不能为空', trigger: 'change' }],
|
||||||
|
startTime: [{ required: true, message: '开始时间不能为空', trigger: 'change' }],
|
||||||
|
endTime: [{ required: true, message: '结束时间不能为空', trigger: 'change' }],
|
||||||
|
bookingPeople: [{ required: true, message: '预约人数不能为空', trigger: 'blur' }],
|
||||||
|
});
|
||||||
|
|
||||||
|
// 禁用过去的日期
|
||||||
|
const disabledDate = (time: Date) => {
|
||||||
|
return time.getTime() < Date.now() - 8.64e7;
|
||||||
|
};
|
||||||
|
|
||||||
|
// 获取可选时间范围
|
||||||
|
const getSelectableTimeRange = () => {
|
||||||
|
switch (form.mealType) {
|
||||||
|
case '1': return '07:00:00,09:00:00'; // 早餐
|
||||||
|
case '2': return '11:30:00,13:30:00'; // 中餐
|
||||||
|
case '3': return '17:30:00,19:30:00'; // 晚餐
|
||||||
|
default: return '00:00:00,23:59:59';
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
// 商户变化时加载餐桌列表
|
||||||
|
const onMerchantChange = async (merchantId: string) => {
|
||||||
|
if (merchantId) {
|
||||||
|
try {
|
||||||
|
const res = await fetchTableList({ merchantId, status: '0' });
|
||||||
|
tableList.value = res.data?.records || [];
|
||||||
|
} catch (error) {
|
||||||
|
console.error('加载餐桌列表失败:', error);
|
||||||
|
}
|
||||||
|
} else {
|
||||||
|
tableList.value = [];
|
||||||
|
}
|
||||||
|
form.boxesId = '';
|
||||||
|
};
|
||||||
|
|
||||||
|
// 餐次类型变化时重置时间
|
||||||
|
const onMealTypeChange = () => {
|
||||||
|
form.startTime = '';
|
||||||
|
form.endTime = '';
|
||||||
|
selectedTimeSlots.value = [];
|
||||||
|
};
|
||||||
|
|
||||||
|
// 检查时间段是否被选中
|
||||||
|
const isTimeSlotSelected = (slot: any) => {
|
||||||
|
return selectedTimeSlots.value.some(selected =>
|
||||||
|
selected.startTime === slot.startTime && selected.endTime === slot.endTime
|
||||||
|
);
|
||||||
|
};
|
||||||
|
|
||||||
|
// 切换时间段选择
|
||||||
|
const toggleTimeSlot = (slot: any) => {
|
||||||
|
if (slot.status === 'booked') return;
|
||||||
|
|
||||||
|
const isSelected = isTimeSlotSelected(slot);
|
||||||
|
if (isSelected) {
|
||||||
|
selectedTimeSlots.value = selectedTimeSlots.value.filter(selected =>
|
||||||
|
!(selected.startTime === slot.startTime && selected.endTime === slot.endTime)
|
||||||
|
);
|
||||||
|
} else {
|
||||||
|
selectedTimeSlots.value.push(slot);
|
||||||
|
}
|
||||||
|
|
||||||
|
// 自动填充开始和结束时间
|
||||||
|
if (selectedTimeSlots.value.length > 0) {
|
||||||
|
const sortedSlots = selectedTimeSlots.value.sort((a, b) => a.startTime.localeCompare(b.startTime));
|
||||||
|
form.startTime = sortedSlots[0].startTime;
|
||||||
|
form.endTime = sortedSlots[sortedSlots.value.length - 1].endTime;
|
||||||
|
} else {
|
||||||
|
form.startTime = '';
|
||||||
|
form.endTime = '';
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
// 生成可用时间段
|
||||||
|
const generateTimeSlots = () => {
|
||||||
|
const slots = [];
|
||||||
|
let startHour, endHour;
|
||||||
|
|
||||||
|
switch (form.mealType) {
|
||||||
|
case '1': // 早餐
|
||||||
|
startHour = 7;
|
||||||
|
endHour = 9;
|
||||||
|
break;
|
||||||
|
case '2': // 中餐
|
||||||
|
startHour = 11.5;
|
||||||
|
endHour = 13.5;
|
||||||
|
break;
|
||||||
|
case '3': // 晚餐
|
||||||
|
startHour = 17.5;
|
||||||
|
endHour = 19.5;
|
||||||
|
break;
|
||||||
|
default:
|
||||||
|
return [];
|
||||||
|
}
|
||||||
|
|
||||||
|
for (let hour = startHour; hour < endHour; hour += 0.5) {
|
||||||
|
const startTime = `${Math.floor(hour).toString().padStart(2, '0')}:${(hour % 1 === 0.5 ? '30' : '00')}`;
|
||||||
|
const endTime = `${Math.floor(hour + 0.5).toString().padStart(2, '0')}:${((hour + 0.5) % 1 === 0.5 ? '30' : '00')}`;
|
||||||
|
|
||||||
|
slots.push({
|
||||||
|
startTime,
|
||||||
|
endTime,
|
||||||
|
status: 'available'
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
availableTimeSlots.value = slots;
|
||||||
|
};
|
||||||
|
|
||||||
|
// 监听表单变化
|
||||||
|
watch([() => form.boxesId, () => form.mealType, () => form.bookingDate], () => {
|
||||||
|
if (form.boxesId && form.mealType && form.bookingDate) {
|
||||||
|
generateTimeSlots();
|
||||||
|
// 这里可以调用API获取实际的时间段状态
|
||||||
|
// fetchTimeSlotStatus();
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
// 打开弹窗
|
// 打开弹窗
|
||||||
const openDialog = (id: string) => {
|
const openDialog = (id: string) => {
|
||||||
visible.value = true;
|
visible.value = true;
|
||||||
form.id = '';
|
form.id = '';
|
||||||
|
form.merchantId = '';
|
||||||
|
form.boxesId = '';
|
||||||
|
form.mealType = '';
|
||||||
|
form.bookingDate = '';
|
||||||
|
form.startTime = '';
|
||||||
|
form.endTime = '';
|
||||||
|
form.bookingPeople = 1;
|
||||||
|
form.remark = '';
|
||||||
|
selectedTimeSlots.value = [];
|
||||||
|
availableTimeSlots.value = [];
|
||||||
|
tableList.value = [];
|
||||||
|
|
||||||
// 重置表单数据
|
// 重置表单数据
|
||||||
nextTick(() => {
|
nextTick(() => {
|
||||||
dataFormRef.value?.resetFields();
|
dataFormRef.value?.resetFields();
|
||||||
});
|
});
|
||||||
|
|
||||||
// 获取boxesBooking信息
|
// 获取预约信息
|
||||||
if (id) {
|
if (id) {
|
||||||
form.id = id;
|
form.id = id;
|
||||||
getboxesBookingData(id);
|
getboxesBookingData(id);
|
||||||
@@ -160,11 +308,14 @@ const onSubmit = async () => {
|
|||||||
|
|
||||||
// 初始化表单数据
|
// 初始化表单数据
|
||||||
const getboxesBookingData = (id: string) => {
|
const getboxesBookingData = (id: string) => {
|
||||||
// 获取数据
|
|
||||||
loading.value = true;
|
loading.value = true;
|
||||||
getObj(id)
|
getObj(id)
|
||||||
.then((res: any) => {
|
.then((res: any) => {
|
||||||
Object.assign(form, res.data);
|
Object.assign(form, res.data);
|
||||||
|
// 加载餐桌列表
|
||||||
|
if (form.merchantId) {
|
||||||
|
onMerchantChange(form.merchantId);
|
||||||
|
}
|
||||||
})
|
})
|
||||||
.finally(() => {
|
.finally(() => {
|
||||||
loading.value = false;
|
loading.value = false;
|
||||||
@@ -176,3 +327,22 @@ defineExpose({
|
|||||||
openDialog,
|
openDialog,
|
||||||
});
|
});
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
|
<style scoped>
|
||||||
|
.time-slot-section {
|
||||||
|
margin-top: 20px;
|
||||||
|
padding: 20px;
|
||||||
|
background: #f5f7fa;
|
||||||
|
border-radius: 8px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.time-slots {
|
||||||
|
display: flex;
|
||||||
|
flex-wrap: wrap;
|
||||||
|
gap: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.time-slot-item {
|
||||||
|
margin-bottom: 10px;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@@ -3,11 +3,31 @@
|
|||||||
<div class="layout-padding-auto layout-padding-view">
|
<div class="layout-padding-auto layout-padding-view">
|
||||||
<el-row v-show="showSearch">
|
<el-row v-show="showSearch">
|
||||||
<el-form :model="state.queryForm" ref="queryRef" :inline="true" @keyup.enter="getDataList">
|
<el-form :model="state.queryForm" ref="queryRef" :inline="true" @keyup.enter="getDataList">
|
||||||
<el-form-item label="餐桌" prop="boxesName">
|
<el-form-item label="餐桌名称" prop="tableName">
|
||||||
<el-input placeholder="请输入餐桌" v-model="state.queryForm.boxesName" />
|
<el-input placeholder="请输入餐桌名称" v-model="state.queryForm.tableName" />
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item label="用户" prop="userId">
|
<el-form-item label="餐次类型" prop="mealType">
|
||||||
<el-input placeholder="请输入用户" v-model="state.queryForm.userName" />
|
<el-select v-model="state.queryForm.mealType" placeholder="请选择餐次类型" clearable>
|
||||||
|
<el-option label="早餐" value="1" />
|
||||||
|
<el-option label="中餐" value="2" />
|
||||||
|
<el-option label="晚餐" value="3" />
|
||||||
|
</el-select>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="预约日期" prop="bookingDate">
|
||||||
|
<el-date-picker
|
||||||
|
v-model="state.queryForm.bookingDate"
|
||||||
|
type="date"
|
||||||
|
placeholder="请选择预约日期"
|
||||||
|
format="YYYY-MM-DD"
|
||||||
|
value-format="YYYY-MM-DD"
|
||||||
|
/>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="预约状态" prop="status">
|
||||||
|
<el-select v-model="state.queryForm.status" placeholder="请选择预约状态" clearable>
|
||||||
|
<el-option label="预约成功" value="0" />
|
||||||
|
<el-option label="预约失败" value="1" />
|
||||||
|
<el-option label="取消预约" value="2" />
|
||||||
|
</el-select>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item>
|
<el-form-item>
|
||||||
<el-button icon="search" type="primary" @click="getDataList">查询</el-button>
|
<el-button icon="search" type="primary" @click="getDataList">查询</el-button>
|
||||||
@@ -52,32 +72,48 @@
|
|||||||
<el-table-column type="selection" width="40" align="center" />
|
<el-table-column type="selection" width="40" align="center" />
|
||||||
<el-table-column type="index" label="#" width="50" />
|
<el-table-column type="index" label="#" width="50" />
|
||||||
<el-table-column prop="boxesName" label="餐桌名称" show-overflow-tooltip />
|
<el-table-column prop="boxesName" label="餐桌名称" show-overflow-tooltip />
|
||||||
<el-table-column prop="startTime" label="开始时间" show-overflow-tooltip min-width="160" />
|
<el-table-column prop="mealName" label="餐次类型" show-overflow-tooltip>
|
||||||
<el-table-column prop="endTime" label="结束时间" show-overflow-tooltip min-width="160" />
|
|
||||||
<el-table-column prop="checkStatus" label="审核状态" show-overflow-tooltip min-width="160">
|
</el-table-column>
|
||||||
|
<el-table-column prop="userName" label="预约人" show-overflow-tooltip />
|
||||||
|
<!-- <el-table-column prop="mealType" label="餐次类型" show-overflow-tooltip>-->
|
||||||
|
<!-- <template #default="scope">-->
|
||||||
|
<!-- <el-tag v-if="scope.row.mealType === '1'" type="success">早餐</el-tag>-->
|
||||||
|
<!-- <el-tag v-else-if="scope.row.mealType === '2'" type="warning">中餐</el-tag>-->
|
||||||
|
<!-- <el-tag v-else-if="scope.row.mealType === '3'" type="info">晚餐</el-tag>-->
|
||||||
|
<!-- <el-tag v-else type="info">-</el-tag>-->
|
||||||
|
<!-- </template>-->
|
||||||
|
<!-- </el-table-column>-->
|
||||||
|
<el-table-column prop="bookingDate" label="预约日期" show-overflow-tooltip />
|
||||||
|
<el-table-column prop="createTime" label="预约时间" show-overflow-tooltip />
|
||||||
|
<!-- <el-table-column prop="startTime" label="开始时间" show-overflow-tooltip />-->
|
||||||
|
<!-- <el-table-column prop="endTime" label="结束时间" show-overflow-tooltip />-->
|
||||||
|
<!-- <el-table-column prop="bookingPeople" label="预约人数" show-overflow-tooltip />-->
|
||||||
|
<!-- <el-table-column prop="remark" label="备注" show-overflow-tooltip />-->
|
||||||
|
<el-table-column prop="status" label="预约状态" show-overflow-tooltip>
|
||||||
<template #default="scope">
|
<template #default="scope">
|
||||||
<dict-tag :options="check_status" :value="scope.row.checkStatus"></dict-tag>
|
<el-tag v-if="scope.row.status === 0" type="success">预约成功</el-tag>
|
||||||
</template>
|
<el-tag v-else-if="scope.row.status === 1" type="danger">预约失败</el-tag>
|
||||||
</el-table-column>
|
<el-tag v-else-if="scope.row.status === 2" type="info">取消预约</el-tag>
|
||||||
<el-table-column prop="bookingDate" label="预约日期" show-overflow-tooltip min-width="160" />
|
<el-tag v-else type="info">-</el-tag>
|
||||||
<el-table-column prop="userName" label="用户" show-overflow-tooltip min-width="100" />
|
|
||||||
<el-table-column prop="createTime" label="创建时间" show-overflow-tooltip min-width="160" />
|
|
||||||
<el-table-column label="操作" width="150" fixed="right">
|
|
||||||
<template #default="scope">
|
|
||||||
<el-button
|
|
||||||
icon="edit-pen"
|
|
||||||
text
|
|
||||||
type="primary"
|
|
||||||
v-auth="'canteen_boxesBooking_edit'"
|
|
||||||
@click="formDialogRef.openDialog(scope.row.id)"
|
|
||||||
>
|
|
||||||
编辑
|
|
||||||
</el-button>
|
|
||||||
<el-button icon="delete" text type="primary" v-auth="'canteen_boxesBooking_del'" @click="handleDelete([scope.row.id])"
|
|
||||||
>删除</el-button
|
|
||||||
>
|
|
||||||
</template>
|
</template>
|
||||||
</el-table-column>
|
</el-table-column>
|
||||||
|
<!-- <el-table-column label="操作" width="150" fixed="right">-->
|
||||||
|
<!-- <template #default="scope">-->
|
||||||
|
<!-- <el-button-->
|
||||||
|
<!-- icon="edit-pen"-->
|
||||||
|
<!-- text-->
|
||||||
|
<!-- type="primary"-->
|
||||||
|
<!-- v-auth="'canteen_boxesBooking_edit'"-->
|
||||||
|
<!-- @click="formDialogRef.openDialog(scope.row.id)"-->
|
||||||
|
<!-- >-->
|
||||||
|
<!-- 编辑-->
|
||||||
|
<!-- </el-button>-->
|
||||||
|
<!-- <el-button icon="delete" text type="primary" v-auth="'canteen_boxesBooking_del'" @click="handleDelete([scope.row.id])"-->
|
||||||
|
<!-- >删除</el-button-->
|
||||||
|
<!-- >-->
|
||||||
|
<!-- </template>-->
|
||||||
|
<!-- </el-table-column>-->
|
||||||
</el-table>
|
</el-table>
|
||||||
<pagination @size-change="sizeChangeHandle" @current-change="currentChangeHandle" v-bind="state.pagination" />
|
<pagination @size-change="sizeChangeHandle" @current-change="currentChangeHandle" v-bind="state.pagination" />
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
@@ -1,45 +1,59 @@
|
|||||||
<template>
|
<template>
|
||||||
<el-dialog :title="form.id ? '编辑' : '新增'" v-model="visible" :close-on-click-modal="false" draggable>
|
<el-dialog :title="form.id ? '编辑' : '新增'" v-model="visible" :close-on-click-modal="false" draggable>
|
||||||
<el-form ref="dataFormRef" :model="form" :rules="dataRules" formDialogRef label-width="90px" v-loading="loading">
|
<el-form ref="dataFormRef" :model="form" :rules="dataRules" label-width="90px" v-loading="loading">
|
||||||
<el-row :gutter="24">
|
<el-row :gutter="24">
|
||||||
<el-col :span="14" class="mb20">
|
<el-col :span="12" class="mb20">
|
||||||
<el-form-item label="商户" prop="merchantId">
|
<el-form-item label="商户" prop="merchantId">
|
||||||
<select-mch v-model="form.merchantId" />
|
<select-mch v-model="form.merchantId" />
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
</el-col>
|
</el-col>
|
||||||
<el-col :span="14" class="mb20">
|
<el-col :span="12" class="mb20">
|
||||||
<el-form-item label="包厢名称" prop="name">
|
<el-form-item label="餐桌编号" prop="tableNumber">
|
||||||
<el-input v-model="form.name" placeholder="请输入包厢名称" />
|
<el-input v-model="form.tableNumber" placeholder="请输入餐桌编号" />
|
||||||
|
</el-form-item>
|
||||||
|
</el-col>
|
||||||
|
<el-col :span="12" class="mb20">
|
||||||
|
<el-form-item label="餐桌名称" prop="name">
|
||||||
|
<el-input v-model="form.name" placeholder="请输入餐桌名称" />
|
||||||
|
</el-form-item>
|
||||||
|
</el-col>
|
||||||
|
<el-col :span="12" class="mb20">
|
||||||
|
<el-form-item label="餐桌类型" prop="tableType">
|
||||||
|
<el-select v-model="form.tableType" placeholder="请选择餐桌类型">
|
||||||
|
<el-option label="小桌(2-4人)" value="1" />
|
||||||
|
<el-option label="中桌(4-6人)" value="2" />
|
||||||
|
<el-option label="大桌(6-8人)" value="3" />
|
||||||
|
<el-option label="包间(8人以上)" value="4" />
|
||||||
|
</el-select>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
</el-col>
|
</el-col>
|
||||||
<el-col :span="24" class="mb20">
|
<el-col :span="24" class="mb20">
|
||||||
<el-form-item label="包厢图片" prop="images">
|
<el-form-item label="餐桌图片" prop="images">
|
||||||
<upload-img v-model:imageUrl="form.images"></upload-img>
|
<upload-img v-model:imageUrl="form.images"></upload-img>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
</el-col>
|
</el-col>
|
||||||
<el-col :span="14" class="mb20">
|
<el-col :span="12" class="mb20">
|
||||||
<el-form-item label="容纳人数" prop="capacity">
|
<el-form-item label="容纳人数" prop="capacity">
|
||||||
<el-input v-model="form.capacity" placeholder="请输入容纳人数" />
|
<el-input v-model="form.capacity" placeholder="请输入容纳人数" />
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
</el-col>
|
</el-col>
|
||||||
|
|
||||||
<el-col :span="24" class="mb20">
|
<el-col :span="24" class="mb20">
|
||||||
<el-form-item label="包厢状态" prop="status">
|
<el-form-item label="餐桌状态" prop="status">
|
||||||
<el-radio-group v-model="form.status">
|
<el-radio-group v-model="form.status">
|
||||||
<el-radio :label="item.value" v-for="(item, index) in boxes_status" border :key="index">{{ item.label }} </el-radio>
|
<el-radio :label="item.value" v-for="(item, index) in boxes_status" border :key="index">{{ item.label }} </el-radio>
|
||||||
</el-radio-group>
|
</el-radio-group>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
</el-col>
|
</el-col>
|
||||||
<el-col :span="24" class="mb20">
|
<el-col :span="24" class="mb20">
|
||||||
<el-form-item label="包厢地址" prop="address">
|
<el-form-item label="餐桌摆放形式" prop="address">
|
||||||
<el-input type="textarea" v-model="form.address" placeholder="请输入包厢地址" />
|
<el-input type="textarea" v-model="form.address" placeholder="请输入餐桌摆放形式" />
|
||||||
</el-form-item>
|
|
||||||
</el-col>
|
|
||||||
<el-col :span="24" class="mb20">
|
|
||||||
<el-form-item label="包厢描述" prop="description">
|
|
||||||
<editor v-if="visible" v-model:get-html="form.description" placeholder="请输入包厢描述"></editor>
|
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
</el-col>
|
</el-col>
|
||||||
|
<!-- <el-col :span="24" class="mb20">-->
|
||||||
|
<!-- <el-form-item label="餐桌描述" prop="description">-->
|
||||||
|
<!-- <editor v-if="visible" v-model:get-html="form.description" placeholder="请输入餐桌描述"></editor>-->
|
||||||
|
<!-- </el-form-item>-->
|
||||||
|
<!-- </el-col>-->
|
||||||
</el-row>
|
</el-row>
|
||||||
</el-form>
|
</el-form>
|
||||||
<template #footer>
|
<template #footer>
|
||||||
@@ -52,6 +66,7 @@
|
|||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script setup lang="ts" name="BoxesInfoDialog">
|
<script setup lang="ts" name="BoxesInfoDialog">
|
||||||
|
import { ref, reactive, nextTick } from 'vue';
|
||||||
import { useDict } from '/@/hooks/dict';
|
import { useDict } from '/@/hooks/dict';
|
||||||
import { useMessage } from '/@/hooks/message';
|
import { useMessage } from '/@/hooks/message';
|
||||||
import { getObj, addObj, putObj } from '/@/api/canteen/boxesInfo';
|
import { getObj, addObj, putObj } from '/@/api/canteen/boxesInfo';
|
||||||
@@ -68,7 +83,9 @@ const { boxes_status } = useDict('boxes_status');
|
|||||||
// 提交表单数据
|
// 提交表单数据
|
||||||
const form = reactive({
|
const form = reactive({
|
||||||
id: '',
|
id: '',
|
||||||
|
tableNumber: '',
|
||||||
name: '',
|
name: '',
|
||||||
|
tableType: '',
|
||||||
capacity: '',
|
capacity: '',
|
||||||
description: '',
|
description: '',
|
||||||
address: '',
|
address: '',
|
||||||
@@ -80,23 +97,32 @@ const form = reactive({
|
|||||||
// 定义校验规则
|
// 定义校验规则
|
||||||
const dataRules = ref({
|
const dataRules = ref({
|
||||||
merchantId: [{ required: true, message: '商户不能为空', trigger: 'blur' }],
|
merchantId: [{ required: true, message: '商户不能为空', trigger: 'blur' }],
|
||||||
name: [{ required: true, message: '包厢名称不能为空', trigger: 'blur' }],
|
tableNumber: [{ required: true, message: '餐桌编号不能为空', trigger: 'blur' }],
|
||||||
|
name: [{ required: true, message: '餐桌名称不能为空', trigger: 'blur' }],
|
||||||
|
tableType: [{ required: true, message: '餐桌类型不能为空', trigger: 'change' }],
|
||||||
capacity: [
|
capacity: [
|
||||||
{ required: true, message: '容纳人数不能为空', trigger: 'blur' },
|
{ required: true, message: '容纳人数不能为空', trigger: 'blur' },
|
||||||
{ validator: rule.number, trigger: 'blur' },
|
{ validator: rule.number, trigger: 'blur' },
|
||||||
],
|
],
|
||||||
images: [{ required: true, message: '包厢图片不能为空', trigger: 'blur' }],
|
// 图片字段暂时不设为必填,方便测试
|
||||||
|
// images: [{ required: true, message: '餐桌图片不能为空', trigger: 'blur' }],
|
||||||
});
|
});
|
||||||
|
|
||||||
// 打开弹窗
|
// 打开弹窗
|
||||||
const openDialog = (id: string) => {
|
const openDialog = (id: string) => {
|
||||||
visible.value = true;
|
visible.value = true;
|
||||||
form.id = '';
|
|
||||||
|
|
||||||
// 重置表单数据
|
// 重置表单数据
|
||||||
nextTick(() => {
|
form.id = '';
|
||||||
dataFormRef.value?.resetFields();
|
form.tableNumber = '';
|
||||||
});
|
form.name = '';
|
||||||
|
form.tableType = '';
|
||||||
|
form.capacity = '';
|
||||||
|
form.description = '';
|
||||||
|
form.address = '';
|
||||||
|
form.images = '';
|
||||||
|
form.status = '0';
|
||||||
|
form.merchantId = '';
|
||||||
|
|
||||||
// 获取boxesInfo信息
|
// 获取boxesInfo信息
|
||||||
if (id) {
|
if (id) {
|
||||||
@@ -112,12 +138,23 @@ const onSubmit = async () => {
|
|||||||
|
|
||||||
try {
|
try {
|
||||||
loading.value = true;
|
loading.value = true;
|
||||||
form.id ? await putObj(form) : await addObj(form);
|
|
||||||
|
// 准备提交数据
|
||||||
|
const submitData = {
|
||||||
|
...form,
|
||||||
|
// 确保数据类型正确
|
||||||
|
tableType: form.tableType ? Number(form.tableType) : undefined,
|
||||||
|
capacity: form.capacity ? Number(form.capacity) : undefined,
|
||||||
|
status: form.status ? Number(form.status) : 0
|
||||||
|
};
|
||||||
|
|
||||||
|
const result = form.id ? await putObj(submitData) : await addObj(submitData);
|
||||||
|
|
||||||
useMessage().success(form.id ? '修改成功' : '添加成功');
|
useMessage().success(form.id ? '修改成功' : '添加成功');
|
||||||
visible.value = false;
|
visible.value = false;
|
||||||
emit('refresh');
|
emit('refresh');
|
||||||
} catch (err: any) {
|
} catch (err: any) {
|
||||||
useMessage().error(err.msg);
|
useMessage().error(err.msg || err.message || '操作失败');
|
||||||
} finally {
|
} finally {
|
||||||
loading.value = false;
|
loading.value = false;
|
||||||
}
|
}
|
||||||
@@ -129,9 +166,19 @@ const getboxesInfoData = (id: string) => {
|
|||||||
loading.value = true;
|
loading.value = true;
|
||||||
getObj(id)
|
getObj(id)
|
||||||
.then((res: any) => {
|
.then((res: any) => {
|
||||||
Object.assign(form, res.data, {
|
if (res.data) {
|
||||||
status: '' + res.data.status,
|
// 确保数据类型正确
|
||||||
});
|
form.id = res.data.id || '';
|
||||||
|
form.tableNumber = res.data.tableNumber || '';
|
||||||
|
form.name = res.data.name || '';
|
||||||
|
form.tableType = res.data.tableType ? String(res.data.tableType) : '';
|
||||||
|
form.capacity = res.data.capacity || '';
|
||||||
|
form.description = res.data.description || '';
|
||||||
|
form.address = res.data.address || '';
|
||||||
|
form.images = res.data.images || '';
|
||||||
|
form.status = res.data.status ? String(res.data.status) : '0';
|
||||||
|
form.merchantId = res.data.merchantId || '';
|
||||||
|
}
|
||||||
})
|
})
|
||||||
.finally(() => {
|
.finally(() => {
|
||||||
loading.value = false;
|
loading.value = false;
|
||||||
|
|||||||
@@ -3,9 +3,20 @@
|
|||||||
<div class="layout-padding-auto layout-padding-view">
|
<div class="layout-padding-auto layout-padding-view">
|
||||||
<el-row v-show="showSearch">
|
<el-row v-show="showSearch">
|
||||||
<el-form :model="state.queryForm" ref="queryRef" :inline="true" @keyup.enter="getDataList">
|
<el-form :model="state.queryForm" ref="queryRef" :inline="true" @keyup.enter="getDataList">
|
||||||
|
<el-form-item label="餐桌编号" prop="tableNumber">
|
||||||
|
<el-input placeholder="请输入餐桌编号" v-model="state.queryForm.tableNumber" />
|
||||||
|
</el-form-item>
|
||||||
<el-form-item label="餐桌名称" prop="name">
|
<el-form-item label="餐桌名称" prop="name">
|
||||||
<el-input placeholder="请输入餐桌名称" v-model="state.queryForm.name" />
|
<el-input placeholder="请输入餐桌名称" v-model="state.queryForm.name" />
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
|
<el-form-item label="餐桌类型" prop="tableType">
|
||||||
|
<el-select v-model="state.queryForm.tableType" placeholder="请选择餐桌类型" clearable>
|
||||||
|
<el-option label="小桌(2-4人)" value="1" />
|
||||||
|
<el-option label="中桌(4-6人)" value="2" />
|
||||||
|
<el-option label="大桌(6-8人)" value="3" />
|
||||||
|
<el-option label="包间(8人以上)" value="4" />
|
||||||
|
</el-select>
|
||||||
|
</el-form-item>
|
||||||
<el-form-item>
|
<el-form-item>
|
||||||
<el-button icon="search" type="primary" @click="getDataList">查询</el-button>
|
<el-button icon="search" type="primary" @click="getDataList">查询</el-button>
|
||||||
<el-button icon="Refresh" @click="resetQuery">重置</el-button>
|
<el-button icon="Refresh" @click="resetQuery">重置</el-button>
|
||||||
@@ -14,7 +25,7 @@
|
|||||||
</el-row>
|
</el-row>
|
||||||
<el-row>
|
<el-row>
|
||||||
<div class="mb8" style="width: 100%">
|
<div class="mb8" style="width: 100%">
|
||||||
<el-button icon="folder-add" type="primary" class="ml10" @click="formDialogRef.openDialog()" v-auth="'canteen_boxesInfo_add'">
|
<el-button icon="folder-add" type="primary" class="ml10" @click="handleAdd" v-auth="'canteen_boxesInfo_add'">
|
||||||
新 增
|
新 增
|
||||||
</el-button>
|
</el-button>
|
||||||
<el-button
|
<el-button
|
||||||
@@ -27,7 +38,7 @@
|
|||||||
>
|
>
|
||||||
删 除
|
删 除
|
||||||
</el-button>
|
</el-button>
|
||||||
<el-button plain type="primary" @click="showList = false">排期详情</el-button>
|
<!-- <el-button plain type="primary" @click="showList = false">排期详情</el-button>-->
|
||||||
<right-toolbar
|
<right-toolbar
|
||||||
v-model:showSearch="showSearch"
|
v-model:showSearch="showSearch"
|
||||||
:export="'canteen_boxesInfo_export'"
|
:export="'canteen_boxesInfo_export'"
|
||||||
@@ -38,6 +49,7 @@
|
|||||||
></right-toolbar>
|
></right-toolbar>
|
||||||
</div>
|
</div>
|
||||||
</el-row>
|
</el-row>
|
||||||
|
|
||||||
<el-table
|
<el-table
|
||||||
:data="state.dataList"
|
:data="state.dataList"
|
||||||
v-loading="state.loading"
|
v-loading="state.loading"
|
||||||
@@ -49,7 +61,17 @@
|
|||||||
>
|
>
|
||||||
<el-table-column type="selection" width="40" align="center" />
|
<el-table-column type="selection" width="40" align="center" />
|
||||||
<el-table-column type="index" label="#" width="50" />
|
<el-table-column type="index" label="#" width="50" />
|
||||||
|
<el-table-column prop="tableNumber" label="餐桌编号" show-overflow-tooltip />
|
||||||
<el-table-column prop="name" label="餐桌名称" show-overflow-tooltip />
|
<el-table-column prop="name" label="餐桌名称" show-overflow-tooltip />
|
||||||
|
<el-table-column prop="tableType" label="餐桌类型" show-overflow-tooltip>
|
||||||
|
<template #default="scope">
|
||||||
|
<el-tag v-if="scope.row.tableType === '1' || scope.row.tableType === 1" type="success">小桌(2-4人)</el-tag>
|
||||||
|
<el-tag v-else-if="scope.row.tableType === '2' || scope.row.tableType === 2" type="warning">中桌(4-6人)</el-tag>
|
||||||
|
<el-tag v-else-if="scope.row.tableType === '3' || scope.row.tableType === 3" type="info">大桌(6-8人)</el-tag>
|
||||||
|
<el-tag v-else-if="scope.row.tableType === '4' || scope.row.tableType === 4" type="danger">包间(8人以上)</el-tag>
|
||||||
|
<el-tag v-else type="info">{{ scope.row.tableType || '-' }}</el-tag>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
<el-table-column prop="capacity" label="容纳人数" show-overflow-tooltip />
|
<el-table-column prop="capacity" label="容纳人数" show-overflow-tooltip />
|
||||||
<el-table-column prop="description" label="餐桌描述" show-overflow-tooltip />
|
<el-table-column prop="description" label="餐桌描述" show-overflow-tooltip />
|
||||||
<el-table-column prop="address" label="餐桌摆放样式" show-overflow-tooltip />
|
<el-table-column prop="address" label="餐桌摆放样式" show-overflow-tooltip />
|
||||||
@@ -156,4 +178,9 @@ const handleDelete = async (ids: string[]) => {
|
|||||||
useMessage().error(err.msg)
|
useMessage().error(err.msg)
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// 新增操作
|
||||||
|
const handleAdd = () => {
|
||||||
|
formDialogRef.value?.openDialog();
|
||||||
|
}
|
||||||
</script>
|
</script>
|
||||||
@@ -62,6 +62,7 @@
|
|||||||
<el-form-item>
|
<el-form-item>
|
||||||
<el-button icon="search" type="primary" @click="getDataList">查询</el-button>
|
<el-button icon="search" type="primary" @click="getDataList">查询</el-button>
|
||||||
<el-button icon="Refresh" @click="resetQuery">重置</el-button>
|
<el-button icon="Refresh" @click="resetQuery">重置</el-button>
|
||||||
|
<el-button icon="Refresh" @click="foodMultipleTableRef.clearSelection()">取消所有勾选</el-button>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
</el-form>
|
</el-form>
|
||||||
</el-row>
|
</el-row>
|
||||||
|
|||||||
@@ -22,11 +22,11 @@
|
|||||||
<el-input-number v-model="form.price" :min="0" :precision="2" placeholder="请输入商品价格" />
|
<el-input-number v-model="form.price" :min="0" :precision="2" placeholder="请输入商品价格" />
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
</el-col>
|
</el-col>
|
||||||
<!-- <el-col :span="14" class="mb20">-->
|
<!-- <el-col :span="14" class="mb20">-->
|
||||||
<!-- <el-form-item label="市场价" prop="marketPrice">-->
|
<!-- <el-form-item label="市场价" prop="marketPrice">-->
|
||||||
<!-- <el-input-number v-model="form.marketPrice" :min="0" :precision="2" placeholder="请输入市场价" />-->
|
<!-- <el-input-number v-model="form.marketPrice" :min="0" :precision="2" placeholder="请输入市场价" />-->
|
||||||
<!-- </el-form-item>-->
|
<!-- </el-form-item>-->
|
||||||
<!-- </el-col>-->
|
<!-- </el-col>-->
|
||||||
<el-col :span="14" class="mb20">
|
<el-col :span="14" class="mb20">
|
||||||
<el-form-item label="库存" prop="stock">
|
<el-form-item label="库存" prop="stock">
|
||||||
<el-input-number v-model="form.stock" :min="0" :precision="0" placeholder="请输入库存" />
|
<el-input-number v-model="form.stock" :min="0" :precision="0" placeholder="请输入库存" />
|
||||||
@@ -164,6 +164,7 @@ const getcanteenOnlineSpuData = (id: string) => {
|
|||||||
price: Number(displayPrice(res.data.price, "")),
|
price: Number(displayPrice(res.data.price, "")),
|
||||||
marketPrice: Number(displayPrice(res.data.marketPrice, "")),
|
marketPrice: Number(displayPrice(res.data.marketPrice, "")),
|
||||||
status: "" + res.data.status,
|
status: "" + res.data.status,
|
||||||
|
description: res.data.description ?? "",
|
||||||
})
|
})
|
||||||
})
|
})
|
||||||
.finally(() => {
|
.finally(() => {
|
||||||
|
|||||||
@@ -83,6 +83,12 @@
|
|||||||
<dict-tag :options="spu_status" :value="scope.row.status" />
|
<dict-tag :options="spu_status" :value="scope.row.status" />
|
||||||
</template>
|
</template>
|
||||||
</el-table-column>
|
</el-table-column>
|
||||||
|
<el-table-column prop="dishTypeName" label="上架类型" show-overflow-tooltip min-width="100">
|
||||||
|
<template #default="scope">
|
||||||
|
<el-tag v-show="scope.row.dishType == 1" type="success">{{ scope.row.dishTypeName}}</el-tag>
|
||||||
|
<el-tag v-show="scope.row.dishType == 2" type="primary">{{ scope.row.dishTypeName}}</el-tag>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
<el-table-column prop="price" label="商品价格" show-overflow-tooltip min-width="100">
|
<el-table-column prop="price" label="商品价格" show-overflow-tooltip min-width="100">
|
||||||
<template #default="scope">
|
<template #default="scope">
|
||||||
{{ displayPrice(scope.row.price) }}
|
{{ displayPrice(scope.row.price) }}
|
||||||
@@ -118,8 +124,8 @@
|
|||||||
|
|
||||||
<!-- 编辑、新增 -->
|
<!-- 编辑、新增 -->
|
||||||
<form-dialog ref="formDialogRef" @refresh="getDataList(false)" />
|
<form-dialog ref="formDialogRef" @refresh="getDataList(false)" />
|
||||||
<!-- 关联每日菜品 -->
|
<!-- 导入每日菜品 -->
|
||||||
<export-form-dialog ref="exportFormDialogRef" @refresh="getDataList(false)" />
|
<export-form-dialog ref="exportFormDialogRef" @refresh="exportRefresh" />
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
@@ -151,13 +157,17 @@ const state: BasicTableProps = reactive<BasicTableProps>({
|
|||||||
})
|
})
|
||||||
|
|
||||||
onMounted(async () => {
|
onMounted(async () => {
|
||||||
|
await getCanteenOnlineCategoryAll()
|
||||||
|
})
|
||||||
|
|
||||||
|
const getCanteenOnlineCategoryAll = async () => {
|
||||||
try {
|
try {
|
||||||
const res = await getCanteenOnlineCategory()
|
const res = await getCanteenOnlineCategory()
|
||||||
categoryOptions.value = res.data.records
|
categoryOptions.value = res.data.records
|
||||||
} catch (error) {
|
} catch (error) {
|
||||||
categoryOptions.value = []
|
categoryOptions.value = []
|
||||||
}
|
}
|
||||||
})
|
}
|
||||||
|
|
||||||
const { getDataList, currentChangeHandle, sizeChangeHandle, sortChangeHandle, downBlobFile, tableStyle } = useTable(state)
|
const { getDataList, currentChangeHandle, sizeChangeHandle, sortChangeHandle, downBlobFile, tableStyle } = useTable(state)
|
||||||
|
|
||||||
@@ -197,4 +207,10 @@ const handleDelete = async (ids: string[]) => {
|
|||||||
useMessage().error(err.msg)
|
useMessage().error(err.msg)
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// 导入每日菜品成功刷新
|
||||||
|
const exportRefresh = () => {
|
||||||
|
getDataList(false)
|
||||||
|
getCanteenOnlineCategoryAll()
|
||||||
|
}
|
||||||
</script>
|
</script>
|
||||||
@@ -0,0 +1,213 @@
|
|||||||
|
<template>
|
||||||
|
<el-dialog :title="form.id ? '编辑' : '新增'" v-model="visible"
|
||||||
|
:close-on-click-modal="false" draggable>
|
||||||
|
<el-form ref="dataFormRef" :model="form" :rules="dataRules" formDialogRef label-width="120px" v-loading="loading">
|
||||||
|
<el-row :gutter="24">
|
||||||
|
<el-col :span="12" class="mb20">
|
||||||
|
<el-form-item label="餐次类型" prop="mealType">
|
||||||
|
<el-select v-model="form.mealType" placeholder="请选择餐次类型" @change="onMealTypeChange">
|
||||||
|
<el-option label="早餐" value="1" />
|
||||||
|
<el-option label="中餐" value="2" />
|
||||||
|
<el-option label="晚餐" value="3" />
|
||||||
|
</el-select>
|
||||||
|
</el-form-item>
|
||||||
|
</el-col>
|
||||||
|
|
||||||
|
<el-col :span="12" class="mb20">
|
||||||
|
<el-form-item label="餐次名称" prop="mealName">
|
||||||
|
<el-input v-model="form.mealName" placeholder="请输入餐次名称"/>
|
||||||
|
</el-form-item>
|
||||||
|
</el-col>
|
||||||
|
|
||||||
|
<el-col :span="12" class="mb20">
|
||||||
|
<el-form-item label="开始时间" prop="startTime">
|
||||||
|
<el-time-select
|
||||||
|
v-model="form.startTime"
|
||||||
|
placeholder="请选择开始时间"
|
||||||
|
:selectable-range="getTimeRange()"
|
||||||
|
:step="30"
|
||||||
|
format="HH:mm"
|
||||||
|
value-format="HH:mm"
|
||||||
|
/>
|
||||||
|
</el-form-item>
|
||||||
|
</el-col>
|
||||||
|
|
||||||
|
<el-col :span="12" class="mb20">
|
||||||
|
<el-form-item label="结束时间" prop="endTime">
|
||||||
|
<el-time-select
|
||||||
|
v-model="form.endTime"
|
||||||
|
placeholder="请选择结束时间"
|
||||||
|
:selectable-range="getTimeRange()"
|
||||||
|
:step="30"
|
||||||
|
format="HH:mm"
|
||||||
|
value-format="HH:mm"
|
||||||
|
/>
|
||||||
|
</el-form-item>
|
||||||
|
</el-col>
|
||||||
|
|
||||||
|
<el-col :span="12" class="mb20">
|
||||||
|
<el-form-item label="时间段名称" prop="timeSlotName">
|
||||||
|
<el-input v-model="form.timeSlotName" placeholder="请输入时间段名称"/>
|
||||||
|
</el-form-item>
|
||||||
|
</el-col>
|
||||||
|
|
||||||
|
<el-col :span="12" class="mb20">
|
||||||
|
<el-form-item label="是否启用" prop="isEnabled">
|
||||||
|
<el-radio-group v-model="form.isEnabled">
|
||||||
|
<el-radio :label="1">启用</el-radio>
|
||||||
|
<el-radio :label="0">禁用</el-radio>
|
||||||
|
</el-radio-group>
|
||||||
|
</el-form-item>
|
||||||
|
</el-col>
|
||||||
|
|
||||||
|
<el-col :span="12" class="mb20">
|
||||||
|
<el-form-item label="排序" prop="sort">
|
||||||
|
<el-input-number v-model="form.sort" :min="0" :max="999" placeholder="请输入排序"/>
|
||||||
|
</el-form-item>
|
||||||
|
</el-col>
|
||||||
|
|
||||||
|
<el-col :span="24" class="mb20">
|
||||||
|
<el-form-item label="备注" prop="remark">
|
||||||
|
<el-input type="textarea" v-model="form.remark" placeholder="请输入备注" :rows="3"/>
|
||||||
|
</el-form-item>
|
||||||
|
</el-col>
|
||||||
|
|
||||||
|
</el-row>
|
||||||
|
</el-form>
|
||||||
|
<template #footer>
|
||||||
|
<span class="dialog-footer">
|
||||||
|
<el-button @click="visible = false">取消</el-button>
|
||||||
|
<el-button type="primary" @click="onSubmit" :disabled="loading">确认</el-button>
|
||||||
|
</span>
|
||||||
|
</template>
|
||||||
|
</el-dialog>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script setup lang="ts" name="TimeSlotConfigDialog">
|
||||||
|
import { useDict } from '/@/hooks/dict';
|
||||||
|
import { useMessage } from "/@/hooks/message";
|
||||||
|
import { getObj, addObj, putObj } from '/@/api/canteen/timeSlotConfig'
|
||||||
|
import { rule } from '/@/utils/validate';
|
||||||
|
const emit = defineEmits(['refresh']);
|
||||||
|
|
||||||
|
// 定义变量内容
|
||||||
|
const dataFormRef = ref();
|
||||||
|
const visible = ref(false)
|
||||||
|
const loading = ref(false)
|
||||||
|
|
||||||
|
// 提交表单数据
|
||||||
|
const form = reactive({
|
||||||
|
id:'',
|
||||||
|
mealType: '',
|
||||||
|
mealName: '',
|
||||||
|
startTime: '',
|
||||||
|
endTime: '',
|
||||||
|
timeSlotName: '',
|
||||||
|
isEnabled: 1,
|
||||||
|
sort: 0,
|
||||||
|
remark: '',
|
||||||
|
deptId: '',
|
||||||
|
});
|
||||||
|
|
||||||
|
// 定义校验规则
|
||||||
|
const dataRules = ref({
|
||||||
|
mealType: [{ required: true, message: '餐次类型不能为空', trigger: 'change' }],
|
||||||
|
mealName: [{ required: true, message: '餐次名称不能为空', trigger: 'blur' }],
|
||||||
|
startTime: [{ required: true, message: '开始时间不能为空', trigger: 'change' }],
|
||||||
|
endTime: [{ required: true, message: '结束时间不能为空', trigger: 'change' }],
|
||||||
|
timeSlotName: [{ required: true, message: '时间段名称不能为空', trigger: 'blur' }],
|
||||||
|
isEnabled: [{ required: true, message: '是否启用不能为空', trigger: 'change' }],
|
||||||
|
sort: [{ required: true, message: '排序不能为空', trigger: 'blur' }],
|
||||||
|
})
|
||||||
|
|
||||||
|
// 获取时间范围
|
||||||
|
const getTimeRange = () => {
|
||||||
|
return '00:00:00,23:59:59';
|
||||||
|
};
|
||||||
|
|
||||||
|
// 餐次类型变化时自动填充餐次名称
|
||||||
|
const onMealTypeChange = () => {
|
||||||
|
switch (form.mealType) {
|
||||||
|
case '1':
|
||||||
|
form.mealName = '早餐';
|
||||||
|
form.startTime = '07:00';
|
||||||
|
form.endTime = '09:00';
|
||||||
|
break;
|
||||||
|
case '2':
|
||||||
|
form.mealName = '中餐';
|
||||||
|
form.startTime = '11:30';
|
||||||
|
form.endTime = '13:30';
|
||||||
|
break;
|
||||||
|
case '3':
|
||||||
|
form.mealName = '晚餐';
|
||||||
|
form.startTime = '17:30';
|
||||||
|
form.endTime = '19:30';
|
||||||
|
break;
|
||||||
|
default:
|
||||||
|
form.mealName = '';
|
||||||
|
form.startTime = '';
|
||||||
|
form.endTime = '';
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
// 打开弹窗
|
||||||
|
const openDialog = (id: string) => {
|
||||||
|
visible.value = true
|
||||||
|
form.id = ''
|
||||||
|
form.mealType = ''
|
||||||
|
form.mealName = ''
|
||||||
|
form.startTime = ''
|
||||||
|
form.endTime = ''
|
||||||
|
form.timeSlotName = ''
|
||||||
|
form.isEnabled = 1
|
||||||
|
form.sort = 0
|
||||||
|
form.remark = ''
|
||||||
|
form.deptId = ''
|
||||||
|
|
||||||
|
// 重置表单数据
|
||||||
|
nextTick(() => {
|
||||||
|
dataFormRef.value?.resetFields();
|
||||||
|
});
|
||||||
|
|
||||||
|
// 获取timeSlotConfig信息
|
||||||
|
if (id) {
|
||||||
|
form.id = id
|
||||||
|
gettimeSlotConfigData(id)
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
// 提交
|
||||||
|
const onSubmit = async () => {
|
||||||
|
const valid = await dataFormRef.value.validate().catch(() => {});
|
||||||
|
if (!valid) return false;
|
||||||
|
|
||||||
|
try {
|
||||||
|
loading.value = true;
|
||||||
|
form.id ? await putObj(form) : await addObj(form);
|
||||||
|
useMessage().success(form.id ? '修改成功' : '添加成功');
|
||||||
|
visible.value = false;
|
||||||
|
emit('refresh');
|
||||||
|
} catch (err: any) {
|
||||||
|
useMessage().error(err.msg);
|
||||||
|
} finally {
|
||||||
|
loading.value = false;
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
|
||||||
|
// 初始化表单数据
|
||||||
|
const gettimeSlotConfigData = (id: string) => {
|
||||||
|
// 获取数据
|
||||||
|
loading.value = true
|
||||||
|
getObj(id).then((res: any) => {
|
||||||
|
Object.assign(form, res.data)
|
||||||
|
}).finally(() => {
|
||||||
|
loading.value = false
|
||||||
|
})
|
||||||
|
};
|
||||||
|
|
||||||
|
// 暴露变量
|
||||||
|
defineExpose({
|
||||||
|
openDialog
|
||||||
|
});
|
||||||
|
</script>
|
||||||
@@ -0,0 +1,121 @@
|
|||||||
|
<template>
|
||||||
|
<div class="layout-padding">
|
||||||
|
<div class="layout-padding-auto layout-padding-view">
|
||||||
|
<el-row>
|
||||||
|
<div class="mb8" style="width: 100%">
|
||||||
|
<el-button icon="folder-add" type="primary" class="ml10" @click="formDialogRef.openDialog()"
|
||||||
|
v-auth="'canteen_timeSlotConfig_add'">
|
||||||
|
新 增
|
||||||
|
</el-button>
|
||||||
|
<el-button plain :disabled="multiple" icon="Delete" type="primary"
|
||||||
|
v-auth="'canteen_timeSlotConfig_del'" @click="handleDelete(selectObjs)">
|
||||||
|
删除
|
||||||
|
</el-button>
|
||||||
|
<right-toolbar v-model:showSearch="showSearch" :export="'canteen_timeSlotConfig_export'"
|
||||||
|
@exportExcel="exportExcel" class="ml10 mr20" style="float: right;"
|
||||||
|
@queryTable="getDataList"></right-toolbar>
|
||||||
|
</div>
|
||||||
|
</el-row>
|
||||||
|
<el-table :data="state.dataList" v-loading="state.loading" border
|
||||||
|
:cell-style="tableStyle.cellStyle" :header-cell-style="tableStyle.headerCellStyle"
|
||||||
|
@selection-change="selectionChangHandle"
|
||||||
|
@sort-change="sortChangeHandle">
|
||||||
|
<el-table-column type="selection" width="40" align="center" />
|
||||||
|
<el-table-column type="index" label="#" width="40" />
|
||||||
|
<el-table-column prop="mealType" label="餐次类型 1-早餐 2-中餐 3-晚餐" show-overflow-tooltip/>
|
||||||
|
<el-table-column prop="mealName" label="餐次名称" show-overflow-tooltip/>
|
||||||
|
<el-table-column prop="startTime" label="开始时间" show-overflow-tooltip/>
|
||||||
|
<el-table-column prop="endTime" label="结束时间" show-overflow-tooltip/>
|
||||||
|
<el-table-column prop="timeSlotName" label="时间段名称" show-overflow-tooltip/>
|
||||||
|
<el-table-column prop="isEnabled" label="是否启用 0-禁用 1-启用" show-overflow-tooltip/>
|
||||||
|
<el-table-column prop="sort" label="排序" show-overflow-tooltip/>
|
||||||
|
<el-table-column prop="remark" label="备注" show-overflow-tooltip/>
|
||||||
|
<!-- <el-table-column prop="deptId" label="部门id" show-overflow-tooltip/>-->
|
||||||
|
<el-table-column label="操作" width="150">
|
||||||
|
<template #default="scope">
|
||||||
|
<el-button icon="edit-pen" text type="primary" v-auth="'canteen_timeSlotConfig_edit'"
|
||||||
|
@click="formDialogRef.openDialog(scope.row.id)">编辑</el-button>
|
||||||
|
<el-button icon="delete" text type="primary" v-auth="'canteen_timeSlotConfig_del'" @click="handleDelete([scope.row.id])">删除</el-button>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
</el-table>
|
||||||
|
<pagination @size-change="sizeChangeHandle" @current-change="currentChangeHandle" v-bind="state.pagination" />
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- 编辑、新增 -->
|
||||||
|
<form-dialog ref="formDialogRef" @refresh="getDataList(false)" />
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script setup lang="ts" name="systemTimeSlotConfig">
|
||||||
|
import { BasicTableProps, useTable } from "/src/hooks/table";
|
||||||
|
import { fetchList, delObjs } from "/src/api/canteen/timeSlotConfig";
|
||||||
|
import { useMessage, useMessageBox } from "/src/hooks/message";
|
||||||
|
import { useDict } from '/src/hooks/dict';
|
||||||
|
|
||||||
|
// 引入组件
|
||||||
|
const FormDialog = defineAsyncComponent(() => import('./form.vue'));
|
||||||
|
// 定义查询字典
|
||||||
|
|
||||||
|
// 定义变量内容
|
||||||
|
const formDialogRef = ref()
|
||||||
|
// 搜索变量
|
||||||
|
const queryRef = ref()
|
||||||
|
const showSearch = ref(true)
|
||||||
|
// 多选变量
|
||||||
|
const selectObjs = ref([]) as any
|
||||||
|
const multiple = ref(true)
|
||||||
|
|
||||||
|
const state: BasicTableProps = reactive<BasicTableProps>({
|
||||||
|
queryForm: {},
|
||||||
|
pageList: fetchList
|
||||||
|
})
|
||||||
|
|
||||||
|
// table hook
|
||||||
|
const {
|
||||||
|
getDataList,
|
||||||
|
currentChangeHandle,
|
||||||
|
sizeChangeHandle,
|
||||||
|
sortChangeHandle,
|
||||||
|
downBlobFile,
|
||||||
|
tableStyle
|
||||||
|
} = useTable(state)
|
||||||
|
|
||||||
|
// 清空搜索条件
|
||||||
|
const resetQuery = () => {
|
||||||
|
// 清空搜索条件
|
||||||
|
queryRef.value?.resetFields()
|
||||||
|
// 清空多选
|
||||||
|
selectObjs.value = []
|
||||||
|
getDataList()
|
||||||
|
}
|
||||||
|
|
||||||
|
// 导出excel
|
||||||
|
const exportExcel = () => {
|
||||||
|
downBlobFile('/canteen/timeSlotConfig/export', Object.assign(state.queryForm, { ids: selectObjs }), 'timeSlotConfig.xlsx')
|
||||||
|
}
|
||||||
|
|
||||||
|
// 多选事件
|
||||||
|
const selectionChangHandle = (objs: { id: string }[]) => {
|
||||||
|
selectObjs.value = objs.map(({ id }) => id);
|
||||||
|
multiple.value = !objs.length;
|
||||||
|
};
|
||||||
|
|
||||||
|
// 删除操作
|
||||||
|
const handleDelete = async (ids: string[]) => {
|
||||||
|
try {
|
||||||
|
await useMessageBox().confirm('此操作将永久删除');
|
||||||
|
} catch {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
try {
|
||||||
|
await delObjs(ids);
|
||||||
|
getDataList();
|
||||||
|
useMessage().success('删除成功');
|
||||||
|
} catch (err: any) {
|
||||||
|
useMessage().error(err.msg);
|
||||||
|
}
|
||||||
|
};
|
||||||
|
</script>
|
||||||
@@ -69,8 +69,16 @@
|
|||||||
:data="vxeTableData"
|
:data="vxeTableData"
|
||||||
:edit-rules="validRules"
|
:edit-rules="validRules"
|
||||||
show-footer
|
show-footer
|
||||||
:footer-data="[{ seq: '合计', totalAmount }]"
|
:footer-data="[
|
||||||
:merge-footer-items="[{ row: 0, col: 2, rowspan: 1, colspan: 7 }]"
|
{
|
||||||
|
seq: '合计',
|
||||||
|
quantity: total.quantity,
|
||||||
|
purchasePrice: total.purchasePrice,
|
||||||
|
realPrice: `${total.realPrice}元`,
|
||||||
|
totalAmount: total.totalAmount,
|
||||||
|
},
|
||||||
|
]"
|
||||||
|
:merge-footer-items="[{ row: 0, col: 2, rowspan: 1, colspan: 4 }]"
|
||||||
@checkbox-all=""
|
@checkbox-all=""
|
||||||
@checkbox-change=""
|
@checkbox-change=""
|
||||||
size="mini"
|
size="mini"
|
||||||
@@ -148,7 +156,7 @@
|
|||||||
<el-input-number v-if="row.selectedUnitObj" v-model="row.selectedUnitObj.totalAmount" :min="0" :precision="2" />
|
<el-input-number v-if="row.selectedUnitObj" v-model="row.selectedUnitObj.totalAmount" :min="0" :precision="2" />
|
||||||
</template>
|
</template>
|
||||||
<template #footer="{ row }">
|
<template #footer="{ row }">
|
||||||
<span style="color: #2e5cf6; font-weight: bold">{{ totalAmount }} 元</span>
|
<span style="color: #2e5cf6; font-weight: bold">{{ total.totalAmount }}元</span>
|
||||||
</template>
|
</template>
|
||||||
</vxe-column>
|
</vxe-column>
|
||||||
<vxe-column field="remark" title="备注" :edit-render="{ autoFocus: 'input', placeholder: '请输入' }">
|
<vxe-column field="remark" title="备注" :edit-render="{ autoFocus: 'input', placeholder: '请输入' }">
|
||||||
@@ -235,9 +243,15 @@ const validRules = ref<VxeTablePropTypes.EditRules<any>>({
|
|||||||
})
|
})
|
||||||
|
|
||||||
// 合计总金额
|
// 合计总金额
|
||||||
const totalAmount = computed(() =>
|
const total = computed(() => {
|
||||||
vxeTableData.value.reduce((sum: any, row: any) => sum + Number(row.selectedUnitObj?.totalAmount || 0), 0).toFixed(2),
|
const quantity = vxeTableData.value.reduce((sum: any, row: any) => sum + Number(row.quantity || 0), 0).toFixed(2)
|
||||||
)
|
const purchasePrice = displayPrice(
|
||||||
|
vxeTableData.value.reduce((sum: any, row: any) => sum + Number(row.selectedUnitObj?.purchasePrice || 0), 0),
|
||||||
|
)
|
||||||
|
const realPrice = vxeTableData.value.reduce((sum: any, row: any) => sum + Number(row.selectedUnitObj?.realPrice || 0), 0)
|
||||||
|
const totalAmount = vxeTableData.value.reduce((sum: any, row: any) => sum + Number(row.selectedUnitObj?.totalAmount || 0), 0).toFixed(2)
|
||||||
|
return { quantity, purchasePrice, realPrice, totalAmount }
|
||||||
|
})
|
||||||
|
|
||||||
onMounted(async () => {
|
onMounted(async () => {
|
||||||
await getInitData()
|
await getInitData()
|
||||||
|
|||||||
@@ -97,8 +97,16 @@
|
|||||||
:data="vxeTableData"
|
:data="vxeTableData"
|
||||||
:edit-rules="validRules"
|
:edit-rules="validRules"
|
||||||
show-footer
|
show-footer
|
||||||
:footer-data="[{ seq: '合计', totalAmount }]"
|
:footer-data="[
|
||||||
:merge-footer-items="[{ row: 0, col: 2, rowspan: 1, colspan: 7 }]"
|
{
|
||||||
|
seq: '合计',
|
||||||
|
quantity: total.quantity,
|
||||||
|
purchasePrice: total.purchasePrice,
|
||||||
|
realPrice: `${total.realPrice}元`,
|
||||||
|
totalAmount: total.totalAmount,
|
||||||
|
},
|
||||||
|
]"
|
||||||
|
:merge-footer-items="[{ row: 0, col: 2, rowspan: 1, colspan: 4 }]"
|
||||||
@checkbox-all=""
|
@checkbox-all=""
|
||||||
@checkbox-change=""
|
@checkbox-change=""
|
||||||
size="mini"
|
size="mini"
|
||||||
@@ -144,9 +152,9 @@
|
|||||||
v-model="row.quantity"
|
v-model="row.quantity"
|
||||||
:min="0"
|
:min="0"
|
||||||
:precision="0"
|
:precision="0"
|
||||||
@change="onRowValueChange(row, $rowIndex)"
|
@change="onQuantityChange(row, $rowIndex)"
|
||||||
/>
|
/>
|
||||||
<el-input-number v-else v-model="row.quantity" :min="0" :precision="2" @change="onRowValueChange(row, $rowIndex)" />
|
<el-input-number v-else v-model="row.quantity" :min="0" :precision="2" @change="onQuantityChange(row, $rowIndex)" />
|
||||||
</template>
|
</template>
|
||||||
</vxe-column>
|
</vxe-column>
|
||||||
<vxe-column field="purchasePrice" title="原进价">
|
<vxe-column field="purchasePrice" title="原进价">
|
||||||
@@ -154,11 +162,11 @@
|
|||||||
{{ displayPrice(row.selectedUnitObj?.purchasePrice || 0) }}
|
{{ displayPrice(row.selectedUnitObj?.purchasePrice || 0) }}
|
||||||
</template>
|
</template>
|
||||||
</vxe-column>
|
</vxe-column>
|
||||||
<vxe-column field="realPrice" title="实际进价" :edit-render="{ autoFocus: 'input', placeholder: '请输入' }">
|
<vxe-column field="realPrice" title="实际进价">
|
||||||
<template #default="{ row }">
|
<template #default="{ row }">
|
||||||
{{ row?.selectedUnitObj?.realPrice || 0 }}
|
{{ row?.selectedUnitObj?.realPrice || 0 }}
|
||||||
</template>
|
</template>
|
||||||
<template #edit="{ row, $rowIndex }">
|
<!-- <template #edit="{ row, $rowIndex }">
|
||||||
<el-input-number
|
<el-input-number
|
||||||
v-if="row.selectedUnitObj"
|
v-if="row.selectedUnitObj"
|
||||||
v-model="row.selectedUnitObj.realPrice"
|
v-model="row.selectedUnitObj.realPrice"
|
||||||
@@ -166,17 +174,23 @@
|
|||||||
:precision="2"
|
:precision="2"
|
||||||
@change="onRowValueChange(row, $rowIndex)"
|
@change="onRowValueChange(row, $rowIndex)"
|
||||||
/>
|
/>
|
||||||
</template>
|
</template> -->
|
||||||
</vxe-column>
|
</vxe-column>
|
||||||
<vxe-column field="totalAmount" title="累计总金额" :edit-render="{ autoFocus: 'input', placeholder: '请输入' }">
|
<vxe-column field="totalAmount" title="累计总金额" :edit-render="{ autoFocus: 'input', placeholder: '请输入' }">
|
||||||
<template #default="{ row }">
|
<template #default="{ row }">
|
||||||
{{ row?.selectedUnitObj?.totalAmount }}
|
{{ row?.selectedUnitObj?.totalAmount }}
|
||||||
</template>
|
</template>
|
||||||
<template #edit="{ row, $rowIndex }">
|
<template #edit="{ row, $rowIndex }">
|
||||||
<el-input-number v-if="row.selectedUnitObj" v-model="row.selectedUnitObj.totalAmount" :min="0" :precision="2" />
|
<el-input-number
|
||||||
|
v-if="row.selectedUnitObj"
|
||||||
|
v-model="row.selectedUnitObj.totalAmount"
|
||||||
|
:min="0"
|
||||||
|
:precision="2"
|
||||||
|
@change="onTotalAmountChange(row, $rowIndex)"
|
||||||
|
/>
|
||||||
</template>
|
</template>
|
||||||
<template #footer="{ row }">
|
<template #footer="{ row }">
|
||||||
<span style="color: #2e5cf6; font-weight: bold">{{ totalAmount }} 元</span>
|
<span style="color: #2e5cf6; font-weight: bold">{{ total.totalAmount }}元</span>
|
||||||
</template>
|
</template>
|
||||||
</vxe-column>
|
</vxe-column>
|
||||||
<vxe-column field="remark" title="备注" :edit-render="{ autoFocus: 'input', placeholder: '请输入' }">
|
<vxe-column field="remark" title="备注" :edit-render="{ autoFocus: 'input', placeholder: '请输入' }">
|
||||||
@@ -263,9 +277,15 @@ const validRules = ref<VxeTablePropTypes.EditRules<any>>({
|
|||||||
})
|
})
|
||||||
|
|
||||||
// 合计总金额
|
// 合计总金额
|
||||||
const totalAmount = computed(() =>
|
const total = computed(() => {
|
||||||
vxeTableData.value.reduce((sum: any, row: any) => sum + Number(row.selectedUnitObj?.totalAmount || 0), 0).toFixed(2),
|
const quantity = vxeTableData.value.reduce((sum: any, row: any) => sum + Number(row.quantity || 0), 0).toFixed(2)
|
||||||
)
|
const purchasePrice = displayPrice(
|
||||||
|
vxeTableData.value.reduce((sum: any, row: any) => sum + Number(row.selectedUnitObj?.purchasePrice || 0), 0),
|
||||||
|
)
|
||||||
|
const realPrice = vxeTableData.value.reduce((sum: any, row: any) => sum + Number(row.selectedUnitObj?.realPrice || 0), 0).toFixed(2)
|
||||||
|
const totalAmount = vxeTableData.value.reduce((sum: any, row: any) => sum + Number(row.selectedUnitObj?.totalAmount || 0), 0).toFixed(2)
|
||||||
|
return { quantity, purchasePrice, realPrice, totalAmount }
|
||||||
|
})
|
||||||
|
|
||||||
onMounted(async () => {
|
onMounted(async () => {
|
||||||
await getInitData()
|
await getInitData()
|
||||||
@@ -364,9 +384,15 @@ const onUnitChange = (row: any) => {
|
|||||||
row.selectedUnitObj.totalAmount = Number((row.quantity * Number(row.selectedUnitObj.realPrice || 0)).toFixed(2))
|
row.selectedUnitObj.totalAmount = Number((row.quantity * Number(row.selectedUnitObj.realPrice || 0)).toFixed(2))
|
||||||
}
|
}
|
||||||
|
|
||||||
// 数量、进价变动联动
|
// 数量变动
|
||||||
const onRowValueChange = (row: any, $rowIndex: number) => {
|
const onQuantityChange = (row: any, $rowIndex: number) => {
|
||||||
row.selectedUnitObj.totalAmount = Number((row.quantity * Number(row.selectedUnitObj.realPrice || 0)).toFixed(2))
|
row.selectedUnitObj.totalAmount = Number(displayPrice(row.quantity * Number(row.selectedUnitObj.purchasePrice || 0), ""))
|
||||||
|
row.selectedUnitObj.realPrice = row.selectedUnitObj.totalAmount / row.quantity
|
||||||
|
}
|
||||||
|
|
||||||
|
// 累计总金额变动
|
||||||
|
const onTotalAmountChange = (row: any, $rowIndex: number) => {
|
||||||
|
row.selectedUnitObj.realPrice = (row.selectedUnitObj.totalAmount / row.quantity).toFixed(2)
|
||||||
}
|
}
|
||||||
|
|
||||||
// 整理table数据
|
// 整理table数据
|
||||||
|
|||||||
@@ -15,9 +15,6 @@
|
|||||||
value-format="YYYY-MM-DD"
|
value-format="YYYY-MM-DD"
|
||||||
/>
|
/>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<!-- <el-form-item label="经办人" prop="handlerUserId">
|
|
||||||
<SelectHandlerUser v-model.trim="state.queryForm.handlerUserId" placeholder="请选择经办人" style="width: 200px" />
|
|
||||||
</el-form-item> -->
|
|
||||||
<el-form-item>
|
<el-form-item>
|
||||||
<el-button icon="search" type="primary" @click="getDataList">查询</el-button>
|
<el-button icon="search" type="primary" @click="getDataList">查询</el-button>
|
||||||
<el-button icon="Refresh" @click="resetQuery">重置</el-button>
|
<el-button icon="Refresh" @click="resetQuery">重置</el-button>
|
||||||
@@ -51,8 +48,7 @@
|
|||||||
<el-table-column type="index" label="#" width="50" />
|
<el-table-column type="index" label="#" width="50" />
|
||||||
<el-table-column prop="inventoryCode" label="单据编号" show-overflow-tooltip />
|
<el-table-column prop="inventoryCode" label="单据编号" show-overflow-tooltip />
|
||||||
<el-table-column prop="inventoryDate" label="单据日期" show-overflow-tooltip />
|
<el-table-column prop="inventoryDate" label="单据日期" show-overflow-tooltip />
|
||||||
<!-- <el-table-column prop="productName" label="入库商品" show-overflow-tooltip /> -->
|
<el-table-column prop="productName" label="入库商品" show-overflow-tooltip />
|
||||||
<!-- <el-table-column prop="handlerUserName" label="经办人" show-overflow-tooltip /> -->
|
|
||||||
<el-table-column prop="supplierId" label="货商" show-overflow-tooltip />
|
<el-table-column prop="supplierId" label="货商" show-overflow-tooltip />
|
||||||
<el-table-column prop="remark" label="备注" show-overflow-tooltip />
|
<el-table-column prop="remark" label="备注" show-overflow-tooltip />
|
||||||
<el-table-column label="操作" width="150">
|
<el-table-column label="操作" width="150">
|
||||||
|
|||||||
Reference in new issue
Block a user