feat(业务): 子系统相关我负责的页面进行完善1

# Conflicts:
#	components.d.ts
#	src/views/personal/project/charge.vue

.env.build_test

@@ -2,5 +2,5 @@
 NODE_ENV = 'production'
 
 # 打包模式连测试服
-#VUE_APP_BASE_API = './api-test'
+VUE_APP_BASE_API = './api-test'
 VUE_APP_BASE_API = '/'

.eslintrc.cjs

@@ -1,213 +0,0 @@
-/* eslint-env node */
-module.exports = {
-  '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,
-      'tsx': true
-    }
-  },
-  'plugins': ['@typescript-eslint', 'import'],
-  'extends': [
-    'plugin:vue/vue3-essential',
-    'plugin:@typescript-eslint/recommended',
-    'eslint:recommended'
-  ],
-  'globals': {
-    defineEmits: 'readonly',
-    defineProps: 'readonly',
-    defineExpose: 'readonly',
-    withDefaults: 'readonly',
-    WeixinJSBridge: 'readonly',
-    ElLoading: 'readonly',
-    ElMessage: 'readonly',
-    ElMessageBox: 'readonly',
-    ElNotification: 'readonly'
-  },
-  'rules': {
-    'vue/no-multiple-template-root': 'off',
-    'vue/multi-word-component-names': 'off',
-    'vue/singleline-html-element-content-newline': 'off',
-    'vue/multiline-html-element-content-newline': 'off',
-    'vue/no-v-html': 'off',
-    'accessor-pairs': 2,
-    'arrow-spacing': [2, {
-      'before': true,
-      'after': true
-    }],
-    'block-spacing': [2, 'always'],
-    'brace-style': [2, '1tbs', {
-      'allowSingleLine': true
-    }],
-    'camelcase': [0, {
-      'properties': 'always'
-    }],
-    'comma-dangle': [2, 'never'],
-    'comma-spacing': [2, {
-      'before': false,
-      'after': true
-    }],
-    'comma-style': [2, 'last'],
-    'constructor-super': 2,
-    'curly': [2, 'multi-line'],
-    'dot-location': [2, 'property'],
-    'eol-last': 2,
-    'eqeqeq': ['error', 'always', { 'null': 'ignore' }],
-    'generator-star-spacing': [2, {
-      'before': true,
-      'after': true
-    }],
-    'handle-callback-err': [2, '^(err|error)$'],
-    'indent': [2, 2, {
-      'SwitchCase': 1
-    }],
-    'jsx-quotes': [2, 'prefer-single'],
-    'key-spacing': [2, {
-      'beforeColon': false,
-      'afterColon': true
-    }],
-    'keyword-spacing': [2, {
-      'before': true,
-      'after': true
-    }],
-    'new-cap': [2, {
-      'newIsCap': true,
-      'capIsNew': false
-    }],
-    'new-parens': 2,
-    'no-array-constructor': 2,
-    'no-caller': 2,
-    'no-console': 'off',
-    'no-class-assign': 2,
-    'no-cond-assign': 2,
-    'no-const-assign': 2,
-    'no-control-regex': 0,
-    'no-delete-var': 2,
-    'no-dupe-args': 2,
-    'no-dupe-class-members': 2,
-    'no-dupe-keys': 2,
-    'no-duplicate-case': 2,
-    'no-empty-character-class': 2,
-    'no-empty-pattern': 2,
-    'no-eval': 2,
-    'no-ex-assign': 2,
-    'no-extend-native': 2,
-    'no-extra-bind': 2,
-    'no-extra-boolean-cast': 2,
-    'no-extra-parens': [2, 'functions'],
-    'no-fallthrough': 2,
-    'no-floating-decimal': 2,
-    'no-func-assign': 2,
-    'no-implied-eval': 2,
-    'no-inner-declarations': [2, 'functions'],
-    'no-invalid-regexp': 2,
-    'no-irregular-whitespace': 2,
-    'no-iterator': 2,
-    'no-label-var': 2,
-    'no-labels': [2, {
-      'allowLoop': false,
-      'allowSwitch': false
-    }],
-    'no-lone-blocks': 2,
-    'no-mixed-spaces-and-tabs': 2,
-    'no-multi-spaces': 2,
-    'no-multi-str': 2,
-    'no-multiple-empty-lines': [2, {
-      'max': 1
-    }],
-    'no-native-reassign': 2,
-    'no-negated-in-lhs': 2,
-    'no-new-object': 2,
-    'no-new-require': 2,
-    'no-new-symbol': 2,
-    'no-new-wrappers': 2,
-    'no-obj-calls': 2,
-    'no-octal': 2,
-    'no-octal-escape': 2,
-    'no-path-concat': 2,
-    'no-proto': 2,
-    'no-redeclare': 2,
-    'no-regex-spaces': 2,
-    'no-return-assign': [2, 'except-parens'],
-    'no-self-assign': 2,
-    'no-self-compare': 2,
-    'no-sequences': 2,
-    'no-shadow-restricted-names': 2,
-    'no-spaced-func': 2,
-    'no-sparse-arrays': 2,
-    'no-this-before-super': 2,
-    'no-throw-literal': 2,
-    'no-trailing-spaces': 2,
-    'no-undef': 2,
-    'no-undef-init': 2,
-    'no-unexpected-multiline': 2,
-    'no-unmodified-loop-condition': 2,
-    'no-unneeded-ternary': [2, {
-      'defaultAssignment': false
-    }],
-    'no-unreachable': 2,
-    'no-unsafe-finally': 2,
-    'no-unused-vars': [2, {
-      'vars': 'all',
-      'args': 'none'
-    }],
-    'no-useless-call': 2,
-    'no-useless-computed-key': 2,
-    'no-useless-constructor': 2,
-    'no-useless-escape': 0,
-    'no-whitespace-before-property': 2,
-    'no-with': 2,
-    'one-var': [2, {
-      'initialized': 'never'
-    }],
-    'operator-linebreak': [2, 'after', {
-      'overrides': {
-        '?': 'before',
-        ':': 'before'
-      }
-    }],
-    'padded-blocks': [2, 'never'],
-    'quotes': [2, 'single', {
-      'avoidEscape': true,
-      'allowTemplateLiterals': true
-    }],
-    'semi': [2, 'always'],
-    'semi-spacing': [2, {
-      'before': false,
-      'after': true
-    }],
-    'space-before-blocks': [2, 'always'],
-    'space-before-function-paren': 'off',
-    'space-in-parens': [2, 'never'],
-    'space-infix-ops': 2,
-    'space-unary-ops': [2, {
-      'words': true,
-      'nonwords': false
-    }],
-    'spaced-comment': [2, 'always', {
-      'markers': ['global', 'globals', 'eslint', 'eslint-disable', '*package', '!', ',']
-    }],
-    'template-curly-spacing': [2, 'never'],
-    'use-isnan': 2,
-    'valid-typeof': 2,
-    'wrap-iife': [2, 'any'],
-    'yield-star-spacing': [2, 'both'],
-    'yoda': [2, 'never'],
-    'prefer-const': 2,
-    'no-debugger': process.env.NODE_ENV === 'production' ? 2 : 0,
-    'object-curly-spacing': [2, 'always', {
-      objectsInObjects: false
-    }],
-    'array-bracket-spacing': [2, 'never']
-  }
-};

components.d.ts

