添加mock

2025-12-06 16:18:22 +08:00 · 2023-09-28 11:14:52 +08:00 · 2023-09-28 11:14:52 +08:00 · d94f40cdfe
commit d94f40cdfe
parent 4c87f22f29
11 changed files with 483 additions and 14 deletions
--- a/.env
+++ b/.env
@ -0,0 +1,8 @@
+# title
+VITE_GLOB_APP_TITLE=lowflow-design
+
+# 本地运行端口号
+VITE_PORT=8848
+
+# 启动时自动打开浏览器
+VITE_OPEN=true
--- a/.env.development
+++ b/.env.development
@ -0,0 +1,8 @@
+# 本地环境
+VITE_USER_NODE_ENV=development
+
+# 公共基础路径
+VITE_PUBLIC_PATH=/
+
+# 开发环境接口地址
+VITE_API_URL=/api
--- a/mock/user.ts
+++ b/mock/user.ts
@ -0,0 +1,88 @@
+import {MockMethod} from "vite-plugin-mock";
+import {ResultData, ResultPage} from "../src/api";
+
+const user = [
+    {
+        url: "/api/user/info",
+        method: "get",
+        response: () => {
+            return {
+                code: 200,
+                success: true,
+                message: "操作成功",
+                data: {
+                    id: 1,
+                    name: "张三",
+                    username: "admin",
+                    avatar: "https://avatars.githubusercontent.com/u/44080404?v=4",
+                }
+            } as ResultData
+        }
+    },
+    {
+        url: "/api/user/list",
+        method: "get",
+        response: () => {
+            return {
+                code: 200,
+                success: true,
+                message: "操作成功",
+                data: {
+                    rows: [
+                        {
+                            id: 1,
+                            name: "张三",
+                            username: "admin",
+                            avatar: "https://avatars.githubusercontent.com/u/44080404?v=4",
+                        },
+                        {
+                            id: 2,
+                            name: "李四",
+                            username: "lisi",
+                            avatar: "https://avatars.githubusercontent.com/u/44080404?v=4",
+                        },
+                        {
+                            id: 3,
+                            name: "王五",
+                            username: "wangwu",
+                            avatar: "https://avatars.githubusercontent.com/u/44080404?v=4",
+                        },
+                        {
+                            id: 4,
+                            name: "赵六",
+                            username: "zhaoliu",
+                            avatar: "https://avatars.githubusercontent.com/u/44080404?v=4",
+                        },
+                        {
+                            id: 5,
+                            name: "孙七",
+                            username: "sunqi",
+                            avatar: "https://avatars.githubusercontent.com/u/44080404?v=4",
+                        },
+                        {
+                            id: 6,
+                            name: "周八",
+                            username: "zhouba",
+                            avatar: "https://avatars.githubusercontent.com/u/44080404?v=4",
+                        },
+                        {
+                            id: 7,
+                            name: "吴九",
+                            username: "wujui",
+                            avatar: "https://avatars.githubusercontent.com/u/44080404?v=4",
+                        },
+                        {
+                            id: 8,
+                            name: "郑十",
+                            username: "zhengshi",
+                            avatar: "https://avatars.githubusercontent.com/u/44080404?v=4",
+                        }
+                    ],
+                    total: 8
+                }
+            } as ResultPage
+        }
+    }
+] as MockMethod[]
+
+export default user
--- a/package.json
+++ b/package.json
@ -3,6 +3,7 @@
  "private": true,
  "version": "0.1.0",
  "scripts": {
+    "mock": "vite --mode mock --force",
    "dev": "vite",
    "build": "vite build",
    "generate": "vite-ssg build",
@ -10,6 +11,7 @@
    "typecheck": "vue-tsc --noEmit"
  },
  "dependencies": {
+    "axios": "^1.5.1",
    "element-plus": "^2.3.12",
    "vue": "^3.3.4"
  },
@ -17,12 +19,14 @@
    "@iconify-json/ep": "^1.1.12",
    "@types/node": "^20.6.0",
    "@vitejs/plugin-vue": "^4.3.4",
+    "mockjs": "^1.1.0",
    "sass": "^1.66.1",
    "typescript": "^5.2.2",
    "unocss": "^0.55.7",
    "unplugin-vue-components": "^0.25.2",
-    "vite-plugin-vue-setup-extend": "^0.4.0",
    "vite": "^4.4.9",
