Merge branch 'master' of http://git.dayaedu.com/lex/dy-admin-live

package-lock.json

@@ -1244,66 +1244,6 @@
         "@jridgewell/sourcemap-codec": "^1.4.10"
       }
     },
-    "@mapbox/node-pre-gyp": {
-      "version": "1.0.8",
-      "resolved": "https://registry.npmjs.org/@mapbox/node-pre-gyp/-/node-pre-gyp-1.0.8.tgz",
-      "integrity": "sha512-CMGKi28CF+qlbXh26hDe6NxCd7amqeAzEqnS6IHeO6LoaKyM/n+Xw3HT1COdq8cuioOdlKdqn/hCmqPUOMOywg==",
-      "requires": {
-        "detect-libc": "^1.0.3",
-        "https-proxy-agent": "^5.0.0",
-        "make-dir": "^3.1.0",
-        "node-fetch": "^2.6.5",
-        "nopt": "^5.0.0",
-        "npmlog": "^5.0.1",
-        "rimraf": "^3.0.2",
-        "semver": "^7.3.5",
-        "tar": "^6.1.11"
-      },
-      "dependencies": {
-        "make-dir": {
-          "version": "3.1.0",
-          "resolved": "https://registry.npmjs.org/make-dir/-/make-dir-3.1.0.tgz",
-          "integrity": "sha512-g3FeP20LNwhALb/6Cz6Dd4F2ngze0jz7tbzrD2wAV+o9FeNHe4rL+yK2md0J/fiSf1sa1ADhXqi5+oVwOM/eGw==",
-          "requires": {
-            "semver": "^6.0.0"
-          },
-          "dependencies": {
-            "semver": {
-              "version": "6.3.0",
-              "resolved": "https://registry.npmjs.org/semver/-/semver-6.3.0.tgz",
-              "integrity": "sha512-b39TBaTSfV6yBrapU89p5fKekE2m/NwnDocOVruQFS1/veMgdzuPcnOM34M6CwxW8jH/lxEa5rBoDeUwu5HHTw=="
-            }
-          }
-        },
-        "node-fetch": {
-          "version": "2.6.7",
-          "resolved": "https://registry.npmjs.org/node-fetch/-/node-fetch-2.6.7.tgz",
-          "integrity": "sha512-ZjMPFEfVx5j+y2yF35Kzx5sF7kDzxuDj6ziH4FFbOp87zKDZNx8yExJIb05OGF4Nlt9IHFIMBkRl41VdvcNdbQ==",
-          "requires": {
-            "whatwg-url": "^5.0.0"
-          }
-        },
-        "tr46": {
-          "version": "0.0.3",
-          "resolved": "https://registry.npmjs.org/tr46/-/tr46-0.0.3.tgz",
-          "integrity": "sha1-gYT9NH2snNwYWZLzpmIuFLnZq2o="
-        },
-        "webidl-conversions": {
-          "version": "3.0.1",
-          "resolved": "https://registry.npmjs.org/webidl-conversions/-/webidl-conversions-3.0.1.tgz",
-          "integrity": "sha1-JFNCdeKnvGvnvIZhHMFq4KVlSHE="
-        },
-        "whatwg-url": {
-          "version": "5.0.0",
-          "resolved": "https://registry.npmjs.org/whatwg-url/-/whatwg-url-5.0.0.tgz",
-          "integrity": "sha1-lmRU6HZUYuN2RNNib2dCzotwll0=",
-          "requires": {
-            "tr46": "~0.0.3",
-            "webidl-conversions": "^3.0.0"
-          }
-        }
-      }
-    },
     "@nodelib/fs.scandir": {
       "version": "2.1.5",
       "resolved": "https://registry.npmjs.org/@nodelib/fs.scandir/-/fs.scandir-2.1.5.tgz",
@@ -1792,25 +1732,12 @@
         "vue-demi": "*"
       }
     },
-    "abbrev": {
-      "version": "1.1.1",
-      "resolved": "https://registry.npmjs.org/abbrev/-/abbrev-1.1.1.tgz",
-      "integrity": "sha512-nne9/IiQ/hzIhY6pdDnbBtz7DjPTKrY00P/zvPSm5pOFkl6xuGrGnXn/VtTNNfNtAfZ9/1RtehkszU9qcTii0Q=="
-    },
     "acorn": {
       "version": "7.4.1",
       "resolved": "https://registry.npmmirror.com/acorn/-/acorn-7.4.1.tgz",
       "integrity": "sha512-nQyp0o1/mNdbTO1PO6kHkwSrmgZ0MT/jCCpNiwbUjGoRN4dlBhqJtoQuCnEOKzgTVwg0ZWiCoQy6SxMebQVh8A==",
       "dev": true
     },
-    "agent-base": {
-      "version": "6.0.2",
-      "resolved": "https://registry.npmjs.org/agent-base/-/agent-base-6.0.2.tgz",
-      "integrity": "sha512-RZNwNclF7+MS/8bDg70amg32dyeZGZxiDuQmZxKLAlQjr3jGyLx+4Kkk58UO7D2QdgFIQCovuSuZESne6RG6XQ==",
-      "requires": {
-        "debug": "4"
-      }
-    },
     "ajv": {
       "version": "8.10.0",
       "resolved": "https://registry.npmjs.org/ajv/-/ajv-8.10.0.tgz",
@@ -1838,20 +1765,6 @@
         "color-convert": "^1.9.0"
       }
     },