@@ -13,19 +13,16 @@ declare module '@vue/runtime-core' {
     DropdownMenu: typeof import('./src/components/Share/DropdownMenu.vue')['default']
     Dropzone: typeof import('./src/components/Dropzone/index.vue')['default']
     EditorImage: typeof import('./src/components/Tinymce/components/EditorImage.vue')['default']
-    ElAlert: typeof import('element-plus/es')['ElAlert']
-    ElAutocomplete: typeof import('element-plus/es')['ElAutocomplete']
     ElBadge: typeof import('element-plus/es')['ElBadge']
     ElBreadcrumb: typeof import('element-plus/es')['ElBreadcrumb']
     ElBreadcrumbItem: typeof import('element-plus/es')['ElBreadcrumbItem']
     ElButton: typeof import('element-plus/es')['ElButton']
+    ElButtonGroup: typeof import('element-plus/es')['ElButtonGroup']
     ElCard: typeof import('element-plus/es')['ElCard']
-    ElCheckbox: typeof import('element-plus/es')['ElCheckbox']
     ElCol: typeof import('element-plus/es')['ElCol']
     ElConfigProvider: typeof import('element-plus/es')['ElConfigProvider']
     ElDatePicker: typeof import('element-plus/es')['ElDatePicker']
     ElDialog: typeof import('element-plus/es')['ElDialog']
-    ElDivider: typeof import('element-plus/es')['ElDivider']
     ElDropdown: typeof import('element-plus/es')['ElDropdown']
     ElDropdownItem: typeof import('element-plus/es')['ElDropdownItem']
     ElDropdownMenu: typeof import('element-plus/es')['ElDropdownMenu']
@@ -37,24 +34,17 @@ declare module '@vue/runtime-core' {
     ElMenuItem: typeof import('element-plus/es')['ElMenuItem']
     ElOption: typeof import('element-plus/es')['ElOption']
     ElPagination: typeof import('element-plus/es')['ElPagination']
+    ElPopover: typeof import('element-plus/es')['ElPopover']
     ElProgress: typeof import('element-plus/es')['ElProgress']
-    ElRadio: typeof import('element-plus/es')['ElRadio']
-    ElRadioButton: typeof import('element-plus/es')['ElRadioButton']
-    ElRadioGroup: typeof import('element-plus/es')['ElRadioGroup']
-    ElRate: typeof import('element-plus/es')['ElRate']
     ElRow: typeof import('element-plus/es')['ElRow']
     ElScrollbar: typeof import('element-plus/es')['ElScrollbar']
     ElSelect: typeof import('element-plus/es')['ElSelect']
-    ElSlider: typeof import('element-plus/es')['ElSlider']
     ElSubMenu: typeof import('element-plus/es')['ElSubMenu']
     ElSwitch: typeof import('element-plus/es')['ElSwitch']
     ElTable: typeof import('element-plus/es')['ElTable']
     ElTableColumn: typeof import('element-plus/es')['ElTableColumn']
-    ElTabPane: typeof import('element-plus/es')['ElTabPane']
-    ElTabs: typeof import('element-plus/es')['ElTabs']
     ElTag: typeof import('element-plus/es')['ElTag']
     ElTooltip: typeof import('element-plus/es')['ElTooltip']
-    ElTree: typeof import('element-plus/es')['ElTree']
     ElUpload: typeof import('element-plus/es')['ElUpload']
     ErrorLog: typeof import('./src/components/ErrorLog/index.vue')['default']
     GithubCorner: typeof import('./src/components/GithubCorner/index.vue')['default']
@@ -82,7 +72,4 @@ declare module '@vue/runtime-core' {
     UploadExcel: typeof import('./src/components/UploadExcel/index.vue')['default']
     VueCountTo: typeof import('./src/components/vue-count-to/vue-countTo.vue')['default']
   }
-  export interface ComponentCustomProperties {
-    vLoading: typeof import('element-plus/es')['ElLoadingDirective']
-  }
 }

mock/demo/user.js

@@ -5,7 +5,7 @@ const tokens = {
   },
   editor: {
     token: 'editor-token'
-  }
+  },
 };
 
 const users = {
@@ -20,13 +20,13 @@ const users = {
     introduction: 'I am an editor',
     avatar: 'https://wpimg.wallstcn.com/f778738c-e4f8-4870-b634-56703b4acafe.gif',
     name: 'Normal Editor'
-  }
+  },
 };
 
 export default [
   // user login
   {
-    url: '/vue-element-admin/user/login',
+    url: '/auth/login',
     method: 'post',
     response: config => {
       const { username } = config.body;

package-lock.json

@@ -8,6 +8,7 @@
       "name": "vue3-element-admin",
       "version": "1.0.0",
       "dependencies": {
+        "@element-plus/icons-vue": "^2.3.1",
         "axios": "1.2.1",
         "clipboard": "2.0.11",
         "driver.js": "0.9.8",
@@ -26,11 +27,11 @@
         "sortablejs": "1.15.0",
         "vue": "3.2.45",
         "vue-router": "4.1.6",
+        "vuex": "^4.1.0",
         "xlsx": "0.18.5"
       },
       "devDependencies": {
-        "@typescript-eslint/eslint-plugin": "5.54.1",
+        "@types/sortablejs": "^1.15.8",
-        "@typescript-eslint/parser": "5.54.1",
         "@vitejs/plugin-vue": "3.2.0",
         "@vitejs/plugin-vue-jsx": "2.1.1",
         "@vue/cli-plugin-typescript": "5.0.8",
@@ -537,9 +538,9 @@
       }
     },
     "node_modules/@element-plus/icons-vue": {
-      "version": "2.1.0",
+      "version": "2.3.1",
-      "resolved": "https://registry.npmmirror.com/@element-plus/icons-vue/-/icons-vue-2.1.0.tgz",
+      "resolved": "https://registry.npmjs.org/@element-plus/icons-vue/-/icons-vue-2.3.1.tgz",
-      "integrity": "sha512-PSBn3elNoanENc1vnCfh+3WA9fimRC7n+fWkf3rE5jvv+aBohNHABC/KAR5KWPecxWxDTVT1ERpRbOMRcOV/vA==",
+      "integrity": "sha512-XxVUZv48RZAd87ucGS48jPf6pKu0yV5UCg9f4FFwtrYxXOwWuVJo6wOvSLKEoMQKjv8GsX/mhP6UsC1lRwbUWg==",
       "peerDependencies": {
         "vue": "^3.2.0"
       }
@@ -1184,12 +1185,6 @@
       "integrity": "sha512-wWKOClTTiizcZhXnPY4wikVAwmdYHp8q6DmC+EJUzAMsycb7HB32Kh9RN4+0gExjmPmZSAQjgURXIGATPegAvA==",
       "dev": true
     },
-    "node_modules/@types/semver": {
-      "version": "7.3.13",
-      "resolved": "https://registry.npmmirror.com/@types/semver/-/semver-7.3.13.tgz",
-      "integrity": "sha512-21cFJr9z3g5dW8B0CVI9g2O9beqaThGQ6ZFBqHfwhzLDKUxaqTIy3vnfah/UPkfOiF2pLq+tGz+W8RyCskuslw==",
-      "dev": true
-    },
     "node_modules/@types/serve-index": {
       "version": "1.9.1",
       "resolved": "https://registry.npmmirror.com/@types/serve-index/-/serve-index-1.9.1.tgz",
@@ -1218,6 +1213,12 @@
         "@types/node": "*"
       }
     },
+    "node_modules/@types/sortablejs": {
+      "version": "1.15.8",
+      "resolved": "https://registry.npmjs.org/@types/sortablejs/-/sortablejs-1.15.8.tgz",
+      "integrity": "sha512-b79830lW+RZfwaztgs1aVPgbasJ8e7AXtZYHTELNXZPsERt4ymJdjV4OccDbHQAvHrCcFpbF78jkm0R6h/pZVg==",
+      "dev": true
+    },
     "node_modules/@types/web-bluetooth": {
       "version": "0.0.16",
       "resolved": "https://registry.npmmirror.com/@types/web-bluetooth/-/web-bluetooth-0.0.16.tgz",
@@ -1238,261 +1239,6 @@
         "@types/node": "*"
       }
     },
