updates

package.json

@@ -27,18 +27,18 @@
   "devDependencies": {
     "@rushstack/eslint-patch": "^1.1.3",
     "@types/blueimp-md5": "^2.18.0",
-    "@types/node": "^17.0.25",
+    "@types/node": "^17.0.29",
     "@types/qs": "^6.9.7",
     "@vitejs/plugin-vue": "^2.3.1",
     "@vue/eslint-config-typescript": "^10.0.0",
     "@vue/tsconfig": "^0.1.3",
     "ali-oss": "^6.17.1",
     "chalk": "^5.0.1",
-    "eslint": "^8.13.0",
+    "eslint": "^8.14.0",
     "eslint-plugin-vue": "^8.7.1",
     "typescript": "~4.6.3",
     "unplugin-auto-import": "^0.7.1",
-    "vite": "^2.9.5",
+    "vite": "^2.9.6",
     "vite-plugin-checker": "^0.4.6",
     "vue-tsc": "^0.34.10"
   }

pnpm-lock.yaml

@@ -5,7 +5,7 @@ specifiers:
   '@rushstack/eslint-patch': ^1.1.3
   '@tinymce/tinymce-vue': ^5.0.0
   '@types/blueimp-md5': ^2.18.0
-  '@types/node': ^17.0.25
+  '@types/node': ^17.0.29
   '@types/qs': ^6.9.7
   '@vitejs/plugin-vue': ^2.3.1
   '@vue/eslint-config-typescript': ^10.0.0
@@ -15,14 +15,14 @@ specifiers:
   blueimp-md5: ^2.19.0
   chalk: ^5.0.1
   element-plus: ^2.1.11
-  eslint: ^8.13.0
+  eslint: ^8.14.0
   eslint-plugin-vue: ^8.7.1
   pinia: ^2.0.13
   qs: ^6.10.3
   sass: ^1.51.0
   typescript: ~4.6.3
   unplugin-auto-import: ^0.7.1
-  vite: ^2.9.5
+  vite: ^2.9.6
   vite-plugin-checker: ^0.4.6
   vue: ^3.2.33
   vue-router: ^4.0.14
@@ -43,19 +43,19 @@ dependencies:
 devDependencies:
   '@rushstack/eslint-patch': 1.1.3
   '@types/blueimp-md5': 2.18.0
-  '@types/node': 17.0.25
+  '@types/node': 17.0.29
   '@types/qs': 6.9.7
-  '@vitejs/plugin-vue': 2.3.1_vite@2.9.5+vue@3.2.33
-  '@vue/eslint-config-typescript': 10.0.0_72c1a3548548335704ca8b66d8a11662
-  '@vue/tsconfig': 0.1.3_@types+node@17.0.25
+  '@vitejs/plugin-vue': 2.3.1_vite@2.9.6+vue@3.2.33
+  '@vue/eslint-config-typescript': 10.0.0_f5d04023b0e9c1203fb3ac493367e3ca
+  '@vue/tsconfig': 0.1.3_@types+node@17.0.29
   ali-oss: 6.17.1
   chalk: 5.0.1
-  eslint: 8.13.0
-  eslint-plugin-vue: 8.7.1_eslint@8.13.0
+  eslint: 8.14.0
+  eslint-plugin-vue: 8.7.1_eslint@8.14.0
   typescript: 4.6.3
-  unplugin-auto-import: 0.7.1_vite@2.9.5
-  vite: 2.9.5_sass@1.51.0
-  vite-plugin-checker: 0.4.6_vite@2.9.5
+  unplugin-auto-import: 0.7.1_vite@2.9.6
+  vite: 2.9.6_sass@1.51.0
+  vite-plugin-checker: 0.4.6_vite@2.9.6
   vue-tsc: 0.34.10_typescript@4.6.3
 
 packages:
@@ -103,8 +103,8 @@ packages:
       vue: 3.2.33
     dev: false
 
-  /@eslint/eslintrc/1.2.1:
-    resolution: {integrity: sha512-bxvbYnBPN1Gibwyp6NrpnFzA3YtRL3BBAyEAFVIpNTm2Rn4Vy87GA5M4aSn3InRrlsbX5N0GW7XIx+U4SAEKdQ==}
+  /@eslint/eslintrc/1.2.2:
+    resolution: {integrity: sha512-lTVWHs7O2hjBFZunXTZYnYqtB9GakA1lnxIf+gKq2nY5gxkkNi/lQvveW6t8gFdOHTg6nG50Xs95PrLqVpcaLg==}
     engines: {node: ^12.22.0 || ^14.17.0 || >=16.0.0}
     dependencies:
       ajv: 6.12.6
@@ -214,15 +214,15 @@ packages:
     resolution: {integrity: sha512-/THyiqyQAP9AfARo4pF+aCGcyiQ94tX/Is2I7HofNRqoYLgN1PBoOWu2/zTA5zMxzP5EFutMtWtGAFRKUe961Q==}
     dev: false
 