-    "aproba": {
-      "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/aproba/-/aproba-2.0.0.tgz",
-      "integrity": "sha512-lYe4Gx7QT+MKGbDsA+Z+he/Wtef0BiwDOlK/XkBrdfsh9J/jPPXbX0tE9x9cl27Tmu5gg3QUbUrQYa/y+KOHPQ=="
-    },
-    "are-we-there-yet": {
-      "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/are-we-there-yet/-/are-we-there-yet-2.0.0.tgz",
-      "integrity": "sha512-Ci/qENmwHnsYo9xKIcUJN5LeDKdJ6R1Z1j9V/J5wyq8nh/mYPEpIKJbBZXtZjG04HiK7zV/p6Vs9952MrMeUIw==",
-      "requires": {
-        "delegates": "^1.0.0",
-        "readable-stream": "^3.6.0"
-      }
-    },
     "arr-diff": {
       "version": "4.0.0",
       "resolved": "https://registry.npmjs.org/arr-diff/-/arr-diff-4.0.0.tgz",
@@ -1976,7 +1889,8 @@
     "balanced-match": {
       "version": "1.0.2",
       "resolved": "https://registry.npmjs.org/balanced-match/-/balanced-match-1.0.2.tgz",
-      "integrity": "sha512-3oSeUO0TMV67hN1AmbXsK4yaqU7tjiHlbxRDZOpH0KW9+CeX4bRAaX0Anxt0tx2MrpRpWwQaPwIlISEJhYU5Pw=="
+      "integrity": "sha512-3oSeUO0TMV67hN1AmbXsK4yaqU7tjiHlbxRDZOpH0KW9+CeX4bRAaX0Anxt0tx2MrpRpWwQaPwIlISEJhYU5Pw==",
+      "dev": true
     },
     "base": {
       "version": "0.11.2",
@@ -2015,6 +1929,7 @@
       "version": "1.1.11",
       "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-1.1.11.tgz",
       "integrity": "sha512-iCuPHDFgrHX7H2vEI/5xpz07zSHB00TpugqhmYtVmMO6518mCuRMoOYFldEBl0g187ufozdaHgWKcYFb61qGiA==",
+      "dev": true,
       "requires": {
         "balanced-match": "^1.0.0",
         "concat-map": "0.0.1"
@@ -2092,16 +2007,6 @@
       "integrity": "sha512-Wiz1Psk2MEK0pX3rUzWaunLTZzqS2JYZFzNKqAiJGiuxIjRPLgV6+VDPOg6lQOUxmDwhTlh198JsTTi8Hzw6aQ==",
       "dev": true
     },
-    "canvas": {
-      "version": "2.9.0",
-      "resolved": "https://registry.npmjs.org/canvas/-/canvas-2.9.0.tgz",
-      "integrity": "sha512-0l93g7uxp7rMyr7H+XRQ28A3ud0dKIUTIEkUe1Dxh4rjUYN7B93+SjC3r1PDKA18xcQN87OFGgUnyw7LSgNLSQ==",
-      "requires": {
-        "@mapbox/node-pre-gyp": "^1.0.0",
-        "nan": "^2.15.0",
-        "simple-get": "^3.0.3"
-      }
-    },
     "chalk": {
       "version": "2.4.2",
       "resolved": "https://registry.npmjs.org/chalk/-/chalk-2.4.2.tgz",
@@ -2122,11 +2027,6 @@
         "is-regex": "^1.0.3"
       }
     },
-    "chownr": {
-      "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/chownr/-/chownr-2.0.0.tgz",
-      "integrity": "sha512-bIomtDF5KGpdogkLd9VspvFzk9KfpyyGlS8YFVZl7TGPBHL5snIOnxeshwVgPteQ9b4Eydl+pVbIyE1DcvCWgQ=="
-    },
     "class-utils": {
       "version": "0.3.6",
       "resolved": "https://registry.npmjs.org/class-utils/-/class-utils-0.3.6.tgz",
@@ -2191,11 +2091,6 @@
       "integrity": "sha512-72fSenhMw2HZMTVHeCA9KCmpEIbzWiQsjN+BHcBbS9vr1mtt+vJjPdksIBNUmKAW8TFUDPJK5SUU3QhE9NEXDw==",
       "dev": true
     },
-    "color-support": {
-      "version": "1.1.3",
-      "resolved": "https://registry.npmjs.org/color-support/-/color-support-1.1.3.tgz",
-      "integrity": "sha512-qiBjkpbMLO/HL68y+lh4q0/O1MZFj2RX6X/KmMa3+gJD3z+WwI1ZzDHysvqHGS3mP6mznPckpXmw1nI9cJjyRg=="
-    },
     "commander": {
       "version": "2.20.3",
       "resolved": "https://registry.npmjs.org/commander/-/commander-2.20.3.tgz",
@@ -2217,12 +2112,8 @@
     "concat-map": {
       "version": "0.0.1",
       "resolved": "https://registry.npmmirror.com/concat-map/-/concat-map-0.0.1.tgz",
-      "integrity": "sha512-/Srv4dswyQNBfohGpz9o6Yb3Gz3SrUDqBH5rTuhGR7ahtlbYKnVxw2bCFMRljaA7EXHaXZ8wsHdodFvbkhKmqg=="
-    },
-    "console-control-strings": {
-      "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/console-control-strings/-/console-control-strings-1.1.0.tgz",
-      "integrity": "sha1-PXz0Rk22RG6mRL9LOVB/mFEAjo4="
+      "integrity": "sha512-/Srv4dswyQNBfohGpz9o6Yb3Gz3SrUDqBH5rTuhGR7ahtlbYKnVxw2bCFMRljaA7EXHaXZ8wsHdodFvbkhKmqg==",
+      "dev": true
     },
     "constantinople": {
       "version": "4.0.1",
@@ -2258,6 +2149,14 @@
       "integrity": "sha1-Z29us8OZl8LuGsOpJP1hJHSPV40=",
       "dev": true
     },
+    "copy-to-clipboard": {
+      "version": "3.3.1",
+      "resolved": "https://registry.npmjs.org/copy-to-clipboard/-/copy-to-clipboard-3.3.1.tgz",
+      "integrity": "sha512-i13qo6kIHTTpCm8/Wup+0b1mVWETvu2kIMzKoK8FpkLkFxlt0znUAHcMzox+T8sPlqtZXq3CulEjQHsYiGFJUw==",
+      "requires": {
+        "toggle-selection": "^1.0.6"
+      }
+    },
     "core-js": {
       "version": "3.21.0",
       "resolved": "https://registry.npmjs.org/core-js/-/core-js-3.21.0.tgz",
@@ -2350,6 +2249,7 @@
       "version": "4.3.3",
       "resolved": "https://registry.npmjs.org/debug/-/debug-4.3.3.tgz",
       "integrity": "sha512-/zxw5+vh1Tfv+4Qn7a5nsbcJKPaSvCDhojn6FEl9vupwK2VCSDtEiEtqr8DFtzYFOdz63LBkxec7DYuc2jon6Q==",
+      "dev": true,
       "requires": {
         "ms": "2.1.2"
       }
@@ -2360,14 +2260,6 @@
       "integrity": "sha1-6zkTMzRYd1y4TNGh+uBiEGu4dUU=",
       "dev": true
     },
-    "decompress-response": {
-      "version": "4.2.1",
-      "resolved": "https://registry.npmjs.org/decompress-response/-/decompress-response-4.2.1.tgz",
-      "integrity": "sha512-jOSne2qbyE+/r8G1VU+G/82LBs2Fs4LAsTiLSHOCOMZQl2OKZ6i8i4IyHemTe+/yIXOtTcRQMzPcgyhoFlqPkw==",
-      "requires": {
-        "mimic-response": "^2.0.0"
-      }
-    },
     "deepmerge": {
       "version": "4.2.2",
       "resolved": "https://registry.npmjs.org/deepmerge/-/deepmerge-4.2.2.tgz",
@@ -2429,16 +2321,6 @@
         }
       }
     },
-    "delegates": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/delegates/-/delegates-1.0.0.tgz",
-      "integrity": "sha1-hMbhWbgZBP3KWaDvRM2HDTElD5o="
-    },
-    "detect-libc": {
-      "version": "1.0.3",
-      "resolved": "https://registry.npmjs.org/detect-libc/-/detect-libc-1.0.3.tgz",
-      "integrity": "sha1-+hN8S9aY7fVc1c0CrFWfkaTEups="
-    },
     "doctypes": {
       "version": "1.1.0",
       "resolved": "https://registry.npmmirror.com/doctypes/-/doctypes-1.1.0.tgz",
@@ -2540,11 +2422,6 @@
         "@emmetio/css-abbreviation": "^2.1.4"
       }
     },
-    "emoji-regex": {
-      "version": "8.0.0",
-      "resolved": "https://registry.npmjs.org/emoji-regex/-/emoji-regex-8.0.0.tgz",
-      "integrity": "sha512-MSjYzcWNOA0ewAHpz0MxpYFvwg6yjy1NG3xteoqz644VCo/RPgnr1/GGt+ic3iJTzQ8Eu3TdM14SawnVUmGE6A=="
-    },
     "emojis-list": {
       "version": "3.0.0",
       "resolved": "https://registry.npmjs.org/emojis-list/-/emojis-list-3.0.0.tgz",
@@ -2948,18 +2825,11 @@
         "universalify": "^2.0.0"
       }
     },
