This commit is contained in:
dzc committed 2025-08-15 17:28:01 +08:00
commit 2b8a1f0755
20 files changed
+1362 -486

No files matched your search

+41
View File
@@ -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
})
}
+60 -58
View File
@@ -3,7 +3,9 @@
<div v-loading="mainLoading" class="msg-main">
<div id="msg-div" class="msg-div">
<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>
<div v-for="item in tableData" :key="item.id" class="execution" id="msgTable">
@@ -109,125 +111,125 @@
</template>
<script setup lang="ts" name="wx-msg">
import { fetchList, addObj } from '/@/api/mp/wx-fans-msg';
import { useMessage } from '/@/hooks/message';
import { getMaterialVideo } from '/@/api/mp/wx-material';
import { fetchList, addObj } from "/@/api/mp/wx-fans-msg"
import { useMessage } from "/@/hooks/message"
import { getMaterialVideo } from "/@/api/mp/wx-material"
const WxReply = defineAsyncComponent(() => import('../wx-reply/index.vue'));
const WxNews = defineAsyncComponent(() => import('../wx-news/index.vue'));
const WxReply = defineAsyncComponent(() => import("../wx-reply/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
const mainLoading = ref(false);
const sendLoading = ref(false);
const mainLoading = ref(false)
const sendLoading = ref(false)
const loadMore = ref(false);
const loadMore = ref(false)
const objData = ref({
repType: 'text',
appId: '',
}) as any;
repType: "text",
appId: "",
}) as any
const page = reactive({
total: 0, // 总页数
currentPage: 1, // 当前页数
pageSize: 10, // 每页显示多少条
ascs: [], //升序字段
descs: 'create_time', //降序字段
});
descs: "create_time", //降序字段
})
const wxData = reactive({
appId: '',
wxUserId: '',
});
appId: "",
wxUserId: "",
})
const sendMsg = () => {
if (objData.value) {
if (objData.value.repType === 'news') {
if (objData.value.repType === "news") {
if (JSON.parse(objData.value.content).length > 1) {
useMessage().error('图文消息条数限制在1条以内,已默认发送第一条');
objData.value.content = JSON.parse(objData.value.content)[0];
useMessage().error("图文消息条数限制在1条以内,已默认发送第一条")
objData.value.content = JSON.parse(objData.value.content)[0]
}
}
sendLoading.value = true;
sendLoading.value = true
addObj(
Object.assign(
{
wxUserId: wxData.wxUserId,
appId: wxData.appId,
},
objData.value
)
objData.value,
),
)
.then(() => {
tableData.value = [];
tableData.value = []
getData().then(() => {
//box-container是添加overflow的父div,也就是出现滚动条的div
var scrollTarget = document.getElementById('msg-div');
var scrollTarget = document.getElementById("msg-div")
//scrollTarget.scrollHeight是获取dom元素的高度,然后设置scrollTop
scrollTarget.scrollTop = scrollTarget.scrollHeight;
});
scrollTarget.scrollTop = scrollTarget.scrollHeight
})
})
.finally(() => {
sendLoading.value = false;
});
sendLoading.value = false
})
}
};
}
const tableData = ref([] as any);
const tableLoading = ref(false);
const tableData = ref([] as any)
const tableLoading = ref(false)
const openDialog = (data: any) => {
wxData.wxUserId = data.wxUserId;
wxData.appId = data.appId;
objData.value.appId = data.appId;
getData();
visible.value = true;
};
wxData.wxUserId = data.wxUserId
wxData.appId = data.appId
objData.value.appId = data.appId
getData()
visible.value = true
}
const getData = () => {
tableLoading.value = true;
tableLoading.value = true
return fetchList({
...page,
...wxData,
}).then((res) => {
const data = res.data.records.reverse();
tableData.value = [...data, ...tableData.value];
page.total = res.data.total;
tableLoading.value = false;
const data = res.data.records.reverse()
tableData.value = [...data, ...tableData.value]
page.total = res.data.total
tableLoading.value = false
if (data.length < page.pageSize || data.length === 0) {
loadMore.value = false;
loadMore.value = false
}
});
};
})
}
const loadVideo = (item) => {
getMaterialVideo({
mediaId: item.repMediaId,
appId: item.appId,
}).then((response) => {
const data = response.data;
window.open(data.downUrl, 'target', '');
});
};
// const data = response.data
// window.open(data.downUrl, 'target', '');
})
}
const loadingMore = () => {
page.currentPage = page.currentPage + 1;
getData();
};
page.currentPage = page.currentPage + 1
getData()
}
// 暴露变量
defineExpose({
openDialog,
});
})
</script>
<style lang="scss" scoped>
@import './comment.scss';
@import './card.scss';
@import "./comment.scss";
@import "./card.scss";
.msg-main {
margin-top: -30px;
+80 -80
View File
@@ -99,136 +99,136 @@
</template>
<script setup lang="ts" name="wx-reply">
import { getMaterialVideo } from '/@/api/mp/wx-material';
import { useMessage } from '/@/hooks/message';
const WxMaterialSelect = defineAsyncComponent(() => import('/@/components/Wechat/wx-material-select/main.vue'));
import { getMaterialVideo } from "/@/api/mp/wx-material"
import { useMessage } from "/@/hooks/message"
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({
objData: {
type: Object,
default: () => {
return {
repType: '',
repContent: '',
repName: '',
repDesc: '',
repUrl: '',
};
repType: "",
repContent: "",
repName: "",
repDesc: "",
repUrl: "",
}
},
},
});
})
const uploadData = reactive({
mediaType: props.objData.repType,
title: '',
introduction: '',
title: "",
introduction: "",
appId: props.objData.appId,
});
})
const tempObj = ref({}) as any;
const tempObj = ref({}) as any
const handleClick = (tab) => {
uploadData.mediaType = tab.paneName;
uploadData.appId = props.objData.appId;
uploadData.mediaType = tab.paneName
uploadData.appId = props.objData.appId
const tempObjItem = tempObj.value[tab.paneName];
const tempObjItem = tempObj.value[tab.paneName]
if (tempObjItem) {
props.objData.repName = tempObjItem.repName ? tempObjItem.repName : null;
props.objData.repMediaId = tempObjItem.repMediaId ? tempObjItem.repMediaId : null;
props.objData.media_id = tempObjItem.media_id ? tempObjItem.media_id : null;
props.objData.repUrl = tempObjItem.repUrl ? tempObjItem.repUrl : null;
props.objData.content = tempObjItem.content ? tempObjItem.content : null;
props.objData.repDesc = tempObjItem.repDesc ? tempObjItem.repDesc : null;
props.objData.repName = tempObjItem.repName ? tempObjItem.repName : null
props.objData.repMediaId = tempObjItem.repMediaId ? tempObjItem.repMediaId : null
props.objData.media_id = tempObjItem.media_id ? tempObjItem.media_id : null
props.objData.repUrl = tempObjItem.repUrl ? tempObjItem.repUrl : null
props.objData.content = tempObjItem.content ? tempObjItem.content : null
props.objData.repDesc = tempObjItem.repDesc ? tempObjItem.repDesc : null
} else {
props.objData.repName = '';
props.objData.repMediaId = '';
props.objData.media_id = '';
props.objData.repUrl = '';
props.objData.content = '';
props.objData.repDesc = '';
props.objData.repName = ""
props.objData.repMediaId = ""
props.objData.media_id = ""
props.objData.repUrl = ""
props.objData.content = ""
props.objData.repDesc = ""
}
};
}
const deleteObj = () => {
props.objData.repName = '';
props.objData.repUrl = '';
props.objData.content = '';
};
props.objData.repName = ""
props.objData.repUrl = ""
props.objData.content = ""
}
const openMaterial = (data: any) => {
dialogNewsRef.value.openDialog(data);
};
dialogNewsRef.value.openDialog(data)
}
const dialogNewsRef = ref();
const dialogNewsRef = ref()
const selectMaterial = (item, appId) => {
let tempObjItem = {
repType: '',
repMediaId: '',
media_id: '',
content: '',
} as any;
repType: "",
repMediaId: "",
media_id: "",
content: "",
} as any
tempObjItem.repType = props.objData.repType;
tempObjItem.repMediaId = item.mediaId;
tempObjItem.media_id = item.mediaId;
tempObjItem.content = item.content;
tempObjItem.repType = props.objData.repType
tempObjItem.repMediaId = item.mediaId
tempObjItem.media_id = item.mediaId
tempObjItem.content = item.content
props.objData.repMediaId = item.mediaId;
props.objData.media_id = item.mediaId;
props.objData.content = item.content;
if (props.objData.repType === 'music') {
tempObjItem.repThumbMediaId = item.mediaId;
tempObjItem.repThumbUrl = item.url;
props.objData.repThumbMediaId = item.mediaId;
props.objData.repThumbUrl = item.url;
props.objData.repMediaId = item.mediaId
props.objData.media_id = item.mediaId
props.objData.content = item.content
if (props.objData.repType === "music") {
tempObjItem.repThumbMediaId = item.mediaId
tempObjItem.repThumbUrl = item.url
props.objData.repThumbMediaId = item.mediaId
props.objData.repThumbUrl = item.url
} else {
tempObjItem.repName = item.name;
tempObjItem.repUrl = item.url;
props.objData.repName = item.name;
props.objData.repUrl = item.url;
tempObjItem.repName = item.name
tempObjItem.repUrl = item.url
props.objData.repName = item.name
props.objData.repUrl = item.url
}
if (props.objData.repType === 'video') {
if (props.objData.repType === "video") {
getMaterialVideo({
mediaId: item.mediaId,
appId: appId,
}).then((response) => {
const data = response.data;
tempObjItem.repDesc = data.description || '';
tempObjItem.repUrl = data.downUrl;
props.objData.repName = data.title;
props.objData.repDesc = data.description || '';
props.objData.repUrl = data.downUrl;
});
const data = response.data
tempObjItem.repDesc = data.description || ""
tempObjItem.repUrl = data.downUrl
props.objData.repName = data.title
props.objData.repDesc = data.description || ""
props.objData.repUrl = data.downUrl
})
}
if (props.objData.repType === 'news') {
props.objData.content = JSON.stringify(item.content.newsItem);
if (props.objData.repType === "news") {
props.objData.content = JSON.stringify(item.content.newsItem)
}
tempObj.value[props.objData.repType] = tempObjItem;
};
tempObj.value[props.objData.repType] = tempObjItem
}
const handelUpload = (response) => {
if (response.code === 0) {
const item = response.data;
selectMaterial(item, props.objData.appId);
const item = response.data
selectMaterial(item, props.objData.appId)
} else {
useMessage().error('上传错误' + response.msg);
useMessage().error("上传错误" + response.msg)
}
};
}
const loadVideo = (item) => {
getMaterialVideo({
mediaId: item.repMediaId,
appId: item.appId,
}).then((response) => {
const data = response.data;
window.open(data.downUrl, 'target', '');
});
};
// const data = response.data
// window.open(data.downUrl, 'target', '');
})
}
</script>
<style scoped lang="scss">
+41 -38
View File
@@ -28,74 +28,77 @@
</template>
<script setup lang="ts" name="layoutBreadcrumbSearch">
import { useI18n } from 'vue-i18n';
import { useTagsViewRoutes } from '/@/stores/tagsViewRoutes';
import { useI18n } from "vue-i18n"
import { useTagsViewRoutes } from "/@/stores/tagsViewRoutes"
// 定义变量内容
const storesTagsViewRoutes = useTagsViewRoutes();
const { tagsViewRoutes } = storeToRefs(storesTagsViewRoutes);
const layoutMenuAutocompleteRef = ref();
const { t } = useI18n();
const router = useRouter();
const storesTagsViewRoutes = useTagsViewRoutes()
const { tagsViewRoutes } = storeToRefs(storesTagsViewRoutes)
const layoutMenuAutocompleteRef = ref()
const { t } = useI18n()
const router = useRouter()
const state = reactive<SearchState>({
isShowSearch: false,
menuQuery: '',
menuQuery: "",
tagsViewList: [],
});
})
// 搜索弹窗打开
const openSearch = () => {
state.menuQuery = '';
state.isShowSearch = true;
initTageView();
state.menuQuery = ""
state.isShowSearch = true
initTageView()
nextTick(() => {
setTimeout(() => {
layoutMenuAutocompleteRef.value.focus();
});
});
};
layoutMenuAutocompleteRef.value.focus()
})
})
}
// 搜索弹窗关闭
const closeSearch = () => {
state.isShowSearch = false;
};
state.isShowSearch = false
}
// 菜单搜索数据过滤
const menuSearch = (queryString: string, cb: Function) => {
let results = queryString ? state.tagsViewList.filter(createFilter(queryString)) : state.tagsViewList;
cb(results);
};
let results = queryString ? state.tagsViewList.filter(createFilter(queryString)) : state.tagsViewList
cb(results)
}
// 菜单搜索过滤
const createFilter = (queryString: string) => {
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 = () => {
if (state.tagsViewList.length > 0) return false;
if (state.tagsViewList.length > 0) return false
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) => {
let { path, redirect } = item;
if (item.meta?.isLink && !item.meta?.isIframe) window.open(item.meta?.isLink);
else if (redirect) router.push(redirect);
else router.push(path);
closeSearch();
};
let { path, redirect } = item
if (item.meta?.isLink && !item.meta?.isIframe) {
// window.open(item.meta?.isLink)
} else if (redirect) router.push(redirect)
else router.push(path)
closeSearch()
}
// 暴露变量
defineExpose({
openSearch,
});
})
</script>
<style scoped lang="scss">
.layout-search-dialog {
position: relative;
:deep(.el-dialog) {
width: 560px;
width: 560px;
.el-dialog__header,
.el-dialog__body {
display: none;
@@ -108,8 +111,8 @@ defineExpose({
}
}
:deep(.el-autocomplete) {
position: absolute;
width: 560px;
position: absolute;
width: 560px;
top: 53vh;
left: 50%;
transform: translateX(-50%);
+16 -13
View File
@@ -14,31 +14,34 @@
</template>
<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>({
title: '',
isLink: '',
});
title: "",
isLink: "",
})
// 立即前往
const onGotoFullPage = () => {
if (verifyUrl(<string>state.isLink)) window.open(state.isLink);
else window.open(`${state.isLink}`);
};
if (verifyUrl(<string>state.isLink)) {
window.open(state.isLink)
} else {
window.open(`${state.isLink}`)
}
}
// 监听路由的变化,设置内容
watch(
() => route.path,
() => {
state.title = <string>route.name;
state.isLink = <string>route.meta.isLink;
state.title = <string>route.name
state.isLink = <string>route.meta.isLink
},
{
immediate: true,
}
);
},
)
</script>
<style scoped lang="scss">
@@ -56,7 +59,7 @@ watch(
color: var(--el-color-primary);
&::after {
content: '';
content: "";
position: absolute;
left: 50px;
top: 0;
+93 -25
View File
@@ -167,13 +167,13 @@ export const openWindow = (url: string, title: string, w: number, h: number) =>
const width = window.innerWidth
? window.innerWidth
: document.documentElement.clientWidth
? document.documentElement.clientWidth
: screen.width
? document.documentElement.clientWidth
: screen.width
const height = window.innerHeight
? window.innerHeight
: document.documentElement.clientHeight
? document.documentElement.clientHeight
: screen.height
? document.documentElement.clientHeight
: screen.height
const left = width / 2 - w / 2 + dualScreenLeft
const top = height / 2 - h / 2 + dualScreenTop
@@ -181,13 +181,13 @@ export const openWindow = (url: string, title: string, w: number, h: number) =>
url,
title,
"toolbar=no, location=no, directories=no, status=no, menubar=no, scrollbars=no, resizable=yes, copyhistory=no, width=" +
w +
", height=" +
h +
", top=" +
top +
", left=" +
left,
w +
", height=" +
h +
", top=" +
top +
", left=" +
left,
)
}
@@ -290,25 +290,93 @@ export function postDownBlobFile(url: any, data: any, fileName: string) {
*/
export function handleBlobFile(response: any, fileName: string) {
// 处理返回的文件流
const blob = response
if (blob && blob.size === 0) {
useMessage().error("内容为空,无法下载")
// const blob = response
// if (blob && blob.size === 0) {
// 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
}
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
// 2. 验证blob类型
let blob: Blob
try {
if (response instanceof Blob) {
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)
link.click()
window.setTimeout(function () {
// @ts-ignore
URL.revokeObjectURL(blob)
document.body.removeChild(link)
}, 0)
// 6. 安全的清理操作
setTimeout(() => {
try {
window.URL.revokeObjectURL(link.href)
document.body.removeChild(link)
} catch (error) {
// 静默处理清理错误
}
}, 10)
}
/**
+80 -80
View File
@@ -133,117 +133,117 @@
</template>
<script setup lang="ts" name="wx-material">
import {fetchAccountList} from '/@/api/mp/wx-account';
import {useMessage, useMessageBox} from '/@/hooks/message';
import {BasicTableProps, useTable} from '/@/hooks/table';
import {delObj, getMaterialOther, getMaterialVideo, getPage} from '/@/api/mp/wx-material';
import { fetchAccountList } from "/@/api/mp/wx-account"
import { useMessage, useMessageBox } from "/@/hooks/message"
import { BasicTableProps, useTable } from "/@/hooks/table"
import { delObj, getMaterialOther, getMaterialVideo, getPage } from "/@/api/mp/wx-material"
const QueryTree = defineAsyncComponent(() => import('/@/components/QueryTree/index.vue'));
const NewsForm = defineAsyncComponent(() => import('./components/news-form.vue'));
const WxFileUpload = defineAsyncComponent(() => import('/@/components/Wechat/fileUpload/index.vue'));
const WxNews = defineAsyncComponent(() => import('/@/components/Wechat/wx-news/index.vue'));
const QueryTree = defineAsyncComponent(() => import("/@/components/QueryTree/index.vue"))
const NewsForm = defineAsyncComponent(() => import("./components/news-form.vue"))
const WxFileUpload = defineAsyncComponent(() => import("/@/components/Wechat/fileUpload/index.vue"))
const WxNews = defineAsyncComponent(() => import("/@/components/Wechat/wx-news/index.vue"))
const deptData = reactive({
queryList: (name?: string) => {
return fetchAccountList({
name: name,
});
})
},
});
})
const checkAppId = ref();
const checkAppId = ref()
const uploadData = ref({
appId: '',
mediaType: 'image',
title: '',
introduction: '',
});
appId: "",
mediaType: "image",
title: "",
introduction: "",
})
const materialType = ref('image');
const materialType = ref("image")
// 点击树
const handleNodeClick = (data: any) => {
checkAppId.value = data.appid;
uploadData.value.appId = data.appid;
state.queryForm.appId = data.appid;
state.queryForm.type = materialType.value;
getDataList();
};
checkAppId.value = data.appid
uploadData.value.appId = data.appid
state.queryForm.appId = data.appid
state.queryForm.type = materialType.value
getDataList()
}
const handleClick = (tab) => {
if (checkAppId.value) {
// getPage(this.page)
} else {
useMessage().error('请选择公众号');
useMessage().error("请选择公众号")
}
materialType.value = tab.paneName;
uploadData.value.mediaType = tab.paneName;
state.queryForm.type = materialType.value;
getDataList();
};
materialType.value = tab.paneName
uploadData.value.mediaType = tab.paneName
state.queryForm.type = materialType.value
getDataList()
}
const state: BasicTableProps = reactive<BasicTableProps>({
queryForm: {
appId: '',
type: '',
appId: "",
type: "",
},
pageList: getPage,
createdIsNeed: false,
props: {
item: 'items',
totalCount: 'totalCount',
item: "items",
totalCount: "totalCount",
},
});
})
const { getDataList, currentChangeHandle, sizeChangeHandle, tableStyle } = useTable(state);
const { getDataList, currentChangeHandle, sizeChangeHandle, tableStyle } = useTable(state)
const delMaterial = (item: any) => {
useMessageBox()
.confirm('此操作将永久删除该文件, 是否继续?')
.confirm("此操作将永久删除该文件, 是否继续?")
.then(() => {
delObj({
id: item.mediaId,
appId: checkAppId.value,
})
.then(() => {
getDataList();
getDataList()
})
.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 = () => {
dialogVideoVisible.value = true;
};
dialogVideoVisible.value = true
}
const uploadRules = reactive({
title: [{ required: true, message: '请输入标题', trigger: 'blur' }],
introduction: [{ required: true, message: '请输入描述', trigger: 'blur' }],
});
title: [{ 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 = () => {
uploadForm.value.validate((valid: boolean) => {
if (!valid) {
return false;
return false
}
uploadFileVideo.value.submit().then(() => {
dialogVideoVisible.value = false;
});
});
};
dialogVideoVisible.value = false
})
})
}
const handleDown = (row: any) => {
getMaterialOther({
@@ -251,25 +251,25 @@ const handleDown = (row: any) => {
fileName: row.name,
appId: checkAppId.value,
}).then((response) => {
const url = window.URL.createObjectURL(new Blob([response.data]));
const link = document.createElement('a');
link.style.display = 'none';
link.href = url;
link.setAttribute('download', row.name);
document.body.appendChild(link);
link.click();
});
};
const url = window.URL.createObjectURL(new Blob([response.data]))
const link = document.createElement("a")
link.style.display = "none"
link.href = url
link.setAttribute("download", row.name)
document.body.appendChild(link)
link.click()
})
}
// 图文
const dialogNewsRef = ref();
const dialogNewsRef = ref()
const handleAddNews = () => {
dialogNewsRef.value.openDialog({
accountId: checkAppId.value,
});
};
})
}
const handleEditNews = (item) => {
dialogNewsRef.value.openDialog(
@@ -278,9 +278,9 @@ const handleEditNews = (item) => {
},
JSON.parse(JSON.stringify(item.content.newsItem)),
item.mediaId,
'edit'
);
};
"edit",
)
}
const handleInfo = (row) => {
getMaterialVideo({
@@ -288,21 +288,21 @@ const handleInfo = (row) => {
appId: checkAppId.value,
})
.then((response) => {
const downUrl = response.data.downUrl;
window.open(downUrl, '_blank');
// const downUrl = response.data.downUrl
// window.open(downUrl, '_blank');
})
.catch((err) => {
useMessage().error(err.msg);
});
};
useMessage().error(err.msg)
})
}
// 默认选择第一个公众号
onMounted(async () => {
const { data } = await deptData.queryList();
if (data?.length > 0) {
handleNodeClick(data[0]);
}
});
const { data } = await deptData.queryList()
if (data?.length > 0) {
handleNodeClick(data[0])
}
})
</script>
<style lang="scss" scoped>
+123 -32
View File
@@ -1,46 +1,80 @@
<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="90px" v-loading="loading">
<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="120px" v-loading="loading">
<el-row :gutter="24">
<el-col :span="12" class="mb20">
<el-form-item label="包厢Id" prop="boxesId">
<el-input v-model="form.boxesId" placeholder="请输入包厢Id" />
<el-form-item label="商户" prop="merchantId">
<select-mch v-model="form.merchantId" @change="onMerchantChange" />
</el-form-item>
</el-col>
<el-col :span="12" class="mb20">
<el-form-item label="预约id" prop="bookingId">
<el-input v-model="form.bookingId" placeholder="请输入预约id" />
<el-form-item label="餐桌" prop="boxesId">
<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-col>
<el-col :span="12" class="mb20">
<el-form-item label="状态 0空闲 1已使用" prop="status">
<el-input v-model="form.status" placeholder="请输入状态 0空闲 1已使用" />
<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="用户id" prop="userId">
<el-input v-model="form.userId" placeholder="请输入用户id" />
<el-form-item label="日期" prop="bxDate">
<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-col>
<el-col :span="12" class="mb20">
<el-form-item label="格式为 YYYY-MM-DD" prop="bxDate">
<el-input v-model="form.bxDate" placeholder="请输入格式为 YYYY-MM-DD" />
<el-form-item label="开始时间" prop="startTime">
<el-time-select
v-model="form.startTime"
placeholder="请选择开始时间"
:selectable-range="getSelectableTimeRange()"
: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="hour">
<el-date-picker type="datetime" placeholder="请选择时间" v-model="form.hour" :value-format="dateTimeStr"></el-date-picker>
<el-form-item label="结束时间" prop="endTime">
<el-time-select
v-model="form.endTime"
placeholder="请选择结束时间"
:selectable-range="getSelectableTimeRange()"
:step="30"
format="HH:mm"
value-format="HH:mm"
/>
</el-form-item>
</el-col>
<el-col :span="12" class="mb20">
<el-form-item label="时间索引(0-24)" prop="hourIndex">
<el-input v-model="form.hourIndex" placeholder="请输入时间索引(0-24)" />
<el-form-item label="状态" prop="status">
<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-col>
</el-row>
@@ -58,6 +92,7 @@
import { useDict } from '/@/hooks/dict';
import { useMessage } from '/@/hooks/message';
import { getObj, addObj, putObj } from '/@/api/canteen/boxesAvailability';
import { fetchList as fetchTableList } from '/@/api/canteen/boxesInfo';
import { rule } from '/@/utils/validate';
const emit = defineEmits(['refresh']);
@@ -65,35 +100,88 @@ const emit = defineEmits(['refresh']);
const dataFormRef = ref();
const visible = ref(false);
const loading = ref(false);
// 定义字典
const { booking_status } = useDict('booking_status');
const tableList = ref<any[]>([]);
// 提交表单数据
const form = reactive({
id: '',
merchantId: '',
boxesId: '',
bookingId: '',
status: '',
userId: '',
mealType: '',
bxDate: '',
hour: '',
hourIndex: '',
startTime: '',
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) => {
visible.value = true;
form.id = '';
form.merchantId = '';
form.boxesId = '';
form.mealType = '';
form.bxDate = '';
form.startTime = '';
form.endTime = '';
form.status = 0;
form.remark = '';
tableList.value = [];
// 重置表单数据
nextTick(() => {
dataFormRef.value?.resetFields();
});
// 获取boxesAvailability信息
// 获取可用时间段信息
if (id) {
form.id = id;
getboxesAvailabilityData(id);
@@ -120,11 +208,14 @@ const onSubmit = async () => {
// 初始化表单数据
const getboxesAvailabilityData = (id: string) => {
// 获取数据
loading.value = true;
getObj(id)
.then((res: any) => {
Object.assign(form, res.data);
// 加载餐桌列表
if (form.merchantId) {
onMerchantChange(form.merchantId);
}
})
.finally(() => {
loading.value = false;
+239 -69
View File
@@ -1,84 +1,101 @@
<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="90px" v-loading="loading">
<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="120px" v-loading="loading">
<el-row :gutter="24">
<el-col :span="12" class="mb20">
<el-form-item label="包厢" prop="boxesId">
<el-input v-model="form.boxesId" placeholder="请输入包厢Id" />
<el-form-item label="商户" prop="merchantId">
<select-mch v-model="form.merchantId" @change="onMerchantChange" />
</el-form-item>
</el-col>
<el-col :span="12" class="mb20">
<el-form-item label="开始时间" prop="startTime">
<el-input v-model="form.startTime" placeholder="请输入开始时间" />
</el-form-item>
</el-col>
<el-col :span="12" class="mb20">
<el-form-item label="结束时间" prop="endTime">
<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-form-item label="餐桌" prop="boxesId">
<el-select v-model="form.boxesId" placeholder="请选择餐桌" clearable>
<el-option
v-for="item in tableList"
:key="item.id"
:label="`${item.tableNumber} - ${item.name} (${item.capacity}人)`"
:value="item.id"
/>
</el-select>
</el-form-item>
</el-col>
<el-col :span="12" class="mb20">
<el-form-item label="创建人" prop="creator">
<el-input v-model="form.creator" placeholder="请输入创建人" />
<el-form-item label="餐次类型" prop="mealType">
<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-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-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-col>
<el-col :span="12" class="mb20">
<el-form-item label="用户id" prop="userId">
<el-input v-model="form.userId" placeholder="请输入用户id" />
<el-form-item label="预约人数" prop="bookingPeople">
<el-input-number v-model="form.bookingPeople" :min="1" :max="20" placeholder="请输入预约人数" />
</el-form-item>
</el-col>
<el-col :span="12" class="mb20">
<el-form-item label="预约状态(0 预约成功,1预约失败 2取消预约 )" prop="status">
<el-select v-model="form.status" placeholder="请选择预约状态(0 预约成功,1预约失败 2取消预约 )">
<el-option label="??" :value="0" />
<el-option label="??" :value="1" />
</el-select>
<el-form-item label="开始时间" prop="startTime">
<el-time-select
v-model="form.startTime"
placeholder="请选择开始时间"
:disabled="!form.mealType || !form.bookingDate"
:selectable-range="getSelectableTimeRange()"
: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="totalPrice">
<el-input v-model="form.totalPrice" placeholder="请输入总价单位分" />
<el-form-item label="结束时间" prop="endTime">
<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-col>
</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>
<template #footer>
<span class="dialog-footer">
@@ -93,6 +110,7 @@
import { useDict } from '/@/hooks/dict';
import { useMessage } from '/@/hooks/message';
import { getObj, addObj, putObj } from '/@/api/canteen/boxesBooking';
import { fetchList as fetchTableList } from '/@/api/canteen/boxesInfo';
import { rule } from '/@/utils/validate';
const emit = defineEmits(['refresh']);
@@ -100,40 +118,170 @@ const emit = defineEmits(['refresh']);
const dataFormRef = ref();
const visible = ref(false);
const loading = ref(false);
// 定义字典
const { check_status } = useDict('check_status');
const tableList = ref<any[]>([]);
const availableTimeSlots = ref<any[]>([]);
const selectedTimeSlots = ref<any[]>([]);
// 提交表单数据
const form = reactive({
id: '',
merchantId: '',
boxesId: '',
mealType: '',
bookingDate: '',
startTime: '',
endTime: '',
checkUserId: '',
checkStatus: '',
creator: '',
updater: '',
deleted: '',
bookingDate: '',
userId: '',
status: '',
totalPrice: '',
bookingPeople: 1,
remark: '',
status: '0',
});
// 定义校验规则
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) => {
visible.value = true;
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(() => {
dataFormRef.value?.resetFields();
});
// 获取boxesBooking信息
// 获取预约信息
if (id) {
form.id = id;
getboxesBookingData(id);
@@ -160,11 +308,14 @@ const onSubmit = async () => {
// 初始化表单数据
const getboxesBookingData = (id: string) => {
// 获取数据
loading.value = true;
getObj(id)
.then((res: any) => {
Object.assign(form, res.data);
// 加载餐桌列表
if (form.merchantId) {
onMerchantChange(form.merchantId);
}
})
.finally(() => {
loading.value = false;
@@ -176,3 +327,22 @@ defineExpose({
openDialog,
});
</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>
+63 -27
View File
@@ -3,11 +3,31 @@
<div class="layout-padding-auto layout-padding-view">
<el-row v-show="showSearch">
<el-form :model="state.queryForm" ref="queryRef" :inline="true" @keyup.enter="getDataList">
<el-form-item label="餐桌" prop="boxesName">
<el-input placeholder="请输入餐桌" v-model="state.queryForm.boxesName" />
<el-form-item label="餐桌名称" prop="tableName">
<el-input placeholder="请输入餐桌名称" v-model="state.queryForm.tableName" />
</el-form-item>
<el-form-item label="用户" prop="userId">
<el-input placeholder="请输入用户" v-model="state.queryForm.userName" />
<el-form-item label="餐次类型" prop="mealType">
<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-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="index" label="#" width="50" />
<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="endTime" label="结束时间" show-overflow-tooltip min-width="160" />
<el-table-column prop="checkStatus" label="审核状态" show-overflow-tooltip min-width="160">
<el-table-column prop="mealName" label="餐次类型" show-overflow-tooltip>
</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">
<dict-tag :options="check_status" :value="scope.row.checkStatus"></dict-tag>
</template>
</el-table-column>
<el-table-column prop="bookingDate" label="预约日期" show-overflow-tooltip min-width="160" />
<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
>
<el-tag v-if="scope.row.status === 0" type="success">预约成功</el-tag>
<el-tag v-else-if="scope.row.status === 1" type="danger">预约失败</el-tag>
<el-tag v-else-if="scope.row.status === 2" type="info">取消预约</el-tag>
<el-tag v-else type="info">-</el-tag>
</template>
</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>
<pagination @size-change="sizeChangeHandle" @current-change="currentChangeHandle" v-bind="state.pagination" />
</div>
+75 -28
View File
@@ -1,45 +1,59 @@
<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="90px" v-loading="loading">
<el-form ref="dataFormRef" :model="form" :rules="dataRules" label-width="90px" v-loading="loading">
<el-row :gutter="24">
<el-col :span="14" class="mb20">
<el-col :span="12" class="mb20">
<el-form-item label="商户" prop="merchantId">
<select-mch v-model="form.merchantId" />
</el-form-item>
</el-col>
<el-col :span="14" class="mb20">
<el-form-item label="包厢名称" prop="name">
<el-input v-model="form.name" placeholder="请输入包厢名称" />
<el-col :span="12" class="mb20">
<el-form-item label="餐桌编号" prop="tableNumber">
<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-col>
<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>
</el-form-item>
</el-col>
<el-col :span="14" class="mb20">
<el-col :span="12" class="mb20">
<el-form-item label="容纳人数" prop="capacity">
<el-input v-model="form.capacity" placeholder="请输入容纳人数" />
</el-form-item>
</el-col>
<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 :label="item.value" v-for="(item, index) in boxes_status" border :key="index">{{ item.label }} </el-radio>
</el-radio-group>
</el-form-item>
</el-col>
<el-col :span="24" class="mb20">
<el-form-item label="包厢地址" prop="address">
<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 label="餐桌摆放形式" prop="address">
<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-col>-->
</el-row>
</el-form>
<template #footer>
@@ -52,6 +66,7 @@
</template>
<script setup lang="ts" name="BoxesInfoDialog">
import { ref, reactive, nextTick } from 'vue';
import { useDict } from '/@/hooks/dict';
import { useMessage } from '/@/hooks/message';
import { getObj, addObj, putObj } from '/@/api/canteen/boxesInfo';
@@ -68,7 +83,9 @@ const { boxes_status } = useDict('boxes_status');
// 提交表单数据
const form = reactive({
id: '',
tableNumber: '',
name: '',
tableType: '',
capacity: '',
description: '',
address: '',
@@ -80,23 +97,32 @@ const form = reactive({
// 定义校验规则
const dataRules = ref({
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: [
{ required: true, message: '容纳人数不能为空', trigger: 'blur' },
{ validator: rule.number, trigger: 'blur' },
],
images: [{ required: true, message: '包厢图片不能为空', trigger: 'blur' }],
// 图片字段暂时不设为必填,方便测试
// images: [{ required: true, message: '餐桌图片不能为空', trigger: 'blur' }],
});
// 打开弹窗
const openDialog = (id: string) => {
visible.value = true;
form.id = '';
// 重置表单数据
nextTick(() => {
dataFormRef.value?.resetFields();
});
form.id = '';
form.tableNumber = '';
form.name = '';
form.tableType = '';
form.capacity = '';
form.description = '';
form.address = '';
form.images = '';
form.status = '0';
form.merchantId = '';
// 获取boxesInfo信息
if (id) {
@@ -112,12 +138,23 @@ const onSubmit = async () => {
try {
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 ? '修改成功' : '添加成功');
visible.value = false;
emit('refresh');
} catch (err: any) {
useMessage().error(err.msg);
useMessage().error(err.msg || err.message || '操作失败');
} finally {
loading.value = false;
}
@@ -129,9 +166,19 @@ const getboxesInfoData = (id: string) => {
loading.value = true;
getObj(id)
.then((res: any) => {
Object.assign(form, res.data, {
status: '' + res.data.status,
});
if (res.data) {
// 确保数据类型正确
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(() => {
loading.value = false;
+29 -2
View File
@@ -3,9 +3,20 @@
<div class="layout-padding-auto layout-padding-view">
<el-row v-show="showSearch">
<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-input placeholder="请输入餐桌名称" v-model="state.queryForm.name" />
</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-button icon="search" type="primary" @click="getDataList">查询</el-button>
<el-button icon="Refresh" @click="resetQuery">重置</el-button>
@@ -14,7 +25,7 @@
</el-row>
<el-row>
<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
@@ -27,7 +38,7 @@
>
删 除
</el-button>
<el-button plain type="primary" @click="showList = false">排期详情</el-button>
<!-- <el-button plain type="primary" @click="showList = false">排期详情</el-button>-->
<right-toolbar
v-model:showSearch="showSearch"
:export="'canteen_boxesInfo_export'"
@@ -38,6 +49,7 @@
></right-toolbar>
</div>
</el-row>
<el-table
:data="state.dataList"
v-loading="state.loading"
@@ -49,7 +61,17 @@
>
<el-table-column type="selection" width="40" align="center" />
<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="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="description" 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)
}
}
// 新增操作
const handleAdd = () => {
formDialogRef.value?.openDialog();
}
</script>
@@ -62,6 +62,7 @@
<el-form-item>
<el-button icon="search" type="primary" @click="getDataList">查询</el-button>
<el-button icon="Refresh" @click="resetQuery">重置</el-button>
<el-button icon="Refresh" @click="foodMultipleTableRef.clearSelection()">取消所有勾选</el-button>
</el-form-item>
</el-form>
</el-row>
+6 -5
View File
@@ -22,11 +22,11 @@
<el-input-number v-model="form.price" :min="0" :precision="2" placeholder="请输入商品价格" />
</el-form-item>
</el-col>
<!-- <el-col :span="14" class="mb20">-->
<!-- <el-form-item label="市场价" prop="marketPrice">-->
<!-- <el-input-number v-model="form.marketPrice" :min="0" :precision="2" placeholder="请输入市场价" />-->
<!-- </el-form-item>-->
<!-- </el-col>-->
<!-- <el-col :span="14" class="mb20">-->
<!-- <el-form-item label="市场价" prop="marketPrice">-->
<!-- <el-input-number v-model="form.marketPrice" :min="0" :precision="2" placeholder="请输入市场价" />-->
<!-- </el-form-item>-->
<!-- </el-col>-->
<el-col :span="14" class="mb20">
<el-form-item label="库存" prop="stock">
<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, "")),
marketPrice: Number(displayPrice(res.data.marketPrice, "")),
status: "" + res.data.status,
description: res.data.description ?? "",
})
})
.finally(() => {
+19 -3
View File
@@ -83,6 +83,12 @@
<dict-tag :options="spu_status" :value="scope.row.status" />
</template>
</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">
<template #default="scope">
{{ displayPrice(scope.row.price) }}
@@ -118,8 +124,8 @@
<!-- 编辑、新增 -->
<form-dialog ref="formDialogRef" @refresh="getDataList(false)" />
<!-- 关联每日菜品 -->
<export-form-dialog ref="exportFormDialogRef" @refresh="getDataList(false)" />
<!-- 导入每日菜品 -->
<export-form-dialog ref="exportFormDialogRef" @refresh="exportRefresh" />
</div>
</template>
@@ -151,13 +157,17 @@ const state: BasicTableProps = reactive<BasicTableProps>({
})
onMounted(async () => {
await getCanteenOnlineCategoryAll()
})
const getCanteenOnlineCategoryAll = async () => {
try {
const res = await getCanteenOnlineCategory()
categoryOptions.value = res.data.records
} catch (error) {
categoryOptions.value = []
}
})
}
const { getDataList, currentChangeHandle, sizeChangeHandle, sortChangeHandle, downBlobFile, tableStyle } = useTable(state)
@@ -197,4 +207,10 @@ const handleDelete = async (ids: string[]) => {
useMessage().error(err.msg)
}
}
// 导入每日菜品成功刷新
const exportRefresh = () => {
getDataList(false)
getCanteenOnlineCategoryAll()
}
</script>
+213
View File
@@ -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>
+121
View File
@@ -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"
:edit-rules="validRules"
show-footer
:footer-data="[{ seq: '合计', totalAmount }]"
:merge-footer-items="[{ row: 0, col: 2, rowspan: 1, colspan: 7 }]"
:footer-data="[
{
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-change=""
size="mini"
@@ -148,7 +156,7 @@
<el-input-number v-if="row.selectedUnitObj" v-model="row.selectedUnitObj.totalAmount" :min="0" :precision="2" />
</template>
<template #footer="{ row }">
<span style="color: #2e5cf6; font-weight: bold">{{ totalAmount }} 元</span>
<span style="color: #2e5cf6; font-weight: bold">{{ total.totalAmount }}元</span>
</template>
</vxe-column>
<vxe-column field="remark" title="备注" :edit-render="{ autoFocus: 'input', placeholder: '请输入' }">
@@ -235,9 +243,15 @@ const validRules = ref<VxeTablePropTypes.EditRules<any>>({
})
// 合计总金额
const totalAmount = computed(() =>
vxeTableData.value.reduce((sum: any, row: any) => sum + Number(row.selectedUnitObj?.totalAmount || 0), 0).toFixed(2),
)
const total = computed(() => {
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 () => {
await getInitData()
@@ -97,8 +97,16 @@
:data="vxeTableData"
:edit-rules="validRules"
show-footer
:footer-data="[{ seq: '合计', totalAmount }]"
:merge-footer-items="[{ row: 0, col: 2, rowspan: 1, colspan: 7 }]"
:footer-data="[
{
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-change=""
size="mini"
@@ -144,9 +152,9 @@
v-model="row.quantity"
:min="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>
</vxe-column>
<vxe-column field="purchasePrice" title="原进价">
@@ -154,11 +162,11 @@
{{ displayPrice(row.selectedUnitObj?.purchasePrice || 0) }}
</template>
</vxe-column>
<vxe-column field="realPrice" title="实际进价" :edit-render="{ autoFocus: 'input', placeholder: '请输入' }">
<vxe-column field="realPrice" title="实际进价">
<template #default="{ row }">
{{ row?.selectedUnitObj?.realPrice || 0 }}
</template>
<template #edit="{ row, $rowIndex }">
<!-- <template #edit="{ row, $rowIndex }">
<el-input-number
v-if="row.selectedUnitObj"
v-model="row.selectedUnitObj.realPrice"
@@ -166,17 +174,23 @@
:precision="2"
@change="onRowValueChange(row, $rowIndex)"
/>
</template>
</template> -->
</vxe-column>
<vxe-column field="totalAmount" title="累计总金额" :edit-render="{ autoFocus: 'input', placeholder: '请输入' }">
<template #default="{ row }">
{{ row?.selectedUnitObj?.totalAmount }}
</template>
<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 #footer="{ row }">
<span style="color: #2e5cf6; font-weight: bold">{{ totalAmount }} 元</span>
<span style="color: #2e5cf6; font-weight: bold">{{ total.totalAmount }}元</span>
</template>
</vxe-column>
<vxe-column field="remark" title="备注" :edit-render="{ autoFocus: 'input', placeholder: '请输入' }">
@@ -263,9 +277,15 @@ const validRules = ref<VxeTablePropTypes.EditRules<any>>({
})
// 合计总金额
const totalAmount = computed(() =>
vxeTableData.value.reduce((sum: any, row: any) => sum + Number(row.selectedUnitObj?.totalAmount || 0), 0).toFixed(2),
)
const total = computed(() => {
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 () => {
await getInitData()
@@ -364,9 +384,15 @@ const onUnitChange = (row: any) => {
row.selectedUnitObj.totalAmount = Number((row.quantity * Number(row.selectedUnitObj.realPrice || 0)).toFixed(2))
}
// 数量、进价变动联动
const onRowValueChange = (row: any, $rowIndex: number) => {
row.selectedUnitObj.totalAmount = Number((row.quantity * Number(row.selectedUnitObj.realPrice || 0)).toFixed(2))
// 数量变动
const onQuantityChange = (row: any, $rowIndex: number) => {
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数据
@@ -15,9 +15,6 @@
value-format="YYYY-MM-DD"
/>
</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-button icon="search" type="primary" @click="getDataList">查询</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 prop="inventoryCode" 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="handlerUserName" label="经办人" show-overflow-tooltip /> -->
<el-table-column prop="productName" 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 label="操作" width="150">