-  /@types/node/17.0.25:
-    resolution: {integrity: sha512-wANk6fBrUwdpY4isjWrKTufkrXdu1D2YHCot2fD/DfWxF5sMrVSA+KN7ydckvaTCh0HiqX9IVl0L5/ZoXg5M7w==}
+  /@types/node/17.0.29:
+    resolution: {integrity: sha512-tx5jMmMFwx7wBwq/V7OohKDVb/JwJU5qCVkeLMh1//xycAJ/ESuw9aJ9SEtlCZDYi2pBfe4JkisSoAtbOsBNAA==}
     dev: true
 
   /@types/qs/6.9.7:
     resolution: {integrity: sha512-FGa1F62FT09qcrueBA6qYTrJPVDzah9a+493+o2PCXsesWHIn27G98TsSMs3WPNbZIEj4+VJf6saSFpvD+3Zsw==}
     dev: true
 
-  /@typescript-eslint/eslint-plugin/5.19.0_f34adc8488d2e4f014fe61432d70cbf2:
+  /@typescript-eslint/eslint-plugin/5.19.0_851e4194b2dcd49c3bd3bab657985903:
     resolution: {integrity: sha512-w59GpFqDYGnWFim9p6TGJz7a3qWeENJuAKCqjGSx+Hq/bwq3RZwXYqy98KIfN85yDqz9mq6QXiY5h0FjGQLyEg==}
     engines: {node: ^12.22.0 || ^14.17.0 || >=16.0.0}
     peerDependencies:
@@ -233,12 +233,12 @@ packages:
       typescript:
         optional: true
     dependencies:
-      '@typescript-eslint/parser': 5.19.0_eslint@8.13.0+typescript@4.6.3
+      '@typescript-eslint/parser': 5.19.0_eslint@8.14.0+typescript@4.6.3
       '@typescript-eslint/scope-manager': 5.19.0
-      '@typescript-eslint/type-utils': 5.19.0_eslint@8.13.0+typescript@4.6.3
-      '@typescript-eslint/utils': 5.19.0_eslint@8.13.0+typescript@4.6.3
+      '@typescript-eslint/type-utils': 5.19.0_eslint@8.14.0+typescript@4.6.3
+      '@typescript-eslint/utils': 5.19.0_eslint@8.14.0+typescript@4.6.3
       debug: 4.3.4
-      eslint: 8.13.0
+      eslint: 8.14.0
       functional-red-black-tree: 1.0.1
       ignore: 5.2.0
       regexpp: 3.2.0
@@ -249,7 +249,7 @@ packages:
       - supports-color
     dev: true
 
-  /@typescript-eslint/parser/5.19.0_eslint@8.13.0+typescript@4.6.3:
+  /@typescript-eslint/parser/5.19.0_eslint@8.14.0+typescript@4.6.3:
     resolution: {integrity: sha512-yhktJjMCJX8BSBczh1F/uY8wGRYrBeyn84kH6oyqdIJwTGKmzX5Qiq49LRQ0Jh0LXnWijEziSo6BRqny8nqLVQ==}
     engines: {node: ^12.22.0 || ^14.17.0 || >=16.0.0}
     peerDependencies:
@@ -263,7 +263,7 @@ packages:
       '@typescript-eslint/types': 5.19.0
       '@typescript-eslint/typescript-estree': 5.19.0_typescript@4.6.3
       debug: 4.3.4
-      eslint: 8.13.0
+      eslint: 8.14.0
       typescript: 4.6.3
     transitivePeerDependencies:
       - supports-color
@@ -277,7 +277,7 @@ packages:
       '@typescript-eslint/visitor-keys': 5.19.0
     dev: true
 
-  /@typescript-eslint/type-utils/5.19.0_eslint@8.13.0+typescript@4.6.3:
+  /@typescript-eslint/type-utils/5.19.0_eslint@8.14.0+typescript@4.6.3:
     resolution: {integrity: sha512-O6XQ4RI4rQcBGshTQAYBUIGsKqrKeuIOz9v8bckXZnSeXjn/1+BDZndHLe10UplQeJLXDNbaZYrAytKNQO2T4Q==}
     engines: {node: ^12.22.0 || ^14.17.0 || >=16.0.0}
     peerDependencies:
@@ -287,9 +287,9 @@ packages:
       typescript:
         optional: true
     dependencies:
-      '@typescript-eslint/utils': 5.19.0_eslint@8.13.0+typescript@4.6.3
+      '@typescript-eslint/utils': 5.19.0_eslint@8.14.0+typescript@4.6.3
       debug: 4.3.4
-      eslint: 8.13.0
+      eslint: 8.14.0
       tsutils: 3.21.0_typescript@4.6.3
       typescript: 4.6.3
     transitivePeerDependencies:
@@ -322,7 +322,7 @@ packages:
       - supports-color
     dev: true
 
-  /@typescript-eslint/utils/5.19.0_eslint@8.13.0+typescript@4.6.3:
+  /@typescript-eslint/utils/5.19.0_eslint@8.14.0+typescript@4.6.3:
     resolution: {integrity: sha512-ZuEckdupXpXamKvFz/Ql8YnePh2ZWcwz7APICzJL985Rp5C2AYcHO62oJzIqNhAMtMK6XvrlBTZeNG8n7gS3lQ==}
     engines: {node: ^12.22.0 || ^14.17.0 || >=16.0.0}
     peerDependencies:
@@ -332,9 +332,9 @@ packages:
       '@typescript-eslint/scope-manager': 5.19.0
       '@typescript-eslint/types': 5.19.0
       '@typescript-eslint/typescript-estree': 5.19.0_typescript@4.6.3
-      eslint: 8.13.0
+      eslint: 8.14.0
       eslint-scope: 5.1.1
-      eslint-utils: 3.0.0_eslint@8.13.0
+      eslint-utils: 3.0.0_eslint@8.14.0
     transitivePeerDependencies:
       - supports-color
       - typescript
@@ -348,14 +348,14 @@ packages:
       eslint-visitor-keys: 3.3.0
     dev: true
 
-  /@vitejs/plugin-vue/2.3.1_vite@2.9.5+vue@3.2.33:
+  /@vitejs/plugin-vue/2.3.1_vite@2.9.6+vue@3.2.33:
     resolution: {integrity: sha512-YNzBt8+jt6bSwpt7LP890U1UcTOIZZxfpE5WOJ638PNxSEKOqAi0+FSKS0nVeukfdZ0Ai/H7AFd6k3hayfGZqQ==}
     engines: {node: '>=12.0.0'}
     peerDependencies:
       vite: ^2.5.10
       vue: ^3.2.25
     dependencies:
-      vite: 2.9.5_sass@1.51.0
+      vite: 2.9.6_sass@1.51.0
       vue: 3.2.33
     dev: true
 
@@ -427,18 +427,18 @@ packages:
     resolution: {integrity: sha512-IiA0SvDrJEgXvVxjNkHPFfDx6SXw0b/TUkqMcDZWNg9fnCAHbTpoo59YfJ9QLFkwa3raau5vSlRVzMSLDnfdtQ==}
     dev: false
 
-  /@vue/eslint-config-typescript/10.0.0_72c1a3548548335704ca8b66d8a11662:
+  /@vue/eslint-config-typescript/10.0.0_f5d04023b0e9c1203fb3ac493367e3ca:
     resolution: {integrity: sha512-F94cL8ug3FaYXlCfU5/wiGjk1qeadmoBpRGAOBq+qre3Smdupa59dd6ZJrsfRODpsMPyTG7330juMDsUvpZ3Rw==}
     engines: {node: ^12.22.0 || ^14.17.0 || >=16.0.0}
     peerDependencies:
       eslint: ^6.2.0 || ^7.0.0 || ^8.0.0
       eslint-plugin-vue: ^8.0.1
     dependencies:
-      '@typescript-eslint/eslint-plugin': 5.19.0_f34adc8488d2e4f014fe61432d70cbf2
-      '@typescript-eslint/parser': 5.19.0_eslint@8.13.0+typescript@4.6.3
-      eslint: 8.13.0
-      eslint-plugin-vue: 8.7.1_eslint@8.13.0
-      vue-eslint-parser: 8.3.0_eslint@8.13.0
+      '@typescript-eslint/eslint-plugin': 5.19.0_851e4194b2dcd49c3bd3bab657985903
+      '@typescript-eslint/parser': 5.19.0_eslint@8.14.0+typescript@4.6.3
+      eslint: 8.14.0
+      eslint-plugin-vue: 8.7.1_eslint@8.14.0
+      vue-eslint-parser: 8.3.0_eslint@8.14.0
     transitivePeerDependencies:
       - supports-color
       - typescript
@@ -486,7 +486,7 @@ packages:
   /@vue/shared/3.2.33:
     resolution: {integrity: sha512-UBc1Pg1T3yZ97vsA2ueER0F6GbJebLHYlEi4ou1H5YL4KWvMOOWwpYo9/QpWq93wxKG6Wo13IY74Hcn/f7c7Bg==}
 
-  /@vue/tsconfig/0.1.3_@types+node@17.0.25:
+  /@vue/tsconfig/0.1.3_@types+node@17.0.29:
     resolution: {integrity: sha512-kQVsh8yyWPvHpb8gIc9l/HIDiiVUy1amynLNpCy8p+FoCiZXCo6fQos5/097MmnNZc9AtseDsCrfkhqCrJ8Olg==}
     peerDependencies:
       '@types/node': '*'
@@ -494,7 +494,7 @@ packages:
       '@types/node':
         optional: true
     dependencies:
-      '@types/node': 17.0.25
+      '@types/node': 17.0.29
     dev: true
 
   /@vueuse/core/8.2.6_vue@3.2.33:
@@ -1204,19 +1204,19 @@ packages:
       source-map: 0.6.1
     dev: true
 
-  /eslint-plugin-vue/8.7.1_eslint@8.13.0:
+  /eslint-plugin-vue/8.7.1_eslint@8.14.0:
     resolution: {integrity: sha512-28sbtm4l4cOzoO1LtzQPxfxhQABararUb1JtqusQqObJpWX2e/gmVyeYVfepizPFne0Q5cILkYGiBoV36L12Wg==}
     engines: {node: ^12.22.0 || ^14.17.0 || >=16.0.0}
     peerDependencies:
       eslint: ^6.2.0 || ^7.0.0 || ^8.0.0
     dependencies:
-      eslint: 8.13.0
-      eslint-utils: 3.0.0_eslint@8.13.0
+      eslint: 8.14.0
+      eslint-utils: 3.0.0_eslint@8.14.0
       natural-compare: 1.4.0
       nth-check: 2.0.1
       postcss-selector-parser: 6.0.10
       semver: 7.3.7
-      vue-eslint-parser: 8.3.0_eslint@8.13.0
+      vue-eslint-parser: 8.3.0_eslint@8.14.0
     transitivePeerDependencies:
       - supports-color
     dev: true
@@ -1237,13 +1237,13 @@ packages:
       estraverse: 5.3.0
     dev: true
 
-  /eslint-utils/3.0.0_eslint@8.13.0:
+  /eslint-utils/3.0.0_eslint@8.14.0:
     resolution: {integrity: sha512-uuQC43IGctw68pJA1RgbQS8/NP7rch6Cwd4j3ZBtgo4/8Flj4eGE7ZYSZRN3iq5pVUv6GPdW5Z1RFleo84uLDA==}
     engines: {node: ^10.0.0 || ^12.0.0 || >= 14.0.0}
     peerDependencies:
       eslint: '>=5'
     dependencies:
-      eslint: 8.13.0
+      eslint: 8.14.0
       eslint-visitor-keys: 2.1.0
     dev: true
 
@@ -1257,12 +1257,12 @@ packages:
     engines: {node: ^12.22.0 || ^14.17.0 || >=16.0.0}
     dev: true
 
-  /eslint/8.13.0:
-    resolution: {integrity: sha512-D+Xei61eInqauAyTJ6C0q6x9mx7kTUC1KZ0m0LSEexR0V+e94K12LmWX076ZIsldwfQ2RONdaJe0re0TRGQbRQ==}
+  /eslint/8.14.0:
+    resolution: {integrity: sha512-3/CE4aJX7LNEiE3i6FeodHmI/38GZtWCsAtsymScmzYapx8q1nVVb+eLcLSzATmCPXw5pT4TqVs1E0OmxAd9tw==}
     engines: {node: ^12.22.0 || ^14.17.0 || >=16.0.0}
     hasBin: true
     dependencies:
-      '@eslint/eslintrc': 1.2.1
+      '@eslint/eslintrc': 1.2.2
       '@humanwhocodes/config-array': 0.9.5
       ajv: 6.12.6
       chalk: 4.1.2
@@ -1271,7 +1271,7 @@ packages:
       doctrine: 3.0.0
       escape-string-regexp: 4.0.0
       eslint-scope: 7.1.1
-      eslint-utils: 3.0.0_eslint@8.13.0
+      eslint-utils: 3.0.0_eslint@8.14.0
       eslint-visitor-keys: 3.3.0
       espree: 9.3.1
       esquery: 1.4.0
@@ -2525,7 +2525,7 @@ packages:
     engines: {node: '>= 0.8'}
     dev: true
 
-  /unplugin-auto-import/0.7.1_vite@2.9.5:
+  /unplugin-auto-import/0.7.1_vite@2.9.6:
     resolution: {integrity: sha512-9865OV9eP99PNxHR2mtTDExeN01m4M9boT5U2BtIwsU1wDRsaFIYWLwcCBEjvXzXfTTC2NNMskhHGVAMfL2WgA==}
     engines: {node: '>=14'}
     peerDependencies:
@@ -2539,7 +2539,7 @@ packages:
       local-pkg: 0.4.1
       magic-string: 0.26.1
       resolve: 1.22.0
-      unplugin: 0.6.2_vite@2.9.5
+      unplugin: 0.6.2_vite@2.9.6
     transitivePeerDependencies:
       - esbuild
       - rollup
@@ -2547,7 +2547,7 @@ packages:
       - webpack
     dev: true
 
-  /unplugin/0.6.2_vite@2.9.5:
+  /unplugin/0.6.2_vite@2.9.6:
     resolution: {integrity: sha512-+QONc2uBFQbeo4x5mlJHjTKjR6pmuchMpGVrWhwdGFFMb4ttFZ4E9KqhOOrNcm3Q8NNyB1vJ4s5e36IZC7UWYw==}
     peerDependencies:
       esbuild: '>=0.13'
@@ -2565,7 +2565,7 @@ packages:
         optional: true
     dependencies:
       chokidar: 3.5.3
-      vite: 2.9.5_sass@1.51.0
+      vite: 2.9.6_sass@1.51.0
       webpack-sources: 3.2.3
       webpack-virtual-modules: 0.4.3
     dev: true
@@ -2625,7 +2625,7 @@ packages:
     resolution: {integrity: sha512-l8lCEmLcLYZh4nbunNZvQCJc5pv7+RCwa8q/LdUx8u7lsWvPDKmpodJAJNwkAhJC//dFY48KuIEmjtd4RViDrA==}
     dev: true
 
-  /vite-plugin-checker/0.4.6_vite@2.9.5:
+  /vite-plugin-checker/0.4.6_vite@2.9.6:
     resolution: {integrity: sha512-oFel33hlsc8aUspfq0ThQRpWsfrG772fmZ5qPHKUhmew6ieejd2viITlwXHIRBY6hE3U0kirXoTWwft3DdbK+g==}
     hasBin: true
     peerDependencies:
@@ -2642,15 +2642,15 @@ packages:
       npm-run-path: 4.0.1
       strip-ansi: 6.0.1
       tiny-invariant: 1.2.0
-      vite: 2.9.5_sass@1.51.0
+      vite: 2.9.6_sass@1.51.0
       vscode-languageclient: 7.0.0
       vscode-languageserver: 7.0.0
       vscode-languageserver-textdocument: 1.0.4
       vscode-uri: 3.0.3
     dev: true
 
-  /vite/2.9.5_sass@1.51.0:
-    resolution: {integrity: sha512-dvMN64X2YEQgSXF1lYabKXw3BbN6e+BL67+P3Vy4MacnY+UzT1AfkHiioFSi9+uiDUiaDy7Ax/LQqivk6orilg==}
+  /vite/2.9.6_sass@1.51.0:
+    resolution: {integrity: sha512-3IffdrByHW95Yjv0a13TQOQfJs7L5dVlSPuTt432XLbRMriWbThqJN2k/IS6kXn5WY4xBLhK9XoaWay1B8VzUw==}
     engines: {node: '>=12.2.0'}
     hasBin: true
     peerDependencies:
@@ -2738,14 +2738,14 @@ packages:
       vue: 3.2.33
     dev: false
 
-  /vue-eslint-parser/8.3.0_eslint@8.13.0:
+  /vue-eslint-parser/8.3.0_eslint@8.14.0:
     resolution: {integrity: sha512-dzHGG3+sYwSf6zFBa0Gi9ZDshD7+ad14DGOdTLjruRVgZXe2J+DcZ9iUhyR48z5g1PqRa20yt3Njna/veLJL/g==}
     engines: {node: ^12.22.0 || ^14.17.0 || >=16.0.0}
     peerDependencies:
       eslint: '>=6.0.0'
     dependencies:
       debug: 4.3.4
-      eslint: 8.13.0
+      eslint: 8.14.0
       eslint-scope: 7.1.1
       eslint-visitor-keys: 3.3.0
       espree: 9.3.1

src/api/base.ts

@@ -29,3 +29,8 @@ export function uploadFile(data: Record<string, any>) {
     })
     .then(() => data)
 }