+    "vite-plugin-mock": "^3.0.0",
+    "vite-plugin-vue-setup-extend": "^0.4.0",
    "vite-ssg": "^0.23.1",
    "vue-tsc": "^1.8.11"
  },
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@ -1,6 +1,9 @@
 lockfileVersion: '6.0'

 dependencies:
+  axios:
+    specifier: ^1.5.1
+    version: 1.5.1
  element-plus:
    specifier: ^2.3.12
    version: 2.3.12(vue@3.3.4)
@ -18,6 +21,9 @@ devDependencies:
  '@vitejs/plugin-vue':
    specifier: ^4.3.4
    version: 4.3.4(vite@4.4.9)(vue@3.3.4)
+  mockjs:
+    specifier: ^1.1.0
+    version: 1.1.0
  sass:
    specifier: ^1.66.1
    version: 1.66.1
@ -33,6 +39,9 @@ devDependencies:
  vite:
    specifier: ^4.4.9
    version: 4.4.9(@types/node@20.6.0)(sass@1.66.1)
+  vite-plugin-mock:
+    specifier: ^3.0.0
+    version: 3.0.0(esbuild@0.18.20)(mockjs@1.1.0)(vite@4.4.9)
  vite-plugin-vue-setup-extend:
    specifier: ^0.4.0
    version: 0.4.0(vite@4.4.9)
@ -429,6 +438,10 @@ packages:
    resolution: {integrity: sha512-Vrjz5N5Ia4SEzWWgIVwnHNEnb1UE1XMkvY5DGXrAeOGE9imk0hgTHh5GyDjLDJi9OTCn9oo9dXH1uToK1VRfrg==}
    dev: false

+  /@types/mockjs@1.0.8:
+    resolution: {integrity: sha512-20t7Fcx3QPbv4wPGeZ0SFOz1l51W3fO3dtO5Ed8KhkUjJ2VsKLRwhgV12lTvQmHnmkJ99ziH0mDmIOrbe8Gs6A==}
+    dev: true
+
  /@types/node@20.6.0:
    resolution: {integrity: sha512-najjVq5KN2vsH2U/xyh2opaSEz6cZMR2SetLIlxlj08nOcmPOemJmUK2o4kUzfLqfrWE0PIrNeE16XhYDd3nqg==}
    dev: true
@ -863,7 +876,16 @@ packages:

  /asynckit@0.4.0:
    resolution: {integrity: sha512-Oei9OH4tRh0YqU3GxhX79dM/mwVgvbZJaSNaRk+bshkj0S5cfHcgYakreBjrHwatXKbz+IoIdYLxrKim2MjW0Q==}
-    dev: true
+
+  /axios@1.5.1:
+    resolution: {integrity: sha512-Q28iYCWzNHjAm+yEAot5QaAMxhMghWLFVf7rRdwhUI+c2jix2DUXjAHXVi+s1ibs3mjPO/cCgbA++3BjD0vP/A==}
+    dependencies:
+      follow-redirects: 1.15.3
+      form-data: 4.0.0
+      proxy-from-env: 1.1.0
+    transitivePeerDependencies:
+      - debug
+    dev: false

  /balanced-match@1.0.2:
    resolution: {integrity: sha512-3oSeUO0TMV67hN1AmbXsK4yaqU7tjiHlbxRDZOpH0KW9+CeX4bRAaX0Anxt0tx2MrpRpWwQaPwIlISEJhYU5Pw==}
@ -887,6 +909,16 @@ packages:
      fill-range: 7.0.1
    dev: true

+  /bundle-require@4.0.2(esbuild@0.18.20):
+    resolution: {integrity: sha512-jwzPOChofl67PSTW2SGubV9HBQAhhR2i6nskiOThauo9dzwDUgOWQScFVaJkjEfYX+UXiD+LEx8EblQMc2wIag==}
+    engines: {node: ^12.20.0 || ^14.13.1 || >=16.0.0}
+    peerDependencies:
+      esbuild: '>=0.17'
+    dependencies:
+      esbuild: 0.18.20
+      load-tsconfig: 0.2.5
+    dev: true
+
  /cac@6.7.14:
    resolution: {integrity: sha512-b6Ilus+c3RrdDk+JhLKUAQfzzgLEPy6wcXqS7f/xe1EETvsDP6GORG7SFuOs6cID5YkqchW/LXZbX5bc8j7ZcQ==}
    engines: {node: '>=8'}
@ -950,12 +982,23 @@ packages:
    engines: {node: '>= 0.8'}
    dependencies:
      delayed-stream: 1.0.0