-    "fs-minipass": {
-      "version": "2.1.0",
-      "resolved": "https://registry.npmjs.org/fs-minipass/-/fs-minipass-2.1.0.tgz",
-      "integrity": "sha512-V/JgOLFCS+R6Vcq0slCuaeWEdNC3ouDlJMNIsacH2VtALiu9mV4LPrHc5cDl8k5aw6J8jwgWWpiTo5RYhmIzvg==",
-      "requires": {
-        "minipass": "^3.0.0"
-      }
-    },
     "fs.realpath": {
       "version": "1.0.0",
       "resolved": "https://registry.npmmirror.com/fs.realpath/-/fs.realpath-1.0.0.tgz",
-      "integrity": "sha512-OO0pH2lK6a0hZnAdau5ItzHPI6pUlvI7jMVnxUQRtw4owF2wk8lOSabtGDCTP4Ggrg2MbGnWO9X8K1t4+fGMDw=="
+      "integrity": "sha512-OO0pH2lK6a0hZnAdau5ItzHPI6pUlvI7jMVnxUQRtw4owF2wk8lOSabtGDCTP4Ggrg2MbGnWO9X8K1t4+fGMDw==",
+      "dev": true
     },
     "fsevents": {
       "version": "2.3.2",
@@ -2973,37 +2843,6 @@
       "resolved": "https://registry.npmmirror.com/function-bind/-/function-bind-1.1.1.tgz",
       "integrity": "sha512-yIovAzMX49sF8Yl58fSCWJ5svSLuaibPxXQJFLmBObTuCr0Mf1KiPopGM9NiFjiYBCbfaa2Fh6breQ6ANVTI0A=="
     },
-    "gauge": {
-      "version": "3.0.2",
-      "resolved": "https://registry.npmjs.org/gauge/-/gauge-3.0.2.tgz",
-      "integrity": "sha512-+5J6MS/5XksCuXq++uFRsnUd7Ovu1XenbeuIuNRJxYWjgQbPuFhT14lAvsWfqfAmnwluf1OwMjz39HjfLPci0Q==",
-      "requires": {
-        "aproba": "^1.0.3 || ^2.0.0",
-        "color-support": "^1.1.2",
-        "console-control-strings": "^1.0.0",
-        "has-unicode": "^2.0.1",
-        "object-assign": "^4.1.1",
-        "signal-exit": "^3.0.0",
-        "string-width": "^4.2.3",
-        "strip-ansi": "^6.0.1",
-        "wide-align": "^1.1.2"
-      },
-      "dependencies": {
-        "ansi-regex": {
-          "version": "5.0.1",
-          "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-5.0.1.tgz",
-          "integrity": "sha512-quJQXlTSUGL2LH9SUXo8VwsY4soanhgo6LNSm84E1LBcE8s3O0wpdiRzyR9z/ZZJMlMWv37qOOb9pdJlMUEKFQ=="
-        },
-        "strip-ansi": {
-          "version": "6.0.1",
-          "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-6.0.1.tgz",
-          "integrity": "sha512-Y38VPSHcqkFrCpFnQ9vuSXmquuv5oXOKpGeT6aGrr3o3Gc9AlVa6JBfUSOCnbxGGZF+/0ooI7KrPuUSztUdU5A==",
-          "requires": {
-            "ansi-regex": "^5.0.1"
-          }
-        }
-      }
-    },
     "gensync": {
       "version": "1.0.0-beta.2",
       "resolved": "https://registry.npmjs.org/gensync/-/gensync-1.0.0-beta.2.tgz",
@@ -3046,6 +2885,7 @@
       "version": "7.2.0",
       "resolved": "https://registry.npmjs.org/glob/-/glob-7.2.0.tgz",
       "integrity": "sha512-lmLf6gtyrPq8tTjSmrO94wBeQbFR3HbLHbuyD69wuyQkImp2hWqMGB47OX65FBkPffO641IP9jWa1z4ivqG26Q==",
+      "dev": true,
       "requires": {
         "fs.realpath": "^1.0.0",
         "inflight": "^1.0.4",
@@ -3119,11 +2959,6 @@
         "has-symbols": "^1.0.2"
       }
     },
-    "has-unicode": {
-      "version": "2.0.1",
-      "resolved": "https://registry.npmjs.org/has-unicode/-/has-unicode-2.0.1.tgz",
-      "integrity": "sha1-4Ob+aijPUROIVeCG0Wkedx3iqLk="
-    },
     "has-value": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/has-value/-/has-value-1.0.0.tgz",
@@ -3194,6 +3029,11 @@
       "integrity": "sha512-1qYz89hW3lFDEazhjW0yVAV87lw8lVkrJocr72XmBkMKsoSVJCQx3W8BXsC7hO2qAt8BoVjYjtAcZ9perqGnNg==",
       "dev": true
     },
+    "html-to-image": {
+      "version": "1.9.0",
+      "resolved": "https://registry.npmjs.org/html-to-image/-/html-to-image-1.9.0.tgz",
+      "integrity": "sha512-9gaDCIYg62Ek07F2pBk76AHgYZ2gxq2YALU7rK3gNCqXuhu6cWzsOQqM7qGbjZiOzxGzrU1deDqZpAod2NEwbA=="
+    },
     "htmlparser2": {
       "version": "7.2.0",
       "resolved": "https://registry.npmmirror.com/htmlparser2/-/htmlparser2-7.2.0.tgz",
@@ -3206,15 +3046,6 @@
         "entities": "^3.0.1"
       }
     },