-    "node_modules/@typescript-eslint/eslint-plugin": {
-      "version": "5.54.1",
-      "resolved": "https://registry.npmmirror.com/@typescript-eslint/eslint-plugin/-/eslint-plugin-5.54.1.tgz",
-      "integrity": "sha512-a2RQAkosH3d3ZIV08s3DcL/mcGc2M/UC528VkPULFxR9VnVPT8pBu0IyBAJJmVsCmhVfwQX1v6q+QGnmSe1bew==",
-      "dev": true,
-      "dependencies": {
-        "@typescript-eslint/scope-manager": "5.54.1",
-        "@typescript-eslint/type-utils": "5.54.1",
-        "@typescript-eslint/utils": "5.54.1",
-        "debug": "^4.3.4",
-        "grapheme-splitter": "^1.0.4",
-        "ignore": "^5.2.0",
-        "natural-compare-lite": "^1.4.0",
-        "regexpp": "^3.2.0",
-        "semver": "^7.3.7",
-        "tsutils": "^3.21.0"
-      },
-      "engines": {
-        "node": "^12.22.0 || ^14.17.0 || >=16.0.0"
-      },
-      "funding": {
-        "type": "opencollective",
-        "url": "https://opencollective.com/typescript-eslint"
-      },
-      "peerDependencies": {
-        "@typescript-eslint/parser": "^5.0.0",
-        "eslint": "^6.0.0 || ^7.0.0 || ^8.0.0"
-      },
-      "peerDependenciesMeta": {
-        "typescript": {
-          "optional": true
-        }
-      }
-    },
-    "node_modules/@typescript-eslint/eslint-plugin/node_modules/semver": {
-      "version": "7.3.8",
-      "resolved": "https://registry.npmmirror.com/semver/-/semver-7.3.8.tgz",
-      "integrity": "sha512-NB1ctGL5rlHrPJtFDVIVzTyQylMLu9N9VICA6HSFJo8MCGVTMW6gfpicwKmmK/dAjTOrqu5l63JJOpDSrAis3A==",
-      "dev": true,
-      "dependencies": {
-        "lru-cache": "^6.0.0"
-      },
-      "bin": {
-        "semver": "bin/semver.js"
-      },
-      "engines": {
-        "node": ">=10"
-      }
-    },
-    "node_modules/@typescript-eslint/parser": {
-      "version": "5.54.1",
-      "resolved": "https://registry.npmmirror.com/@typescript-eslint/parser/-/parser-5.54.1.tgz",
-      "integrity": "sha512-8zaIXJp/nG9Ff9vQNh7TI+C3nA6q6iIsGJ4B4L6MhZ7mHnTMR4YP5vp2xydmFXIy8rpyIVbNAG44871LMt6ujg==",
-      "dev": true,
-      "dependencies": {
-        "@typescript-eslint/scope-manager": "5.54.1",
-        "@typescript-eslint/types": "5.54.1",
-        "@typescript-eslint/typescript-estree": "5.54.1",
-        "debug": "^4.3.4"
-      },
-      "engines": {
-        "node": "^12.22.0 || ^14.17.0 || >=16.0.0"
-      },
-      "funding": {
-        "type": "opencollective",
-        "url": "https://opencollective.com/typescript-eslint"
-      },
-      "peerDependencies": {
-        "eslint": "^6.0.0 || ^7.0.0 || ^8.0.0"
-      },
-      "peerDependenciesMeta": {
-        "typescript": {
-          "optional": true
-        }
-      }
-    },
-    "node_modules/@typescript-eslint/scope-manager": {
-      "version": "5.54.1",
-      "resolved": "https://registry.npmmirror.com/@typescript-eslint/scope-manager/-/scope-manager-5.54.1.tgz",
-      "integrity": "sha512-zWKuGliXxvuxyM71UA/EcPxaviw39dB2504LqAmFDjmkpO8qNLHcmzlh6pbHs1h/7YQ9bnsO8CCcYCSA8sykUg==",
-      "dev": true,
-      "dependencies": {
-        "@typescript-eslint/types": "5.54.1",
-        "@typescript-eslint/visitor-keys": "5.54.1"
-      },
-      "engines": {
-        "node": "^12.22.0 || ^14.17.0 || >=16.0.0"
-      },
-      "funding": {
-        "type": "opencollective",
-        "url": "https://opencollective.com/typescript-eslint"
-      }
-    },
-    "node_modules/@typescript-eslint/type-utils": {
-      "version": "5.54.1",
-      "resolved": "https://registry.npmmirror.com/@typescript-eslint/type-utils/-/type-utils-5.54.1.tgz",
-      "integrity": "sha512-WREHsTz0GqVYLIbzIZYbmUUr95DKEKIXZNH57W3s+4bVnuF1TKe2jH8ZNH8rO1CeMY3U4j4UQeqPNkHMiGem3g==",
-      "dev": true,
-      "dependencies": {
-        "@typescript-eslint/typescript-estree": "5.54.1",
-        "@typescript-eslint/utils": "5.54.1",
-        "debug": "^4.3.4",
-        "tsutils": "^3.21.0"
-      },
-      "engines": {
-        "node": "^12.22.0 || ^14.17.0 || >=16.0.0"
-      },
-      "funding": {
-        "type": "opencollective",
-        "url": "https://opencollective.com/typescript-eslint"
-      },
-      "peerDependencies": {
-        "eslint": "*"
-      },
-      "peerDependenciesMeta": {
-        "typescript": {
-          "optional": true
-        }
-      }
-    },
-    "node_modules/@typescript-eslint/types": {
-      "version": "5.54.1",
-      "resolved": "https://registry.npmmirror.com/@typescript-eslint/types/-/types-5.54.1.tgz",
-      "integrity": "sha512-G9+1vVazrfAfbtmCapJX8jRo2E4MDXxgm/IMOF4oGh3kq7XuK3JRkOg6y2Qu1VsTRmWETyTkWt1wxy7X7/yLkw==",
-      "dev": true,
-      "engines": {
-        "node": "^12.22.0 || ^14.17.0 || >=16.0.0"
-      },
-      "funding": {
-        "type": "opencollective",
-        "url": "https://opencollective.com/typescript-eslint"
-      }
-    },
-    "node_modules/@typescript-eslint/typescript-estree": {
-      "version": "5.54.1",
-      "resolved": "https://registry.npmmirror.com/@typescript-eslint/typescript-estree/-/typescript-estree-5.54.1.tgz",
-      "integrity": "sha512-bjK5t+S6ffHnVwA0qRPTZrxKSaFYocwFIkZx5k7pvWfsB1I57pO/0M0Skatzzw1sCkjJ83AfGTL0oFIFiDX3bg==",
-      "dev": true,
-      "dependencies": {
-        "@typescript-eslint/types": "5.54.1",
-        "@typescript-eslint/visitor-keys": "5.54.1",
-        "debug": "^4.3.4",
-        "globby": "^11.1.0",
-        "is-glob": "^4.0.3",
-        "semver": "^7.3.7",
-        "tsutils": "^3.21.0"
-      },
-      "engines": {
-        "node": "^12.22.0 || ^14.17.0 || >=16.0.0"
-      },
-      "funding": {
-        "type": "opencollective",
-        "url": "https://opencollective.com/typescript-eslint"
-      },
-      "peerDependenciesMeta": {
-        "typescript": {
-          "optional": true
-        }
-      }
-    },
-    "node_modules/@typescript-eslint/typescript-estree/node_modules/semver": {
-      "version": "7.3.8",
-      "resolved": "https://registry.npmmirror.com/semver/-/semver-7.3.8.tgz",
-      "integrity": "sha512-NB1ctGL5rlHrPJtFDVIVzTyQylMLu9N9VICA6HSFJo8MCGVTMW6gfpicwKmmK/dAjTOrqu5l63JJOpDSrAis3A==",
-      "dev": true,
-      "dependencies": {
-        "lru-cache": "^6.0.0"
-      },
-      "bin": {
-        "semver": "bin/semver.js"
-      },
-      "engines": {
-        "node": ">=10"
-      }
-    },
-    "node_modules/@typescript-eslint/utils": {
-      "version": "5.54.1",
-      "resolved": "https://registry.npmmirror.com/@typescript-eslint/utils/-/utils-5.54.1.tgz",
-      "integrity": "sha512-IY5dyQM8XD1zfDe5X8jegX6r2EVU5o/WJnLu/znLPWCBF7KNGC+adacXnt5jEYS9JixDcoccI6CvE4RCjHMzCQ==",
-      "dev": true,
-      "dependencies": {
-        "@types/json-schema": "^7.0.9",
-        "@types/semver": "^7.3.12",
-        "@typescript-eslint/scope-manager": "5.54.1",
-        "@typescript-eslint/types": "5.54.1",
-        "@typescript-eslint/typescript-estree": "5.54.1",
-        "eslint-scope": "^5.1.1",
-        "eslint-utils": "^3.0.0",
-        "semver": "^7.3.7"
-      },
-      "engines": {
-        "node": "^12.22.0 || ^14.17.0 || >=16.0.0"
-      },
-      "funding": {
-        "type": "opencollective",
-        "url": "https://opencollective.com/typescript-eslint"
-      },
-      "peerDependencies": {
-        "eslint": "^6.0.0 || ^7.0.0 || ^8.0.0"
-      }
-    },
-    "node_modules/@typescript-eslint/utils/node_modules/eslint-scope": {
-      "version": "5.1.1",
-      "resolved": "https://registry.npmmirror.com/eslint-scope/-/eslint-scope-5.1.1.tgz",
-      "integrity": "sha512-2NxwbF/hZ0KpepYN0cNbo+FN6XoK7GaHlQhgx/hIZl6Va0bF45RQOOwhLIy8lQDbuCiadSLCBnH2CFYquit5bw==",
-      "dev": true,
-      "dependencies": {
-        "esrecurse": "^4.3.0",
-        "estraverse": "^4.1.1"
-      },
-      "engines": {
-        "node": ">=8.0.0"
-      }
-    },
-    "node_modules/@typescript-eslint/utils/node_modules/estraverse": {
-      "version": "4.3.0",
-      "resolved": "https://registry.npmmirror.com/estraverse/-/estraverse-4.3.0.tgz",
-      "integrity": "sha512-39nnKffWz8xN1BU/2c79n9nB9HDzo0niYUqx6xyqUnyoAnQyyWpOTdZEeiCch8BBu515t4wp9ZmgVfVhn9EBpw==",
-      "dev": true,
-      "engines": {
-        "node": ">=4.0"
-      }
-    },
-    "node_modules/@typescript-eslint/utils/node_modules/semver": {
-      "version": "7.3.8",
-      "resolved": "https://registry.npmmirror.com/semver/-/semver-7.3.8.tgz",
-      "integrity": "sha512-NB1ctGL5rlHrPJtFDVIVzTyQylMLu9N9VICA6HSFJo8MCGVTMW6gfpicwKmmK/dAjTOrqu5l63JJOpDSrAis3A==",
-      "dev": true,
-      "dependencies": {
-        "lru-cache": "^6.0.0"
-      },
-      "bin": {
-        "semver": "bin/semver.js"
-      },
-      "engines": {
-        "node": ">=10"
-      }
-    },
-    "node_modules/@typescript-eslint/visitor-keys": {
-      "version": "5.54.1",
-      "resolved": "https://registry.npmmirror.com/@typescript-eslint/visitor-keys/-/visitor-keys-5.54.1.tgz",
-      "integrity": "sha512-q8iSoHTgwCfgcRJ2l2x+xCbu8nBlRAlsQ33k24Adj8eoVBE0f8dUeI+bAa8F84Mv05UGbAx57g2zrRsYIooqQg==",
-      "dev": true,
-      "dependencies": {
-        "@typescript-eslint/types": "5.54.1",
-        "eslint-visitor-keys": "^3.3.0"
-      },
-      "engines": {
-        "node": "^12.22.0 || ^14.17.0 || >=16.0.0"
-      },
-      "funding": {
-        "type": "opencollective",
-        "url": "https://opencollective.com/typescript-eslint"
-      }
-    },
     "node_modules/@vitejs/plugin-vue": {
       "version": "3.2.0",
       "resolved": "https://registry.npmmirror.com/@vitejs/plugin-vue/-/plugin-vue-3.2.0.tgz",
@@ -9021,12 +8767,6 @@
       "integrity": "sha512-OWND8ei3VtNC9h7V60qff3SVobHr996CTwgxubgyQYEpg290h9J0buyECNNJexkFm5sOajh5G116RYA1c8ZMSw==",
       "dev": true
     },
-    "node_modules/natural-compare-lite": {
-      "version": "1.4.0",
-      "resolved": "https://registry.npmmirror.com/natural-compare-lite/-/natural-compare-lite-1.4.0.tgz",
-      "integrity": "sha512-Tj+HTDSJJKaZnfiuw+iaF9skdPpTo2GtEly5JHnWV/hfv2Qj/9RKsGISQtLh2ox3l5EAGw487hnBee0sIJ6v2g==",
-      "dev": true
-    },
     "node_modules/negotiator": {
       "version": "0.6.3",
       "resolved": "https://registry.npmmirror.com/negotiator/-/negotiator-0.6.3.tgz",
@@ -12705,27 +12445,6 @@
       "resolved": "https://registry.npmmirror.com/tslib/-/tslib-2.3.0.tgz",
       "integrity": "sha512-N82ooyxVNm6h1riLCoyS9e3fuJ3AMG2zIZs2Gd1ATcSFjSA23Q0fzjjZeh0jbJvWVDZ0cJT8yaNNaaXHzueNjg=="
     },
-    "node_modules/tsutils": {
-      "version": "3.21.0",
-      "resolved": "https://registry.npmmirror.com/tsutils/-/tsutils-3.21.0.tgz",
-      "integrity": "sha512-mHKK3iUXL+3UF6xL5k0PEhKRUBKPBCv/+RkEOpjRWxxx27KKRBmmA60A9pgOUvMi8GKhRMPEmjBRPzs2W7O1OA==",
-      "dev": true,
-      "dependencies": {
-        "tslib": "^1.8.1"
-      },
-      "engines": {
-        "node": ">= 6"
-      },
-      "peerDependencies": {
-        "typescript": ">=2.8.0 || >= 3.2.0-dev || >= 3.3.0-dev || >= 3.4.0-dev || >= 3.5.0-dev || >= 3.6.0-dev || >= 3.6.0-beta || >= 3.7.0-dev || >= 3.7.0-beta"
-      }
-    },
-    "node_modules/tsutils/node_modules/tslib": {
-      "version": "1.14.1",
-      "resolved": "https://registry.npmmirror.com/tslib/-/tslib-1.14.1.tgz",
-      "integrity": "sha512-Xni35NKzjgMrwevysHTCArtLDpPvye8zV/0E4EyYn43P7/7qvQwPh9BGkHewbMulVntbigmcT7rdX3BNo9wRJg==",
-      "dev": true
-    },
     "node_modules/type-check": {
       "version": "0.4.0",
       "resolved": "https://registry.npmmirror.com/type-check/-/type-check-0.4.0.tgz",
@@ -13686,6 +13405,17 @@
         "typescript": "*"
       }
     },