-    dev: true

  /commander@2.20.3:
    resolution: {integrity: sha512-GpVkmM8vF2vQUkj2LvZmD35JxeJOLCwJ9cUkugyk2nuhbv3+mJvpLYYt+0+USMxE+oj+ey/lJEnhZw75x/OMcQ==}
    dev: true

+  /connect@3.7.0:
+    resolution: {integrity: sha512-ZqRXc+tZukToSNmh5C2iWMSoV3X1YUcPbqEM4DkEG5tNQXrQUZCNVGGv3IuicnkMtPfGf3Xtp8WCXs295iQ1pQ==}
+    engines: {node: '>= 0.10.0'}
+    dependencies:
+      debug: 2.6.9
+      finalhandler: 1.1.2
+      parseurl: 1.3.3
+      utils-merge: 1.0.1
+    transitivePeerDependencies:
+      - supports-color
+    dev: true
+
  /consola@3.2.3:
    resolution: {integrity: sha512-I5qxpzLv+sJhTVEoLYNcTW+bThDCPsit0vLNKShZx6rLtpilNpmmeTPaeqJb9ZE9dV3DGaeby6Vuhrw38WjeyQ==}
    engines: {node: ^14.18.0 || >=16.10.0}
@ -1005,6 +1048,17 @@ packages:
    resolution: {integrity: sha512-e/1zu3xH5MQryN2zdVaF0OrdNLUbvWxzMbi+iNA6Bky7l1RoP8a2fIbRocyHclXt/arDrrR6lL3TqFD9pMQTsg==}
    dev: true

+  /debug@2.6.9:
+    resolution: {integrity: sha512-bC7ElrdJaJnPbAP+1EotYvqZsb3ecl5wi6Bfi6BJTUcNowp6cvspg0jXznRTKDjm/E7AdgFBVeAPVMNcKGsHMA==}
+    peerDependencies:
+      supports-color: '*'
+    peerDependenciesMeta:
+      supports-color:
+        optional: true
+    dependencies:
+      ms: 2.0.0
+    dev: true
+
  /debug@4.3.4:
    resolution: {integrity: sha512-PRWFHuSU3eDtQJPvnNY7Jcket1j0t5OuOsFzPPzsekD52Zl8qUfFIPEiswXqIvHWGVHOgX+7G/vCNNhehwxfkQ==}
    engines: {node: '>=6.0'}
@ -1028,7 +1082,6 @@ packages:
  /delayed-stream@1.0.0:
    resolution: {integrity: sha512-ZySD7Nf91aLB0RxL4KGrKHBXl7Eds1DAmEdcoVawXnLD7SDhpNgtuII2aAkg7a7QS41jxPSZ17p4VdGnMHk3MQ==}
    engines: {node: '>=0.4.0'}
-    dev: true

  /destr@2.0.1:
    resolution: {integrity: sha512-M1Ob1zPSIvlARiJUkKqvAZ3VAqQY6Jcuth/pBKQ2b1dX/Qx0OnJ8Vux6J2H5PTMQeRzWrrbTu70VxBfv/OPDJA==}
@ -1045,6 +1098,10 @@ packages:
    resolution: {integrity: sha512-jtD6YG370ZCIi/9GTaJKQxWTZD045+4R4hTk/x1UyoqadyJ9x9CgSi1RlVDQF8U2sxLLSnFkCaMihqljHIWgMg==}
    dev: true

+  /ee-first@1.1.1:
+    resolution: {integrity: sha512-WMwm9LhRUo+WUaRN+vRuETqG89IgZphVSNkdFgeb6sS/E4OrDIN7t48CAewSHXc6C8lefD8KKfr5vY61brQlow==}
+    dev: true
+
  /element-plus@2.3.12(vue@3.3.4):
    resolution: {integrity: sha512-fAWpbKCyt+l1dsqSNPOs/F/dBN4Wp5CGAyxbiS5zqDwI4q3QPM+LxLU2h3GUHMIBtMGCvmsG98j5HPMkTKkvcA==}
    peerDependencies:
@ -1074,6 +1131,11 @@ packages:
    resolution: {integrity: sha512-MSjYzcWNOA0ewAHpz0MxpYFvwg6yjy1NG3xteoqz644VCo/RPgnr1/GGt+ic3iJTzQ8Eu3TdM14SawnVUmGE6A==}
    dev: true

