This commit is contained in:
TimSpan 2025-05-23 16:54:18 +08:00
commit e4b976697e
9 changed files with 356 additions and 191 deletions

View File

@ -67,7 +67,7 @@
],
series: [
{
name: "贯通率",
name: "中学",
type: "line",
smooth: true,
showAllSymbol: true,
@ -83,7 +83,7 @@
data: val.rateData,
},
{
name: "已贯通",
name: "小学",
type: "bar",
barWidth: 10,
itemStyle: {
@ -98,7 +98,7 @@
data: val.barData,
},
{
name: "计划贯通",
name: "幼儿园",
type: "bar",
barGap: "-100%",
barWidth: 10,

View File

@ -40,7 +40,7 @@
18092, 20728, 24045, 28348, 32808, 36097, 39867, 44715, 48444, 50415,
56061, 62677, 59521, 67560, 18092, 20728, 24045, 28348, 32808, 36097,
39867, 44715, 48444, 50415, 36097, 39867, 44715, 48444, 50415, 50061,
32677, 49521, 32808,
32677, 49521, 808,
],
barData: [
4600, 5000, 5500, 6500, 7500, 8500, 9900, 12500, 14000, 21500, 23200,

View File

@ -164,15 +164,15 @@
max: val.maxData
},
{
name: "品质量",
name: "品质量",
max: 10
},
{
name: "任务效率",
name: "用户数量",
max: 12
},
{
name: "售后保障",
name: "卫生保障",
max: 3.5
}
]

View File

@ -20,7 +20,7 @@
<span>
<i class="iconfont icon-tongji2"></i>
</span>
<span class="fs-xl text mx-2 mb-1" style="font-size: 12px">年度负责人组件达标榜</span>
<span class="fs-xl text mx-2 mb-1" style="font-size: 12px">年度负责人</span>
<dv-scroll-ranking-board
class="dv-scr-rank-board"
:config="ranking"
@ -59,28 +59,28 @@
//
const titleDate = [
{
number: 1020,
text: "今年累计任务建次数",
number: 2,
text: "今年原料快检",
},
{
number: 18,
text: "本月累计任务次数",
text: "月度原料抽检",
},
{
number: 0,
text: "厨具快检",
},
{
number: 0,
text: "今日异常",
},
{
number: 4,
text: "今日累计任务次数",
text: "管控排查",
},
{
number: 71,
text: "今年失败任务次数",
},
{
number: 949,
text: "今年失败成功次数",
},
{
number: 811,
text: "今年达标任务个数",
number: 1,
text: "整改追踪",
},
];
@ -112,19 +112,19 @@
//
const ranking = reactive({
data: [
{ name: "周口", value: 55 },
{ name: "南阳", value: 120 },
{ name: "西峡", value: 78 },
{ name: "驻马店", value: 66 },
{ name: "新乡", value: 80 },
{ name: "新乡2", value: 80 },
{ name: "新乡3", value: 80 },
{ name: "新乡4", value: 80 },
{ name: "新乡5", value: 80 },
{ name: "新乡6", value: 80 },
{ name: "某某小学刘主管", value: 55 },
{ name: "某某中学李主管", value: 120 },
{ name: "某某幼儿园张主管", value: 78 },
{ name: "某某中学王主管", value: 66 },
{ name: "某某幼儿园关主管", value: 80 },
{ name: "某某小学龙主管", value: 80 },
{ name: "某某中学罗主管", value: 80 },
{ name: "某某小学卞主管", value: 80 },
{ name: "某某中学张主管", value: 80 },
{ name: "某某小学张主管", value: 80 },
],
carousel: "single",
unit: "",
unit: "",
});
//

View File

@ -10,12 +10,12 @@
let intervalInstance = null;
const cdata = reactive({
indicatorData: [
{ name: "数据1", max: 300 },
{ name: "数据2", max: 250 },
{ name: "数据3", max: 300 },
{ name: "数据4", max: 5 },
{ name: "数据5", max: 200 },
{ name: "数据6", max: 100 }
{ name: "辣椒炒肉", max: 300 },
{ name: "胡萝卜炒肉", max: 250 },
{ name: "土豆炖牛肉", max: 300 },
{ name: "蔬菜沙拉", max: 5 },
{ name: "豉油肉沫蒸水蛋", max: 200 },
{ name: "白灼虾", max: 100 }
],
dataBJ: [
[94, 69, 114, 2.08, 73, 39, 22],

View File

@ -23,11 +23,11 @@
import Chart from "./chart/index.vue";
const config = reactive({
data: [
{ name: "南阳", value: 167 },
{ name: "周口", value: 67 },
{ name: "漯河", value: 123 },
{ name: "郑州", value: 55 },
{ name: "西峡", value: 98 },
{ name: "中学", value: 167 },
{ name: "小学", value: 67 },
{ name: "幼儿园", value: 123 },
{ name: "中学", value: 55 },
{ name: "小学", value: 98 },
],
});
</script>

View File

@ -6,7 +6,7 @@
<i class="iconfont icon-vector" />
</span>
<div class="d-flex">
<span class="fs-xl text mx-2" style="font-size: 12px">任务完成排行榜</span>
<span class="fs-xl text mx-2" style="font-size: 12px">排行榜综合TOP10</span>
</div>
</div>
<div class="d-flex mt-1 jc-center body-box">
@ -23,18 +23,18 @@
import { reactive } from "vue";
const config = reactive({
header: ["组件", "分支", "覆盖率"],
header: ["学校", "厨师名", "点赞数"],
data: [
["组件1", "dev-1", "<span class='colorGrass'>↑75%</span>"],
["组件2", "dev-2", "<span class='colorRed'>↓33%</span>"],
["组件3", "dev-3", "<span class='colorGrass'>↑100%</span>"],
["组件4", "rea-1", "<span class='colorGrass'>↑94%</span>"],
["组件5", "rea-2", "<span class='colorGrass'>↑95%</span>"],
["组件6", "fix-2", "<span class='colorGrass'>↑63%</span>"],
["组件7", "fix-4", "<span class='colorGrass'>↑84%</span>"],
["组件8", "fix-7", "<span class='colorRed'>↓46%</span>"],
["组件9", "dev-2", "<span class='colorRed'>↓13%</span>"],
["组件10", "dev-9", "<span class='colorGrass'>↑76%</span>"],
["中学", "李1", "<span class='colorGrass'>↑750</span>"],
["小学", "李2", "<span class='colorRed'>↓73</span>"],
["幼儿园", "李3", "<span class='colorGrass'>↑190</span>"],
["小学", "张1", "<span class='colorGrass'>↑940</span>"],
["幼儿园", "张2", "<span class='colorGrass'>↑195</span>"],
["中学", "刘2", "<span class='colorGrass'>↑163</span>"],
["小学", "刘4", "<span class='colorGrass'>↑184</span>"],
["小学", "刘7", "<span class='colorRed'>↓146</span>"],
["中学", "曹2", "<span class='colorRed'>↓130</span>"],
["中学", "曹9", "<span class='colorGrass'>↑176</span>"],
],
rowNum: 7, //
headerHeight: 35,

View File

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

View File

@ -1,11 +1,279 @@
<script setup lang="ts">
</script>
<!-- 每日菜谱 -->
<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>
<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>