kevinMao
/
canteen_system
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

大屏

This commit is contained in:
wangyilin 2025-05-23 16:40:31 +08:00
parent 45589016a0
commit 5fb3fafad5
2 changed files with 300 additions and 135 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

153
src/views/smartRecipes/dailyRecipes/index.vue
View File

@ -50,14 +50,7 @@
createTime: "2025-04-30", createTime: "2025-04-30",
endTime: "2025-05-18", endTime: "2025-05-18",
id: "1917456673534976001", id: "1917456673534976001",
Monday: today:
"紫苏洋葱炒鸡/冬瓜炒肉片/红腰豆焖鸭/酸甜锅包肉/肉沫粉丝蒸水蛋/例汤",
Tuesday:
"紫苏洋葱炒鸡/冬瓜炒肉片/红腰豆焖鸭/酸甜锅包肉/肉沫粉丝蒸水蛋/例汤",
Wednesday:
"紫苏洋葱炒鸡/冬瓜炒肉片/红腰豆焖鸭/酸甜锅包肉/肉沫粉丝蒸水蛋/例汤",
Thursday: "",
Friday:
"紫苏洋葱炒鸡/冬瓜炒肉片/红腰豆焖鸭/酸甜锅包肉/肉沫粉丝蒸水蛋/例汤", "紫苏洋葱炒鸡/冬瓜炒肉片/红腰豆焖鸭/酸甜锅包肉/肉沫粉丝蒸水蛋/例汤",
Saturday: "", Saturday: "",
Sunday: "", Sunday: "",
@ -66,17 +59,11 @@
{ {
companyName: "南头央厨", companyName: "南头央厨",
deptName: "南头升辉小学", deptName: "南头升辉小学",
type: "午餐", type: "晚餐",
createTime: "2025-04-30", createTime: "2025-04-30",
endTime: "2025-05-18", endTime: "2025-05-18",
id: "1917456673534976001", id: "1917456673534976001",
Monday: today:
"紫苏洋葱炒鸡/冬瓜炒肉片/红腰豆焖鸭/酸甜锅包肉/肉沫粉丝蒸水蛋/例汤",
Tuesday:
"紫苏洋葱炒鸡/冬瓜炒肉片/红腰豆焖鸭/酸甜锅包肉/肉沫粉丝蒸水蛋/例汤",
Wednesday: "",
Thursday: "",
Friday:
"紫苏洋葱炒鸡/冬瓜炒肉片/红腰豆焖鸭/酸甜锅包肉/肉沫粉丝蒸水蛋/例汤", "紫苏洋葱炒鸡/冬瓜炒肉片/红腰豆焖鸭/酸甜锅包肉/肉沫粉丝蒸水蛋/例汤",
Saturday: "", Saturday: "",
Sunday: "", Sunday: "",
@ -95,6 +82,24 @@
type: "input", type: "input",
label: "商品名称", label: "商品名称",
}, },
type:{
type:'select',
label: '餐次',
options:[
{
value:'早餐',
label:'早餐'
},
{
value:'中餐',
label:'中餐'
},
{
value:'晚餐',
label:'晚餐'
}
]
}
}); });
const columns = ref<TableType["columns"]>([ const columns = ref<TableType["columns"]>([
@ -130,121 +135,13 @@
title: "结束日期", title: "结束日期",
}, },
{ {
key: "Monday", key: "today",
title: "星期一", title: "当天",
width: 100, width: 100,
render: ({ Monday }) => { render: ({ today }) => {
return ( return (
<div> <div>
{Monday.split("/").map( {today.split("/").map(
(item: any, index: PropertyKey | undefined) => (
<NPerformantEllipsis style={{ maxWidth: "100px" }}>
{item}
</NPerformantEllipsis>
)
)}
</div>
);
},
},
{
key: "Tuesday",
title: "星期二",
width: 100,
render: ({ Tuesday }) => {
return (
<div>
{Tuesday.split("/").map(
(item: any, index: PropertyKey | undefined) => (
<NPerformantEllipsis style={{ maxWidth: "100px" }}>
{item}
</NPerformantEllipsis>
)
)}
</div>
);
},
},
{
key: "Wednesday",
title: "星期三",
width: 100,
render: ({ Wednesday }) => {
return (
<div>
{Wednesday.split("/").map(
(item: any, index: PropertyKey | undefined) => (
<NPerformantEllipsis style={{ maxWidth: "100px" }}>
{item}
</NPerformantEllipsis>
)
)}
</div>
);
},
},
{
key: "Thursday",
title: "星期四",
width: 100,
render: ({ Thursday }) => {
return (
<div>
{Thursday.split("/").map(
(item: any, index: PropertyKey | undefined) => (
<NPerformantEllipsis style={{ maxWidth: "100px" }}>
{item}
</NPerformantEllipsis>
)
)}
</div>
);
},
},
{
key: "Friday",
title: "星期五",
width: 100,
render: ({ Friday }) => {
return (
<div>
{Friday.split("/").map(
(item: any, index: PropertyKey | undefined) => (
<NPerformantEllipsis style={{ maxWidth: "100px" }}>
{item}
</NPerformantEllipsis>
)
)}
</div>
);
},
},
{
key: "Saturday",
title: "星期六",
width: 100,
render: ({ Saturday }) => {
return (
<div>
{Saturday.split("/").map(
(item: any, index: PropertyKey | undefined) => (
<NPerformantEllipsis style={{ maxWidth: "100px" }}>
{item}
</NPerformantEllipsis>
)
)}
</div>
);
},
},
{
key: "Sunday",
title: "星期日",
width: 100,
render: ({ Sunday }) => {
return (
<div>
{Sunday.split("/").map(
(item: any, index: PropertyKey | undefined) => ( (item: any, index: PropertyKey | undefined) => (
<NPerformantEllipsis style={{ maxWidth: "100px" }}> <NPerformantEllipsis style={{ maxWidth: "100px" }}>
{item} {item}

282
src/views/smartRecipes/menuManagement/index.vue
View File

@ -1,11 +1,279 @@
<script setup lang="ts"> <!-- 每日菜谱 -->
</script>
<template> <template>
<div>菜单管理</div> <div>
<TablePro
ref="tableRef"
:request-api="reqApi"
:search-form-options="searchFormOptions"
:columns="columns"
:isPageTable="true"
:single-line="false"
>
<template #headerExtra>
<n-button
strong
secondary
type="primary"
>
添加
</n-button>
<n-button style="margin-left: 10px">清空</n-button>
<n-button style="margin-left: 10px">打印</n-button>
</template>
</TablePro>
</div>
</template> </template>
<script setup lang="tsx">
import {
TablePro,
type TableProProps,
FormPro,
type FormItemOptions,
type TableProInst,
Icon,
} from "@/components";
import { NPerformantEllipsis, NPopconfirm, NTag } from "naive-ui";
const tableRef = useTemplateRef<TableProInst>("tableRef");
const reqApi: TableType["requestApi"] = (params) => {
return new Promise((resolve) => {
resolve({
code: 200,
data: {
current: "1",
// @ts-ignore
pages: "2",
records: [
{
companyName: "南头央厨",
deptName: "南头升辉小学",
type: "午餐",
createTime: "2025-04-30",
endTime: "2025-05-18",
id: "1917456673534976001",
Monday:
"紫苏洋葱炒鸡/冬瓜炒肉片/红腰豆焖鸭/酸甜锅包肉/肉沫粉丝蒸水蛋/例汤",
Tuesday:
"紫苏洋葱炒鸡/冬瓜炒肉片/红腰豆焖鸭/酸甜锅包肉/肉沫粉丝蒸水蛋/例汤",
Wednesday:
"紫苏洋葱炒鸡/冬瓜炒肉片/红腰豆焖鸭/酸甜锅包肉/肉沫粉丝蒸水蛋/例汤",
Thursday: "",
Friday:
"紫苏洋葱炒鸡/冬瓜炒肉片/红腰豆焖鸭/酸甜锅包肉/肉沫粉丝蒸水蛋/例汤",
Saturday: "",
Sunday: "",
},
<style scoped lang="scss"> {
companyName: "南头央厨",
deptName: "南头升辉小学",
type: "午餐",
createTime: "2025-04-30",
endTime: "2025-05-18",
id: "1917456673534976001",
Monday:
"紫苏洋葱炒鸡/冬瓜炒肉片/红腰豆焖鸭/酸甜锅包肉/肉沫粉丝蒸水蛋/例汤",
Tuesday:
"紫苏洋葱炒鸡/冬瓜炒肉片/红腰豆焖鸭/酸甜锅包肉/肉沫粉丝蒸水蛋/例汤",
Wednesday: "",
Thursday: "",
Friday:
"紫苏洋葱炒鸡/冬瓜炒肉片/红腰豆焖鸭/酸甜锅包肉/肉沫粉丝蒸水蛋/例汤",
Saturday: "",
Sunday: "",
},
],
size: "10",
total: "12",
},
message: "操作成功！",
});
});
};
type TableType = TableProProps<any, any>;
const searchFormOptions = reactive<TableType["searchFormOptions"]>({
name: {
type: "input",
label: "商品名称",
},
});
</style> const columns = ref<TableType["columns"]>([
{
key: "companyName",
title: "所属项目",
width: 200,
render: ({ companyName }) => {
return (
<NPerformantEllipsis style={{ maxWidth: "200px" }}>
{companyName}
</NPerformantEllipsis>
);
},
},
{
key: "deptName",
title: "所属客户",
},
{
key: "type",
title: "餐别",
render: ({ type }) => {
return <NTag type="success">{type}</NTag>;
},
},
{
key: "createTime",
title: "开始日期",
},
{
key: "endTime",
title: "结束日期",
},
{
key: "Monday",
title: "星期一",
width: 100,
render: ({ Monday }) => {
return (
<div>
{Monday.split("/").map(
(item: any, index: PropertyKey | undefined) => (
<NPerformantEllipsis style={{ maxWidth: "100px" }}>
{item}
</NPerformantEllipsis>
)
)}
</div>
);
},
},
{
key: "Tuesday",
title: "星期二",
width: 100,
render: ({ Tuesday }) => {
return (
<div>
{Tuesday.split("/").map(
(item: any, index: PropertyKey | undefined) => (
<NPerformantEllipsis style={{ maxWidth: "100px" }}>
{item}
</NPerformantEllipsis>
)
)}
</div>
);
},
},
{
key: "Wednesday",
title: "星期三",
width: 100,
render: ({ Wednesday }) => {
return (
<div>
{Wednesday.split("/").map(
(item: any, index: PropertyKey | undefined) => (
<NPerformantEllipsis style={{ maxWidth: "100px" }}>
{item}
</NPerformantEllipsis>
)
)}
</div>
);
},
},
{
key: "Thursday",
title: "星期四",
width: 100,
render: ({ Thursday }) => {
return (
<div>
{Thursday.split("/").map(
(item: any, index: PropertyKey | undefined) => (
<NPerformantEllipsis style={{ maxWidth: "100px" }}>
{item}
</NPerformantEllipsis>
)
)}
</div>
);
},
},
{
key: "Friday",
title: "星期五",
width: 100,
render: ({ Friday }) => {
return (
<div>
{Friday.split("/").map(
(item: any, index: PropertyKey | undefined) => (
<NPerformantEllipsis style={{ maxWidth: "100px" }}>
{item}
</NPerformantEllipsis>
)
)}
</div>
);
},
},
{
key: "Saturday",
title: "星期六",
width: 100,
render: ({ Saturday }) => {
return (
<div>
{Saturday.split("/").map(
(item: any, index: PropertyKey | undefined) => (
<NPerformantEllipsis style={{ maxWidth: "100px" }}>
{item}
</NPerformantEllipsis>
)
)}
</div>
);
},
},
{
key: "Sunday",
title: "星期日",
width: 100,
render: ({ Sunday }) => {
return (
<div>
{Sunday.split("/").map(
(item: any, index: PropertyKey | undefined) => (
<NPerformantEllipsis style={{ maxWidth: "100px" }}>
{item}
</NPerformantEllipsis>
)
)}
</div>
);
},
},
{
key: '',
title: "操作",
render: (value) => {
return (
<div style={{ display: "flex" }}>
<n-button
strong
secondary
style={{ marginLeft: "10px" }}
type="warning"
onClick={() => {}}
>
修改
</n-button>
</div>
);
},
}
]);
</script>
<style scoped lang="scss"></style>