角色管理编写
This commit is contained in:
parent
6c29e263d8
commit
e2a27af64c
|
|
@ -7,6 +7,7 @@
|
|||
:search-form-options="searchFormOptions"
|
||||
:columns="columns"
|
||||
:isPageTable="true"
|
||||
:single-line="false"
|
||||
>
|
||||
<template #headerExtra>
|
||||
<n-button
|
||||
|
|
|
|||
|
|
@ -1,6 +1,7 @@
|
|||
<template>
|
||||
<div class="departmentStructure">
|
||||
<TablePro ref="tableRef" :request-api="reqApi" :search-form-options="searchFormOptions" :columns="columns"
|
||||
:single-line="false"
|
||||
:isPageTable="true">
|
||||
<template #headerExtra>
|
||||
<n-button strong secondary type="primary" @click="addDepartmentStructure"> 添加库存</n-button>
|
||||
|
|
|
|||
|
|
@ -6,6 +6,7 @@
|
|||
:search-form-options="searchFormOptions"
|
||||
:columns="columns"
|
||||
:isPageTable="true"
|
||||
:single-line="false"
|
||||
/>
|
||||
</div>
|
||||
</template>
|
||||
|
|
|
|||
|
|
@ -7,6 +7,7 @@
|
|||
:search-form-options="searchFormOptions"
|
||||
:columns="columns"
|
||||
:isPageTable="true"
|
||||
:single-line="false"
|
||||
>
|
||||
<template #headerExtra>
|
||||
<!-- <n-button
|
||||
|
|
|
|||
|
|
@ -7,6 +7,7 @@
|
|||
:search-form-options="searchFormOptions"
|
||||
:columns="columns"
|
||||
:isPageTable="true"
|
||||
:single-line="false"
|
||||
>
|
||||
<template #headerExtra>
|
||||
<n-button
|
||||
|
|
|
|||
|
|
@ -7,6 +7,7 @@
|
|||
:search-form-options="searchFormOptions"
|
||||
:columns="columns"
|
||||
:isPageTable="true"
|
||||
:single-line="false"
|
||||
>
|
||||
<template #headerExtra>
|
||||
<n-button
|
||||
|
|
@ -254,6 +255,25 @@
|
|||
);
|
||||
},
|
||||
},
|
||||
{
|
||||
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>
|
||||
|
|
|
|||
|
|
@ -145,17 +145,38 @@
|
|||
{
|
||||
key: "adaptableGroupStr",
|
||||
title: "适应人群",
|
||||
width: 130
|
||||
width: 130,
|
||||
render: (value: any) => {
|
||||
return (
|
||||
<n-tag type="success">
|
||||
{value.adaptableGroupStr}
|
||||
</n-tag>
|
||||
);
|
||||
}
|
||||
},
|
||||
{
|
||||
key: "dishTypesStr",
|
||||
title: "菜品类别",
|
||||
width: 130
|
||||
width: 130,
|
||||
render: (value: any) => {
|
||||
return (
|
||||
<n-tag type="success">
|
||||
{value.dishTypesStr}
|
||||
</n-tag>
|
||||
);
|
||||
}
|
||||
},
|
||||
{
|
||||
key: "spicinessStr",
|
||||
title: "辣度",
|
||||
width: 130
|
||||
width: 130,
|
||||
render: (value: any) => {
|
||||
return (
|
||||
<n-tag type="success">
|
||||
{value.spicinessStr}
|
||||
</n-tag>
|
||||
);
|
||||
}
|
||||
},
|
||||
{
|
||||
key: "image",
|
||||
|
|
|
|||
|
|
@ -7,6 +7,7 @@
|
|||
:search-form-options="searchFormOptions"
|
||||
:columns="columns"
|
||||
:isPageTable="true"
|
||||
:single-line="false"
|
||||
>
|
||||
<template #headerExtra>
|
||||
<n-button
|
||||
|
|
|
|||
|
|
@ -1,42 +0,0 @@
|
|||
import api from "@/axios";
|
||||
import { NTag } from "naive-ui";
|
||||
import type { AuthMenuTree } from "@/stores/permission";
|
||||
import type { TreeOption } from "naive-ui";
|
||||
import { Icon } from "@/components";
|
||||
import { isEmpty } from "lodash-es";
|
||||
const convertTreeOptions = (data: AuthMenuTree[]): TreeOption[] => {
|
||||
return data.map((item) => {
|
||||
const opt: TreeOption = {
|
||||
label: item.name,
|
||||
key: item.snowFlakeId,
|
||||
prefix: () => <Icon name={item.icon}></Icon>,
|
||||
suffix: () => {
|
||||
switch (item.type.value) {
|
||||
case "dir":
|
||||
return <NTag type="info">目录</NTag>;
|
||||
case "menu":
|
||||
return <NTag type="success">菜单</NTag>;
|
||||
case "btn":
|
||||
return <NTag type="warning">按钮</NTag>;
|
||||
}
|
||||
},
|
||||
// item.type.value === "dir" ? (
|
||||
// <NTag type="info">目录</NTag>
|
||||
// ) : (
|
||||
// <NTag type="success">菜单</NTag>
|
||||
// ),
|
||||
};
|
||||
if (!isEmpty(item.children)) {
|
||||
opt.children = convertTreeOptions(item.children as AuthMenuTree[]);
|
||||
}
|
||||
return opt;
|
||||
});
|
||||
};
|
||||
|
||||
export const getTreeOptions = async () => {
|
||||
const treeData = await api.get("/management/menu/menuTableTree");
|
||||
const menus: TreeOption[] = convertTreeOptions(
|
||||
treeData.data as AuthMenuTree[]
|
||||
);
|
||||
return menus;
|
||||
};
|
||||
|
|
@ -1,6 +1,41 @@
|
|||
export interface roleSaveOrUpdate {
|
||||
snowFlakeId?:string;
|
||||
name: string;
|
||||
status:string;
|
||||
remark?:string
|
||||
}
|
||||
name?: string;
|
||||
status?:string;
|
||||
remarks?:string;
|
||||
founder?:string;
|
||||
updateTime?:string
|
||||
}
|
||||
|
||||
const datalistRole:roleSaveOrUpdate[] = [
|
||||
{
|
||||
name:'操作员',
|
||||
status:'启用',
|
||||
remarks:'超级管理员',
|
||||
founder:'管理员',
|
||||
updateTime:'2025-5-4 15:14:25'
|
||||
},
|
||||
{
|
||||
name:'超级管理员',
|
||||
status:'禁用',
|
||||
remarks:'超级管理员',
|
||||
founder:'管理员',
|
||||
updateTime:'2025-5-4 15:14:25'
|
||||
},
|
||||
{
|
||||
name:'技术员',
|
||||
status:'启用',
|
||||
remarks:'技术负责人',
|
||||
founder:'管理员',
|
||||
updateTime:'2025-5-4 15:14:25'
|
||||
},
|
||||
{
|
||||
name:'采购部',
|
||||
status:'禁用',
|
||||
remarks:'采购负责人',
|
||||
founder:'管理员',
|
||||
updateTime:'2025-5-4 15:14:25'
|
||||
}
|
||||
]
|
||||
|
||||
export default datalistRole
|
||||
|
|
@ -1,11 +1,309 @@
|
|||
<!-- 硬件数据 -->
|
||||
<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"
|
||||
@click="addRole"
|
||||
>
|
||||
新增角色
|
||||
</n-button>
|
||||
</template>
|
||||
</TablePro>
|
||||
</div>
|
||||
</template>
|
||||
<script setup lang="tsx">
|
||||
import {
|
||||
TablePro,
|
||||
type TableProProps,
|
||||
FormPro,
|
||||
type FormItemOptions,
|
||||
type TableProInst,
|
||||
Icon
|
||||
} from "@/components";
|
||||
import { type FormInst, NPerformantEllipsis, NPopconfirm, NTag, useModal } from "naive-ui";
|
||||
|
||||
<script setup lang="ts">
|
||||
const tableRef = useTemplateRef<TableProInst>("tableRef");
|
||||
import datalistRole, { type roleSaveOrUpdate } from "./index.ts";
|
||||
import { reactive, ref } from "vue";
|
||||
|
||||
const modal = useModal();
|
||||
|
||||
const form = ref<FormInst | null>(null);
|
||||
const reqApi: TableType["requestApi"] = (params) => {
|
||||
return new Promise((resolve) => {
|
||||
resolve({
|
||||
code: 200,
|
||||
data: {
|
||||
current: "1",
|
||||
// @ts-ignore
|
||||
pages: "2",
|
||||
records: datalistRole,
|
||||
size: "10",
|
||||
total: "12"
|
||||
},
|
||||
message: "操作成功！"
|
||||
});
|
||||
});
|
||||
};
|
||||
type TableType = TableProProps<any, any>;
|
||||
const searchFormOptions = reactive<TableType["searchFormOptions"]>({
|
||||
name: {
|
||||
type: "input",
|
||||
label: "角色名"
|
||||
},
|
||||
founder: {
|
||||
type: "input",
|
||||
label: "创建人"
|
||||
},
|
||||
remarks: {
|
||||
type: "input",
|
||||
label: "备注"
|
||||
},
|
||||
status: {
|
||||
type: "select",
|
||||
label: "状态",
|
||||
options: [
|
||||
{
|
||||
value: "全部",
|
||||
label: "全部"
|
||||
},
|
||||
{
|
||||
value: "启用",
|
||||
label: "启用"
|
||||
},
|
||||
{
|
||||
value: "禁用",
|
||||
label: "禁用"
|
||||
}
|
||||
]
|
||||
}
|
||||
});
|
||||
|
||||
const columns = ref<TableType["columns"]>([
|
||||
{
|
||||
key: "name",
|
||||
title: "角色名称"
|
||||
}, {
|
||||
key: "remarks",
|
||||
title: "备注"
|
||||
},
|
||||
{
|
||||
key: "founder",
|
||||
title: "创建人"
|
||||
},
|
||||
{
|
||||
key: "status",
|
||||
title: "状态",
|
||||
render: (value: any) => {
|
||||
return (
|
||||
<n-tag type={value.status === "启用" ? "success" : "error"}>
|
||||
{value.status}
|
||||
</n-tag>
|
||||
);
|
||||
}
|
||||
},
|
||||
{
|
||||
key: "updateTime",
|
||||
title: "创建时间"
|
||||
},
|
||||
{
|
||||
key: "",
|
||||
title: "操作",
|
||||
width: 200,
|
||||
render: (value) => {
|
||||
return (
|
||||
<div style={{ display: "flex" }}>
|
||||
<n-button
|
||||
strong
|
||||
secondary
|
||||
style={{ marginLeft: "10px" }}
|
||||
type="warning"
|
||||
onClick={() => {
|
||||
title.value = "编辑角色";
|
||||
userValue.value.name = value.name;
|
||||
userValue.value.status = value.status;
|
||||
userValue.value.remarks = value.remarks;
|
||||
modalRef.value = modal.create({
|
||||
title: title.value,
|
||||
preset: "card",
|
||||
style: {
|
||||
width: "600px"
|
||||
},
|
||||
content: () => (
|
||||
<>
|
||||
<FormPro labelWidth="100" ref={form} v-model:value={userValue.value}
|
||||
form-item-options={formOptionsUser}></FormPro>
|
||||
</>
|
||||
),
|
||||
footer: () => (
|
||||
<div
|
||||
style={{
|
||||
display: "flex",
|
||||
justifyContent: "flex-end"
|
||||
}}
|
||||
>
|
||||
<n-button
|
||||
loading={loading.value}
|
||||
style={{ marginRight: "10px" }}
|
||||
type="primary"
|
||||
onClick={() => {
|
||||
addUserOrUpdate();
|
||||
}}
|
||||
>
|
||||
确认
|
||||
</n-button>
|
||||
<n-button
|
||||
onClick={() => {
|
||||
modalRef.value.destroy();
|
||||
resetModelValue();
|
||||
}}
|
||||
>
|
||||
取消
|
||||
</n-button>
|
||||
</div>
|
||||
),
|
||||
onAfterLeave: () => {
|
||||
resetModelValue();
|
||||
}
|
||||
});
|
||||
}}
|
||||
>
|
||||
修改
|
||||
</n-button>
|
||||
|
||||
<NPopconfirm
|
||||
onPositiveClick={async () => {
|
||||
}}
|
||||
onNegativeClick={() => {
|
||||
}}
|
||||
showIcon={false}
|
||||
>
|
||||
{{
|
||||
trigger: () => (
|
||||
<n-button
|
||||
strong
|
||||
secondary
|
||||
style={{ marginLeft: "10px" }}
|
||||
type="error"
|
||||
>
|
||||
删除
|
||||
</n-button>
|
||||
),
|
||||
default: () => "确认要除么？"
|
||||
}}
|
||||
</NPopconfirm>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
}
|
||||
]);
|
||||
const formOptionsUser = reactive<FormItemOptions<roleSaveOrUpdate>>({
|
||||
name: {
|
||||
type: "input",
|
||||
label: "名字",
|
||||
required: true
|
||||
},
|
||||
status: {
|
||||
type: "radioGroup",
|
||||
label: "状态",
|
||||
options: [
|
||||
{
|
||||
value: "启用",
|
||||
label: "启用"
|
||||
},
|
||||
{
|
||||
value: "禁用",
|
||||
label: "禁用"
|
||||
}
|
||||
]
|
||||
},
|
||||
remarks: {
|
||||
type: "input",
|
||||
label: "备注"
|
||||
}
|
||||
});
|
||||
|
||||
const userRoleValue: roleSaveOrUpdate = {
|
||||
// snowFlakeId: "",
|
||||
name: "",
|
||||
status: "",
|
||||
remarks: "",
|
||||
founder: "",
|
||||
updateTime: ""
|
||||
};
|
||||
|
||||
const userValue = ref<roleSaveOrUpdate>({
|
||||
...userRoleValue
|
||||
});
|
||||
|
||||
const resetModelValue = () => {
|
||||
userValue.value = { ...userRoleValue };
|
||||
};
|
||||
|
||||
const addUserOrUpdate = () => {
|
||||
form.value?.validate().then(() => {
|
||||
// loading.value = true
|
||||
|
||||
});
|
||||
};
|
||||
const loading = ref<boolean>(false);
|
||||
const modalRef = ref();
|
||||
const title = ref("新增角色");
|
||||
const addRole = () => {
|
||||
modalRef.value = modal.create({
|
||||
title: title.value,
|
||||
preset: "card",
|
||||
style: {
|
||||
width: "600px"
|
||||
},
|
||||
content: () => (
|
||||
<>
|
||||
<FormPro labelWidth="100" ref={form} v-model:value={userValue.value}
|
||||
form-item-options={formOptionsUser}></FormPro>
|
||||
</>
|
||||
),
|
||||
footer: () => (
|
||||
<div
|
||||
style={{
|
||||
display: "flex",
|
||||
justifyContent: "flex-end"
|
||||
}}
|
||||
>
|
||||
<n-button
|
||||
loading={loading.value}
|
||||
style={{ marginRight: "10px" }}
|
||||
type="primary"
|
||||
onClick={() => {
|
||||
addUserOrUpdate();
|
||||
}}
|
||||
>
|
||||
确认
|
||||
</n-button>
|
||||
<n-button
|
||||
onClick={() => {
|
||||
modalRef.value.destroy();
|
||||
resetModelValue();
|
||||
}}
|
||||
>
|
||||
取消
|
||||
</n-button>
|
||||
</div>
|
||||
),
|
||||
onAfterLeave: () => {
|
||||
resetModelValue();
|
||||
}
|
||||
});
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
|
||||
</style>
|
||||
<style scoped lang="scss"></style>
|
||||
|
|
|
|||
|
|
@ -0,0 +1,239 @@
|
|||
export interface WorkAccountsValue{
|
||||
bodyImage?:string
|
||||
bodyImageUrl? :string
|
||||
checkDate?:string
|
||||
checkDateStr?:string
|
||||
checkResult? : string | number
|
||||
checkResultStr?:string
|
||||
checkStatus?: string | number
|
||||
checkStatusStr?:string
|
||||
checkUserId?:string
|
||||
checkUserName?: string
|
||||
createTime?:string
|
||||
createTimeStr?:string
|
||||
dataSource?:string
|
||||
deptId?:string
|
||||
deptIds?:string
|
||||
deptName?:string
|
||||
deviceId? :string
|
||||
diseases?:string
|
||||
handImage?:string
|
||||
handImageUrl?:string
|
||||
handbackImage?:string
|
||||
handbackImageUrl?:string
|
||||
headImage?:string
|
||||
headImageUrl? :string
|
||||
id?: string
|
||||
ids?: string
|
||||
isDefault?:boolean
|
||||
moreIds ?: string
|
||||
sex? : string
|
||||
sexStr?:string
|
||||
signatureImage?:string
|
||||
statementVideo? : string
|
||||
temperature?:string
|
||||
updateTime? :string
|
||||
userId?: string
|
||||
userName?:string
|
||||
userNameEncrypt?: string
|
||||
}
|
||||
|
||||
const datalistWorkAccounts:WorkAccountsValue[] = [
|
||||
{
|
||||
bodyImage:"/img/mqtts/morning/record/1920283993400512513_bodyImg.jpg",
|
||||
bodyImageUrl :"https://file.wy2020.com/admin/weiyi/img/mqtts/morning/record/1920283993400512513_headImg.jpg",
|
||||
checkDate:"2025-05-08 00:00:00",
|
||||
checkDateStr:"2025-05-08",
|
||||
checkResult : 0,
|
||||
checkResultStr:"合格",
|
||||
checkStatus: 2,
|
||||
checkStatusStr:"已完成",
|
||||
checkUserId:"",
|
||||
checkUserName: "",
|
||||
createTime:"2025-05-08 09:05:56",
|
||||
createTimeStr:"2025-05-08 09:05:56",
|
||||
dataSource:"",
|
||||
deptId:"1526803620325961729",
|
||||
deptIds:"",
|
||||
deptName:"南头央厨",
|
||||
deviceId : "",
|
||||
diseases:"无不适",
|
||||
handImage:"/img/mqtts/morning/record/1920283993400512513_handImg.jpg",
|
||||
handImageUrl:"https://file.wy2020.com/admin/weiyi/img/mqtts/morning/record/1920283993400512513_handImg.jpg",
|
||||
handbackImage:"/img/mqtts/morning/record/1920283993400512513_handBackImg.jpg",
|
||||
handbackImageUrl:"https://file.wy2020.com/admin/weiyi/img/mqtts/morning/record/1920283993400512513_handBackImg.jpg",
|
||||
headImage:"/img/mqtts/morning/record/1920283993400512513_headImg.jpg",
|
||||
headImageUrl :"https://file.wy2020.com/admin/weiyi/img/mqtts/morning/record/1920283993400512513_headImg.jpg",
|
||||
id: "1920283993400512513",
|
||||
ids: "",
|
||||
isDefault:true,
|
||||
moreIds : "",
|
||||
sex : "",
|
||||
sexStr:"未知",
|
||||
signatureImage: "",
|
||||
statementVideo : "",
|
||||
temperature:"36.64",
|
||||
updateTime :"",
|
||||
userId: "1727695532542918657",
|
||||
userName:"**静",
|
||||
userNameEncrypt: "**静"
|
||||
},
|
||||
{
|
||||
bodyImage:"/img/mqtts/morning/record/1920283993400512513_bodyImg.jpg",
|
||||
bodyImageUrl :"https://file.wy2020.com/admin/weiyi/img/mqtts/morning/record/1920283993400512513_headImg.jpg",
|
||||
checkDate:"2025-05-08 00:00:00",
|
||||
checkDateStr:"2025-05-08",
|
||||
checkResult : 0,
|
||||
checkResultStr:"合格",
|
||||
checkStatus: 2,
|
||||
checkStatusStr:"已完成",
|
||||
checkUserId:"",
|
||||
checkUserName: "",
|
||||
createTime:"2025-05-08 09:05:56",
|
||||
createTimeStr:"2025-05-08 09:05:56",
|
||||
dataSource:"",
|
||||
deptId:"1526803620325961729",
|
||||
deptIds:"",
|
||||
deptName:"南头央厨",
|
||||
deviceId : "",
|
||||
diseases:"无不适",
|
||||
handImage:"/img/mqtts/morning/record/1920283993400512513_handImg.jpg",
|
||||
handImageUrl:"https://file.wy2020.com/admin/weiyi/img/mqtts/morning/record/1920283993400512513_handImg.jpg",
|
||||
handbackImage:"/img/mqtts/morning/record/1920283993400512513_handBackImg.jpg",
|
||||
handbackImageUrl:"https://file.wy2020.com/admin/weiyi/img/mqtts/morning/record/1920283993400512513_handBackImg.jpg",
|
||||
headImage:"/img/mqtts/morning/record/1920283993400512513_headImg.jpg",
|
||||
headImageUrl :"https://file.wy2020.com/admin/weiyi/img/mqtts/morning/record/1920283993400512513_headImg.jpg",
|
||||
id: "1920283993400512513",
|
||||
ids: "",
|
||||
isDefault:true,
|
||||
moreIds : "",
|
||||
sex : "",
|
||||
sexStr:"未知",
|
||||
signatureImage: "",
|
||||
statementVideo : "",
|
||||
temperature:"36.77",
|
||||
updateTime :"",
|
||||
userId: "1727695532542918657",
|
||||
userName:"**静",
|
||||
userNameEncrypt: "**静"
|
||||
},
|
||||
{
|
||||
bodyImage:"/img/mqtts/morning/record/1920283993400512513_bodyImg.jpg",
|
||||
bodyImageUrl :"https://file.wy2020.com/admin/weiyi/img/mqtts/morning/record/1920283993400512513_headImg.jpg",
|
||||
checkDate:"2025-05-08 00:00:00",
|
||||
checkDateStr:"2025-05-08",
|
||||
checkResult : 0,
|
||||
checkResultStr:"合格",
|
||||
checkStatus: 2,
|
||||
checkStatusStr:"已完成",
|
||||
checkUserId:"",
|
||||
checkUserName: "",
|
||||
createTime:"2025-05-08 09:05:56",
|
||||
createTimeStr:"2025-05-08 09:05:56",
|
||||
dataSource:"",
|
||||
deptId:"1526803620325961729",
|
||||
deptIds:"",
|
||||
deptName:"南头央厨",
|
||||
deviceId : "",
|
||||
diseases:"无不适",
|
||||
handImage:"/img/mqtts/morning/record/1920283993400512513_handImg.jpg",
|
||||
handImageUrl:"https://file.wy2020.com/admin/weiyi/img/mqtts/morning/record/1920283993400512513_handImg.jpg",
|
||||
handbackImage:"/img/mqtts/morning/record/1920283993400512513_handBackImg.jpg",
|
||||
handbackImageUrl:"https://file.wy2020.com/admin/weiyi/img/mqtts/morning/record/1920283993400512513_handBackImg.jpg",
|
||||
headImage:"/img/mqtts/morning/record/1920283993400512513_headImg.jpg",
|
||||
headImageUrl :"https://file.wy2020.com/admin/weiyi/img/mqtts/morning/record/1920283993400512513_headImg.jpg",
|
||||
id: "1920283993400512513",
|
||||
ids: "",
|
||||
isDefault:true,
|
||||
moreIds : "",
|
||||
sex : "",
|
||||
sexStr:"未知",
|
||||
signatureImage: "",
|
||||
statementVideo : "",
|
||||
temperature:"36.12",
|
||||
updateTime :"",
|
||||
userId: "1727695532542918657",
|
||||
userName:"**静",
|
||||
userNameEncrypt: "**静"
|
||||
},
|
||||
{
|
||||
bodyImage:"/img/mqtts/morning/record/1920283993400512513_bodyImg.jpg",
|
||||
bodyImageUrl :"https://file.wy2020.com/admin/weiyi/img/mqtts/morning/record/1920283993400512513_headImg.jpg",
|
||||
checkDate:"2025-05-08 00:00:00",
|
||||
checkDateStr:"2025-05-08",
|
||||
checkResult : 0,
|
||||
checkResultStr:"合格",
|
||||
checkStatus: 2,
|
||||
checkStatusStr:"已完成",
|
||||
checkUserId:"",
|
||||
checkUserName: "",
|
||||
createTime:"2025-05-08 09:05:56",
|
||||
createTimeStr:"2025-05-08 09:05:56",
|
||||
dataSource:"",
|
||||
deptId:"1526803620325961729",
|
||||
deptIds:"",
|
||||
deptName:"南头央厨",
|
||||
deviceId : "",
|
||||
diseases:"恶心",
|
||||
handImage:"/img/mqtts/morning/record/1920283993400512513_handImg.jpg",
|
||||
handImageUrl:"https://file.wy2020.com/admin/weiyi/img/mqtts/morning/record/1920283993400512513_handImg.jpg",
|
||||
handbackImage:"/img/mqtts/morning/record/1920283993400512513_handBackImg.jpg",
|
||||
handbackImageUrl:"https://file.wy2020.com/admin/weiyi/img/mqtts/morning/record/1920283993400512513_handBackImg.jpg",
|
||||
headImage:"/img/mqtts/morning/record/1920283993400512513_headImg.jpg",
|
||||
headImageUrl :"https://file.wy2020.com/admin/weiyi/img/mqtts/morning/record/1920283993400512513_headImg.jpg",
|
||||
id: "1920283993400512513",
|
||||
ids: "",
|
||||
isDefault:true,
|
||||
moreIds : "",
|
||||
sex : "",
|
||||
sexStr:"未知",
|
||||
signatureImage: "",
|
||||
statementVideo : "",
|
||||
temperature:"36.14",
|
||||
updateTime :"",
|
||||
userId: "1727695532542918657",
|
||||
userName:"**静",
|
||||
userNameEncrypt: "**静"
|
||||
},
|
||||
{
|
||||
bodyImage:"/img/mqtts/morning/record/1920283993400512513_bodyImg.jpg",
|
||||
bodyImageUrl :"https://file.wy2020.com/admin/weiyi/img/mqtts/morning/record/1920283993400512513_headImg.jpg",
|
||||
checkDate:"2025-05-08 00:00:00",
|
||||
checkDateStr:"2025-05-08",
|
||||
checkResult : 0,
|
||||
checkResultStr:"合格",
|
||||
checkStatus: 2,
|
||||
checkStatusStr:"已完成",
|
||||
checkUserId:"",
|
||||
checkUserName: "",
|
||||
createTime:"2025-05-08 09:05:56",
|
||||
createTimeStr:"2025-05-08 09:05:56",
|
||||
dataSource:"",
|
||||
deptId:"1526803620325961729",
|
||||
deptIds:"",
|
||||
deptName:"南头央厨",
|
||||
deviceId : "",
|
||||
diseases:"湿疹",
|
||||
handImage:"/img/mqtts/morning/record/1920283993400512513_handImg.jpg",
|
||||
handImageUrl:"https://file.wy2020.com/admin/weiyi/img/mqtts/morning/record/1920283993400512513_handImg.jpg",
|
||||
handbackImage:"/img/mqtts/morning/record/1920283993400512513_handBackImg.jpg",
|
||||
handbackImageUrl:"https://file.wy2020.com/admin/weiyi/img/mqtts/morning/record/1920283993400512513_handBackImg.jpg",
|
||||
headImage:"/img/mqtts/morning/record/1920283993400512513_headImg.jpg",
|
||||
headImageUrl :"https://file.wy2020.com/admin/weiyi/img/mqtts/morning/record/1920283993400512513_headImg.jpg",
|
||||
id: "1920283993400512513",
|
||||
ids: "",
|
||||
isDefault:true,
|
||||
moreIds : "",
|
||||
sex : "",
|
||||
sexStr:"未知",
|
||||
signatureImage: "",
|
||||
statementVideo : "",
|
||||
temperature:"36.24",
|
||||
updateTime :"",
|
||||
userId: "1727695532542918657",
|
||||
userName:"**静",
|
||||
userNameEncrypt: "**静"
|
||||
}
|
||||
]
|
||||
|
||||
export default datalistWorkAccounts;
|
||||
|
|
@ -1,11 +1,480 @@
|
|||
<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"
|
||||
@click="addWorkAccounts"
|
||||
>
|
||||
添加
|
||||
</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 { type FormInst, NPerformantEllipsis, NPopconfirm, NTag, useModal } from "naive-ui";
|
||||
import datalistWorkAccounts, { type WorkAccountsValue } from "@/views/workAccounts/index.ts";
|
||||
import { ref,reactive } from "vue";
|
||||
|
||||
<style scoped lang="scss">
|
||||
const tableRef = useTemplateRef<TableProInst>("tableRef");
|
||||
const modal = useModal();
|
||||
const forms = ref<FormInst | null>(null);
|
||||
const reqApi: TableType["requestApi"] = (params) => {
|
||||
return new Promise((resolve) => {
|
||||
resolve({
|
||||
code: 200,
|
||||
data: {
|
||||
current: "1",
|
||||
// @ts-ignore
|
||||
pages: "2",
|
||||
records: datalistWorkAccounts,
|
||||
size: "10",
|
||||
total: "12"
|
||||
},
|
||||
message: "操作成功！"
|
||||
});
|
||||
});
|
||||
};
|
||||
type TableType = TableProProps<any, any>;
|
||||
const searchFormOptions = reactive<TableType["searchFormOptions"]>({
|
||||
time: {
|
||||
type: "datePicker",
|
||||
label: "时间",
|
||||
},
|
||||
name:{
|
||||
type:'input',
|
||||
label: "员工姓名"
|
||||
}
|
||||
});
|
||||
const columns = ref<TableType["columns"]>([
|
||||
{
|
||||
key:'userName',
|
||||
title:'检查人'
|
||||
},
|
||||
{
|
||||
key:'temperature',
|
||||
title:'体温'
|
||||
},
|
||||
{
|
||||
key:'bodyImageUrl',
|
||||
title:'衣着图片',
|
||||
render: (value: any) => {
|
||||
return (
|
||||
<n-image
|
||||
width="30"
|
||||
src={value.bodyImageUrl}
|
||||
/>
|
||||
);
|
||||
}
|
||||
},
|
||||
{
|
||||
key:'handImageUrl',
|
||||
title:'手心图片',
|
||||
render: (value: any) => {
|
||||
return (
|
||||
<n-image
|
||||
width="30"
|
||||
src={value.handImageUrl}
|
||||
/>
|
||||
);
|
||||
}
|
||||
},
|
||||
{
|
||||
key:'handbackImageUrl',
|
||||
title:'手背图片',
|
||||
render: (value: any) => {
|
||||
return (
|
||||
<n-image
|
||||
width="30"
|
||||
src={value.handbackImageUrl}
|
||||
/>
|
||||
);
|
||||
}
|
||||
},
|
||||
{
|
||||
key:'headImageUrl',
|
||||
title:'头部图片',
|
||||
render: (value: any) => {
|
||||
return (
|
||||
<n-image
|
||||
width="30"
|
||||
src={value.headImageUrl}
|
||||
/>
|
||||
);
|
||||
}
|
||||
},
|
||||
{
|
||||
key:'diseases',
|
||||
title:'健康状态',
|
||||
render: (value: any) => {
|
||||
return (
|
||||
<n-tag type="success">
|
||||
{value.diseases}
|
||||
</n-tag>
|
||||
);
|
||||
}
|
||||
},
|
||||
{
|
||||
key:'checkResultStr',
|
||||
title:'晨检结果',
|
||||
render: (value: any) => {
|
||||
return (
|
||||
<n-tag type="success">
|
||||
{value.checkResultStr}
|
||||
</n-tag>
|
||||
);
|
||||
}
|
||||
},
|
||||
{
|
||||
key: "createTimeStr",
|
||||
title: "晨检时间"
|
||||
},
|
||||
{
|
||||
key: "",
|
||||
title: "操作",
|
||||
width: 200,
|
||||
render: (value:WorkAccountsValue) => {
|
||||
return (
|
||||
<div style={{ display: "flex" }}>
|
||||
<n-button
|
||||
strong
|
||||
secondary
|
||||
style={{ marginLeft: "10px" }}
|
||||
type="warning"
|
||||
onClick={() => {
|
||||
title.value = `修改晨检记录`;
|
||||
console.log(value);
|
||||
userValue.value.userName = value.userName
|
||||
userValue.value.temperature = value.temperature
|
||||
userValue.value.bodyImageUrl =value.bodyImageUrl
|
||||
userValue.value.handImageUrl =value.handImageUrl
|
||||
userValue.value.handbackImageUrl =value.handbackImageUrl
|
||||
userValue.value.headImageUrl =value.headImageUrl
|
||||
userValue.value.diseases =value.diseases
|
||||
modalRef.value = modal.create({
|
||||
title: title.value,
|
||||
preset: "card",
|
||||
style: {
|
||||
width: "700px"
|
||||
},
|
||||
content: () => (
|
||||
<div style="height:600px">
|
||||
<FormPro ref={forms} v-model:value={userValue.value}
|
||||
form-item-options={formOptionsUser} gridProps={{ cols: 2, xGap: 16, itemResponsive: true }}>
|
||||
</FormPro>
|
||||
<FormPro ref={forms} v-model:value={userValue.value}
|
||||
form-item-options={formOptions1User} gridProps={{ cols: 1, xGap: 8, itemResponsive: true }}>
|
||||
</FormPro>
|
||||
</div>
|
||||
),
|
||||
footer: () => (
|
||||
<div
|
||||
style={{
|
||||
display: "flex",
|
||||
justifyContent: "flex-end"
|
||||
}}
|
||||
>
|
||||
<n-button
|
||||
loading={loading.value}
|
||||
style={{ marginRight: "10px" }}
|
||||
type="primary"
|
||||
onClick={() => {
|
||||
addUserOrUpdate();
|
||||
}}
|
||||
>
|
||||
确认
|
||||
</n-button>
|
||||
<n-button
|
||||
onClick={() => {
|
||||
modalRef.value.destroy();
|
||||
resetModelValue();
|
||||
}}
|
||||
>
|
||||
取消
|
||||
</n-button>
|
||||
</div>
|
||||
),
|
||||
onAfterLeave: () => {
|
||||
resetModelValue();
|
||||
}
|
||||
});
|
||||
|
||||
</style>
|
||||
}}
|
||||
>
|
||||
修改
|
||||
</n-button>
|
||||
|
||||
<NPopconfirm
|
||||
onPositiveClick={async () => {
|
||||
}}
|
||||
onNegativeClick={() => {
|
||||
}}
|
||||
showIcon={false}
|
||||
>
|
||||
{{
|
||||
trigger: () => (
|
||||
<n-button
|
||||
strong
|
||||
secondary
|
||||
style={{ marginLeft: "10px" }}
|
||||
type="error"
|
||||
>
|
||||
删除
|
||||
</n-button>
|
||||
),
|
||||
default: () => "确认要除么？"
|
||||
}}
|
||||
</NPopconfirm>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
}
|
||||
]);
|
||||
|
||||
|
||||
const workAccountsValueList = {
|
||||
bodyImage:"",
|
||||
bodyImageUrl :"",
|
||||
checkResultStr:"",
|
||||
checkStatusStr:"",
|
||||
createTime:"",
|
||||
createTimeStr:"",
|
||||
diseases:"",
|
||||
handImageUrl:"",
|
||||
handbackImageUrl:"",
|
||||
headImageUrl :"",
|
||||
isDefault:true,
|
||||
sexStr:"",
|
||||
temperature:"",
|
||||
updateTime :"",
|
||||
userName:"",
|
||||
}
|
||||
|
||||
const userValue = ref<WorkAccountsValue>({
|
||||
...workAccountsValueList
|
||||
});
|
||||
|
||||
const resetModelValue = () => {
|
||||
userValue.value = { ...workAccountsValueList };
|
||||
};
|
||||
|
||||
const addUserOrUpdate = () => {
|
||||
forms.value?.validate().then(() => {
|
||||
// loading.value = true
|
||||
|
||||
});
|
||||
};
|
||||
const formOptions1User = reactive<FormItemOptions<WorkAccountsValue>>({
|
||||
diseases:{
|
||||
type:'checkboxGroup',
|
||||
label:'健康状态',
|
||||
options:[
|
||||
{
|
||||
value:'无不适',
|
||||
label:'无不适'
|
||||
},
|
||||
{
|
||||
value:'发热',
|
||||
label:'发热'
|
||||
},
|
||||
{
|
||||
value:'恶心',
|
||||
label:'恶心'
|
||||
},
|
||||
{
|
||||
value:'呕吐',
|
||||
label:'呕吐'
|
||||
},
|
||||
{
|
||||
value:'咳嗽',
|
||||
label:'咳嗽'
|
||||
},
|
||||
{
|
||||
value:'湿疹',
|
||||
label:'湿疹'
|
||||
},
|
||||
{
|
||||
value:'腹泻',
|
||||
label:'腹泻'
|
||||
},
|
||||
{
|
||||
value:'烫伤',
|
||||
label:'烫伤'
|
||||
},
|
||||
]
|
||||
}
|
||||
})
|
||||
const formOptionsUser = reactive<FormItemOptions<WorkAccountsValue>>({
|
||||
userName:{
|
||||
type: "select",
|
||||
label: "员工",
|
||||
required:true,
|
||||
options:[
|
||||
{
|
||||
value:'张三',
|
||||
label:'张三'
|
||||
},
|
||||
{
|
||||
value:'李四',
|
||||
label:'李四'
|
||||
},
|
||||
{
|
||||
value:'王五',
|
||||
label:'王五'
|
||||
},
|
||||
{
|
||||
value:'赵六',
|
||||
label:'赵六'
|
||||
},
|
||||
{
|
||||
value:'刘七',
|
||||
label:'刘七'
|
||||
},
|
||||
]
|
||||
},
|
||||
temperature:{
|
||||
type:'input',
|
||||
label:'体温',
|
||||
required:true
|
||||
},
|
||||
bodyImageUrl:{
|
||||
type: "custom",
|
||||
label: "衣着图片",
|
||||
required:true,
|
||||
customRender: (val) => {
|
||||
return (
|
||||
<div>
|
||||
<n-image
|
||||
width="200"
|
||||
height="150"
|
||||
src={val.bodyImageUrl}
|
||||
/>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
},
|
||||
handImageUrl:{
|
||||
type: "custom",
|
||||
label: "手心图片",
|
||||
required:true,
|
||||
customRender: (val) => {
|
||||
return (
|
||||
<div>
|
||||
<n-image
|
||||
width="200"
|
||||
height="150"
|
||||
src={val.handImageUrl}
|
||||
/>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
},
|
||||
handbackImageUrl:{
|
||||
type: "custom",
|
||||
label: "手背图片",
|
||||
required:true,
|
||||
customRender: (val) => {
|
||||
return (
|
||||
<div>
|
||||
<n-image
|
||||
width="200"
|
||||
height="150"
|
||||
src={val.handbackImageUrl}
|
||||
/>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
},
|
||||
headImageUrl:{
|
||||
type: "custom",
|
||||
label: "头部图片",
|
||||
required:true,
|
||||
customRender: (val) => {
|
||||
return (
|
||||
<div>
|
||||
<n-image
|
||||
width="200"
|
||||
height="150"
|
||||
src={val.headImageUrl}
|
||||
/>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
},
|
||||
|
||||
})
|
||||
|
||||
const loading = ref<boolean>(false);
|
||||
const modalRef = ref();
|
||||
const title = ref("添加晨检记录");
|
||||
const addWorkAccounts = ()=>{
|
||||
modalRef.value = modal.create({
|
||||
title: title.value,
|
||||
preset: "card",
|
||||
style: {
|
||||
width: "700px"
|
||||
},
|
||||
content: () => (
|
||||
<div style="height:600px">
|
||||
<FormPro ref={forms} v-model:value={userValue.value}
|
||||
form-item-options={formOptionsUser} gridProps={{ cols: 2, xGap: 16, itemResponsive: true }}>
|
||||
</FormPro>
|
||||
<FormPro ref={forms} v-model:value={userValue.value}
|
||||
form-item-options={formOptions1User} gridProps={{ cols: 1, xGap: 8, itemResponsive: true }}>
|
||||
</FormPro>
|
||||
</div>
|
||||
),
|
||||
footer: () => (
|
||||
<div
|
||||
style={{
|
||||
display: "flex",
|
||||
justifyContent: "flex-end"
|
||||
}}
|
||||
>
|
||||
<n-button
|
||||
loading={loading.value}
|
||||
style={{ marginRight: "10px" }}
|
||||
type="primary"
|
||||
onClick={() => {
|
||||
addUserOrUpdate();
|
||||
}}
|
||||
>
|
||||
确认
|
||||
</n-button>
|
||||
<n-button
|
||||
onClick={() => {
|
||||
modalRef.value.destroy();
|
||||
resetModelValue();
|
||||
}}
|
||||
>
|
||||
取消
|
||||
</n-button>
|
||||
</div>
|
||||
),
|
||||
onAfterLeave: () => {
|
||||
resetModelValue();
|
||||
}
|
||||
});
|
||||
}
|
||||
</script>
|
||||
<style scoped lang="scss"></style>
|
||||
|
|
|
|||
Loading…
Reference in New Issue