+
+// 删除评论
+export function deleteComment(data: { id: string }) {
+  return httpRequest.post('/api/psp/backend/comment/delete', data)
+}

src/components/PublishItem.vue

+<script setup lang="ts">
+import { ElMessage, ElMessageBox } from 'element-plus'
+import { Delete } from '@element-plus/icons-vue'
+import { deleteComment } from '@/api/base'
+
+const props = defineProps<{ info: Record<string, any>; comments: { total: number; list: Record<string, any>[] } }>()
+const emit = defineEmits(['remove'])
+const imageList = computed<string[]>(() => {
+  try {
+    return JSON.parse(props.info.picture)
+  } catch (error) {
+    return []
+  }
+})
+
+const onRemove = (data: any) => {
+  ElMessageBox.confirm('确定要删除吗？', '提示').then(() => {
+    deleteComment({ id: data.id }).then(() => {
+      ElMessage({ type: 'success', message: '删除成功' })
+      emit('remove', data)
+    })
+  })
+}
+</script>
+
+<template>
+  <div class="publish-item">
+    <div class="publish-item-hd" v-if="info.user_info">
+      <img
+        :src="info.user_info.avatar || 'https://webapp-pub.ezijing.com/weapp/share/default.jpg'"
+        class="publish-avatar"
+      />
+      <div class="publish-item-hd-info">
+        <h5>{{ info.user_info.name }}</h5>
+      </div>
+    </div>
+    <div class="publish-item-bd">
+      <div class="publish-content" v-html="info.content || info.desc"></div>
+      <ul class="publish-picture">
+        <li v-for="url in imageList" :key="url">
+          <el-image :src="url" :preview-src-list="[url]" fit="cover" />
+        </li>
+      </ul>
+      <div class="publish-tools">
+        <p class="t1">{{ info.created_time }}</p>
+      </div>
+      <!-- 评论 -->
+      <div class="publish-comments" v-if="comments.total">
+        <div class="comment-item" v-for="item in comments.list" :key="item.id">
+          <div class="comment-item-hd">
+            <span>{{ item.user_name }}</span> <el-icon><delete @click="onRemove(item)" /></el-icon>
+          </div>
+          <div class="comment-item-bd">{{ item.content }}</div>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<style lang="scss">
+.publish-item {
+  margin-bottom: 20px;
+}
+.publish-item-hd {
+  display: flex;
+  align-items: center;
+}
+.publish-item-hd-info {
+  flex: 1;
+  margin-left: 10px;
+  h5 {
+    font-size: 16px;
+    font-weight: 400;
+    color: #333333;
+  }
+}
+.publish-avatar {
+  width: 50px;
+  height: 50px;
+  border-radius: 50%;
+  overflow: hidden;
+  object-fit: cover;
+}
+.publish-item-bd {
+  margin-left: 60px;
+}
+.publish-content {
+  font-weight: 400;
+  line-height: 30px;
+  color: #333333;
+}
+.publish-picture {
+  margin-top: 10px;
+  display: flex;
+  li {
+    margin: 0 10px 10px 0;
+    width: 200px;
+    height: 200px;
+    border: 1px solid #e4e7ed;
+    border-radius: 10px;
+    overflow: hidden;
+    .el-image {
+      width: 100%;
+      height: 100%;
+    }
+    &:hover {
+      box-shadow: rgba(0, 0, 0, 0.12) 0px 0px 12px 0px;
+    }
+  }
+}
+.publish-tools {
+  margin-top: 10px;
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  color: #999;
+  .t2 {
+    display: flex;
+    align-items: center;
+    font-size: 14px;
+    cursor: pointer;
+    .el-icon {
+      margin-right: 5px;
+    }
+  }
+}
+.publish-comments {
+  margin: 10px 0;
+  padding: 10px 20px;
+  background-color: #f5f5f5;
+  border-radius: 10px;
+}
+.comment-item + .comment-item {
+  border-top: 1px solid #e4e7ed;
+  padding-top: 12px;
+  margin-top: 12px;
+}
+.comment-item {
+  &:hover {
+    .el-icon {
+      display: block;
+    }
+  }
+}
+.comment-item-hd {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  font-size: 16px;
+  color: #033974;
+  .el-icon {
+    display: none;
+    cursor: pointer;
+  }
+}
+.comment-item-bd {
+  margin-top: 5px;
+  font-size: 14px;
+  color: #4e4e4e;
+  line-height: 20px;
+}
+.comment-more {
+  padding: 0.16rem 0;
+  font-size: 24px;
+  color: #033974;
+  line-height: 0.36rem;
+  text-align: center;
+  border-top: 0.01rem solid #d3d3d3;
+  cursor: pointer;
+}
+</style>