+    "node_modules/vuex": {
+      "version": "4.1.0",
+      "resolved": "https://registry.npmjs.org/vuex/-/vuex-4.1.0.tgz",
+      "integrity": "sha512-hmV6UerDrPcgbSy9ORAtNXDr9M4wlNP4pEFKye4ujJF8oqgFFuxDCdOLS3eNoRTtq5O3hoBDh9Doj1bQMYHRbQ==",
+      "dependencies": {
+        "@vue/devtools-api": "^6.0.0-beta.11"
+      },
+      "peerDependencies": {
+        "vue": "^3.2.0"
+      }
+    },
     "node_modules/watchpack": {
       "version": "2.4.0",
       "resolved": "https://registry.npmmirror.com/watchpack/-/watchpack-2.4.0.tgz",

package.json

@@ -11,6 +11,7 @@
     "lint": "eslint . --ext .vue,.js,.jsx,.cjs,.mjs --fix --ignore-path .gitignore"
   },
   "dependencies": {
+    "@element-plus/icons-vue": "^2.3.1",
     "axios": "1.2.1",
     "clipboard": "2.0.11",
     "driver.js": "0.9.8",
@@ -29,11 +30,11 @@
     "sortablejs": "1.15.0",
     "vue": "3.2.45",
     "vue-router": "4.1.6",
+    "vuex": "^4.1.0",
     "xlsx": "0.18.5"
   },
   "devDependencies": {
-    "@typescript-eslint/eslint-plugin": "5.54.1",
+    "@types/sortablejs": "^1.15.8",
-    "@typescript-eslint/parser": "5.54.1",
     "@vitejs/plugin-vue": "3.2.0",
     "@vitejs/plugin-vue-jsx": "2.1.1",
     "@vue/cli-plugin-typescript": "5.0.8",

src/api/article.js

@@ -1,41 +0,0 @@
-import request from '@/utils/request';
-
-export function fetchList(query) {
-  return request({
-    url: '/vue-element-admin/article/list',
-    method: 'get',
-    params: query
-  });
-}
-
-export function fetchArticle(id) {
-  return request({
-    url: '/vue-element-admin/article/detail',
-    method: 'get',
-    params: { id }
-  });
-}
-
-export function fetchPv(pv) {
-  return request({
-    url: '/vue-element-admin/article/pv',
-    method: 'get',
-    params: { pv }
-  });
-}
-
-export function createArticle(data) {
-  return request({
-    url: '/vue-element-admin/article/create',
-    method: 'post',
-    data
-  });
-}
-
-export function updateArticle(data) {
-  return request({
-    url: '/vue-element-admin/article/update',
-    method: 'post',
-    data
-  });
-}

src/api/project.js

@@ -0,0 +1,144 @@
+import request from '@/utils/request';
+function getCurrentTimestamp() {
+  return new Date().getTime();
+}
+
+//我负责的页面获取项目
+export function GetProject(page, pageSize, token) {
+  return request({
+    url: '/project/my/get',
+    method: 'get',
+    params: { page, pageSize },
+    headers: {
+      'Authorization':'Bearer '+ token,
+      'content-type': 'application/json;charset=utf-8',
+      'Timestamp': getCurrentTimestamp()
+    }
+  });
+}
+
+//新增项目
+export function AddProject(data, token) {
+  return request({
+    url: '/project/add',
+    method: 'post',
+    data,
+    headers: {
+      'Authorization':'Bearer '+ token,
+      'content-type': 'application/json;charset=utf-8',
+      'Timestamp': getCurrentTimestamp()
+    }
+  });
+}
+
+//删除项目
+export function DeleteProject(id, token) {
+  return request({
+    url: '/project/delete',
+    method: 'delete',
+    params:{ id },
+    headers: {
+      'Authorization':'Bearer '+ token,
+      'content-type': 'application/json;charset=utf-8',
+      'Timestamp': getCurrentTimestamp()
+    }
+  });
+}
+
+//编辑项目
+export function EditProject(projectId, data, token) {
+  return request({
+    url: '/project/edit/' + projectId,
+    method: 'put',
+    data,
+    headers: {
+      'Authorization': 'Bearer ' + token,
+      'content-type': 'application/json;charset=utf-8',
+      'Timestamp': getCurrentTimestamp()
+    }
+  });
+}
+
+//根据项目名字模糊查询
+export function GetProjectByName(name, token) {
+  return request({
+    url: '/project/get/name',
+    method: 'get',
+    params: { name },
+    headers: {
+      'Authorization':'Bearer '+ token,
+      'content-type': 'application/json;charset=utf-8',
+      'Timestamp': getCurrentTimestamp()
+    }
+  });
+}
+
+//根据项目id查询子系统
+export function GetChildSysById(projectId, token) {
+  return request({
+    url: "/module/get?projectId=" + projectId ,
+    method: 'get',
+    params: { projectId },
+    headers: {
+      'Authorization':'Bearer '+ token,
+      'content-type': 'application/json;charset=utf-8',
+      'Timestamp': getCurrentTimestamp()
+    }
+  });
+}
+
+//根据项目名和子系统名查询子模块
+export function  GetChildSysByName(projectName, childName, token) {
+  return request({
+    url: '/project/module/get/name',
+    method: 'get',
+    params: { projectName, childName },
+    headers: {
+      'Authorization':'Bearer '+ token,
+      'content-type': 'application/json;charset=utf-8',
+      'Timestamp': getCurrentTimestamp()
+    }
+  });
+}
+
+//新增子系统
+export function AddChildSystem(data, token) {
+  return request({
+    url: '/project/child/add',
+    method: 'post',
+    data,
+    headers: {
+      'Authorization':'Bearer '+ token,
+      'content-type': 'application/json;charset=utf-8',
+      'Timestamp': getCurrentTimestamp()
+    }
+  });
+}
+
+//新增子模块
+export function AddChildModule(data, token) {
+  return request({
+    url: '/project/module/add',
+    method: 'post',
+    data,
+    headers: {
+      'Authorization':'Bearer '+ token,
+      'content-type': 'application/json;charset=utf-8',
+      'Timestamp': getCurrentTimestamp()
+    }
+  });
+}
+
+//删除子模块
+export function DeleteChildModule(id, token) {
+  return request({
+    url: '/project/module/delete',
+    method: 'delete',
+    params:{ id },
+    headers: {
+      'Authorization':'Bearer '+ token,
+      'content-type': 'application/json;charset=utf-8',
+      'Timestamp': getCurrentTimestamp()
+    }
+  });
+}

src/layout/components/Sidebar/index.vue

@@ -35,7 +35,7 @@ export default defineComponent({
     };
   },
   computed: {
-    ...mapState(store.app, ['sidebar']),
+    ...mapState(store.app, ['Sidebar']),
     ...mapState(store.permission, {
       permission_routes: 'routes'
     }),

src/router/index.ts

@@ -167,13 +167,18 @@ export const asyncRoutes:RouteRecordRaw[] = [
       roles: ['admin', 'teacher_user']
     },
     children: [
+      {
+        path: 'charge',
+        component: () => import('@/views/personal/project/charge.vue'),
+        name: 'charge',
+        meta: { title: '我负责的', icon: 'user', affix: true }
+      },
       {
         path: 'participate',
         component: () => import('@/views/personal/project/participate.vue'),
         name: 'participate',
-        meta: { title: '我负责的', icon: 'user', affix: true }
+        meta: { title: '我参与的', icon: 'user', affix: true }
       },
-      //我管理的以及子页面
       {
         path: 'manage',
         component: () => import('@/views/personal/project/manage.vue'),
@@ -181,6 +186,20 @@ export const asyncRoutes:RouteRecordRaw[] = [
         meta: { title: '我管理的', icon: 'user', affix: true,  },
 
       },
+      //我负责的子系统和子模块
+      {
+        path: 'childSysCharge',
+        component: () => import('@/views/personal/project/childSystem/charge.vue'),
+        name: 'ChildSysCharge',
+        meta: { title: '子系统', breadcrumb: true ,  hidden: true  },
+      },
+      {
+        path: 'childModCharge',
+        component: () => import('@/views/personal/project/childmodel/charge.vue'),
+        name: 'ChildModCharge',
+        meta: { title: '子模块', breadcrumb: true ,  hidden: true  }
+      },
+      //我管理的子系统和子模块
       {
         path: 'childSysManage',
         component: () => import('@/views/personal/project/childSystem/manage.vue'),
@@ -190,30 +209,10 @@ export const asyncRoutes:RouteRecordRaw[] = [
       },
       {
         path: 'childModManage',
-        component: () => import('@/views/personal/project/childModel/manage.vue'),
+        component: () => import('@/views/personal/project/childmodel/manage.vue'),
         name: 'ChildModManage',
         meta: { title: '子模块', breadcrumb: true , hidden: true  }
       },
-      //我参与的以及子界面
-      {
-        path: 'charge',
-        component: () => import('@/views/personal/project/charge.vue'),
-        name: 'Charge',
-        meta: { title: '我参与的', icon: 'user', affix: true }
-      },
-      {
-        path: 'childSysCharge',
-        component: () => import('@/views/personal/project/childSystem/manage.vue'),
-        name: 'ChildSysCharge',
-        meta: { title: '子系统', breadcrumb: true , hidden: true  },  
-       
-      },
-      {
-        path: 'childModCharge',
-        component: () => import('@/views/personal/project/childModel/manage.vue'),
-        name: 'ChildModCharge',
-        meta: { title: '子模块', breadcrumb: true , hidden: true  }  
-      },
     ]
   }
   ,

src/router/modules/table.ts

@@ -9,7 +9,7 @@ const tableRouter = {
   redirect: '/table/complex-table',
   name: 'Table',
   meta: {
-    title: 'Table',
+    title: '个人项目',
     icon: 'table'
   },
   children: [
@@ -17,25 +17,25 @@ const tableRouter = {
       path: 'dynamic-table',
       component: () => import('@/views/table/dynamic-table/index.vue'),
       name: 'DynamicTable',
-      meta: { title: 'Dynamic Table' }
+      meta: { title: '我参与的' }
     },
     {
       path: 'drag-table',
       component: () => import('@/views/table/drag-table.vue'),
       name: 'DragTable',
-      meta: { title: 'Drag Table' }
+      meta: { title: '我管理的' }
-    },
-    {
-      path: 'inline-edit-table',
-      component: () => import('@/views/table/inline-edit-table.vue'),
-      name: 'InlineEditTable',
-      meta: { title: 'Inline Edit' }
     },
+    // {
+    //   path: 'inline-edit-table',
+    //   component: () => import('@/views/table/inline-edit-table.vue'),
+    //   name: 'InlineEditTable',
+    //   meta: { title: 'Inline Edit' }
+    // },
     {
       path: 'complex-table',
       component: () => import('@/views/table/complex-table.vue'),
       name: 'ComplexTable',
-      meta: { title: 'Complex Table' }
+      meta: { title: '我负责的' }
     }
   ]
 };

src/utils/request.js

@@ -13,16 +13,16 @@ const service = axios.create({
   timeout: 10000 // request timeout
 });
 
-// request interceptor
+
 service.interceptors.request.use(
   config => {
     // do something before request is sent
-
+    console.log('wwww')
     if (store.user().token) {
       // let each request carry token
       // ['X-Token'] is a custom headers key
       // please modify it according to the actual situation
-      config.headers['token'] = getToken();
+      config.headers['Token'] = getToken();
     }
     return config;
   },
@@ -33,6 +33,8 @@ service.interceptors.request.use(
   }
 );
 
+
+
 // response interceptor
 service.interceptors.response.use(
   /**
@@ -96,4 +98,6 @@ service.interceptors.response.use(
   }
 );
 
+
+// response interceptor
 export default service ;

src/utils/validate.ts

@@ -15,7 +15,7 @@ export function isExternal(path) {
  * @returns {Boolean}
  */
 export function validUsername(str) {
-  const valid_map = ['admin', 'editor', 'teacher_user', 'teacher_demo', 'demo', 'xiao_lfeng', 'yangna'];
+  const valid_map = ['console_user', 'developer_user', 'principal_user'];
   return valid_map.indexOf(str.trim()) >= 0;
 }
 

src/views/example/components/ArticleDetail.vue

@@ -82,7 +82,7 @@ import Upload from '@/components/Upload/SingleImage3';
 import MDinput from '@/components/MDinput';
 import Sticky from '@/components/Sticky'; // 粘性header组件
 import { validURL } from '@/utils/validate';
-import { fetchArticle } from '@/api/article';
+import { fetchArticle } from '@/api/project';
 import { searchUser } from '@/api/remote-search';
 import Warning from './Warning';
 import { CommentDropdown, PlatformDropdown, SourceUrlDropdown } from './Dropdown';

src/views/example/list.vue

@@ -59,7 +59,7 @@
 <script>
 import { defineComponent } from 'vue';
 import { parseTime } from '@/utils';
-import { fetchList } from '@/api/article';
+import { fetchList } from '@/api/project';
 import Pagination from '@/components/Pagination'; // Secondary package based on el-pagination
 
 export default defineComponent({

src/views/excel/export-excel.vue

@@ -46,7 +46,7 @@
 
 <script>
 import { defineComponent, markRaw } from 'vue';
-import { fetchList } from '@/api/article';
+import { fetchList } from '@/api/project';
 import { parseTime } from '@/utils';
 // options components
 import FilenameOption from './components/FilenameOption';

src/views/excel/merge-header.vue

@@ -47,7 +47,7 @@
 
 <script>
 import { defineComponent, markRaw } from 'vue';
-import { fetchList } from '@/api/article';
+import { fetchList } from '@/api/project';
 import { parseTime } from '@/utils';
 import { Document as IconDocument, Timer as IconTimer } from '@element-plus/icons-vue';
 

src/views/excel/select-excel.vue

@@ -52,7 +52,7 @@
 
 <script>
 import { defineComponent, markRaw } from 'vue';
-import { fetchList } from '@/api/article';
+import { fetchList } from '@/api/project';
 import { Document as IconDocument, Timer as IconTimer } from '@element-plus/icons-vue';
 
 export default defineComponent({

src/views/login/index.vue

@@ -113,8 +113,8 @@ export default defineComponent({
     };
     return {
       loginForm: {
-        username: 'teacher_user',
+        username: 'principal_user',
-        password: '123456'
+        password: 'jsl_nbxt'
       },
       loginRules: {
         username: [{ required: true, trigger: 'blur', validator: validateUsername }],

src/views/personal/project/childSystem/charge.vue

@@ -1,136 +1,435 @@
 <template>
-    <div style=" width:100%">
   <el-card style="max-width: 100vw;margin: 1.5vw;">
-          <template #header><strong >项目1</strong></template>
+    <template #header>
-            <div style="display:flex;flex-direction:row;justify-content: space-around ">
+      <div class="card-header">
-                <div>
+        <span>项目{{projectId}}</span>
-                    名称
-                    <el-input v-model="input" style="width: 240px;margin-left:0.5vw" placeholder="请输入" />
       </div>
-                <div>
+    </template>
-                    状态
+    <div style="display: flex; gap: 100px">
-                    <el-input v-model="input" style="width: 240px;margin-left:0.5vw" placeholder="请输入" />
+      <el-input
-                </div>
+          style="width: 550px"
-                <div>
+          placeholder="请输入"
-                  <el-button type="primary" style="width:80px">查询</el-button>
-                      <el-button style="width:80px">重置</el-button>
-                </div>
-            </div>
-        </el-card>
-        <el-card style="max-width: 100vw;height:60vh;margin:1.3vw">
-            <div style="display:flex;flex-direction: row;justify-content: space-between">
-                <el-button
-                        text
-                        type=''
-                >子系统列表</el-button
-                >
-            </div>
-            <el-table
-                    ref="multipleTableRef"
-                    :data="tableData"
-                    style="max-width: 100vw;"
-                    @selection-change="handleSelectionChange"
-            >
-  <!--                <el-table-column type="selection" width="55" />-->
-                <el-table-column label="序号" width="120">
-                    <template #default="scope">{{ scope.row.date }}</template>
-                </el-table-column>
-                <el-table-column property="name" label="子系统名称" width="120" />
-                <el-table-column property="address" label="工作量" show-overflow-tooltip />
-                <el-table-column property="address" label="周期"  />
-                <el-table-column property="address" label="负责人"  />
-                <el-table-column property="address" label="状态"  />
-                <el-table-column property="address" label="子系统简介"  />
-                <el-table-column property="address" label="截止时间"  />
-                <el-table-column property="address" label="操作"  >
-                    <el-button
-                            link
-                            style="color:deepskyblue"
-                            @click="toChildModel"
-                    >查看详情</el-button
-                    >
-                </el-table-column>
-            </el-table>
-            <el-pagination
-                    larger
-                    background
-                    layout="prev, pager, next"
-                    :total="50"
-                    class="mt-4"
-                    style="display: flex;flex-direction: row;justify-content: center;margin-top:5vh"
-            />
-        </el-card>
 
+      >
+        <template #prepend>名称</template>
+      </el-input>
+      <el-input
+          style="width: 550px"
+          placeholder="请输入"
+      >
+        <template #prepend>状态</template>
+      </el-input>
+      <div>
+        <el-button-group>
+          <el-button type="primary" >
+            <el-icon><Search /></el-icon>
+            查询
+          </el-button>
+          <el-button>
+            <el-icon><RefreshRight /></el-icon>
+            重置
+          </el-button>
+        </el-button-group>
+      </div>
+    </div>
+    <template #footer>Footer content</template>
+  </el-card>
+  <el-card  style="max-width: 100vw;margin: 1.5vw;">
+    <template #header>
+      <div class="card-header" style="display: flex; justify-content: space-between; align-items: center;">
+        <span>子系统列表</span>
+        <div style="display: flex;">
+          <el-button type="primary" @click="toggleAddDialog()">
+            <el-icon><Plus /></el-icon>
+            新增
+          </el-button>
+          <el-button type="danger">
+            <el-icon><DeleteFilled /></el-icon>
+            删除
+          </el-button>
+        </div>
       </div>
     </template>
 
-  <script lang="ts" setup>
-  import { ref } from 'vue';
-  import { ElTable } from 'element-plus';
-  import { useRouter } from 'vue-router';
 
-  //跳转到子模块
+    <!--表格内容-->
-  const router = useRouter();
+    <el-table :data="tableData" ref="multipleTableRef" style="width: 100%">
+      <el-table-column type="selection" width="55" />
+      <el-table-column prop="id" label="序号">
+        <template v-slot="{row}">
+          <span>{{ row.id }}</span>
+        </template>
+      </el-table-column>
+      <el-table-column prop="name"  label="子系统名称">
+        <template v-slot="{row}">
+          <span>{{ row.name }}</span>
+        </template>
+      </el-table-column>
+      <el-table-column prop="workLoad" label="工作量">
+        <template v-slot="{row}">
+          <span>{{ row.workLoad}}</span>
+        </template>
+      </el-table-column>
+      <el-table-column prop="cycle" label="周期">
+        <template v-slot="{row}">
+          <span>{{ row.cycle }}</span>
+        </template>
+      </el-table-column>
+      <el-table-column prop="principalUser" label="负责人">
+        <template v-slot="{row}">
+          <span>{{ row.principalUser }}</span>
+        </template>
+      </el-table-column>
+      <el-table-column label="状态" width="180">
+        <template #default="scope">
+          <el-popover effect="light" width="auto">
+            <template #reference>
+              <el-tag >
+                {{ scope.row.status }}
+              </el-tag>
+            </template>
+          </el-popover>
+        </template>
+      </el-table-column>
+      <el-table-column prop="description" label="子系统简介">
+        <template v-slot="{row}">
+          <span>{{ row.description }}</span>
+        </template>
+      </el-table-column>
+      <el-table-column prop="deadLine" label="截止时间">
+        <template v-slot="{row}">
+          <span>{{ row.deadLine }}</span>
+        </template>
+      </el-table-column>
+      <el-table-column fixed="right" label="操作" width="120">
+        <template #default="{ row }">
+          <div style="display: flex; justify-content: flex-start; margin-bottom: 4px;">
+            <el-button link type="primary" size="small" >编辑</el-button>
+            <el-button link type="primary" size="small" @click="toggleDeleteDialog(row)">删除</el-button>
+          </div>
+          <div style="margin-bottom: 4px">
+            <el-button link type="primary" size="small">指定项目负责人</el-button>
+          </div>
+          <div style="margin-bottom: 4px">
+            <el-button link type="primary" size="small">查看详情</el-button>
+          </div>
+        </template>
+      </el-table-column>
 
-  const toChildModel = () => {
+    </el-table>
-    router.push({name:'ChildModCharge'})
+    <div style="display: flex; justify-content: center;margin-top: 2vh">
-  };
+      <el-pagination
+          background
+          layout="prev, pager, next"
+      />
+    </div>
+  </el-card>
 
-  const input = ref('');
 
-  interface User {
+  <!--新增子系统对话框-->
-      date: string
+  <el-dialog v-model="AddDialogVisible" title="新增子系统" width="500">
-      name: string
+    <el-form label-width="auto" style="max-width: 600px">
-      address: string
+      <el-form-item
+          label="子系统名称"
+          :rules="{
+            required: true,
+            message: 'domain can not be null',
+            trigger: 'blur',
+          }"
+      >
+        <el-input v-model="AddFormData.name"/>
+      </el-form-item>
+      <el-row>
+        <el-col :span="15">
+          <el-form-item
+              label="截止时间"
+              :rules="{
+              required: true,
+              message: 'domain can not be null',
+              trigger: 'blur',
+        }"
+          >
+            <div class="block">
+              <el-date-picker
+                  type="date"
+                  placeholder="选择"
+                  v-model="AddFormData.deadLine"
+              />
+            </div>
+          </el-form-item>
+        </el-col>
+        <el-col :span="9">
+          <el-form-item
+              label="状态"
+              :rules="{
+                required: true,
+                trigger: 'blur',
+        }"
+          >
+            <el-select v-model="AddFormData.status">
+              <el-option value="未开始">未开始</el-option>
+              <el-option value="进行中">进行中</el-option>
+              <el-option value="已完成">已完成</el-option>
+              <el-option value="已暂停">已暂停</el-option>
+            </el-select>
+          </el-form-item>
+        </el-col>
+      </el-row>
+      <el-row>
+        <el-col :span="12">
+          <el-form-item
+              label="负责人id"
+              :rules="{
+          message: 'domain can not be null',
+          trigger: 'blur',
+        }"
+          >
+            <el-input v-model="AddFormData.principalId"/>
+          </el-form-item>
+        </el-col>
+        <el-col :span="12">
+         <el-form-item
+              label="系统id"
+              :rules="{
+              required: true,
+              message: 'domain can not be null',
+              trigger: 'blur',
+        }"
+          >
+            <el-input  v-model="AddFormData.projectId"/>
+          </el-form-item>
+        </el-col>
+      </el-row>
+      <el-row>
+        <el-col :span="12">
+          <el-form-item
+              label="工作量"
+              :rules="{
+              required: true,
+              message: 'domain can not be null',
+              trigger: 'blur',
+        }"
+          >
+            <el-input  v-model="AddFormData.workLoad"/>
+          </el-form-item>
+        </el-col>
+        <el-col :span="12">
+          <el-form-item
+              label="周期"
+              :rules="{
+              required: true,
+              message: 'domain can not be null',
+              trigger: 'blur',
+        }"
+          >
+            <el-input  v-model="AddFormData.cycle"/>
+          </el-form-item>
+        </el-col>
+      </el-row>
+      <el-form-item
+          label="描述"
+          :rules="{
+          trigger: 'blur',
+        }"
+      >
+        <el-input type="textarea" v-model="AddFormData.description"/>
+      </el-form-item>
+    </el-form>
+    <template #footer>
+      <div class="dialog-footer">
+        <el-button @click="CancelAdd()">取消</el-button>
+        <el-button type="primary" @click="addChildSystem() ">
+          确认
+        </el-button>
+      </div>
+    </template>
+  </el-dialog>
+
+
+  <!--删除项目对话框-->
+  <el-dialog
+      title="删除子系统"
+      width="450"
+      align-center
+      v-model="DeleteDialogVisible"
+  >
+    <span>确认删除该子系统吗?</span>
+    <template #footer>
+      <div class="dialog-footer">
+        <el-button type="danger" >删除</el-button>
+        <el-button @click="CancelDelete()">取消</el-button>
+      </div>
+    </template>
+  </el-dialog>
+
+
+  <!--编辑项目对话框-->
+  <el-dialog title="编辑子系统" width="500">
+    <el-form label-width="auto" style="max-width: 600px">
+      <el-form-item
+          label="子系统名称"
+          :rules="{
+            required: true,
+            message: 'domain can not be null',
+            trigger: 'blur',
+          }"
+      >
+        <el-input />
+      </el-form-item>
+      <el-form-item
+          label="截止时间"
+          :rules="{
+          required: true,
+          message: 'domain can not be null',
+          trigger: 'blur',
+        }"
+      >
+        <el-input/>
+      </el-form-item>
+      <el-form-item
+          label="描述"
+          :rules="{
+          message: 'domain can not be null',
+          trigger: 'blur',
+        }"
+      >
+        <el-input />
+      </el-form-item>
+      <el-row>
+        <el-col :span="12">
+          <el-form-item
+              label="项目负责人id"
+              :rules="{
+          required: true,
+          message: 'domain can not be null',
+          trigger: 'blur',
+        }"
+          >
+            <el-input />
+          </el-form-item>
+        </el-col>
+        <el-col :span="12">
+          <el-form-item
+              label="系统id"
+              :rules="{
+          message: 'domain can not be null',
+          trigger: 'blur',
+        }"
+          >
+            <el-input />
+          </el-form-item>
+        </el-col>
+      </el-row>
+      <el-form-item
+          label="周期"
+          :rules="{
+          trigger: 'blur',
+        }"
+      >
+        <el-input />
+      </el-form-item>
+      <el-form-item
+          label="工作量"
+          :rules="{
+          trigger: 'blur',
+        }"
+      >
+        <el-input />
+      </el-form-item>
+      <el-form-item>
+        <el-row>
+          <el-col :span="20">
+            <el-form-item
+                label="状态"
+                :rules="{
+                required: true,
+                message: 'Please select a status',
+                trigger: 'blur',
+        }"
+            >
+              <el-select >
+                <el-option value="0">未开始</el-option>
+                <el-option value="2">进行中</el-option>
+                <el-option value="1">已完成</el-option>
+                <el-option value="-1">暂停</el-option>
+              </el-select>
+            </el-form-item>
+          </el-col>
+        </el-row>
+      </el-form-item>
+    </el-form>
+    <template #footer>
+      <div class="dialog-footer">
+        <el-button >取消</el-button>
+        <el-button type="primary" >
+          确认
+        </el-button>
+      </div>
+    </template>
+  </el-dialog>
+</template>
+<script setup>
+import { ref, onMounted, reactive } from 'vue';
+import { useRoute } from 'vue-router';
+import { AddChildSystem, GetChildSysById } from '@/api/project';
+import { getToken } from '@/utils/auth';
+import { DeleteFilled, Plus, RefreshRight, Search, UploadFilled } from '@element-plus/icons-vue'; // 确保导入你的 API 函数
+
+const listLoading = ref(false);
+const AddDialogVisible = ref(false);
+const DeleteDialogVisible = ref(false);
+const route = useRoute();
+const projectId =route.query.id
+console.log("projectId", projectId);
+const tableData = ref([]);
+const token = getToken();
+const AddFormData = reactive({
+  deadLine:'',
+  name: '',
+  status: '',
+  description: '',
+  principalId: '',
+  projectId:'',
+  cycle: '',
+  workLoad: '',
+});
+
+//新增子系统
+async function addChildSystem() {
+  console.log("add token:", token);
+  try {
+    const res = await AddChildSystem(AddFormData, token);
+    if (res.data) {
+      listLoading.value = true;
+      ElMessage({
+        message: '新增成功',
+        type: 'success',
+      })
+    } else {
+      console.error("未获取到预期数据，响应内容:", res);
+    }
+  } finally {
+    listLoading.value = false;
+    AddDialogVisible.value = false;
+  }
 }
 