+  /encodeurl@1.0.2:
+    resolution: {integrity: sha512-TPJXq8JqFaVYm2CWmPvnP2Iyo4ZSM7/QKcSmuMLDObfpH5fi7RUGmd/rTDf+rut/saiDiQEeVTNgAmJEdAOx0w==}
+    engines: {node: '>= 0.8'}
+    dev: true
+
  /entities@4.5.0:
    resolution: {integrity: sha512-V0hjH4dGPh9Ao5p0MoRY6BVqtwCjhz6vI5LT8AJ55H+4g9/4vbHx1I54fS0XuclLhDHArPQCiMjDxjaL8fPxhw==}
    engines: {node: '>=0.12'}
@ -1116,7 +1178,6 @@ packages:

  /escape-html@1.0.3:
    resolution: {integrity: sha512-NiSupZ4OeuGwr68lGIeym/ksIZMJodUGOSCZ/FSnTxcrekbvqrgdUxlJOMpijaKZVjAJrWrGs/6Jy8OMuyj9ow==}
-    dev: false

  /estree-walker@2.0.2:
    resolution: {integrity: sha512-Rfkk/Mp/DL7JVje3u18FxFujQlTNR2q6QfMSMB7AvCBx91NGj/ba3kCfza0f6dVDbw7YlRf/nDrn7pQrCCyQ/w==}
@ -1160,6 +1221,21 @@ packages:
      to-regex-range: 5.0.1
    dev: true

+  /finalhandler@1.1.2:
+    resolution: {integrity: sha512-aAWcW57uxVNrQZqFXjITpW3sIUQmHGG3qSb9mUah9MgMC4NeWhNOlNjXEYq3HjRAvL6arUviZGGJsBg6z0zsWA==}
+    engines: {node: '>= 0.8'}
+    dependencies:
+      debug: 2.6.9
+      encodeurl: 1.0.2
+      escape-html: 1.0.3
+      on-finished: 2.3.0
+      parseurl: 1.3.3
+      statuses: 1.5.0
+      unpipe: 1.0.0
+    transitivePeerDependencies:
+      - supports-color
+    dev: true
+
  /find-up@5.0.0:
    resolution: {integrity: sha512-78/PXT1wlLLDgTzDs7sjq9hzz0vXD+zn+7wypEe4fXQxCmdmqfGsEPQxmiCSQI3ajFV91bVSsvNtrJRiW6nGng==}
    engines: {node: '>=10'}
@ -1168,6 +1244,16 @@ packages:
      path-exists: 4.0.0
    dev: true

+  /follow-redirects@1.15.3:
+    resolution: {integrity: sha512-1VzOtuEM8pC9SFU1E+8KfTjZyMztRsgEfwQl44z8A25uy13jSzTj6dyK2Df52iV0vgHCfBwLhDWevLn95w5v6Q==}
+    engines: {node: '>=4.0'}
+    peerDependencies:
+      debug: '*'
+    peerDependenciesMeta:
+      debug:
+        optional: true
+    dev: false
+
  /form-data@4.0.0:
    resolution: {integrity: sha512-ETEklSGi5t0QMZuiXoA/Q6vcnxcLQP5vdugSpuAyi6SVGi2clPPp+xgEhuMaHC+zGgn31Kd235W35f7Hykkaww==}
    engines: {node: '>= 6'}
@ -1175,7 +1261,6 @@ packages:
      asynckit: 0.4.0
      combined-stream: 1.0.8
      mime-types: 2.1.35
-    dev: true

  /fs-extra@11.1.1:
    resolution: {integrity: sha512-MGIE4HOvQCeUCzmlHs0vXpih4ysz4wg9qiSAu6cd42lVwPbTM1TjV7RusoyQqMmk/95gdQZX72u+YW+c3eEpFQ==}
@ -1413,6 +1498,11 @@ packages:
    resolution: {integrity: sha512-Y+60/zizpJ3HRH8DCss+q95yr6145JXZo46OTpFvDZWLfRCE4qChOyk1b26nMaNpfHHgxagk9dXT5OP0Tfe+dQ==}
    dev: true