-    "https-proxy-agent": {
-      "version": "5.0.0",
-      "resolved": "https://registry.npmjs.org/https-proxy-agent/-/https-proxy-agent-5.0.0.tgz",
-      "integrity": "sha512-EkYm5BcKUGiduxzSt3Eppko+PiNWNEpa4ySk9vTC6wDsQJW9rHSa+UhGNJoRYp7bz6Ht1eaRIa6QaJqO5rCFbA==",
-      "requires": {
-        "agent-base": "6",
-        "debug": "4"
-      }
-    },
     "iconv-lite": {
       "version": "0.6.3",
       "resolved": "https://registry.npmmirror.com/iconv-lite/-/iconv-lite-0.6.3.tgz",
@@ -3239,6 +3070,7 @@
       "version": "1.0.6",
       "resolved": "https://registry.npmmirror.com/inflight/-/inflight-1.0.6.tgz",
       "integrity": "sha512-k92I/b08q4wvFscXCLvqfsHCrjrF7yiXsQuIVvVE7N82W3+aqpzuUdBbfhWcy/FZR3/4IgflMgKLOsvPDrGCJA==",
+      "dev": true,
       "requires": {
         "once": "^1.3.0",
         "wrappy": "1"
@@ -3247,7 +3079,8 @@
     "inherits": {
       "version": "2.0.4",
       "resolved": "https://registry.npmjs.org/inherits/-/inherits-2.0.4.tgz",
-      "integrity": "sha512-k/vGaX4/Yla3WzyMCvTQOXYeIHvqOKtnqBduzTHpzpQZzAskKMhZ2K+EnBiSM9zGSoIFeMpXKxa4dYeZIQqewQ=="
+      "integrity": "sha512-k/vGaX4/Yla3WzyMCvTQOXYeIHvqOKtnqBduzTHpzpQZzAskKMhZ2K+EnBiSM9zGSoIFeMpXKxa4dYeZIQqewQ==",
+      "dev": true
     },
     "internal-slot": {
       "version": "1.0.3",
@@ -3382,11 +3215,6 @@
       "integrity": "sha512-SbKbANkN603Vi4jEZv49LeVJMn4yGwsbzZworEoyEiutsN3nJYdbO36zfhGJ6QEDpOZIFkDtnq5JRxmvl3jsoQ==",
       "dev": true
     },
-    "is-fullwidth-code-point": {
-      "version": "3.0.0",
-      "resolved": "https://registry.npmjs.org/is-fullwidth-code-point/-/is-fullwidth-code-point-3.0.0.tgz",
-      "integrity": "sha512-zymm5+u+sCsSWyD9qNaejV3DFvhCKclKdizYaJUuHA83RLjb7nSuGnddCHGv0hk+KY7BMAlsWeK4Ueg6EV6XQg=="
-    },
     "is-glob": {
       "version": "4.0.3",
       "resolved": "https://registry.npmjs.org/is-glob/-/is-glob-4.0.3.tgz",
@@ -3583,11 +3411,6 @@
       "integrity": "sha512-pZe//GGmwJndub7ZghVHz7vjb2LgC1m8B07Au3eYqeqv9emhESByMXxaEgkUkEqJe87oBbSniGYoQNIBklc7IQ==",
       "dev": true
     },
-    "js-binary-schema-parser": {
-      "version": "2.0.3",
-      "resolved": "https://registry.npmjs.org/js-binary-schema-parser/-/js-binary-schema-parser-2.0.3.tgz",
-      "integrity": "sha512-xezGJmOb4lk/M1ZZLTR/jaBHQ4gG/lqQnJqdIv4721DMggsa1bDVlHXNeHYogaIEHD9vCRv0fcL4hMA+Coarkg=="
-    },
     "js-cookie": {
       "version": "3.0.1",
       "resolved": "https://registry.npmjs.org/js-cookie/-/js-cookie-3.0.1.tgz",
@@ -3762,6 +3585,7 @@
       "version": "6.0.0",
       "resolved": "https://registry.npmmirror.com/lru-cache/-/lru-cache-6.0.0.tgz",
       "integrity": "sha512-Jo6dJ04CmSjuznwJSS3pUeWmd/H0ffTlkXXgwZi+eq1UCmqQwCh+eLsYOYCwY991i2Fah4h1BEMCx4qThGbsiA==",
+      "dev": true,
       "requires": {
         "yallist": "^4.0.0"
       }
@@ -3858,15 +3682,11 @@
       "dev": true,
       "optional": true
     },
-    "mimic-response": {
-      "version": "2.1.0",
-      "resolved": "https://registry.npmjs.org/mimic-response/-/mimic-response-2.1.0.tgz",
-      "integrity": "sha512-wXqjST+SLt7R009ySCglWBCFpjUygmCIfD790/kVbiGmUgfYGuB14PiTd5DwVxSV4NcYHjzMkoj5LjQZwTQLEA=="
-    },
     "minimatch": {
       "version": "3.1.1",
       "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-3.1.1.tgz",
       "integrity": "sha512-reLxBcKUPNBnc/sVtAbxgRVFSegoGeLaSjmphNhcwcolhYLRgtJscn5mRl6YRZNQv40Y7P6JM2YhSIsbL9OB5A==",
+      "dev": true,
       "requires": {
         "brace-expansion": "^1.1.7"
       }
@@ -3877,23 +3697,6 @@
       "integrity": "sha512-FM9nNUYrRBAELZQT3xeZQ7fmMOBg6nWNmJKTcgsJeaLstP/UODVpGsr5OhXhhXg6f+qtJ8uiZ+PUxkDWcgIXLw==",
       "dev": true
     },
-    "minipass": {
-      "version": "3.1.6",
-      "resolved": "https://registry.npmjs.org/minipass/-/minipass-3.1.6.tgz",
-      "integrity": "sha512-rty5kpw9/z8SX9dmxblFA6edItUmwJgMeYDZRrwlIVN27i8gysGbznJwUggw2V/FVqFSDdWy040ZPS811DYAqQ==",
-      "requires": {
-        "yallist": "^4.0.0"
-      }
-    },
-    "minizlib": {
-      "version": "2.1.2",
-      "resolved": "https://registry.npmjs.org/minizlib/-/minizlib-2.1.2.tgz",
-      "integrity": "sha512-bAxsR8BVfj60DWXHE3u30oHzfl4G7khkSuPW+qvpd7jFRHm7dLxOjUk1EHACJ/hxLY8phGJ0YhYHZo7jil7Qdg==",
-      "requires": {
-        "minipass": "^3.0.0",
-        "yallist": "^4.0.0"
-      }
-    },
     "mitt": {
       "version": "3.0.0",
       "resolved": "https://registry.npmjs.org/mitt/-/mitt-3.0.0.tgz",
@@ -3920,20 +3723,11 @@
         }
       }
     },
-    "mkdirp": {
-      "version": "1.0.4",
-      "resolved": "https://registry.npmjs.org/mkdirp/-/mkdirp-1.0.4.tgz",
-      "integrity": "sha512-vVqVZQyf3WLx2Shd0qJ9xuvqgAyKPLAiqITEtqW0oIUjzo3PePDd6fW9iFz30ef7Ysp/oiWqbhszeGWW2T6Gzw=="
-    },
     "ms": {
       "version": "2.1.2",
       "resolved": "https://registry.npmjs.org/ms/-/ms-2.1.2.tgz",
-      "integrity": "sha512-sGkPx+VjMtmA6MX27oA4FBFELFCZZ4S4XqeGOXCv68tT+jb3vk/RyaKWP0PTKyWtmLSM0b+adUTEvbs1PEaH2w=="
-    },
-    "nan": {
-      "version": "2.15.0",
-      "resolved": "https://registry.npmjs.org/nan/-/nan-2.15.0.tgz",
-      "integrity": "sha512-8ZtvEnA2c5aYCZYd1cvgdnU6cqwixRoYg70xPLWUws5ORTa/lnw+u4amixRS/Ac5U5mQVgp9pnlSUnbNWFaWZQ=="
+      "integrity": "sha512-sGkPx+VjMtmA6MX27oA4FBFELFCZZ4S4XqeGOXCv68tT+jb3vk/RyaKWP0PTKyWtmLSM0b+adUTEvbs1PEaH2w==",
+      "dev": true
     },
     "nanoid": {
       "version": "3.2.0",
@@ -4074,30 +3868,11 @@
       "integrity": "sha512-XxYDdcQ6eKqp/YjI+tb2C5WM2LgjnZrfYg4vgQt49EK268b6gYCHsBLrK2qvJo4FmCtqmKezb0WZFK4fkrZNsg==",
       "dev": true
     },
-    "nopt": {
-      "version": "5.0.0",
-      "resolved": "https://registry.npmjs.org/nopt/-/nopt-5.0.0.tgz",
-      "integrity": "sha512-Tbj67rffqceeLpcRXrT7vKAN8CwfPeIBgM7E6iBkmKLV7bEMwpGgYLGv0jACUsECaa/vuxP0IjEont6umdMgtQ==",
-      "requires": {
-        "abbrev": "1"
-      }
-    },
     "normalize-wheel-es": {
       "version": "1.1.1",
       "resolved": "https://registry.npmmirror.com/normalize-wheel-es/-/normalize-wheel-es-1.1.1.tgz",
       "integrity": "sha512-157VNH4CngrcsvF8xOVOe22cwniIR3nxSltdctvQeHZj8JttEeOXffK28jucWfWBXs0QNetAumjc1GiInnwX4w=="
     },