-  const multipleTableRef = ref<InstanceType<typeof ElTable>>();
-  const multipleSelection = ref<User[]>([]);
 
-  const handleSelectionChange = (val: User[]) => {
+function toggleAddDialog() {
-    multipleSelection.value = val;
+  AddDialogVisible.value = !AddDialogVisible.value;
-  };
-  
-  const tableData: User[] = [
-    {
-      date: '2016-05-03',
-      name: 'Tom',
-      address: 'No. 189, Grove St, Los Angeles'
-    },
-    {
-      date: '2016-05-02',
-      name: 'Tom',
-      address: 'No. 189, Grove St, Los Angeles'
-    },
-    {
-      date: '2016-05-04',
-      name: 'Tom',
-      address: 'No. 189, Grove St, Los Angeles'
-    },
-    {
-      date: '2016-05-01',
-      name: 'Tom',
-      address: 'No. 189, Grove St, Los Angeles'
 }
 
-  ];
+function CancelAdd() {
+  AddDialogVisible.value = false;
+}
 
+function toggleDeleteDialog(row) {
+  console.log("Delete row:", row);  // 打印行数据，用于调试
+  DeleteDialogVisible.value = !DeleteDialogVisible.value;
+}
 
+function CancelDelete() {
+  DeleteDialogVisible.value = false;
+}
 </script>
-  <style>
+
-  .my-autocomplete li {
-      line-height: normal;
-      padding: 7px;
-  }
-  .my-autocomplete li .name {
-      text-overflow: ellipsis;
-      overflow: hidden;
-  }
-  .my-autocomplete li .addr {
-      font-size: 12px;
-      color: #b4b4b4;
-  }
-  .my-autocomplete li .highlighted .addr {
-      color: #ddd;
-  }
-  </style>

src/views/personal/project/childmodel/charge.vue

@@ -0,0 +1,440 @@
+<template>
+  <el-card style="max-width: 100vw;margin: 1.5vw;">
+    <template #header>
+      <div class="card-header">
+        <span>子系统1</span>
+      </div>
+    </template>
+    <div style="display: flex; gap: 100px">
+      <el-input
+          style="width: 550px"
+          placeholder="请输入"
+
+      >
+        <template #prepend>名称</template>
+      </el-input>
+      <el-input
+          style="width: 550px"
+          placeholder="请输入"
+      >
+        <template #prepend>状态</template>
+      </el-input>
+      <div>
+        <el-button-group>
+          <el-button type="primary" >
+            <el-icon><Search /></el-icon>
+            查询
+          </el-button>
+          <el-button>
+            <el-icon><RefreshRight /></el-icon>
+            重置
+          </el-button>
+        </el-button-group>
+      </div>
+    </div>
+    <template #footer>Footer content</template>
+  </el-card>
+  <el-card  style="max-width: 100vw;margin: 1.5vw;">
+    <template #header>
+      <div class="card-header" style="display: flex; justify-content: space-between; align-items: center;">
+        <span>子模块列表</span>
+        <div style="display: flex;">
+          <el-button type="primary" @click="toggleAddDialog()">
+            <el-icon><Plus /></el-icon>
+            新增
+          </el-button>
+          <el-button type="danger">
+            <el-icon><DeleteFilled /></el-icon>
+            删除
+          </el-button>
+        </div>
+      </div>
+    </template>
+
+
+    <!--表格内容-->
+    <el-table :data="tableData" ref="multipleTableRef" style="width: 100%">
+      <el-table-column type="selection" width="55" />
+      <el-table-column prop="id" label="序号">
+        <template v-slot="{row}">
+          <span>{{ row.id }}</span>
+        </template>
+      </el-table-column>
+      <el-table-column prop="name"  label="子模块名称">
+        <template v-slot="{row}">
+          <span>{{ row.name }}</span>
+        </template>
+      </el-table-column>
+      <el-table-column prop="workLoad" label="工作量">
+        <template v-slot="{row}">
+          <span>{{ row.workLoad}}</span>
+        </template>
+      </el-table-column>
+      <el-table-column prop="cycle" label="周期">
+        <template v-slot="{row}">
+          <span>{{ row.cycle }}</span>
+        </template>
+      </el-table-column>
+      <el-table-column prop="principalUser" label="负责人">
+        <template v-slot="{row}">
+          <span>{{ row.principalUser }}</span>
+        </template>
+      </el-table-column>
+      <el-table-column label="状态" width="180">
+        <template #default="scope">
+          <el-popover effect="light" width="auto">
+            <template #reference>
+              <el-tag >
+                {{ scope.row.status }}
+              </el-tag>
+            </template>
+          </el-popover>
+        </template>
+      </el-table-column>
+      <el-table-column prop="description" label="子模块简介">
+        <template v-slot="{row}">
+          <span>{{ row.description }}</span>
+        </template>
+      </el-table-column>
+      <el-table-column prop="deadLine" label="截止时间">
+        <template v-slot="{row}">
+          <span>{{ row.deadLine }}</span>
+        </template>
+      </el-table-column>
+      <el-table-column fixed="right" label="操作" width="120">
+        <template #default="{ row }">
+          <div style="display: flex; justify-content: flex-start; margin-bottom: 4px;">
+            <el-button link type="primary" size="small" >编辑</el-button>
+            <el-button link type="primary" size="small" @click="toggleDeleteDialog(row)">删除</el-button>
+          </div>
+          <div style="margin-bottom: 4px">
+            <el-button link type="primary" size="small">指定项目负责人</el-button>
+          </div>
+          <div style="margin-bottom: 4px">
+            <el-button link type="primary" size="small">查看详情</el-button>
+          </div>
+        </template>
+      </el-table-column>
+
+    </el-table>
+    <div style="display: flex; justify-content: center;margin-top: 2vh">
+      <el-pagination
+          background
+          layout="prev, pager, next"
+      />
+    </div>
+  </el-card>
+
+
+  <!--新增子模块对话框-->
+  <el-dialog v-model="AddDialogVisible" title="新增子模块" width="500">
+    <el-form label-width="auto" style="max-width: 600px">
+      <el-form-item
+          label="子模块名称"
+          :rules="{
+            required: true,
+            message: 'domain can not be null',
+            trigger: 'blur',
+          }"
+      >
+        <el-input v-model="AddFormData.name"/>
+      </el-form-item>
+      <el-row>
+        <el-col :span="15">
+          <el-form-item
+              label="截止时间"
+              :rules="{
+              required: true,
+              message: 'domain can not be null',
+              trigger: 'blur',
+        }"
+          >
+            <div class="block">
+              <el-date-picker
+                  type="date"
+                  placeholder="选择"
+                  v-model="AddFormData.deadLine"
+              />
+            </div>
+          </el-form-item>
+        </el-col>
+        <el-col :span="9">
+          <el-form-item
+              label="状态"
+              :rules="{
+                required: true,
+                trigger: 'blur',
+        }"
+          >
+            <el-select v-model="AddFormData.status">
+              <el-option value="未开始">未开始</el-option>
+              <el-option value="进行中">进行中</el-option>
+              <el-option value="已完成">已完成</el-option>
+              <el-option value="已暂停">已暂停</el-option>
+            </el-select>
+          </el-form-item>
+        </el-col>
+      </el-row>
+      <el-row>
+        <el-col :span="12">
+          <el-form-item
+              label="模块负责人"
+              :rules="{
+          message: 'domain can not be null',
+          trigger: 'blur',
+        }"
+          >
+            <el-input v-model="AddFormData.principalId"/>
+          </el-form-item>
+        </el-col>
+        <el-col :span="12">
+          <el-form-item
+              label="子系统id"
+              :rules="{
+              required: true,
+              message: 'domain can not be null',
+              trigger: 'blur',
+        }"
+          >
+            <el-input  v-model="AddFormData.projectChildId"/>
+          </el-form-item>
+        </el-col>
+      </el-row>
+      <el-form-item
+          label="工作量"
+          :rules="{
+          required: true,
+          message: 'domain can not be null',
+          trigger: 'blur',
+    }"
+      >
+        <el-input  v-model="AddFormData.workLoad"/>
+      </el-form-item>
+      <el-form-item
+          label="描述"
+          :rules="{
+          trigger: 'blur',
+        }"
+      >
+        <el-input type="textarea" v-model="AddFormData.description"/>
+      </el-form-item>
+    </el-form>
+    <template #footer>
+      <div class="dialog-footer">
+        <el-button @click="CancelAdd()">取消</el-button>
+        <el-button type="primary" @click="addChildModule()">
+          确认
+        </el-button>
+      </div>
+    </template>
+  </el-dialog>
+
+
+  <!--删除子模块对话框-->
+  <el-dialog
+      title="删除子模块"
+      width="450"
+      align-center
+      v-model="DeleteDialogVisible"
+  >
+    <span>确认删除该子模块吗?</span>
+    <template #footer>
+      <div class="dialog-footer">
+        <el-button type="danger" @click="deleteChildModule()">删除</el-button>
+        <el-button @click="CancelDelete()">取消</el-button>
+      </div>
+    </template>
+  </el-dialog>
+
+
+  <!--编辑子模块对话框-->
+  <el-dialog title="编辑子模块" width="500">
+    <el-form label-width="auto" style="max-width: 600px">
+      <el-form-item
+          label="子模块名称"
+          :rules="{
+            required: true,
+            message: 'domain can not be null',
+            trigger: 'blur',
+          }"
+      >
+        <el-input />
+      </el-form-item>
+      <el-form-item
+          label="截止时间"
+          :rules="{
+          required: true,
+          message: 'domain can not be null',
+          trigger: 'blur',
+        }"
+      >
+        <el-input/>
+      </el-form-item>
+      <el-form-item
+          label="描述"
+          :rules="{
+          message: 'domain can not be null',
+          trigger: 'blur',
+        }"
+      >
+        <el-input />
+      </el-form-item>
+      <el-row>
+        <el-col :span="12">
+          <el-form-item
+              label="项目负责人id"
+              :rules="{
+          required: true,
+          message: 'domain can not be null',
+          trigger: 'blur',
+        }"
+          >
+            <el-input />
+          </el-form-item>
+        </el-col>
+        <el-col :span="12">
+          <el-form-item
+              label="系统id"
+              :rules="{
+          message: 'domain can not be null',
+          trigger: 'blur',
+        }"
+          >
+            <el-input />
+          </el-form-item>
+        </el-col>
+      </el-row>
+      <el-form-item
+          label="周期"
+          :rules="{
+          trigger: 'blur',
+        }"
+      >
+        <el-input />
+      </el-form-item>
+      <el-form-item
+          label="工作量"
+          :rules="{
+          trigger: 'blur',
+        }"
+      >
+        <el-input />
+      </el-form-item>
+      <el-form-item>
+        <el-row>
+          <el-col :span="20">
+            <el-form-item
+                label="状态"
+                :rules="{
+                required: true,
+                message: 'Please select a status',
+                trigger: 'blur',
+        }"
+            >
+              <el-select >
+                <el-option value="0">未开始</el-option>
+                <el-option value="2">进行中</el-option>
+                <el-option value="1">已完成</el-option>
+                <el-option value="-1">暂停</el-option>
+              </el-select>
+            </el-form-item>
+          </el-col>
+        </el-row>
+      </el-form-item>
+    </el-form>
+    <template #footer>
+      <div class="dialog-footer">
+        <el-button >取消</el-button>
+        <el-button type="primary" >
+          确认
+        </el-button>
+      </div>
+    </template>
+  </el-dialog>
+</template>
+<script setup>
+import { ref, onMounted, reactive } from 'vue';
+import { useRoute } from 'vue-router';
+import { AddChildModule, AddChildSystem, DeleteChildModule, GetChildSysById } from '@/api/project';
+import { getToken } from '@/utils/auth';
+import { DeleteFilled, Plus, RefreshRight, Search, UploadFilled } from '@element-plus/icons-vue'; // 确保导入你的 API 函数
+
+const listLoading = ref(false);
+const AddDialogVisible = ref(false);
+const DeleteDialogVisible = ref(false);
+const route = useRoute();
+const projectId = ref(route.params.projectId);
+const tableData = ref([]);
+const token = getToken();
+const AddFormData = reactive({
+  deadLine:'',
+  name: '',
+  status: '',
+  description: '',
+  principalId: '',
+  projectChildId:'',
+  workLoad: '',
+});
+const deleteData = reactive({
+  id: '',
+})
+
+
+//新增子模块
+async function addChildModule() {
+  console.log("add token:", token);
+  try {
+    const res = await AddChildModule(AddFormData, token);
+    if (res.data) {
+      listLoading.value = true;
+      ElMessage({
+        message: '新增成功',
+        type: 'success',
+      })
+    } else {
+      console.error("未获取到预期数据，响应内容:", res);
+    }
+  } finally {
+    listLoading.value = false;
+    AddDialogVisible.value = false;
+  }
+}
+
+
+//删除子模块
+async function deleteChildModule() {
+  console.log("delete token:", token);
+  try {
+    const res = await DeleteChildModule(deleteData.id, token);
+    if (res.code === 200) {
+      ElMessage({
+        message: '删除成功',
+        type: 'success',
+      })
+      DeleteDialogVisible.value = false;
+    } else {
+      console.error("删除失败:", res);
+    }
+  } finally {
+    listLoading.value = false;
+  }
+}
+
+function toggleAddDialog() {
+  AddDialogVisible.value = !AddDialogVisible.value;
+}
+
+function CancelAdd() {
+  AddDialogVisible.value = false;
+}
+
+function toggleDeleteDialog(row) {
+  console.log("Delete row:", row);  // 打印行数据，用于调试
+  DeleteDialogVisible.value = !DeleteDialogVisible.value;
+}
+
+function CancelDelete() {
+  DeleteDialogVisible.value = false;
+}
+</script>
+

