课程列表页图片显示问题

2025-12-12 20:36:43 +08:00 · 2022-10-15 16:42:27 +08:00
parent dec1f6acf3
commit 3365edfea7
4 changed files with 200 additions and 7 deletions
--- a/package-lock.json
+++ b/package-lock.json
@@ -1249,6 +1249,29 @@
      "integrity": "sha512-Ct5MqZkLGEXTVmQYbGtx9SVqD2fqwvdubdps5D3djjAkgkKwT918VNOz65pEHFaYTeWcukmJmH5SwsA9Tn2ObQ==",
      "dev": true
    },
+    "@jridgewell/source-map": {
+      "version": "0.3.2",
+      "resolved": "https://registry.npmjs.org/@jridgewell/source-map/-/source-map-0.3.2.tgz",
+      "integrity": "sha512-m7O9o2uR8k2ObDysZYzdfhb08VuEml5oWGiosa1VdaPZ/A6QyPkAJuwN0Q1lhULOf6B7MtQmHENS743hWtCrgw==",
+      "dev": true,
+      "requires": {
+        "@jridgewell/gen-mapping": "^0.3.0",
+        "@jridgewell/trace-mapping": "^0.3.9"
+      },
+      "dependencies": {
+        "@jridgewell/gen-mapping": {
+          "version": "0.3.2",
+          "resolved": "https://registry.npmjs.org/@jridgewell/gen-mapping/-/gen-mapping-0.3.2.tgz",
+          "integrity": "sha512-mh65xKQAzI6iBcFzwv28KVWSmCkdRBWoOh+bYQGW3+6OZvbbN3TqMGo5hqYxQniRcH9F2VZIoJCm4pa3BPDK/A==",
+          "dev": true,
+          "requires": {
+            "@jridgewell/set-array": "^1.0.1",
+            "@jridgewell/sourcemap-codec": "^1.4.10",
+            "@jridgewell/trace-mapping": "^0.3.9"
+          }
+        }
+      }
+    },
    "@jridgewell/sourcemap-codec": {
      "version": "1.4.13",
      "resolved": "https://registry.npmmirror.com/@jridgewell/sourcemap-codec/-/sourcemap-codec-1.4.13.tgz",
@@ -1421,6 +1444,12 @@
        "@types/node": "*"
      }
    },
+    "@types/html-minifier-terser": {
+      "version": "6.1.0",
+      "resolved": "https://registry.npmjs.org/@types/html-minifier-terser/-/html-minifier-terser-6.1.0.tgz",
+      "integrity": "sha512-oh/6byDPnL1zeNXFrDXFLyZjkr1MsBG667IM792caf1L2UPOOMf65NFzjUH/ltyfwjAGfs1rsX1eftK0jC/KIg==",
+      "dev": true
+    },
    "@types/http-proxy": {
      "version": "1.17.9",
      "resolved": "https://registry.npmmirror.com/@types/http-proxy/-/http-proxy-1.17.9.tgz",
@@ -3107,6 +3136,16 @@
      "integrity": "sha512-ksWePWBloaWPxJYQ8TL0JHvtci6G5QTKwQ95RcWAa/lzoAKuAOflGdAK92hpHXjkwb8zLxoLNUoNYZgVsaJzvQ==",
      "dev": true
    },
+    "camel-case": {
+      "version": "4.1.2",
+      "resolved": "https://registry.npmjs.org/camel-case/-/camel-case-4.1.2.tgz",
+      "integrity": "sha512-gxGWBrTT1JuMx6R+o5PTXMmUnhnVzLQ9SNutD4YqKtI6ap897t3tKECYla6gCWEkplXnlNybEkZg9GEGxKFCgw==",
+      "dev": true,
+      "requires": {
+        "pascal-case": "^3.1.2",
+        "tslib": "^2.0.3"
+      }
+    },
    "camelcase": {
      "version": "6.3.0",
      "resolved": "https://registry.npmmirror.com/camelcase/-/camelcase-6.3.0.tgz",
@@ -4595,6 +4634,16 @@
        "domhandler": "^4.2.0"
      }
    },
+    "dot-case": {
+      "version": "3.0.4",
+      "resolved": "https://registry.npmjs.org/dot-case/-/dot-case-3.0.4.tgz",
+      "integrity": "sha512-Kv5nKlh6yRrdrGvxeJ2e5y2eRUpkUosIW4A2AS38zwSz27zu7ufDwQPi5Jhs3XAlGNetl3bmnGhQsMtkKJnj3w==",
+      "dev": true,
+      "requires": {
+        "no-case": "^3.0.4",
+        "tslib": "^2.0.3"
+      }
+    },
    "dot-prop": {
      "version": "5.3.0",
      "resolved": "https://registry.npmjs.org/dot-prop/-/dot-prop-5.3.0.tgz",
@@ -6277,12 +6326,114 @@
        }
      }
    },
