diff --git a/mock/deviceStatus.ts b/mock/deviceStatus.ts new file mode 100644 index 0000000..0060e2d --- /dev/null +++ b/mock/deviceStatus.ts @@ -0,0 +1,32 @@ +/* + * @Author: donghao donghao@supervision.ltd + * @Date: 2025-03-07 14:57:20 + * @LastEditors: donghao donghao@supervision.ltd + * @LastEditTime: 2025-03-07 15:10:10 + * @FilePath: \5G-Loading-Bay-Web\mock\deviceStatus.ts + * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE + */ +import { MockMethod } from "vite-plugin-mock"; +import { deviceStatusListData } from "./pools/deviceStatusData"; +import { fetchCurrPageByList } from "./utils/apiMock"; + +export default [ + { + url: "/api/getDeviceStatusList", + method: "post", + response: req => { + const { page, pageSize } = req.body; + // console.log(req); + return { + ...fetchCurrPageByList({ + ...deviceStatusListData, + data: { + ...deviceStatusListData.data, + page, + pageSize: pageSize || 10 + } + }) + }; + } + } +] as MockMethod[]; \ No newline at end of file diff --git a/mock/pools/deviceStatusData.ts b/mock/pools/deviceStatusData.ts new file mode 100644 index 0000000..4a0c009 --- /dev/null +++ b/mock/pools/deviceStatusData.ts @@ -0,0 +1,58 @@ +/* + * @Author: donghao donghao@supervision.ltd + * @Date: 2024-02-22 13:38:04 + * @LastEditors: donghao donghao@supervision.ltd + * @LastEditTime: 2025-03-07 15:07:28 + * @FilePath: \General-AI-Platform-Web-Client\mock\pools\deviceStatusData.ts + * @Description: 设备状态数据 + */ +import { generateRandomDateTimeByYear } from "../utils/mockMoment"; +function fetchList(): Record[] { + const currList: Record[] = []; + const nameArr = [ + "摄像模组表面缺陷检测设备", + "镜片表面缺陷检测设备", + "中板表面缺陷检测设备", + "Logo表面缺陷检测设备", + "手机电池表面缺陷检测设备", + "部件表面缺陷检测设备", + "边距缺陷检测设备", + "成品组装缺陷检测设备", + "金属工件表面缺陷检测设备", + "管材表面缺陷检测设备" + ]; + + const codeArr = ["MSRF", "RL0F", "TLOC", "E1AIS", "CRM"]; + const deviceGroupArr = ["立杆", "东西货区", "送料区"]; + + for (let i = 0; i < 35; i++) { + currList.push({ + id: i, + createTime: generateRandomDateTimeByYear(2023), + updateTime: "2023-10-17T02:35:41.14308Z", + name: nameArr[Math.floor(Math.random() * 3)], + code: codeArr[Math.floor(Math.random() * 4)] + "-" + i, + deviceGroup: + deviceGroupArr[Math.floor(Math.random() * 3)] + + (Math.floor(Math.random() * 3) + 1), + status: Math.floor(Math.random() * 6) + 1, + remark: "" + }); + } + return currList; +} + +// 缺陷从EXL里选几个就好了 +// 告警代码MSRF-0 RL0F HTFIF-02 TLOC-1 E1AIS-05 +// 设备组：核心检测组001 无尘总装组005 送料监测线02 + +const currentData = fetchList(); + +export const deviceStatusListData = { + data: { + list: currentData, + total: currentData.length, + page: 1, + pageSize: 10 + } +}; diff --git a/mock/typing.ts b/mock/typing.ts new file mode 100644 index 0000000..ded9753 --- /dev/null +++ b/mock/typing.ts @@ -0,0 +1,17 @@ +/**成功返回数据结构 */ +export interface successMockApiProps { + code: number; // 0 成功 + success: boolean; // true 成功 + data: any; // mock业务层数据 + msg: string | undefined; // 成功提示 + isMock: boolean; // true 标识当前是模拟数据 +} + +/**失败返回数据结构 */ +export interface failMockApiProps { + code?: number; // 7 失败 + success: boolean; // false 失败 + data: any; // mock业务层数据 + msg: string | undefined; // 成功提示 + isMock: boolean; // true 标识当前是模拟数据 +} diff --git a/mock/utils/apiMock.ts b/mock/utils/apiMock.ts new file mode 100644 index 0000000..8445850 --- /dev/null +++ b/mock/utils/apiMock.ts @@ -0,0 +1,51 @@ +import { failMockApiProps, successMockApiProps } from "../typing"; +export function fetchMockSuccessFullByOther({ + data, + msg +}): successMockApiProps { + // return { + // code: 0, // 0 成功 + // success: true, // true 成功 + // data: data || null, // mock业务层数据 + // msg: msg | "ok", // 成功提示 + // isMock: true // true 标识当前是模拟数据 + // } as successMockApiProps; + const result: successMockApiProps = { + code: 0, // 0 成功 + success: true, // true 成功 + data: data || null, // mock业务层数据 + msg: msg as string | "ok", // 成功提示 + isMock: true // true 标识当前是模拟数据 + }; + return result; +} + +export function fetchMockFailFullByOther({ data, msg }): failMockApiProps { + // return { + // code: 599, // 0 成功 + // success: true, // true 成功 + // data: data || null, // mock业务层数据 + // msg: msg | "fail", // 成功提示 + // isMock: true // true 标识当前是模拟数据 + // } as failMockApiProps; + const result: failMockApiProps = { + code: 599, // 0 成功 + success: false, // true 成功 + data: data || null, // mock业务层数据 + msg: msg as string | "fail", // 成功提示 + isMock: true // true 标识当前是模拟数据 + }; + return result; +} + +// 分页展示 +export function fetchCurrPageByList({ data }): successMockApiProps { + // console.log("fetchCurrPageByList_data", data); + const { page, pageSize } = data; + const prevPage = page - 1; + const currPageData = { + ...data, + list: data.list.slice(prevPage * pageSize, page * pageSize) + }; + return fetchMockSuccessFullByOther({ data: currPageData }); +} diff --git a/mock/utils/mockMoment.ts b/mock/utils/mockMoment.ts new file mode 100644 index 0000000..5bdbeb0 --- /dev/null +++ b/mock/utils/mockMoment.ts @@ -0,0 +1,38 @@ +export function generateRandomDateTimeByYear(year) { + // 生成随机月份（1-12） + const month = Math.floor(Math.random() * 12) + 1; + + // 生成随机日期（1-31） + const day = Math.floor(Math.random() * 31) + 1; + + // 生成随机小时（0-23） + const hour = Math.floor(Math.random() * 24); + + // 生成随机分钟（0-59） + const minute = Math.floor(Math.random() * 60); + + // 生成随机秒钟（0-59） + const second = Math.floor(Math.random() * 60); + + // 返回随机日期和时间的字符串 + return `${year}-${month < 10 ? "0" : ""}${month}-${ + day < 10 ? "0" : "" + }${day} ${hour < 10 ? "0" : ""}${hour}:${minute < 10 ? "0" : ""}${minute}:${ + second < 10 ? "0" : "" + }${second}`; +} + +export function generateRandomMoment(date = new Date(), type = "HH:mm:ss") { + // 生成随机小时（0-23） + const hour = Math.floor(Math.random() * 24); + + // 生成随机分钟（0-59） + const minute = Math.floor(Math.random() * 60); + + // 生成随机秒钟（0-59） + const second = Math.floor(Math.random() * 60); + // 返回随机日期和时间的字符串 + return `${hour < 10 ? "0" : ""}${hour}:${minute < 10 ? "0" : ""}${minute}:${ + second < 10 ? "0" : "" + }${second}`; +} diff --git a/package.json b/package.json index 1360b9b..d5c5350 100644 --- a/package.json +++ b/package.json @@ -22,6 +22,7 @@ "@tailwindcss/postcss": "^4.0.10", "@types/echarts": "^5.0.0", "@vitejs/plugin-vue": "^5.2.1", + "@vitejs/plugin-vue-jsx": "^4.1.1", "@vue/tsconfig": "^0.7.0", "autoprefixer": "^10.4.20", "cross-env": "^7.0.3", diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index c1b28e1..9913d79 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -39,6 +39,9 @@ importers: '@vitejs/plugin-vue': specifier: ^5.2.1 version: 5.2.1(vite@6.2.0(jiti@2.4.2)(lightningcss@1.29.2)(sass@1.85.1)(yaml@2.7.0))(vue@3.5.13(typescript@5.7.3)) + '@vitejs/plugin-vue-jsx': + specifier: ^4.1.1 + version: 4.1.1(vite@6.2.0(jiti@2.4.2)(lightningcss@1.29.2)(sass@1.85.1)(yaml@2.7.0))(vue@3.5.13(typescript@5.7.3)) '@vue/tsconfig': specifier: ^0.7.0 version: 0.7.0(typescript@5.7.3)(vue@3.5.13(typescript@5.7.3)) @@ -82,6 +85,72 @@ packages: resolution: {integrity: sha512-UrcABB+4bUrFABwbluTIBErXwvbsU/V7TZWfmbgJfbkwiBuziS9gxdODUyuiecfdGQ85jglMW6juS3+z5TsKLw==} engines: {node: '>=10'} + '@ampproject/remapping@2.3.0': + resolution: {integrity: sha512-30iZtAPgz+LTIYoeivqYo853f02jBYSd5uGnGpkFV0M3xOt9aN73erkgYAmZU43x4VfqcnLxW9Kpg3R5LC4YYw==} + engines: {node: '>=6.0.0'} + + '@babel/code-frame@7.26.2': + resolution: {integrity: sha512-RJlIHRueQgwWitWgF8OdFYGZX328Ax5BCemNGlqHfplnRT9ESi8JkFlvaVYbS+UubVY6dpv87Fs2u5M29iNFVQ==} + engines: {node: '>=6.9.0'} + + '@babel/compat-data@7.26.8': + resolution: {integrity: sha512-oH5UPLMWR3L2wEFLnFJ1TZXqHufiTKAiLfqw5zkhS4dKXLJ10yVztfil/twG8EDTA4F/tvVNw9nOl4ZMslB8rQ==} + engines: {node: '>=6.9.0'} + + '@babel/core@7.26.9': + resolution: {integrity: sha512-lWBYIrF7qK5+GjY5Uy+/hEgp8OJWOD/rpy74GplYRhEauvbHDeFB8t5hPOZxCZ0Oxf4Cc36tK51/l3ymJysrKw==} + engines: {node: '>=6.9.0'} + + '@babel/generator@7.26.9': + resolution: {integrity: sha512-kEWdzjOAUMW4hAyrzJ0ZaTOu9OmpyDIQicIh0zg0EEcEkYXZb2TjtBhnHi2ViX7PKwZqF4xwqfAm299/QMP3lg==} + engines: {node: '>=6.9.0'} + + '@babel/helper-annotate-as-pure@7.25.9': + resolution: {integrity: sha512-gv7320KBUFJz1RnylIg5WWYPRXKZ884AGkYpgpWW02TH66Dl+HaC1t1CKd0z3R4b6hdYEcmrNZHUmfCP+1u3/g==} + engines: {node: '>=6.9.0'} + + '@babel/helper-compilation-targets@7.26.5': + resolution: {integrity: sha512-IXuyn5EkouFJscIDuFF5EsiSolseme1s0CZB+QxVugqJLYmKdxI1VfIBOst0SUu4rnk2Z7kqTwmoO1lp3HIfnA==} + engines: {node: '>=6.9.0'} + + '@babel/helper-create-class-features-plugin@7.26.9': + resolution: {integrity: sha512-ubbUqCofvxPRurw5L8WTsCLSkQiVpov4Qx0WMA+jUN+nXBK8ADPlJO1grkFw5CWKC5+sZSOfuGMdX1aI1iT9Sg==} + engines: {node: '>=6.9.0'} + peerDependencies: + '@babel/core': ^7.0.0 + + '@babel/helper-member-expression-to-functions@7.25.9': + resolution: {integrity: sha512-wbfdZ9w5vk0C0oyHqAJbc62+vet5prjj01jjJ8sKn3j9h3MQQlflEdXYvuqRWjHnM12coDEqiC1IRCi0U/EKwQ==} + engines: {node: '>=6.9.0'} + + '@babel/helper-module-imports@7.25.9': + resolution: {integrity: sha512-tnUA4RsrmflIM6W6RFTLFSXITtl0wKjgpnLgXyowocVPrbYrLUXSBXDgTs8BlbmIzIdlBySRQjINYs2BAkiLtw==} + engines: {node: '>=6.9.0'} + + '@babel/helper-module-transforms@7.26.0': + resolution: {integrity: sha512-xO+xu6B5K2czEnQye6BHA7DolFFmS3LB7stHZFaOLb1pAwO1HWLS8fXA+eh0A2yIvltPVmx3eNNDBJA2SLHXFw==} + engines: {node: '>=6.9.0'} + peerDependencies: + '@babel/core': ^7.0.0 + + '@babel/helper-optimise-call-expression@7.25.9': + resolution: {integrity: sha512-FIpuNaz5ow8VyrYcnXQTDRGvV6tTjkNtCK/RYNDXGSLlUD6cBuQTSw43CShGxjvfBTfcUA/r6UhUCbtYqkhcuQ==} + engines: {node: '>=6.9.0'} + + '@babel/helper-plugin-utils@7.26.5': + resolution: {integrity: sha512-RS+jZcRdZdRFzMyr+wcsaqOmld1/EqTghfaBGQQd/WnRdzdlvSZ//kF7U8VQTxf1ynZ4cjUcYgjVGx13ewNPMg==} + engines: {node: '>=6.9.0'} + + '@babel/helper-replace-supers@7.26.5': + resolution: {integrity: sha512-bJ6iIVdYX1YooY2X7w1q6VITt+LnUILtNk7zT78ykuwStx8BauCzxvFqFaHjOpW1bVnSUM1PN1f0p5P21wHxvg==} + engines: {node: '>=6.9.0'} + peerDependencies: + '@babel/core': ^7.0.0 + + '@babel/helper-skip-transparent-expression-wrappers@7.25.9': + resolution: {integrity: sha512-K4Du3BFa3gvyhzgPcntrkDgZzQaq6uozzcpGbOO1OEJaI+EJdqWIMTLgFgQf6lrfiDFo5FU+BxKepI9RmZqahA==} + engines: {node: '>=6.9.0'} + '@babel/helper-string-parser@7.25.9': resolution: {integrity: sha512-4A/SCr/2KLd5jrtOMFzaKjVtAei3+2r/NChoBNoZ3EyP/+GlhoaEGoWOZUmFmoITP7zOJyHIMm+DYRd8o3PvHA==} engines: {node: '>=6.9.0'} @@ -90,11 +159,45 @@ packages: resolution: {integrity: sha512-Ed61U6XJc3CVRfkERJWDz4dJwKe7iLmmJsbOGu9wSloNSFttHV0I8g6UAgb7qnK5ly5bGLPd4oXZlxCdANBOWQ==} engines: {node: '>=6.9.0'} + '@babel/helper-validator-option@7.25.9': + resolution: {integrity: sha512-e/zv1co8pp55dNdEcCynfj9X7nyUKUXoUEwfXqaZt0omVOmDe9oOTdKStH4GmAw6zxMFs50ZayuMfHDKlO7Tfw==} + engines: {node: '>=6.9.0'} + + '@babel/helpers@7.26.9': + resolution: {integrity: sha512-Mz/4+y8udxBKdmzt/UjPACs4G3j5SshJJEFFKxlCGPydG4JAHXxjWjAwjd09tf6oINvl1VfMJo+nB7H2YKQ0dA==} + engines: {node: '>=6.9.0'} + '@babel/parser@7.26.9': resolution: {integrity: sha512-81NWa1njQblgZbQHxWHpxxCzNsa3ZwvFqpUg7P+NNUU6f3UU2jBEg4OlF/J6rl8+PQGh1q6/zWScd001YwcA5A==} engines: {node: '>=6.0.0'} hasBin: true + '@babel/plugin-syntax-jsx@7.25.9': + resolution: {integrity: sha512-ld6oezHQMZsZfp6pWtbjaNDF2tiiCYYDqQszHt5VV437lewP9aSi2Of99CK0D0XB21k7FLgnLcmQKyKzynfeAA==} + engines: {node: '>=6.9.0'} + peerDependencies: + '@babel/core': ^7.0.0-0 + + '@babel/plugin-syntax-typescript@7.25.9': + resolution: {integrity: sha512-hjMgRy5hb8uJJjUcdWunWVcoi9bGpJp8p5Ol1229PoN6aytsLwNMgmdftO23wnCLMfVmTwZDWMPNq/D1SY60JQ==} + engines: {node: '>=6.9.0'} + peerDependencies: + '@babel/core': ^7.0.0-0 + + '@babel/plugin-transform-typescript@7.26.8': + resolution: {integrity: sha512-bME5J9AC8ChwA7aEPJ6zym3w7aObZULHhbNLU0bKUhKsAkylkzUdq+0kdymh9rzi8nlNFl2bmldFBCKNJBUpuw==} + engines: {node: '>=6.9.0'} + peerDependencies: + '@babel/core': ^7.0.0-0 + + '@babel/template@7.26.9': + resolution: {integrity: sha512-qyRplbeIpNZhmzOysF/wFMuP9sctmh2cFzRAZOn1YapxBsE1i9bJIY586R/WBLfLcmcBlM8ROBiQURnnNy+zfA==} + engines: {node: '>=6.9.0'} + + '@babel/traverse@7.26.9': + resolution: {integrity: sha512-ZYW7L+pL8ahU5fXmNbPF+iZFHCv5scFak7MZ9bwaRPLUhHh7QQEMjZUg0HevihoqCM5iSYHN61EyCoZvqC+bxg==} + engines: {node: '>=6.9.0'} + '@babel/types@7.26.9': resolution: {integrity: sha512-Y3IR1cRnOxOCDvMmNiym7XpXQ93iGDDPHx+Zj+NM+rg0fBaShfQLkg+hKPaZCEvg5N/LeCo4+Rj/i3FuJsIQaw==} engines: {node: '>=6.9.0'} @@ -602,6 +705,13 @@ packages: '@types/web-bluetooth@0.0.16': resolution: {integrity: sha512-oh8q2Zc32S6gd/j50GowEjKLoOVOwHP/bWVjKJInBwQqdOYMdPrf1oVlelTlyfFK3CKxL1uahMDAr+vy8T7yMQ==} + '@vitejs/plugin-vue-jsx@4.1.1': + resolution: {integrity: sha512-uMJqv/7u1zz/9NbWAD3XdjaY20tKTf17XVfQ9zq4wY1BjsB/PjpJPMe2xiG39QpP4ZdhYNhm4Hvo66uJrykNLA==} + engines: {node: ^18.0.0 || >=20.0.0} + peerDependencies: + vite: ^5.0.0 || ^6.0.0 + vue: ^3.0.0 + '@vitejs/plugin-vue@5.2.1': resolution: {integrity: sha512-cxh314tzaWwOLqVes2gnnCtvBDcM1UMdn+iFR+UjAn411dPT3tOmqrJjbMd7koZpMAmBM/GqeV4n9ge7JSiJJQ==} engines: {node: ^18.0.0 || >=20.0.0} @@ -618,6 +728,22 @@ packages: '@volar/typescript@2.4.11': resolution: {integrity: sha512-2DT+Tdh88Spp5PyPbqhyoYavYCPDsqbHLFwcUI9K1NlY1YgUJvujGdrqUp0zWxnW7KWNTr3xSpMuv2WnaTKDAw==} + '@vue/babel-helper-vue-transform-on@1.3.0': + resolution: {integrity: sha512-vrNyYNQcz1gfc87uuN+Z+On9fFOBQTYRlTUEDovpeCmjuwH83lAm6YM0VBvTx6eRTHg3SU5jP2CD+kSXY30PGg==} + + '@vue/babel-plugin-jsx@1.3.0': + resolution: {integrity: sha512-ODZSs93FCxLMOiMFAGJXe7QMJp1tk8hkMbk84OcHOTVwYU2cFwFu1z7jjrRv44wCCfPNkflqn6hnexVprb+G7A==} + peerDependencies: + '@babel/core': ^7.0.0-0 + peerDependenciesMeta: + '@babel/core': + optional: true + + '@vue/babel-plugin-resolve-type@1.3.0': + resolution: {integrity: sha512-3SmusE11QKNKtnVfbsKegUEArpf1fXE85Dzi/Q6lvaz3MA3tmL8BXyq/vA7GJeZ183XeNpLIZHrHDdUh9V348A==} + peerDependencies: + '@babel/core': ^7.0.0-0 + '@vue/compiler-core@3.5.13': resolution: {integrity: sha512-oOdAkwqUfW1WqpwSYJce06wvt6HljgY3fGeM9NcVA1HaYOij3mZG9Rkysn0OHuyUAGMbEbARIpsG+LPVlBJ5/Q==} @@ -802,6 +928,9 @@ packages: resolution: {integrity: sha512-ZqRXc+tZukToSNmh5C2iWMSoV3X1YUcPbqEM4DkEG5tNQXrQUZCNVGGv3IuicnkMtPfGf3Xtp8WCXs295iQ1pQ==} engines: {node: '>= 0.10.0'} + convert-source-map@2.0.0: + resolution: {integrity: sha512-Kvp459HrV2FEJ1CAsi1Ku+MY3kasH19TFykTz2xWmMeq6bk2NU3XXvfJ+Q61m0xktWwt+1HSYf3JZsTms3aRJg==} + copy-anything@3.0.5: resolution: {integrity: sha512-yCEafptTtb4bk7GLEQoM8KVJpxAfdBJYaXyzQEgQQQgYrZiDp8SJmGKlYza6CYjEDNstAdNdKA3UuoULlEbS6w==} engines: {node: '>=12.13'} @@ -959,6 +1088,10 @@ packages: function-bind@1.1.2: resolution: {integrity: sha512-7XHNxH7qX9xG5mIwxkhumTox/MIRNcOgDrxWsMt2pAr23WHp6MrRlN7FBSFpCpr+oVO0F744iUgR82nJMfG2SA==} + gensync@1.0.0-beta.2: + resolution: {integrity: sha512-3hN7NaskYvMDLQY55gnW3NQ+mesEAepTqlg+VEbj7zzqEMBVNhzcGYYeqFo/TlYz6eQiFcp1HcsCZO+nGgS8zg==} + engines: {node: '>=6.9.0'} + glob-parent@5.1.2: resolution: {integrity: sha512-AOIgSQCepiJYwP3ARnGx+5VnTu2HBYdzbGP45eLw1vr3zB3vZLeyed1sC9hnbcOc9/SrMyM5RPQrkGz4aS9Zow==} engines: {node: '>= 6'} @@ -971,6 +1104,10 @@ packages: resolution: {integrity: sha512-7Bv8RF0k6xjo7d4A/PxYLbUCfb6c+Vpd2/mB2yRDlew7Jb5hEXiCD9ibfO7wpk8i4sevK6DFny9h7EYbM3/sHg==} hasBin: true + globals@11.12.0: + resolution: {integrity: sha512-WOBp/EEGUiIsJSp7wcv/y6MO+lV9UoncWqxuFfm8eBwzWNgyfBd6Gz+IeKQ9jCmyhoH99g15M3T+QaVHFjizVA==} + engines: {node: '>=4'} + graceful-fs@4.2.11: resolution: {integrity: sha512-RbJ5/jmFcNNCcDV5o9eTnBLJ/HszWV0P73bc+Ff4nS/rJj+YaS6IGyiOL0VoBYX+l1Wrl3k63h/KrH+nhJ0XvQ==} @@ -1030,9 +1167,22 @@ packages: resolution: {integrity: sha512-rg9zJN+G4n2nfJl5MW3BMygZX56zKPNVEYYqq7adpmMh4Jn2QNEwhvQlFy6jPVdcod7txZtKHWnyZiA3a0zP7A==} hasBin: true + js-tokens@4.0.0: + resolution: {integrity: sha512-RdJUflcE3cUzKiMqQgsCu06FPu9UdIJO0beYbPhHN4k6apgJtifcoCtT9bcxOpYBtpD2kCM6Sbzg4CausW/PKQ==} + js-tokens@9.0.1: resolution: {integrity: sha512-mxa9E9ITFOt0ban3j6L5MpjwegGz6lBQmM1IJkWeBZGcMxto50+eWdjC/52xDbS2vy0k7vIMK0Fe2wfL9OQSpQ==} + jsesc@3.1.0: + resolution: {integrity: sha512-/sM3dO2FOzXjKQhJuo0Q173wf2KOo8t4I8vHy6lF9poUp7bKT0/NHE8fPX23PwfhnykfqnC2xRxOnVw5XuGIaA==} + engines: {node: '>=6'} + hasBin: true + + json5@2.2.3: + resolution: {integrity: sha512-XmOWe7eyHYH14cLdVPoyg+GOH3rYX++KpzrylJwSW98t3Nk+U8XOl8FWKOgwtzdb8lXGf6zYwDUzeHMWfxasyg==} + engines: {node: '>=6'} + hasBin: true + lightningcss-darwin-arm64@1.29.2: resolution: {integrity: sha512-cK/eMabSViKn/PG8U/a7aCorpeKLMlK0bQeNHmdb7qUnBkNPnL+oV5DjJUo0kqWsJUapZsM4jCfYItbqBDvlcA==} engines: {node: '>= 12.0.0'} @@ -1132,6 +1282,9 @@ packages: lru-cache@10.4.3: resolution: {integrity: sha512-JNAzZcXrCt42VGLuYz0zfAzDfAvJWW6AfYlDBQyDV5DClI2m5sAmK+OIO7s59XfsRsWHp02jAJrRadPRGTt6SQ==} + lru-cache@5.1.1: + resolution: {integrity: sha512-KpNARQA3Iwv+jTA0utUVVbrh+Jlrr1Fv0e56GGzAFOXN7dk/FviaDW8LHmK52DlcH4WP2n6gI8vN1aesBFgo9w==} + magic-string@0.30.17: resolution: {integrity: sha512-sNPKHvyjVf7gyjwS4xGTaW/mCnF8wnjtifKBEhxfZ7E/S8tQ0rssrwGNn6q8JH/ohItJfSQp9mBtQYuTlH5QnA==} @@ -1370,6 +1523,10 @@ packages: scule@1.3.0: resolution: {integrity: sha512-6FtHJEvt+pVMIB9IBY+IcCJ6Z5f1iQnytgyfKMhDKgmzYG+TeH/wx1y3l27rshSbLiSanrR9ffZDrEsmjlQF2g==} + semver@6.3.1: + resolution: {integrity: sha512-BR7VvDCVHO+q2xBEWskxS6DJE1qRnb7DxzUrogb71CWoSficBxYsiAGd+Kl0mmq/MprG9yArRkyrQxTO6XjMzA==} + hasBin: true + shebang-command@2.0.0: resolution: {integrity: sha512-kHxr2zZpYtdmrN1qDjrrX/Z1rR1kG8Dx+gkpK1G4eXmvXswmcE1hTWBWYUzlraYw1/yZp6YuDY77YtvbN0dmDA==} engines: {node: '>=8'} @@ -1605,6 +1762,9 @@ packages: resolution: {integrity: sha512-si7QWI6zUMq56bESFvagtmzMdGOtoxfR+Sez11Mobfc7tm+VkUckk9bW2UeffTGVUbOksxmSw0AA2gs8g71NCQ==} engines: {node: '>=12'} + yallist@3.1.1: + resolution: {integrity: sha512-a4UGQaWPH59mOXUYnAG2ewncQS4i4F43Tv3JoAM+s2VDAmS9NsK8GpDMLrCHPksFT7h3K6TOoUNn2pb7RoXx4g==} + yaml@2.7.0: resolution: {integrity: sha512-+hSoy/QHluxmC9kCIJyL/uyFmLmc+e5CFR5Wa+bpIhIj85LVb9ZH2nVnqrHoSvKogwODv0ClqZkmiSSaIH5LTA==} engines: {node: '>= 14'} @@ -1617,14 +1777,171 @@ snapshots: '@alloc/quick-lru@5.2.0': {} + '@ampproject/remapping@2.3.0': + dependencies: + '@jridgewell/gen-mapping': 0.3.8 + '@jridgewell/trace-mapping': 0.3.25 + + '@babel/code-frame@7.26.2': + dependencies: + '@babel/helper-validator-identifier': 7.25.9 + js-tokens: 4.0.0 + picocolors: 1.1.1 + + '@babel/compat-data@7.26.8': {} + + '@babel/core@7.26.9': + dependencies: + '@ampproject/remapping': 2.3.0 + '@babel/code-frame': 7.26.2 + '@babel/generator': 7.26.9 + '@babel/helper-compilation-targets': 7.26.5 + '@babel/helper-module-transforms': 7.26.0(@babel/core@7.26.9) + '@babel/helpers': 7.26.9 + '@babel/parser': 7.26.9 + '@babel/template': 7.26.9 + '@babel/traverse': 7.26.9 + '@babel/types': 7.26.9 + convert-source-map: 2.0.0 + debug: 4.4.0 + gensync: 1.0.0-beta.2 + json5: 2.2.3 + semver: 6.3.1 + transitivePeerDependencies: + - supports-color + + '@babel/generator@7.26.9': + dependencies: + '@babel/parser': 7.26.9 + '@babel/types': 7.26.9 + '@jridgewell/gen-mapping': 0.3.8 + '@jridgewell/trace-mapping': 0.3.25 + jsesc: 3.1.0 + + '@babel/helper-annotate-as-pure@7.25.9': + dependencies: + '@babel/types': 7.26.9 + + '@babel/helper-compilation-targets@7.26.5': + dependencies: + '@babel/compat-data': 7.26.8 + '@babel/helper-validator-option': 7.25.9 + browserslist: 4.24.4 + lru-cache: 5.1.1 + semver: 6.3.1 + + '@babel/helper-create-class-features-plugin@7.26.9(@babel/core@7.26.9)': + dependencies: + '@babel/core': 7.26.9 + '@babel/helper-annotate-as-pure': 7.25.9 + '@babel/helper-member-expression-to-functions': 7.25.9 + '@babel/helper-optimise-call-expression': 7.25.9 + '@babel/helper-replace-supers': 7.26.5(@babel/core@7.26.9) + '@babel/helper-skip-transparent-expression-wrappers': 7.25.9 + '@babel/traverse': 7.26.9 + semver: 6.3.1 + transitivePeerDependencies: + - supports-color + + '@babel/helper-member-expression-to-functions@7.25.9': + dependencies: + '@babel/traverse': 7.26.9 + '@babel/types': 7.26.9 + transitivePeerDependencies: + - supports-color + + '@babel/helper-module-imports@7.25.9': + dependencies: + '@babel/traverse': 7.26.9 + '@babel/types': 7.26.9 + transitivePeerDependencies: + - supports-color + + '@babel/helper-module-transforms@7.26.0(@babel/core@7.26.9)': + dependencies: + '@babel/core': 7.26.9 + '@babel/helper-module-imports': 7.25.9 + '@babel/helper-validator-identifier': 7.25.9 + '@babel/traverse': 7.26.9 + transitivePeerDependencies: + - supports-color + + '@babel/helper-optimise-call-expression@7.25.9': + dependencies: + '@babel/types': 7.26.9 + + '@babel/helper-plugin-utils@7.26.5': {} + + '@babel/helper-replace-supers@7.26.5(@babel/core@7.26.9)': + dependencies: + '@babel/core': 7.26.9 + '@babel/helper-member-expression-to-functions': 7.25.9 + '@babel/helper-optimise-call-expression': 7.25.9 + '@babel/traverse': 7.26.9 + transitivePeerDependencies: + - supports-color + + '@babel/helper-skip-transparent-expression-wrappers@7.25.9': + dependencies: + '@babel/traverse': 7.26.9 + '@babel/types': 7.26.9 + transitivePeerDependencies: + - supports-color + '@babel/helper-string-parser@7.25.9': {} '@babel/helper-validator-identifier@7.25.9': {} + '@babel/helper-validator-option@7.25.9': {} + + '@babel/helpers@7.26.9': + dependencies: + '@babel/template': 7.26.9 + '@babel/types': 7.26.9 + '@babel/parser@7.26.9': dependencies: '@babel/types': 7.26.9 + '@babel/plugin-syntax-jsx@7.25.9(@babel/core@7.26.9)': + dependencies: + '@babel/core': 7.26.9 + '@babel/helper-plugin-utils': 7.26.5 + + '@babel/plugin-syntax-typescript@7.25.9(@babel/core@7.26.9)': + dependencies: + '@babel/core': 7.26.9 + '@babel/helper-plugin-utils': 7.26.5 + + '@babel/plugin-transform-typescript@7.26.8(@babel/core@7.26.9)': + dependencies: + '@babel/core': 7.26.9 + '@babel/helper-annotate-as-pure': 7.25.9 + '@babel/helper-create-class-features-plugin': 7.26.9(@babel/core@7.26.9) + '@babel/helper-plugin-utils': 7.26.5 + '@babel/helper-skip-transparent-expression-wrappers': 7.25.9 + '@babel/plugin-syntax-typescript': 7.25.9(@babel/core@7.26.9) + transitivePeerDependencies: + - supports-color + + '@babel/template@7.26.9': + dependencies: + '@babel/code-frame': 7.26.2 + '@babel/parser': 7.26.9 + '@babel/types': 7.26.9 + + '@babel/traverse@7.26.9': + dependencies: + '@babel/code-frame': 7.26.2 + '@babel/generator': 7.26.9 + '@babel/parser': 7.26.9 + '@babel/template': 7.26.9 + '@babel/types': 7.26.9 + debug: 4.4.0 + globals: 11.12.0 + transitivePeerDependencies: + - supports-color + '@babel/types@7.26.9': dependencies: '@babel/helper-string-parser': 7.25.9 @@ -1964,6 +2281,16 @@ snapshots: '@types/web-bluetooth@0.0.16': {} + '@vitejs/plugin-vue-jsx@4.1.1(vite@6.2.0(jiti@2.4.2)(lightningcss@1.29.2)(sass@1.85.1)(yaml@2.7.0))(vue@3.5.13(typescript@5.7.3))': + dependencies: + '@babel/core': 7.26.9 + '@babel/plugin-transform-typescript': 7.26.8(@babel/core@7.26.9) + '@vue/babel-plugin-jsx': 1.3.0(@babel/core@7.26.9) + vite: 6.2.0(jiti@2.4.2)(lightningcss@1.29.2)(sass@1.85.1)(yaml@2.7.0) + vue: 3.5.13(typescript@5.7.3) + transitivePeerDependencies: + - supports-color + '@vitejs/plugin-vue@5.2.1(vite@6.2.0(jiti@2.4.2)(lightningcss@1.29.2)(sass@1.85.1)(yaml@2.7.0))(vue@3.5.13(typescript@5.7.3))': dependencies: vite: 6.2.0(jiti@2.4.2)(lightningcss@1.29.2)(sass@1.85.1)(yaml@2.7.0) @@ -1981,6 +2308,35 @@ snapshots: path-browserify: 1.0.1 vscode-uri: 3.1.0 + '@vue/babel-helper-vue-transform-on@1.3.0': {} + + '@vue/babel-plugin-jsx@1.3.0(@babel/core@7.26.9)': + dependencies: + '@babel/helper-module-imports': 7.25.9 + '@babel/helper-plugin-utils': 7.26.5 + '@babel/plugin-syntax-jsx': 7.25.9(@babel/core@7.26.9) + '@babel/template': 7.26.9 + '@babel/traverse': 7.26.9 + '@babel/types': 7.26.9 + '@vue/babel-helper-vue-transform-on': 1.3.0 + '@vue/babel-plugin-resolve-type': 1.3.0(@babel/core@7.26.9) + '@vue/shared': 3.5.13 + optionalDependencies: + '@babel/core': 7.26.9 + transitivePeerDependencies: + - supports-color + + '@vue/babel-plugin-resolve-type@1.3.0(@babel/core@7.26.9)': + dependencies: + '@babel/code-frame': 7.26.2 + '@babel/core': 7.26.9 + '@babel/helper-module-imports': 7.25.9 + '@babel/helper-plugin-utils': 7.26.5 + '@babel/parser': 7.26.9 + '@vue/compiler-sfc': 3.5.13 + transitivePeerDependencies: + - supports-color + '@vue/compiler-core@3.5.13': dependencies: '@babel/parser': 7.26.9 @@ -2201,6 +2557,8 @@ snapshots: transitivePeerDependencies: - supports-color + convert-source-map@2.0.0: {} + copy-anything@3.0.5: dependencies: is-what: 4.1.16 @@ -2371,6 +2729,8 @@ snapshots: function-bind@1.1.2: {} + gensync@1.0.0-beta.2: {} + glob-parent@5.1.2: dependencies: is-glob: 4.0.3 @@ -2388,6 +2748,8 @@ snapshots: package-json-from-dist: 1.0.1 path-scurry: 1.11.1 + globals@11.12.0: {} + graceful-fs@4.2.11: {} hasown@2.0.2: @@ -2432,8 +2794,14 @@ snapshots: jiti@2.4.2: {} + js-tokens@4.0.0: {} + js-tokens@9.0.1: {} + jsesc@3.1.0: {} + + json5@2.2.3: {} + lightningcss-darwin-arm64@1.29.2: optional: true @@ -2503,6 +2871,10 @@ snapshots: lru-cache@10.4.3: {} + lru-cache@5.1.1: + dependencies: + yallist: 3.1.1 + magic-string@0.30.17: dependencies: '@jridgewell/sourcemap-codec': 1.5.0 @@ -2724,6 +3096,8 @@ snapshots: scule@1.3.0: {} + semver@6.3.1: {} + shebang-command@2.0.0: dependencies: shebang-regex: 3.0.0 @@ -2956,6 +3330,8 @@ snapshots: string-width: 5.1.2 strip-ansi: 7.1.0 + yallist@3.1.1: {} + yaml@2.7.0: {} zrender@5.6.1: diff --git a/src/App.vue b/src/App.vue index b612648..c507eb8 100644 --- a/src/App.vue +++ b/src/App.vue @@ -137,7 +137,7 @@ html, body, #app { /* 大屏页面特殊处理 */ .router-view-container { - background: #030409; /* 深色背景 */ + background: #08104C; /* 深色背景 */ color: #fff; } } diff --git a/src/api/alarm.ts b/src/api/alarm.ts new file mode 100644 index 0000000..139597f --- /dev/null +++ b/src/api/alarm.ts @@ -0,0 +1,2 @@ + + diff --git a/src/assets/common/bgAlarmTable.svg b/src/assets/common/bgAlarmTable.svg deleted file mode 100644 index 74e6946..0000000 --- a/src/assets/common/bgAlarmTable.svg +++ /dev/null @@ -1,33 +0,0 @@ - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - diff --git a/src/assets/common/bgFooter.svg b/src/assets/common/bgFooter.svg deleted file mode 100644 index 1b382b1..0000000 --- a/src/assets/common/bgFooter.svg +++ /dev/null @@ -1,23 +0,0 @@ - - - - - - - - - - - - - - - - - - - - - - - diff --git a/src/assets/common/bgNav.svg b/src/assets/common/bgNav.svg deleted file mode 100644 index fb844f8..0000000 --- a/src/assets/common/bgNav.svg +++ /dev/null @@ -1,372 +0,0 @@ - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - diff --git a/src/assets/common/bgTitle.svg b/src/assets/common/bgTitle.svg deleted file mode 100644 index 1920b84..0000000 --- a/src/assets/common/bgTitle.svg +++ /dev/null @@ -1,30 +0,0 @@ - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - diff --git a/src/assets/common/dataScreenbg.png b/src/assets/common/dataScreenbg.png deleted file mode 100644 index 4e1dada..0000000 Binary files a/src/assets/common/dataScreenbg.png and /dev/null differ diff --git a/src/assets/common/homeDefectBg.svg b/src/assets/common/homeDefectBg.svg deleted file mode 100644 index c3bb08c..0000000 --- a/src/assets/common/homeDefectBg.svg +++ /dev/null @@ -1,64 +0,0 @@ - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - diff --git a/src/assets/common/homeSmallBg.svg b/src/assets/common/homeSmallBg.svg deleted file mode 100644 index b80eed1..0000000 --- a/src/assets/common/homeSmallBg.svg +++ /dev/null @@ -1,64 +0,0 @@ - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - diff --git a/src/assets/common/infoIcon.svg b/src/assets/common/infoIcon.svg deleted file mode 100644 index 61736c2..0000000 --- a/src/assets/common/infoIcon.svg +++ /dev/null @@ -1,27 +0,0 @@ - - - - - - - - - - - - - - - - - - - - - - - - - - - diff --git a/src/assets/common/logo.svg b/src/assets/common/logo.svg deleted file mode 100644 index 60450a1..0000000 --- a/src/assets/common/logo.svg +++ /dev/null @@ -1,40 +0,0 @@ - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - diff --git a/src/assets/common/subTitleIcon.svg b/src/assets/common/subTitleIcon.svg deleted file mode 100644 index d20d340..0000000 --- a/src/assets/common/subTitleIcon.svg +++ /dev/null @@ -1,3 +0,0 @@ - - - diff --git a/src/assets/common/tipIcon.svg b/src/assets/common/tipIcon.svg deleted file mode 100644 index fb05688..0000000 --- a/src/assets/common/tipIcon.svg +++ /dev/null @@ -1,5 +0,0 @@ - - - - - diff --git a/src/assets/common/title.svg b/src/assets/common/title.svg deleted file mode 100644 index 3770b11..0000000 --- a/src/assets/common/title.svg +++ /dev/null @@ -1,71 +0,0 @@ - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - diff --git a/src/assets/common/warn_icon.png b/src/assets/common/warn_icon.png new file mode 100644 index 0000000..78a4887 Binary files /dev/null and b/src/assets/common/warn_icon.png differ diff --git a/src/assets/footer/menu0.png b/src/assets/footer/menu0.png new file mode 100644 index 0000000..6474d7a Binary files /dev/null and b/src/assets/footer/menu0.png differ diff --git a/src/assets/footer/menu1.png b/src/assets/footer/menu1.png new file mode 100644 index 0000000..446f1c2 Binary files /dev/null and b/src/assets/footer/menu1.png differ diff --git a/src/assets/footer/menu2.png b/src/assets/footer/menu2.png new file mode 100644 index 0000000..e7104d2 Binary files /dev/null and b/src/assets/footer/menu2.png differ diff --git a/src/assets/footer/menu3.png b/src/assets/footer/menu3.png new file mode 100644 index 0000000..73a07ca Binary files /dev/null and b/src/assets/footer/menu3.png differ diff --git a/src/assets/header/before_icon.png b/src/assets/header/before_icon.png new file mode 100644 index 0000000..65021d9 Binary files /dev/null and b/src/assets/header/before_icon.png differ diff --git a/src/assets/header/bg_1855.png b/src/assets/header/bg_1855.png new file mode 100644 index 0000000..0729d0b Binary files /dev/null and b/src/assets/header/bg_1855.png differ diff --git a/src/assets/header/bg_450.png b/src/assets/header/bg_450.png new file mode 100644 index 0000000..dd3ef3d Binary files /dev/null and b/src/assets/header/bg_450.png differ diff --git a/src/assets/header/bg_800.png b/src/assets/header/bg_800.png new file mode 100644 index 0000000..c4b1ce4 Binary files /dev/null and b/src/assets/header/bg_800.png differ diff --git a/src/assets/header/bg_918.png b/src/assets/header/bg_918.png new file mode 100644 index 0000000..29f1bf4 Binary files /dev/null and b/src/assets/header/bg_918.png differ diff --git a/src/assets/header/title0.png b/src/assets/header/title0.png new file mode 100644 index 0000000..43edbe6 Binary files /dev/null and b/src/assets/header/title0.png differ diff --git a/src/assets/header/title1.png b/src/assets/header/title1.png new file mode 100644 index 0000000..82516a2 Binary files /dev/null and b/src/assets/header/title1.png differ diff --git a/src/assets/header/title2.png b/src/assets/header/title2.png new file mode 100644 index 0000000..16eee8a Binary files /dev/null and b/src/assets/header/title2.png differ diff --git a/src/assets/header/title3.png b/src/assets/header/title3.png new file mode 100644 index 0000000..7541527 Binary files /dev/null and b/src/assets/header/title3.png differ diff --git a/src/assets/header/title4.png b/src/assets/header/title4.png new file mode 100644 index 0000000..32399b3 Binary files /dev/null and b/src/assets/header/title4.png differ diff --git a/src/assets/header/title5.png b/src/assets/header/title5.png new file mode 100644 index 0000000..7134102 Binary files /dev/null and b/src/assets/header/title5.png differ diff --git a/src/assets/header/title6.png b/src/assets/header/title6.png new file mode 100644 index 0000000..f1475fc Binary files /dev/null and b/src/assets/header/title6.png differ diff --git a/src/components/ContentHeader.vue b/src/components/ContentHeader.vue index 8f44911..5aaa1a4 100644 --- a/src/components/ContentHeader.vue +++ b/src/components/ContentHeader.vue @@ -2,12 +2,62 @@ * @Author: donghao donghao@supervision.ltd * @Date: 2025-03-06 15:52:40 * @LastEditors: donghao donghao@supervision.ltd - * @LastEditTime: 2025-03-06 17:14:46 + * @LastEditTime: 2025-03-07 14:19:16 * @FilePath: \vite-ai\data-dashboard\src\components\contentHeader.vue * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE --> \ No newline at end of file + + + + + \ No newline at end of file diff --git a/src/components/CustomTable/index.ts b/src/components/CustomTable/index.ts new file mode 100644 index 0000000..3ae4f1b --- /dev/null +++ b/src/components/CustomTable/index.ts @@ -0,0 +1,3 @@ +import baseTable from "./src/baseTable"; + +export const BaseTable = baseTable; diff --git a/src/components/CustomTable/src/baseAction.vue b/src/components/CustomTable/src/baseAction.vue new file mode 100644 index 0000000..e69de29 diff --git a/src/components/CustomTable/src/baseColumn.vue b/src/components/CustomTable/src/baseColumn.vue new file mode 100644 index 0000000..df991b9 --- /dev/null +++ b/src/components/CustomTable/src/baseColumn.vue @@ -0,0 +1,104 @@ + + + + + + diff --git a/src/components/CustomTable/src/baseTable.scss b/src/components/CustomTable/src/baseTable.scss new file mode 100644 index 0000000..48887b5 --- /dev/null +++ b/src/components/CustomTable/src/baseTable.scss @@ -0,0 +1,47 @@ +.baseTable_wrap { + .baseTable_box { + position: relative; + + .el-table__body { + border-collapse: separate !important; + /* 让边框独立，而不是合并 */ + border-spacing: 0 8px; + /* 设置行与行之间的间距，可以根据需要调整值 */ + width: 100%; + + /* 表格宽度占据父容器的100% */ + tr { + & > td:nth-child(1) { + border-left: 1px solid #dcdcdc; + border-radius: 4px 0 0 4px; + } + + & > td:last-child { + border-right: 1px solid #dcdcdc !important; + border-radius: 0 4px 4px 0; + } + } + } + + .el-table__header > thead { + th { + background-color: rgba(21, 77, 221, 0.1) !important; + } + } + + &.el-table td.el-table__cell { + border-top: 1px solid #dcdcdc; + border-bottom: 1px solid #dcdcdc; + } + } +} + +.pagination_box { + margin-top: 50px; + width: 100%; + // position: fixed; + // bottom: 100px; + // right: 40px; + background-color: white; + z-index: 9; +} diff --git a/src/components/CustomTable/src/baseTable.tsx b/src/components/CustomTable/src/baseTable.tsx new file mode 100644 index 0000000..5f01f7b --- /dev/null +++ b/src/components/CustomTable/src/baseTable.tsx @@ -0,0 +1,488 @@ +import { ElLoading, ElPagination, ElTable, ElTableColumn } from "element-plus"; +import BaseColumn from "./baseColumn.vue"; +import { isUndefined } from "@/utils/is"; +import { + computed, + defineComponent, + nextTick, + reactive, + type PropType +} from "vue"; +import "./baseTable.scss"; + +function getDefaultSort(attrs: Record): any { + return attrs["default-sort"] || attrs.defaultSort; +} + +export default defineComponent({ + name: "XTable", + directives: { + loading: ElLoading.directive + }, + inheritAttrs: false, + props: { + /** + * 表格的列描述信息 + */ + columns: { + type: Array as PropType, + required: true + }, + + /** + * 表格的数据 + */ + dataSource: { + type: Array as PropType, + required: true + }, + + /** + * loading + */ + loading: { + type: Boolean, + default: false + }, + + /** + * 最大高度，包含分页高度 + */ + maxHeight: { + type: [Number, String] as PropType, + default: "auto" + }, + + /** + * 是否显示分页 + * 为 always 时，将一直显示 + * 为 false 时，总是不显示 + * 为 true 时，只有有数据时才显示 + */ + pageable: { + type: [Boolean, String] as PropType, + default: true, + validator(value: boolean | "always") { + return ["always", true, false].includes(value); + } + }, + + /** + * 分页布局 + */ + pagerLayout: { + type: String, + default: "total, sizes, prev, pager, next, jumper", + validator(value: string) { + return value + .split(",") + .map(item => item.trim()) + .every(item => + ["total", "sizes", "prev", "pager", "next", "jumper"].includes(item) + ); + } + }, + + /** + * 总条数 + */ + total: { + type: Number, + default: 0 + }, + + /** + * 每页显示数量 + */ + pageSize: { + type: Number, + default: 10 + }, + + /** + * 页码 + */ + page: { + type: Number, + default: 1 + }, + + /** + * 分页选择器的选项设置 + */ + pageSizes: { + type: Array as PropType, + default() { + return [10, 20, 30, 50]; + } + }, + + /** + * 行数据的 Key + */ + rowKey: { + type: [Function, String] as PropType< + (row: XTableData) => string | string + >, + default: "id" + }, + + /** + * 打开自定义列 + */ + visibleColumn: { + type: Boolean, + default: undefined + }, + + /** + * 固定分页器 + */ + isFixedPagination: { + type: Boolean, + default: true + } + + // handleDel: { + // type: Function, + // default: () => {} + // } + // customActions: { + // type: Function, + // default: () => {} + // } + }, + emits: ["change", "columnChange", "update:visibleColumn", "actions"], + setup(props, { slots, attrs, emit }) { + const nonPropsAttrs = attrs; + const { prop: sortBy, order: sortOrder } = getDefaultSort(attrs) || {}; + const tableState = reactive({ + tid: 0, + sortBy, + sortOrder + }); + + const showPagination = computed(() => { + if (props.pageable === "always") return true; + return props.pageable && props.dataSource.length > 0; + }); + + const mHeight = computed(() => { + if (props.maxHeight === "auto") { + return "auto"; + } + return showPagination.value ? props.maxHeight - 44 : props.maxHeight; + }); + + /** + * 获取插槽 + */ + function getSlot(column: XTableColumn, suffix?: string) { + const name = column.prop || column.type; + if (name) { + const key = suffix ? `${name}-${suffix}` : name; + return slots[key]; + } + } + + /** + * 改变表格列的排序和分页 + */ + function onChange(data: XTableChangeData) { + emit("change", data); + } + + /** + * 改变页数 + */ + function handlePageNumChange(page: number) { + const { sortBy, sortOrder } = tableState; + const { pageSize } = props; + onChange({ + page, + pageSize, + prop: sortBy, + order: sortOrder, + type: "number" + }); + } + + /** + * 改变每页显示的条数 + */ + function handlePageSizeChange(pageSize: number) { + const { sortBy, sortOrder } = tableState; + nextTick(() => { + // 下拉框溢出可能导致溢出 body 出现滚动条 + // 加个延迟，等下拉隐藏 + onChange({ + page: 1, + pageSize, + prop: sortBy, + order: sortOrder, + type: "size" + }); + }); + } + + /** + * 排序 + */ + function handleTableSortChange({ prop, order }: XTableSort) { + const { pageSize } = props; + onChange({ page: 1, pageSize, prop, order, type: "sort" }); + } + + /** + * 自定义列回调 + */ + function handleColumnChange(cols: XTableColumn[]) { + emit("columnChange", cols); + } + + /** + * 自定义列隐藏 + */ + function handleVisibleChange(val: boolean) { + emit("update:visibleColumn", val); + } + + /** + * 获取表格列的属性 + */ + function getColumnProps(column: XTableColumn) { + const col = { ...column }; + Reflect.deleteProperty(col, "children"); + Reflect.deleteProperty(col, "hidden"); + col.key = column.key || column.prop || column.type; + col.showOverflowTooltip = col.showOverflowTooltip ?? true; + col.showOverflowTooltip = + column.prop === "action" ? false : column.showOverflowTooltip; + return col; + } + + /** + * 渲染特殊列 + */ + function renderTypeColumn(column: XTableColumn) { + if (column.type === "expand") { + return ( + + {{ + default: (scope: Record) => { + const slot = getSlot(column); + return slot?.(scope); + } + }} + + ); + } + if (column.type === "action") { + return ( + + {{ + default: ({ row }: { row: Record }) => { + return ( +
+ {slots.actionBar &&
{slots.actionBar({ row })}
} + {/*
    +
  • handleDel(row)} + > + + + + 删除 + + +
    • +
*/} +
+ ); + } + }} + + ); + } + return ; + } + + /**操作按钮事件 */ + + // function handleDel(row) { + // console.log(row, "handleDel"); + // emit("actions", { + // type: "delete", + // data: { ...row } + // }); + // } + + /** + * 渲染普通列 + */ + function renderBaseColumn(column: XTableColumn) { + const columnSlots: { + default?: (scope: Record) => any; + header?: (scope: Record) => any; + } = {}; + const slot = getSlot(column); + const headerSlot = getSlot(column, "header"); + + if (slot) { + columnSlots.default = scope => slot(scope); + } + + if (headerSlot) { + columnSlots.header = scope => headerSlot(scope); + } + + return ( + {columnSlots} + ); + } + + /** + * 渲染列 + */ + function renderTableColumn(column: XTableColumn) { + if (column.hidden) return; + if (column.type) { + return renderTypeColumn(column); + } + return renderBaseColumn(column); + } + + /** + * 渲染多级列 + */ + function renderColumnChildren( + column: XTableColumn, + children: Required["children"] + ) { + if (column.hidden) return; + return ( + + {children.map(column => renderTableColumn(column))} + + ); + } + + /** + * 渲染分页 + */ + function renderPagination() { + const paginationProps = { + size: "small", + background: false, + total: props.total, + layout: props.pagerLayout, + pageSize: props.pageSize, + pageSizes: props.pageSizes, + currentPage: props.page, + onSizeChange: handlePageSizeChange, + onCurrentChange: handlePageNumChange + }; + + return ( +
+ +
+ ); + } + + /** + * 渲染自定义列 + */ + function renderCustomColumn() { + const customColumnProps = { + columns: props.columns, + visible: props.visibleColumn, + onChange: handleColumnChange, + onVisibleChange: handleVisibleChange + }; + + return ; + } + + return () => { + const tableProps = { + ref: "elTableRef", + ...nonPropsAttrs, + maxHeight: mHeight.value, + data: props.dataSource, + rowKey: props.rowKey, + onSortChange: handleTableSortChange + }; + + const extraSlots: { + append?: () => any; + empty?: () => any; + } = {}; + + if (slots.append) { + extraSlots.append = () => slots.append?.(); + } + + if (slots.empty) { + extraSlots.empty = () => slots.empty?.(); + } + + return ( +
+ + {props.columns.map(column => { + if (Array.isArray(column.children)) { + return renderColumnChildren(column, column.children); + } + return renderTableColumn(column); + })} + {/* 使用插槽引入操作栏的内容 */} + {/* + {{ + default: ({ row }: { row: Record }) => { + return extraSlots.customActions?.({ + row + }); + } + }} + */} + {/* + + */} + + {showPagination.value && renderPagination()} + {!isUndefined(props.visibleColumn) && renderCustomColumn()} +
+ ); + }; + } +}); diff --git a/src/components/CustomTable/src/type.d.ts b/src/components/CustomTable/src/type.d.ts new file mode 100644 index 0000000..11a8d05 --- /dev/null +++ b/src/components/CustomTable/src/type.d.ts @@ -0,0 +1,42 @@ +import type ElTable from "element-plus/lib/components/table"; +import type { ElTableColumn } from "element-plus/lib/components/table"; + +export {}; + +type ElTableType = InstanceType; +type ElTableProps = ElTableType["$props"]; +type ElTableColumnProps = InstanceType["$props"]; +type ElTableSort = Pick< + Required["defaultSort"], + "prop" | "order" +>; + +type ElTableAction = { + type: "delete" | "update" | string; // 操作类型 + confirmType?: "popup" | "modal"; // 确认组件 +}; + +declare global { + type XTableSort = ElTableSort; + + interface XTableColumn extends ElTableColumnProps { + children?: XTableColumn[]; + hidden?: boolean; + } + + interface XTableData { + [key: string]: any; + } + + interface XTableState { + tid: number; + sortBy?: XTableSort["prop"]; + sortOrder?: XTableSort["order"]; + } + + interface XTableChangeData extends Partial { + type: "size" | "number" | "sort"; + pageNum: number; + pageSize: number; + } +} diff --git a/src/components/Footer.vue b/src/components/Footer.vue index 7f00144..1fcb5d8 100644 --- a/src/components/Footer.vue +++ b/src/components/Footer.vue @@ -2,17 +2,19 @@ * @Author: donghao donghao@supervision.ltd * @Date: 2025-03-06 15:00:26 * @LastEditors: donghao donghao@supervision.ltd - * @LastEditTime: 2025-03-06 15:51:05 + * @LastEditTime: 2025-03-07 14:16:20 * @FilePath: \vite-ai\data-dashboard\src\views\dashboard\components\footer.vue * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE --> \ No newline at end of file diff --git a/src/views/dashboard/DeviceStatus.vue b/src/views/dashboard/DeviceStatus.vue index 1691112..95293df 100644 --- a/src/views/dashboard/DeviceStatus.vue +++ b/src/views/dashboard/DeviceStatus.vue @@ -2,10 +2,220 @@ * @Author: donghao donghao@supervision.ltd * @Date: 2025-03-06 15:15:47 * @LastEditors: donghao donghao@supervision.ltd - * @LastEditTime: 2025-03-06 15:15:53 + * @LastEditTime: 2025-03-07 15:22:33 * @FilePath: \vite-ai\data-dashboard\src\views\dashboard\DeviceStatus.vue * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE --> \ No newline at end of file +
+ +
+ + + + + diff --git a/src/views/login/Login.vue b/src/views/login/Login.vue index 91bdcc3..9eb97e2 100644 --- a/src/views/login/Login.vue +++ b/src/views/login/Login.vue @@ -2,7 +2,7 @@ * @Author: donghao donghao@supervision.ltd * @Date: 2025-03-06 13:56:27 * @LastEditors: donghao donghao@supervision.ltd - * @LastEditTime: 2025-03-06 17:22:49 + * @LastEditTime: 2025-03-07 15:12:33 * @FilePath: \vite-ai\data-dashboard\src\views\login\login.vue * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE --> diff --git a/tsconfig.json b/tsconfig.json index c452f43..a759e57 100644 --- a/tsconfig.json +++ b/tsconfig.json @@ -1,7 +1,21 @@ { - "files": [], - "references": [ - { "path": "./tsconfig.app.json" }, - { "path": "./tsconfig.node.json" } - ] + "compilerOptions": { + "target": "ESNext", + "module": "ESNext", + "strict": true, + "jsx": "preserve", + "jsxFactory": "h", + "jsxFragmentFactory": "Fragment", + "moduleResolution": "Node", + "skipLibCheck": true, + "esModuleInterop": true, + "allowSyntheticDefaultImports": true, + "sourceMap": true, + "baseUrl": ".", + "paths": { + "@/*": ["src/*"] + }, + "lib": ["ESNext", "DOM"] + }, + "include": ["src/**/*.ts", "src/**/*.d.ts", "src/**/*.tsx", "src/**/*.vue"] } \ No newline at end of file diff --git a/vite.config.ts b/vite.config.ts index 7360b13..11cc398 100644 --- a/vite.config.ts +++ b/vite.config.ts @@ -2,7 +2,7 @@ * @Author: donghao donghao@supervision.ltd * @Date: 2025-03-06 11:27:03 * @LastEditors: donghao donghao@supervision.ltd - * @LastEditTime: 2025-03-06 17:11:57 + * @LastEditTime: 2025-03-07 14:35:23 * @FilePath: \vite-ai\data-dashboard\vite.config.ts * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE */