diff --git a/src/views/hardwareData/index.vue b/src/views/hardwareData/index.vue
index 24e378e..664b79f 100644
--- a/src/views/hardwareData/index.vue
+++ b/src/views/hardwareData/index.vue
@@ -7,6 +7,7 @@
       :search-form-options="searchFormOptions"
       :columns="columns"
       :isPageTable="true"
+      :single-line="false"
     >
       <template #headerExtra>
         <n-button
diff --git a/src/views/personnelManagement/departmentStructure/index.vue b/src/views/personnelManagement/departmentStructure/index.vue
index 3c05fe7..96a588a 100644
--- a/src/views/personnelManagement/departmentStructure/index.vue
+++ b/src/views/personnelManagement/departmentStructure/index.vue
@@ -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>
diff --git a/src/views/personnelManagement/enterpriseStaff/index.vue b/src/views/personnelManagement/enterpriseStaff/index.vue
index 2305a3b..fad2a72 100644
--- a/src/views/personnelManagement/enterpriseStaff/index.vue
+++ b/src/views/personnelManagement/enterpriseStaff/index.vue
@@ -6,6 +6,7 @@
       :search-form-options="searchFormOptions"
       :columns="columns"
       :isPageTable="true"
+      :single-line="false"
     />
   </div>
 </template>
diff --git a/src/views/personnelManagement/historicalPurchase/index.vue b/src/views/personnelManagement/historicalPurchase/index.vue
index c54f332..0f506f2 100644
--- a/src/views/personnelManagement/historicalPurchase/index.vue
+++ b/src/views/personnelManagement/historicalPurchase/index.vue
@@ -7,6 +7,7 @@
       :search-form-options="searchFormOptions"
       :columns="columns"
       :isPageTable="true"
+      :single-line="false"
     >
       <template #headerExtra>
         <!-- <n-button
diff --git a/src/views/personnelManagement/securityStaff/index.vue b/src/views/personnelManagement/securityStaff/index.vue
index 61ec618..681a777 100644
--- a/src/views/personnelManagement/securityStaff/index.vue
+++ b/src/views/personnelManagement/securityStaff/index.vue
@@ -7,6 +7,7 @@
       :search-form-options="searchFormOptions"
       :columns="columns"
       :isPageTable="true"
+      :single-line="false"
     >
       <template #headerExtra>
         <n-button
diff --git a/src/views/smartRecipes/dailyRecipes/index.vue b/src/views/smartRecipes/dailyRecipes/index.vue
index 0c1438e..f977414 100644
--- a/src/views/smartRecipes/dailyRecipes/index.vue
+++ b/src/views/smartRecipes/dailyRecipes/index.vue
@@ -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>
diff --git a/src/views/smartRecipes/dishesManagement/index.vue b/src/views/smartRecipes/dishesManagement/index.vue
index 840b182..fa0ec31 100644
--- a/src/views/smartRecipes/dishesManagement/index.vue
+++ b/src/views/smartRecipes/dishesManagement/index.vue
@@ -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",
diff --git a/src/views/smartRecipes/foodSampleRetention/index.vue b/src/views/smartRecipes/foodSampleRetention/index.vue
index c046be8..aa0d010 100644
--- a/src/views/smartRecipes/foodSampleRetention/index.vue
+++ b/src/views/smartRecipes/foodSampleRetention/index.vue
@@ -7,6 +7,7 @@
       :search-form-options="searchFormOptions"
       :columns="columns"
       :isPageTable="true"
+      :single-line="false"
     >
       <template #headerExtra>
         <n-button
diff --git a/src/views/system/role/getTreeOptions.tsx b/src/views/system/role/getTreeOptions.tsx
deleted file mode 100644
index 15dd45c..0000000
--- a/src/views/system/role/getTreeOptions.tsx
+++ /dev/null
@@ -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;
-};
diff --git a/src/views/system/role/index.ts b/src/views/system/role/index.ts
index 8841d39..c024bd3 100644
--- a/src/views/system/role/index.ts
+++ b/src/views/system/role/index.ts
@@ -1,6 +1,41 @@
 export interface roleSaveOrUpdate {
   snowFlakeId?:string;
-  name: string;
-  status:string;
-  remark?:string
-}
\ No newline at end of file
+  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
\ No newline at end of file
diff --git a/src/views/system/role/index.vue b/src/views/system/role/index.vue
index d734f19..2b80bef 100644
--- a/src/views/system/role/index.vue
+++ b/src/views/system/role/index.vue
@@ -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>
\ No newline at end of file
+<style scoped lang="scss"></style>
diff --git a/src/views/workAccounts/index.ts b/src/views/workAccounts/index.ts
new file mode 100644
index 0000000..6e11048
--- /dev/null
+++ b/src/views/workAccounts/index.ts
@@ -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;
\ No newline at end of file
diff --git a/src/views/workAccounts/index.vue b/src/views/workAccounts/index.vue
index 82c5957..57684fa 100644
--- a/src/views/workAccounts/index.vue
+++ b/src/views/workAccounts/index.vue
@@ -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>
\ No newline at end of file
+              }}
+            >
+              修改
+            </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>