-    "npmlog": {
-      "version": "5.0.1",
-      "resolved": "https://registry.npmjs.org/npmlog/-/npmlog-5.0.1.tgz",
-      "integrity": "sha512-AqZtDUWOMKs1G/8lwylVjrdYgqA4d9nu8hc+0gzRxlDb1I10+FHBGMXs6aiQHFdCUUlqH99MUMuLfzWDNDtfxw==",
-      "requires": {
-        "are-we-there-yet": "^2.0.0",
-        "console-control-strings": "^1.1.0",
-        "gauge": "^3.0.0",
-        "set-blocking": "^2.0.0"
-      }
-    },
     "nprogress": {
       "version": "0.2.0",
       "resolved": "https://registry.npmjs.org/nprogress/-/nprogress-0.2.0.tgz",
@@ -4115,7 +3890,8 @@
     "object-assign": {
       "version": "4.1.1",
       "resolved": "https://registry.npmmirror.com/object-assign/-/object-assign-4.1.1.tgz",
-      "integrity": "sha512-rJgTQnkUnH1sFw8yT6VSU3zD3sWmu6sZhIseY8VX+GRu3P6F7Fu+JNDoXfklElbLJSnc3FUQHVe4cU5hj+BcUg=="
+      "integrity": "sha512-rJgTQnkUnH1sFw8yT6VSU3zD3sWmu6sZhIseY8VX+GRu3P6F7Fu+JNDoXfklElbLJSnc3FUQHVe4cU5hj+BcUg==",
+      "dev": true
     },
     "object-copy": {
       "version": "0.1.0",
@@ -4193,6 +3969,7 @@
       "version": "1.4.0",
       "resolved": "https://registry.npmmirror.com/once/-/once-1.4.0.tgz",
       "integrity": "sha512-lNaJgI+2Q5URQBkccEKHTQOPaXdUxnZZElQTZY0MFUAuaEqe1E+Nyvgdz/aIyNi6Z9MzO5dv1H8n58/GELp3+w==",
+      "dev": true,
       "requires": {
         "wrappy": "1"
       }
@@ -4212,7 +3989,8 @@
     "path-is-absolute": {
       "version": "1.0.1",
       "resolved": "https://registry.npmmirror.com/path-is-absolute/-/path-is-absolute-1.0.1.tgz",
-      "integrity": "sha512-AVbw3UJ2e9bq64vSaS9Am0fje1Pa8pbGqTTsmXfaIiMpnr5DlDhfJOuLj9Sf95ZPVDAUerDfEk88MPmPe7UCQg=="
+      "integrity": "sha512-AVbw3UJ2e9bq64vSaS9Am0fje1Pa8pbGqTTsmXfaIiMpnr5DlDhfJOuLj9Sf95ZPVDAUerDfEk88MPmPe7UCQg==",
+      "dev": true
     },
     "path-parse": {
       "version": "1.0.7",
@@ -4545,6 +4323,11 @@
       "integrity": "sha512-XRsRjdf+j5ml+y/6GKHPZbrF/8p2Yga0JPtdqTIY2Xe5ohJPD9saDJJLPvp9+NSBprVvevdXZybnj2cv8OEd0A==",
       "dev": true
     },
+    "qrcodejs2": {
+      "version": "0.0.2",
+      "resolved": "https://registry.npmjs.org/qrcodejs2/-/qrcodejs2-0.0.2.tgz",
+      "integrity": "sha1-Rlr+Xjnxn6zsuTLBH3oYYQkUauE="
+    },
     "qs": {
       "version": "6.10.3",
       "resolved": "https://registry.npmmirror.com/qs/-/qs-6.10.3.tgz",
@@ -4582,6 +4365,7 @@
       "version": "3.6.0",
       "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-3.6.0.tgz",
       "integrity": "sha512-BViHy7LKeTz4oNnkcLJ+lVSL6vpiFeX6/d3oSH8zCW7UxP2onchk+vTGB143xuFjHS3deTgkKoXXymXqymiIdA==",
+      "dev": true,
       "requires": {
         "inherits": "^2.0.3",
         "string_decoder": "^1.1.1",
@@ -4749,14 +4533,6 @@
       "integrity": "sha512-U9nH88a3fc/ekCF1l0/UP1IosiuIjyTh7hBvXVMHYgVcfGvt897Xguj2UOLDeI5BG2m7/uwyaLVT6fbtCwTyzw==",
       "dev": true
     },
-    "rimraf": {
-      "version": "3.0.2",
-      "resolved": "https://registry.npmjs.org/rimraf/-/rimraf-3.0.2.tgz",
-      "integrity": "sha512-JZkJMZkAGFFPP2YqXZXPbMlMBgsxzE8ILs4lMIX/2o0L9UBw9O/Y3o6wFw/i9YLapcUJWwqbi3kdxIPdC62TIA==",
-      "requires": {
-        "glob": "^7.1.3"
-      }
-    },
     "rollup": {
       "version": "2.67.2",
       "resolved": "https://registry.npmmirror.com/rollup/-/rollup-2.67.2.tgz",
@@ -4818,6 +4594,7 @@
       "version": "7.3.5",
       "resolved": "https://registry.npmmirror.com/semver/-/semver-7.3.5.tgz",
       "integrity": "sha512-PoeGJYh8HK4BTO/a9Tf6ZG3veo/A7ZVsYrSA6J8ny9nb3B1VrpkuN+z9OE5wfE5p6H4LchYZsegiQgbJD94ZFQ==",
+      "dev": true,
       "requires": {
         "lru-cache": "^6.0.0"
       }
@@ -4831,11 +4608,6 @@
         "randombytes": "^2.1.0"
       }
     },
-    "set-blocking": {
-      "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/set-blocking/-/set-blocking-2.0.0.tgz",
-      "integrity": "sha1-BF+XgtARrppoA93TgrJDkrPYkPc="
-    },
     "set-value": {
       "version": "2.0.1",
       "resolved": "https://registry.npmjs.org/set-value/-/set-value-2.0.1.tgz",
@@ -4858,26 +4630,6 @@
         "object-inspect": "^1.9.0"
       }
     },
-    "signal-exit": {
-      "version": "3.0.7",
-      "resolved": "https://registry.npmjs.org/signal-exit/-/signal-exit-3.0.7.tgz",
-      "integrity": "sha512-wnD2ZE+l+SPC/uoS0vXeE9L1+0wuaMqKlfz9AMUo38JsyLSBWSFcHR1Rri62LZc12vLr1gb3jl7iwQhgwpAbGQ=="
-    },
-    "simple-concat": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/simple-concat/-/simple-concat-1.0.1.tgz",
-      "integrity": "sha512-cSFtAPtRhljv69IK0hTVZQ+OfE9nePi/rtJmw5UjHeVyVroEqJXP1sFztKUy1qU+xvz3u/sfYJLa947b7nAN2Q=="
-    },
-    "simple-get": {
-      "version": "3.1.1",
-      "resolved": "https://registry.npmjs.org/simple-get/-/simple-get-3.1.1.tgz",
-      "integrity": "sha512-CQ5LTKGfCpvE1K0n2us+kuMPbk/q0EKl82s4aheV9oXjFEz6W/Y7oQFVJuU6QG77hRT4Ghb5RURteF5vnWjupA==",
-      "requires": {
-        "decompress-response": "^4.2.0",
-        "once": "^1.3.1",
-        "simple-concat": "^1.0.0"
-      }
-    },
     "snapdragon": {
       "version": "0.8.2",
       "resolved": "https://registry.npmjs.org/snapdragon/-/snapdragon-0.8.2.tgz",
@@ -5064,31 +4816,6 @@
       "integrity": "sha1-J5siXfHVgrH1TmWt3UNS4Y+qBxM=",
       "dev": true
     },
-    "string-width": {
-      "version": "4.2.3",
-      "resolved": "https://registry.npmjs.org/string-width/-/string-width-4.2.3.tgz",
-      "integrity": "sha512-wKyQRQpjJ0sIp62ErSZdGsjMJWsap5oRNihHhu6G7JVO/9jIB6UyevL+tXuOqrng8j/cxKTWyWUwvSTriiZz/g==",
-      "requires": {
-        "emoji-regex": "^8.0.0",
-        "is-fullwidth-code-point": "^3.0.0",
-        "strip-ansi": "^6.0.1"
-      },
-      "dependencies": {
-        "ansi-regex": {
-          "version": "5.0.1",
-          "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-5.0.1.tgz",
-          "integrity": "sha512-quJQXlTSUGL2LH9SUXo8VwsY4soanhgo6LNSm84E1LBcE8s3O0wpdiRzyR9z/ZZJMlMWv37qOOb9pdJlMUEKFQ=="
-        },
-        "strip-ansi": {
-          "version": "6.0.1",
-          "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-6.0.1.tgz",
-          "integrity": "sha512-Y38VPSHcqkFrCpFnQ9vuSXmquuv5oXOKpGeT6aGrr3o3Gc9AlVa6JBfUSOCnbxGGZF+/0ooI7KrPuUSztUdU5A==",
-          "requires": {
-            "ansi-regex": "^5.0.1"
-          }
-        }
-      }
-    },
     "string.prototype.matchall": {
       "version": "4.0.6",
       "resolved": "https://registry.npmjs.org/string.prototype.matchall/-/string.prototype.matchall-4.0.6.tgz",
@@ -5129,6 +4856,7 @@
       "version": "1.3.0",
       "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.3.0.tgz",
       "integrity": "sha512-hkRX8U1WjJFd8LsDJ2yQ/wWWxaopEsABU1XfkM8A+j0+85JAGppt16cr1Whg6KIbb4okU6Mql6BOj+uup/wKeA==",
+      "dev": true,
       "requires": {
         "safe-buffer": "~5.2.0"
       },
@@ -5136,7 +4864,8 @@
         "safe-buffer": {
           "version": "5.2.1",
           "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.2.1.tgz",
-          "integrity": "sha512-rp3So07KcdmmKbGvgaNxQSJr7bGVSVk5S9Eq1F+ppbRo70+YeaDxkw5Dd8NPN+GD6bjnYm2VuPuCXmpuYvmCXQ=="
+          "integrity": "sha512-rp3So07KcdmmKbGvgaNxQSJr7bGVSVk5S9Eq1F+ppbRo70+YeaDxkw5Dd8NPN+GD6bjnYm2VuPuCXmpuYvmCXQ==",
+          "dev": true
         }
       }
     },
@@ -5380,19 +5109,6 @@
       "integrity": "sha512-hqTN6kW+pN6/qro6G9OZ7ceDQOcYno020zBQKpZQLsJhYTDMCMNfXi/Y8duF5iW+4WWZr42ry0MMkcRGpbwG2A==",
       "dev": true
     },
-    "tar": {
-      "version": "6.1.11",
-      "resolved": "https://registry.npmjs.org/tar/-/tar-6.1.11.tgz",
-      "integrity": "sha512-an/KZQzQUkZCkuoAA64hM92X0Urb6VpRhAFllDzz44U2mcD5scmT3zBc4VgVpkugF580+DQn8eAFSyoQt0tznA==",
-      "requires": {
-        "chownr": "^2.0.0",
-        "fs-minipass": "^2.0.0",
-        "minipass": "^3.0.0",
-        "minizlib": "^2.1.1",
-        "mkdirp": "^1.0.3",
-        "yallist": "^4.0.0"
-      }
-    },
     "temp-dir": {
       "version": "2.0.0",
       "resolved": "https://registry.npmjs.org/temp-dir/-/temp-dir-2.0.0.tgz",
@@ -5551,6 +5267,11 @@
         "is-number": "^7.0.0"
       }
     },
+    "toggle-selection": {
+      "version": "1.0.6",
+      "resolved": "https://registry.npmjs.org/toggle-selection/-/toggle-selection-1.0.6.tgz",
+      "integrity": "sha1-bkWxJj8gF/oKzH2J14sVuL932jI="
+    },
     "token-stream": {
       "version": "1.0.0",
       "resolved": "https://registry.npmmirror.com/token-stream/-/token-stream-1.0.0.tgz",
@@ -5736,7 +5457,8 @@
     "util-deprecate": {
       "version": "1.0.2",
       "resolved": "https://registry.npmjs.org/util-deprecate/-/util-deprecate-1.0.2.tgz",
-      "integrity": "sha1-RQ1Nyfpw3nMnYvvS1KKJgUGaDM8="
+      "integrity": "sha1-RQ1Nyfpw3nMnYvvS1KKJgUGaDM8=",
+      "dev": true
     },
     "vary": {
       "version": "1.1.2",
@@ -5993,15 +5715,6 @@
       "resolved": "https://registry.npmmirror.com/vue-demi/-/vue-demi-0.12.1.tgz",
       "integrity": "sha512-QL3ny+wX8c6Xm1/EZylbgzdoDolye+VpCXRhI2hug9dJTP3OUJ3lmiKN3CsVV3mOJKwFi0nsstbgob0vG7aoIw=="
     },
-    "vue-qr": {
-      "version": "3.2.4",
-      "resolved": "https://registry.npmjs.org/vue-qr/-/vue-qr-3.2.4.tgz",
-      "integrity": "sha512-wQaoC0JKt3bR8Y0ql0SFF/QfL77ZTN/lov7msSccJJJSUBFauj+1l8dSD8GiU88YitEOKKhoKm4LUPdPiDi2/g==",
-      "requires": {
-        "canvas": "2.9",
-        "js-binary-schema-parser": "^2.0.2"
-      }
-    },
     "vue-router": {
       "version": "4.0.12",
       "resolved": "https://registry.npmmirror.com/vue-router/-/vue-router-4.0.12.tgz",
@@ -6020,11 +5733,6 @@
         "vscode-vue-languageservice": "0.29.8"
       }
     },
-    "vue-virtual-scroll-list": {
-      "version": "2.3.3",
-      "resolved": "https://registry.npmmirror.com/vue-virtual-scroll-list/-/vue-virtual-scroll-list-2.3.3.tgz",
-      "integrity": "sha512-heuwlZ+lEdcVSp66CpVXnyNdsiHl/XU1cvqJb0yUHGlLv6DGK8OX16FH8I3w/wKNXtHSPF9itdBBGJFrXkyHeg=="
-    },
     "webidl-conversions": {
       "version": "4.0.2",
       "resolved": "https://registry.npmjs.org/webidl-conversions/-/webidl-conversions-4.0.2.tgz",
@@ -6060,14 +5768,6 @@
         "is-symbol": "^1.0.3"
       }
     },
-    "wide-align": {
-      "version": "1.1.5",
-      "resolved": "https://registry.npmjs.org/wide-align/-/wide-align-1.1.5.tgz",
-      "integrity": "sha512-eDMORYaPNZ4sQIuuYPDHdQvf4gyCF9rEEV/yPxGfwPkRodwEgiMUUXTx/dex+Me0wxx53S+NgUHaP7y3MGlDmg==",
-      "requires": {
-        "string-width": "^1.0.2 || 2 || 3 || 4"
-      }
-    },
     "with": {
       "version": "7.0.2",
       "resolved": "https://registry.npmmirror.com/with/-/with-7.0.2.tgz",
@@ -6289,12 +5989,14 @@
     "wrappy": {
       "version": "1.0.2",
       "resolved": "https://registry.npmmirror.com/wrappy/-/wrappy-1.0.2.tgz",
-      "integrity": "sha512-l4Sp/DRseor9wL6EvV2+TuQn63dMkPjZ/sp9XkghTEbV9KlPS1xUsZ3u7/IQO4wxtcFB4bgpQPRcR3QCvezPcQ=="
+      "integrity": "sha512-l4Sp/DRseor9wL6EvV2+TuQn63dMkPjZ/sp9XkghTEbV9KlPS1xUsZ3u7/IQO4wxtcFB4bgpQPRcR3QCvezPcQ==",
+      "dev": true
     },
     "yallist": {
       "version": "4.0.0",
       "resolved": "https://registry.npmmirror.com/yallist/-/yallist-4.0.0.tgz",
-      "integrity": "sha512-3wdGidZyq5PB084XLES5TpOSRA3wjXAlIWMhum2kRcv/41Sn2emQ0dycQW4uZXLejwKvg6EsvbdlVL+FYEct7A=="
+      "integrity": "sha512-3wdGidZyq5PB084XLES5TpOSRA3wjXAlIWMhum2kRcv/41Sn2emQ0dycQW4uZXLejwKvg6EsvbdlVL+FYEct7A==",
+      "dev": true
     }
   }
 }

package.json

@@ -12,15 +12,16 @@
     "@rongcloud/imlib-next": "^5.1.1",
     "@rongcloud/plugin-rtc": "^5.3.1",
     "clean-deep": "^3.4.0",