src/components/base/AppList.vue

 <script setup lang="ts">
-import { withDefaults, ref, reactive, onMounted } from 'vue'
 import { Search, RefreshLeft } from '@element-plus/icons-vue'
 
 interface IRemoteProps {
@@ -107,6 +106,7 @@ onMounted(() => {
 
 defineExpose({ refetch })
 </script>
+
 <template>
   <div class="table-list">
     <div class="table-list-hd">
@@ -120,21 +120,27 @@ defineExpose({ refetch })
               </template>
               <template v-else>
                 <!-- input -->
-                <el-input v-model="params[item.prop]" v-bind="item" clearable v-if="item.type === 'input'" />
+                <el-input
+                  v-model="params[item.prop]"
+                  v-bind="item"
+                  clearable
+                  @change="search"
+                  v-if="item.type === 'input'"
+                />
                 <!-- select -->
                 <el-select
                   v-model="params[item.prop]"
-                  clearable
                   v-bind="item"
-                  v-if="item.type === 'select'"
+                  clearable
                   @change="search"
+                  v-if="item.type === 'select'"
                 >
-                  <template v-for="(option, index) in item.options" :key="index">
-                    <el-option
-                      :label="option[item.labelKey] || option.label"
-                      :value="option[item.valueKey] || option.value"
-                    ></el-option>
-                  </template>
+                  <el-option
+                    :label="option[item.labelKey] || option.label"
+                    :value="option[item.valueKey] || option.value"
+                    v-for="(option, index) in item.options"
+                    :key="index"
+                  />
                 </el-select>
               </template>
             </el-form-item>
@@ -153,7 +159,7 @@ defineExpose({ refetch })
       <slot name="body" v-bind="{ data: dataList }">
         <el-table :data="dataList" v-loading="loading" v-bind="$attrs" style="height: 100%" ref="tableRef">
           <el-table-column v-bind="item" v-for="item in columns" :key="item.prop">
-            <template v-slot:default="scope" v-if="item.slots || item.computed">
+            <template #default="scope" v-if="item.slots || item.computed">
               <slot :name="item.slots" v-bind="scope" v-if="item.slots"></slot>
               <div v-html="item.computed(scope)" v-if="item.computed"></div>
             </template>
@@ -163,7 +169,7 @@ defineExpose({ refetch })
     </div>
     <!-- 底部 -->
     <div class="table-list-ft">
-      <div style="padding: 10px 0">
+      <div>
         <slot name="footer"></slot>
       </div>
       <el-pagination
@@ -202,32 +208,15 @@ defineExpose({ refetch })
   flex: 1;
 }
 .table-list-ft {
+  padding: 10px 0;
   display: flex;
   align-items: center;
   justify-content: space-between;
 }
 .table-list-pagination {
-  padding: 10px 0;
   text-align: right;
 }
 .el-table-column--selection .cell {
   padding: 0 14px !important;
 }
-.more-filter-drawer {
-  height: 100%;
-  display: flex;
-  flex-direction: column;
-  padding: 0 20px 20px;
-  box-sizing: border-box;
-}
-.more-filter {
-  flex: 1;
-  overflow-y: auto;
-}
-.more-filter-buttons {
-  display: flex;
-  .el-button {
-    flex: 1;
-  }
-}
 </style>

src/components/layout/Aside.vue

+<script lang="ts">
+export default {
+  name: 'AppAside'
+}
+</script>
+
 <script setup lang="ts">
-import { computed } from 'vue'
 import type { Component } from 'vue'
-import { useRoute } from 'vue-router'
 import { User, Picture, Files, VideoCamera, Notebook, DishDot, QuestionFilled, Stamp } from '@element-plus/icons-vue'
 const route = useRoute()
 interface IMenuItem {

src/components/layout/Main.vue

+<script lang="ts">
+export default { name: 'AppMain' }
+</script>
+
+<script setup lang="ts">
+import AppBreadcrumb from './Breadcrumb.vue'
+withDefaults(defineProps<{ hasBreadcrumb?: boolean }>(), {
+  hasBreadcrumb: true
+})
+</script>
+
 <template>
   <section class="app-main">
     <div class="app-main-inner">
@@ -11,15 +22,6 @@
   </section>
 </template>
 
-<script>
-import AppBreadcrumb from './Breadcrumb.vue'
-export default {
-  name: 'AppMain',
-  props: { hasBreadcrumb: { type: Boolean, default: true } },
-  components: { AppBreadcrumb }
-}
-</script>
-
 <style>
 .app-main {
   position: relative;

src/modules/audit/api.ts

@@ -7,7 +7,7 @@ export function getAuditList(params?: { type?: string; page?: number; page_size?
 }
 
 // 获取审核详情
-export function getAudit(params: { id: string }) {
+export function getAudit(params: { id: string; page_size?: number; page?: number }) {
   return httpRequest.get('/api/psp/backend/auditing/view', { params })
 }
 

src/modules/audit/index.ts

@@ -5,6 +5,9 @@ export const routes: Array<RouteRecordRaw> = [
   {
     path: '/audit',
     component: AppLayout,
-    children: [{ path: '', component: () => import('./views/List.vue') }]
+    children: [
+      { path: '', component: () => import('./views/List.vue') },
+      { path: 'view/:id', component: () => import('./views/View.vue'), props: true }
+    ]
   }
 ]

src/modules/audit/views/List.vue

 <script setup lang="ts">
-import { ElMessage } from 'element-plus'
+import { ElMessage, ElMessageBox } from 'element-plus'
 import { ArrowDown } from '@element-plus/icons-vue'
 import { getAuditList, submitAudit } from '../api'
 
@@ -42,8 +42,9 @@ const listOptions = computed(() => {
         label: '状态',
         options: [
           { label: '全部', value: '' },
-          { label: '已审核', value: '1' },
-          { label: '待审核', value: '2' }
+          { label: '待审核', value: '2' },
+          { label: '审核已通过', value: '1' },
+          { label: '审核未通过', value: '3' }
         ]
       }
     ],
@@ -60,13 +61,19 @@ const onChangeType = (value: any) => {
   tabActive.value = value
   appList.value?.refetch()
 }
-
-const onAudit = (row: any, status: number) => {
-  submitAudit({ tab: tabActive.value, id: row.id, status, audit_comment: '' }).then(() => {
+// 审核
+const onAudit = (row: any, status: number, comment?: string) => {
+  submitAudit({ tab: tabActive.value, id: row.id, status, audit_comment: comment }).then(() => {
     ElMessage({ type: 'success', message: '审核完成' })
     appList.value?.refetch()
   })
 }
+// 审核拒绝
+const onAuditReject = (row: any, status: number) => {
+  ElMessageBox.prompt('请输入拒绝原因', '提示').then(({ value }) => {
+    onAudit(row, status, value)
+  })
+}
 </script>
 
 <template>
@@ -88,11 +95,11 @@ const onAudit = (row: any, status: number) => {
             <template #dropdown>
               <el-dropdown-menu>
                 <el-dropdown-item @click="onAudit(row, 1)">通过</el-dropdown-item>
-                <el-dropdown-item @click="onAudit(row, 3)">拒绝</el-dropdown-item>
+                <el-dropdown-item @click="onAuditReject(row, 3)">拒绝</el-dropdown-item>
               </el-dropdown-menu>
             </template>
           </el-dropdown>
-          <router-link :to="`/banner/view/${row.id}`">
+          <router-link :to="`/audit/view/${row.id}`" v-if="tabActive === 'course'">
             <el-button plain type="primary">查看</el-button>
           </router-link>
         </el-space>

src/modules/audit/views/View.vue

+<script setup lang="ts">
+import PublishItem from '@/components/PublishItem.vue'
+import { getAudit } from '../api'
+
+const props = defineProps<{ id: string }>()
+
+let data = $ref<{ info: Record<string, any>; comments: { total: number; list: Record<string, any>[] } }>({
+  info: {},
+  comments: { total: 0, list: [] }
+})
+let loading = $ref<boolean>(false)
+
+const getAuditInfo = () => {
+  loading = true
+  getAudit({ id: props.id, page_size: 100 })
+    .then(res => {
+      const { info, comments } = res.data
+      data = { info, comments }
+    })
+    .finally(() => {
+      loading = false
+    })
+}
+onMounted(() => {
+  getAuditInfo()
+})
+</script>
+
+<template>
+  <AppCard v-loading="loading">
+    <PublishItem :info="data.info" :comments="data.comments" @remove="getAuditInfo"></PublishItem>
+  </AppCard>
+</template>

src/modules/qa/api.ts

@@ -6,7 +6,7 @@ export function getQuestionList(params?: { name?: string; mobile?: string; page?
 }
 
 // 获取问题详情
-export function getQuestion(params: { id: string }) {
+export function getQuestion(params: { id: string; page_size?: number; page?: number }) {
   return httpRequest.get('/api/psp/backend/question/view', { params })
 }
 

src/modules/qa/index.ts

@@ -5,6 +5,9 @@ export const routes: Array<RouteRecordRaw> = [
   {
     path: '/qa',
     component: AppLayout,
-    children: [{ path: '', component: () => import('./views/List.vue') }]
+    children: [
+      { path: '', component: () => import('./views/List.vue') },
+      { path: 'view/:id', component: () => import('./views/View.vue'), props: true }
+    ]
   }
 ]

src/modules/qa/views/List.vue

@@ -38,7 +38,7 @@ const onRemove = (row: any) => {
     <AppList v-bind="listOptions" ref="appList">
       <template #table-operate="{ row }">
         <el-space>
-          <router-link :to="`/video/view/${row.id}`">
+          <router-link :to="`/qa/view/${row.id}`">
             <el-button type="primary" plain>查看</el-button>
           </router-link>
           <el-button type="danger" plain @click="onRemove(row)">删除</el-button>

src/modules/qa/views/View.vue

+<script setup lang="ts">
+import PublishItem from '@/components/PublishItem.vue'
+import { getQuestion } from '../api'
+
+const props = defineProps<{ id: string }>()
+
+let data = $ref<{ info: Record<string, any>; comments: { total: number; list: Record<string, any>[] } }>({
+  info: {},
+  comments: { total: 0, list: [] }
+})
+let loading = $ref<boolean>(false)
+
+const getQuestionInfo = () => {
+  loading = true
+  getQuestion({ id: props.id, page_size: 100 })
+    .then(res => {
+      const { info, comments } = res.data
+      data = { info, comments }
+    })
+    .finally(() => {
+      loading = false
+    })
+}
+onMounted(() => {
+  getQuestionInfo()
+})
+</script>
+
+<template>
+  <AppCard v-loading="loading">
+    <h1 class="qa-title">{{ data.info.title }}</h1>
+    <PublishItem :info="data.info" :comments="data.comments" @remove="getQuestionInfo"></PublishItem>
+  </AppCard>
+</template>
+
+<style lang="scss" scoped>
+.qa-title {
+  font-size: 20px;
+  margin-bottom: 20px;
+}
+</style>

src/modules/student/views/Update.vue

@@ -5,7 +5,6 @@ import { updateUser, getUser } from '../api'
 
 const props = defineProps<{ id: string }>()
 const router = useRouter()
-
 const formRef = ref<FormInstance>()
 const form = reactive({
   name: '',

src/modules/student/views/View.vue

@@ -56,3 +56,10 @@ onMounted(() => {
     </el-tabs>
   </AppCard>
 </template>
+
+<style lang="scss" scoped>
+:deep(.el-descriptions__label) {
+  width: 100px;
+  text-align: center !important;
+}
+</style>

src/modules/team/api.ts

 import httpRequest from '@/utils/axios'
 
-// 获取学员列表
+// 获取团队列表
 export function getTeamList(params?: { name?: string; status?: string; page?: number; page_size?: number }) {
   return httpRequest.get('/api/psp/backend/team/index', { params })
 }
+
+// 团队审核
+export function submitAudit(data: { id: string; status: number }) {
+  return httpRequest.post('/api/psp/backend/team/audit', data)
+}
+
+// 获取团队详情
+export function getTeam(params: { id: string; page?: number; page_size?: number }) {
+  return httpRequest.get('/api/psp/backend/team/view', { params })
+}

src/modules/team/index.ts

@@ -5,6 +5,9 @@ export const routes: Array<RouteRecordRaw> = [
   {
     path: '/team',
     component: AppLayout,
-    children: [{ path: '', component: () => import('./views/List.vue') }]
+    children: [
+      { path: '', component: () => import('./views/List.vue') },
+      { path: 'view/:id', component: () => import('./views/View.vue'), props: true }
+    ]
   }
 ]

src/modules/team/views/List.vue

 <script setup lang="ts">
-import { getTeamList } from '../api'
+import { ElMessage } from 'element-plus'
+import { getTeamList, submitAudit } from '../api'
+
+const appList = ref()
 
 const listOptions = {
   remote: {
@@ -29,15 +32,22 @@ const listOptions = {
     { label: '积分', prop: 'star' },
     { label: '资料数量', prop: 'files_count' },
     { label: '问答数量', prop: 'questions_count' },
-    { label: '审核', prop: 'status', slots: 'table-status', width: 160, align: 'center' },
-    { label: '操作', slots: 'table-operate', width: 100, align: 'right' }
+    { label: '审核状态', prop: 'status_name' },
+    { label: '操作', slots: 'table-operate', width: 180, align: 'right' }
   ]
 }
+// 审核
+const onAudit = (row: any, status: number) => {
+  submitAudit({ id: row.id, status }).then(() => {
+    ElMessage({ type: 'success', message: '审核完成' })
+    appList.value?.refetch()
+  })
+}
 </script>
 
 <template>
   <AppCard>
-    <AppList v-bind="listOptions">
+    <AppList v-bind="listOptions" ref="appList">
       <template #table-logo="{ row }">
         <el-image
           :src="row.logo + '?x-oss-process=image/resize,m_fill,h_100,w_200'"
@@ -48,12 +58,23 @@ const listOptions = {
           style="width: 200px; height: 100px"
         />
       </template>
-      <template #table-status="{ row }">
-        <el-switch :value="row.status" active-text="通过" active-value="1" inactive-text="未通过" inactive-value="2" />
-      </template>
-
-      <template #table-operate>
-        <el-button>查看</el-button>
+      <template #table-operate="{ row }">
+        <el-space>
+          <el-dropdown v-if="row.status === '2'">
+            <el-button type="primary">
+              审核<el-icon class="el-icon--right"><arrow-down /></el-icon>
+            </el-button>
+            <template #dropdown>
+              <el-dropdown-menu>
+                <el-dropdown-item @click="onAudit(row, 1)">通过</el-dropdown-item>
+                <el-dropdown-item @click="onAudit(row, 0)">拒绝</el-dropdown-item>
+              </el-dropdown-menu>
+            </template>
+          </el-dropdown>
+          <router-link :to="`/team/view/${row.id}`">
+            <el-button plain type="primary">查看</el-button>
+          </router-link>
+        </el-space>
       </template>
     </AppList>
   </AppCard>

src/modules/team/views/View.vue

+<script setup lang="ts">
+// import StarRecord from '../components/StarRecord.vue'
+// import SignInRecord from '../components/SignInRecord.vue'
+import { getTeam } from '../api'
+
+const props = defineProps<{ id: string }>()
+
+let data = ref()
+let loading = ref<boolean>(false)
+const getTeamInfo = () => {
+  loading.value = true
+  getTeam({ id: props.id }).then(res => {
+    data.value = res.data
+    loading.value = false
+  })
+}
+onMounted(() => {
+  getTeamInfo()
+})
+</script>
+
+<template>
+  <AppCard title="团队信息" v-loading="loading">
+    <el-descriptions border v-if="data">
+      <el-descriptions-item label="名称">{{ data.info.name }}</el-descriptions-item>
+      <el-descriptions-item label="口号">{{ data.info.slogan }}</el-descriptions-item>
+      <el-descriptions-item label="星星数量">{{ data.info.star }}</el-descriptions-item>
+      <el-descriptions-item label="简介" :span="3">{{ data.info.brief }}</el-descriptions-item>
+      <el-descriptions-item label="Logo" :span="3">
+        <el-image :src="data.info.logo" style="width: 200px"></el-image>
+      </el-descriptions-item>
+    </el-descriptions>
+  </AppCard>
+  <AppCard>
+    <el-tabs type="card">
+      <el-tab-pane label="成员" lazy>
+        <!-- <SignInRecord :id="id"></SignInRecord> -->
+      </el-tab-pane>
+      <el-tab-pane label="资料" lazy>
+        <!-- <SignInRecord :id="id"></SignInRecord> -->
+      </el-tab-pane>
+      <el-tab-pane label="问答" lazy>
+        <!-- <StarRecord :id="id"></StarRecord> -->
+      </el-tab-pane>
+    </el-tabs>
+  </AppCard>
+</template>
+
+<style lang="scss" scoped>
+:deep(.el-descriptions__label) {
+  width: 100px;
+  text-align: center !important;
+}
+</style>

vite.config.ts

@@ -12,7 +12,7 @@ export default defineConfig(({ mode }) => {
     base: mode === 'prod' ? 'https://webapp-pub.ezijing.com/website/prod/admin-prp/' : '/',
     plugins: [
       checker({ vueTsc: true, eslint: { lintCommand: 'eslint "./src/**/*.{vue,js,jsx,ts,tsx}"' } }),
-      vue(),
+      vue({ reactivityTransform: true }),
       AutoImport({
         imports: ['vue', 'vue/macros', 'vue-router', '@vueuse/core'],
         dts: true,