mirror of
https://codeup.aliyun.com/67762337eccfc218f6110e0e/vue/fe-manage.git
synced 2025-12-10 19:36:46 +08:00
style:修改左侧导航及头部导航栏,创建左侧导航相关页面
This commit is contained in:
李晓鸽
73
README.md
73
README.md
@@ -1,24 +1,97 @@
|
||||
# fe_manage
|
||||
|
||||
## Project setup
|
||||
|
||||
```
|
||||
npm install
|
||||
```
|
||||
|
||||
### Compiles and hot-reloads for development
|
||||
|
||||
```
|
||||
npm run serve
|
||||
```
|
||||
|
||||
### Compiles and minifies for production
|
||||
|
||||
```
|
||||
npm run build
|
||||
```
|
||||
|
||||
### Lints and fixes files
|
||||
|
||||
```
|
||||
npm run lint
|
||||
```
|
||||
|
||||
### Customize configuration
|
||||
|
||||
See [Configuration Reference](https://cli.vuejs.org/config/).
|
||||
|
||||
## pages 页面说明
|
||||
|
||||
### 一、learningpath:学习路径文件夹
|
||||
|
||||
```
|
||||
LearningPath.vue:学习路径页面
|
||||
|
||||
```
|
||||
|
||||
### 二、projectcenter:项目文件夹
|
||||
|
||||
```
|
||||
ProjectManage.vue:项目页面
|
||||
ProjectAdd.vue:创建项目页面
|
||||
TemplateLibrary.vue:模板页面
|
||||
|
||||
```
|
||||
|
||||
### 三、courselibrary:课程文件夹
|
||||
|
||||
```
|
||||
CourseManage.vue:课件管理页面
|
||||
CoursewareManage.vue:课程页面
|
||||
|
||||
```
|
||||
|
||||
### 四、examination:考试文件夹
|
||||
|
||||
```
|
||||
ExaminationCenter.vue:考试中心页面
|
||||
|
||||
```
|
||||
|
||||
### 五、research:调研文件夹
|
||||
|
||||
```
|
||||
ResearchManage.vue:调研管理页面
|
||||
|
||||
```
|
||||
|
||||
### 六、report:报表文件夹
|
||||
|
||||
```
|
||||
ReportCenter.vue:报表中心页面
|
||||
|
||||
```
|
||||
|
||||
### 七、teacher:教师文件夹
|
||||
|
||||
```
|
||||
TeacherManage.vue:教师管理页面
|
||||
|
||||
```
|
||||
|
||||
### 八、certificate:证书文件夹
|
||||
|
||||
```
|
||||
CertificateCenter.vue:证书中心页面
|
||||
|
||||
```
|
||||
|
||||
### 九、system:系统文件夹
|
||||
|
||||
```
|
||||
SystemManage.vue:系统管理页面
|
||||
|
||||
```
|
||||
|
||||
292
package-lock.json
generated
292
package-lock.json
generated
@@ -8,6 +8,7 @@
|
||||
"name": "fe_manage",
|
||||
"version": "0.1.0",
|
||||
"dependencies": {
|
||||
"ant-design-vue": "^3.2.12",
|
||||
"core-js": "^3.8.3",
|
||||
"element-plus": "^2.2.17",
|
||||
"vue": "^3.2.13",
|
||||
@@ -55,6 +56,31 @@
|
||||
"node": ">=6.0.0"
|
||||
}
|
||||
},
|
||||
"node_modules/@ant-design/colors": {
|
||||
"version": "6.0.0",
|
||||
"resolved": "https://registry.npmmirror.com/@ant-design/colors/-/colors-6.0.0.tgz",
|
||||
"integrity": "sha512-qAZRvPzfdWHtfameEGP2Qvuf838NhergR35o+EuVyB5XvSA98xod5r4utvi4TJ3ywmevm290g9nsCG5MryrdWQ==",
|
||||
"dependencies": {
|
||||
"@ctrl/tinycolor": "^3.4.0"
|
||||
}
|
||||
},
|
||||
"node_modules/@ant-design/icons-svg": {
|
||||
"version": "4.2.1",
|
||||
"resolved": "https://registry.npmmirror.com/@ant-design/icons-svg/-/icons-svg-4.2.1.tgz",
|
||||
"integrity": "sha512-EB0iwlKDGpG93hW8f85CTJTs4SvMX7tt5ceupvhALp1IF44SeUFOMhKUOYqpsoYWQKAOuTRDMqn75rEaKDp0Xw=="
|
||||
},
|
||||
"node_modules/@ant-design/icons-vue": {
|
||||
"version": "6.1.0",
|
||||
"resolved": "https://registry.npmmirror.com/@ant-design/icons-vue/-/icons-vue-6.1.0.tgz",
|
||||
"integrity": "sha512-EX6bYm56V+ZrKN7+3MT/ubDkvJ5rK/O2t380WFRflDcVFgsvl3NLH7Wxeau6R8DbrO5jWR6DSTC3B6gYFp77AA==",
|
||||
"dependencies": {
|
||||
"@ant-design/colors": "^6.0.0",
|
||||
"@ant-design/icons-svg": "^4.2.1"
|
||||
},
|
||||
"peerDependencies": {
|
||||
"vue": ">=3.0.3"
|
||||
}
|
||||
},
|
||||
"node_modules/@babel/code-frame": {
|
||||
"version": "7.18.6",
|
||||
"resolved": "https://registry.npmmirror.com/@babel/code-frame/-/code-frame-7.18.6.tgz",
|
||||
@@ -1666,7 +1692,6 @@
|
||||
"version": "7.19.0",
|
||||
"resolved": "https://registry.npmmirror.com/@babel/runtime/-/runtime-7.19.0.tgz",
|
||||
"integrity": "sha512-eR8Lo9hnDS7tqkO7NsV+mKvCmv5boaXFSZ70DnfhcgiEne8hv9oCEd36Klw74EtizEqLsy4YnW8UWwpBVolHZA==",
|
||||
"dev": true,
|
||||
"dependencies": {
|
||||
"regenerator-runtime": "^0.13.4"
|
||||
},
|
||||
@@ -2003,6 +2028,15 @@
|
||||
"integrity": "sha512-RNiOoTPkptFtSVzQevY/yWtZwf/RxyVnPy/OcA9HBM3MlGDnBEYL5B41H0MTn0Uec8Hi+2qUtTfG2WWZBmMejQ==",
|
||||
"dev": true
|
||||
},
|
||||
"node_modules/@simonwep/pickr": {
|
||||
"version": "1.8.2",
|
||||
"resolved": "https://registry.npmmirror.com/@simonwep/pickr/-/pickr-1.8.2.tgz",
|
||||
"integrity": "sha512-/l5w8BIkrpP6n1xsetx9MWPWlU6OblN5YgZZphxan0Tq4BByTCETL6lyIeY8lagalS2Nbt4F2W034KHLIiunKA==",
|
||||
"dependencies": {
|
||||
"core-js": "^3.15.1",
|
||||
"nanopop": "^2.1.0"
|
||||
}
|
||||
},
|
||||
"node_modules/@soda/friendly-errors-webpack-plugin": {
|
||||
"version": "1.8.1",
|
||||
"resolved": "https://registry.npmmirror.com/@soda/friendly-errors-webpack-plugin/-/friendly-errors-webpack-plugin-1.8.1.tgz",
|
||||
@@ -3407,6 +3441,36 @@
|
||||
"node": ">=4"
|
||||
}
|
||||
},
|
||||
"node_modules/ant-design-vue": {
|
||||
"version": "3.2.12",
|
||||
"resolved": "https://registry.npmmirror.com/ant-design-vue/-/ant-design-vue-3.2.12.tgz",
|
||||
"integrity": "sha512-CPsoWJ3t+sqq/EPINPXb4fC5/9iKkUdYOfK9M9kLKbXlRN3MAoVwWUbaFnUqc+ngtbEpn/d69hTF/Eh7MeWMhQ==",
|
||||
"dependencies": {
|
||||
"@ant-design/colors": "^6.0.0",
|
||||
"@ant-design/icons-vue": "^6.1.0",
|
||||
"@babel/runtime": "^7.10.5",
|
||||
"@ctrl/tinycolor": "^3.4.0",
|
||||
"@simonwep/pickr": "~1.8.0",
|
||||
"array-tree-filter": "^2.1.0",
|
||||
"async-validator": "^4.0.0",
|
||||
"dayjs": "^1.10.5",
|
||||
"dom-align": "^1.12.1",
|
||||
"dom-scroll-into-view": "^2.0.0",
|
||||
"lodash": "^4.17.21",
|
||||
"lodash-es": "^4.17.15",
|
||||
"resize-observer-polyfill": "^1.5.1",
|
||||
"scroll-into-view-if-needed": "^2.2.25",
|
||||
"shallow-equal": "^1.0.0",
|
||||
"vue-types": "^3.0.0",
|
||||
"warning": "^4.0.0"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">=12.22.0"
|
||||
},
|
||||
"peerDependencies": {
|
||||
"vue": ">=3.2.0"
|
||||
}
|
||||
},
|
||||
"node_modules/any-promise": {
|
||||
"version": "1.3.0",
|
||||
"resolved": "https://registry.npmmirror.com/any-promise/-/any-promise-1.3.0.tgz",
|
||||
@@ -3447,6 +3511,11 @@
|
||||
"integrity": "sha512-hNfzcOV8W4NdualtqBFPyVO+54DSJuZGY9qT4pRroB6S9e3iiido2ISIC5h9R2sPJ8H3FHCIiEnsv1lPXO3KtQ==",
|
||||
"dev": true
|
||||
},
|
||||
"node_modules/array-tree-filter": {
|
||||
"version": "2.1.0",
|
||||
"resolved": "https://registry.npmmirror.com/array-tree-filter/-/array-tree-filter-2.1.0.tgz",
|
||||
"integrity": "sha512-4ROwICNlNw/Hqa9v+rk5h22KjmzB1JGTMVKP2AKJBOCgb0yL0ASf0+YvCcLNNwquOHNX48jkeZIJ3a+oOQqKcw=="
|
||||
},
|
||||
"node_modules/array-union": {
|
||||
"version": "2.1.0",
|
||||
"resolved": "https://registry.npmmirror.com/array-union/-/array-union-2.1.0.tgz",
|
||||
@@ -4156,6 +4225,11 @@
|
||||
"integrity": "sha512-Tpp60P6IUJDTuOq/5Z8cdskzJujfwqfOTkrwIwj7IRISpnkJnT6SyJ4PCPnGMoFjC9ddhal5KVIYtAt97ix05A==",
|
||||
"dev": true
|
||||
},
|
||||
"node_modules/compute-scroll-into-view": {
|
||||
"version": "1.0.17",
|
||||
"resolved": "https://registry.npmmirror.com/compute-scroll-into-view/-/compute-scroll-into-view-1.0.17.tgz",
|
||||
"integrity": "sha512-j4dx+Fb0URmzbwwMUrhqWM2BEWHdFGx+qZ9qqASHRPqvTYdqvWnHg0H1hIbcyLnvgnoNAVMlwkepyqM3DaIFUg=="
|
||||
},
|
||||
"node_modules/concat-map": {
|
||||
"version": "0.0.1",
|
||||
"resolved": "https://registry.npmmirror.com/concat-map/-/concat-map-0.0.1.tgz",
|
||||
@@ -4850,6 +4924,11 @@
|
||||
"node": ">=6.0.0"
|
||||
}
|
||||
},
|
||||
"node_modules/dom-align": {
|
||||
"version": "1.12.3",
|
||||
"resolved": "https://registry.npmmirror.com/dom-align/-/dom-align-1.12.3.tgz",
|
||||
"integrity": "sha512-Gj9hZN3a07cbR6zviMUBOMPdWxYhbMI+x+WS0NAIu2zFZmbK8ys9R79g+iG9qLnlCwpFoaB+fKy8Pdv470GsPA=="
|
||||
},
|
||||
"node_modules/dom-converter": {
|
||||
"version": "0.2.0",
|
||||
"resolved": "https://registry.npmmirror.com/dom-converter/-/dom-converter-0.2.0.tgz",
|
||||
@@ -4859,6 +4938,11 @@
|
||||
"utila": "~0.4"
|
||||
}
|
||||
},
|
||||
"node_modules/dom-scroll-into-view": {
|
||||
"version": "2.0.1",
|
||||
"resolved": "https://registry.npmmirror.com/dom-scroll-into-view/-/dom-scroll-into-view-2.0.1.tgz",
|
||||
"integrity": "sha512-bvVTQe1lfaUr1oFzZX80ce9KLDlZ3iU+XGNE/bz9HnGdklTieqsbmsLHe+rT2XWqopvL0PckkYqN7ksmm5pe3w=="
|
||||
},
|
||||
"node_modules/dom-serializer": {
|
||||
"version": "1.4.1",
|
||||
"resolved": "https://registry.npmmirror.com/dom-serializer/-/dom-serializer-1.4.1.tgz",
|
||||
@@ -6752,8 +6836,7 @@
|
||||
"node_modules/js-tokens": {
|
||||
"version": "4.0.0",
|
||||
"resolved": "https://registry.npmmirror.com/js-tokens/-/js-tokens-4.0.0.tgz",
|
||||
"integrity": "sha512-RdJUflcE3cUzKiMqQgsCu06FPu9UdIJO0beYbPhHN4k6apgJtifcoCtT9bcxOpYBtpD2kCM6Sbzg4CausW/PKQ==",
|
||||
"dev": true
|
||||
"integrity": "sha512-RdJUflcE3cUzKiMqQgsCu06FPu9UdIJO0beYbPhHN4k6apgJtifcoCtT9bcxOpYBtpD2kCM6Sbzg4CausW/PKQ=="
|
||||
},
|
||||
"node_modules/js-yaml": {
|
||||
"version": "3.14.1",
|
||||
@@ -7201,6 +7284,17 @@
|
||||
"node": ">=4"
|
||||
}
|
||||
},
|
||||
"node_modules/loose-envify": {
|
||||
"version": "1.4.0",
|
||||
"resolved": "https://registry.npmmirror.com/loose-envify/-/loose-envify-1.4.0.tgz",
|
||||
"integrity": "sha512-lyuxPGr/Wfhrlem2CL/UcnUc1zcqKAImBDzukY7Y5F/yQiNdko6+fRLevlw1HgMySw7f611UIY408EtxRSoK3Q==",
|
||||
"dependencies": {
|
||||
"js-tokens": "^3.0.0 || ^4.0.0"
|
||||
},
|
||||
"bin": {
|
||||
"loose-envify": "cli.js"
|
||||
}
|
||||
},
|
||||
"node_modules/lower-case": {
|
||||
"version": "2.0.2",
|
||||
"resolved": "https://registry.npmmirror.com/lower-case/-/lower-case-2.0.2.tgz",
|
||||
@@ -7532,6 +7626,11 @@
|
||||
"node": "^10 || ^12 || ^13.7 || ^14 || >=15.0.1"
|
||||
}
|
||||
},
|
||||
"node_modules/nanopop": {
|
||||
"version": "2.2.0",
|
||||
"resolved": "https://registry.npmmirror.com/nanopop/-/nanopop-2.2.0.tgz",
|
||||
"integrity": "sha512-E9JaHcxh3ere8/BEZHAcnuD10RluTSPyTToBvoFWS9/7DcCx6gyKjbn7M7Bx7E1veCxCuY1iO6h4+gdAf1j73Q=="
|
||||
},
|
||||
"node_modules/natural-compare": {
|
||||
"version": "1.4.0",
|
||||
"resolved": "https://registry.npmmirror.com/natural-compare/-/natural-compare-1.4.0.tgz",
|
||||
@@ -8903,8 +9002,7 @@
|
||||
"node_modules/regenerator-runtime": {
|
||||
"version": "0.13.9",
|
||||
"resolved": "https://registry.npmmirror.com/regenerator-runtime/-/regenerator-runtime-0.13.9.tgz",
|
||||
"integrity": "sha512-p3VT+cOEgxFsRRA9X4lkI1E+k2/CtnKtU4gcxyaCUreilL/vqI6CdZ3wxVUx3UOUg+gnUOQQcRI7BmSI656MYA==",
|
||||
"dev": true
|
||||
"integrity": "sha512-p3VT+cOEgxFsRRA9X4lkI1E+k2/CtnKtU4gcxyaCUreilL/vqI6CdZ3wxVUx3UOUg+gnUOQQcRI7BmSI656MYA=="
|
||||
},
|
||||
"node_modules/regenerator-transform": {
|
||||
"version": "0.15.0",
|
||||
@@ -9014,6 +9112,11 @@
|
||||
"integrity": "sha512-KigOCHcocU3XODJxsu8i/j8T9tzT4adHiecwORRQ0ZZFcp7ahwXuRU1m+yuO90C5ZUyGeGfocHDI14M3L3yDAQ==",
|
||||
"dev": true
|
||||
},
|
||||
"node_modules/resize-observer-polyfill": {
|
||||
"version": "1.5.1",
|
||||
"resolved": "https://registry.npmmirror.com/resize-observer-polyfill/-/resize-observer-polyfill-1.5.1.tgz",
|
||||
"integrity": "sha512-LwZrotdHOo12nQuZlHEmtuXdqGoOD0OhaxopaNFxWzInpEgaLWoVuAMbTzixuosCx2nEG58ngzW3vxdWoxIgdg=="
|
||||
},
|
||||
"node_modules/resolve": {
|
||||
"version": "1.22.1",
|
||||
"resolved": "https://registry.npmmirror.com/resolve/-/resolve-1.22.1.tgz",
|
||||
@@ -9167,6 +9270,14 @@
|
||||
"node": ">= 8.9.0"
|
||||
}
|
||||
},
|
||||
"node_modules/scroll-into-view-if-needed": {
|
||||
"version": "2.2.29",
|
||||
"resolved": "https://registry.npmmirror.com/scroll-into-view-if-needed/-/scroll-into-view-if-needed-2.2.29.tgz",
|
||||
"integrity": "sha512-hxpAR6AN+Gh53AdAimHM6C8oTN1ppwVZITihix+WqalywBeFcQ6LdQP5ABNl26nX8GTEL7VT+b8lKpdqq65wXg==",
|
||||
"dependencies": {
|
||||
"compute-scroll-into-view": "^1.0.17"
|
||||
}
|
||||
},
|
||||
"node_modules/select-hose": {
|
||||
"version": "2.0.0",
|
||||
"resolved": "https://registry.npmmirror.com/select-hose/-/select-hose-2.0.0.tgz",
|
||||
@@ -9359,6 +9470,11 @@
|
||||
"node": ">=8"
|
||||
}
|
||||
},
|
||||
"node_modules/shallow-equal": {
|
||||
"version": "1.2.1",
|
||||
"resolved": "https://registry.npmmirror.com/shallow-equal/-/shallow-equal-1.2.1.tgz",
|
||||
"integrity": "sha512-S4vJDjHHMBaiZuT9NPb616CSmLf618jawtv3sufLl6ivK8WocjAo58cXwbRV1cgqxH0Qbv+iUt6m05eqEa2IRA=="
|
||||
},
|
||||
"node_modules/shebang-command": {
|
||||
"version": "1.2.0",
|
||||
"resolved": "https://registry.npmmirror.com/shebang-command/-/shebang-command-1.2.0.tgz",
|
||||
@@ -10402,6 +10518,28 @@
|
||||
"integrity": "sha512-4gDntzrifFnCEvyoO8PqyJDmguXgVPxKiIxrBKjIowvL9l+N66196+72XVYR8BBf1Uv1Fgt3bGevJ+sEmxfZzw==",
|
||||
"dev": true
|
||||
},
|
||||
"node_modules/vue-types": {
|
||||
"version": "3.0.2",
|
||||
"resolved": "https://registry.npmmirror.com/vue-types/-/vue-types-3.0.2.tgz",
|
||||
"integrity": "sha512-IwUC0Aq2zwaXqy74h4WCvFCUtoV0iSWr0snWnE9TnU18S66GAQyqQbRf2qfJtUuiFsBf6qp0MEwdonlwznlcrw==",
|
||||
"dependencies": {
|
||||
"is-plain-object": "3.0.1"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">=10.15.0"
|
||||
},
|
||||
"peerDependencies": {
|
||||
"vue": "^3.0.0"
|
||||
}
|
||||
},
|
||||
"node_modules/vue-types/node_modules/is-plain-object": {
|
||||
"version": "3.0.1",
|
||||
"resolved": "https://registry.npmmirror.com/is-plain-object/-/is-plain-object-3.0.1.tgz",
|
||||
"integrity": "sha512-Xnpx182SBMrr/aBik8y+GuR4U1L9FqMSojwDQwPMmxyC6bvEqly9UBCxhauBF5vNh2gwWJNX6oDV7O+OM4z34g==",
|
||||
"engines": {
|
||||
"node": ">=0.10.0"
|
||||
}
|
||||
},
|
||||
"node_modules/vuex": {
|
||||
"version": "4.0.2",
|
||||
"resolved": "https://registry.npmmirror.com/vuex/-/vuex-4.0.2.tgz",
|
||||
@@ -10413,6 +10551,14 @@
|
||||
"vue": "^3.0.2"
|
||||
}
|
||||
},
|
||||
"node_modules/warning": {
|
||||
"version": "4.0.3",
|
||||
"resolved": "https://registry.npmmirror.com/warning/-/warning-4.0.3.tgz",
|
||||
"integrity": "sha512-rpJyN222KWIvHJ/F53XSZv0Zl/accqHR8et1kpaMTD/fLCRxtV8iX8czMzY7sVZupTI3zcUTg8eycS2kNF9l6w==",
|
||||
"dependencies": {
|
||||
"loose-envify": "^1.0.0"
|
||||
}
|
||||
},
|
||||
"node_modules/watchpack": {
|
||||
"version": "2.4.0",
|
||||
"resolved": "https://registry.npmmirror.com/watchpack/-/watchpack-2.4.0.tgz",
|
||||
@@ -11121,6 +11267,28 @@
|
||||
"@jridgewell/trace-mapping": "^0.3.9"
|
||||
}
|
||||
},
|
||||
"@ant-design/colors": {
|
||||
"version": "6.0.0",
|
||||
"resolved": "https://registry.npmmirror.com/@ant-design/colors/-/colors-6.0.0.tgz",
|
||||
"integrity": "sha512-qAZRvPzfdWHtfameEGP2Qvuf838NhergR35o+EuVyB5XvSA98xod5r4utvi4TJ3ywmevm290g9nsCG5MryrdWQ==",
|
||||
"requires": {
|
||||
"@ctrl/tinycolor": "^3.4.0"
|
||||
}
|
||||
},
|
||||
"@ant-design/icons-svg": {
|
||||
"version": "4.2.1",
|
||||
"resolved": "https://registry.npmmirror.com/@ant-design/icons-svg/-/icons-svg-4.2.1.tgz",
|
||||
"integrity": "sha512-EB0iwlKDGpG93hW8f85CTJTs4SvMX7tt5ceupvhALp1IF44SeUFOMhKUOYqpsoYWQKAOuTRDMqn75rEaKDp0Xw=="
|
||||
},
|
||||
"@ant-design/icons-vue": {
|
||||
"version": "6.1.0",
|
||||
"resolved": "https://registry.npmmirror.com/@ant-design/icons-vue/-/icons-vue-6.1.0.tgz",
|
||||
"integrity": "sha512-EX6bYm56V+ZrKN7+3MT/ubDkvJ5rK/O2t380WFRflDcVFgsvl3NLH7Wxeau6R8DbrO5jWR6DSTC3B6gYFp77AA==",
|
||||
"requires": {
|
||||
"@ant-design/colors": "^6.0.0",
|
||||
"@ant-design/icons-svg": "^4.2.1"
|
||||
}
|
||||
},
|
||||
"@babel/code-frame": {
|
||||
"version": "7.18.6",
|
||||
"resolved": "https://registry.npmmirror.com/@babel/code-frame/-/code-frame-7.18.6.tgz",
|
||||
@@ -12232,7 +12400,6 @@
|
||||
"version": "7.19.0",
|
||||
"resolved": "https://registry.npmmirror.com/@babel/runtime/-/runtime-7.19.0.tgz",
|
||||
"integrity": "sha512-eR8Lo9hnDS7tqkO7NsV+mKvCmv5boaXFSZ70DnfhcgiEne8hv9oCEd36Klw74EtizEqLsy4YnW8UWwpBVolHZA==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"regenerator-runtime": "^0.13.4"
|
||||
}
|
||||
@@ -12516,6 +12683,15 @@
|
||||
"integrity": "sha512-RNiOoTPkptFtSVzQevY/yWtZwf/RxyVnPy/OcA9HBM3MlGDnBEYL5B41H0MTn0Uec8Hi+2qUtTfG2WWZBmMejQ==",
|
||||
"dev": true
|
||||
},
|
||||
"@simonwep/pickr": {
|
||||
"version": "1.8.2",
|
||||
"resolved": "https://registry.npmmirror.com/@simonwep/pickr/-/pickr-1.8.2.tgz",
|
||||
"integrity": "sha512-/l5w8BIkrpP6n1xsetx9MWPWlU6OblN5YgZZphxan0Tq4BByTCETL6lyIeY8lagalS2Nbt4F2W034KHLIiunKA==",
|
||||
"requires": {
|
||||
"core-js": "^3.15.1",
|
||||
"nanopop": "^2.1.0"
|
||||
}
|
||||
},
|
||||
"@soda/friendly-errors-webpack-plugin": {
|
||||
"version": "1.8.1",
|
||||
"resolved": "https://registry.npmmirror.com/@soda/friendly-errors-webpack-plugin/-/friendly-errors-webpack-plugin-1.8.1.tgz",
|
||||
@@ -13688,6 +13864,30 @@
|
||||
"color-convert": "^1.9.0"
|
||||
}
|
||||
},
|
||||
"ant-design-vue": {
|
||||
"version": "3.2.12",
|
||||
"resolved": "https://registry.npmmirror.com/ant-design-vue/-/ant-design-vue-3.2.12.tgz",
|
||||
"integrity": "sha512-CPsoWJ3t+sqq/EPINPXb4fC5/9iKkUdYOfK9M9kLKbXlRN3MAoVwWUbaFnUqc+ngtbEpn/d69hTF/Eh7MeWMhQ==",
|
||||
"requires": {
|
||||
"@ant-design/colors": "^6.0.0",
|
||||
"@ant-design/icons-vue": "^6.1.0",
|
||||
"@babel/runtime": "^7.10.5",
|
||||
"@ctrl/tinycolor": "^3.4.0",
|
||||
"@simonwep/pickr": "~1.8.0",
|
||||
"array-tree-filter": "^2.1.0",
|
||||
"async-validator": "^4.0.0",
|
||||
"dayjs": "^1.10.5",
|
||||
"dom-align": "^1.12.1",
|
||||
"dom-scroll-into-view": "^2.0.0",
|
||||
"lodash": "^4.17.21",
|
||||
"lodash-es": "^4.17.15",
|
||||
"resize-observer-polyfill": "^1.5.1",
|
||||
"scroll-into-view-if-needed": "^2.2.25",
|
||||
"shallow-equal": "^1.0.0",
|
||||
"vue-types": "^3.0.0",
|
||||
"warning": "^4.0.0"
|
||||
}
|
||||
},
|
||||
"any-promise": {
|
||||
"version": "1.3.0",
|
||||
"resolved": "https://registry.npmmirror.com/any-promise/-/any-promise-1.3.0.tgz",
|
||||
@@ -13725,6 +13925,11 @@
|
||||
"integrity": "sha512-hNfzcOV8W4NdualtqBFPyVO+54DSJuZGY9qT4pRroB6S9e3iiido2ISIC5h9R2sPJ8H3FHCIiEnsv1lPXO3KtQ==",
|
||||
"dev": true
|
||||
},
|
||||
"array-tree-filter": {
|
||||
"version": "2.1.0",
|
||||
"resolved": "https://registry.npmmirror.com/array-tree-filter/-/array-tree-filter-2.1.0.tgz",
|
||||
"integrity": "sha512-4ROwICNlNw/Hqa9v+rk5h22KjmzB1JGTMVKP2AKJBOCgb0yL0ASf0+YvCcLNNwquOHNX48jkeZIJ3a+oOQqKcw=="
|
||||
},
|
||||
"array-union": {
|
||||
"version": "2.1.0",
|
||||
"resolved": "https://registry.npmmirror.com/array-union/-/array-union-2.1.0.tgz",
|
||||
@@ -14310,6 +14515,11 @@
|
||||
}
|
||||
}
|
||||
},
|
||||
"compute-scroll-into-view": {
|
||||
"version": "1.0.17",
|
||||
"resolved": "https://registry.npmmirror.com/compute-scroll-into-view/-/compute-scroll-into-view-1.0.17.tgz",
|
||||
"integrity": "sha512-j4dx+Fb0URmzbwwMUrhqWM2BEWHdFGx+qZ9qqASHRPqvTYdqvWnHg0H1hIbcyLnvgnoNAVMlwkepyqM3DaIFUg=="
|
||||
},
|
||||
"concat-map": {
|
||||
"version": "0.0.1",
|
||||
"resolved": "https://registry.npmmirror.com/concat-map/-/concat-map-0.0.1.tgz",
|
||||
@@ -14841,6 +15051,11 @@
|
||||
"esutils": "^2.0.2"
|
||||
}
|
||||
},
|
||||
"dom-align": {
|
||||
"version": "1.12.3",
|
||||
"resolved": "https://registry.npmmirror.com/dom-align/-/dom-align-1.12.3.tgz",
|
||||
"integrity": "sha512-Gj9hZN3a07cbR6zviMUBOMPdWxYhbMI+x+WS0NAIu2zFZmbK8ys9R79g+iG9qLnlCwpFoaB+fKy8Pdv470GsPA=="
|
||||
},
|
||||
"dom-converter": {
|
||||
"version": "0.2.0",
|
||||
"resolved": "https://registry.npmmirror.com/dom-converter/-/dom-converter-0.2.0.tgz",
|
||||
@@ -14850,6 +15065,11 @@
|
||||
"utila": "~0.4"
|
||||
}
|
||||
},
|
||||
"dom-scroll-into-view": {
|
||||
"version": "2.0.1",
|
||||
"resolved": "https://registry.npmmirror.com/dom-scroll-into-view/-/dom-scroll-into-view-2.0.1.tgz",
|
||||
"integrity": "sha512-bvVTQe1lfaUr1oFzZX80ce9KLDlZ3iU+XGNE/bz9HnGdklTieqsbmsLHe+rT2XWqopvL0PckkYqN7ksmm5pe3w=="
|
||||
},
|
||||
"dom-serializer": {
|
||||
"version": "1.4.1",
|
||||
"resolved": "https://registry.npmmirror.com/dom-serializer/-/dom-serializer-1.4.1.tgz",
|
||||
@@ -16365,8 +16585,7 @@
|
||||
"js-tokens": {
|
||||
"version": "4.0.0",
|
||||
"resolved": "https://registry.npmmirror.com/js-tokens/-/js-tokens-4.0.0.tgz",
|
||||
"integrity": "sha512-RdJUflcE3cUzKiMqQgsCu06FPu9UdIJO0beYbPhHN4k6apgJtifcoCtT9bcxOpYBtpD2kCM6Sbzg4CausW/PKQ==",
|
||||
"dev": true
|
||||
"integrity": "sha512-RdJUflcE3cUzKiMqQgsCu06FPu9UdIJO0beYbPhHN4k6apgJtifcoCtT9bcxOpYBtpD2kCM6Sbzg4CausW/PKQ=="
|
||||
},
|
||||
"js-yaml": {
|
||||
"version": "3.14.1",
|
||||
@@ -16727,6 +16946,14 @@
|
||||
}
|
||||
}
|
||||
},
|
||||
"loose-envify": {
|
||||
"version": "1.4.0",
|
||||
"resolved": "https://registry.npmmirror.com/loose-envify/-/loose-envify-1.4.0.tgz",
|
||||
"integrity": "sha512-lyuxPGr/Wfhrlem2CL/UcnUc1zcqKAImBDzukY7Y5F/yQiNdko6+fRLevlw1HgMySw7f611UIY408EtxRSoK3Q==",
|
||||
"requires": {
|
||||
"js-tokens": "^3.0.0 || ^4.0.0"
|
||||
}
|
||||
},
|
||||
"lower-case": {
|
||||
"version": "2.0.2",
|
||||
"resolved": "https://registry.npmmirror.com/lower-case/-/lower-case-2.0.2.tgz",
|
||||
@@ -16991,6 +17218,11 @@
|
||||
"resolved": "https://registry.npmmirror.com/nanoid/-/nanoid-3.3.4.tgz",
|
||||
"integrity": "sha512-MqBkQh/OHTS2egovRtLk45wEyNXwF+cokD+1YPf9u5VfJiRdAiRwB2froX5Co9Rh20xs4siNPm8naNotSD6RBw=="
|
||||
},
|
||||
"nanopop": {
|
||||
"version": "2.2.0",
|
||||
"resolved": "https://registry.npmmirror.com/nanopop/-/nanopop-2.2.0.tgz",
|
||||
"integrity": "sha512-E9JaHcxh3ere8/BEZHAcnuD10RluTSPyTToBvoFWS9/7DcCx6gyKjbn7M7Bx7E1veCxCuY1iO6h4+gdAf1j73Q=="
|
||||
},
|
||||
"natural-compare": {
|
||||
"version": "1.4.0",
|
||||
"resolved": "https://registry.npmmirror.com/natural-compare/-/natural-compare-1.4.0.tgz",
|
||||
@@ -18003,8 +18235,7 @@
|
||||
"regenerator-runtime": {
|
||||
"version": "0.13.9",
|
||||
"resolved": "https://registry.npmmirror.com/regenerator-runtime/-/regenerator-runtime-0.13.9.tgz",
|
||||
"integrity": "sha512-p3VT+cOEgxFsRRA9X4lkI1E+k2/CtnKtU4gcxyaCUreilL/vqI6CdZ3wxVUx3UOUg+gnUOQQcRI7BmSI656MYA==",
|
||||
"dev": true
|
||||
"integrity": "sha512-p3VT+cOEgxFsRRA9X4lkI1E+k2/CtnKtU4gcxyaCUreilL/vqI6CdZ3wxVUx3UOUg+gnUOQQcRI7BmSI656MYA=="
|
||||
},
|
||||
"regenerator-transform": {
|
||||
"version": "0.15.0",
|
||||
@@ -18095,6 +18326,11 @@
|
||||
"integrity": "sha512-KigOCHcocU3XODJxsu8i/j8T9tzT4adHiecwORRQ0ZZFcp7ahwXuRU1m+yuO90C5ZUyGeGfocHDI14M3L3yDAQ==",
|
||||
"dev": true
|
||||
},
|
||||
"resize-observer-polyfill": {
|
||||
"version": "1.5.1",
|
||||
"resolved": "https://registry.npmmirror.com/resize-observer-polyfill/-/resize-observer-polyfill-1.5.1.tgz",
|
||||
"integrity": "sha512-LwZrotdHOo12nQuZlHEmtuXdqGoOD0OhaxopaNFxWzInpEgaLWoVuAMbTzixuosCx2nEG58ngzW3vxdWoxIgdg=="
|
||||
},
|
||||
"resolve": {
|
||||
"version": "1.22.1",
|
||||
"resolved": "https://registry.npmmirror.com/resolve/-/resolve-1.22.1.tgz",
|
||||
@@ -18196,6 +18432,14 @@
|
||||
"ajv-keywords": "^3.5.2"
|
||||
}
|
||||
},
|
||||
"scroll-into-view-if-needed": {
|
||||
"version": "2.2.29",
|
||||
"resolved": "https://registry.npmmirror.com/scroll-into-view-if-needed/-/scroll-into-view-if-needed-2.2.29.tgz",
|
||||
"integrity": "sha512-hxpAR6AN+Gh53AdAimHM6C8oTN1ppwVZITihix+WqalywBeFcQ6LdQP5ABNl26nX8GTEL7VT+b8lKpdqq65wXg==",
|
||||
"requires": {
|
||||
"compute-scroll-into-view": "^1.0.17"
|
||||
}
|
||||
},
|
||||
"select-hose": {
|
||||
"version": "2.0.0",
|
||||
"resolved": "https://registry.npmmirror.com/select-hose/-/select-hose-2.0.0.tgz",
|
||||
@@ -18367,6 +18611,11 @@
|
||||
"kind-of": "^6.0.2"
|
||||
}
|
||||
},
|
||||
"shallow-equal": {
|
||||
"version": "1.2.1",
|
||||
"resolved": "https://registry.npmmirror.com/shallow-equal/-/shallow-equal-1.2.1.tgz",
|
||||
"integrity": "sha512-S4vJDjHHMBaiZuT9NPb616CSmLf618jawtv3sufLl6ivK8WocjAo58cXwbRV1cgqxH0Qbv+iUt6m05eqEa2IRA=="
|
||||
},
|
||||
"shebang-command": {
|
||||
"version": "1.2.0",
|
||||
"resolved": "https://registry.npmmirror.com/shebang-command/-/shebang-command-1.2.0.tgz",
|
||||
@@ -19205,6 +19454,21 @@
|
||||
"integrity": "sha512-4gDntzrifFnCEvyoO8PqyJDmguXgVPxKiIxrBKjIowvL9l+N66196+72XVYR8BBf1Uv1Fgt3bGevJ+sEmxfZzw==",
|
||||
"dev": true
|
||||
},
|
||||
"vue-types": {
|
||||
"version": "3.0.2",
|
||||
"resolved": "https://registry.npmmirror.com/vue-types/-/vue-types-3.0.2.tgz",
|
||||
"integrity": "sha512-IwUC0Aq2zwaXqy74h4WCvFCUtoV0iSWr0snWnE9TnU18S66GAQyqQbRf2qfJtUuiFsBf6qp0MEwdonlwznlcrw==",
|
||||
"requires": {
|
||||
"is-plain-object": "3.0.1"
|
||||
},
|
||||
"dependencies": {
|
||||
"is-plain-object": {
|
||||
"version": "3.0.1",
|
||||
"resolved": "https://registry.npmmirror.com/is-plain-object/-/is-plain-object-3.0.1.tgz",
|
||||
"integrity": "sha512-Xnpx182SBMrr/aBik8y+GuR4U1L9FqMSojwDQwPMmxyC6bvEqly9UBCxhauBF5vNh2gwWJNX6oDV7O+OM4z34g=="
|
||||
}
|
||||
}
|
||||
},
|
||||
"vuex": {
|
||||
"version": "4.0.2",
|
||||
"resolved": "https://registry.npmmirror.com/vuex/-/vuex-4.0.2.tgz",
|
||||
@@ -19213,6 +19477,14 @@
|
||||
"@vue/devtools-api": "^6.0.0-beta.11"
|
||||
}
|
||||
},
|
||||
"warning": {
|
||||
"version": "4.0.3",
|
||||
"resolved": "https://registry.npmmirror.com/warning/-/warning-4.0.3.tgz",
|
||||
"integrity": "sha512-rpJyN222KWIvHJ/F53XSZv0Zl/accqHR8et1kpaMTD/fLCRxtV8iX8czMzY7sVZupTI3zcUTg8eycS2kNF9l6w==",
|
||||
"requires": {
|
||||
"loose-envify": "^1.0.0"
|
||||
}
|
||||
},
|
||||
"watchpack": {
|
||||
"version": "2.4.0",
|
||||
"resolved": "https://registry.npmmirror.com/watchpack/-/watchpack-2.4.0.tgz",
|
||||
|
||||
@@ -8,6 +8,7 @@
|
||||
"lint": "vue-cli-service lint"
|
||||
},
|
||||
"dependencies": {
|
||||
"ant-design-vue": "^3.2.12",
|
||||
"core-js": "^3.8.3",
|
||||
"element-plus": "^2.2.17",
|
||||
"vue": "^3.2.13",
|
||||
|
||||
30
src/App.vue
30
src/App.vue
@@ -1,18 +1,39 @@
|
||||
<template>
|
||||
<div id="container">
|
||||
<nav-top />
|
||||
<div style="display: flex">
|
||||
<nav-left />
|
||||
<div style="flex: 1; display: flex; flex-direction: column; width: 0">
|
||||
<open-pages />
|
||||
<bread-crumb />
|
||||
<main>
|
||||
<a-config-provider :locale="zhCN">
|
||||
<router-view />
|
||||
</a-config-provider>
|
||||
</main>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import { computed, defineComponent } from "vue";
|
||||
import { useRouter, useRoute } from "vue-router";
|
||||
import NavLeft from "@/components/NavLeft";
|
||||
import NavTop from "@/components/NavTop";
|
||||
import OpenPages from "@/components/OpenPages";
|
||||
import BreadCrumb from "@/components/BreadCrumb";
|
||||
import zhCN from "ant-design-vue/es/locale/zh_CN";
|
||||
export default defineComponent({
|
||||
components: {
|
||||
NavLeft,
|
||||
NavTop,
|
||||
OpenPages,
|
||||
BreadCrumb,
|
||||
},
|
||||
setup() {
|
||||
const router = useRouter();
|
||||
const route = useRoute();
|
||||
console.log("router", router.getRoutes(), route);
|
||||
// console.log("router", router.getRoutes(), route);
|
||||
const routes = computed(() => {
|
||||
return router.getRoutes().filter((e) => e.meta?.isLink);
|
||||
});
|
||||
@@ -22,6 +43,7 @@ export default defineComponent({
|
||||
return {
|
||||
routes,
|
||||
name: currentRouteName,
|
||||
zhCN,
|
||||
};
|
||||
},
|
||||
});
|
||||
@@ -50,8 +72,12 @@ export default defineComponent({
|
||||
|
||||
main {
|
||||
flex: 1;
|
||||
width: 100%;
|
||||
width: calc(100% - 40px);
|
||||
// margin-bottom: 20px;
|
||||
margin: 0px 20px 20px 20px;
|
||||
box-sizing: border-box;
|
||||
background: #ffffff;
|
||||
box-shadow: 0px 1px 35px 0px rgba(118, 136, 166, 0.07);
|
||||
}
|
||||
// @media screen and (max-width: 1366px) {
|
||||
// .cmMain {
|
||||
|
||||
BIN
src/assets/images/courseManage/add0.png
Normal file
BIN
src/assets/images/courseManage/add0.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 610 B |
BIN
src/assets/images/courseManage/add1.png
Normal file
BIN
src/assets/images/courseManage/add1.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 782 B |
BIN
src/assets/images/courseManage/reset0.png
Normal file
BIN
src/assets/images/courseManage/reset0.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 486 B |
BIN
src/assets/images/courseManage/reset1.png
Normal file
BIN
src/assets/images/courseManage/reset1.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 598 B |
BIN
src/assets/images/courseManage/search0.png
Normal file
BIN
src/assets/images/courseManage/search0.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 460 B |
BIN
src/assets/images/courseManage/search1.png
Normal file
BIN
src/assets/images/courseManage/search1.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 577 B |
BIN
src/assets/images/openPages/close.png
Normal file
BIN
src/assets/images/openPages/close.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 263 B |
@@ -5,3 +5,147 @@ body {
|
||||
padding: 0;
|
||||
// overflow-y: auto;
|
||||
}
|
||||
//隐藏滚动条----------------------------------------------------------------
|
||||
div::-webkit-scrollbar {
|
||||
display: none !important;
|
||||
width: 0 !important;
|
||||
height: 0 !important;
|
||||
}
|
||||
div::-moz-scrollbar {
|
||||
display: none !important;
|
||||
width: 0 !important;
|
||||
height: 0 !important;
|
||||
}
|
||||
div::-o-scrollbar {
|
||||
display: none !important;
|
||||
width: 0 !important;
|
||||
height: 0 !important;
|
||||
}
|
||||
body::-webkit-scrollbar {
|
||||
display: none !important;;
|
||||
width: 0 !important;
|
||||
height: 0 !important;
|
||||
}
|
||||
body::-moz-scrollbar {
|
||||
display: none !important;
|
||||
width: 0 !important;
|
||||
height: 0 !important;
|
||||
}
|
||||
body::-o-scrollbar {
|
||||
display: none !important;
|
||||
width: 0 !important;
|
||||
height: 0 !important;
|
||||
}
|
||||
//隐藏滚动条----------------------------------------------------------------
|
||||
|
||||
//禁止选中----------------------------------------------------------
|
||||
*{
|
||||
-webkit-touch-callout:none; /*系统默认菜单被禁用*/
|
||||
-webkit-user-select:none; /*webkit浏览器*/
|
||||
-khtml-user-select:none; /*早期浏览器*/
|
||||
-moz-user-select:none;/*火狐*/
|
||||
-ms-user-select:none; /*IE10*/
|
||||
user-select:none;
|
||||
}
|
||||
input{
|
||||
-webkit-user-select:auto; /*webkit浏览器*/
|
||||
}
|
||||
textarea{
|
||||
-webkit-user-select:auto; /*webkit浏览器*/
|
||||
}
|
||||
//禁止选中----------------------------------------------------------
|
||||
|
||||
// 下拉框----------------------------------------------------------
|
||||
.select .ant-select-selector{
|
||||
height: 40px !important;
|
||||
border-radius: 8px !important;
|
||||
border: 1px solid #C7CBD2 !important;
|
||||
}
|
||||
.select .ant-select-selector .ant-select-selection-search-input{
|
||||
height: 40px !important;
|
||||
}
|
||||
.select .ant-select-selection-item,.select .ant-select-selection-placeholder{
|
||||
line-height: 40px !important;
|
||||
}
|
||||
//日期选择框
|
||||
.select .ant-picker{
|
||||
height: 40px !important;
|
||||
border-radius: 8px !important;
|
||||
border: 1px solid #C7CBD2 !important;
|
||||
}
|
||||
// 下拉框----------------------------------------------------------
|
||||
|
||||
|
||||
// 表格---------------------------------
|
||||
.tableBox{
|
||||
|
||||
.ant-table-row .ant-table-cell{
|
||||
height: 48px ;
|
||||
font-size: 14px;
|
||||
font-weight: 400;
|
||||
color: #4F5156;
|
||||
line-height: 36px;
|
||||
padding:0px ;
|
||||
// overflow: hidden;
|
||||
}
|
||||
.ant-table-row-expand-icon{
|
||||
top: 3px !important;
|
||||
float:none;
|
||||
position: relative;
|
||||
// left: 50px;
|
||||
// display: inline-block;
|
||||
}
|
||||
.ant-pagination-item-link {
|
||||
border-radius: 8px !important;
|
||||
}
|
||||
.ant-pagination-item {
|
||||
border-radius: 8px !important;
|
||||
a {
|
||||
font-size: 14px;
|
||||
font-weight: 400;
|
||||
color: #818a92;
|
||||
}
|
||||
}
|
||||
.ant-pagination-item-active {
|
||||
background-color: rgba(64, 158, 255, 1);
|
||||
a {
|
||||
color: rgba(255, 255, 255, 1);
|
||||
font-size: 14px;
|
||||
font-weight: 400;
|
||||
}
|
||||
}
|
||||
.ant-select-selection-item {
|
||||
font-size: 14px;
|
||||
font-weight: 400;
|
||||
color: #818a92;
|
||||
}
|
||||
.ant-pagination-options-quick-jumper {
|
||||
font-size: 14px;
|
||||
font-weight: 400;
|
||||
color: #818a92;
|
||||
}
|
||||
.ant-pagination-options {
|
||||
// .ant-select-focused:not(.ant-select-disabled).ant-select:not(.ant-select-customize-input) .ant-select-selector{
|
||||
// font-size: 14px;
|
||||
// font-weight: 400;
|
||||
// color: #818a92;
|
||||
// }
|
||||
.ant-select-single.ant-select-open .ant-select-selection-item{
|
||||
font-size: 14px;
|
||||
font-weight: 400;
|
||||
color: #818a92;
|
||||
}
|
||||
.ant-select:not(.ant-select-customize-input) .ant-select-selector{
|
||||
border-radius: 8px !important;
|
||||
}
|
||||
.ant-select-selection-item{
|
||||
padding-right: 0px !important;
|
||||
}
|
||||
.ant-select-arrow{
|
||||
display: none;
|
||||
}
|
||||
.ant-select-dropdown{
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -1,36 +1,130 @@
|
||||
<template>
|
||||
<div class="breadcrumb">
|
||||
<div style="margin-left: 21px">
|
||||
<el-breadcrumb separator="/">
|
||||
<el-breadcrumb-item :to="{ path: '/' }">homepage</el-breadcrumb-item>
|
||||
<el-breadcrumb-item
|
||||
><a href="/">promotion management</a></el-breadcrumb-item
|
||||
<a-breadcrumb>
|
||||
<a-breadcrumb-item v-for="(value, index) in list" :key="index">
|
||||
<router-link
|
||||
:to="value.href ? value.href : ''"
|
||||
:style="{ display: value.href ? 'inline-block' : 'none' }"
|
||||
>{{ value.name }}</router-link
|
||||
>
|
||||
<el-breadcrumb-item>promotion list</el-breadcrumb-item>
|
||||
<el-breadcrumb-item>promotion detail</el-breadcrumb-item>
|
||||
</el-breadcrumb>
|
||||
<span :style="{ display: value.href ? 'none' : 'inline-block' }">{{
|
||||
value.name
|
||||
}}</span>
|
||||
</a-breadcrumb-item>
|
||||
</a-breadcrumb>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import { reactive, toRefs } from "vue";
|
||||
import { reactive, toRefs, watch } from "vue";
|
||||
import { useRoute } from "vue-router";
|
||||
export default {
|
||||
name: "BreadCrumb",
|
||||
setup() {
|
||||
const state = reactive({});
|
||||
const state = reactive({
|
||||
list: [],
|
||||
});
|
||||
|
||||
const route = useRoute();
|
||||
watch(
|
||||
() => route.fullPath,
|
||||
(n, o) => {
|
||||
// console.log("监听路由");
|
||||
console.log("new:" + n + ",old:" + o);
|
||||
|
||||
if (n === "/learningpath" || n === "/LearningPath") {
|
||||
state.list = [
|
||||
{
|
||||
name: "学习路径",
|
||||
href: "",
|
||||
// href: "#/coursewaremanage",
|
||||
},
|
||||
];
|
||||
}
|
||||
if (n === "/projectmanage" || n === "/ProjectManage") {
|
||||
state.list = [
|
||||
{
|
||||
name: "项目中心",
|
||||
href: "",
|
||||
// href: "#/coursewaremanage",
|
||||
},
|
||||
{
|
||||
name: "项目",
|
||||
href: "",
|
||||
},
|
||||
];
|
||||
}
|
||||
if (n === "/projectadd" || n === "/ProjectAdd") {
|
||||
state.list = [
|
||||
{
|
||||
name: "项目",
|
||||
href: "/projectmanage",
|
||||
},
|
||||
{
|
||||
name: "创建项目",
|
||||
},
|
||||
];
|
||||
}
|
||||
if (n === "/templatelibrary" || n === "/TemplateLibrary") {
|
||||
state.list = [
|
||||
{
|
||||
name: "项目中心",
|
||||
},
|
||||
{
|
||||
name: "模板库",
|
||||
},
|
||||
];
|
||||
}
|
||||
if (n === "/coursemanage" || n === "/CourseManage") {
|
||||
state.list = [
|
||||
{
|
||||
name: "课程库",
|
||||
href: "",
|
||||
// href: "#/coursewaremanage",
|
||||
},
|
||||
{
|
||||
name: "课件管理",
|
||||
href: "",
|
||||
},
|
||||
];
|
||||
}
|
||||
if (n === "/coursewaremanage" || n === "/CoursewareManage") {
|
||||
state.list = [
|
||||
{
|
||||
name: "课程库",
|
||||
},
|
||||
{
|
||||
name: "课程管理",
|
||||
},
|
||||
];
|
||||
}
|
||||
}
|
||||
);
|
||||
|
||||
return {
|
||||
...toRefs(state),
|
||||
};
|
||||
},
|
||||
};
|
||||
</script>
|
||||
<style scoped lang="scss">
|
||||
<style lang="scss">
|
||||
.breadcrumb {
|
||||
width: 100%;
|
||||
height: 60px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
// background-color: rgba(255, 255, 255, 0.5);
|
||||
.el-breadcrumb__inner.is-link {
|
||||
font-size: 14px;
|
||||
font-weight: 400;
|
||||
color: #878b92 !important;
|
||||
line-height: 36px;
|
||||
}
|
||||
.el-breadcrumb__inner {
|
||||
font-size: 14px;
|
||||
font-weight: 400;
|
||||
color: #363636 !important;
|
||||
line-height: 36px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -18,203 +18,373 @@
|
||||
style="width: 100%; margin-top: 26px"
|
||||
:style="{ display: packup ? 'none' : 'block' }"
|
||||
>
|
||||
<el-row class="tac">
|
||||
<el-col :span="12">
|
||||
<el-menu
|
||||
default-active="1"
|
||||
class="el-menu-vertical-demo"
|
||||
@open="handleOpen"
|
||||
@close="handleClose"
|
||||
<a-menu
|
||||
id="dddddd"
|
||||
:open-keys="openKeys"
|
||||
:selectedKeys="selectedKeys"
|
||||
style="width: 208px"
|
||||
mode="inline"
|
||||
@openChange="onOpenChange"
|
||||
@select="selectItem"
|
||||
>
|
||||
<el-menu-item index="1">
|
||||
<a-menu-item key="sub1" @titleClick="titleClick">
|
||||
<div class="imgBox">
|
||||
<img
|
||||
style="width: 20px; height: 18px"
|
||||
src="../assets/images/navleft/studyPath.png"
|
||||
/>
|
||||
</div>
|
||||
<span class="title">学习路径</span>
|
||||
</el-menu-item>
|
||||
<el-sub-menu index="2">
|
||||
<template #title>
|
||||
<router-link to="/learningpath">学习路径</router-link>
|
||||
</a-menu-item>
|
||||
|
||||
<a-sub-menu key="sub2" @titleClick="titleClick">
|
||||
<template #icon>
|
||||
<div class="imgBox">
|
||||
<img
|
||||
style="width: 15px; height: 15px"
|
||||
src="../assets/images/navleft/project.png"
|
||||
/>
|
||||
</div>
|
||||
<span class="title">项目中心</span>
|
||||
</template>
|
||||
<el-menu-item index="2-1">
|
||||
<div class="circle"></div>
|
||||
<span>项目</span>
|
||||
</el-menu-item>
|
||||
<el-menu-item index="2-2">
|
||||
<div class="circleActive"></div>
|
||||
<span>模板库</span>
|
||||
</el-menu-item>
|
||||
</el-sub-menu>
|
||||
<template #title>项目中心</template>
|
||||
<a-menu-item key="sub2-1">
|
||||
<span
|
||||
:class="{
|
||||
circleActive: selectedKeys[0] === 'sub2-1' ? true : false,
|
||||
circle: selectedKeys[0] === 'sub2-1' ? false : true,
|
||||
}"
|
||||
></span>
|
||||
<router-link to="/projectmanage">项目</router-link>
|
||||
</a-menu-item>
|
||||
<a-menu-item key="sub2-2">
|
||||
<span
|
||||
:class="{
|
||||
circleActive: selectedKeys[0] === 'sub2-2' ? true : false,
|
||||
circle: selectedKeys[0] === 'sub2-2' ? false : true,
|
||||
}"
|
||||
></span>
|
||||
<router-link to="/templatelibrary">模板库</router-link>
|
||||
</a-menu-item>
|
||||
</a-sub-menu>
|
||||
|
||||
<el-sub-menu index="3">
|
||||
<template #title>
|
||||
<a-sub-menu key="sub3">
|
||||
<template #icon>
|
||||
<div class="imgBox">
|
||||
<img
|
||||
style="width: 18px; height: 15px"
|
||||
src="../assets/images/navleft/course.png"
|
||||
/>
|
||||
</div>
|
||||
<span class="title">课程库</span>
|
||||
</template>
|
||||
<el-menu-item index="3-1">
|
||||
<div class="circle"></div>
|
||||
<span>课件管理</span>
|
||||
</el-menu-item>
|
||||
<el-menu-item index="3-2">
|
||||
<div class="circleActive"></div>
|
||||
<span>课程管理</span>
|
||||
</el-menu-item>
|
||||
</el-sub-menu>
|
||||
<template #title>课程库</template>
|
||||
<a-menu-item key="sub3-1">
|
||||
<span
|
||||
:class="{
|
||||
circleActive: selectedKeys[0] === 'sub3-1' ? true : false,
|
||||
circle: selectedKeys[0] === 'sub3-1' ? false : true,
|
||||
}"
|
||||
></span>
|
||||
<router-link to="/coursemanage">课件管理</router-link>
|
||||
</a-menu-item>
|
||||
<a-menu-item key="sub3-2">
|
||||
<span
|
||||
:class="{
|
||||
circleActive: selectedKeys[0] === 'sub3-2' ? true : false,
|
||||
circle: selectedKeys[0] === 'sub3-2' ? false : true,
|
||||
}"
|
||||
></span>
|
||||
<router-link to="/coursewaremanage">课程管理</router-link>
|
||||
</a-menu-item>
|
||||
</a-sub-menu>
|
||||
|
||||
<el-menu-item index="4">
|
||||
<a-menu-item key="sub4" @titleClick="titleClick">
|
||||
<div class="imgBox">
|
||||
<img
|
||||
style="width: 19px; height: 19px"
|
||||
src="../assets/images/navleft/exam.png"
|
||||
/>
|
||||
</div>
|
||||
<span class="title">考试中心</span>
|
||||
</el-menu-item>
|
||||
<span>考试中心</span>
|
||||
</a-menu-item>
|
||||
|
||||
<el-menu-item index="5">
|
||||
<a-menu-item key="sub5" @titleClick="titleClick">
|
||||
<div class="imgBox">
|
||||
<img
|
||||
style="width: 16px; height: 16px"
|
||||
src="../assets/images/navleft/survey.png"
|
||||
/>
|
||||
</div>
|
||||
<span class="title">调研管理</span>
|
||||
</el-menu-item>
|
||||
<span>调研管理</span>
|
||||
</a-menu-item>
|
||||
|
||||
<el-menu-item index="6">
|
||||
<a-menu-item key="sub6" @titleClick="titleClick">
|
||||
<div class="imgBox">
|
||||
<img
|
||||
style="width: 17px; height: 15px"
|
||||
src="../assets/images/navleft/report.png"
|
||||
/>
|
||||
</div>
|
||||
<span class="title">报表中心</span>
|
||||
</el-menu-item>
|
||||
<el-menu-item index="7">
|
||||
<span>报表中心</span>
|
||||
</a-menu-item>
|
||||
|
||||
<a-menu-item key="sub7" @titleClick="titleClick">
|
||||
<div class="imgBox">
|
||||
<img
|
||||
style="width: 17px; height: 18px"
|
||||
src="../assets/images/navleft/teacher.png"
|
||||
/>
|
||||
</div>
|
||||
<span class="title">教师管理</span>
|
||||
</el-menu-item>
|
||||
<el-menu-item index="8">
|
||||
<span>教师管理</span>
|
||||
</a-menu-item>
|
||||
|
||||
<a-menu-item key="sub8" @titleClick="titleClick">
|
||||
<div class="imgBox">
|
||||
<img
|
||||
style="width: 20px; height: 20px"
|
||||
src="../assets/images/navleft/certificate.png"
|
||||
/>
|
||||
</div>
|
||||
<span class="title">证书中心</span>
|
||||
</el-menu-item>
|
||||
<el-menu-item index="9">
|
||||
<span>证书中心</span>
|
||||
</a-menu-item>
|
||||
<a-menu-item key="sub9" @titleClick="titleClick">
|
||||
<div class="imgBox">
|
||||
<img
|
||||
style="width: 19px; height: 18px"
|
||||
src="../assets/images/navleft/system.png"
|
||||
/>
|
||||
</div>
|
||||
<span class="title">系统管理</span>
|
||||
</el-menu-item>
|
||||
</el-menu>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<span>系统管理</span>
|
||||
</a-menu-item>
|
||||
</a-menu>
|
||||
</div>
|
||||
<div
|
||||
style="width: 100%; margin-top: 26px"
|
||||
:style="{ display: packup ? 'block' : 'none' }"
|
||||
class="packupMenu"
|
||||
>
|
||||
<el-row class="tac">
|
||||
<el-col :span="12">
|
||||
<el-menu
|
||||
default-active="1"
|
||||
class="el-menu-vertical-demo"
|
||||
@open="handleOpen"
|
||||
@close="handleClose"
|
||||
<a-menu
|
||||
id="dddddd"
|
||||
v-model:openKeys="openKeys2"
|
||||
v-model:selectedKeys="selectedKeys2"
|
||||
style="width: 100px"
|
||||
mode="inline"
|
||||
@click="handleClick"
|
||||
>
|
||||
<el-menu-item index="1">
|
||||
<span class="title">学习</span>
|
||||
</el-menu-item>
|
||||
<el-menu-item index="2">
|
||||
<span class="title">项目</span>
|
||||
</el-menu-item>
|
||||
<el-menu-item index="3">
|
||||
<span class="title">课程</span>
|
||||
</el-menu-item>
|
||||
<a-menu-item key="sub1" @titleClick="titleClick">
|
||||
<router-link to="/learningpath">学习</router-link>
|
||||
</a-menu-item>
|
||||
|
||||
<el-menu-item index="4">
|
||||
<span class="title">考试</span>
|
||||
</el-menu-item>
|
||||
<a-menu-item key="sub2" @titleClick="titleClick">
|
||||
<router-link to="/projectmanage">项目</router-link>
|
||||
</a-menu-item>
|
||||
|
||||
<el-menu-item index="5">
|
||||
<span class="title">调研</span>
|
||||
</el-menu-item>
|
||||
<a-menu-item key="sub3" @titleClick="titleClick">
|
||||
<router-link to="/coursewaremanage">课程</router-link>
|
||||
</a-menu-item>
|
||||
|
||||
<el-menu-item index="6">
|
||||
<span class="title">报表</span>
|
||||
</el-menu-item>
|
||||
<el-menu-item index="7">
|
||||
<span class="title">教师</span>
|
||||
</el-menu-item>
|
||||
<el-menu-item index="8">
|
||||
<span class="title">证书</span>
|
||||
</el-menu-item>
|
||||
<el-menu-item index="9">
|
||||
<span class="title">系统</span>
|
||||
</el-menu-item>
|
||||
</el-menu>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<a-menu-item key="sub4" @titleClick="titleClick">
|
||||
<span>考试</span>
|
||||
</a-menu-item>
|
||||
|
||||
<a-menu-item key="sub5" @titleClick="titleClick">
|
||||
<span>调研</span>
|
||||
</a-menu-item>
|
||||
|
||||
<a-menu-item key="sub6" @titleClick="titleClick">
|
||||
<span>报表</span>
|
||||
</a-menu-item>
|
||||
|
||||
<a-menu-item key="sub7" @titleClick="titleClick">
|
||||
<span>教师</span>
|
||||
</a-menu-item>
|
||||
|
||||
<a-menu-item key="sub8" @titleClick="titleClick">
|
||||
<span>证书</span>
|
||||
</a-menu-item>
|
||||
<a-menu-item key="sub9" @titleClick="titleClick">
|
||||
<span>系统</span>
|
||||
</a-menu-item>
|
||||
</a-menu>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { reactive, toRefs, onMounted, onUnmounted } from "vue";
|
||||
import { reactive, toRefs, onMounted, onUnmounted, watch } from "vue";
|
||||
import { useRoute } from "vue-router";
|
||||
import { useStore } from "vuex";
|
||||
export default {
|
||||
name: "NavLeft",
|
||||
setup() {
|
||||
const store = useStore();
|
||||
const state = reactive({
|
||||
packup: false,
|
||||
screenHeight: document.body.clientHeight, // 屏幕高度
|
||||
rootSubmenuKeys: [
|
||||
"sub1",
|
||||
"sub2",
|
||||
"sub3",
|
||||
"sub4",
|
||||
"sub5",
|
||||
"sub6",
|
||||
"sub7",
|
||||
"sub8",
|
||||
"sub9",
|
||||
],
|
||||
openKeys: localStorage.getItem("openKeys")
|
||||
? JSON.parse(localStorage.getItem("openKeys"))
|
||||
: ["sub1"], //默认打开以及打开的一级导航
|
||||
selectedKeys: localStorage.getItem("selectedKeys")
|
||||
? JSON.parse(localStorage.getItem("selectedKeys"))
|
||||
: ["sub1"], //默认选择以及选择的二级导航
|
||||
openKeys2: localStorage.getItem("openKeys")
|
||||
? JSON.parse(localStorage.getItem("openKeys"))
|
||||
: ["sub1"], //默认打开以及打开的一级导航
|
||||
selectedKeys2: localStorage.getItem("openKeys")
|
||||
? JSON.parse(localStorage.getItem("openKeys"))
|
||||
: ["sub1"], //默认选择以及选择的二级导航
|
||||
|
||||
keysList: [
|
||||
{
|
||||
href: "/learningpath",
|
||||
openKeys: "sub1",
|
||||
selectedKeys: "sub1",
|
||||
pagename: "学习路径",
|
||||
},
|
||||
{
|
||||
href: "/projectmanage",
|
||||
openKeys: "sub2",
|
||||
selectedKeys: "sub2-1",
|
||||
pagename: "项目",
|
||||
},
|
||||
{
|
||||
href: "/projectadd",
|
||||
openKeys: "sub2",
|
||||
selectedKeys: "sub2-1",
|
||||
pagename: "创建项目",
|
||||
},
|
||||
{
|
||||
href: "/templatelibrary",
|
||||
openKeys: "sub2",
|
||||
selectedKeys: "sub2-2",
|
||||
pagename: "模板库",
|
||||
},
|
||||
{
|
||||
href: "/coursemanage",
|
||||
openKeys: "sub3",
|
||||
selectedKeys: "sub3-1",
|
||||
pagename: "课件管理",
|
||||
},
|
||||
{
|
||||
href: "/coursewaremanage",
|
||||
openKeys: "sub3",
|
||||
selectedKeys: "sub3-2",
|
||||
pagename: "课程管理",
|
||||
},
|
||||
],
|
||||
});
|
||||
const handleOpen = (key, keyPath) => {
|
||||
console.log(key, keyPath);
|
||||
|
||||
// console.log(state.openKeys, state.selectedKeys);
|
||||
|
||||
const onOpenChange = (openKeys) => {
|
||||
const latestOpenKey = openKeys.find(
|
||||
(key) => state.openKeys.indexOf(key) === -1
|
||||
);
|
||||
if (state.rootSubmenuKeys.indexOf(latestOpenKey) === -1) {
|
||||
state.openKeys = openKeys;
|
||||
} else {
|
||||
state.openKeys = latestOpenKey ? [latestOpenKey] : [];
|
||||
}
|
||||
};
|
||||
const handleClose = (key, keyPath) => {
|
||||
console.log(key, keyPath);
|
||||
const selectItem = (e) => {
|
||||
// console.log("onSelect", e, );
|
||||
let arr = state.keysList;
|
||||
arr.map((value) => {
|
||||
if (e.key === value.selectedKeys) {
|
||||
localStorage.setItem("openKeys", JSON.stringify([value.openKeys]));
|
||||
localStorage.setItem(
|
||||
"selectedKeys",
|
||||
JSON.stringify([value.selectedKeys])
|
||||
);
|
||||
state.openKeys = [value.openKeys];
|
||||
state.selectedKeys = [value.selectedKeys];
|
||||
state.openKeys2 = [value.openKeys];
|
||||
state.selectedKeys2 = [value.openKeys];
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
const route = useRoute();
|
||||
watch(
|
||||
() => route.fullPath,
|
||||
(n) => {
|
||||
console.log("监听路由", n, store.state.openpages);
|
||||
// console.log("new:" + n.toLowerCase() + ",old:" + o);
|
||||
let arr = state.keysList;
|
||||
arr.map((value) => {
|
||||
if (n.toLowerCase() === value.href) {
|
||||
localStorage.setItem("openKeys", JSON.stringify([value.openKeys]));
|
||||
localStorage.setItem(
|
||||
"selectedKeys",
|
||||
JSON.stringify([value.selectedKeys])
|
||||
);
|
||||
state.openKeys = [value.openKeys];
|
||||
state.selectedKeys = [value.selectedKeys];
|
||||
state.openKeys2 = [value.openKeys];
|
||||
state.selectedKeys2 = [value.openKeys];
|
||||
}
|
||||
});
|
||||
let openpages = store.state.openpages;
|
||||
for (let i = 0; i < openpages.length; i++) {
|
||||
openpages[i].active = false;
|
||||
}
|
||||
for (let i = 0; i < openpages.length; i++) {
|
||||
openpages[i].active = false;
|
||||
if (n.toLowerCase() === openpages[i].href) {
|
||||
console.log("已存在", openpages[i]);
|
||||
openpages[i].active = true;
|
||||
break;
|
||||
} else {
|
||||
if (i === openpages.length - 1) {
|
||||
let pagename = state.keysList.filter((a) => {
|
||||
return a.href === n.toLowerCase();
|
||||
});
|
||||
if (pagename && pagename.length !== 0) {
|
||||
let obj = {
|
||||
pagename: pagename[0].pagename,
|
||||
href: n.toLowerCase(),
|
||||
active: true,
|
||||
};
|
||||
openpages.push(obj);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
localStorage.setItem("openpages", JSON.stringify(openpages));
|
||||
store.commit("chengeOpenpages", openpages);
|
||||
|
||||
// store.getters.chengeOpenpages(openpages)
|
||||
}
|
||||
);
|
||||
const packUp = () => {
|
||||
state.packup = !state.packup;
|
||||
};
|
||||
const getMousePosition = () => {
|
||||
state.screenHeight = document.body.clientHeight;
|
||||
};
|
||||
|
||||
onMounted(() => {
|
||||
// console.log("11111", 1);
|
||||
window.addEventListener("resize", getMousePosition, false);
|
||||
// judgeUrl();
|
||||
});
|
||||
onUnmounted(() => {
|
||||
window.removeEventListener("resize", getMousePosition, false);
|
||||
});
|
||||
return {
|
||||
...toRefs(state),
|
||||
handleOpen,
|
||||
handleClose,
|
||||
onOpenChange,
|
||||
selectItem,
|
||||
packUp,
|
||||
};
|
||||
},
|
||||
@@ -227,6 +397,7 @@ export default {
|
||||
background: linear-gradient(0deg, #a9e9f7 0%, #388be1 73%);
|
||||
box-shadow: 0px 1px 35px 0px rgba(118, 136, 166, 0.21);
|
||||
// margin-top: -50px;
|
||||
flex-shrink: 0;
|
||||
.packup {
|
||||
width: 19px;
|
||||
height: 15px;
|
||||
@@ -234,21 +405,57 @@ export default {
|
||||
margin-right: 14px;
|
||||
cursor: pointer;
|
||||
}
|
||||
//修改导航栏大小
|
||||
.el-row {
|
||||
width: 100%;
|
||||
}
|
||||
.el-col-12 {
|
||||
width: 100%;
|
||||
max-width: 100%;
|
||||
flex: 1;
|
||||
}
|
||||
//修改导航栏背景颜色
|
||||
.el-menu {
|
||||
background-color: rgba(56, 139, 225, 0);
|
||||
|
||||
//修改导航栏背景颜色
|
||||
.ant-menu {
|
||||
background-color: rgba(56, 139, 225, 0);
|
||||
border: none;
|
||||
box-shadow: none;
|
||||
}
|
||||
//图标和字放在一行
|
||||
.ant-menu-title-content {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
.packupMenu .ant-menu-title-content {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
//修改导航文字颜色
|
||||
.ant-menu-title-content {
|
||||
padding: 0px !important;
|
||||
// padding-left: 27px !important;
|
||||
font-size: 16px;
|
||||
font-weight: 400;
|
||||
color: #ffffff;
|
||||
line-height: 36px;
|
||||
border-right: 3px solid rgba(255, 255, 255, 0);
|
||||
margin-left: 0 !important;
|
||||
}
|
||||
.ant-menu-item a,
|
||||
.ant-menu-item a:hover {
|
||||
font-size: 16px;
|
||||
font-weight: 400;
|
||||
color: #ffffff;
|
||||
line-height: 36px;
|
||||
}
|
||||
//修改二级导航背景色
|
||||
.ant-menu-sub.ant-menu-inline {
|
||||
background-color: rgba(56, 139, 225, 0);
|
||||
border: none;
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
//修改左侧padding
|
||||
.ant-menu-item,
|
||||
.ant-menu-submenu-title {
|
||||
padding-left: 27px !important;
|
||||
height: 49px !important;
|
||||
line-height: 49px !important;
|
||||
margin: 0px !important;
|
||||
}
|
||||
|
||||
//左侧图标
|
||||
.imgBox {
|
||||
width: 20px;
|
||||
@@ -256,70 +463,49 @@ export default {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
margin-right: 15px;
|
||||
}
|
||||
.title {
|
||||
margin-left: 12px;
|
||||
margin-top: 1px;
|
||||
.ant-menu-submenu-arrow {
|
||||
color: rgba(255, 255, 255, 1) !important;
|
||||
right: 14px !important;
|
||||
}
|
||||
//修改一级导航文字颜色
|
||||
.el-sub-menu__title {
|
||||
padding: 0px !important;
|
||||
padding-left: 27px !important;
|
||||
font-size: 16px;
|
||||
font-weight: 400;
|
||||
color: #ffffff;
|
||||
line-height: 36px;
|
||||
border-right: 3px solid rgba(255, 255, 255, 0);
|
||||
}
|
||||
//修改箭头图标位置
|
||||
.el-sub-menu .el-sub-menu__icon-arrow {
|
||||
right: 14px;
|
||||
}
|
||||
//修改箭头图标大小
|
||||
.el-icon svg {
|
||||
font-weight: 800;
|
||||
font-size: 16px;
|
||||
}
|
||||
// 鼠标划上背景颜色
|
||||
.el-sub-menu__title:hover {
|
||||
// .ant-menu-submenu-active .ant-menu-submenu-arrow {
|
||||
// right: 11px !important;
|
||||
// }
|
||||
//划上背景
|
||||
.ant-menu-item-active {
|
||||
background: rgba(236, 245, 255, 0.43) !important;
|
||||
border-right: 3px solid rgba(255, 255, 255, 1);
|
||||
}
|
||||
// 鼠标划上背景颜色
|
||||
.el-menu-item:hover {
|
||||
//选中背景
|
||||
.ant-menu-item-selected {
|
||||
background: rgba(236, 245, 255, 0.43) !important;
|
||||
border-right: 3px solid rgba(255, 255, 255, 1);
|
||||
}
|
||||
// 点击选中背景色
|
||||
.el-menu-item.is-active {
|
||||
background: rgba(236, 245, 255, 0.43) !important;
|
||||
border-right: 3px solid rgba(255, 255, 255, 1);
|
||||
}
|
||||
.el-menu-item {
|
||||
height: 49px;
|
||||
padding: 0px !important;
|
||||
padding-left: 27px !important;
|
||||
font-size: 16px;
|
||||
font-weight: 400;
|
||||
color: #ffffff;
|
||||
line-height: 36px;
|
||||
border-right: 3px solid rgba(255, 255, 255, 0);
|
||||
.ant-menu-vertical .ant-menu-item::after,
|
||||
.ant-menu-vertical-left .ant-menu-item::after,
|
||||
.ant-menu-vertical-right .ant-menu-item::after,
|
||||
.ant-menu-inline .ant-menu-item::after {
|
||||
border-right: 0px;
|
||||
}
|
||||
|
||||
.circle {
|
||||
width: 10px;
|
||||
height: 10px;
|
||||
border-radius: 5px;
|
||||
border: 2px solid rgba(255, 255, 255, 1);
|
||||
margin-left: 24px;
|
||||
margin-right: 18px;
|
||||
display: inline-block;
|
||||
}
|
||||
.circleActive {
|
||||
width: 10px;
|
||||
height: 10px;
|
||||
border-radius: 5px;
|
||||
background-color: rgba(255, 255, 255, 1);
|
||||
margin-left: 24px;
|
||||
margin-right: 18px;
|
||||
}
|
||||
.circleActive {
|
||||
width: 6px;
|
||||
height: 6px;
|
||||
border-radius: 5px;
|
||||
border: 2px solid rgba(255, 255, 255, 1);
|
||||
margin-left: 24px;
|
||||
margin-right: 18px;
|
||||
display: inline-block;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -7,11 +7,18 @@
|
||||
/>
|
||||
<div class="navTopRight">
|
||||
<div class="role">
|
||||
<div>管理员</div>
|
||||
<img
|
||||
style="width: 13px; height: 7px; margin-left: 8px"
|
||||
src="../assets/images/navtop/down.png"
|
||||
/>
|
||||
<div>{{ selectRole }}</div>
|
||||
<div class="roleArrow"></div>
|
||||
<div class="roleItems">
|
||||
<div
|
||||
v-for="(value, index) in roleList"
|
||||
:key="index"
|
||||
class="roleItem"
|
||||
@click="changeRole(value)"
|
||||
>
|
||||
{{ value.name }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="user">
|
||||
<img
|
||||
@@ -44,9 +51,29 @@ import { reactive, toRefs } from "vue";
|
||||
export default {
|
||||
name: "NavTop",
|
||||
setup() {
|
||||
const state = reactive({});
|
||||
const state = reactive({
|
||||
selectRole: "管理员",
|
||||
roleList: [
|
||||
{
|
||||
id: 1,
|
||||
name: "管理员",
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
name: "学员",
|
||||
},
|
||||
],
|
||||
});
|
||||
const changeRole = (value) => {
|
||||
state.roleList.map((item) => {
|
||||
if (value.name === item.name) {
|
||||
state.selectRole = item.name;
|
||||
}
|
||||
});
|
||||
};
|
||||
return {
|
||||
...toRefs(state),
|
||||
changeRole,
|
||||
};
|
||||
},
|
||||
};
|
||||
@@ -75,6 +102,41 @@ export default {
|
||||
color: #333330;
|
||||
line-height: 36px;
|
||||
cursor: pointer;
|
||||
position: relative;
|
||||
.roleArrow {
|
||||
width: 13px;
|
||||
height: 7px;
|
||||
margin-left: 8px;
|
||||
background-image: url(../assets/images/navtop/down.png);
|
||||
background-size: 100%;
|
||||
}
|
||||
.roleItems {
|
||||
width: 109px;
|
||||
height: 80px;
|
||||
padding-top: 10px;
|
||||
background: #ffffff;
|
||||
box-shadow: 0px 1px 35px 0px rgba(118, 136, 166, 0.21);
|
||||
position: absolute;
|
||||
top: 60px;
|
||||
right: 0px;
|
||||
text-align: center;
|
||||
display: none;
|
||||
}
|
||||
.roleItem {
|
||||
font-size: 14px;
|
||||
font-weight: 400;
|
||||
color: rgba(79, 81, 86, 1);
|
||||
line-height: 36px;
|
||||
}
|
||||
.roleItem:hover {
|
||||
color: #4ea6ff;
|
||||
}
|
||||
}
|
||||
.role:hover .roleItems {
|
||||
display: block;
|
||||
}
|
||||
.role:hover .roleArrow {
|
||||
background-image: url(../assets/images/navtop/up.png);
|
||||
}
|
||||
.user {
|
||||
margin-left: 37px;
|
||||
|
||||
@@ -1,14 +1,67 @@
|
||||
<template>
|
||||
<div class="openPages">12345</div>
|
||||
<div class="openPages">
|
||||
<div
|
||||
v-for="(value, index) in openList"
|
||||
:key="index"
|
||||
style="position: relative"
|
||||
>
|
||||
<router-link
|
||||
:to="value.href"
|
||||
class="openItems"
|
||||
:style="{ background: value.active ? '#f5f7fa' : '' }"
|
||||
>
|
||||
<div
|
||||
:style="{
|
||||
color: value.active
|
||||
? 'rgba(64, 158, 255, 1)'
|
||||
: 'rgba(135, 139, 146, 1)',
|
||||
}"
|
||||
>
|
||||
{{ value.pagename }}
|
||||
</div>
|
||||
</router-link>
|
||||
<div class="close" @click.stop="closePage(value)">
|
||||
<img src="../assets/images/openPages/close.png" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import { reactive, toRefs } from "vue";
|
||||
import { useStore } from "vuex";
|
||||
import { useRouter } from "vue-router";
|
||||
export default {
|
||||
name: "OpenPages",
|
||||
setup() {
|
||||
const state = reactive({});
|
||||
const store = useStore();
|
||||
const $router = useRouter();
|
||||
const state = reactive({
|
||||
openList: store.state.openpages,
|
||||
});
|
||||
|
||||
const closePage = (value) => {
|
||||
console.log("点击关闭页面", value, state.openList);
|
||||
state.openList.map((item, key) => {
|
||||
if (item.href === value.href) {
|
||||
if (state.openList.length === 1) {
|
||||
state.openList.splice(key, 1);
|
||||
$router.push({ path: "/learningpath" });
|
||||
} else {
|
||||
if (key === state.openList.length - 1) {
|
||||
$router.push({ path: state.openList[key - 1].href });
|
||||
state.openList.splice(key, 1);
|
||||
} else {
|
||||
$router.push({ path: state.openList[key + 1].href });
|
||||
state.openList.splice(key, 1);
|
||||
}
|
||||
}
|
||||
}
|
||||
});
|
||||
store.commit("chengeOpenpages", state.openList);
|
||||
};
|
||||
return {
|
||||
...toRefs(state),
|
||||
closePage,
|
||||
};
|
||||
},
|
||||
};
|
||||
@@ -17,8 +70,38 @@ export default {
|
||||
.openPages {
|
||||
width: 100%;
|
||||
height: 50px;
|
||||
// display: flex;
|
||||
display: flex;
|
||||
background-color: rgba(255, 255, 255, 1);
|
||||
box-shadow: 0px 8px 8px 0px rgba(118, 136, 166, 0.1);
|
||||
overflow-x: auto;
|
||||
.openItems {
|
||||
width: 272px;
|
||||
height: 50px;
|
||||
border: 1px solid #edf2fa;
|
||||
border-left: 0px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
font-size: 16px;
|
||||
font-weight: 400;
|
||||
line-height: 36px;
|
||||
cursor: pointer;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
.close {
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
border-radius: 8px;
|
||||
|
||||
position: absolute;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
top: 17px;
|
||||
right: 27px;
|
||||
}
|
||||
.close:hover {
|
||||
background: rgba(220, 220, 220, 1);
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
19
src/main.js
19
src/main.js
@@ -2,12 +2,19 @@ import { createApp } from 'vue'
|
||||
import App from './App.vue'
|
||||
import router from './router'
|
||||
import store from './store'
|
||||
import ElementPlus from 'element-plus'
|
||||
// import ElementPlus from 'element-plus'
|
||||
import 'element-plus/dist/index.css'
|
||||
import zhCn from 'element-plus/es/locale/lang/zh-cn'
|
||||
// import zhCn from 'element-plus/es/locale/lang/zh-cn'
|
||||
import "@/assets/scss/common.scss"
|
||||
import Antd from 'ant-design-vue';
|
||||
import 'ant-design-vue/dist/antd.css';
|
||||
// import zhCN from 'ant-design-vue/es/locale/zh_CN';
|
||||
const app = createApp(App)
|
||||
app.use(store).use(router).mount('#app')
|
||||
app.use(ElementPlus, {
|
||||
locale: zhCn,
|
||||
})
|
||||
// app.use(ElementPlus, {
|
||||
// locale: zhCn,
|
||||
// })
|
||||
app.use(Antd);
|
||||
app.use(router);
|
||||
app.use(store);
|
||||
|
||||
app.mount('#app')
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
import { createRouter, createWebHashHistory } from 'vue-router';
|
||||
import routesConfig from './config';
|
||||
// console.log('routesConfig', routesConfig)
|
||||
console.log('routesConfig', routesConfig)
|
||||
|
||||
const routes = [
|
||||
{
|
||||
|
||||
@@ -2,10 +2,20 @@ import { createStore } from 'vuex'
|
||||
|
||||
export default createStore({
|
||||
state: {
|
||||
openpages: localStorage.getItem('openpages') ? JSON.parse(localStorage.getItem('openpages')) : [{
|
||||
pagename: "学习路径",
|
||||
href: "/learningpath",
|
||||
active: true,
|
||||
},]
|
||||
},
|
||||
getters: {
|
||||
|
||||
},
|
||||
mutations: {
|
||||
chengeOpenpages(state, list) {
|
||||
// console.log('list', list)
|
||||
state.openpages = list
|
||||
}
|
||||
},
|
||||
actions: {
|
||||
},
|
||||
|
||||
0
src/views/certificate/CertificateCenter.vue
Normal file
0
src/views/certificate/CertificateCenter.vue
Normal file
@@ -1,52 +1,561 @@
|
||||
<!-- 课件管理页面 -->
|
||||
<template>
|
||||
<div class="courseManage">
|
||||
<nav-top />
|
||||
<div style="display: flex">
|
||||
<nav-left />
|
||||
<div style="flex: 1; display: flex; flex-direction: column">
|
||||
<open-pages />
|
||||
<bread-crumb />
|
||||
<div class="cmMain">
|
||||
<div
|
||||
style="
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background-color: #fff;
|
||||
box-shadow: 0px 1px 35px 0px rgba(118, 136, 166, 0.07);
|
||||
"
|
||||
></div>
|
||||
<!-- 搜索框及按钮 -->
|
||||
<div class="filter">
|
||||
<div class="filterItems">
|
||||
<div class="select">
|
||||
<a-select
|
||||
v-model:value="projectName"
|
||||
style="width: 270px"
|
||||
placeholder="请输入项目名称"
|
||||
:options="projectNameList"
|
||||
@change="selectProjectName"
|
||||
allowClear
|
||||
showSearch
|
||||
></a-select>
|
||||
</div>
|
||||
<div class="select">
|
||||
<a-select
|
||||
v-model:value="projectName"
|
||||
style="width: 270px"
|
||||
placeholder="请输入项目经理"
|
||||
:options="projectNameList"
|
||||
@change="selectProjectName"
|
||||
allowClear
|
||||
showSearch
|
||||
></a-select>
|
||||
</div>
|
||||
<div class="select">
|
||||
<a-select
|
||||
v-model:value="projectName"
|
||||
style="width: 270px"
|
||||
placeholder="请选择状态"
|
||||
:options="projectNameList"
|
||||
@change="selectProjectName"
|
||||
allowClear
|
||||
showSearch
|
||||
></a-select>
|
||||
</div>
|
||||
<div class="select">
|
||||
<a-date-picker
|
||||
v-model="selectTime"
|
||||
type="date"
|
||||
placeholder="创建时间"
|
||||
style="width: 270px"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div class="btns">
|
||||
<div class="btn btn1">
|
||||
<div class="search"></div>
|
||||
<div class="btnText">搜索</div>
|
||||
</div>
|
||||
<div class="btn btn2">
|
||||
<div class="search"></div>
|
||||
<div class="btnText">重置</div>
|
||||
</div>
|
||||
<div class="btn btn3">
|
||||
<div class="search"></div>
|
||||
<div class="btnText">创建项目</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- 搜索框及按钮 -->
|
||||
<!-- 表格 -->
|
||||
<div class="tableBox">
|
||||
<a-table
|
||||
:columns="columns"
|
||||
:data-source="tableData"
|
||||
:loading="tableDataTotal === -1 ? true : false"
|
||||
:scroll="{ x: 700, y: 800 }"
|
||||
expandRowByClick="true"
|
||||
@expand="expandTable"
|
||||
:pagination="{
|
||||
showSizeChanger: true,
|
||||
showQuickJumper: true,
|
||||
hideOnSinglePage: true,
|
||||
pageSizeOptions: [],
|
||||
pageSize: pageSize,
|
||||
current: currentPage,
|
||||
total: tableDataTotal,
|
||||
onChange: (page, pageSize) => {
|
||||
currentPage = page;
|
||||
// console.log('page', page)
|
||||
// 加翻页查找代码
|
||||
// this.setState({
|
||||
// currentPage: page,
|
||||
// }, () => {
|
||||
// this.getMilitaryDeployment()
|
||||
// })
|
||||
},
|
||||
}"
|
||||
/>
|
||||
</div>
|
||||
<!-- 表格 -->
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import { reactive, toRefs } from "vue";
|
||||
import NavLeft from "@/components/NavLeft";
|
||||
import NavTop from "@/components/NavTop";
|
||||
import OpenPages from "@/components/OpenPages";
|
||||
import BreadCrumb from "@/components/BreadCrumb";
|
||||
import { reactive, toRefs, onMounted, ref } from "vue";
|
||||
const columns = [
|
||||
{
|
||||
title: "项目名称",
|
||||
dataIndex: "projectName",
|
||||
key: "projectName",
|
||||
width: 280,
|
||||
// align: "center",
|
||||
ellipsis: true,
|
||||
// scopedSlots: { customRender: "action" }, //引入的插槽
|
||||
// customRender: (text, record) => {
|
||||
// console.log(text, record);
|
||||
// return <span>{text.text}</span>;
|
||||
// },
|
||||
},
|
||||
{
|
||||
title: "项目经理",
|
||||
dataIndex: "manager",
|
||||
key: "manager",
|
||||
width: 100,
|
||||
align: "center",
|
||||
},
|
||||
{
|
||||
title: "状态",
|
||||
dataIndex: "state",
|
||||
// width: "30%",
|
||||
key: "state",
|
||||
width: 100,
|
||||
align: "center",
|
||||
},
|
||||
{
|
||||
title: "创建人",
|
||||
dataIndex: "creater",
|
||||
// width: "30%",
|
||||
key: "creater",
|
||||
width: 100,
|
||||
align: "center",
|
||||
},
|
||||
{
|
||||
title: "创建时间",
|
||||
dataIndex: "time",
|
||||
key: "time",
|
||||
width: 180,
|
||||
align: "center",
|
||||
},
|
||||
{
|
||||
title: "操作",
|
||||
dataIndex: "opacation",
|
||||
key: "opacation",
|
||||
width: 300,
|
||||
align: "center",
|
||||
},
|
||||
];
|
||||
const rowSelection = ref({
|
||||
checkStrictly: false,
|
||||
onChange: (selectedRowKeys, selectedRows) => {
|
||||
console.log(
|
||||
`selectedRowKeys: ${selectedRowKeys}`,
|
||||
"selectedRows: ",
|
||||
selectedRows
|
||||
);
|
||||
},
|
||||
onSelect: (record, selected, selectedRows) => {
|
||||
console.log(record, selected, selectedRows);
|
||||
},
|
||||
onSelectAll: (selected, selectedRows, changeRows) => {
|
||||
console.log(selected, selectedRows, changeRows);
|
||||
},
|
||||
});
|
||||
export default {
|
||||
name: "CourseManage",
|
||||
components: {
|
||||
NavLeft,
|
||||
NavTop,
|
||||
OpenPages,
|
||||
BreadCrumb,
|
||||
},
|
||||
|
||||
setup() {
|
||||
const state = reactive({});
|
||||
const state = reactive({
|
||||
projectNameList: [
|
||||
{
|
||||
id: 1,
|
||||
value: "项目一",
|
||||
label: "项目一",
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
value: "项目二",
|
||||
label: "项目二",
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
value: "项目三",
|
||||
label: "项目三",
|
||||
},
|
||||
{
|
||||
id: 4,
|
||||
value: "项目四",
|
||||
label: "项目四",
|
||||
},
|
||||
],
|
||||
projectName: null,
|
||||
selectTime: null,
|
||||
|
||||
tableData: [
|
||||
{
|
||||
key: 1,
|
||||
projectName:
|
||||
"管理者进阶1管理者进阶1管理者进阶1管理者进阶1管理者进阶1管理者进阶1管理者进阶1",
|
||||
manager: "黄华 刘俊",
|
||||
state: "草稿",
|
||||
creater: "毛继禹",
|
||||
time: "2022-07-20 14:00:03",
|
||||
children: [
|
||||
{
|
||||
key: 5,
|
||||
projectName: "管理者进阶5",
|
||||
manager: "黄华 刘俊",
|
||||
state: "草稿",
|
||||
creater: "毛继禹",
|
||||
time: "2022-07-20 14:00:03",
|
||||
children: [
|
||||
{
|
||||
key: 7,
|
||||
projectName:
|
||||
"管理者进阶7管理者进阶7管理者进阶7管理者进阶7管理者进阶7管理者进阶7管理者进阶7",
|
||||
manager: "黄华 刘俊",
|
||||
state: "草稿",
|
||||
creater: "毛继禹",
|
||||
time: "2022-07-20 14:00:03",
|
||||
},
|
||||
{
|
||||
key: 8,
|
||||
projectName: "管理者进阶8",
|
||||
manager: "黄华 刘俊",
|
||||
state: "草稿",
|
||||
creater: "毛继禹",
|
||||
time: "2022-07-20 14:00:03",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
key: 6,
|
||||
projectName: "管理者进阶6",
|
||||
manager: "黄华 刘俊",
|
||||
state: "草稿",
|
||||
creater: "毛继禹",
|
||||
time: "2022-07-20 14:00:03",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
key: 2,
|
||||
projectName: "管理者进阶2",
|
||||
manager: "黄华 刘俊",
|
||||
state: "草稿",
|
||||
creater: "毛继禹",
|
||||
time: "2022-07-20 14:00:03",
|
||||
},
|
||||
{
|
||||
key: 3,
|
||||
projectName: "管理者进阶3",
|
||||
manager: "黄华 刘俊",
|
||||
state: "草稿",
|
||||
creater: "毛继禹",
|
||||
time: "2022-07-20 14:00:03",
|
||||
hasChildren: true,
|
||||
children: [
|
||||
{
|
||||
key: 35,
|
||||
projectName: "管理者进阶35",
|
||||
manager: "黄华 刘俊",
|
||||
state: "草稿",
|
||||
creater: "毛继禹",
|
||||
time: "2022-07-20 14:00:03",
|
||||
children: [
|
||||
{
|
||||
key: 37,
|
||||
projectName: "管理者进阶37",
|
||||
manager: "黄华 刘俊",
|
||||
state: "草稿",
|
||||
creater: "毛继禹",
|
||||
time: "2022-07-20 14:00:03",
|
||||
},
|
||||
{
|
||||
key: 38,
|
||||
projectName: "管理者进阶38",
|
||||
manager: "黄华 刘俊",
|
||||
state: "草稿",
|
||||
creater: "毛继禹",
|
||||
time: "2022-07-20 14:00:03",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
key: 36,
|
||||
projectName: "管理者进阶36",
|
||||
manager: "黄华 刘俊",
|
||||
state: "草稿",
|
||||
creater: "毛继禹",
|
||||
time: "2022-07-20 14:00:03",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
key: 4,
|
||||
projectName: "管理者进阶4",
|
||||
manager: "黄华 刘俊",
|
||||
state: "草稿",
|
||||
creater: "毛继禹",
|
||||
time: "2022-07-20 14:00:03",
|
||||
},
|
||||
{
|
||||
key: 4,
|
||||
projectName: "管理者进阶5",
|
||||
manager: "黄华 刘俊",
|
||||
state: "草稿",
|
||||
creater: "毛继禹",
|
||||
time: "2022-07-20 14:00:03",
|
||||
},
|
||||
{
|
||||
key: 4,
|
||||
projectName: "管理者进阶",
|
||||
manager: "黄华 刘俊",
|
||||
state: "草稿",
|
||||
creater: "毛继禹",
|
||||
time: "2022-07-20 14:00:03",
|
||||
},
|
||||
{
|
||||
key: 4,
|
||||
projectName: "管理者进阶",
|
||||
manager: "黄华 刘俊",
|
||||
state: "草稿",
|
||||
creater: "毛继禹",
|
||||
time: "2022-07-20 14:00:03",
|
||||
},
|
||||
{
|
||||
key: 4,
|
||||
projectName: "管理者进阶",
|
||||
manager: "黄华 刘俊",
|
||||
state: "草稿",
|
||||
creater: "毛继禹",
|
||||
time: "2022-07-20 14:00:03",
|
||||
},
|
||||
{
|
||||
key: 4,
|
||||
projectName: "管理者进阶",
|
||||
manager: "黄华 刘俊",
|
||||
state: "草稿",
|
||||
creater: "毛继禹",
|
||||
time: "2022-07-20 14:00:03",
|
||||
},
|
||||
{
|
||||
key: 4,
|
||||
projectName: "管理者进阶",
|
||||
manager: "黄华 刘俊",
|
||||
state: "草稿",
|
||||
creater: "毛继禹",
|
||||
time: "2022-07-20 14:00:03",
|
||||
},
|
||||
{
|
||||
key: 4,
|
||||
projectName: "管理者进阶",
|
||||
manager: "黄华 刘俊",
|
||||
state: "草稿",
|
||||
creater: "毛继禹",
|
||||
time: "2022-07-20 14:00:03",
|
||||
},
|
||||
{
|
||||
key: 4,
|
||||
projectName: "管理者进阶",
|
||||
manager: "黄华 刘俊",
|
||||
state: "草稿",
|
||||
creater: "毛继禹",
|
||||
time: "2022-07-20 14:00:03",
|
||||
},
|
||||
{
|
||||
key: 4,
|
||||
projectName: "管理者进阶",
|
||||
manager: "黄华 刘俊",
|
||||
state: "草稿",
|
||||
creater: "毛继禹",
|
||||
time: "2022-07-20 14:00:03",
|
||||
},
|
||||
{
|
||||
key: 4,
|
||||
projectName: "管理者进阶",
|
||||
manager: "黄华 刘俊",
|
||||
state: "草稿",
|
||||
creater: "毛继禹",
|
||||
time: "2022-07-20 14:00:03",
|
||||
},
|
||||
{
|
||||
key: 4,
|
||||
projectName: "管理者进阶",
|
||||
manager: "黄华 刘俊",
|
||||
state: "草稿",
|
||||
creater: "毛继禹",
|
||||
time: "2022-07-20 14:00:03",
|
||||
},
|
||||
{
|
||||
key: 4,
|
||||
projectName: "管理者进阶",
|
||||
manager: "黄华 刘俊",
|
||||
state: "草稿",
|
||||
creater: "毛继禹",
|
||||
time: "2022-07-20 14:00:03",
|
||||
},
|
||||
{
|
||||
key: 4,
|
||||
projectName: "管理者进阶",
|
||||
manager: "黄华 刘俊",
|
||||
state: "草稿",
|
||||
creater: "毛继禹",
|
||||
time: "2022-07-20 14:00:03",
|
||||
},
|
||||
{
|
||||
key: 4,
|
||||
projectName: "管理者进阶",
|
||||
manager: "黄华 刘俊",
|
||||
state: "草稿",
|
||||
creater: "毛继禹",
|
||||
time: "2022-07-20 14:00:03",
|
||||
},
|
||||
{
|
||||
key: 4,
|
||||
projectName: "管理者进阶",
|
||||
manager: "黄华 刘俊",
|
||||
state: "草稿",
|
||||
creater: "毛继禹",
|
||||
time: "2022-07-20 14:00:03",
|
||||
},
|
||||
{
|
||||
key: 4,
|
||||
projectName: "管理者进阶",
|
||||
manager: "黄华 刘俊",
|
||||
state: "草稿",
|
||||
creater: "毛继禹",
|
||||
time: "2022-07-20 14:00:03",
|
||||
},
|
||||
],
|
||||
currentPage: 1,
|
||||
tableDataTotal: 20,
|
||||
pageSize: 10,
|
||||
});
|
||||
|
||||
onMounted(() => {
|
||||
// console.log("执行");
|
||||
});
|
||||
const selectProjectName = (value, index) => {
|
||||
console.log("value", value, index);
|
||||
};
|
||||
const expandTable = (e, a) => {
|
||||
console.log("惦记了");
|
||||
console.log("e", e, a);
|
||||
};
|
||||
return {
|
||||
...toRefs(state),
|
||||
columns,
|
||||
rowSelection,
|
||||
selectProjectName,
|
||||
expandTable,
|
||||
};
|
||||
},
|
||||
};
|
||||
</script>
|
||||
<style scoped lang="scss">
|
||||
<style lang="scss">
|
||||
.courseManage {
|
||||
.cmMain {
|
||||
flex: 1;
|
||||
padding: 0px 20px 20px 20px;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
.filter {
|
||||
margin-left: 38px;
|
||||
margin-right: 38px;
|
||||
margin-top: 30px;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
flex-wrap: wrap;
|
||||
.filterItems {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
.select {
|
||||
margin-right: 20px;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
}
|
||||
.btns {
|
||||
display: flex;
|
||||
// flex-wrap: wrap;
|
||||
.btn {
|
||||
padding: 0px 26px 0px 26px;
|
||||
height: 38px;
|
||||
background: rgba(64, 158, 255, 0);
|
||||
border-radius: 8px;
|
||||
border: 1px solid rgba(64, 158, 255, 1);
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
margin-right: 14px;
|
||||
flex-shrink: 0;
|
||||
.search {
|
||||
background-size: 100%;
|
||||
}
|
||||
.btnText {
|
||||
font-size: 14px;
|
||||
font-weight: 400;
|
||||
color: rgba(64, 158, 255, 1);
|
||||
line-height: 36px;
|
||||
margin-left: 5px;
|
||||
}
|
||||
}
|
||||
.btn1 {
|
||||
.search {
|
||||
width: 15px;
|
||||
height: 17px;
|
||||
background-image: url("../../assets/images/courseManage/search1.png");
|
||||
}
|
||||
}
|
||||
.btn2 {
|
||||
.search {
|
||||
width: 16px;
|
||||
height: 18px;
|
||||
background-image: url("../../assets/images/courseManage/reset1.png");
|
||||
}
|
||||
}
|
||||
.btn3 {
|
||||
margin-right: 0px;
|
||||
.search {
|
||||
width: 17px;
|
||||
height: 18px;
|
||||
background-image: url("../../assets/images/courseManage/add1.png");
|
||||
}
|
||||
}
|
||||
.btn1:hover {
|
||||
background: rgba(64, 158, 255, 1);
|
||||
.search {
|
||||
background-image: url("../../assets/images/courseManage/search0.png");
|
||||
}
|
||||
.btnText {
|
||||
color: #ffffff;
|
||||
}
|
||||
}
|
||||
.btn2:hover {
|
||||
background: rgba(64, 158, 255, 1);
|
||||
.search {
|
||||
background-image: url("../../assets/images/courseManage/reset0.png");
|
||||
}
|
||||
.btnText {
|
||||
color: #ffffff;
|
||||
}
|
||||
}
|
||||
.btn3:hover {
|
||||
background: rgba(64, 158, 255, 1);
|
||||
.search {
|
||||
background-image: url("../../assets/images/courseManage/add0.png");
|
||||
}
|
||||
.btnText {
|
||||
color: #ffffff;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.tableBox {
|
||||
margin: 20px 38px 30px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -1,16 +1,316 @@
|
||||
<!-- 课程管理页面 -->
|
||||
<template>
|
||||
<div class="coursewareManage"></div>
|
||||
<div class="coursewareManage">
|
||||
<div
|
||||
style="width: calc(100% - 76px); margin: 19px 0px 30px 38px"
|
||||
class="tableBox"
|
||||
>
|
||||
<a-table
|
||||
:columns="columns"
|
||||
:data-source="tableData"
|
||||
:row-selection="rowSelection"
|
||||
:loading="tableDataTotal === -1 ? true : false"
|
||||
:scroll="{ x: 700, y: 800 }"
|
||||
:pagination="{
|
||||
showSizeChanger: true,
|
||||
showQuickJumper: true,
|
||||
hideOnSinglePage: true,
|
||||
pageSizeOptions: [],
|
||||
pageSize: pageSize,
|
||||
current: currentPage,
|
||||
total: tableDataTotal,
|
||||
onChange: (page, pageSize) => {
|
||||
currentPage = page;
|
||||
// console.log('page', page)
|
||||
// 加翻页查找代码
|
||||
// this.setState({
|
||||
// currentPage: page,
|
||||
// }, () => {
|
||||
// this.getMilitaryDeployment()
|
||||
// })
|
||||
},
|
||||
}"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import { reactive, toRefs } from "vue";
|
||||
import { reactive, toRefs, ref } from "vue";
|
||||
const columns = [
|
||||
{
|
||||
title: "项目名称",
|
||||
dataIndex: "projectName",
|
||||
key: "projectName",
|
||||
width: 280,
|
||||
},
|
||||
{
|
||||
title: "项目经理",
|
||||
dataIndex: "manager",
|
||||
key: "manager",
|
||||
width: 100,
|
||||
},
|
||||
{
|
||||
title: "状态",
|
||||
dataIndex: "state",
|
||||
// width: "30%",
|
||||
key: "state",
|
||||
width: 100,
|
||||
},
|
||||
{
|
||||
title: "创建人",
|
||||
dataIndex: "creater",
|
||||
// width: "30%",
|
||||
key: "creater",
|
||||
width: 100,
|
||||
},
|
||||
{
|
||||
title: "创建时间",
|
||||
dataIndex: "time",
|
||||
key: "time",
|
||||
width: 180,
|
||||
},
|
||||
{
|
||||
title: "操作",
|
||||
dataIndex: "opacation",
|
||||
key: "opacation",
|
||||
width: 300,
|
||||
},
|
||||
];
|
||||
const rowSelection = ref({
|
||||
checkStrictly: false,
|
||||
onChange: (selectedRowKeys, selectedRows) => {
|
||||
console.log(
|
||||
`selectedRowKeys: ${selectedRowKeys}`,
|
||||
"selectedRows: ",
|
||||
selectedRows
|
||||
);
|
||||
},
|
||||
onSelect: (record, selected, selectedRows) => {
|
||||
console.log(record, selected, selectedRows);
|
||||
},
|
||||
onSelectAll: (selected, selectedRows, changeRows) => {
|
||||
console.log(selected, selectedRows, changeRows);
|
||||
},
|
||||
});
|
||||
|
||||
export default {
|
||||
name: "CoursewareManage",
|
||||
name: "coursewareManage",
|
||||
setup() {
|
||||
const state = reactive({});
|
||||
const state = reactive({
|
||||
tableData: [
|
||||
{
|
||||
id: 1,
|
||||
projectName: "管理者进阶",
|
||||
manager: "黄华 刘俊",
|
||||
state: "草稿",
|
||||
creater: "毛继禹",
|
||||
time: "2022-07-20 14:00:03",
|
||||
children: [
|
||||
{
|
||||
id: 5,
|
||||
projectName: "管理者进阶",
|
||||
manager: "黄华 刘俊",
|
||||
state: "草稿",
|
||||
creater: "毛继禹",
|
||||
time: "2022-07-20 14:00:03",
|
||||
children: [
|
||||
{
|
||||
id: 7,
|
||||
projectName: "管理者进阶",
|
||||
manager: "黄华 刘俊",
|
||||
state: "草稿",
|
||||
creater: "毛继禹",
|
||||
time: "2022-07-20 14:00:03",
|
||||
},
|
||||
{
|
||||
id: 8,
|
||||
projectName: "管理者进阶",
|
||||
manager: "黄华 刘俊",
|
||||
state: "草稿",
|
||||
creater: "毛继禹",
|
||||
time: "2022-07-20 14:00:03",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
id: 6,
|
||||
projectName: "管理者进阶",
|
||||
manager: "黄华 刘俊",
|
||||
state: "草稿",
|
||||
creater: "毛继禹",
|
||||
time: "2022-07-20 14:00:03",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
projectName: "管理者进阶",
|
||||
manager: "黄华 刘俊",
|
||||
state: "草稿",
|
||||
creater: "毛继禹",
|
||||
time: "2022-07-20 14:00:03",
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
projectName: "管理者进阶",
|
||||
manager: "黄华 刘俊",
|
||||
state: "草稿",
|
||||
creater: "毛继禹",
|
||||
time: "2022-07-20 14:00:03",
|
||||
hasChildren: true,
|
||||
},
|
||||
{
|
||||
id: 4,
|
||||
projectName: "管理者进阶",
|
||||
manager: "黄华 刘俊",
|
||||
state: "草稿",
|
||||
creater: "毛继禹",
|
||||
time: "2022-07-20 14:00:03",
|
||||
},
|
||||
{
|
||||
id: 4,
|
||||
projectName: "管理者进阶",
|
||||
manager: "黄华 刘俊",
|
||||
state: "草稿",
|
||||
creater: "毛继禹",
|
||||
time: "2022-07-20 14:00:03",
|
||||
},
|
||||
{
|
||||
id: 4,
|
||||
projectName: "管理者进阶",
|
||||
manager: "黄华 刘俊",
|
||||
state: "草稿",
|
||||
creater: "毛继禹",
|
||||
time: "2022-07-20 14:00:03",
|
||||
},
|
||||
{
|
||||
id: 4,
|
||||
projectName: "管理者进阶",
|
||||
manager: "黄华 刘俊",
|
||||
state: "草稿",
|
||||
creater: "毛继禹",
|
||||
time: "2022-07-20 14:00:03",
|
||||
},
|
||||
{
|
||||
id: 4,
|
||||
projectName: "管理者进阶",
|
||||
manager: "黄华 刘俊",
|
||||
state: "草稿",
|
||||
creater: "毛继禹",
|
||||
time: "2022-07-20 14:00:03",
|
||||
},
|
||||
{
|
||||
id: 4,
|
||||
projectName: "管理者进阶",
|
||||
manager: "黄华 刘俊",
|
||||
state: "草稿",
|
||||
creater: "毛继禹",
|
||||
time: "2022-07-20 14:00:03",
|
||||
},
|
||||
{
|
||||
id: 4,
|
||||
projectName: "管理者进阶",
|
||||
manager: "黄华 刘俊",
|
||||
state: "草稿",
|
||||
creater: "毛继禹",
|
||||
time: "2022-07-20 14:00:03",
|
||||
},
|
||||
{
|
||||
id: 4,
|
||||
projectName: "管理者进阶",
|
||||
manager: "黄华 刘俊",
|
||||
state: "草稿",
|
||||
creater: "毛继禹",
|
||||
time: "2022-07-20 14:00:03",
|
||||
},
|
||||
{
|
||||
id: 4,
|
||||
projectName: "管理者进阶",
|
||||
manager: "黄华 刘俊",
|
||||
state: "草稿",
|
||||
creater: "毛继禹",
|
||||
time: "2022-07-20 14:00:03",
|
||||
},
|
||||
{
|
||||
id: 4,
|
||||
projectName: "管理者进阶",
|
||||
manager: "黄华 刘俊",
|
||||
state: "草稿",
|
||||
creater: "毛继禹",
|
||||
time: "2022-07-20 14:00:03",
|
||||
},
|
||||
{
|
||||
id: 4,
|
||||
projectName: "管理者进阶",
|
||||
manager: "黄华 刘俊",
|
||||
state: "草稿",
|
||||
creater: "毛继禹",
|
||||
time: "2022-07-20 14:00:03",
|
||||
},
|
||||
{
|
||||
id: 4,
|
||||
projectName: "管理者进阶",
|
||||
manager: "黄华 刘俊",
|
||||
state: "草稿",
|
||||
creater: "毛继禹",
|
||||
time: "2022-07-20 14:00:03",
|
||||
},
|
||||
{
|
||||
id: 4,
|
||||
projectName: "管理者进阶",
|
||||
manager: "黄华 刘俊",
|
||||
state: "草稿",
|
||||
creater: "毛继禹",
|
||||
time: "2022-07-20 14:00:03",
|
||||
},
|
||||
{
|
||||
id: 4,
|
||||
projectName: "管理者进阶",
|
||||
manager: "黄华 刘俊",
|
||||
state: "草稿",
|
||||
creater: "毛继禹",
|
||||
time: "2022-07-20 14:00:03",
|
||||
},
|
||||
{
|
||||
id: 4,
|
||||
projectName: "管理者进阶",
|
||||
manager: "黄华 刘俊",
|
||||
state: "草稿",
|
||||
creater: "毛继禹",
|
||||
time: "2022-07-20 14:00:03",
|
||||
},
|
||||
{
|
||||
id: 4,
|
||||
projectName: "管理者进阶",
|
||||
manager: "黄华 刘俊",
|
||||
state: "草稿",
|
||||
creater: "毛继禹",
|
||||
time: "2022-07-20 14:00:03",
|
||||
},
|
||||
{
|
||||
id: 4,
|
||||
projectName: "管理者进阶",
|
||||
manager: "黄华 刘俊",
|
||||
state: "草稿",
|
||||
creater: "毛继禹",
|
||||
time: "2022-07-20 14:00:03",
|
||||
},
|
||||
],
|
||||
currentPage: 1,
|
||||
tableDataTotal: 20,
|
||||
pageSize: 10,
|
||||
});
|
||||
return {
|
||||
...toRefs(state),
|
||||
columns,
|
||||
rowSelection,
|
||||
};
|
||||
},
|
||||
};
|
||||
</script>
|
||||
<style scoped lang="scss"></style>
|
||||
<style lang="scss">
|
||||
.coursewareManage {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
</style>
|
||||
|
||||
0
src/views/examination/ExaminationCenter.vue
Normal file
0
src/views/examination/ExaminationCenter.vue
Normal file
599
src/views/learningpath/LearningPath.vue
Normal file
599
src/views/learningpath/LearningPath.vue
Normal file
@@ -0,0 +1,599 @@
|
||||
<!-- 学习路径页面 -->
|
||||
<template>
|
||||
<div class="learningPath">
|
||||
<!-- 搜索框及按钮 -->
|
||||
<div class="filter">
|
||||
<div class="filterItems">
|
||||
<div class="select">
|
||||
<a-select
|
||||
v-model:value="projectName"
|
||||
style="width: 270px"
|
||||
placeholder="请输入项目名称"
|
||||
:options="projectNameList"
|
||||
@change="selectProjectName"
|
||||
allowClear
|
||||
showSearch
|
||||
></a-select>
|
||||
</div>
|
||||
<div class="select">
|
||||
<a-select
|
||||
v-model:value="projectName"
|
||||
style="width: 270px"
|
||||
placeholder="请输入项目经理"
|
||||
:options="projectNameList"
|
||||
@change="selectProjectName"
|
||||
allowClear
|
||||
showSearch
|
||||
></a-select>
|
||||
</div>
|
||||
<div class="select">
|
||||
<a-select
|
||||
v-model:value="projectName"
|
||||
style="width: 270px"
|
||||
placeholder="请选择状态"
|
||||
:options="projectNameList"
|
||||
@change="selectProjectName"
|
||||
allowClear
|
||||
showSearch
|
||||
></a-select>
|
||||
</div>
|
||||
<div class="select">
|
||||
<a-date-picker
|
||||
v-model="selectTime"
|
||||
type="date"
|
||||
placeholder="创建时间"
|
||||
style="width: 270px"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div class="btns">
|
||||
<div class="btn btn1">
|
||||
<div class="search"></div>
|
||||
<div class="btnText">搜索</div>
|
||||
</div>
|
||||
<div class="btn btn2">
|
||||
<div class="search"></div>
|
||||
<div class="btnText">重置</div>
|
||||
</div>
|
||||
<router-link to="/projectadd">
|
||||
<div class="btn btn3">
|
||||
<div class="search"></div>
|
||||
<div class="btnText">创建项目</div>
|
||||
</div>
|
||||
</router-link>
|
||||
</div>
|
||||
</div>
|
||||
<!-- 搜索框及按钮 -->
|
||||
<!-- 表格 -->
|
||||
<div class="tableBox">
|
||||
<a-table
|
||||
:columns="columns"
|
||||
:data-source="tableData"
|
||||
:loading="tableDataTotal === -1 ? true : false"
|
||||
:scroll="{ x: 700, y: 800 }"
|
||||
expandRowByClick="true"
|
||||
@expand="expandTable"
|
||||
:pagination="{
|
||||
showSizeChanger: true,
|
||||
showQuickJumper: true,
|
||||
hideOnSinglePage: true,
|
||||
pageSizeOptions: [],
|
||||
pageSize: pageSize,
|
||||
current: currentPage,
|
||||
total: tableDataTotal,
|
||||
onChange: (page, pageSize) => {
|
||||
currentPage = page;
|
||||
// console.log('page', page)
|
||||
// 加翻页查找代码
|
||||
// this.setState({
|
||||
// currentPage: page,
|
||||
// }, () => {
|
||||
// this.getMilitaryDeployment()
|
||||
// })
|
||||
},
|
||||
}"
|
||||
/>
|
||||
</div>
|
||||
<!-- 表格 -->
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import { reactive, toRefs, onMounted } from "vue";
|
||||
const columns = [
|
||||
{
|
||||
title: "项目名称",
|
||||
dataIndex: "projectName",
|
||||
key: "projectName",
|
||||
width: 280,
|
||||
// align: "center",
|
||||
ellipsis: true,
|
||||
// scopedSlots: { customRender: "action" }, //引入的插槽
|
||||
// customRender: (text, record) => {
|
||||
// console.log(text, record);
|
||||
// return <span>{text.text}</span>;
|
||||
// },
|
||||
},
|
||||
{
|
||||
title: "项目经理",
|
||||
dataIndex: "manager",
|
||||
key: "manager",
|
||||
width: 100,
|
||||
align: "center",
|
||||
},
|
||||
{
|
||||
title: "状态",
|
||||
dataIndex: "state",
|
||||
// width: "30%",
|
||||
key: "state",
|
||||
width: 100,
|
||||
align: "center",
|
||||
},
|
||||
{
|
||||
title: "创建人",
|
||||
dataIndex: "creater",
|
||||
// width: "30%",
|
||||
key: "creater",
|
||||
width: 100,
|
||||
align: "center",
|
||||
},
|
||||
{
|
||||
title: "创建时间",
|
||||
dataIndex: "time",
|
||||
key: "time",
|
||||
width: 180,
|
||||
align: "center",
|
||||
},
|
||||
{
|
||||
title: "操作",
|
||||
dataIndex: "opacation",
|
||||
key: "opacation",
|
||||
width: 300,
|
||||
align: "center",
|
||||
scopedSlots: { customRender: "action" }, //引入的插槽
|
||||
customRender: () => {
|
||||
// console.log(text);
|
||||
return (
|
||||
<div class="opacation">
|
||||
<span>编辑</span>
|
||||
<span style={{ "margin-left": "21px" }}>创建子项目</span>
|
||||
<span style={{ "margin-left": "21px" }} class="more">
|
||||
<span>更多</span>
|
||||
<div class="moreArrow"></div>
|
||||
<div class="moreItems"></div>
|
||||
</span>
|
||||
</div>
|
||||
);
|
||||
},
|
||||
},
|
||||
];
|
||||
|
||||
export default {
|
||||
name: "learningPath",
|
||||
|
||||
setup() {
|
||||
const state = reactive({
|
||||
projectNameList: [
|
||||
{
|
||||
id: 1,
|
||||
value: "项目一",
|
||||
label: "项目一",
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
value: "项目二",
|
||||
label: "项目二",
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
value: "项目三",
|
||||
label: "项目三",
|
||||
},
|
||||
{
|
||||
id: 4,
|
||||
value: "项目四",
|
||||
label: "项目四",
|
||||
},
|
||||
],
|
||||
projectName: null,
|
||||
selectTime: null,
|
||||
|
||||
tableData: [
|
||||
{
|
||||
key: 1,
|
||||
projectName:
|
||||
"管理者进阶1管理者进阶1管理者进阶1管理者进阶1管理者进阶1管理者进阶1管理者进阶1",
|
||||
manager: "黄华 刘俊",
|
||||
state: "草稿",
|
||||
creater: "毛继禹",
|
||||
time: "2022-07-20 14:00:03",
|
||||
children: [
|
||||
{
|
||||
key: 5,
|
||||
projectName: "管理者进阶5",
|
||||
manager: "黄华 刘俊",
|
||||
state: "草稿",
|
||||
creater: "毛继禹",
|
||||
time: "2022-07-20 14:00:03",
|
||||
children: [
|
||||
{
|
||||
key: 7,
|
||||
projectName:
|
||||
"管理者进阶7管理者进阶7管理者进阶7管理者进阶7管理者进阶7管理者进阶7管理者进阶7",
|
||||
manager: "黄华 刘俊",
|
||||
state: "草稿",
|
||||
creater: "毛继禹",
|
||||
time: "2022-07-20 14:00:03",
|
||||
},
|
||||
{
|
||||
key: 8,
|
||||
projectName: "管理者进阶8",
|
||||
manager: "黄华 刘俊",
|
||||
state: "草稿",
|
||||
creater: "毛继禹",
|
||||
time: "2022-07-20 14:00:03",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
key: 6,
|
||||
projectName: "管理者进阶6",
|
||||
manager: "黄华 刘俊",
|
||||
state: "草稿",
|
||||
creater: "毛继禹",
|
||||
time: "2022-07-20 14:00:03",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
key: 2,
|
||||
projectName: "管理者进阶2",
|
||||
manager: "黄华 刘俊",
|
||||
state: "草稿",
|
||||
creater: "毛继禹",
|
||||
time: "2022-07-20 14:00:03",
|
||||
},
|
||||
{
|
||||
key: 3,
|
||||
projectName: "管理者进阶3",
|
||||
manager: "黄华 刘俊",
|
||||
state: "草稿",
|
||||
creater: "毛继禹",
|
||||
time: "2022-07-20 14:00:03",
|
||||
hasChildren: true,
|
||||
children: [
|
||||
{
|
||||
key: 35,
|
||||
projectName: "管理者进阶35",
|
||||
manager: "黄华 刘俊",
|
||||
state: "草稿",
|
||||
creater: "毛继禹",
|
||||
time: "2022-07-20 14:00:03",
|
||||
children: [
|
||||
{
|
||||
key: 37,
|
||||
projectName: "管理者进阶37",
|
||||
manager: "黄华 刘俊",
|
||||
state: "草稿",
|
||||
creater: "毛继禹",
|
||||
time: "2022-07-20 14:00:03",
|
||||
},
|
||||
{
|
||||
key: 38,
|
||||
projectName: "管理者进阶38",
|
||||
manager: "黄华 刘俊",
|
||||
state: "草稿",
|
||||
creater: "毛继禹",
|
||||
time: "2022-07-20 14:00:03",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
key: 36,
|
||||
projectName: "管理者进阶36",
|
||||
manager: "黄华 刘俊",
|
||||
state: "草稿",
|
||||
creater: "毛继禹",
|
||||
time: "2022-07-20 14:00:03",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
key: 4,
|
||||
projectName: "管理者进阶4",
|
||||
manager: "黄华 刘俊",
|
||||
state: "草稿",
|
||||
creater: "毛继禹",
|
||||
time: "2022-07-20 14:00:03",
|
||||
},
|
||||
{
|
||||
key: 4,
|
||||
projectName: "管理者进阶5",
|
||||
manager: "黄华 刘俊",
|
||||
state: "草稿",
|
||||
creater: "毛继禹",
|
||||
time: "2022-07-20 14:00:03",
|
||||
},
|
||||
{
|
||||
key: 4,
|
||||
projectName: "管理者进阶",
|
||||
manager: "黄华 刘俊",
|
||||
state: "草稿",
|
||||
creater: "毛继禹",
|
||||
time: "2022-07-20 14:00:03",
|
||||
},
|
||||
{
|
||||
key: 4,
|
||||
projectName: "管理者进阶",
|
||||
manager: "黄华 刘俊",
|
||||
state: "草稿",
|
||||
creater: "毛继禹",
|
||||
time: "2022-07-20 14:00:03",
|
||||
},
|
||||
{
|
||||
key: 4,
|
||||
projectName: "管理者进阶",
|
||||
manager: "黄华 刘俊",
|
||||
state: "草稿",
|
||||
creater: "毛继禹",
|
||||
time: "2022-07-20 14:00:03",
|
||||
},
|
||||
{
|
||||
key: 4,
|
||||
projectName: "管理者进阶",
|
||||
manager: "黄华 刘俊",
|
||||
state: "草稿",
|
||||
creater: "毛继禹",
|
||||
time: "2022-07-20 14:00:03",
|
||||
},
|
||||
{
|
||||
key: 4,
|
||||
projectName: "管理者进阶",
|
||||
manager: "黄华 刘俊",
|
||||
state: "草稿",
|
||||
creater: "毛继禹",
|
||||
time: "2022-07-20 14:00:03",
|
||||
},
|
||||
{
|
||||
key: 4,
|
||||
projectName: "管理者进阶",
|
||||
manager: "黄华 刘俊",
|
||||
state: "草稿",
|
||||
creater: "毛继禹",
|
||||
time: "2022-07-20 14:00:03",
|
||||
},
|
||||
{
|
||||
key: 4,
|
||||
projectName: "管理者进阶",
|
||||
manager: "黄华 刘俊",
|
||||
state: "草稿",
|
||||
creater: "毛继禹",
|
||||
time: "2022-07-20 14:00:03",
|
||||
},
|
||||
{
|
||||
key: 4,
|
||||
projectName: "管理者进阶",
|
||||
manager: "黄华 刘俊",
|
||||
state: "草稿",
|
||||
creater: "毛继禹",
|
||||
time: "2022-07-20 14:00:03",
|
||||
},
|
||||
{
|
||||
key: 4,
|
||||
projectName: "管理者进阶",
|
||||
manager: "黄华 刘俊",
|
||||
state: "草稿",
|
||||
creater: "毛继禹",
|
||||
time: "2022-07-20 14:00:03",
|
||||
},
|
||||
{
|
||||
key: 4,
|
||||
projectName: "管理者进阶",
|
||||
manager: "黄华 刘俊",
|
||||
state: "草稿",
|
||||
creater: "毛继禹",
|
||||
time: "2022-07-20 14:00:03",
|
||||
},
|
||||
{
|
||||
key: 4,
|
||||
projectName: "管理者进阶",
|
||||
manager: "黄华 刘俊",
|
||||
state: "草稿",
|
||||
creater: "毛继禹",
|
||||
time: "2022-07-20 14:00:03",
|
||||
},
|
||||
{
|
||||
key: 4,
|
||||
projectName: "管理者进阶",
|
||||
manager: "黄华 刘俊",
|
||||
state: "草稿",
|
||||
creater: "毛继禹",
|
||||
time: "2022-07-20 14:00:03",
|
||||
},
|
||||
{
|
||||
key: 4,
|
||||
projectName: "管理者进阶",
|
||||
manager: "黄华 刘俊",
|
||||
state: "草稿",
|
||||
creater: "毛继禹",
|
||||
time: "2022-07-20 14:00:03",
|
||||
},
|
||||
{
|
||||
key: 4,
|
||||
projectName: "管理者进阶",
|
||||
manager: "黄华 刘俊",
|
||||
state: "草稿",
|
||||
creater: "毛继禹",
|
||||
time: "2022-07-20 14:00:03",
|
||||
},
|
||||
{
|
||||
key: 4,
|
||||
projectName: "管理者进阶",
|
||||
manager: "黄华 刘俊",
|
||||
state: "草稿",
|
||||
creater: "毛继禹",
|
||||
time: "2022-07-20 14:00:03",
|
||||
},
|
||||
],
|
||||
currentPage: 1,
|
||||
tableDataTotal: 20,
|
||||
pageSize: 10,
|
||||
});
|
||||
|
||||
onMounted(() => {
|
||||
// console.log("执行");
|
||||
});
|
||||
const selectProjectName = (value, index) => {
|
||||
console.log("value", value, index);
|
||||
};
|
||||
const expandTable = (e, a) => {
|
||||
// console.log("惦记了");
|
||||
console.log("e", e, a);
|
||||
};
|
||||
return {
|
||||
...toRefs(state),
|
||||
columns,
|
||||
selectProjectName,
|
||||
expandTable,
|
||||
};
|
||||
},
|
||||
};
|
||||
</script>
|
||||
<style lang="scss">
|
||||
.learningPath {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
.filter {
|
||||
margin-left: 38px;
|
||||
margin-right: 38px;
|
||||
margin-top: 30px;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
flex-wrap: wrap;
|
||||
.filterItems {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
.select {
|
||||
margin-right: 20px;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
}
|
||||
.btns {
|
||||
display: flex;
|
||||
// flex-wrap: wrap;
|
||||
.btn {
|
||||
padding: 0px 26px 0px 26px;
|
||||
height: 38px;
|
||||
background: rgba(64, 158, 255, 0);
|
||||
border-radius: 8px;
|
||||
border: 1px solid rgba(64, 158, 255, 1);
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
margin-right: 14px;
|
||||
flex-shrink: 0;
|
||||
.search {
|
||||
background-size: 100%;
|
||||
}
|
||||
.btnText {
|
||||
font-size: 14px;
|
||||
font-weight: 400;
|
||||
color: rgba(64, 158, 255, 1);
|
||||
line-height: 36px;
|
||||
margin-left: 5px;
|
||||
}
|
||||
}
|
||||
.btn1 {
|
||||
.search {
|
||||
width: 15px;
|
||||
height: 17px;
|
||||
background-image: url("../../assets/images/courseManage/search1.png");
|
||||
}
|
||||
}
|
||||
.btn2 {
|
||||
.search {
|
||||
width: 16px;
|
||||
height: 18px;
|
||||
background-image: url("../../assets/images/courseManage/reset1.png");
|
||||
}
|
||||
}
|
||||
.btn3 {
|
||||
margin-right: 0px;
|
||||
.search {
|
||||
width: 17px;
|
||||
height: 18px;
|
||||
background-image: url("../../assets/images/courseManage/add1.png");
|
||||
}
|
||||
}
|
||||
.btn1:hover {
|
||||
background: rgba(64, 158, 255, 1);
|
||||
.search {
|
||||
background-image: url("../../assets/images/courseManage/search0.png");
|
||||
}
|
||||
.btnText {
|
||||
color: #ffffff;
|
||||
}
|
||||
}
|
||||
.btn2:hover {
|
||||
background: rgba(64, 158, 255, 1);
|
||||
.search {
|
||||
background-image: url("../../assets/images/courseManage/reset0.png");
|
||||
}
|
||||
.btnText {
|
||||
color: #ffffff;
|
||||
}
|
||||
}
|
||||
.btn3:hover {
|
||||
background: rgba(64, 158, 255, 1);
|
||||
.search {
|
||||
background-image: url("../../assets/images/courseManage/add0.png");
|
||||
}
|
||||
.btnText {
|
||||
color: #ffffff;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.tableBox {
|
||||
margin: 20px 38px 30px;
|
||||
}
|
||||
.opacation {
|
||||
font-size: 14px;
|
||||
font-weight: 400;
|
||||
color: #4ea6ff;
|
||||
// line-height: 36px;
|
||||
.more {
|
||||
position: relative;
|
||||
.moreArrow {
|
||||
width: 13px;
|
||||
height: 7px;
|
||||
display: inline-block;
|
||||
background-image: url("../../assets/images/navtop/down.png");
|
||||
background-size: 100%;
|
||||
margin: 2px;
|
||||
margin-left: 7px;
|
||||
}
|
||||
.moreItems {
|
||||
width: 80px;
|
||||
height: 70px;
|
||||
display: none;
|
||||
background: #ffffff;
|
||||
box-shadow: 2px 3px 9px 3px rgba(0, 0, 0, 0.05);
|
||||
border-radius: 3px;
|
||||
border: 0px solid #dcdcdc;
|
||||
position: absolute;
|
||||
left: 0px;
|
||||
top: 18px;
|
||||
z-index: 100;
|
||||
}
|
||||
}
|
||||
.more:hover .moreArrow {
|
||||
background-image: url("../../assets/images/navtop/up.png");
|
||||
}
|
||||
.more:hover .moreItems {
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
1
src/views/projectcenter/ProjectAdd.vue
Normal file
1
src/views/projectcenter/ProjectAdd.vue
Normal file
@@ -0,0 +1 @@
|
||||
<!---- 创建项目页面 --->
|
||||
599
src/views/projectcenter/ProjectManage.vue
Normal file
599
src/views/projectcenter/ProjectManage.vue
Normal file
@@ -0,0 +1,599 @@
|
||||
<!-- 项目页面 -->
|
||||
<template>
|
||||
<div class="projectManage">
|
||||
<!-- 搜索框及按钮 -->
|
||||
<div class="filter">
|
||||
<div class="filterItems">
|
||||
<div class="select">
|
||||
<a-select
|
||||
v-model:value="projectName"
|
||||
style="width: 270px"
|
||||
placeholder="请输入项目名称"
|
||||
:options="projectNameList"
|
||||
@change="selectProjectName"
|
||||
allowClear
|
||||
showSearch
|
||||
></a-select>
|
||||
</div>
|
||||
<div class="select">
|
||||
<a-select
|
||||
v-model:value="projectName"
|
||||
style="width: 270px"
|
||||
placeholder="请输入项目经理"
|
||||
:options="projectNameList"
|
||||
@change="selectProjectName"
|
||||
allowClear
|
||||
showSearch
|
||||
></a-select>
|
||||
</div>
|
||||
<div class="select">
|
||||
<a-select
|
||||
v-model:value="projectName"
|
||||
style="width: 270px"
|
||||
placeholder="请选择状态"
|
||||
:options="projectNameList"
|
||||
@change="selectProjectName"
|
||||
allowClear
|
||||
showSearch
|
||||
></a-select>
|
||||
</div>
|
||||
<div class="select">
|
||||
<a-date-picker
|
||||
v-model="selectTime"
|
||||
type="date"
|
||||
placeholder="创建时间"
|
||||
style="width: 270px"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div class="btns">
|
||||
<div class="btn btn1">
|
||||
<div class="search"></div>
|
||||
<div class="btnText">搜索</div>
|
||||
</div>
|
||||
<div class="btn btn2">
|
||||
<div class="search"></div>
|
||||
<div class="btnText">重置</div>
|
||||
</div>
|
||||
<router-link to="/projectadd">
|
||||
<div class="btn btn3">
|
||||
<div class="search"></div>
|
||||
<div class="btnText">创建项目</div>
|
||||
</div>
|
||||
</router-link>
|
||||
</div>
|
||||
</div>
|
||||
<!-- 搜索框及按钮 -->
|
||||
<!-- 表格 -->
|
||||
<div class="tableBox">
|
||||
<a-table
|
||||
:columns="columns"
|
||||
:data-source="tableData"
|
||||
:loading="tableDataTotal === -1 ? true : false"
|
||||
:scroll="{ x: 700, y: 800 }"
|
||||
expandRowByClick="true"
|
||||
@expand="expandTable"
|
||||
:pagination="{
|
||||
showSizeChanger: true,
|
||||
showQuickJumper: true,
|
||||
hideOnSinglePage: true,
|
||||
pageSizeOptions: [],
|
||||
pageSize: pageSize,
|
||||
current: currentPage,
|
||||
total: tableDataTotal,
|
||||
onChange: (page, pageSize) => {
|
||||
currentPage = page;
|
||||
// console.log('page', page)
|
||||
// 加翻页查找代码
|
||||
// this.setState({
|
||||
// currentPage: page,
|
||||
// }, () => {
|
||||
// this.getMilitaryDeployment()
|
||||
// })
|
||||
},
|
||||
}"
|
||||
/>
|
||||
</div>
|
||||
<!-- 表格 -->
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import { reactive, toRefs, onMounted } from "vue";
|
||||
const columns = [
|
||||
{
|
||||
title: "项目名称",
|
||||
dataIndex: "projectName",
|
||||
key: "projectName",
|
||||
width: 280,
|
||||
// align: "center",
|
||||
ellipsis: true,
|
||||
// scopedSlots: { customRender: "action" }, //引入的插槽
|
||||
// customRender: (text, record) => {
|
||||
// console.log(text, record);
|
||||
// return <span>{text.text}</span>;
|
||||
// },
|
||||
},
|
||||
{
|
||||
title: "项目经理",
|
||||
dataIndex: "manager",
|
||||
key: "manager",
|
||||
width: 100,
|
||||
align: "center",
|
||||
},
|
||||
{
|
||||
title: "状态",
|
||||
dataIndex: "state",
|
||||
// width: "30%",
|
||||
key: "state",
|
||||
width: 100,
|
||||
align: "center",
|
||||
},
|
||||
{
|
||||
title: "创建人",
|
||||
dataIndex: "creater",
|
||||
// width: "30%",
|
||||
key: "creater",
|
||||
width: 100,
|
||||
align: "center",
|
||||
},
|
||||
{
|
||||
title: "创建时间",
|
||||
dataIndex: "time",
|
||||
key: "time",
|
||||
width: 180,
|
||||
align: "center",
|
||||
},
|
||||
{
|
||||
title: "操作",
|
||||
dataIndex: "opacation",
|
||||
key: "opacation",
|
||||
width: 300,
|
||||
align: "center",
|
||||
scopedSlots: { customRender: "action" }, //引入的插槽
|
||||
customRender: () => {
|
||||
// console.log(text);
|
||||
return (
|
||||
<div class="opacation">
|
||||
<span>编辑</span>
|
||||
<span style={{ "margin-left": "21px" }}>创建子项目</span>
|
||||
<span style={{ "margin-left": "21px" }} class="more">
|
||||
<span>更多</span>
|
||||
<div class="moreArrow"></div>
|
||||
<div class="moreItems"></div>
|
||||
</span>
|
||||
</div>
|
||||
);
|
||||
},
|
||||
},
|
||||
];
|
||||
|
||||
export default {
|
||||
name: "projectManage",
|
||||
|
||||
setup() {
|
||||
const state = reactive({
|
||||
projectNameList: [
|
||||
{
|
||||
id: 1,
|
||||
value: "项目一",
|
||||
label: "项目一",
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
value: "项目二",
|
||||
label: "项目二",
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
value: "项目三",
|
||||
label: "项目三",
|
||||
},
|
||||
{
|
||||
id: 4,
|
||||
value: "项目四",
|
||||
label: "项目四",
|
||||
},
|
||||
],
|
||||
projectName: null,
|
||||
selectTime: null,
|
||||
|
||||
tableData: [
|
||||
{
|
||||
key: 1,
|
||||
projectName:
|
||||
"管理者进阶1管理者进阶1管理者进阶1管理者进阶1管理者进阶1管理者进阶1管理者进阶1",
|
||||
manager: "黄华 刘俊",
|
||||
state: "草稿",
|
||||
creater: "毛继禹",
|
||||
time: "2022-07-20 14:00:03",
|
||||
children: [
|
||||
{
|
||||
key: 5,
|
||||
projectName: "管理者进阶5",
|
||||
manager: "黄华 刘俊",
|
||||
state: "草稿",
|
||||
creater: "毛继禹",
|
||||
time: "2022-07-20 14:00:03",
|
||||
children: [
|
||||
{
|
||||
key: 7,
|
||||
projectName:
|
||||
"管理者进阶7管理者进阶7管理者进阶7管理者进阶7管理者进阶7管理者进阶7管理者进阶7",
|
||||
manager: "黄华 刘俊",
|
||||
state: "草稿",
|
||||
creater: "毛继禹",
|
||||
time: "2022-07-20 14:00:03",
|
||||
},
|
||||
{
|
||||
key: 8,
|
||||
projectName: "管理者进阶8",
|
||||
manager: "黄华 刘俊",
|
||||
state: "草稿",
|
||||
creater: "毛继禹",
|
||||
time: "2022-07-20 14:00:03",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
key: 6,
|
||||
projectName: "管理者进阶6",
|
||||
manager: "黄华 刘俊",
|
||||
state: "草稿",
|
||||
creater: "毛继禹",
|
||||
time: "2022-07-20 14:00:03",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
key: 2,
|
||||
projectName: "管理者进阶2",
|
||||
manager: "黄华 刘俊",
|
||||
state: "草稿",
|
||||
creater: "毛继禹",
|
||||
time: "2022-07-20 14:00:03",
|
||||
},
|
||||
{
|
||||
key: 3,
|
||||
projectName: "管理者进阶3",
|
||||
manager: "黄华 刘俊",
|
||||
state: "草稿",
|
||||
creater: "毛继禹",
|
||||
time: "2022-07-20 14:00:03",
|
||||
hasChildren: true,
|
||||
children: [
|
||||
{
|
||||
key: 35,
|
||||
projectName: "管理者进阶35",
|
||||
manager: "黄华 刘俊",
|
||||
state: "草稿",
|
||||
creater: "毛继禹",
|
||||
time: "2022-07-20 14:00:03",
|
||||
children: [
|
||||
{
|
||||
key: 37,
|
||||
projectName: "管理者进阶37",
|
||||
manager: "黄华 刘俊",
|
||||
state: "草稿",
|
||||
creater: "毛继禹",
|
||||
time: "2022-07-20 14:00:03",
|
||||
},
|
||||
{
|
||||
key: 38,
|
||||
projectName: "管理者进阶38",
|
||||
manager: "黄华 刘俊",
|
||||
state: "草稿",
|
||||
creater: "毛继禹",
|
||||
time: "2022-07-20 14:00:03",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
key: 36,
|
||||
projectName: "管理者进阶36",
|
||||
manager: "黄华 刘俊",
|
||||
state: "草稿",
|
||||
creater: "毛继禹",
|
||||
time: "2022-07-20 14:00:03",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
key: 4,
|
||||
projectName: "管理者进阶4",
|
||||
manager: "黄华 刘俊",
|
||||
state: "草稿",
|
||||
creater: "毛继禹",
|
||||
time: "2022-07-20 14:00:03",
|
||||
},
|
||||
{
|
||||
key: 4,
|
||||
projectName: "管理者进阶5",
|
||||
manager: "黄华 刘俊",
|
||||
state: "草稿",
|
||||
creater: "毛继禹",
|
||||
time: "2022-07-20 14:00:03",
|
||||
},
|
||||
{
|
||||
key: 4,
|
||||
projectName: "管理者进阶",
|
||||
manager: "黄华 刘俊",
|
||||
state: "草稿",
|
||||
creater: "毛继禹",
|
||||
time: "2022-07-20 14:00:03",
|
||||
},
|
||||
{
|
||||
key: 4,
|
||||
projectName: "管理者进阶",
|
||||
manager: "黄华 刘俊",
|
||||
state: "草稿",
|
||||
creater: "毛继禹",
|
||||
time: "2022-07-20 14:00:03",
|
||||
},
|
||||
{
|
||||
key: 4,
|
||||
projectName: "管理者进阶",
|
||||
manager: "黄华 刘俊",
|
||||
state: "草稿",
|
||||
creater: "毛继禹",
|
||||
time: "2022-07-20 14:00:03",
|
||||
},
|
||||
{
|
||||
key: 4,
|
||||
projectName: "管理者进阶",
|
||||
manager: "黄华 刘俊",
|
||||
state: "草稿",
|
||||
creater: "毛继禹",
|
||||
time: "2022-07-20 14:00:03",
|
||||
},
|
||||
{
|
||||
key: 4,
|
||||
projectName: "管理者进阶",
|
||||
manager: "黄华 刘俊",
|
||||
state: "草稿",
|
||||
creater: "毛继禹",
|
||||
time: "2022-07-20 14:00:03",
|
||||
},
|
||||
{
|
||||
key: 4,
|
||||
projectName: "管理者进阶",
|
||||
manager: "黄华 刘俊",
|
||||
state: "草稿",
|
||||
creater: "毛继禹",
|
||||
time: "2022-07-20 14:00:03",
|
||||
},
|
||||
{
|
||||
key: 4,
|
||||
projectName: "管理者进阶",
|
||||
manager: "黄华 刘俊",
|
||||
state: "草稿",
|
||||
creater: "毛继禹",
|
||||
time: "2022-07-20 14:00:03",
|
||||
},
|
||||
{
|
||||
key: 4,
|
||||
projectName: "管理者进阶",
|
||||
manager: "黄华 刘俊",
|
||||
state: "草稿",
|
||||
creater: "毛继禹",
|
||||
time: "2022-07-20 14:00:03",
|
||||
},
|
||||
{
|
||||
key: 4,
|
||||
projectName: "管理者进阶",
|
||||
manager: "黄华 刘俊",
|
||||
state: "草稿",
|
||||
creater: "毛继禹",
|
||||
time: "2022-07-20 14:00:03",
|
||||
},
|
||||
{
|
||||
key: 4,
|
||||
projectName: "管理者进阶",
|
||||
manager: "黄华 刘俊",
|
||||
state: "草稿",
|
||||
creater: "毛继禹",
|
||||
time: "2022-07-20 14:00:03",
|
||||
},
|
||||
{
|
||||
key: 4,
|
||||
projectName: "管理者进阶",
|
||||
manager: "黄华 刘俊",
|
||||
state: "草稿",
|
||||
creater: "毛继禹",
|
||||
time: "2022-07-20 14:00:03",
|
||||
},
|
||||
{
|
||||
key: 4,
|
||||
projectName: "管理者进阶",
|
||||
manager: "黄华 刘俊",
|
||||
state: "草稿",
|
||||
creater: "毛继禹",
|
||||
time: "2022-07-20 14:00:03",
|
||||
},
|
||||
{
|
||||
key: 4,
|
||||
projectName: "管理者进阶",
|
||||
manager: "黄华 刘俊",
|
||||
state: "草稿",
|
||||
creater: "毛继禹",
|
||||
time: "2022-07-20 14:00:03",
|
||||
},
|
||||
{
|
||||
key: 4,
|
||||
projectName: "管理者进阶",
|
||||
manager: "黄华 刘俊",
|
||||
state: "草稿",
|
||||
creater: "毛继禹",
|
||||
time: "2022-07-20 14:00:03",
|
||||
},
|
||||
{
|
||||
key: 4,
|
||||
projectName: "管理者进阶",
|
||||
manager: "黄华 刘俊",
|
||||
state: "草稿",
|
||||
creater: "毛继禹",
|
||||
time: "2022-07-20 14:00:03",
|
||||
},
|
||||
],
|
||||
currentPage: 1,
|
||||
tableDataTotal: 20,
|
||||
pageSize: 10,
|
||||
});
|
||||
|
||||
onMounted(() => {
|
||||
// console.log("执行");
|
||||
});
|
||||
const selectProjectName = (value, index) => {
|
||||
console.log("value", value, index);
|
||||
};
|
||||
const expandTable = (e, a) => {
|
||||
// console.log("惦记了");
|
||||
console.log("e", e, a);
|
||||
};
|
||||
return {
|
||||
...toRefs(state),
|
||||
columns,
|
||||
selectProjectName,
|
||||
expandTable,
|
||||
};
|
||||
},
|
||||
};
|
||||
</script>
|
||||
<style lang="scss">
|
||||
.projectManage {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
.filter {
|
||||
margin-left: 38px;
|
||||
margin-right: 38px;
|
||||
margin-top: 30px;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
flex-wrap: wrap;
|
||||
.filterItems {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
.select {
|
||||
margin-right: 20px;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
}
|
||||
.btns {
|
||||
display: flex;
|
||||
// flex-wrap: wrap;
|
||||
.btn {
|
||||
padding: 0px 26px 0px 26px;
|
||||
height: 38px;
|
||||
background: rgba(64, 158, 255, 0);
|
||||
border-radius: 8px;
|
||||
border: 1px solid rgba(64, 158, 255, 1);
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
margin-right: 14px;
|
||||
flex-shrink: 0;
|
||||
.search {
|
||||
background-size: 100%;
|
||||
}
|
||||
.btnText {
|
||||
font-size: 14px;
|
||||
font-weight: 400;
|
||||
color: rgba(64, 158, 255, 1);
|
||||
line-height: 36px;
|
||||
margin-left: 5px;
|
||||
}
|
||||
}
|
||||
.btn1 {
|
||||
.search {
|
||||
width: 15px;
|
||||
height: 17px;
|
||||
background-image: url("../../assets/images/courseManage/search1.png");
|
||||
}
|
||||
}
|
||||
.btn2 {
|
||||
.search {
|
||||
width: 16px;
|
||||
height: 18px;
|
||||
background-image: url("../../assets/images/courseManage/reset1.png");
|
||||
}
|
||||
}
|
||||
.btn3 {
|
||||
margin-right: 0px;
|
||||
.search {
|
||||
width: 17px;
|
||||
height: 18px;
|
||||
background-image: url("../../assets/images/courseManage/add1.png");
|
||||
}
|
||||
}
|
||||
.btn1:hover {
|
||||
background: rgba(64, 158, 255, 1);
|
||||
.search {
|
||||
background-image: url("../../assets/images/courseManage/search0.png");
|
||||
}
|
||||
.btnText {
|
||||
color: #ffffff;
|
||||
}
|
||||
}
|
||||
.btn2:hover {
|
||||
background: rgba(64, 158, 255, 1);
|
||||
.search {
|
||||
background-image: url("../../assets/images/courseManage/reset0.png");
|
||||
}
|
||||
.btnText {
|
||||
color: #ffffff;
|
||||
}
|
||||
}
|
||||
.btn3:hover {
|
||||
background: rgba(64, 158, 255, 1);
|
||||
.search {
|
||||
background-image: url("../../assets/images/courseManage/add0.png");
|
||||
}
|
||||
.btnText {
|
||||
color: #ffffff;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.tableBox {
|
||||
margin: 20px 38px 30px;
|
||||
}
|
||||
.opacation {
|
||||
font-size: 14px;
|
||||
font-weight: 400;
|
||||
color: #4ea6ff;
|
||||
// line-height: 36px;
|
||||
.more {
|
||||
position: relative;
|
||||
.moreArrow {
|
||||
width: 13px;
|
||||
height: 7px;
|
||||
display: inline-block;
|
||||
background-image: url("../../assets/images/navtop/down.png");
|
||||
background-size: 100%;
|
||||
margin: 2px;
|
||||
margin-left: 7px;
|
||||
}
|
||||
.moreItems {
|
||||
width: 80px;
|
||||
height: 70px;
|
||||
display: none;
|
||||
background: #ffffff;
|
||||
box-shadow: 2px 3px 9px 3px rgba(0, 0, 0, 0.05);
|
||||
border-radius: 3px;
|
||||
border: 0px solid #dcdcdc;
|
||||
position: absolute;
|
||||
left: 0px;
|
||||
top: 18px;
|
||||
z-index: 100;
|
||||
}
|
||||
}
|
||||
.more:hover .moreArrow {
|
||||
background-image: url("../../assets/images/navtop/up.png");
|
||||
}
|
||||
.more:hover .moreItems {
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
1
src/views/projectcenter/TemplateLibrary.vue
Normal file
1
src/views/projectcenter/TemplateLibrary.vue
Normal file
@@ -0,0 +1 @@
|
||||
<!-- 模板库页面 -->
|
||||
0
src/views/report/ReportCenter.vue
Normal file
0
src/views/report/ReportCenter.vue
Normal file
0
src/views/research/ResearchManage.vue
Normal file
0
src/views/research/ResearchManage.vue
Normal file
0
src/views/system/SystemManage.vue
Normal file
0
src/views/system/SystemManage.vue
Normal file
0
src/views/teacher/TeacherManage.vue
Normal file
0
src/views/teacher/TeacherManage.vue
Normal file
Reference in New Issue
Block a user