+    "html-minifier-terser": {
+      "version": "6.1.0",
+      "resolved": "https://registry.npmjs.org/html-minifier-terser/-/html-minifier-terser-6.1.0.tgz",
+      "integrity": "sha512-YXxSlJBZTP7RS3tWnQw74ooKa6L9b9i9QYXY21eUEvhZ3u9XLfv6OnFsQq6RxkhHygsaUMvYsZRV5rU/OVNZxw==",
+      "dev": true,
+      "requires": {
+        "camel-case": "^4.1.2",
+        "clean-css": "^5.2.2",
+        "commander": "^8.3.0",
+        "he": "^1.2.0",
+        "param-case": "^3.0.4",
+        "relateurl": "^0.2.7",
+        "terser": "^5.10.0"
+      },
+      "dependencies": {
+        "acorn": {
+          "version": "8.8.0",
+          "resolved": "https://registry.npmjs.org/acorn/-/acorn-8.8.0.tgz",
+          "integrity": "sha512-QOxyigPVrpZ2GXT+PFyZTl6TtOFc5egxHIP9IlQ+RbupQuX4RkT/Bee4/kQuC02Xkzg84JcT7oLYtDIQxp+v7w==",
+          "dev": true
+        },
+        "clean-css": {
+          "version": "5.3.1",
+          "resolved": "https://registry.npmjs.org/clean-css/-/clean-css-5.3.1.tgz",
+          "integrity": "sha512-lCr8OHhiWCTw4v8POJovCoh4T7I9U11yVsPjMWWnnMmp9ZowCxyad1Pathle/9HjaDp+fdQKjO9fQydE6RHTZg==",
+          "dev": true,
+          "requires": {
+            "source-map": "~0.6.0"
+          }
+        },
+        "commander": {
+          "version": "8.3.0",
+          "resolved": "https://registry.npmjs.org/commander/-/commander-8.3.0.tgz",
+          "integrity": "sha512-OkTL9umf+He2DZkUq8f8J9of7yL6RJKI24dVITBmNfZBmri9zYZQrKkuXiKhyfPSu8tUhnVBB1iKXevvnlR4Ww==",
+          "dev": true
+        },
+        "terser": {
+          "version": "5.15.1",
+          "resolved": "https://registry.npmjs.org/terser/-/terser-5.15.1.tgz",
+          "integrity": "sha512-K1faMUvpm/FBxjBXud0LWVAGxmvoPbZbfTCYbSgaaYQaIXI3/TdI7a7ZGA73Zrou6Q8Zmz3oeUTsp/dj+ag2Xw==",
+          "dev": true,
+          "requires": {
+            "@jridgewell/source-map": "^0.3.2",
+            "acorn": "^8.5.0",
+            "commander": "^2.20.0",
+            "source-map-support": "~0.5.20"
+          },
+          "dependencies": {
+            "commander": {
+              "version": "2.20.3",
+              "resolved": "https://registry.npmjs.org/commander/-/commander-2.20.3.tgz",
+              "integrity": "sha512-GpVkmM8vF2vQUkj2LvZmD35JxeJOLCwJ9cUkugyk2nuhbv3+mJvpLYYt+0+USMxE+oj+ey/lJEnhZw75x/OMcQ==",
+              "dev": true
+            }
+          }
+        }
+      }
+    },
    "html-tags": {
      "version": "3.2.0",
      "resolved": "https://registry.npmmirror.com/html-tags/-/html-tags-3.2.0.tgz",
      "integrity": "sha512-vy7ClnArOZwCnqZgvv+ddgHgJiAFXe3Ge9ML5/mBctVJoUoYPCdxVucOywjDARn6CVoh3dRSFdPHy2sX80L0Wg==",
      "dev": true
    },