+  /load-tsconfig@0.2.5:
+    resolution: {integrity: sha512-IXO6OCs9yg8tMKzfPZ1YmheJbZCiEsnBdcB03l0OcfK9prKnJb96siuHCr5Fl37/yo9DnKU+TLpxzTUspw9shg==}
+    engines: {node: ^12.20.0 || ^14.13.1 || >=16.0.0}
+    dev: true
+
  /local-pkg@0.4.3:
    resolution: {integrity: sha512-SFppqq5p42fe2qcZQqqEOiVRXl+WCP1MdT6k7BDEW1j++sp5fIY+/fdRQitvKgB5BrBcmrs5m/L0v2FrU5MY1g==}
    engines: {node: '>=14'}
@ -1496,14 +1586,12 @@ packages:
  /mime-db@1.52.0:
    resolution: {integrity: sha512-sPU4uV7dYlvtWJxwwxHD0PuihVNiE7TyAbQ5SWxDCB9mUYvOgroQOwYQQOKPJ8CIbE+1ETVlOoK1UC2nU3gYvg==}
    engines: {node: '>= 0.6'}
-    dev: true

  /mime-types@2.1.35:
    resolution: {integrity: sha512-ZDY+bPm5zTTF+YpCrAU9nK0UgICYPT0QtT1NZWFv4s++TNkcgVaT0g6+4R2uI4MjQjzysHB1zxuWL50hzaeXiw==}
    engines: {node: '>= 0.6'}
    dependencies:
      mime-db: 1.52.0
-    dev: true

  /mimic-fn@2.1.0:
    resolution: {integrity: sha512-OqbOk5oEQeAZ8WXWydlu9HJjz9WVdEIvamMCcXmuqUYjTknH/sqsWvhQ3vgwKFRR1HpjvNBKQ37nbJgYzGqGcg==}
@ -1526,11 +1614,22 @@ packages:
      ufo: 1.3.0
    dev: true

+  /mockjs@1.1.0:
+    resolution: {integrity: sha512-eQsKcWzIaZzEZ07NuEyO4Nw65g0hdWAyurVol1IPl1gahRwY+svqzfgfey8U8dahLwG44d6/RwEzuK52rSa/JQ==}
+    hasBin: true
+    dependencies:
+      commander: 2.20.3
+    dev: true
+
  /mrmime@1.0.1:
    resolution: {integrity: sha512-hzzEagAgDyoU1Q6yg5uI+AorQgdvMCur3FcKf7NhMKWsaYg+RnbTyHRa/9IlLF9rf455MOCtcqqrQQ83pPP7Uw==}
    engines: {node: '>=10'}
    dev: true

+  /ms@2.0.0:
+    resolution: {integrity: sha512-Tpp60P6IUJDTuOq/5Z8cdskzJujfwqfOTkrwIwj7IRISpnkJnT6SyJ4PCPnGMoFjC9ddhal5KVIYtAt97ix05A==}
+    dev: true
+
  /ms@2.1.2:
    resolution: {integrity: sha512-sGkPx+VjMtmA6MX27oA4FBFELFCZZ4S4XqeGOXCv68tT+jb3vk/RyaKWP0PTKyWtmLSM0b+adUTEvbs1PEaH2w==}
    dev: true
@ -1582,6 +1681,13 @@ packages:
      ufo: 1.3.0
    dev: true

+  /on-finished@2.3.0:
+    resolution: {integrity: sha512-ikqdkGAAyf/X/gPhXGvfgAytDZtDbr+bkNUJ0N9h5MI/dmdgCs3l6hoHrcUv41sRKew3jIwrp4qQDXiK99Utww==}
+    engines: {node: '>= 0.8'}
+    dependencies:
+      ee-first: 1.1.1
+    dev: true
+
  /onetime@5.1.2:
    resolution: {integrity: sha512-kbpaSSGJTWdAY5KPVeMOKXSrPtr8C8C7wodJbcsd51jRnmD+GZu8Y0VoU6Dm5Z4vWr0Ig/1NKuWRKf7j5aaYSg==}
    engines: {node: '>=6'}
@ -1615,6 +1721,11 @@ packages:
      entities: 4.5.0
    dev: true

+  /parseurl@1.3.3:
+    resolution: {integrity: sha512-CiyeOxFT/JZyN5m0z9PfXw4SCBJ6Sygz1Dpl0wqjlhDEGGBP1GnsUVEL0p63hoG1fcj3fHynXi9NYO4nWOL+qQ==}
+    engines: {node: '>= 0.8'}
+    dev: true
+
  /path-exists@4.0.0:
    resolution: {integrity: sha512-ak9Qy5Q7jYb2Wwcey5Fpvg2KoAc/ZIhLSLOSBmRmygPsGwkVVt0fZa0qrtMz+m6tJTAHfZQ8FnmB4MG4LWy7/w==}
    engines: {node: '>=8'}
@ -1629,6 +1740,10 @@ packages:
    resolution: {integrity: sha512-LDJzPVEEEPR+y48z93A0Ed0yXb8pAByGWo/k5YYdYgpY2/2EsOsksJrq7lOHxryrVOn1ejG6oAp8ahvOIQD8sw==}
    dev: true

+  /path-to-regexp@6.2.1:
+    resolution: {integrity: sha512-JLyh7xT1kizaEvcaXOQwOc2/Yhw6KZOvPf1S8401UyLk86CU79LN3vl7ztXGm/pZ+YjoyAJ4rxmHwbkBXJX+yw==}
+    dev: true
+
  /pathe@1.1.1:
    resolution: {integrity: sha512-d+RQGp0MAYTIaDBIMmOfMwz3E+LOZnxx1HZd5R18mmCZY0QBlK0LDZfPc8FW8Ed2DlvsuE6PRjroDY+wg4+j/Q==}
    dev: true
@ -1667,6 +1782,10 @@ packages:
    hasBin: true
    dev: true

+  /proxy-from-env@1.1.0:
+    resolution: {integrity: sha512-D+zkORCbA9f1tdWRK0RaCR3GPv50cMxcrz4X8k5LTSUD1Dkw47mKJEZQNunItRTkWwgtaUSo1RVFRIG9ZXiFYg==}
+    dev: false
+
  /psl@1.9.0:
    resolution: {integrity: sha512-E/ZsdU4HLs/68gYzgGTkMicWTLPdAftJLfJFlLUAAKZGkStNU72sZjT66SnMDVOfOWY/YAoiD7Jxa9iHvngcag==}
    dev: true
@ -1805,6 +1924,11 @@ packages:
    deprecated: Please use @jridgewell/sourcemap-codec instead
    dev: true

+  /statuses@1.5.0:
+    resolution: {integrity: sha512-OpZ3zP+jT1PI7I8nemJX4AKmAX070ZkYPVWV/AaKTJl+tXCTGyVdC1a4SL8RUQYEwk/f34ZX8UTykN68FwrqAA==}
+    engines: {node: '>= 0.6'}
+    dev: true
+
  /string-width@4.2.3:
    resolution: {integrity: sha512-wKyQRQpjJ0sIp62ErSZdGsjMJWsap5oRNihHhu6G7JVO/9jIB6UyevL+tXuOqrng8j/cxKTWyWUwvSTriiZz/g==}
    engines: {node: '>=8'}
@ -1955,6 +2079,11 @@ packages:
      - supports-color
    dev: true

+  /unpipe@1.0.0:
+    resolution: {integrity: sha512-pjy2bYhSsufwWlKwPc+l3cN7+wuJlK6uz0YdJEOlQDbl6jo/YlPi4mb8agUkVC8BF7V8NuzeyPNqRksA3hztKQ==}
+    engines: {node: '>= 0.8'}
+    dev: true
+
  /unplugin-vue-components@0.25.2(vue@3.3.4):
    resolution: {integrity: sha512-OVmLFqILH6w+eM8fyt/d/eoJT9A6WO51NZLf1vC5c1FZ4rmq2bbGxTy8WP2Jm7xwFdukaIdv819+UI7RClPyCA==}
    engines: {node: '>=14'}
@ -2004,6 +2133,33 @@ packages:
      requires-port: 1.0.0
    dev: true

+  /utils-merge@1.0.1:
+    resolution: {integrity: sha512-pMZTvIkT1d+TFGvDOqodOclx0QWkkgi6Tdoa8gC8ffGAAqz9pzPTZWAybbsHHoED/ztMtkv/VoYTYyShUn81hA==}
+    engines: {node: '>= 0.4.0'}
+    dev: true
+
+  /vite-plugin-mock@3.0.0(esbuild@0.18.20)(mockjs@1.1.0)(vite@4.4.9):
+    resolution: {integrity: sha512-Ibwlga2CSgkoFHFtPW3T/l0fwsGVz9Ss5i7HauBQDyDFfMKgbQXh9wKDLksLZHyai9rkDanxJtIcxbD0bUHCfw==}
+    engines: {node: '>=16.0.0'}
+    peerDependencies:
+      mockjs: '>=1.1.0'
+      vite: '>=4.0.0'
+    dependencies:
+      '@types/mockjs': 1.0.8
+      bundle-require: 4.0.2(esbuild@0.18.20)
+      chokidar: 3.5.3
+      connect: 3.7.0
+      debug: 4.3.4
+      fast-glob: 3.3.1
+      mockjs: 1.1.0
+      path-to-regexp: 6.2.1
+      picocolors: 1.0.0
+      vite: 4.4.9(@types/node@20.6.0)(sass@1.66.1)
+    transitivePeerDependencies:
+      - esbuild
+      - supports-color
+    dev: true
+
  /vite-plugin-vue-setup-extend@0.4.0(vite@4.4.9):
    resolution: {integrity: sha512-WMbjPCui75fboFoUTHhdbXzu4Y/bJMv5N9QT9a7do3wNMNHHqrk+Tn2jrSJU0LS5fGl/EG+FEDBYVUeWIkDqXQ==}
    peerDependencies:
--- a/src/api/index.ts
+++ b/src/api/index.ts
@ -0,0 +1,157 @@
+import axios, {
+    AxiosInstance,
+    AxiosError,
+    AxiosRequestConfig,
+    InternalAxiosRequestConfig,
+    AxiosResponse
+} from 'axios'
+import {ElNotification} from "element-plus";
+
+export interface Result {
+    code: number;
+    success: boolean;
+    message: string;
+}
+
+export interface ResultData<T = any> extends Result {
+    data: T;
+}
+
+export interface ResultPage<T = any> extends ResultData {
+    data: {
+        rows: T[];
+        total: number;
+    }
+}
+
+
+/**
+ * axios配置
+ */
+const config = {
+    // 请求地址
+    baseURL: import.meta.env.VITE_API_URL as string,
+    // 设置超时时间
+    timeout: 8000,
+}
+
+class RequestHttp {
+    service: AxiosInstance
+
+    /**
+     * 请求构造函数
+     * @param config
+     */
+    public constructor(config: AxiosRequestConfig) {
+        // 创建axios实例
+        this.service = axios.create(config)
+        // 请求拦截
+        this.service.interceptors.request.use(
+            (config: InternalAxiosRequestConfig) => {
+                config.headers['Authorization'] = "Bearer 87779e5a-3342-4df6-865d-d8828800d6fb"
+                return config
+            },
+            (error: AxiosError) => {
+                // 请求错误处理
+                return Promise.reject(error)
+            }
+        )
+        // 响应拦截
+        this.service.interceptors.response.use(
+            (response: AxiosResponse) => {
+                const {data} = response
+                // 响应拦截处理
+                return data
+            },
+            (error: AxiosError) => {
+                const {response, message} = error
+                const data = response?.data as ResultData
+                const errMsg = data ? data.message : message
+                // 响应错误处理
+                ElNotification.error(errMsg || '未知错误')
+                return Promise.reject(response?.data || error)
+            }
+        )
+    }
+
+    /**
+     * get请求
+     * @param url 请求地址
+     * @param params 请求参数
+     */
+    get<T>(url: string, params?: object): Promise<ResultData<T>> {
+        return this.service.get(url, params)
+    }
+
+    /**
+     * post请求
+     * @param url 请求地址
+     * @param data 请求参数
+     */
+    post<T>(url: string, data?: object): Promise<ResultData<T>> {
+        return this.service.post(url, data)
+    }
+
+    /**
+     * put请求
+     * @param url 请求地址
+     * @param data 请求参数
+     */
+    put<T>(url: string, data?: object): Promise<ResultData<T>> {
+        return this.service.put(url, data)
+    }
+
+    /**
+     * delete请求
+     * @param url 请求地址
+     * @param params 请求参数
+     */
+    delete<T>(url: string, params?: any): Promise<ResultData<T>> {
+        return this.service.delete(url, params)
+    }
+
+    /**
+     * patch请求
+     * @param url 请求地址
+     * @param data 请求参数
+     */
+    patch<T>(url: string, data?: object): Promise<ResultData<T>> {
+        return this.service.patch(url, data)
+    }
+
+    /**
+     * head请求
+     * @param url 请求地址
+     */
+    head<T>(url: string): Promise<ResultData<T>> {
+        return this.service.head(url)
+    }
+
+    /**
+     * options请求
+     * @param url 请求地址
+     * @param _object 其他配置
+     */
+    options<T>(url: string): Promise<ResultData<T>> {
+        return this.service.options(url)
+    }
+
+    /**
+     * request请求
+     * @param config 请求配置
+     */
+    request<T>(config: AxiosRequestConfig): Promise<ResultData<T>> {
+        return this.service.request(config)
+    }
+
+    /**
+     * 下载文件
+     * @param url 请求地址
+     * @param params 请求参数
+     */
+    download(url: string, params?: object): Promise<BlobPart> {
+        return this.service.post(url, params, {responseType: 'blob'})
+    }
+}
+
+export default new RequestHttp(config)
--- a/src/api/modules/user.ts
+++ b/src/api/modules/user.ts
@ -0,0 +1,23 @@
+import http from '~/api/index'
+
+export interface User {
+    id: string,
+    username: string,
+    name: string,
+    avatar: string
+}
+
+/**
+ * 获取用户信息
+ * @param username
+ */
+export const getByUsername = (username: string) => {
+    return http.get<User>(`/user/info/${username}`)
+}
+
+/**
+ * 查询用户列表
+ */
+export const getList = () => {
+    return http.get<User[]>('/user/list')
+}
--- a/src/env.d.ts
+++ b/src/env.d.ts
@ -5,3 +5,17 @@ declare module '*.vue' {
  const component: DefineComponent<{}, {}, any>
  export default component
 }