src/views/tab/components/TabPane.vue

@@ -56,7 +56,7 @@
 <script>
 import { defineComponent } from 'vue';
 import { parseTime } from '@/utils';
-import { fetchList } from '@/api/article';
+import { fetchList } from '@/api/project';
 
 export default defineComponent({
   props: {

src/views/table/complex-table.vue

@@ -1,3 +1,95 @@
+<template>
+  <el-card style="max-width: 100vw;margin: 1.5vw;">
+    <template #header>
+      <div class="card-header">
+        <span>项目1</span>
+      </div>
+    </template>
+    <div style="display: flex; gap: 100px">
+      <el-input
+          v-model="input1"
+          style="width: 550px"
+          placeholder="请输入"
+      >
+        <template #prepend>名称</template>
+      </el-input>
+      <el-input
+          v-model="input2"
+          style="width: 550px"
+          placeholder="请输入"
+      >
+        <template #prepend>状态</template>
+      </el-input>
+      <div>
+        <el-button-group>
+          <el-button type="primary">查询</el-button>
+          <el-button>重置</el-button>
+        </el-button-group>
+      </div>
+    </div>
+    <template #footer>Footer content</template>
+  </el-card>
+  <el-card  style="max-width: 100vw;margin: 1.5vw;">
+    <div>
+      <el-table :data="tableData" ref="multipleTableRef" style="width: 100%"  @selection-change="handleSelectionChange">
+        <el-table-column type="selection" width="55" />
+        <el-table-column prop="date" label="序号"/>
+        <el-table-column prop="name" label="子系统名称"/>
+        <el-table-column prop="address" label="工作量" />
+        <el-table-column prop="address" label="周期" />
+        <el-table-column prop="address" label="负责人" />
+        <el-table-column prop="address" label="状态" />
+        <el-table-column prop="address" label="子系统简介" />
+        <el-table-column prop="address" label="截止时间" />
+        <el-table-column prop="address" label="操作" />
+      </el-table>
+    </div>
+    <div style="display: flex; justify-content: center;margin-top: 2vh">
+      <el-pagination background layout="prev, pager, next" :total="1000" />
+    </div>
+  </el-card>
+</template>
+<script lang="ts" setup>
+import { ref } from 'vue';
+import { ElTable } from 'element-plus';
+const input1 = ref('');
+const input2 = ref('');
+interface User {
+  date: string
+  name: string
+  address: string
+}
+
+const multipleTableRef = ref<InstanceType<typeof ElTable>>();
+const multipleSelection = ref<User[]>([]);
+
+const handleSelectionChange = (val: User[]) => {
+  multipleSelection.value = val;
+};
+const tableData = [
+  {
+    date: '2016-05-03',
+    name: 'Tom',
+    address: 'No. 189, Grove St, Los Angeles',
+  },
+  {
+    date: '2016-05-02',
+    name: 'Tom',
+    address: 'No. 189, Grove St, Los Angeles',
+  },
+  {
+    date: '2016-05-04',
+    name: 'Tom',
+    address: 'No. 189, Grove St, Los Angeles',
+  },
+  {
+    date: '2016-05-01',
+    name: 'Tom',
+    address: 'No. 189, Grove St, Los Angeles',
+  },
+];
+</script>
+<!--
 <template>
   <div class="app-container">
     <div class="filter-container">
@@ -35,51 +127,51 @@
       style="width: 100%;"
       @sort-change="sortChange"
     >
-      <el-table-column label="ID" prop="id" sortable="custom" align="center" width="80" :class-name="getSortClass('id')">
+      <el-table-column label="序号" prop="id" sortable="custom" align="center" width="80" :class-name="getSortClass('id')">
         <template v-slot="{row}">
           <span>{{ row.id }}</span>
         </template>
       </el-table-column>
-      <el-table-column label="Date" width="150px" align="center">
+      <el-table-column label="子系统名称" width="150px" align="center">
         <template v-slot="{row}">
           <span>{{ parseTime(row.timestamp, '{y}-{m}-{d} {h}:{i}') }}</span>
         </template>
       </el-table-column>
-      <el-table-column label="Title" min-width="150px">
+      <el-table-column label="工作量" min-width="150px">
         <template v-slot="{row}">
           <span class="link-type" @click="handleUpdate(row)">{{ row.title }}</span>
           <el-tag>{{ typeFilter(row.type) }}</el-tag>
         </template>
       </el-table-column>
-      <el-table-column label="Author" width="110px" align="center">
+      <el-table-column label="周期" width="110px" align="center">
         <template v-slot="{row}">
           <span>{{ row.author }}</span>
         </template>
       </el-table-column>
-      <el-table-column v-if="showReviewer" label="Reviewer" width="110px" align="center">
+      <el-table-column v-if="showReviewer" label="负责人" width="110px" align="center">
         <template v-slot="{row}">
           <span style="color:red;">{{ row.reviewer }}</span>
         </template>
       </el-table-column>
-      <el-table-column label="Imp" width="80px">
+      <el-table-column label="状态" width="80px">
         <template v-slot="{row}">
           <svg-icon v-for="n in row.importance" :key="n" icon-class="star" class="meta-item__icon" />
         </template>
       </el-table-column>
-      <el-table-column label="Readings" align="center" width="95">
+      <el-table-column label="子系统简介" align="center" width="95">
         <template v-slot="{row}">
           <span v-if="row.pageviews" class="link-type" @click="handleFetchPv(row.pageviews)">{{ row.pageviews }}</span>
           <span v-else>0</span>
         </template>
       </el-table-column>
-      <el-table-column label="Status" class-name="status-col" width="100">
+      <el-table-column label="截止时间" class-name="status-col" width="100">
         <template v-slot="{row}">
           <el-tag :type="statusFilter(row.status)">
             {{ row.status }}
           </el-tag>
         </template>
       </el-table-column>
-      <el-table-column label="Actions" align="center" width="230" class-name="small-padding fixed-width">
+      <el-table-column label="操作" align="center" width="230" class-name="small-padding fixed-width">
         <template v-slot="{row,$index}">
           <el-button type="primary" size="small" @click="handleUpdate(row)">
             Edit
@@ -385,3 +477,4 @@ export default defineComponent({
   }
 });
 </script>
+-->

src/views/table/drag-table.vue

@@ -1,6 +1,133 @@
+<!--<template>
+  <el-card style="max-width: 100vw;margin: 1.5vw;">
+    <template #header>
+      <div class="card-header">
+        <span>我管理的项目</span>
+      </div>
+    </template>
+    <div style="display: flex; gap: 100px">
+      <el-input
+          v-model="input1"
+          style="width: 550px"
+          placeholder="请输入"
+      >
+        <template #prepend>名称</template>
+      </el-input>
+      <el-input
+          v-model="input2"
+          style="width: 550px"
+          placeholder="请输入"
+      >
+        <template #prepend>状态</template>
+      </el-input>
+      <div>
+        <el-button-group>
+          <el-button type="primary">查询</el-button>
+          <el-button>重置</el-button>
+        </el-button-group>
+      </div>
+    </div>
+    <template #footer>Footer content</template>
+  </el-card>
+  <el-card  style="max-width: 100vw;margin: 1.5vw;">
+    <div>
+      <el-table :data="tableData" ref="multipleTableRef" style="width: 100%"  @selection-change="handleSelectionChange">
+        <el-table-column prop="id" label="序号">
+          <template v-slot="{row}">
+            <span>{{ row.id }}</span>
+          </template>
+        </el-table-column>
+        <el-table-column prop="name" label="子系统称">
+          <template v-slot="{row}">
+            <span>{{ row.name }}</span>
+          </template>
+        </el-table-column>
+        <el-table-column prop="workLoad" label="工作量">
+          <template v-slot="{row}">
+            <span>{{ row.workLoad }}</span>
+          </template>
+        </el-table-column>
+        <el-table-column prop="cycle" label="周期">
+          <template v-slot="{row}">
+            <span>{{ row.cycle }}</span>
+          </template>
+        </el-table-column>
+        <el-table-column prop="principalId" label="负责人">
+          <template v-slot="{row}">
+            <span>{{ row.principalId }}</span>
+          </template>
+        </el-table-column>
+        <el-table-column prop="status" label="状态">
+          <template v-slot="{row}">
+            <span>{{ row.status }}</span>
+          </template>
+        </el-table-column>
+        <el-table-column prop="description" label="子系统简介">
+          <template v-slot="{row}">
+            <span>{{ row.description }}</span>
+          </template>
+        </el-table-column>
+        <el-table-column prop="id" label="文档（点击下载）">
+          <template v-slot="{row}">
+            <span>{{ row.id }}</span>
+          </template>
+        </el-table-column>
+        <el-table-column prop="completeTime" label="截止时间">
+          <template v-slot="{row}">
+            <span>{{ row.completeTime }}</span>
+          </template>
+        </el-table-column>
+      </el-table>
+    </div>
+    <div style="display: flex; justify-content: center;margin-top: 2vh">
+      <el-pagination background layout="prev, pager, next" :total="1000" />
+    </div>
+  </el-card>
+</template>
+<script lang="ts" setup>
+import { ref } from 'vue';
+import { ElTable } from 'element-plus';
+const input1 = ref('');
+const input2 = ref('');
+interface User {
+  date: string
+  name: string
+  address: string
+}
+
+const multipleTableRef = ref<InstanceType<typeof ElTable>>();
+const multipleSelection = ref<User[]>([]);
+
+const handleSelectionChange = (val: User[]) => {
+  multipleSelection.value = val;
+};
+const tableData = [
+  {
+    date: '2016-05-03',
+    name: 'Tom',
+    address: 'No. 189, Grove St, Los Angeles',
+  },
+  {
+    date: '2016-05-02',
+    name: 'Tom',
+    address: 'No. 189, Grove St, Los Angeles',
+  },
+  {
+    date: '2016-05-04',
+    name: 'Tom',
+    address: 'No. 189, Grove St, Los Angeles',
+  },
+  {
+    date: '2016-05-01',
+    name: 'Tom',
+    address: 'No. 189, Grove St, Los Angeles',
+  },
+];
+</script>-->
+
 <template>
   <div class="app-container">
-    <!-- Note that row-key is necessary to get a correct row order. -->
+    &lt;!&ndash; Note that row-key is necessary to get a correct row order. &ndash;&gt;
     <el-table ref="dragTable" v-loading="listLoading" :data="list" row-key="id" border fit highlight-current-row style="width: 100%">
       <el-table-column align="center" label="ID" width="65">
         <template v-slot="{row}">
@@ -63,20 +190,22 @@
 
 <script>
 import { defineComponent } from 'vue';
-import { fetchList } from '@/api/article';
+import { SystemGetByProjId } from '@/api/project';
-import Sortable from 'sortablejs';
+import Sortable from "sortablejs";
 import { parseTime } from '@/utils';
+const token: string | null = window.localStorage.getItem('token')
 
 export default defineComponent({
   name: 'DragTable',
   data() {
     return {
-      list: null,
+      list: [],
       total: null,
       listLoading: true,
       listQuery: {
-        page: 1,
+        /* page: 1,
-        limit: 10
+        limit: 10 */
+        projectId:'',
       },
       sortable: null,
       oldList: [],
@@ -98,7 +227,7 @@ export default defineComponent({
     },
     async getList() {
       this.listLoading = true;
-      const { data } = await fetchList(this.listQuery);
+      const { data } = await SystemGetByProjId(this.listQuery, token);
       this.list = data.items;
       this.total = data.total;
       this.listLoading = false;

src/views/table/inline-edit-table.vue

@@ -79,7 +79,7 @@
 
 <script>
 import { defineComponent, markRaw } from 'vue';
-import { fetchList } from '@/api/article';
+import { fetchList } from '@/api/project';
 import { parseTime } from '@/utils';
 import { Refresh, CircleCheck, Edit } from '@element-plus/icons-vue';
 

src/views/zip/index.vue

@@ -41,7 +41,7 @@
 
 <script>
 import { defineComponent } from 'vue';
-import { fetchList } from '@/api/article';
+import { fetchList } from '@/api/project';
 import { Timer as IconTimer, Document as IconDocument } from '@element-plus/icons-vue';
 import { markRaw } from 'vue';