+    "html-webpack-plugin": {
+      "version": "5.5.0",
+      "resolved": "https://registry.npmjs.org/html-webpack-plugin/-/html-webpack-plugin-5.5.0.tgz",
+      "integrity": "sha512-sy88PC2cRTVxvETRgUHFrL4No3UxvcH8G1NepGhqaTT+GXN2kTamqasot0inS5hXeg1cMbFDt27zzo9p35lZVw==",
+      "dev": true,
+      "requires": {
+        "@types/html-minifier-terser": "^6.0.0",
+        "html-minifier-terser": "^6.0.2",
+        "lodash": "^4.17.21",
+        "pretty-error": "^4.0.0",
+        "tapable": "^2.0.0"
+      },
+      "dependencies": {
+        "pretty-error": {
+          "version": "4.0.0",
+          "resolved": "https://registry.npmjs.org/pretty-error/-/pretty-error-4.0.0.tgz",
+          "integrity": "sha512-AoJ5YMAcXKYxKhuJGdcvse+Voc6v1RgnsR3nWcYU7q4t6z0Q6T86sv5Zq8VIRbOWWFpvdGE83LtdSMNd+6Y0xw==",
+          "dev": true,
+          "requires": {
+            "lodash": "^4.17.20",
+            "renderkid": "^3.0.0"
+          }
+        },
+        "renderkid": {
+          "version": "3.0.0",
+          "resolved": "https://registry.npmjs.org/renderkid/-/renderkid-3.0.0.tgz",
+          "integrity": "sha512-q/7VIQA8lmM1hF+jn+sFSPWGlMkSAeNYcPLmDQx2zzuiDfaLrOmumR8iaUKlenFgh0XRPIUeSPlH3A+AW3Z5pg==",
+          "dev": true,
+          "requires": {
+            "css-select": "^4.1.3",
+            "dom-converter": "^0.2.0",
+            "htmlparser2": "^6.1.0",
+            "lodash": "^4.17.21",
+            "strip-ansi": "^6.0.1"
+          }
+        },
+        "tapable": {
+          "version": "2.2.1",
+          "resolved": "https://registry.npmjs.org/tapable/-/tapable-2.2.1.tgz",
+          "integrity": "sha512-GNzQvQTOIP6RyTfE2Qxb8ZVlNmw0n88vp1szwWRimP02mnTsx3Wtn5qRdqY9w2XduFNUgvOwhNnQsjwCp+kqaQ==",
+          "dev": true
+        }
+      }
+    },
    "htmlparser2": {
      "version": "6.1.0",
      "resolved": "https://registry.npmjs.org/htmlparser2/-/htmlparser2-6.1.0.tgz",
@@ -7484,6 +7635,15 @@
      "integrity": "sha512-G6A/nJLRgWOuuwdNuA6koovfEV1YpqqAG4pRUlFaz3jj2QNZ8M4vBqnVA+HBTmU/AMNUtlOsMmSpF6NyOjztbA==",
      "dev": true
    },
+    "lower-case": {
+      "version": "2.0.2",
+      "resolved": "https://registry.npmjs.org/lower-case/-/lower-case-2.0.2.tgz",
+      "integrity": "sha512-7fm3l3NAF9WfN6W3JOmf5drwpVqX78JtoGJ3A6W0a6ZnldM41w2fV5D490psKFTpMds8TJse/eHLFFsNHHjHgg==",
+      "dev": true,
+      "requires": {
+        "tslib": "^2.0.3"
+      }
+    },
    "lru-cache": {
      "version": "5.1.1",
      "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-5.1.1.tgz",
@@ -7936,6 +8096,16 @@
      "integrity": "sha512-1nh45deeb5olNY7eX82BkPO7SSxR5SSYJiPTrTdFUVYwAl8CKMA5N9PjTYkHiRjisVcxcQ1HXdLhx2qxxJzLNQ==",
      "dev": true
    },
+    "no-case": {
+      "version": "3.0.4",
+      "resolved": "https://registry.npmjs.org/no-case/-/no-case-3.0.4.tgz",
+      "integrity": "sha512-fgAN3jGAh+RoxUGZHTSOLJIqUc2wmoBwGR4tbpNAKmmovFoWq0OdRkb0VkldReO2a2iBT/OEulG9XSUc10r3zg==",
+      "dev": true,
+      "requires": {
+        "lower-case": "^2.0.2",
+        "tslib": "^2.0.3"
+      }
+    },
    "node-forge": {
      "version": "0.10.0",
      "resolved": "https://registry.npmjs.org/node-forge/-/node-forge-0.10.0.tgz",
@@ -8445,6 +8615,16 @@
        "readable-stream": "^2.1.5"
      }
    },
+    "param-case": {
+      "version": "3.0.4",
+      "resolved": "https://registry.npmjs.org/param-case/-/param-case-3.0.4.tgz",
+      "integrity": "sha512-RXlj7zCYokReqWpOPH9oYivUzLYZ5vAPIfEmCTNViosC78F8F0H9y7T7gG2M39ymgutxF5gcFEsyZQSph9Bp3A==",
+      "dev": true,
+      "requires": {
+        "dot-case": "^3.0.4",
+        "tslib": "^2.0.3"
+      }
+    },
    "parchment": {
      "version": "1.1.4",
      "resolved": "https://registry.npmjs.org/parchment/-/parchment-1.1.4.tgz",
@@ -8525,6 +8705,16 @@
      "integrity": "sha512-CiyeOxFT/JZyN5m0z9PfXw4SCBJ6Sygz1Dpl0wqjlhDEGGBP1GnsUVEL0p63hoG1fcj3fHynXi9NYO4nWOL+qQ==",
      "dev": true
    },