+
+interface ImportMetaEnv {
+  readonly VITE_OPEN: boolean;
+  readonly VITE_PORT: number;
+  readonly VITE_GLOB_APP_TITLE: string;
+  readonly VITE_API_URL: string;
+  readonly VITE_PUBLIC_PATH: string;
+  readonly VITE_USER_NODE_ENV: string;
+}
+
+// 解决import.meta.env类型提示，参考https://cn.vitejs.dev/guide/env-and-mode.html#env-files
+interface ImportMeta {
+  readonly env: ImportMetaEnv
+}
--- a/src/views/flowDesign/index.vue
+++ b/src/views/flowDesign/index.vue
@ -3,8 +3,9 @@ import NodeTree from './nodes/index.vue'
 import NodePenal from './penal/index.vue'
 import {FlowNode} from './nodes/Node/index'
 import useNode from './hooks/useNode'
-import {computed, onUnmounted, provide, reactive, ref} from "vue";
+import {computed, onMounted, onUnmounted, provide, reactive, ref} from "vue";
 import {Plus, Minus} from "@element-plus/icons-vue";
+import {getList} from "~/api/modules/user";

 const nodePenalRef = ref<InstanceType<typeof NodePenal>>()
 const nodeTreeObj = reactive<FlowNode>({
@ -73,7 +74,6 @@ onUnmounted(() => {
    <div class="node-container">
      <NodeTree :node="nodeTreeObj"/>
    </div>
-
    <!--属性面板-->
    <NodePenal ref="nodePenalRef"/>
  </div>
--- a/src/views/flowDesign/penal/index.vue
+++ b/src/views/flowDesign/penal/index.vue
@ -12,7 +12,13 @@ const nodeProps: Record<string, Component> = {
  cc: CcAttr
 }

-let flowNode = ref<FlowNode | undefined>()
+let flowNode = ref<FlowNode>({
+  id: '',
+  pid: '',
+  type: '',
+  name: '',
+  child: null
+})
 const visible = ref(false)
 const showInput = ref(false)
 const onClickOutside = () => {
@ -30,7 +36,7 @@ defineExpose({
 </script>

 <template>
-  <el-drawer v-model="visible" v-if="visible" size="35%">
+  <el-drawer v-model="visible" size="35%">
    <template #header="{ titleId, titleClass }">
      <span :id="titleId" :class="titleClass">
          <el-input v-click-outside="onClickOutside" @blur="onClickOutside" maxlength="30" v-model="flowNode!.name"
--- a/vite.config.ts
+++ b/vite.config.ts
@ -5,6 +5,7 @@ import vue from '@vitejs/plugin-vue'
 import Components from 'unplugin-vue-components/vite'
 import {ElementPlusResolver} from 'unplugin-vue-components/resolvers'
 import VueSetupExtend from 'vite-plugin-vue-setup-extend'
+import {viteMockServe} from "vite-plugin-mock"

 import Unocss from 'unocss/vite'
 import {
@ -34,6 +35,10 @@ export default defineConfig({
    },
    plugins: [
        vue(),
+        viteMockServe({
+            mockPath: './mock',
+            enable: true
+        }),
        VueSetupExtend(),
        Components({
            // allow auto load markdown components under `./src/components/`