初始化静置库大屏看板项目

2026-06-29 10:19:43 +08:00
commit 5d0cad9e10
49 changed files with 8292 additions and 0 deletions
--- a/.env.development
+++ b/.env.development
@@ -0,0 +1,3 @@
+ENV = 'development'
+VITE_BASE_URL = 'http://localhost:10081'
+VITE_CONFIG_URL = './public/config.js'
--- a/.env.production
+++ b/.env.production
@@ -0,0 +1,3 @@
+ENV = 'production'
+VITE_BASE_URL = 'http://127.0.0.1:10081'
+VITE_CONFIG_URL = './config.js'
--- a/.eslintrc.cjs
+++ b/.eslintrc.cjs
@@ -0,0 +1,70 @@
+const { defineConfig } = require('eslint-define-config')
+module.exports = defineConfig({
+  root: true,
+  env: {
+    browser: true,
+    node: true,
+    es6: true
+  },
+  parser: 'vue-eslint-parser',
+  parserOptions: {
+    parser: '@typescript-eslint/parser',
+    ecmaVersion: 2020,
+    sourceType: 'module',
+    jsxPragma: 'React',
+    ecmaFeatures: {
+      jsx: true
+    }
+  },
+  extends: [
+    'plugin:vue/vue3-recommended',
+    'plugin:@typescript-eslint/recommended',
+    'prettier',
+    'plugin:prettier/recommended'
+  ],
+  rules: {
+    'vue/no-setup-props-destructure': 'off',
+    'vue/script-setup-uses-vars': 'error',
+    'vue/no-reserved-component-names': 'off',
+    '@typescript-eslint/ban-ts-ignore': 'off',
+    '@typescript-eslint/explicit-function-return-type': 'off',
+    '@typescript-eslint/no-explicit-any': 'off',
+    '@typescript-eslint/no-var-requires': 'off',
+    '@typescript-eslint/no-empty-function': 'off',
+    'vue/custom-event-name-casing': 'off',
+    'no-use-before-define': 'off',
+    '@typescript-eslint/no-use-before-define': 'off',
+    '@typescript-eslint/ban-ts-comment': 'off',
+    '@typescript-eslint/ban-types': 'off',
+    '@typescript-eslint/no-non-null-assertion': 'off',
+    '@typescript-eslint/explicit-module-boundary-types': 'off',
+    '@typescript-eslint/no-unused-vars': 'off',
+    'no-unused-vars': 'off',
+    'space-before-function-paren': 'off',
+
+    'vue/attributes-order': 'off',
+    'vue/one-component-per-file': 'off',
+    'vue/html-closing-bracket-newline': 'off',
+    'vue/max-attributes-per-line': 'off',
+    'vue/multiline-html-element-content-newline': 'off',
+    'vue/singleline-html-element-content-newline': 'off',
+    'vue/attribute-hyphenation': 'off',
+    'vue/require-default-prop': 'off',
+    'vue/require-explicit-emits': 'off',
+    'vue/html-self-closing': [
+      'error',
+      {
+        html: {
+          void: 'always',
+          normal: 'never',
+          component: 'always'
+        },
+        svg: 'always',
+        math: 'always'
+      }
+    ],
+    'vue/multi-word-component-names': 'off',
+    'vue/no-v-html': 'off',
+    'vue/require-toggle-inside-transition': 'off'
+  }
+})
--- a/.gitignore
+++ b/.gitignore
@@ -0,0 +1,24 @@
+# Logs
+logs
+*.log
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+pnpm-debug.log*
+lerna-debug.log*
+
+node_modules
+dist
+dist-ssr
+*.local
+
+# Editor directories and files
+.vscode/*
+!.vscode/extensions.json
+.idea
+.DS_Store
+*.suo
+*.ntvs*
+*.njsproj
+*.sln
+*.sw?
--- a/doc/DATA_SPEC.md
+++ b/doc/DATA_SPEC.md
@@ -0,0 +1,177 @@
+# 静置库大屏看板数据口径规划
+
+## 1. 数据原则
+
+1. 优先复用 MES 现有过站数据、Pack 数据、产品型号数据和工艺参数数据。
+2. 前端不自行推测业务状态，复杂口径优先由存储过程统一计算。
+3. 存储过程和字段名称在确认数据来源后再最终固化。
+4. 当前文档只定义查询能力和口径，不编写数据库 DDL。
+
+## 2. 核心口径
+
+| 指标 | 口径 |
+| --- | --- |
+| 静置开始 | Pack 在 OP410 的有效过站时间 |
+| 静置结束 | Pack 在下层静置结束工位的有效过站时间 |
+| 当前静置数 | 存在静置开始时间，且不存在静置结束时间的 Pack 数 |
+| 静置中数量 | 当前静置数中，当前时间 - 静置开始时间 < 标准静置时长 |
+| 满足静置时间数 | 当前静置数中，当前时间 - 静置开始时间 >= 标准静置时长 |
+| 超时数量 | 当前静置数中，当前时间 - 静置开始时间 > 标准静置时长 + 超时阈值 |
+| 今日开始静置数 | OP410 过站时间属于今日的 Pack 数 |
+| 今日静置完成数 | 静置结束时间属于今日的 Pack 数 |
+| 达标后等待时长 | 当前时间 - 达标时间 |
+
+## 3. 工位过站矩阵
+
+表头工位：
+- 42。
+- 43。
+- 44。
+- 45。
+- 46。
+- 47。
+- 48。
+- 49。
+- 50。
+
+每个工位返回状态建议：
+
+| 状态值 | 含义 |
+| --- | --- |
+| PASS | 已过站 |
+| CURRENT | 当前最新过站 |
+| WAIT | 未过站 |
+| ERROR | 应过未过、顺序异常或数据异常 |
+
+## 4. 线体段映射
+
+当前建议分段如下，后续以现场设备命名为准：
+
+| 段编码 | 段名称 | 映射规则 |
+| --- | --- | --- |
+| S1 | OP410 入静置段 | 已过 OP410，未过 42 |
+| S2 | 42-44 段 | 最近过站在 42、43、44 |
+| S3 | 45-47 段 | 最近过站在 45、46、47 |
+| S4 | 48-50 段 | 最近过站在 48、49、50 |
+| S5 | 下层静置结束待确认段 | 已过 50，未过静置结束工位 |
+
+## 5. 建议查询能力
+
+### 5.1 静置看板_汇总查询
+
+用途：顶部指标和当班统计。
+
+建议返回字段：
+- 当前静置数。
+- 满足静置时间数。
+- 静置中数量。
+- 超时数量。
+- 今日开始静置数。
+- 今日静置完成数。
+- 当班开始静置数。
+- 当班静置完成数。
+- 平均静置时长。
+- 平均达标后等待时长。
+- 静置完成率。
+
+### 5.2 静置看板_静置Pack列表查询
+
+用途：中心主表。
+
+建议参数：
+- 记录条数。
+
+建议返回字段：
+- Pack码。
+- 产品型号。
+- 静置开始时间。
+- 当前静置时长。
+- 标准静置时长。
+- 剩余时长。
+- 超时时长。
+- 当前状态。
+- 当前所在段。
+- 最近过站。
+- 最近过站时间。
+- 工位42状态。
+- 工位43状态。
+- 工位44状态。
+- 工位45状态。
+- 工位46状态。
+- 工位47状态。
+- 工位48状态。
+- 工位49状态。
+- 工位50状态。
+
+### 5.3 静置看板_待流转清单查询
+
+用途：满足静置时间但未结束静置的 Pack 清单。
+
+建议返回字段：
+- Pack码。
+- 产品型号。
+- 静置开始时间。
+- 达标时间。
+- 达标后等待时长。
+- 当前所在段。
+
+### 5.4 静置看板_异常清单查询
+
+用途：超时和过站异常。
+
+建议返回字段：
+- Pack码。
+- 产品型号。
+- 异常类型。
+- 当前静置时长。
+- 超时时长。
+- 最近过站。
+- 最近过站时间。
+- 异常说明。
+
+### 5.5 静置看板_线体段滞留查询
+
+用途：线体段滞留分布。
+
+建议返回字段：
+- 段编码。
+- 段名称。
+- 当前Pack数。
+- 超时Pack数。
+- 最长滞留时长。
+
+### 5.6 静置看板_小时JPH查询
+
+用途：今日小时入出静置 JPH。
+
+建议返回字段：
+- 小时。
+- 开始静置数量。
+- 静置结束数量。
+- 净增数量。
+
+## 6. 前端调用约定
+
+当前项目通过注入的 `CreateData` 和 `ExecDatabase` 调用 MES 存储过程。
+
+前端编码时应遵循：
+- 不猜测接口返回结构，先确认存储过程字段。
+- 字段名以存储过程实际返回为准。
+- 对空数据展示空状态，不写大量模糊错误兜底。
+- 查询失败时保持页面基本结构，避免大屏整屏空白。
+
+## 7. 待确认数据项
+
+1. Pack 过站记录表或现有查询存储过程。
+2. 产品型号来源字段。
+3. 标准静置时长来源。
+4. OP410 与 42-50 的实际工位编码关系。
+5. 下层静置结束工位。
+6. 班次时间边界。
+
+## 8. 关联文档
+
+- [PRD.md](./PRD.md)
+- [UI_SPEC.md](./UI_SPEC.md)
+- [TODO.md](./TODO.md)
+
--- a/doc/PRD.md
+++ b/doc/PRD.md
@@ -0,0 +1,129 @@
+# 静置库大屏看板 PRD
+
+## 1. 背景与目标
+
+智柔宁德二线静置过程需要通过大屏实时展示 Pack 静置状态。老线看板以库区、库位、层数为主要展示对象，但新线静置不分库位，因此本项目需要转为以 Pack 静置进度、工位过站状态和线体段滞留为核心的过程监控看板。
+
+核心目标：
+- 让现场人员快速知道当前静置池压力。
+- 明确哪些 Pack 已满足静置时间，应该优先流转。
+- 暴露超时、过站缺失、顺序异常等风险。
+- 通过今日小时入出静置 JPH 判断是否存在堆积趋势。
+
+## 2. 用户与场景
+
+| 用户 | 使用场景 | 关注内容 |
+| --- | --- | --- |
+| 现场操作人员 | 查看当前可流转 Pack | 满足静置时间数、待流转清单 |
+| 班组长 | 判断当前班次静置节拍 | 当班开始静置数、完成数、平均静置时长 |
+| 工艺/质量人员 | 排查异常 Pack | 超时、过站缺失、顺序异常 |
+| 设备/线体管理人员 | 定位堆积段 | 线体段滞留数量、最长滞留时长 |
+| 生产管理人员 | 总览当日趋势 | 今日 JPH、静置完成数、当前静置数 |
+
+## 3. 功能范围
+
+### 3.1 顶部实时指标
+
+展示当前静置数、满足静置时间数、静置中数量、超时数量、今日开始静置数、今日静置完成数。
+
+**验收标准**：
+- [ ] 大屏顶部能同时看到 6 个关键指标。
+- [ ] 超时数量有明显告警色。
+- [ ] 满足静置时间数有明显可流转提示色。
+
+### 3.2 静置中 Pack 主列表
+
+按照超时、已达标、开始时间优先级滚动展示静置中的 Pack。
+
+字段包括：
+- Pack 码。
+- 产品型号。
+- 静置开始时间。
+- 当前静置时长。
+- 标准静置时长。
+- 剩余/超时时长。
+- 当前状态。
+- 当前所在段。
+- 42-50 工位过站灯。
+
+**验收标准**：
+- [ ] 超时 Pack 排在普通静置 Pack 前面。
+- [ ] 已满足静置时间 Pack 排在未达标 Pack 前面。
+- [ ] 每个 Pack 能看到 42-50 的过站状态。
+- [ ] 静置时长超过标准后状态能变为已达标或超时。
+
+### 3.3 满足静置待流转清单
+
+展示已经达到标准静置时长但尚未结束静置的 Pack。
+
+**验收标准**：
+- [ ] 能看到 Pack 码、产品型号、达标时间、达标后等待时长。
+- [ ] 清单为空时显示空状态，不误报异常。
+
+### 3.4 超时/异常清单
+
+展示静置超时、过站缺失、过站顺序异常、数据缺失等异常 Pack。
+
+**验收标准**：
+- [ ] 不同异常类型有不同标签。
+- [ ] 能看到最近过站和最近过站时间。
+- [ ] 异常清单控制在大屏可读范围内。
+
+### 3.5 线体段滞留分布
+
+按线体过程段展示滞留情况，不展示库位矩阵。
+
+建议分段：
+- OP410 入静置段。
+- 42-44 段。
+- 45-47 段。
+- 48-50 段。
+- 下层静置结束待确认段。
+
+**验收标准**：
+- [ ] 每个段展示当前 Pack 数。
+- [ ] 每个段展示超时 Pack 数。
+- [ ] 每个段展示最长滞留时长。
+
+### 3.6 今日 JPH
+
+展示今日每小时开始静置数量和静置结束数量。
+
+**验收标准**：
+- [ ] 横轴按今日小时展示。
+- [ ] 同时展示开始静置和静置结束两组数据。
+- [ ] 可选展示净增数量，用于判断堆积趋势。
+
+## 4. 已排除功能
+
+| 功能 | 排除原因 |
+| --- | --- |
+| 库区/库位/层数矩阵 | 新线静置不分库位，照搬老线会误导现场 |
+| 强制入库/强制出库操作 | 当前阶段是看板展示，不做操作闭环 |
+| 手工修改 Pack 状态 | 数据应来自 MES 过站记录，避免大屏成为业务录入入口 |
+| 多页面菜单 | 当前目标是首页大屏，先保证核心监控完整 |
+
+## 5. 非功能要求
+
+| 类别 | 要求 |
+| --- | --- |
+| 分辨率 | 优先适配 1920x1080 大屏 |
+| 刷新频率 | 建议 30-60 秒刷新一次，后续按数据库压力确认 |
+| 可读性 | 关键数字和异常状态必须远距离可读 |
+| 稳定性 | 接口失败时保留页面框架，不出现整屏崩溃 |
+| 数据可信 | 指标口径必须可追溯到过站记录或明确存储过程 |
+
+## 6. 业务待确认
+
+1. “下层静置结束”对应工位号。
+2. 标准静置时长来源。
+3. 超时阈值。
+4. 42-50 是否全部必过。
+5. 是否需要班次统计及班次边界。
+
+## 7. 关联文档
+
+- [UI_SPEC.md](./UI_SPEC.md)
+- [DATA_SPEC.md](./DATA_SPEC.md)
+- [TODO.md](./TODO.md)
+
--- a/doc/README.md
+++ b/doc/README.md
@@ -0,0 +1,47 @@
+# 静置库大屏看板文档
+
+## 项目简介
+
+静置库大屏看板用于展示智柔宁德二线 Pack 静置过程状态，重点关注当前静置数量、已达标待流转数量、超时异常、工位过站状态、线体段滞留和今日入出静置节拍。
+
+## 项目范围
+
+- 看板对象：智柔宁德二线静置过程。
+- 静置起点：OP410 有效过站。
+- 静置终点：下层静置结束对应工位，有待业务确认。
+- 新线约束：不按老线库区、库位、层数展示。
+- 当前阶段：先完成内容规划和页面信息结构，后续再细化图表样式、数据接口和存储过程。
+
+## 技术栈
+
+| 类型 | 选型 |
+| --- | --- |
+| 前端框架 | Vue 3 |
+| 构建工具 | Vite |
+| 图表 | ECharts |
+| 大屏组件 | @kjgl77/datav-vue3 |
+| UI 组件 | Element Plus、TDesign Vue Next |
+| 状态管理 | Pinia |
+| 接口方式 | CreateData / ExecDatabase 调用 MES 存储过程 |
+
+## 文档索引
+
+| 文档 | 说明 |
+| --- | --- |
+| [PRD.md](./PRD.md) | 产品需求与业务目标 |
+| [UI_SPEC.md](./UI_SPEC.md) | 大屏页面内容与布局规划 |
+| [DATA_SPEC.md](./DATA_SPEC.md) | 数据口径与接口能力规划 |
+| [TODO.md](./TODO.md) | 后续开发任务清单 |
+
+## 参考资料
+
+- [参考看板图片 但新线无库位号一说.png](./参考看板图片%20但新线无库位号一说.png)
+
+## 关键待确认项
+
+1. “下层静置结束”对应的准确工位号。
+2. 产品型号对应标准静置时长的数据来源。
+3. 超时阈值定义。
+4. 42-50 是否全部属于静置过程必过工位。
+5. 班次边界是否需要纳入统计。
+
--- a/doc/TODO.md
+++ b/doc/TODO.md
@@ -0,0 +1,62 @@
+# 静置库大屏看板开发任务清单
+
+## A. 业务确认
+
+- [ ] A1 确认下层静置结束工位号。
+- [ ] A2 确认 42-50 是否全部属于必过工位。
+- [ ] A3 确认标准静置时长来源。
+- [ ] A4 确认超时阈值定义。
+- [ ] A5 确认是否需要班次统计及班次时间。
+
+## B. 数据查询
+
+- [ ] B1 梳理 Pack 过站数据来源。
+- [ ] B2 编写或复用静置汇总查询。
+- [ ] B3 编写或复用静置 Pack 列表查询。
+- [ ] B4 编写或复用工位过站矩阵查询。
+- [ ] B5 编写或复用待流转清单查询。
+- [ ] B6 编写或复用异常清单查询。
+- [ ] B7 编写或复用线体段滞留查询。
+- [ ] B8 编写或复用小时 JPH 查询。
+
+## C. 前端页面改造
+
+- [ ] C1 将现有生产追溯标题和模块替换为静置库看板内容。
+- [ ] C2 改造顶部 6 个指标卡。
+- [ ] C3 实现静置中 Pack 主表。
+- [ ] C4 实现 42-50 工位过站灯。
+- [ ] C5 实现待流转清单。
+- [ ] C6 实现超时/异常清单。
+- [ ] C7 实现线体段滞留图。
+- [ ] C8 实现今日小时 JPH 图表。
+- [ ] C9 调整左侧当前入静置/出静置信息。
+
+## D. 联调验证
+
+- [ ] D1 用测试数据验证静置开始口径。
+- [ ] D2 用测试数据验证静置结束口径。
+- [ ] D3 验证已达标、静置中、超时状态判断。
+- [ ] D4 验证 42-50 工位灯显示。
+- [ ] D5 验证空数据场景。
+- [ ] D6 验证接口失败时页面不崩溃。
+- [ ] D7 验证 1920x1080 大屏显示无明显重叠。
+
+## E. 交付准备
+
+- [ ] E1 补充最终存储过程字段说明。
+- [ ] E2 更新 README 文档索引。
+- [ ] E3 提交 Git 版本。
+- [ ] E4 部署到目标大屏环境验证。
+
+## 任务索引
+
+| 分组 | 数量 |
+| --- | ---: |
+| A. 业务确认 | 5 |
+| B. 数据查询 | 8 |
+| C. 前端页面改造 | 9 |
+| D. 联调验证 | 7 |
+| E. 交付准备 | 4 |
+
+总任务数：33。
+
--- a/doc/UI_SPEC.md
+++ b/doc/UI_SPEC.md
@@ -0,0 +1,150 @@
+# 静置库大屏看板 UI 规划
+
+## 1. 设计原则
+
+1. 过程优先：新线不展示库位，以 Pack 静置状态和工位过站过程为主。
+2. 异常前置：超时、已达标待流转、过站缺失必须优先可见。
+3. 信息密度适中：大屏用于远距离浏览，不堆叠过多小字。
+4. 图表服务业务：每个图表必须回答一个现场问题。
+
+## 2. 页面结构
+
+```text
+--------------------------------------------------------------------------------+
+| Logo                   静置库大屏看板                    日期 / 时间 / 刷新状态 |
+--------------------------------------------------------------------------------+
+| 当前静置数 | 满足静置时间数 | 静置中数量 | 超时数量 | 今日开始 | 今日完成        |
+--------------------------------------------------------------------------------+
+| 左侧概览区          | 中心主区：静置中 Pack 列表 + 工位过站灯 | 右侧监控区       |
+| - 当班统计          | Pack码 产品型号 开始时间 时长 状态 42-50 | - 待流转清单     |
+| - 当前入静置 Pack   |                                        | - 超时异常清单   |
+| - 当前出静置 Pack   |                                        | - 线体段滞留     |
+--------------------------------------------------------------------------------+
+| 今日小时 JPH：开始静置 / 静置结束 / 净增        | 静置异常明细或过站矩阵补充 |
+--------------------------------------------------------------------------------+
+```
+
+## 3. 顶部指标条
+
+建议使用 6 个指标卡：
+
+| 指标 | 颜色建议 | 说明 |
+| --- | --- | --- |
+| 当前静置数 | 蓝色 | 当前池子总压力 |
+| 满足静置时间数 | 绿色 | 可优先流转 |
+| 静置中数量 | 青色 | 未达到标准时间 |
+| 超时数量 | 红色 | 需要现场关注 |
+| 今日开始静置数 | 蓝紫色 | 今日入口 |
+| 今日静置完成数 | 金色 | 今日出口 |
+
+## 4. 中心主表
+
+中心主表是首页核心区域，建议使用滚动表格。
+
+字段规划：
+
+| 字段 | 展示方式 |
+| --- | --- |
+| 序号 | 2 位序号 |
+| Pack 码 | 主字段，超长省略 |
+| 产品型号 | 文本 |
+| 静置开始时间 | 月日 时分 |
+| 当前静置时长 | 数字 + 单位 |
+| 标准静置时长 | 数字 + 单位 |
+| 剩余/超时时长 | 正常显示剩余，超时显示红色 |
+| 状态 | 标签：静置中、已达标、超时、异常 |
+| 当前所在段 | 文本标签 |
+| 42-50 | 灯点矩阵 |
+
+工位灯规则：
+
+| 状态 | 颜色 | 含义 |
+| --- | --- | --- |
+| 已过站 | 绿色 | Pack 已完成该工位 |
+| 当前最新过站 | 蓝色 | Pack 最近一次过站位置 |
+| 未过站 | 灰色 | Pack 尚未经过该工位 |
+| 异常 | 红色 | 应过未过、顺序异常或数据异常 |
+
+## 5. 左侧概览区
+
+### 5.1 当班统计
+
+建议展示：
+- 当班开始静置数。
+- 当班静置完成数。
+- 平均静置时长。
+- 平均达标后等待时长。
+- 超时 Pack 数。
+- 静置完成率。
+
+### 5.2 当前入静置 Pack
+
+显示最近进入 OP410 的 Pack：
+- Pack 码。
+- 产品型号。
+- OP410 过站时间。
+- 当前静置时长。
+
+### 5.3 当前出静置 Pack
+
+显示最近完成下层静置结束的 Pack：
+- Pack 码。
+- 产品型号。
+- 静置结束时间。
+- 总静置时长。
+
+## 6. 右侧监控区
+
+### 6.1 满足静置待流转清单
+
+用于提醒现场优先处理。
+
+字段：
+- Pack 码。
+- 达标时间。
+- 达标后等待时长。
+- 当前所在段。
+
+### 6.2 超时/异常清单
+
+异常类型：
+- 静置超时。
+- 过站缺失。
+- 过站顺序异常。
+- 数据缺失。
+
+### 6.3 线体段滞留
+
+建议使用横向条形图或过程流转图，不使用库位矩阵。
+
+分段：
+- OP410 入静置段。
+- 42-44 段。
+- 45-47 段。
+- 48-50 段。
+- 下层静置结束待确认段。
+
+## 7. 底部趋势区
+
+### 今日 JPH
+
+建议使用双柱状图：
+- 开始静置数量。
+- 静置结束数量。
+
+可选增加净增折线：
+- 净增 = 开始静置数量 - 静置结束数量。
+
+## 8. 视觉参考
+
+可参考老线图片的大屏蓝色工业风、顶部指标、滚动表格和 JPH 图表表现，但不复用库位矩阵、库区、层数、强制入库/出库操作区域。
+
+参考图：
+- [参考看板图片 但新线无库位号一说.png](./参考看板图片%20但新线无库位号一说.png)
+
+## 9. 关联文档
+
+- [PRD.md](./PRD.md)
+- [DATA_SPEC.md](./DATA_SPEC.md)
+- [TODO.md](./TODO.md)
+
--- a/doc/参考看板图片但新线无库位号一说.png
+++ b/doc/参考看板图片但新线无库位号一说.png
--- a/index.html
+++ b/index.html
@@ -0,0 +1,20 @@
+<!doctype html>
+<html lang="en">
+
+<head>
+    <meta charset="UTF-8" />
+    <link href="/vite.svg" rel="icon" type="image/svg+xml" />
+    <meta content="width=device-width, initial-scale=1.0" name="viewport" />
+    <title>井下工具核心零部件精密加工示范线看板</title>
+    <script type="text/javascript">
+        document.write("<script src='/public/config.js?v=" + new Date().getTime() + "'><\/script>");
+    </script>
+    
+</head>
+
+<body>
+    <div id="app"></div>
+    <script src="/src/main.js" type="module"></script>
+</body>
+
+</html>
--- a/package-lock.json
+++ b/package-lock.json
--- a/package.json
+++ b/package.json
@@ -0,0 +1,31 @@
+{
+  "name": "vue3-view",
+  "private": true,
+  "version": "0.0.0",
+  "type": "module",
+  "scripts": {
+    "dev": "vite",
+    "build": "vite build",
+    "preview": "vite preview"
+  },
+  "dependencies": {
+    "@element-plus/icons-vue": "^2.3.1",
+    "@kjgl77/datav-vue3": "^1.7.4",
+    "axios": "^1.7.7",
+    "echarts": "^6.0.0",
+    "element-plus": "^2.8.6",
+    "js-cookie": "^3.0.5",
+    "path": "^0.12.7",
+    "pinia": "^2.2.5",
+    "rollup-plugin-copy": "^3.5.0",
+    "tdesign-vue-next": "^1.10.3",
+    "vue": "^3.5.12",
+    "vue-cookies": "^1.8.4",
+    "vue-router": "^4.4.5"
+  },
+  "devDependencies": {
+    "@vitejs/plugin-vue": "^5.1.4",
+    "sass": "^1.80.5",
+    "vite": "^5.4.10"
+  }
+}
--- a/prettier.config.js
+++ b/prettier.config.js
@@ -0,0 +1,19 @@
+export default {
+    printWidth: 100, // 一行最多多少字符
+    tabWidth: 2, // 缩进的宽度，2 个空格
+    useTabs: false, // 是否使用制表符，不使用制表符，使用空格
+    semi: false, // 语句结尾是否使用分号
+    bracketSpacing: true, // 大括号 {} 中开始和结束是否要空格，true — { foo: 1 }，false — {foo: 1}
+    trailingComma: 'none', // 数组或对象或参数的最后一项是否尾随逗号，none — 没有尾随逗号，all — 尽可能使用尾随逗号，es5 — 在 ES5 中有效的尾随逗号（对象、数组等），TypeScript 和 Flow 类型参数中的尾随逗号。
+    arrowParens: 'always', // 只有一个参数的箭头函数是否带括号，always — 始终带括号，avoid — 不带括号
+    proseWrap: 'always', // 什么对代码进行折行，always — 如果超过 printWidth 指定的一行最多字符宽度，则进行折行；never — 将每块代码块展开成一行；preserve — 什么都不做，保持原样。
+    htmlWhitespaceSensitivity: 'strict', // 根据显示样式决定 html 要不要折行
+    endOfLine: 'auto', // 每行的结束符（回车符、换行符），取值请参考 https://www.prettier.cn/docs/options.html#end-of-line
+    // 每个文件格式化的范围是文件的全部内容
+    rangeStart: 0,
+    rangeEnd: Infinity,
+    // 不需要写文件开头的@prettier
+    requirePragma: false,
+    // 不需要自动在文件开头插入@prettier
+    insertPragma: false,
+}
--- a/public/ClientLogo.png
+++ b/public/ClientLogo.png
--- a/public/ClientLogo2.png
+++ b/public/ClientLogo2.png
--- a/public/config.js
+++ b/public/config.js
@@ -0,0 +1,3 @@
+window.g = {
+    API_WEB_URL: 'http://localhost:10230',
+};
--- a/public/vite.svg
+++ b/public/vite.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="iconify iconify--logos" width="31.88" height="32" preserveAspectRatio="xMidYMid meet" viewBox="0 0 256 257"><defs><linearGradient id="IconifyId1813088fe1fbc01fb466" x1="-.828%" x2="57.636%" y1="7.652%" y2="78.411%"><stop offset="0%" stop-color="#41D1FF"></stop><stop offset="100%" stop-color="#BD34FE"></stop></linearGradient><linearGradient id="IconifyId1813088fe1fbc01fb467" x1="43.376%" x2="50.316%" y1="2.242%" y2="89.03%"><stop offset="0%" stop-color="#FFEA83"></stop><stop offset="8.333%" stop-color="#FFDD35"></stop><stop offset="100%" stop-color="#FFA800"></stop></linearGradient></defs><path fill="url(#IconifyId1813088fe1fbc01fb466)" d="M255.153 37.938L134.897 252.976c-2.483 4.44-8.862 4.466-11.382.048L.875 37.958c-2.746-4.814 1.371-10.646 6.827-9.67l120.385 21.517a6.537 6.537 0 0 0 2.322-.004l117.867-21.483c5.438-.991 9.574 4.796 6.877 9.62Z"></path><path fill="url(#IconifyId1813088fe1fbc01fb467)" d="M185.432.063L96.44 17.501a3.268 3.268 0 0 0-2.634 3.014l-5.474 92.456a3.268 3.268 0 0 0 3.997 3.378l24.777-5.718c2.318-.535 4.413 1.507 3.936 3.838l-7.361 36.047c-.495 2.426 1.782 4.5 4.151 3.78l15.304-4.649c2.372-.72 4.652 1.36 4.15 3.788l-11.698 56.621c-.732 3.542 3.979 5.473 5.943 2.437l1.313-2.028l72.516-144.72c1.215-2.423-.88-5.186-3.54-4.672l-25.505 4.922c-2.396.462-4.435-1.77-3.759-4.114l16.646-57.705c.677-2.35-1.37-4.583-3.769-4.113Z"></path></svg>
--- a/src/App.vue
+++ b/src/App.vue
@@ -0,0 +1,56 @@
+<template>
+  <t-loading :loading="isLoading" size="large" text="加载中(大)...">
+    <router-view/>
+  </t-loading>
+</template>
+
+
+<script setup>
+import {useAppStore} from "@/store/app.js";
+import {storeToRefs} from "pinia";
+
+const store = useAppStore();
+// storeToRefs 响应式解构赋值 pinia
+const {isLoading} = storeToRefs(store);
+</script>
+
+
+<style lang="scss">
+// 定义的全局变量
+body {
+  margin: 0px;
+}
+
+/*修改提示框样式 更醒目*/
+.el-message-box {
+
+  // 标题
+  .el-message-box__title {
+    font-size: 35px;
+    font-weight: 700;
+    color: rgb(255, 143, 0);
+  }
+
+  // 提示文本
+  .el-message-box__message p {
+    font-size: 24px;
+    line-height: 40px;
+  }
+
+  // icon图标
+  .el-message-box__status {
+    font-size: 40px;
+  }
+
+  .el-message-box__btns {
+    justify-content: space-evenly;
+
+    .el-button {
+      width: 48%;
+      height: 6vh;
+      font-size: 1.6rem;
+    }
+  }
+}
+
+</style>
--- a/src/assets/404_images/404.png
+++ b/src/assets/404_images/404.png
--- a/src/assets/404_images/404_cloud.png
+++ b/src/assets/404_images/404_cloud.png
--- a/src/assets/dashboard/category-panel-frame.png
+++ b/src/assets/dashboard/category-panel-frame.png
--- a/src/assets/dashboard/title-frame.png
+++ b/src/assets/dashboard/title-frame.png
--- a/src/assets/font/DS-DIGI.TTF
+++ b/src/assets/font/DS-DIGI.TTF
--- a/src/assets/font/DS-DIGIB.TTF
+++ b/src/assets/font/DS-DIGIB.TTF
--- a/src/assets/font/DS-DIGII.TTF
+++ b/src/assets/font/DS-DIGII.TTF
--- a/src/assets/font/DS-DIGIT.TTF
+++ b/src/assets/font/DS-DIGIT.TTF
--- a/src/assets/font/font.css
+++ b/src/assets/font/font.css
@@ -0,0 +1,4 @@
+@font-face{
+  font-family:electronicFont;
+  src:url(./DS-DIGIT.TTF)
+}
--- a/src/assets/font/font.zip
+++ b/src/assets/font/font.zip
--- a/src/assets/image/MachineTool.png
+++ b/src/assets/image/MachineTool.png
--- a/src/assets/image/Robot.png
+++ b/src/assets/image/Robot.png
--- a/src/assets/image/image4.png
+++ b/src/assets/image/image4.png
--- a/src/components/HelloWorld.vue
+++ b/src/components/HelloWorld.vue
@@ -0,0 +1,50 @@
+<template>
+  <h1>{{ msg }}</h1>
+
+  <div class="card">
+    <button type="button" @click="count++">count is {{ count }}</button>
+    <p>
+      Edit
+      <code>components/HelloWorld.vue</code> to test HMR
+    </p>
+  </div>
+
+  <p>
+    Check out
+    <a href="https://vuejs.org/guide/quick-start.html#local" target="_blank"
+      >create-vue</a
+    >, the official Vue + Vite starter
+  </p>
+  <p>
+    Learn more about IDE Support for Vue in the
+    <a
+      href="https://vuejs.org/guide/scaling-up/tooling.html#ide-support"
+      target="_blank"
+      >Vue Docs Scaling up Guide</a
+    >.
+  </p>
+  <p class="read-the-docs">Click on the Vite and Vue logos to learn more</p>
+  <el-button type="primary">21321312</el-button>
+  <t-button disabled  loading>确定</t-button>
+  <t-button variant="dashed" ghost>幽灵按钮</t-button>
+  <icon name="cps-icon-home-sheep" url="https://tdesign.gtimg.com/icon/default-demo/index.js" size="2em" />
+
+  123
+</template>
+
+<script setup>
+import { ref } from 'vue'
+import { Icon } from 'tdesign-icons-vue-next';
+
+defineProps({
+  msg: String,
+})
+
+const count = ref(0)
+</script>
+
+<style lang="scss" scoped>
+.read-the-docs {
+  color: #888;
+}
+</style>
--- a/src/main.js
+++ b/src/main.js
@@ -0,0 +1,50 @@
+import {createApp} from 'vue'
+import App from './App.vue'
+//ElementPlus
+import ElementPlus from 'element-plus'
+import 'element-plus/dist/index.css'
+// TDesign
+import TDesign from 'tdesign-vue-next'
+// 引入组件库的少量全局样式变量
+import 'tdesign-vue-next/es/style/index.css'
+// DataV 大屏组件
+import DataVVue3 from '@kjgl77/datav-vue3'
+import '@kjgl77/datav-vue3/dist/style.css'
+// pinia
+import {createPinia} from 'pinia'
+//router
+import router from './router/index.js'
+//crud
+import curdVue3 from './utils/curdVue3'
+// el-icon
+import * as ElementPlusIconsVue from '@element-plus/icons-vue'
+import zhCn from 'element-plus/es/locale/lang/zh-cn'
+
+const app = createApp(App)
+for (const [key, component] of Object.entries(ElementPlusIconsVue)) {
+    app.component(key, component)
+}
+// 提供全局方法
+
+
+app.use(ElementPlus, {
+    locale: zhCn,
+})
+
+app.use(TDesign)
+app.use(DataVVue3)
+const pinia = createPinia() // 创建 Pinia 实例
+app.use(pinia)
+app.use(curdVue3)
+app.use(router)
+
+app.provide('CreateData', app.config.globalProperties.CreateData)
+app.provide('ExecDatabase', app.config.globalProperties.ExecDatabase)
+app.provide('ExecDatabaseByParam', app.config.globalProperties.ExecDatabaseByParam)
+// app.provide('ExecWritePLC', app.config.globalProperties.ExecWritePLC)
+// app.provide('ExecReadPLC', app.config.globalProperties.ExecReadPLC)
+// app.provide('ExecIMESAPI', app.config.globalProperties.ExecIMESAPI)
+
+app.mount('#app')
+
+// useRouteGuard(); // 使用路由守卫
--- a/src/router/index.js
+++ b/src/router/index.js
@@ -0,0 +1,27 @@
+import {createRouter, createWebHashHistory} from "vue-router";
+
+// cookies
+
+// 创建routes
+const routes = [
+    {
+        // 重定向
+        path: "/home",
+        redirect: "/",
+    },
+    {
+        //主看板 
+        path: "/",
+        name: "root",
+        component: () => import("@/views/index.vue"),
+        children: [],
+    }
+];
+
+//History路由模型
+const router = createRouter({
+    history: createWebHashHistory(import.meta.env.BASE_URL),
+    routes,
+});
+
+export default router;
--- a/src/router/useRouteGuard.js
+++ b/src/router/useRouteGuard.js
@@ -0,0 +1,76 @@
+import { inject } from 'vue';
+import { useRouter } from 'vue-router';
+import {ElMessage} from "element-plus";
+import Cookies from "vue-cookies";
+
+
+export function useRouteGuard() {
+    const router = useRouter();
+    const CreateData = inject('CreateData');
+    const ExecDatabase = inject('ExecDatabase');
+    let userId = Cookies.get('userId')
+    // 防止首次或者刷新界面路由失效
+    let registerRouteFresh = true
+    router.beforeEach(async (to, from, next) => {
+        if (registerRouteFresh) {
+            if(userId !== ''){
+                // 获取权限列表
+                var param = []
+                param[0] = ['userId', userId]
+                var Data = CreateData('11', '基础表_权限模块_查询', param)
+                ExecDatabase(Data).then(response => {
+                    if(response.data.length > 0){
+                        routerData.value.userRouterList = response.data
+                        // 创建动态路由列表
+                        const dynamicRoutes = dynamicRouter(response.data);
+
+                        dynamicRoutes.forEach((route) => {
+                            // 检查是否已存在该路由，避免重复添加
+                            if (!router.hasRoute(route.name)) {
+                                router.addRoute('root', route);
+                            }
+                        });
+                    }else{
+                        ElMessage.warning('该角色未分配角色模块，请先进行分配!')
+                    }
+                    next({ ...to, replace: true })
+                    registerRouteFresh = false
+                })
+            }else{
+                next({ ...to, replace: true })
+                registerRouteFresh = false
+            }
+        } else {
+            if (to.meta.title) {
+                window.document.title = to.meta.title;
+            }
+            next()
+        }
+    })
+
+    // 递归替换引入component
+    function dynamicRouter(routerList) {
+        const list = [];
+        routerList.forEach((route) => {
+            const routeItem = {
+                path: '/' + route.path,
+                name:route.path,
+                meta: {
+                    title: route.权限模块,
+                },
+                component: async () => {
+                    try {
+                        const component = await import(`@/views/${route.path}/index.vue`);
+                        console.log(component)
+                        return component.default || component;
+                    } catch (error) {
+                        console.error('引入路由组件失败，请确认地址是否配置正确:', error);
+                        return null;
+                    }
+                },
+            };
+            list.push(routeItem);
+        });
+        return list;
+    }
+}
--- a/src/store/app.js
+++ b/src/store/app.js
@@ -0,0 +1,28 @@
+import {defineStore} from 'pinia'
+
+
+// 第一个参数是应用程序中 store 的唯一 id
+export const useAppStore = defineStore('AppData', {
+    // 其它配置项
+    state: () => {
+        return {
+            user: {
+                AID: '',
+                name: '',
+                classes: '',
+                teamGroup: '',
+                role: '',
+                userName: '',
+                password: '',
+                opName: '',
+            },
+            isLoading: false,
+            routerData: {
+                userRouterList: [],
+                nowRouterPath: '',
+                nowRouterTitle: '',
+                selected: false,
+            },
+        };
+    },
+})
--- a/src/utils/auth.js
+++ b/src/utils/auth.js
@@ -0,0 +1,15 @@
+import Cookies from 'js-cookie'
+
+const TokenKey = 'Admin-Token'
+
+export function getToken() {
+  return Cookies.get(TokenKey)
+}
+
+export function setToken(token) {
+  return Cookies.set(TokenKey, token)
+}
+
+export function removeToken() {
+  return Cookies.remove(TokenKey)
+}
--- a/src/utils/curd.js
+++ b/src/utils/curd.js
@@ -0,0 +1,435 @@
+import { ExcelDownLoad } from '@/utils/request'
+import request from '@/utils/request'
+import Cookie from 'js-cookie'
+import { type } from './tool' // type判断传入值的类型，比typeof更详细
+export default {
+  exportExcel_NPOI(param) {
+    console.log(param, 1)
+    download(`${ExcelDownLoad}?param=${param}`)
+  },
+  // 用于生成传通讯服务器参数。
+  // 传入参数
+  // 1）type：11查询；12增删改，必须
+  // 2）name：存储过程名，必须
+  // 3）data：存储过程参数名和对应值，例如：
+  //    param[0] = ['工艺计划流水号', this.工艺计划流水号]  输入参数
+  //    param[1] = ['PageCurrent', '1111', 'int', '1']  output参数
+  // 数组里四个分别对应：存储过程参数名（必须）；存储过程参数值（必须）；参数类型（若是output必须）；参数是否为output（0否1是）
+  // 4）pageSize，pageList：分页使用，可选
+  CreateData(type, name, data, pageSize, pageList) {
+    var param_Str = ''
+    var param_array = []
+    if (type === '7') {
+      data.map(v => {
+        pageSize.map(h => {
+          const val = h.toString()
+          if (!v[val]) {
+            this.$set(v, val, '')
+          }
+        })
+      })
+      param_Str = data
+    } else {
+      if (data !== undefined) {
+        for (let i = 0; i < data.length; i++) {
+          param_array.push({
+            name: data[i][0],
+            value: data[i][1],
+            type: data[i][2],
+            output: data[i][3]
+          })
+        }
+        param_Str = JSON.stringify(param_array)
+      }
+    }
+    var obj = []
+    obj[0] = {}
+    obj[0].type = type
+    obj[0].name = name
+    obj[0].param = param_Str
+    obj[0].pageSize = pageSize
+    obj[0].pageList = pageList
+    obj[0].UserID = Cookie.get('username')
+    obj[0].ModularID = ''//this.$router.currentRoute.path
+    console.log(obj[0], 'obj[0]')
+    var numn = JSON.stringify(obj[0])
+    return numn
+  },
+  // 新通讯11/12---<
+  ExecDatabase(data) {
+    return request({
+      url: '',
+      method: 'post',
+      data: data
+    })
+  },
+  // 高精原CreateData
+  // Vue.prototype.CreateData = function(type, name, data, pageSize, pageList) {
+  //   var paramStr = ''
+  //   var paramarray = []
+  //   if (data !== undefined) {
+  //     for (let i = 0; i < data.length; i++) {
+  //       paramarray.push({
+  //         name: data[i][0],
+  //         value: data[i][1],
+  //         type: data[i][2],
+  //         output: data[i][3]
+  //       })
+  //     }
+  //     paramStr = JSON.stringify(paramarray)
+  //   }
+  //   var obj = []
+  //   obj[0] = {}
+  //   obj[0].type = type
+  //   obj[0].name = name
+  //   obj[0].param = paramStr
+  //   obj[0].pageSize = pageSize
+  //   obj[0].pageList = pageList
+  //   var numn = JSON.stringify(obj[0])
+  //   return numn
+  // }
+
+  // 用于打开增加框，方法能重置表单，并使表单内容回到初始化状态。
+  // 传入参数
+  // 1）表单名称，字符串形式如'form'，必须
+  // 2) 打开表单后需要做什么，可以传数组[this.dialogvisiale = false， fetchData],也可以传回调函数function() { this.dialogvisiale = false } 可选
+  addForm(form, callback) {
+    if (type(form) === 'string') {
+      if (this.$refs[form]) { // 判断是否需要重置表单，如果需要重置表单
+        this.$refs[form].resetFields()
+      }
+      if (type(callback) === 'array') { // 判断传入是否为数组，如果是遍历数组，遇到函数将函数体变成函数执行，其余正常执行
+        if (callback && callback.length !== 0) {
+          for (let i = 0, len = callback.length; i < len; i++) {
+            typeof callback[i] === 'function' ? callback[i]() : callback[i]
+          }
+        }
+      } else if (type(callback) === 'function') { // 判断传入是否为回调函数
+        callback.call(this) // 回调函数执行，需将this改为该组件
+      }
+      this[form] = Object.assign(this.$data[form], this.$options.data()[form]) // 将表单中的数据变为初始状态。其中,this.$options.data是所有初始化的数据，this.$data是目前的数据
+    } else {
+      console.error('传入参数错误')
+    }
+  },
+  // 用于打开编辑框，方法能自动传入行的数据到对应的表单中,并将表单中所有纯数字转成int。前提是行的名称需跟表单名称一样。
+  // 传入参数
+  // 1) 编辑这一行的row
+  // 2）表单名称，字符串形式如'form'
+  // 3) 打开编辑需要做什么，同样是[] 和 function
+  editForm(row, form, callback) {
+    if (type(row) === 'object' && type(form) === 'string') {
+      if (this.$refs[form]) { // 判断是否需要重置表单
+        this.$refs[form].resetFields()
+      }
+      const isNum = /^[0-9]+$/ // 正则表达式，是否全都为纯数字
+      for (const prop in this[form]) { // 遍历表单，当表单和row中属性名一样时，表单row中的属性赋值给form
+        isNum.lastIndex = 0 // 正则每一次匹配后的索引归0，否则循环会造成问题
+        isNum.exec(row[prop]) ? this[form][prop] = parseInt(row[prop]) : this[form][prop] = row[prop] // 通过正则匹配数字，当匹配成功后，将字符串转为int。当然你也不用担心空转成NaN,因为''匹配通不过！
+      }
+      if (type(callback) === 'array') { // 这部分处理与打开表单相同
+        if (callback && callback.length !== 0) {
+          for (let i = 0, len = callback.length; i < len; i++) {
+            typeof callback[i] === 'function' ? callback[i]() : callback[i]
+          }
+        }
+      } else if (type(callback) === 'function') {
+        callback.call(this)
+      }
+    } else {
+      console.error('传入参数错误')
+    }
+  },
+  // 用于获取下拉框中的数据
+  // 传入参数
+  // 1）请求数据函数引用如getXXX，必须
+  // 2）数组的实行名称['XXXX名称', 'XXXX代码']，必须
+  // 3）需要用哪个数组接收这个结果，字符串形式。如在组件也需要用this.select,传入值就为'select'，必须
+  // 4) 请求函数传入的参数，可选
+  getSelect(requestData, select, carrier, param) {
+    if (type(requestData) === 'function' && type(select) === 'array' && type(carrier) === 'string') {
+      if (type(param) === 'array') {
+        requestData(...param).then(response => { // 这个方法没什么难度，不注释了
+          this[carrier] = []
+          for (let i = 0, len = response.data.length; i < len; i++) {
+            if (select.length === 2) {
+              this[carrier].push({
+                label: response.data[i][select[0]],
+                value: response.data[i][select[1]]
+              })
+            } else {
+              this[carrier].push({
+                value: response.data[i][select[0]]
+              })
+            }
+          }
+        })
+      } else {
+        requestData(param).then(response => { // 这个方法没什么难度，不注释了
+          this[carrier] = []
+          for (let i = 0, len = response.data.length; i < len; i++) {
+            if (select.length === 2) {
+              this[carrier].push({
+                label: response.data[i][select[0]],
+                value: response.data[i][select[1]]
+              })
+            } else {
+              this[carrier].push({
+                value: response.data[i][select[0]]
+              })
+            }
+          }
+        })
+      }
+    } else {
+      console.error('参数传递错误')
+    }
+  },
+  // 普通获取数据
+  // 传入参数
+  // 1) 请求数据函数引用如getXXX，必须
+  // 2) 需要用哪个数组接收这个结果，字符串形式。如在组件也需要用this.select,传入值就为'select'，必须
+  // 3) 请求函数传入的参数，可选
+  getData(requestData, carrier, param) {
+    if (type(requestData) === 'function' && type(carrier) === 'string') {
+      if (type(param) === 'undefined') {
+        requestData(param).then(response => {
+          const data = response.data
+          this[carrier] = data
+        })
+      } else {
+        let Param = []
+        if (type(param) !== 'array') {
+          Param.push(param)
+        } else {
+          Param = param
+        }
+        requestData(...Param).then(response => {
+          const data = response.data
+          this[carrier] = data
+        })
+      }
+    } else {
+      console.error('传入参数错误')
+    }
+  },
+  // 获取表格数据,将表格中的年月日时分秒，转换成年月日
+  // 传入参数
+  // 1）请求数据函数引用如getXXX，必须
+  // 2）请求的参数，可选
+  // 3）接受值，数组，一般是['table','total','loading']顺序不能变
+  getTable(requestData, param, e) {
+    requestData(...param).then(response => {
+      const data = response.data.rows
+      this[e[0]] = []
+      this[e[1]] = 0
+      if (data && data.length > 0) {
+        const isTime = /^\d{4}([-\/.])\d{1,2}\1\d{1,2}/ // 判断是否是时间的正则表达式
+        for (let i = 0, len = data.length; i < len; i++) { // 循环得到每一条数据
+          for (const prop in data[i]) { // 循环每一条的每一项
+            isTime.lastIndex = 0 // 正则每一次指针复位
+            if (isTime.test(data[i][prop])) { // 判断是否是时间，如果是切割
+              data[i][prop] = data[i][prop].split(' ')[0]
+            }
+          }
+        }
+        this[e[0]] = data
+        this[e[1]] = parseInt(response.data.total)
+      } else {
+        this[e[0]] = []
+        // console.log('暂无数据')
+      }
+    }).then(() => {
+      this[e[2]] = false
+    })
+  },
+  // 添加表格数据
+  // 传入参数
+  // 1) 请求数据函数引用如getXXX，必须
+  // 2) 请求的参数，可选
+  // 3) 验证的表单名称，必须
+  // 4) 回调函数，必须
+  addTable(requestData, param, form, callback) {
+    if (type(callback) === 'function' && type(requestData) === 'function' && type(form) === 'string') {
+      console.log(this.$refs[form])
+      this.$refs[form].validate((valid) => {
+        console.log(valid)
+        if (valid) {
+          requestData(...param).then(response => {
+            if (response.data[0].result === '1') {
+              this.$message.success('增加成功')
+              callback.call(this)
+            } else { this.$message.error('增加失败') }
+          })
+        } else {
+          console.error('error submit!!')
+          return false
+        }
+      })
+    } else {
+      console.error('参数传递错误')
+    }
+  },
+  // 编辑表格数据
+  // 传入参数
+  // 1) 请求数据函数引用如getXXX，必须
+  // 2) 请求的参数，可选
+  // 3) 验证的表单名称，必须
+  // 4) 回调函数，必须
+  editTable(requestData, param, form, callback) {
+    if (type(callback) === 'function' && type(requestData) === 'function' && type(form) === 'string') {
+      this.$refs[form].validate((valid) => {
+        if (valid) {
+          requestData(...param).then(response => {
+            if (response.data[0].result === '1') {
+              this.$message.success('修改成功')
+              callback.call(this) // 回调函数修正this指向组件本身
+            } else { this.$message.error('修改失败') }
+          })
+        } else {
+          console.error('error submit!!')
+          return false
+        }
+      })
+    } else {
+      console.error('参数传递错误')
+    }
+  },
+  // 删除表格数据
+  // 传入参数
+  // 1) 请求数据函数引用如getXXX，必须
+  // 2) id传入删除条件，必须
+  // 3) 回调函数，必须
+  deleteRow(requestData, id, callback) {
+    if (type(callback) === 'function' && type(requestData) === 'function') {
+      if (this.tableData && this.tableData.length === 1 && this.pageCurrent > 1) { // 判断删除的是否是最后一页最后一行，如果是且不是第一页，页数减一
+        this.pageCurrent--
+      }
+      this.$confirm('此操作将永久删除该行, 是否继续?', '提示', {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+        type: 'warning'
+      }).then(() => {
+        requestData(id).then(response => {
+          if (response.data[0].result === '1') {
+            this.$message.success('删除成功')
+            callback.call(this) // 回调函数修正this指向组件本身
+          } else { this.$message.error('数据占用') }
+        })
+      }).catch(() => {
+        this.$message({
+          type: 'info',
+          message: '已取消删除'
+        })
+      })
+    } else {
+      console.error('参数传递错误')
+    }
+  },
+  // 设置字段宽度
+  setColumnWidth(str) {
+    let columnWidth = 0
+    if (str === '日期') {
+      columnWidth = 90
+    } else if (str === '订单编号' || str === '领料单号' || str === '调拨单号' || str === '订单号' || str === '机床名称') {
+      columnWidth = 140
+    } else if (str === '合同编号' || str === '补货单号') {
+      columnWidth = 140
+    } else if (str === '产品名称' || str === '部件名称') {
+      columnWidth = 110
+    } else if (str === '序号') {
+      columnWidth = 60
+    } else if (str === '单位') {
+      columnWidth = 60
+    } else if (str === '数量' || str === '库存') {
+      columnWidth = 80
+    } else if (str === '单价') {
+      columnWidth = 90
+    } else if (str === '金额') {
+      columnWidth = 120
+    } else if (str === '状态' || str === '类型' || str === '选入' || str === '选出') {
+      columnWidth = 80
+    } else if (str === '付款方式') {
+      columnWidth = 100
+    } else if (str === '买方' || str === '买方名称') {
+      columnWidth = 150
+    } else if (str === '外协厂家' || str === '调入仓库' || str === '调出仓库') {
+      columnWidth = 150
+    } else if (str === '姓名') {
+      columnWidth = 80
+    } else if (str === '日期时间') {
+      columnWidth = 140
+    } else if (str === '工序') {
+      columnWidth = 80
+    } else if (str === '物料名称' || str === '工件名称' || str === '零件名称') {
+      columnWidth = 140
+    } else if (str === '图号或型号' || str === '规格' || str === '零件图号' || str === '图号' || str === '图号/型号') {
+      columnWidth = 120
+    } else if (str === '物料编码' || str === '物料编号') {
+      columnWidth = 120
+    } else if (str === '材料') {
+      columnWidth = 80
+    } else if (str === '仓位' || str === '库位') {
+      columnWidth = 90
+    } else if (str === '品名/规格/型号') {
+      columnWidth = 140
+    } else if (str === '备注') {
+      columnWidth = 120
+    } else if (str === '工序名称') {
+      columnWidth = 150
+    } else if (str === '工序说明') {
+      columnWidth = 300
+    } else if (str === '加工工时M' || str === '加工时长H' || str === '加工时长M') {
+      columnWidth = 90
+    } else if (str === '加工设备') {
+      columnWidth = 130
+    } else if (str === '产品详情' || str === '详情') {
+      columnWidth = 340
+    } else if (str === '最低库存') {
+      columnWidth = 110
+    } else if (str === '本次到货数' || str === '本次入库' || str === '补货数') {
+      columnWidth = 100
+    } else {
+      columnWidth = 110
+    }
+    return columnWidth
+  }
+}
+function download(url) {
+  getBlob(url, function(blob, filename) {
+    console.log(blob, filename, 2)
+    saveAs(blob, filename)
+  })
+}
+
+function getBlob(url, cb) {
+  var xhr = new XMLHttpRequest()
+  xhr.open('GET', url, true)
+  xhr.responseType = 'blob'
+  xhr.onload = function() {
+    if (xhr.status === 200) {
+      const name = xhr.getResponseHeader('content-disposition').split('=')[1]
+      var filename = decodeURIComponent(name)
+      cb(xhr.response, filename)
+    }
+  }
+  xhr.send()
+}
+
+function saveAs(blob, filename) {
+  if (window.navigator.msSaveOrOpenBlob) {
+    navigator.msSaveBlob(blob, filename)
+  } else {
+    var link = document.createElement('a')
+    var body = document.querySelector('body')
+    link.href = window.URL.createObjectURL(blob)
+    link.download = filename
+    // fix Firefox
+    link.style.display = 'none'
+    body.appendChild(link)
+    link.click()
+    body.removeChild(link)
+    window.URL.revokeObjectURL(link.href)
+  }
+}
+
--- a/src/utils/curdVue3.js
+++ b/src/utils/curdVue3.js
@@ -0,0 +1,135 @@
+import request from '@/utils/request'
+import Cookie from 'js-cookie'
+
+export default {
+    install(app) {
+        app.config.globalProperties.CreateData = function (type, name, data, pageSize, pageList) {
+            var param_Str = ''
+            var param_array = []
+            if (type === '7') {
+                data.map(v => {
+                    pageSize.map(h => {
+                        const val = h.toString()
+                        if (!v[val]) {
+                            this.$set(v, val, '')
+                        }
+                    })
+                })
+                param_Str = data
+            } else {
+                if (data !== undefined) {
+                    for (let i = 0; i < data.length; i++) {
+                        param_array.push({
+                            name: data[i][0],
+                            value: data[i][1],
+                            type: data[i][2],
+                            output: data[i][3]
+                        })
+                    }
+                    param_Str = JSON.stringify(param_array)
+                }
+            }
+            var obj = []
+            obj[0] = {}
+            obj[0].type = type
+            obj[0].name = name
+            obj[0].param = param_Str
+            obj[0].pageSize = pageSize
+            obj[0].pageList = pageList
+            obj[0].UserID = Cookie.get('username')
+            obj[0].ModularID = ''//this.$router.currentRoute.path
+            console.log(obj[0], 'obj[0]')
+            var numn = JSON.stringify(obj[0])
+            return numn
+        }
+        app.config.globalProperties.ExecDatabase = function (data) {
+            return request({
+                url: '',
+                method: 'post',
+                data: data
+            })
+        }
+
+        app.config.globalProperties.ExecDatabaseByParam = function (type, name, data, pageSize, pageList) {
+            var param_Str = ''
+            var param_array = []
+            if (type === '7') {
+                data.map(v => {
+                    pageSize.map(h => {
+                        const val = h.toString()
+                        if (!v[val]) {
+                            this.$set(v, val, '')
+                        }
+                    })
+                })
+                param_Str = data
+            } else {
+                if (data !== undefined) {
+                    for (let i = 0; i < data.length; i++) {
+                        param_array.push({
+                            name: data[i][0],
+                            value: data[i][1],
+                            type: data[i][2],
+                            output: data[i][3]
+                        })
+                    }
+                    param_Str = JSON.stringify(param_array)
+                }
+            }
+            var obj = []
+            obj[0] = {}
+            obj[0].type = type
+            obj[0].name = name
+            obj[0].param = param_Str
+            obj[0].pageSize = pageSize
+            obj[0].pageList = pageList
+            obj[0].UserID = Cookie.get('username')
+            obj[0].ModularID = ''//this.$router.currentRoute.path
+            console.log(obj[0], 'obj[0]')
+            var numn = JSON.stringify(obj[0])
+            return request({
+                url: '',
+                method: 'post',
+                data: numn
+            })
+        }
+
+        // app.config.globalProperties.ExecWritePLC = function (opName, tagTypeCodeID, value) {
+        //     return request({
+        //         url: window.g.API_MES_URL + '/api/imes/Web_WritePLC',
+        //         method: 'post',
+        //         data: {
+        //             tagTypeCodeID: tagTypeCodeID,
+        //             OPName: opName,
+        //             tagValue: value,
+        //         }
+        //     }).catch(function (error) {
+        //         // 如果接口调用失败，弹出错误弹窗
+        //         ElMessage.error('写入PLC数据接口失败: ' + error.message)
+        //     });
+        // }
+        // app.config.globalProperties.ExecReadPLC = function (opName, tagTypeCodeID) {
+        //     return request({
+        //         url: window.g.API_MES_URL + '/api/imes/Web_ReadPLC',
+        //         method: 'post',
+        //         data: {
+        //             tagTypeCodeID: tagTypeCodeID,
+        //             OPName: opName,
+        //         }
+        //     }).catch(function (error) {
+        //         // 如果接口调用失败，弹出错误弹窗
+        //         ElMessage.error('读取PLC数据接口失败: ' + error.message)
+        //     });
+        // }
+        // app.config.globalProperties.ExecIMESAPI = function (apiName, param) {
+        //     return request({
+        //         url: window.g.API_MES_URL + '/api/imes/' + apiName,
+        //         method: 'post',
+        //         data: param
+        //     }).catch(function (error) {
+        //         // 如果接口调用失败，弹出错误弹窗
+        //         ElMessage.error('调用MES' + apiName + '接口失败: ' + error.message)
+        //     });
+        // }
+    }
+}
--- a/src/utils/index.js
+++ b/src/utils/index.js
@@ -0,0 +1,96 @@
+/**
+ * Created by jiachenpan on 16/11/18.
+ */
+
+export function parseTime(time, cFormat) {
+  if (arguments.length === 0) {
+    return null
+  }
+  const format = cFormat || '{y}-{m}-{d} {h}:{i}:{s}'
+  let date
+  if (typeof time === 'object') {
+    date = time
+  } else {
+    if (('' + time).length === 10) time = parseInt(time) * 1000
+    date = new Date(time)
+  }
+  const formatObj = {
+    y: date.getFullYear(),
+    m: date.getMonth() + 1,
+    d: date.getDate(),
+    h: date.getHours(),
+    i: date.getMinutes(),
+    s: date.getSeconds(),
+    a: date.getDay()
+  }
+  const time_str = format.replace(/{(y|m|d|h|i|s|a)+}/g, (result, key) => {
+    let value = formatObj[key]
+    // Note: getDay() returns 0 on Sunday
+    if (key === 'a') { return ['日', '一', '二', '三', '四', '五', '六'][value ] }
+    if (result.length > 0 && value < 10) {
+      value = '0' + value
+    }
+    return value || 0
+  })
+  return time_str
+}
+
+export function formatTime(time, option) {
+  time = +time * 1000
+  const d = new Date(time)
+  const now = Date.now()
+
+  const diff = (now - d) / 1000
+
+  if (diff < 30) {
+    return '刚刚'
+  } else if (diff < 3600) {
+    // less 1 hour
+    return Math.ceil(diff / 60) + '分钟前'
+  } else if (diff < 3600 * 24) {
+    return Math.ceil(diff / 3600) + '小时前'
+  } else if (diff < 3600 * 24 * 2) {
+    return '1天前'
+  }
+  if (option) {
+    return parseTime(time, option)
+  } else {
+    return (
+      d.getMonth() +
+      1 +
+      '月' +
+      d.getDate() +
+      '日' +
+      d.getHours() +
+      '时' +
+      d.getMinutes() +
+      '分'
+    )
+  }
+}
+
+function zeroFill(i) {
+  if (i >= 0 && i <= 9) {
+    return '0' + i
+  } else {
+    return i
+  }
+}
+
+export function getNowDAY() { // 默认显示今天
+// 获取当前时间
+  const date = new Date()
+  const month = zeroFill(date.getMonth() + 1)
+  const day = zeroFill(date.getDate())
+  const time = date.getFullYear() + '-' + month + '-' + day
+  return time
+}
+
+export function get90DAY() { // 3个月显示今天
+  var Data = new Date()
+  Data.setTime(Data.getTime() - 3600 * 1000 * 24 * 90)
+  const month = zeroFill(Data.getMonth() + 1)
+  const day = zeroFill(Data.getDate())
+  const time = Data.getFullYear() + '-' + month + '-' + day
+  return time
+}
--- a/src/utils/mqtt.js
+++ b/src/utils/mqtt.js
@@ -0,0 +1,104 @@
+import { v4 as uuid } from 'uuid'
+import mqtt from 'mqtt'
+export { Mqtt }
+class Mqtt {
+  constructor(config) {
+    this.connection = {
+      host: config.host,
+      port: config.port,
+      endpoint: config.endpoint || '/mqtt',
+      clean: config.clean || true,
+      connectTimeout: config.connectTimeout || 4000,
+      reconnectPeriod: config.reconnectPeriod || 4000,
+      clientId: config.clientId || uuid(),
+      username: config.username || '',
+      password: config.password || ''
+    }
+    this.client = {
+      connected: false
+    }
+  }
+  // 创建连接
+  createConnection() {
+    // 连接字符串, 通过协议指定使用的连接方式
+    // ws 未加密 WebSocket 连接
+    // wss 加密 WebSocket 连接
+    // mqtt 未加密 TCP 连接
+    // mqtts 加密 TCP 连接
+    // wxs 微信小程序连接
+    // alis 支付宝小程序连接
+    const { host, port, endpoint, ...options } = this.connection
+    const connectUrl = `ws://${host}:${port}${endpoint}`
+    try {
+      this.client = mqtt.connect(connectUrl, options)
+    } catch (error) {
+      // 连接错位、
+      this.connectError(error)
+    }
+  }
+  connectError(error) {
+    console.log('mqtt.connect error', error)
+  }
+  // 订阅主题
+  doSubscribe(subscription) {
+    const { topic, qos } = subscription
+    let subscribeSuccess = false
+    this.client.subscribe(topic, { qos }, (error, res) => {
+      if (error) {
+        subscribeSuccess = false
+        console.log('Subscribe to topics error', error)
+      } else {
+        subscribeSuccess = true
+        console.log('Subscribe to topics res', res)
+      }
+    })
+    return subscribeSuccess
+  }
+  // 取消订阅
+  doUnSubscribe(subscription) {
+    const { topic } = subscription
+    let unSubscribeSuccess = false
+    this.client.unsubscribe(topic, error => {
+      if (error) {
+        unSubscribeSuccess = false
+        console.log('Unsubscribe error', error)
+      } else {
+        unSubscribeSuccess = true
+      }
+    })
+    return unSubscribeSuccess
+  }
+  // 发送消息
+  doPublish(publish) {
+    const { topic, qos, payload } = publish
+    let doPublishSuccess = false
+    this.client.publish(topic, payload, qos, error => {
+      if (error) {
+        doPublishSuccess = false
+        console.log('Publish error', error)
+      } else {
+        doPublishSuccess = true
+      }
+    })
+    return doPublishSuccess
+  }
+  // 断开连接
+  destroyConnection() {
+    let destroyConnectionSuccess = false
+    if (this.client.connected) {
+      try {
+        this.client.end()
+        this.client = {
+          connected: false
+        }
+        destroyConnectionSuccess = true
+        console.log('Successfully disconnected!')
+      } catch (error) {
+        destroyConnectionSuccess = false
+        console.log('Disconnect failed', error.toString())
+      }
+    }
+    return destroyConnectionSuccess
+  }
+}
+
--- a/src/utils/request.js
+++ b/src/utils/request.js
@@ -0,0 +1,35 @@
+import axios from 'axios'
+// import store from '@/store'
+import {ElMessage} from 'element-plus' // 引入Element Plus的消息提示组件
+const name_config = `OP8888`
+//  import.meta.env.VITE_BASE_URL
+console.log(window.g)
+const request_config = window.g.API_WEB_URL + `/submit/MESCommonBase.ashx`
+export const name = name_config
+const service = axios.create({
+    baseURL: request_config,
+    timeout: 1000 * 5 // 请求超时时间
+})
+
+// && config.data.name !== '菜单系统模块_通知信息_查询数据' && config.data.name !== '菜单系统模块_首页信息_查询数据1' && config.data.name !== '菜单系统模块_首页信息_查询数据2'
+service.interceptors.request.use(config => {
+
+    return config
+}, error => {
+    if (error.code === 'ECONNABORTED' && error.message.includes('timeout')) {
+        ElMessage({
+            message: '请求超时，请稍后再试。',
+            type: 'error',
+            duration: 5000
+        })
+    } else {
+        ElMessage({
+            message: '请求失败，请稍后再试。',
+            type: 'error',
+            duration: 5000
+        })
+    }
+    return Promise.reject(error)
+})
+
+export default service
--- a/src/utils/setMethods.js
+++ b/src/utils/setMethods.js
@@ -0,0 +1,90 @@
+
+/**
+ * Parse the time to string
+ * @param {(Object|string|number)} time
+ * @param {string} cFormat
+ * @returns {string}
+ */
+export function parseTime(time, cFormat) {
+  if (arguments.length === 0) {
+    return null
+  }
+  const format = cFormat || '{y}-{m}-{d} {h}:{i}:{s}'
+  let date
+  if (typeof time === 'object') {
+    date = time
+  } else {
+    if (typeof time === 'string' && /^[0-9]+$/.test(time)) {
+      time = parseInt(time)
+    }
+    if (typeof time === 'number' && time.toString().length === 10) {
+      time = time * 1000
+    }
+    date = new Date(time)
+  }
+  const formatObj = {
+    y: date.getFullYear(),
+    m: date.getMonth() + 1,
+    d: date.getDate(),
+    h: date.getHours(),
+    i: date.getMinutes(),
+    s: date.getSeconds(),
+    a: date.getDay()
+  }
+  // eslint-disable-next-line
+  const time_str = format.replace(/{(y|m|d|h|i|s|a)+}/g, (result, key) => {
+    let value = formatObj[key]
+    // Note: getDay() returns 0 on Sunday
+    if (key === 'a') {
+      return ['日', '一', '二', '三', '四', '五', '六'][value]
+    }
+    if (result.length > 0 && value < 10) {
+      value = '0' + value
+    }
+    return value || 0
+  })
+  // eslint-disable-next-line
+  return time_str
+}
+
+/**
+ * Parse the json to excel
+ *  tableJson 导出数据 ; filenames导出表的名字; autowidth表格宽度自动 true or false; bookTypes xlsx & csv & txt
+ * @param {(Object)} tableJson
+ * @param {string} filenames
+ * @param {boolean} autowidth
+ * @param {string} bookTypes
+ */
+export function json2excel(tableJson, filenames, autowidth, bookTypes) {
+  import('@/vendor/Export2Excel').then(excel => {
+    var tHeader = []
+    var dataArr = []
+    var sheetnames = []
+    for (var i in tableJson) {
+      tHeader.push(tableJson[i].tHeader)
+      dataArr.push(formatJson(tableJson[i].filterVal, tableJson[i].tableDatas))
+      sheetnames.push(tableJson[i].sheetName)
+    }
+    console.log(dataArr, 9191)
+    excel.export_json_to_excel2({
+      header: tHeader,
+      data: dataArr,
+      sheetname: sheetnames,
+      filename: filenames,
+      autoWidth: autowidth,
+      bookType: bookTypes
+    })
+  })
+}
+// 数据过滤，时间过滤
+function formatJson(filterVal, jsonData) {
+  return jsonData.map(v =>
+    filterVal.map(j => {
+      if (j === 'timestamp') {
+        return parseTime(v[j])
+      } else {
+        return v[j]
+      }
+    })
+  )
+}
--- a/src/utils/tool.js
+++ b/src/utils/tool.js
@@ -0,0 +1,361 @@
+// 数组去重
+export function arrayUnique(arr) {
+  arr.filter((element, index, arr) => {
+    return arr.indexOf(element) === index
+  })
+}
+
+// 数组去重，数组中值是对象
+export function arrayUnique2(arr, name) {
+  const hash = {}
+  return arr.reduce(function (item, next) {
+    hash[next[name]] ? '' : hash[next[name]] = true && item.push(next)
+    return item
+  }, [])
+}
+
+// 时间转时间戳
+export function timeToStamp(time) {
+  const date = new Date(time)
+  return date.getTime()
+}
+
+// 数组的深度拷贝
+export function arrDeepCopy(arr) {
+  const newArr = []
+  for (const prop in arr) newArr[prop] = typeof arr[prop] === 'object' ? arrDeepCopy(arr[prop]) : arr[prop]
+  return newArr
+}
+
+// 对象的深度拷贝
+export function objDeepCopy(obj) {
+  const newObj = {}
+  for (const prop in obj) newObj[prop] = typeof obj[prop] === 'object' ? objDeepCopy(obj[prop]) : obj[prop]
+  return newObj
+}
+
+function zeroFill(i) {
+  if (i >= 0 && i <= 9) {
+    return '0' + i
+  } else {
+    return i
+  }
+}
+
+// 获取当前时间(yyyy-mm-dd hh:mm:ss)
+export function getNowTime() {
+  const date = new Date()
+  const month = zeroFill(date.getMonth() + 1)
+  const day = zeroFill(date.getDate())
+  const hour = zeroFill(date.getHours())
+  const minute = zeroFill(date.getMinutes())
+  const second = zeroFill(date.getSeconds())
+  const time = date.getFullYear() + '-' + month + '-' + day + ' ' + hour + ':' + minute + ':' + second
+  return time
+}
+
+export function getNowTime2() {
+  const date66 = new Date()
+  const month66 = zeroFill(date66.getMonth() + 1)
+  const day66 = zeroFill(date66.getDate())
+  const date = date66.getFullYear() + '-' + month66 + '-' + day66
+  // var date = '2019-3-31'
+  var arr = date.split('-')
+  var year = arr[0] // 获取当前日期的年份
+  var month = arr[1] // 获取当前日期的月份
+  var day = arr[2] // 获取当前日期的日
+  // var days = new Date(year, month, 0)
+  // days = days.getDate() // 获取当前日期中月的天数
+  var year2 = year
+  var month2 = parseInt(month) - 1
+  if (month2 === 0) {
+    year2 = parseInt(year2) - 1
+    month2 = 12
+  }
+  var day2 = day
+  var days2 = new Date(year2, month2, 0)
+  days2 = days2.getDate()
+  if (day2 > days2) {
+    day2 = days2
+  }
+  if (month2 < 10) {
+    month2 = '0' + month2
+  }
+  var t2 = year2 + '-' + month2 + '-' + day2
+  return t2
+}
+
+// 获取当前时间(yyyy-mm-dd)
+export function getNowShotTime() {
+  const date = new Date()
+  const month = zeroFill(date.getMonth() + 1)
+  const day = zeroFill(date.getDate())
+  const time = date.getFullYear() + '-' + month + '-' + day
+  return time
+}
+
+// 获取当前时间(yyyy/mm/dd)
+export function getNowShotTime1() {
+  const date = new Date()
+  const month = zeroFill(date.getMonth() + 1)
+  const day = zeroFill(date.getDate())
+  const time = date.getFullYear() + '/' + month + '/' + day
+  return time
+}
+
+// 获取当前0晨
+export function getNowTime1() {
+  const date = new Date()
+  const month = zeroFill(date.getMonth() + 1)
+  const year = zeroFill(date.getFullYear())
+  const day = zeroFill(date.getDate())
+  let hour = zeroFill(date.getHours())
+  hour = hour < 10 ? ('0' + hour) : hour
+  let minute = zeroFill(date.getMinutes())
+  minute = minute < 10 ? ('0' + minute) : minute
+  let second = zeroFill(date.getSeconds())
+  second = second < 10 ? ('0' + second) : second
+  // const hour = '00'
+  // const minute = '00'
+  // const second = '00'
+  const time = year + '-' + month + '-' + day + ' ' + hour + ':' + minute + ':' + second
+  return time
+}
+
+export function getNowTime3(date) {
+  const month = zeroFill2(date.getMonth() + 1)
+  const day = zeroFill(date.getDate())
+  return date.getFullYear() + '-' + month + '-' + day
+}
+
+function zeroFill2(i) {
+  if (i >= 0 && i <= 9) {
+    if (i === 0) {
+      return '01'
+    } else {
+      return '0' + i
+    }
+  } else {
+    return i
+  }
+}
+
+// 工时统计上个月26-本月25
+export function getTime26() {
+  const date = new Date()
+  const day = date.getDate()
+  if (day >= 25) {
+    var month = zeroFill(date.getMonth() + 1)
+    if (month === 0) {
+      month = 12
+      const day = 26
+      const time = date.getFullYear() - 1 + '-' + month + '-' + day
+      return time
+    } else {
+      const day = 26
+      const time = date.getFullYear() + '-' + month + '-' + day
+      return time
+    }
+  } else {
+    var month2 = zeroFill(date.getMonth() + 1) - 1
+    if (month2 === 0) {
+      month2 = 12
+      const day = 26
+      const time = date.getFullYear() - 1 + '-' + month2 + '-' + day
+      return time
+    } else {
+      const day = 26
+      const time = date.getFullYear() + '-' + month2 + '-' + day
+      return time
+    }
+  }
+}
+
+export function getTime25() {
+  const date = new Date()
+  const day = date.getDate()
+  if (day >= 25) {
+    const month = zeroFill(date.getMonth() + 2)
+    const day2 = 25
+    const time = date.getFullYear() + '-' + month + '-' + day2
+    return time
+  } else {
+    const month = zeroFill(date.getMonth() + 1)
+    const day2 = 25
+    const time = date.getFullYear() + '-' + month + '-' + day2
+    return time
+  }
+}
+
+// 判断类型
+export function type(target) {
+  const ret = typeof (target)
+  const template = {
+    '[object Array]': 'array',
+    '[object Object]': 'object',
+    '[object String]': 'string - object',
+    '[object Number]': 'Number - object',
+    '[object Boolean]': 'Boolean - object'
+  }
+  if (target === null) {
+    return 'null'
+  }
+  if (ret === 'object') {
+    const str = Object.prototype.toString.call(target)
+    return template[str]
+  } else {
+    return ret
+  }
+}
+
+export function SectionToChinese(section) {
+  const chnNumChar = ['零', '一', '二', '三', '四', '五', '六', '七', '八', '九']
+  const chnUnitChar = ['', '十', '百', '千']
+  let strIns = ''
+  let chnStr = ''
+  let unitPos = 0
+  let zero = true
+  while (section > 0) {
+    const v = section % 10
+    if (v === 0) {
+      if (!zero) {
+        zero = true
+        chnStr = chnNumChar[v] + chnStr
+      }
+    } else {
+      zero = false
+      strIns = chnNumChar[v]
+      strIns += chnUnitChar[unitPos]
+      chnStr = strIns + chnStr
+    }
+    unitPos++
+    section = Math.floor(section / 10)
+  }
+  return chnStr
+}
+
+export function sleep(time) {
+  return new Promise(resolve => {
+    setTimeout(resolve, time)
+  })
+}
+
+export function groupBy(datas, keys) {
+  const list = datas || []
+  const groups = []
+  const result = []
+  list.forEach(v => {
+    const key = {}
+    keys.forEach(k => {
+      key[k] = v[k]
+    })
+    let group = groups.find(v => {
+      return v._key === JSON.stringify(key)
+    })
+    if (!group) {
+      group = {
+        _key: JSON.stringify(key),
+        key: key
+      }
+      groups.push(group)
+    }
+    group.data1 = group.data1 || 0
+    group.key.数量 = group.data1 += v.数量
+    group.data2 = group.data2 || ''
+    group.key.机床图号_组号 = group.data2 += (v.机床图号 || '') + '-' + (v.组号 ? v.组号.split('组')[0] : '') + '<br/>'
+    group.data3 = group.data3 || 0
+    group.key.合计 = group.data3 += v.合计
+  })
+  groups.map(v => {
+    result.push(v.key)
+  })
+  return result
+}
+
+// 去除js浮点加法bug
+export function numAdd(arg1, arg2) {
+  var r1, r2, m
+  try {
+    r1 = arg1.toString().split('.')[1].length
+  } catch (e) {
+    r1 = 0
+  }
+  try {
+    r2 = arg2.toString().split('.')[1].length
+  } catch (e) {
+    r2 = 0
+  }
+  m = Math.pow(10, Math.max(r1, r2))
+  return (arg1 * m + arg2 * m) / m
+}
+
+// 去除js浮点减法bug
+export function numSubtract(arg1, arg2) {
+  var r1, r2, m, n
+  try {
+    r1 = arg1.toString().split('.')[1].length
+  } catch (e) {
+    r1 = 0
+  }
+  try {
+    r2 = arg2.toString().split('.')[1].length
+  } catch (e) {
+    r2 = 0
+  }
+  m = Math.pow(10, Math.max(r1, r2))
+  n = (r1 >= r2) ? r1 : r2
+  return ((arg1 * m - arg2 * m) / m).toFixed(n)
+}
+
+// 去除js浮点乘法bug
+export function numMultiply(arg1, arg2) {
+  var m = 0
+  var s1 = arg1.toString()
+  var s2 = arg2.toString()
+  try {
+    m += s1.split('.')[1].length
+  } catch (e) {
+    console.log(e)
+  }
+  try {
+    m += s2.split('.')[1].length
+  } catch (e) {
+    console.log(e)
+  }
+  return Number(s1.replace('.', '')) * Number(s2.replace('.', '')) / Math.pow(10, m)
+}
+
+// 去除js浮点除法bug
+export function numDivide(arg1, arg2) {
+  var t1 = 0
+  var t2 = 0
+  var r1, r2
+  try {
+    t1 = arg1.toString().split('.')[1].length
+  } catch (e) {
+    console.log(e)
+  }
+  try {
+    t2 = arg2.toString().split('.')[1].length
+  } catch (e) {
+    console.log(e)
+  }
+  r1 = Math.Number(arg1.toString().replace('.', ''))
+  r2 = Math.Number(arg2.toString().replace('.', ''))
+  return (r1 / r2) * Math.pow(10, t2 - t1)
+}
+
+export function base64ImgtoFile(dataurl, filename = 'file') {
+  const arr = dataurl.split(',')
+  const mime = arr[0].match(/:(.*?);/)[1]
+  const suffix = mime.split('/')[1]
+  const bstr = atob(arr[1])
+  let n = bstr.length
+  const u8arr = new Uint8Array(n)
+  while (n--) {
+    u8arr[n] = bstr.charCodeAt(n)
+  }
+  return new File([u8arr], `${filename}.${suffix}`, {
+    type: mime
+  })
+}
--- a/src/utils/validate.js
+++ b/src/utils/validate.js
@@ -0,0 +1,32 @@
+/**
+ * Created by jiachenpan on 16/11/18.
+ */
+
+export function isvalidUsername(str) {
+  const user = /^[0-9]{5,7}$/
+  return true
+}
+
+/* 合法uri*/
+export function validateURL(textval) {
+  const urlregex = /^(https?|ftp):\/\/([a-zA-Z0-9.-]+(:[a-zA-Z0-9.&%$-]+)*@)*((25[0-5]|2[0-4][0-9]|1[0-9]{2}|[1-9][0-9]?)(\.(25[0-5]|2[0-4][0-9]|1[0-9]{2}|[1-9]?[0-9])){3}|([a-zA-Z0-9-]+\.)*[a-zA-Z0-9-]+\.(com|edu|gov|int|mil|net|org|biz|arpa|info|name|pro|aero|coop|museum|[a-zA-Z]{2}))(:[0-9]+)*(\/($|[a-zA-Z0-9.,?'\\+&%$#=~_-]+))*$/
+  return urlregex.test(textval)
+}
+
+/* 小写字母*/
+export function validateLowerCase(str) {
+  const reg = /^[a-z]+$/
+  return reg.test(str)
+}
+
+/* 大写字母*/
+export function validateUpperCase(str) {
+  const reg = /^[A-Z]+$/
+  return reg.test(str)
+}
+
+/* 大小写字母*/
+export function validatAlphabets(str) {
+  const reg = /^[A-Za-z]+$/
+  return reg.test(str)
+}
--- a/src/views/404.vue
+++ b/src/views/404.vue
@@ -0,0 +1,248 @@
+<template>
+  <div class="wscn-http404-container">
+    <div class="wscn-http404">
+      <div class="pic-404">
+        <img
+          class="pic-404__parent"
+          src="@/assets/404_images/404.png"
+          alt="404"
+        />
+        <img
+          class="pic-404__child left"
+          src="@/assets/404_images/404_cloud.png"
+          alt="404"
+        />
+        <img
+          class="pic-404__child mid"
+          src="@/assets/404_images/404_cloud.png"
+          alt="404"
+        />
+        <img
+          class="pic-404__child right"
+          src="@/assets/404_images/404_cloud.png"
+          alt="404"
+        />
+      </div>
+      <div class="bullshit">
+        <div class="bullshit__oops">OOPS!</div>
+        <div class="bullshit__info">
+          版权所有
+          <a class="link-type" href="https://wallstreetcn.com" target="_blank"
+            >华尔街见闻</a
+          >
+        </div>
+        <div class="bullshit__headline">{{ message }}</div>
+        <div class="bullshit__info">
+          请检查您输入的网址是否正确，请点击以下按钮返回主页或者发送错误报告
+        </div>
+        <a href="/" class="bullshit__return-home">返回首页</a>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+export default {
+  name: "Page404",
+  computed: {
+    message() {
+      return "网管说这个页面你不能进......";
+    },
+  },
+};
+</script>
+
+<style rel="stylesheet/scss" lang="scss" scoped>
+.wscn-http404-container {
+  transform: translate(-50%, -50%);
+  position: absolute;
+  top: 40%;
+  left: 50%;
+}
+.wscn-http404 {
+  position: relative;
+  width: 1200px;
+  padding: 0 50px;
+  overflow: hidden;
+  .pic-404 {
+    position: relative;
+    float: left;
+    width: 600px;
+    overflow: hidden;
+    &__parent {
+      width: 100%;
+    }
+    &__child {
+      position: absolute;
+      &.left {
+        width: 80px;
+        top: 17px;
+        left: 220px;
+        opacity: 0;
+        animation-name: cloudLeft;
+        animation-duration: 2s;
+        animation-timing-function: linear;
+        animation-fill-mode: forwards;
+        animation-delay: 1s;
+      }
+      &.mid {
+        width: 46px;
+        top: 10px;
+        left: 420px;
+        opacity: 0;
+        animation-name: cloudMid;
+        animation-duration: 2s;
+        animation-timing-function: linear;
+        animation-fill-mode: forwards;
+        animation-delay: 1.2s;
+      }
+      &.right {
+        width: 62px;
+        top: 100px;
+        left: 500px;
+        opacity: 0;
+        animation-name: cloudRight;
+        animation-duration: 2s;
+        animation-timing-function: linear;
+        animation-fill-mode: forwards;
+        animation-delay: 1s;
+      }
+      @keyframes cloudLeft {
+        0% {
+          top: 17px;
+          left: 220px;
+          opacity: 0;
+        }
+        20% {
+          top: 33px;
+          left: 188px;
+          opacity: 1;
+        }
+        80% {
+          top: 81px;
+          left: 92px;
+          opacity: 1;
+        }
+        100% {
+          top: 97px;
+          left: 60px;
+          opacity: 0;
+        }
+      }
+      @keyframes cloudMid {
+        0% {
+          top: 10px;
+          left: 420px;
+          opacity: 0;
+        }
+        20% {
+          top: 40px;
+          left: 360px;
+          opacity: 1;
+        }
+        70% {
+          top: 130px;
+          left: 180px;
+          opacity: 1;
+        }
+        100% {
+          top: 160px;
+          left: 120px;
+          opacity: 0;
+        }
+      }
+      @keyframes cloudRight {
+        0% {
+          top: 100px;
+          left: 500px;
+          opacity: 0;
+        }
+        20% {
+          top: 120px;
+          left: 460px;
+          opacity: 1;
+        }
+        80% {
+          top: 180px;
+          left: 340px;
+          opacity: 1;
+        }
+        100% {
+          top: 200px;
+          left: 300px;
+          opacity: 0;
+        }
+      }
+    }
+  }
+  .bullshit {
+    position: relative;
+    float: left;
+    width: 300px;
+    padding: 30px 0;
+    overflow: hidden;
+    &__oops {
+      font-size: 32px;
+      font-weight: bold;
+      line-height: 40px;
+      color: #1482f0;
+      opacity: 0;
+      margin-bottom: 20px;
+      animation-name: slideUp;
+      animation-duration: 0.5s;
+      animation-fill-mode: forwards;
+    }
+    &__headline {
+      font-size: 20px;
+      line-height: 24px;
+      color: #222;
+      font-weight: bold;
+      opacity: 0;
+      margin-bottom: 10px;
+      animation-name: slideUp;
+      animation-duration: 0.5s;
+      animation-delay: 0.1s;
+      animation-fill-mode: forwards;
+    }
+    &__info {
+      font-size: 13px;
+      line-height: 21px;
+      color: grey;
+      opacity: 0;
+      margin-bottom: 30px;
+      animation-name: slideUp;
+      animation-duration: 0.5s;
+      animation-delay: 0.2s;
+      animation-fill-mode: forwards;
+    }
+    &__return-home {
+      display: block;
+      float: left;
+      width: 110px;
+      height: 36px;
+      background: #1482f0;
+      border-radius: 100px;
+      text-align: center;
+      color: #ffffff;
+      opacity: 0;
+      font-size: 14px;
+      line-height: 36px;
+      cursor: pointer;
+      animation-name: slideUp;
+      animation-duration: 0.5s;
+      animation-delay: 0.3s;
+      animation-fill-mode: forwards;
+    }
+    @keyframes slideUp {
+      0% {
+        transform: translateY(60px);
+        opacity: 0;
+      }
+      100% {
+        transform: translateY(0);
+        opacity: 1;
+      }
+    }
+  }
+}
+</style>
--- a/src/views/index.vue
+++ b/src/views/index.vue
--- a/vite.config.js
+++ b/vite.config.js
@@ -0,0 +1,48 @@
+import { defineConfig } from 'vite'
+import vue from '@vitejs/plugin-vue'
+import { fileURLToPath, URL } from "node:url";
+import copy from 'rollup-plugin-copy'
+import { resolve } from 'path'
+
+// https://vite.dev/config/
+export default defineConfig({
+    base: './',
+    plugins: [
+        vue()
+    ],
+    resolve: {
+        alias: {
+            "@": fileURLToPath(new URL("./src", import.meta.url)),
+        },
+    },
+    pluginOptions: {
+        'style-resources-loader': {
+            preProcessor: 'scss',
+            patterns: []
+        }
+    },
+    define: {
+        'process.env': {}
+    },
+    // 完全禁用默认的 public 目录处理
+    publicDir: false,
+    build: {
+        // 清空输出目录时保留自定义拷贝的文件
+        emptyOutDir: true,
+
+        rollupOptions: {
+            plugins: [
+                copy({
+                    targets: [
+                        {
+                            src: 'public/**/*',  // 复制整个 public 目录
+                            dest: 'dist/public'  // 输出到 dist/public
+                        }
+                    ],
+                    hook: 'writeBundle',     // 在构建完成后执行
+                    copyOnce: true          // 仅拷贝一次
+                })
+            ]
+        }
+    },
+})
				`@@ -0,0 +1 @@`
				<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="iconify iconify--logos" width="31.88" height="32" preserveAspectRatio="xMidYMid meet" viewBox="0 0 256 257"><defs><linearGradient id="IconifyId1813088fe1fbc01fb466" x1="-.828%" x2="57.636%" y1="7.652%" y2="78.411%"><stop offset="0%" stop-color="#41D1FF"></stop><stop offset="100%" stop-color="#BD34FE"></stop></linearGradient><linearGradient id="IconifyId1813088fe1fbc01fb467" x1="43.376%" x2="50.316%" y1="2.242%" y2="89.03%"><stop offset="0%" stop-color="#FFEA83"></stop><stop offset="8.333%" stop-color="#FFDD35"></stop><stop offset="100%" stop-color="#FFA800"></stop></linearGradient></defs><path fill="url(#IconifyId1813088fe1fbc01fb466)" d="M255.153 37.938L134.897 252.976c-2.483 4.44-8.862 4.466-11.382.048L.875 37.958c-2.746-4.814 1.371-10.646 6.827-9.67l120.385 21.517a6.537 6.537 0 0 0 2.322-.004l117.867-21.483c5.438-.991 9.574 4.796 6.877 9.62Z"></path><path fill="url(#IconifyId1813088fe1fbc01fb467)" d="M185.432.063L96.44 17.501a3.268 3.268 0 0 0-2.634 3.014l-5.474 92.456a3.268 3.268 0 0 0 3.997 3.378l24.777-5.718c2.318-.535 4.413 1.507 3.936 3.838l-7.361 36.047c-.495 2.426 1.782 4.5 4.151 3.78l15.304-4.649c2.372-.72 4.652 1.36 4.15 3.788l-11.698 56.621c-.732 3.542 3.979 5.473 5.943 2.437l1.313-2.028l72.516-144.72c1.215-2.423-.88-5.186-3.54-4.672l-25.505 4.922c-2.396.462-4.435-1.77-3.759-4.114l16.646-57.705c.677-2.35-1.37-4.583-3.769-4.113Z"></path></svg>