+    "pascal-case": {
+      "version": "3.1.2",
+      "resolved": "https://registry.npmjs.org/pascal-case/-/pascal-case-3.1.2.tgz",
+      "integrity": "sha512-uWlGT3YSnK9x3BQJaOdcZwrnV6hPpd8jFH1/ucpiLRPh/2zCVJKS19E4GvYHvaCcACn3foXZ0cLB9Wrx1KGe5g==",
+      "dev": true,
+      "requires": {
+        "no-case": "^3.0.4",
+        "tslib": "^2.0.3"
+      }
+    },
    "pascalcase": {
      "version": "0.1.1",
      "resolved": "https://registry.npmjs.org/pascalcase/-/pascalcase-0.1.1.tgz",
--- a/package.json
+++ b/package.json
@@ -56,6 +56,7 @@
    "babel-eslint": "^10.1.0",
    "eslint": "^6.7.2",
    "eslint-plugin-vue": "^6.2.2",
+    "html-webpack-plugin": "^5.5.0",
    "less": "^4.1.1",
    "less-loader": "^6.2.0",
    "sass": "^1.32.13",
--- a/src/views/portal/course/Index.vue
+++ b/src/views/portal/course/Index.vue
@@ -155,8 +155,7 @@
                      <div class="list-active">
                         <div class="list-content">
                           <div class="list-img">
-                            <!-- <course-image :course="item"></course-image> -->
-                           <img style="width:96px;height:52px" :src="fileBaseUrl + item.images" alt=""/>
+                           <course-image :course="item" width="108px" height="60px"></course-image>
                            <span v-if="item.type < 21" class="course-type">录播</span>
                            <span v-if="item.type==30" class="course-type">线下课</span>
                            <span v-if="item.type==40" class="course-type">学习项目</span>
@@ -203,8 +202,7 @@
                        <div class="list-active">
                         <div class="list-content">
                           <div class="list-img">
-                            <!-- <course-image :course="item"></course-image> -->
-                           <img style="width:96px;height:52px" :src="fileBaseUrl + item.images" alt=""/>
+                           <course-image :course="item" width="108px" height="60px"></course-image>
                            <span v-if="item.type < 21" class="course-type">录播</span>
                            <span v-if="item.type==30" class="course-type">线下课</span>
                            <span v-if="item.type==40" class="course-type">学习项目</span>
@@ -250,8 +248,8 @@
                        <div class="list-active">
                         <div class="list-content">
                           <div class="list-img">
-                            <!-- <course-image :course="item"></course-image> -->
-                           <img style="width:96px;height:52px" :src="fileBaseUrl + item.images" alt=""/>
+                            <course-image :course="item" width="108px" height="60px"></course-image>
+                           <!-- <img style="width:96px;height:52px" :src="fileBaseUrl + item.images" alt=""/> -->
                            <span v-if="item.type < 21" class="course-type">录播</span>
                            <span v-if="item.type==30" class="course-type">线下课</span>
                            <span v-if="item.type==40" class="course-type">学习项目</span>
@@ -790,6 +788,7 @@ export default {
        if (res.status == 200) {
          res.result.forEach(item=>{
            if(item.publishTime != '') {
+              item.coverImg=item.images;
             let time = item.publishTime.split('-');
             item.publishTime = `${time[0]}年${time[1]}月${time[2]}日`
            }
@@ -803,6 +802,7 @@ export default {
        if (res.status == 200) {
          res.result.forEach(item=>{
            if(item.publishTime != '') {
+              item.coverImg=item.images;
             let time = item.publishTime.split('-');
             item.publishTime = `${time[0]}年${time[1]}月${time[2]}日`
            }
@@ -816,6 +816,7 @@ export default {
        if (res.status == 200) {
          res.result.forEach(item=>{
            if(item.publishTime != '') {
+              item.coverImg=item.images;
             let time = item.publishTime.split('-');
             item.publishTime = `${time[0]}年${time[1]}月${time[2]}日`
            }
--- a/src/views/study/coursenew.vue
+++ b/src/views/study/coursenew.vue
@@ -951,7 +951,7 @@
              });
            }
            this.courseInfo = rs.result.course;
-            this.teachers = rs.result.teachers;
+            
            if (rs.result.teachers && rs.result.teachers.length > 0) {
              let userIds = [];
              let ctoUsers = [];
@@ -973,6 +973,7 @@
              });
              this.toUsers = ctoUsers;
              this.loadAuthorInfo(rs.result.teachers, userIds);
+              this.teachers = rs.result.teachers;
            }
            this.contentList = rs.result.contents;
            //处理内容的名称