+    "copy-to-clipboard": "^3.3.1",
     "dayjs": "^1.10.7",
     "element-plus": "^2.0.2",
+    "html-to-image": "^1.9.0",
     "js-cookie": "^3.0.1",
     "mitt": "^3.0.0",
     "nprogress": "^0.2.0",
     "query-string": "^7.1.1",
     "umi-request": "^1.4.0",
     "vue": "^3.2.25",
-    "vue-qr": "^3.2.4",
     "vue-router": "^4.0.12"
   },
   "devDependencies": {

src/components/live-broadcast/action-bar.tsx

@@ -210,7 +210,7 @@ export default defineComponent({
         {/* <ElButton onClick={RuntimeUtils.shareScreenVideo}>屏幕共享</ElButton> */}
         <ElDialog width="510px"
           append-to-body modelValue={this.shareVisiable} title="分享" before-close={() => { this.shareVisiable = false }}>
-            <Share />
+            <Share onClose={()=>this.shareVisiable = false}/>
         </ElDialog>
       </div>
     )

src/components/live-broadcast/preview.module.less

@@ -55,17 +55,17 @@
     height: 223px;
     position: absolute;
     right: 3px;
-    top: 36px;
+    top: 8px;
   }
   
   .teacher {
-    font-size: 16px;
-    font-family: PingFangSC-Medium, PingFang SC;
-    font-weight: 500;
-    color: #ffffff;
-    line-height: 20px;
-    margin-top: 15px;
-    margin-bottom: 67px;
+    font-size: 16px!important;
+    font-family: PingFangSC-Medium, PingFang SC!important;
+    font-weight: 500!important;
+    color: #ffffff!important;
+    line-height: 20px!important;
+    margin-top: 15px!important;
+    margin-bottom: 67px!important;
   }
   .preCore {
     position: relative;

src/components/live-broadcast/preview.tsx

@@ -2,7 +2,14 @@ import { defineComponent } from 'vue'
 import { ElButton, ElFormItem, ElForm, ElRadio } from 'element-plus'
 import runtime, * as RuntimeUtils from './runtime'
 import styles from './preview.module.less'
-import vueQr from 'vue-qr/src/packages/vue-qr.vue'
+
+import icon1 from './images/icon1.png'
+import icon2 from './images/icon2.png'
+import icon3 from './images/icon3.png'
+import icon4 from './images/icon4.png'
+import icon5 from './images/icon5.png'
+import logo from './images/logo.png'
+import start from './images/start.png'
 
 export default defineComponent({
     name: 'LiveBroadcastSharePreview',
@@ -17,7 +24,6 @@ export default defineComponent({
             url: "http://www.baidu.com",
         }
     },
-
     methods: {
         copyText() {
 
@@ -30,77 +36,77 @@ export default defineComponent({
         return (
             <div id="preview">
                 {this.form.preTemplate === '1' ?
-                    <div class="first">
+                    <div class={styles.first}>
                         <h2>{this.form.roomTitle}</h2>
-                        <p class="teacher">主讲人：{this.form.teacherName}</p>
-                        <img src="./images/icon1.png" class="icon" alt="" />
-                        <div class="preCore">
-                            <img src="./images/start.png" class="start" alt="" />
-                            <p class="title">开播时间</p>
-                            <p class="time">{this.form.liveStartTime}</p>
-                            <p class="title">直播内容</p>
-                            <div class="content">
-                                <img class="pre" src="./images/icon5.png" alt="" />
-                                <img class="end" src="./images/icon4.png" alt="" />
+                        <p class={styles.teacher}> 主讲人：{this.form.speakerName}</p>
+                        <img src={icon1} class={styles.icon} alt="" />
+                        <div class={styles.preCore}>
+                            <img src={start} class={styles.start} alt="" />
+                            <p class={styles.title}>开播时间</p>
+                            <p class={styles.time}>{this.form.liveStartTime}</p>
+                            <p class={styles.title}>直播内容</p>
+                            <div class={styles.content}>
+                                <img class={styles.pre} src={icon5} alt="" />
+                                <img class={styles.end} src={icon4} alt="" />
                                 {this.form.liveRemark}
                             </div>
                         </div>
-                        <div class="bottom">
-                            <img class="logo" src="./images/logo.png" alt="" />
-                            <div class="code">
+                        <div class={styles.bottom}>
+                            <img class={styles.logo} src={logo} alt="" />
+                            <div class={styles.code}>
                                 <div>
-                                    <vue-qr text={this.url} style="width: 100%; margin='0'"></vue-qr>
+                                <canvas id='canvas' style="width: 100% margin:0"></canvas>
                                 </div>
                             </div>
                         </div >
                     </div> : null}
                 {this.form.preTemplate === '2' ?
-                    <div class="second" >
+                    <div class={styles.second} >
                         <h2>{this.form.roomTitle}</h2>
-                        <p class="teacher">主讲人：{this.form.teacherName}</p>
-                        <img src="./images/icon2.png" class="icon" alt="" />
-                        <div class="preCore">
-                            <img src="./images/start.png" class="start" alt="" />
-                            <p class="title">开播时间</p>
-                            <p class="time">{this.form.liveStartTime}</p>
-                            <p class="title">直播内容</p>
-                            <div class="content">
-                                <img class="pre" src="./images/icon5.png" alt="" />
-                                <img class="end" src="./images/icon4.png" alt="" />
+                        <p class={styles.teacher}>主讲人：{this.form.speakerName}</p>
+                        <img src={icon2} class={styles.icon} alt="" />
+                        <div class={styles.preCore}>
+                            <img src={start} class={styles.start} alt="" />
+                            <p class={styles.title}>开播时间</p>
+                            <p class={styles.time}>{this.form.liveStartTime}</p>
+                            <p class={styles.title}>直播内容</p>
+                            <div class={styles.content}>
+                                <img class={styles.pre} src={icon5} alt="" />
+                                <img class={styles.end} src={icon4} alt="" />
                                 {this.form.liveRemark}
                             </div>
                         </div>
-                        <div class="bottom">
-                            <img class="logo" src="./images/logo.png" alt="" />
-                            <div class="code">
+                        <div class={styles.bottom}>
+                            <img class={styles.logo} src={logo} alt="" />
+                            <div class={styles.code}>
                                 <div>
-                                    <vue-qr text={this.url} style="width: 100%;margin='0'"></vue-qr>
+                                <canvas id='canvas' style="width: 100% margin:0"></canvas>
                                 </div>
                             </div>
                         </div>
                     </div> : null
                 }
                 {this.form.preTemplate === '3' ?
-                    <div class="third" >
+                    <div class={styles.third} >
                         <h2>{this.form.roomTitle}</h2>
-                        <p class="teacher">主讲人：{this.form.teacherName}</p>
-                        <img src="./images/icon3.png" class="icon" alt="" />
-                        <div class="preCore">
-                            <img src="./images/start.png" class="start" alt="" />
-                            <p class="title">开播时间</p>
-                            <p class="time">{this.form.liveStartTime}</p>
-                            <p class="title">直播内容</p>
-                            <div class="content">
-                                <img class="pre" src="./images/icon5.png" alt="" />
-                                <img class="end" src="./images/icon4.png" alt="" />
+                        <p class={styles.teacher}>主讲人：{this.form.speakerName}</p>
+                        <img src={icon3} class={styles.icon} alt="" />
+                        <div class={styles.preCore}>
+                            <img src={start} class={styles.start} alt="" />
+                            <p class={styles.title}>开播时间</p>
+                            <p class={styles.time}>{this.form.liveStartTime}</p>
+                            <p class={styles.title}>直播内容</p>
+                            <div class={styles.content}>
+                                <img class={styles.pre} src={icon5} alt="" />
+                                <img class={styles.end} src={icon4} alt="" />
                                 {this.form.liveRemark}
                             </div>
                         </div>
-                        <div class="bottom">
-                            <img class="logo" src="./images/logo.png" alt="" />
-                            <div class="code">
+                        <div class={styles.bottom}>
+                            <img class={styles.logo} src={logo} alt="" />
+                            <div class={styles.code}>
                                 <div>
-                                    <vue-qr text={this.url} style="width: 100% margin:0"></vue-qr>
+                                    <canvas id='canvas' style="width: 100% margin:0"></canvas>
                                 </div>
                             </div>
                         </div>

src/components/live-broadcast/share.module.less

@@ -26,7 +26,7 @@
   }
   .shareBtn {
     height: 48px;
-    background: var(--color-primary);
+    background: var( --el-color-primary);
     border-radius: 32px;
     width: 192px;
     color: #fff;

src/components/live-broadcast/share.tsx

@@ -1,24 +1,36 @@
 import { defineComponent } from 'vue'
-import { ElButton, ElFormItem, ElForm, ElRadio } from 'element-plus'
+import { ElButton, ElFormItem, ElForm, ElRadio,ElMessage } from 'element-plus'
 import runtime, * as RuntimeUtils from './runtime'
 import styles from './share.module.less'
 import request from "/src/helpers/request";
+import { vaildStudentUrl } from "/src/helpers/validate";
+import { toPng } from "html-to-image";
+import copy from "copy-to-clipboard";
 // import groupChat from './'
 import Preview from './preview'
 export default defineComponent({
+ 
     name: 'LiveBroadcastShare',
+    props:{
+        onClose:{
+            type: Function,
+            default: () => {}
+        }
+    },
     data() {
         return {
-            form: { shareType: '2' },
+            form: { shareType: '1' },
             detail: {
                 roomTitle: '',
                 liveStartTime: '',
                 liveRemark: '',
-            }
+                roomUid:''
+            },
+            url: ''
         }
     },
     async mounted() {
-        let details:any = JSON.parse(sessionStorage.getItem('details')||'')
+        let details: any = JSON.parse(sessionStorage.getItem('details') || '')
         if (!details) {
             const roomUid = sessionStorage.getItem('roomUid')
             const details: any = await request.get('/api-web/imLiveBroadcastRoom/queryRoom', {
@@ -27,19 +39,44 @@ export default defineComponent({
                 }
             })
             sessionStorage.setItem('details', details.data)
-            this.detail = {... details.data} 
-        }else{
-            this.detail = {...details}
+            this.detail = { ...details.data }
+        } else {
+            this.detail = { ...details }
         }
+        this.url = vaildStudentUrl() + `/#/liveClassTransfer?roomUid=${this.detail.roomUid}`;
     },
     methods: {
         copyText() {
-
+            let text = `乐团老师邀请您参与直播课！\n${this.detail.roomTitle || ""
+                }\n直播时间:${this.detail.liveStartTime || ""}\n直播内容:${this.detail.liveRemark || ""
+                }\n直播地址:${this.url}\n`;
+            if (text) {
+                copy(text);
+                ElMessage.success("复制成功");
+                this.onClose()
+            }
         },
         shareImage() {
-
+            var node = document.getElementById("preview");
+            toPng(node)
+              .then((dataUrl) => {
+                var img = new Image();
+                img.src = dataUrl;
+                // 在这里下载
+                let link = document.createElement("a");
+                let fname = this.detail.roomTitle || "分享图片文件.png"; //下载文件的名字
+                link.href = dataUrl;
+                link.setAttribute("download", fname);
+                document.body.appendChild(link);
+                link.click();
+                 this.$emit('close')
+              })
+              .catch(function (error) {
+                console.error("oops, something went wrong!", error);
+              });
         },
-        changeRafdio(value:string){
+        shareChat() { },
+        changeRafdio(value: string) {
             this.form.shareType = value;
         }
     },
@@ -48,9 +85,9 @@ export default defineComponent({
             <div >
                 <ElForm model={this.form} ref="form" class={styles.form}>
                     <ElFormItem label="分享方式" >
-                        <ElRadio modelValue={this.form.shareType} onChange={()=>{this.changeRafdio("1")}} label="1">链接分享</ElRadio>
-                        <ElRadio modelValue={this.form.shareType} onChange={()=>{this.changeRafdio("2")}}label="2" >二维码分享</ElRadio>
-                        <ElRadio modelValue={this.form.shareType} onChange={()=>{this.changeRafdio("3")}}label="3">群聊分享</ElRadio>
+                        <ElRadio modelValue={this.form.shareType} onChange={() => { this.changeRafdio("1") }} label="1">链接分享</ElRadio>
+                        <ElRadio modelValue={this.form.shareType} onChange={() => { this.changeRafdio("2") }} label="2" >二维码分享</ElRadio>
+                        <ElRadio modelValue={this.form.shareType} onChange={() => { this.changeRafdio("3") }} label="3">群聊分享</ElRadio>
                     </ElFormItem>
                 </ElForm>
                 <div>
@@ -61,22 +98,24 @@ export default defineComponent({
                             <h4>{this.detail.roomTitle}</h4>
                             <p>直播时间:{this.detail.liveStartTime}</p>
                             <p>直播内容:{this.detail.liveRemark}</p>
-                            <p>直播地址:</p>
+                            <p>直播地址:{this.url}</p>
                         </div>
                         <div class={styles.shareBtn} onClick={this.copyText}>复制分享内容</div>
                     </div> : null}
                 </div >
                 {this.form.shareType === '2' ? <div class={styles.codeWrap} >
                     <div class={styles.shareWrap}>
-                        <Preview form={this.detail}/>
+                        <Preview form={this.detail} />
                     </div>
                     <div class={styles.shareBtn} onClick={this.shareImage}>复制分享内容</div>
                 </div> : null
                 }
-                {this.form.shareType == '3' ?
+                {this.form.shareType == '3' ? <div class={styles.shareWrap}>
                     <div class={styles.groupWrap} >
                         {/* <GroupChat /> */}
-                    </div> : null
+                    </div>
+                    <div class={styles.shareBtn} onClick={this.shareChat}>发送分享信息</div>
+                </div> : null
                 }
             </div>
         )

src/env.d.ts

@@ -7,6 +7,12 @@ declare module '*.vue' {
   export default component
 }
 
+declare module 'vue-qr' {
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any, @typescript-eslint/ban-types
+  const component:any
+  export default component
+}
+
 declare const SvgIcon: any
 
 // declare module 'vue-virtual-scroll-list';

src/helpers/validate.ts

@@ -0,0 +1,15 @@
+// 学生地址
+export function vaildStudentUrl() {
+    let url = window.location.href
+    let returnUrl = ''
+    if (/online/.test(url)) { //线上
+      returnUrl = 'https://mstuonline.dayaedu.com'
+    } else if (/dev/.test(url)) { // dev 环境
+      returnUrl = 'http://mstudev.dayaedu.com'
+    } else if (/test/.test(url)) { // dev 环境
+      returnUrl = 'http://mstutest.dayaedu.com'
+    } else { // 默认dev环境
+      returnUrl = 'http://mstudev.dayaedu.com'
+    }
+    return returnUrl
+  }

src/main.ts

@@ -1,4 +1,4 @@
-import { createApp } from 'vue'
+import  Vue from 'vue'
 import 'virtual:svg-icons-register'
 import 'element-plus/dist/index.css'
 import App from './App.vue'
@@ -9,8 +9,9 @@ import SvgIcon from './components/svg-icon/install'
 import './permission'
 // import './icons' // icon
 import './base.css'
+const QRCode = require('qrcodejs2')
+Vue.prototype.QRCode = QRCode
 
-
-createApp(App)
+Vue.createApp(App)
   .use(SvgIcon)
   .use(router).mount('#app')