chore: update

34189075 · 王鹏飞 · 43bde8c6 · 34189075 · 34189075 · 34189075
--- a/.eslintrc-auto-import.json
+++ b/.eslintrc-auto-import.json
@@ -42,9 +42,6 @@
    "isReactive": true,
    "isReadonly": true,
    "isRef": true,
-    "logicAnd": true,
-    "logicNot": true,
-    "logicOr": true,
    "makeDestructurable": true,
    "markRaw": true,
    "nextTick": true,
@@ -105,6 +102,14 @@
    "unrefElement": true,
    "until": true,
    "useActiveElement": true,
+    "useArrayEvery": true,
+    "useArrayFilter": true,
+    "useArrayFind": true,
+    "useArrayFindIndex": true,
+    "useArrayJoin": true,
+    "useArrayMap": true,
+    "useArrayReduce": true,
+    "useArraySome": true,
    "useAsyncQueue": true,
    "useAsyncState": true,
    "useAttrs": true,
@@ -115,7 +120,6 @@
    "useBroadcastChannel": true,
    "useBrowserLocation": true,
    "useCached": true,
-    "useClamp": true,
    "useClipboard": true,
    "useColorMode": true,
    "useConfirmDialog": true,
@@ -191,6 +195,7 @@
    "usePreferredColorScheme": true,
    "usePreferredDark": true,
    "usePreferredLanguages": true,
+    "usePreferredReducedMotion": true,
    "useRafFn": true,
    "useRefHistory": true,
    "useResizeObserver": true,
@@ -210,8 +215,10 @@
    "useStorage": true,
    "useStorageAsync": true,
    "useStyleTag": true,
+    "useSupported": true,
    "useSwipe": true,
    "useTemplateRefsList": true,
+    "useTextDirection": true,
    "useTextSelection": true,
    "useTextareaAutosize": true,
    "useThrottle": true,
@@ -223,6 +230,8 @@
    "useTimeoutPoll": true,
    "useTimestamp": true,
    "useTitle": true,
+    "useToNumber": true,
+    "useToString": true,
    "useToggle": true,
    "useTransition": true,
    "useUrlSearchParams": true,

--- a/auto-imports.d.ts
+++ b/auto-imports.d.ts
@@ -43,9 +43,6 @@ declare global {
  const isReactive: typeof import('vue')['isReactive']
  const isReadonly: typeof import('vue')['isReadonly']
  const isRef: typeof import('vue')['isRef']
-  const logicAnd: typeof import('@vueuse/core')['logicAnd']
-  const logicNot: typeof import('@vueuse/core')['logicNot']
-  const logicOr: typeof import('@vueuse/core')['logicOr']
  const makeDestructurable: typeof import('@vueuse/core')['makeDestructurable']
  const markRaw: typeof import('vue')['markRaw']
  const nextTick: typeof import('vue')['nextTick']
@@ -106,6 +103,14 @@ declare global {
  const unrefElement: typeof import('@vueuse/core')['unrefElement']
  const until: typeof import('@vueuse/core')['until']
  const useActiveElement: typeof import('@vueuse/core')['useActiveElement']
+  const useArrayEvery: typeof import('@vueuse/core')['useArrayEvery']
+  const useArrayFilter: typeof import('@vueuse/core')['useArrayFilter']
+  const useArrayFind: typeof import('@vueuse/core')['useArrayFind']
+  const useArrayFindIndex: typeof import('@vueuse/core')['useArrayFindIndex']
+  const useArrayJoin: typeof import('@vueuse/core')['useArrayJoin']
+  const useArrayMap: typeof import('@vueuse/core')['useArrayMap']
+  const useArrayReduce: typeof import('@vueuse/core')['useArrayReduce']
+  const useArraySome: typeof import('@vueuse/core')['useArraySome']
  const useAsyncQueue: typeof import('@vueuse/core')['useAsyncQueue']
  const useAsyncState: typeof import('@vueuse/core')['useAsyncState']
  const useAttrs: typeof import('vue')['useAttrs']
@@ -116,7 +121,6 @@ declare global {
  const useBroadcastChannel: typeof import('@vueuse/core')['useBroadcastChannel']
  const useBrowserLocation: typeof import('@vueuse/core')['useBrowserLocation']
  const useCached: typeof import('@vueuse/core')['useCached']
-  const useClamp: typeof import('@vueuse/core')['useClamp']
  const useClipboard: typeof import('@vueuse/core')['useClipboard']
  const useColorMode: typeof import('@vueuse/core')['useColorMode']
  const useConfirmDialog: typeof import('@vueuse/core')['useConfirmDialog']
@@ -192,6 +196,7 @@ declare global {
  const usePreferredColorScheme: typeof import('@vueuse/core')['usePreferredColorScheme']
  const usePreferredDark: typeof import('@vueuse/core')['usePreferredDark']
  const usePreferredLanguages: typeof import('@vueuse/core')['usePreferredLanguages']
+  const usePreferredReducedMotion: typeof import('@vueuse/core')['usePreferredReducedMotion']
  const useRafFn: typeof import('@vueuse/core')['useRafFn']
  const useRefHistory: typeof import('@vueuse/core')['useRefHistory']
  const useResizeObserver: typeof import('@vueuse/core')['useResizeObserver']
@@ -211,8 +216,10 @@ declare global {
  const useStorage: typeof import('@vueuse/core')['useStorage']
  const useStorageAsync: typeof import('@vueuse/core')['useStorageAsync']
  const useStyleTag: typeof import('@vueuse/core')['useStyleTag']
+  const useSupported: typeof import('@vueuse/core')['useSupported']
  const useSwipe: typeof import('@vueuse/core')['useSwipe']
  const useTemplateRefsList: typeof import('@vueuse/core')['useTemplateRefsList']
+  const useTextDirection: typeof import('@vueuse/core')['useTextDirection']
  const useTextSelection: typeof import('@vueuse/core')['useTextSelection']
  const useTextareaAutosize: typeof import('@vueuse/core')['useTextareaAutosize']
  const useThrottle: typeof import('@vueuse/core')['useThrottle']
@@ -224,6 +231,8 @@ declare global {
  const useTimeoutPoll: typeof import('@vueuse/core')['useTimeoutPoll']
  const useTimestamp: typeof import('@vueuse/core')['useTimestamp']
  const useTitle: typeof import('@vueuse/core')['useTitle']
+  const useToNumber: typeof import('@vueuse/core')['useToNumber']
+  const useToString: typeof import('@vueuse/core')['useToString']
  const useToggle: typeof import('@vueuse/core')['useToggle']
  const useTransition: typeof import('@vueuse/core')['useTransition']
  const useUrlSearchParams: typeof import('@vueuse/core')['useUrlSearchParams']

--- a/package-lock.json
+++ b/package-lock.json
@@ -13,10 +13,12 @@
        "@vueuse/core": "^9.1.0",
        "axios": "^0.27.2",
        "blueimp-md5": "^2.19.0",
+        "dayjs": "^1.11.5",
        "element-plus": "^2.2.12",
        "lodash-es": "^4.17.21",
        "pinia": "^2.0.17",
        "qs": "^6.11.0",
+        "video.js": "^7.20.2",
        "vue": "^3.2.37",
        "vue-router": "^4.1.3"
      },
@@ -25,6 +27,7 @@
        "@types/blueimp-md5": "^2.18.0",
        "@types/node": "^16.11.45",
        "@types/qs": "^6.9.7",
+        "@types/video.js": "^7.3.45",
        "@vitejs/plugin-vue": "^3.0.1",
        "@vue/eslint-config-typescript": "^11.0.0",
        "@vue/tsconfig": "^0.1.3",
@@ -163,6 +166,17 @@
        "node": ">=6.0.0"
      }
    },
+    "node_modules/@babel/runtime": {
+      "version": "7.18.9",
+      "resolved": "https://registry.npmmirror.com/@babel/runtime/-/runtime-7.18.9.tgz",
+      "integrity": "sha512-lkqXDcvlFT5rvEjiu6+QYO+1GXrEHRo2LOtS7E4GtX5ESIZOgepqsZBVIj6Pv+a6zqsya9VCgiK1KAK4BvJDAw==",
+      "dependencies": {
+        "regenerator-runtime": "^0.13.4"
+      },
+      "engines": {
+        "node": ">=6.9.0"
+      }
+    },
    "node_modules/@ctrl/tinycolor": {
      "version": "3.4.1",
      "resolved": "https://registry.npmmirror.com/@ctrl/tinycolor/-/tinycolor-3.4.1.tgz",
@@ -371,6 +385,12 @@
      "integrity": "sha512-FGa1F62FT09qcrueBA6qYTrJPVDzah9a+493+o2PCXsesWHIn27G98TsSMs3WPNbZIEj4+VJf6saSFpvD+3Zsw==",
      "dev": true
    },
+    "node_modules/@types/video.js": {
+      "version": "7.3.45",
+      "resolved": "https://registry.npmmirror.com/@types/video.js/-/video.js-7.3.45.tgz",
+      "integrity": "sha512-el7P2zE6Qf81kMeQORuW+tEuf8dzySariEHVNHGyaGljxrvt8kfy52Np5WbilDiAwOc7pN2b/52VGbPpbm2ICw==",
+      "dev": true
+    },
    "node_modules/@types/web-bluetooth": {
      "version": "0.0.15",
      "resolved": "https://registry.npmmirror.com/@types/web-bluetooth/-/web-bluetooth-0.0.15.tgz",
@@ -528,6 +548,52 @@
        "node": "^12.22.0 || ^14.17.0 || >=16.0.0"
      }
    },
+    "node_modules/@videojs/http-streaming": {
+      "version": "2.14.2",
+      "resolved": "https://registry.npmmirror.com/@videojs/http-streaming/-/http-streaming-2.14.2.tgz",
+      "integrity": "sha512-K1raSfO/pq5r8iUas3OSYni0kXOj91n8ealIpV02khghzGv9LQ6O3YUqYd/eAhJ1HIrmZWOnrYpK/P+mhUExXQ==",
+      "dependencies": {
+        "@babel/runtime": "^7.12.5",
+        "@videojs/vhs-utils": "3.0.5",
+        "aes-decrypter": "3.1.3",
+        "global": "^4.4.0",
+        "m3u8-parser": "4.7.1",
+        "mpd-parser": "0.21.1",
+        "mux.js": "6.0.1",
+        "video.js": "^6 || ^7"
+      },
+      "engines": {
+        "node": ">=8",
+        "npm": ">=5"
+      },
+      "peerDependencies": {
+        "video.js": "^6 || ^7"
+      }
+    },
+    "node_modules/@videojs/vhs-utils": {
+      "version": "3.0.5",
+      "resolved": "https://registry.npmmirror.com/@videojs/vhs-utils/-/vhs-utils-3.0.5.tgz",
+      "integrity": "sha512-PKVgdo8/GReqdx512F+ombhS+Bzogiofy1LgAj4tN8PfdBx3HSS7V5WfJotKTqtOWGwVfSWsrYN/t09/DSryrw==",
+      "dependencies": {
+        "@babel/runtime": "^7.12.5",
+        "global": "^4.4.0",
+        "url-toolkit": "^2.2.1"
+      },
+      "engines": {
+        "node": ">=8",
+        "npm": ">=5"
+      }
+    },
+    "node_modules/@videojs/xhr": {
+      "version": "2.6.0",
+      "resolved": "https://registry.npmmirror.com/@videojs/xhr/-/xhr-2.6.0.tgz",
+      "integrity": "sha512-7J361GiN1tXpm+gd0xz2QWr3xNWBE+rytvo8J3KuggFaLg+U37gZQ2BuPLcnkfGffy2e+ozY70RHC8jt7zjA6Q==",
+      "dependencies": {
+        "@babel/runtime": "^7.5.5",
+        "global": "~4.4.0",
+        "is-function": "^1.0.1"
+      }
+    },
    "node_modules/@vitejs/plugin-vue": {
      "version": "3.0.1",
      "resolved": "https://registry.npmmirror.com/@vitejs/plugin-vue/-/plugin-vue-3.0.1.tgz",
@@ -815,6 +881,14 @@
        }
      }
    },
+    "node_modules/@xmldom/xmldom": {
+      "version": "0.7.5",
+      "resolved": "https://registry.npmmirror.com/@xmldom/xmldom/-/xmldom-0.7.5.tgz",
+      "integrity": "sha512-V3BIhmY36fXZ1OtVcI9W+FxQqxVLsPKcNjWigIaa81dLC9IolJl5Mt4Cvhmr0flUnjSpTdrbMTSbXqYqV5dT6A==",
+      "engines": {
+        "node": ">=10.0.0"
+      }
+    },
    "node_modules/acorn": {
      "version": "8.8.0",
      "resolved": "https://registry.npmmirror.com/acorn/-/acorn-8.8.0.tgz",
@@ -854,6 +928,17 @@
        "node": ">= 10.0.0"
      }
    },
+    "node_modules/aes-decrypter": {
+      "version": "3.1.3",
+      "resolved": "https://registry.npmmirror.com/aes-decrypter/-/aes-decrypter-3.1.3.tgz",
+      "integrity": "sha512-VkG9g4BbhMBy+N5/XodDeV6F02chEk9IpgRTq/0bS80y4dzy79VH2Gtms02VXomf3HmyRe3yyJYkJ990ns+d6A==",
+      "dependencies": {
+        "@babel/runtime": "^7.12.5",
+        "@videojs/vhs-utils": "^3.0.5",
+        "global": "^4.4.0",
+        "pkcs7": "^1.0.4"
+      }
+    },
    "node_modules/agent-base": {
      "version": "6.0.2",
      "resolved": "https://registry.npmmirror.com/agent-base/-/agent-base-6.0.2.tgz",
@@ -1297,9 +1382,9 @@
      }
    },
    "node_modules/dayjs": {
-      "version": "1.11.4",
-      "resolved": "https://registry.npmmirror.com/dayjs/-/dayjs-1.11.4.tgz",
-      "integrity": "sha512-Zj/lPM5hOvQ1Bf7uAvewDaUcsJoI6JmNqmHhHl3nyumwe0XHwt8sWdOVAPACJzCebL8gQCi+K49w7iKWnGwX9g=="
+      "version": "1.11.5",
+      "resolved": "https://registry.npmmirror.com/dayjs/-/dayjs-1.11.5.tgz",
+      "integrity": "sha512-CAdX5Q3YW3Gclyo5Vpqkgpj8fSdLQcRuzfX6mC6Phy0nfJ0eGYOeS7m4mt2plDWLAtA4TqTakvbboHvUxfe4iA=="
    },
    "node_modules/debug": {
      "version": "4.3.4",
@@ -1426,6 +1511,11 @@
        "node": ">=6.0.0"
      }
    },
+    "node_modules/dom-walk": {
+      "version": "0.1.2",
+      "resolved": "https://registry.npmmirror.com/dom-walk/-/dom-walk-0.1.2.tgz",
+      "integrity": "sha512-6QvTW9mrGeIegrFXdtQi9pk7O/nSK6lSdXW2eqUspN5LWD7UTji2Fqw5V2YLjBpHEoU9Xl/eUWNpDeZvoyOv2w=="
+    },
    "node_modules/ee-first": {
      "version": "1.1.1",
      "resolved": "https://registry.npmmirror.com/ee-first/-/ee-first-1.1.1.tgz",
@@ -2553,6 +2643,15 @@
        "node": ">=10.13.0"
      }
    },
+    "node_modules/global": {
+      "version": "4.4.0",
+      "resolved": "https://registry.npmmirror.com/global/-/global-4.4.0.tgz",
+      "integrity": "sha512-wv/LAoHdRE3BeTGz53FAamhGlPLhlssK45usmGFThIi4XqnBmjKQ16u+RNbP7WvigRZDxUsM0J3gcQ5yicaL0w==",
+      "dependencies": {
+        "min-document": "^2.19.0",
+        "process": "^0.11.10"
+      }
+    },
    "node_modules/globals": {
      "version": "13.17.0",
      "resolved": "https://registry.npmmirror.com/globals/-/globals-13.17.0.tgz",
@@ -2732,6 +2831,11 @@
        "node": ">=0.8.19"
      }
    },
+    "node_modules/individual": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmmirror.com/individual/-/individual-2.0.0.tgz",
+      "integrity": "sha512-pWt8hBCqJsUWI/HtcfWod7+N9SgAqyPEaF7JQjwzjn5vGrpg6aQ5qeAFQ7dx//UH4J1O+7xqew+gCeeFt6xN/g=="
+    },
    "node_modules/inflight": {
      "version": "1.0.6",
      "resolved": "https://registry.npmmirror.com/inflight/-/inflight-1.0.6.tgz",
@@ -2799,6 +2903,11 @@
        "node": ">=0.10.0"
      }
    },
+    "node_modules/is-function": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmmirror.com/is-function/-/is-function-1.0.2.tgz",
+      "integrity": "sha512-lw7DUp0aWXYg+CBCN+JKkcE0Q2RayZnSvnZBlwgxHBQhqt5pZNVy4Ri7H9GmmXkdu7LUthszM+Tor1u/2iBcpQ=="
+    },
    "node_modules/is-glob": {
      "version": "4.0.3",
      "resolved": "https://registry.npmmirror.com/is-glob/-/is-glob-4.0.3.tgz",
@@ -2906,6 +3015,11 @@
      "integrity": "sha512-OYWlK0j+roh+eyaMROlNbS5cd5R25Y+IUpdl7cNdB8HNrkgwQzIS7L9MegxOiWNBj9dQhA/yAxiMwCC5mwNoBw==",
      "dev": true
    },
+    "node_modules/keycode": {
+      "version": "2.2.1",
+      "resolved": "https://registry.npmmirror.com/keycode/-/keycode-2.2.1.tgz",
+      "integrity": "sha512-Rdgz9Hl9Iv4QKi8b0OlCRQEzp4AgVxyCtz5S/+VIHezDmrDhkp2N2TqBWOLz0/gbeREXOOiI9/4b8BY9uw2vFg=="
+    },
    "node_modules/ko-sleep": {
      "version": "1.1.4",
      "resolved": "https://registry.npmmirror.com/ko-sleep/-/ko-sleep-1.1.4.tgz",
@@ -2999,6 +3113,16 @@
        "node": ">=10"
      }
    },
+    "node_modules/m3u8-parser": {
+      "version": "4.7.1",
+      "resolved": "https://registry.npmmirror.com/m3u8-parser/-/m3u8-parser-4.7.1.tgz",
+      "integrity": "sha512-pbrQwiMiq+MmI9bl7UjtPT3AK603PV9bogNlr83uC+X9IoxqL5E4k7kU7fMQ0dpRgxgeSMygqUa0IMLQNXLBNA==",
+      "dependencies": {
+        "@babel/runtime": "^7.12.5",
+        "@videojs/vhs-utils": "^3.0.5",
+        "global": "^4.4.0"
+      }
+    },
    "node_modules/magic-string": {
      "version": "0.25.9",
      "resolved": "https://registry.npmmirror.com/magic-string/-/magic-string-0.25.9.tgz",
@@ -3071,6 +3195,14 @@
        "node": ">= 0.6"
      }
    },
+    "node_modules/min-document": {
+      "version": "2.19.0",
+      "resolved": "https://registry.npmmirror.com/min-document/-/min-document-2.19.0.tgz",
+      "integrity": "sha512-9Wy1B3m3f66bPPmU5hdA4DR4PB2OfDU/+GS3yAB7IQozE3tqXaVv2zOjgla7MEGSRv95+ILmOuvhLkOK6wJtCQ==",
+      "dependencies": {
+        "dom-walk": "^0.1.0"
+      }
+    },
    "node_modules/minimatch": {
      "version": "3.1.2",
      "resolved": "https://registry.npmmirror.com/minimatch/-/minimatch-3.1.2.tgz",
@@ -3112,12 +3244,42 @@
        "pkg-types": "^0.3.3"
      }
    },
+    "node_modules/mpd-parser": {
+      "version": "0.21.1",
+      "resolved": "https://registry.npmmirror.com/mpd-parser/-/mpd-parser-0.21.1.tgz",
+      "integrity": "sha512-BxlSXWbKE1n7eyEPBnTEkrzhS3PdmkkKdM1pgKbPnPOH0WFZIc0sPOWi7m0Uo3Wd2a4Or8Qf4ZbS7+ASqQ49fw==",
+      "dependencies": {
+        "@babel/runtime": "^7.12.5",
+        "@videojs/vhs-utils": "^3.0.5",
+        "@xmldom/xmldom": "^0.7.2",
+        "global": "^4.4.0"
+      },
+      "bin": {
+        "mpd-to-m3u8-json": "bin/parse.js"
+      }
+    },
    "node_modules/ms": {
      "version": "2.1.2",
      "resolved": "https://registry.npmmirror.com/ms/-/ms-2.1.2.tgz",
      "integrity": "sha512-sGkPx+VjMtmA6MX27oA4FBFELFCZZ4S4XqeGOXCv68tT+jb3vk/RyaKWP0PTKyWtmLSM0b+adUTEvbs1PEaH2w==",
      "dev": true
    },
+    "node_modules/mux.js": {
+      "version": "6.0.1",
+      "resolved": "https://registry.npmmirror.com/mux.js/-/mux.js-6.0.1.tgz",
+      "integrity": "sha512-22CHb59rH8pWGcPGW5Og7JngJ9s+z4XuSlYvnxhLuc58cA1WqGDQPzuG8I+sPm1/p0CdgpzVTaKW408k5DNn8w==",
+      "dependencies": {
+        "@babel/runtime": "^7.11.2",
+        "global": "^4.4.0"
+      },
+      "bin": {
+        "muxjs-transmux": "bin/transmux.js"
+      },
+      "engines": {
+        "node": ">=8",
+        "npm": ">=5"
+      }
+    },
    "node_modules/mz": {
      "version": "2.7.0",
      "resolved": "https://registry.npmmirror.com/mz/-/mz-2.7.0.tgz",
@@ -3474,6 +3636,17 @@
        }
      }
    },
+    "node_modules/pkcs7": {
+      "version": "1.0.4",
+      "resolved": "https://registry.npmmirror.com/pkcs7/-/pkcs7-1.0.4.tgz",
+      "integrity": "sha512-afRERtHn54AlwaF2/+LFszyAANTCggGilmcmILUzEjvs3XgFZT+xE6+QWQcAGmu4xajy+Xtj7acLOPdx5/eXWQ==",
+      "dependencies": {
+        "@babel/runtime": "^7.5.5"
+      },
+      "bin": {
+        "pkcs7": "bin/cli.js"
+      }
+    },
    "node_modules/pkg-types": {
      "version": "0.3.3",
      "resolved": "https://registry.npmmirror.com/pkg-types/-/pkg-types-0.3.3.tgz",
@@ -3526,6 +3699,14 @@
        "node": ">= 0.8.0"
      }
    },
+    "node_modules/process": {
+      "version": "0.11.10",
+      "resolved": "https://registry.npmmirror.com/process/-/process-0.11.10.tgz",
+      "integrity": "sha512-cdGef/drWFoydD1JsMzuFf8100nZl+GT+yacc2bEced5f9Rjk4z+WtFUTBu9PhOi9j/jfmBPu0mMEY4wIdAF8A==",
+      "engines": {
+        "node": ">= 0.6.0"
+      }
+    },
    "node_modules/process-nextick-args": {
      "version": "2.0.1",
      "resolved": "https://registry.npmmirror.com/process-nextick-args/-/process-nextick-args-2.0.1.tgz",
@@ -3650,6 +3831,11 @@
        "node": ">=8.10.0"
      }
    },
+    "node_modules/regenerator-runtime": {
+      "version": "0.13.9",
+      "resolved": "https://registry.npmmirror.com/regenerator-runtime/-/regenerator-runtime-0.13.9.tgz",
+      "integrity": "sha512-p3VT+cOEgxFsRRA9X4lkI1E+k2/CtnKtU4gcxyaCUreilL/vqI6CdZ3wxVUx3UOUg+gnUOQQcRI7BmSI656MYA=="
+    },
    "node_modules/regexpp": {
      "version": "3.2.0",
      "resolved": "https://registry.npmmirror.com/regexpp/-/regexpp-3.2.0.tgz",
@@ -3728,12 +3914,28 @@
        "queue-microtask": "^1.2.2"
      }
    },
+    "node_modules/rust-result": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmmirror.com/rust-result/-/rust-result-1.0.0.tgz",
+      "integrity": "sha512-6cJzSBU+J/RJCF063onnQf0cDUOHs9uZI1oroSGnHOph+CQTIJ5Pp2hK5kEQq1+7yE/EEWfulSNXAQ2jikPthA==",
+      "dependencies": {
+        "individual": "^2.0.0"
+      }
+    },
    "node_modules/safe-buffer": {
      "version": "5.1.2",
      "resolved": "https://registry.npmmirror.com/safe-buffer/-/safe-buffer-5.1.2.tgz",
      "integrity": "sha512-Gd2UZBJDkXlY7GbJxfsE8/nvKkUEU1G38c1siN6QP6a9PT9MmHB8GnpscSmMJSoF8LOIrt8ud/wPtojys4G6+g==",
      "dev": true
    },
+    "node_modules/safe-json-parse": {
+      "version": "4.0.0",
+      "resolved": "https://registry.npmmirror.com/safe-json-parse/-/safe-json-parse-4.0.0.tgz",
+      "integrity": "sha512-RjZPPHugjK0TOzFrLZ8inw44s9bKox99/0AZW9o/BEQVrJfhI+fIHMErnPyRa89/yRXUUr93q+tiN6zhoVV4wQ==",
+      "dependencies": {
+        "rust-result": "^1.0.0"
+      }
+    },
    "node_modules/safer-buffer": {
      "version": "2.1.2",
      "resolved": "https://registry.npmmirror.com/safer-buffer/-/safer-buffer-2.1.2.tgz",
@@ -4300,6 +4502,11 @@
        "punycode": "^2.1.0"
      }
    },
+    "node_modules/url-toolkit": {
+      "version": "2.2.5",
+      "resolved": "https://registry.npmmirror.com/url-toolkit/-/url-toolkit-2.2.5.tgz",
+      "integrity": "sha512-mtN6xk+Nac+oyJ/PrI7tzfmomRVNFIWKUbG8jdYFt52hxbiReFAXIjYskvu64/dvuW71IcB7lV8l0HvZMac6Jg=="
+    },
    "node_modules/urllib": {
      "version": "2.38.1",
      "resolved": "https://registry.npmmirror.com/urllib/-/urllib-2.38.1.tgz",
@@ -4369,6 +4576,39 @@
      "integrity": "sha512-l8lCEmLcLYZh4nbunNZvQCJc5pv7+RCwa8q/LdUx8u7lsWvPDKmpodJAJNwkAhJC//dFY48KuIEmjtd4RViDrA==",
      "dev": true
    },
+    "node_modules/video.js": {
+      "version": "7.20.2",
+      "resolved": "https://registry.npmmirror.com/video.js/-/video.js-7.20.2.tgz",
+      "integrity": "sha512-hdvAHKAyaL6bCDkeu0pPtFYKi1EDaOUovm7FN1xqBDolUxgH8FKy1WIgTS+Ouuaw7R54SCTcSeXjZEizhy9ouQ==",
+      "dependencies": {
+        "@babel/runtime": "^7.12.5",
+        "@videojs/http-streaming": "2.14.2",
+        "@videojs/vhs-utils": "^3.0.4",
+        "@videojs/xhr": "2.6.0",
+        "aes-decrypter": "3.1.3",
+        "global": "^4.4.0",
+        "keycode": "^2.2.0",
+        "m3u8-parser": "4.7.1",
+        "mpd-parser": "0.21.1",
+        "mux.js": "6.0.1",
+        "safe-json-parse": "4.0.0",
+        "videojs-font": "3.2.0",
+        "videojs-vtt.js": "^0.15.3"
+      }
+    },
+    "node_modules/videojs-font": {
+      "version": "3.2.0",
+      "resolved": "https://registry.npmmirror.com/videojs-font/-/videojs-font-3.2.0.tgz",
+      "integrity": "sha512-g8vHMKK2/JGorSfqAZQUmYYNnXmfec4MLhwtEFS+mMs2IDY398GLysy6BH6K+aS1KMNu/xWZ8Sue/X/mdQPliA=="
+    },
+    "node_modules/videojs-vtt.js": {
+      "version": "0.15.4",
+      "resolved": "https://registry.npmmirror.com/videojs-vtt.js/-/videojs-vtt.js-0.15.4.tgz",
+      "integrity": "sha512-r6IhM325fcLb1D6pgsMkTQT1PpFdUdYZa1iqk7wJEu+QlibBwATPfPc9Bg8Jiym0GE5yP1AG2rMLu+QMVWkYtA==",
+      "dependencies": {
+        "global": "^4.3.1"
+      }
+    },
    "node_modules/vite": {
      "version": "3.0.5",
      "resolved": "https://registry.npmmirror.com/vite/-/vite-3.0.5.tgz",
@@ -4840,6 +5080,14 @@
      "resolved": "https://registry.npmmirror.com/@babel/parser/-/parser-7.18.11.tgz",
      "integrity": "sha512-9JKn5vN+hDt0Hdqn1PiJ2guflwP+B6Ga8qbDuoF0PzzVhrzsKIJo8yGqVk6CmMHiMei9w1C1Bp9IMJSIK+HPIQ=="
    },
+    "@babel/runtime": {
+      "version": "7.18.9",
+      "resolved": "https://registry.npmmirror.com/@babel/runtime/-/runtime-7.18.9.tgz",
+      "integrity": "sha512-lkqXDcvlFT5rvEjiu6+QYO+1GXrEHRo2LOtS7E4GtX5ESIZOgepqsZBVIj6Pv+a6zqsya9VCgiK1KAK4BvJDAw==",
+      "requires": {
+        "regenerator-runtime": "^0.13.4"
+      }
+    },
    "@ctrl/tinycolor": {
      "version": "3.4.1",
      "resolved": "https://registry.npmmirror.com/@ctrl/tinycolor/-/tinycolor-3.4.1.tgz",
@@ -5009,6 +5257,12 @@
      "integrity": "sha512-FGa1F62FT09qcrueBA6qYTrJPVDzah9a+493+o2PCXsesWHIn27G98TsSMs3WPNbZIEj4+VJf6saSFpvD+3Zsw==",
      "dev": true
    },
+    "@types/video.js": {
+      "version": "7.3.45",
+      "resolved": "https://registry.npmmirror.com/@types/video.js/-/video.js-7.3.45.tgz",
+      "integrity": "sha512-el7P2zE6Qf81kMeQORuW+tEuf8dzySariEHVNHGyaGljxrvt8kfy52Np5WbilDiAwOc7pN2b/52VGbPpbm2ICw==",
+      "dev": true
+    },
    "@types/web-bluetooth": {
      "version": "0.0.15",
      "resolved": "https://registry.npmmirror.com/@types/web-bluetooth/-/web-bluetooth-0.0.15.tgz",
@@ -5109,6 +5363,41 @@
        "eslint-visitor-keys": "^3.3.0"
      }
    },
+    "@videojs/http-streaming": {
+      "version": "2.14.2",
+      "resolved": "https://registry.npmmirror.com/@videojs/http-streaming/-/http-streaming-2.14.2.tgz",
+      "integrity": "sha512-K1raSfO/pq5r8iUas3OSYni0kXOj91n8ealIpV02khghzGv9LQ6O3YUqYd/eAhJ1HIrmZWOnrYpK/P+mhUExXQ==",
+      "requires": {
+        "@babel/runtime": "^7.12.5",
+        "@videojs/vhs-utils": "3.0.5",
+        "aes-decrypter": "3.1.3",
+        "global": "^4.4.0",
+        "m3u8-parser": "4.7.1",
+        "mpd-parser": "0.21.1",
+        "mux.js": "6.0.1",
+        "video.js": "^6 || ^7"
+      }
+    },
+    "@videojs/vhs-utils": {
+      "version": "3.0.5",
+      "resolved": "https://registry.npmmirror.com/@videojs/vhs-utils/-/vhs-utils-3.0.5.tgz",
+      "integrity": "sha512-PKVgdo8/GReqdx512F+ombhS+Bzogiofy1LgAj4tN8PfdBx3HSS7V5WfJotKTqtOWGwVfSWsrYN/t09/DSryrw==",
+      "requires": {
+        "@babel/runtime": "^7.12.5",
+        "global": "^4.4.0",
+        "url-toolkit": "^2.2.1"
+      }
+    },
+    "@videojs/xhr": {
+      "version": "2.6.0",
+      "resolved": "https://registry.npmmirror.com/@videojs/xhr/-/xhr-2.6.0.tgz",
+      "integrity": "sha512-7J361GiN1tXpm+gd0xz2QWr3xNWBE+rytvo8J3KuggFaLg+U37gZQ2BuPLcnkfGffy2e+ozY70RHC8jt7zjA6Q==",
+      "requires": {
+        "@babel/runtime": "^7.5.5",
+        "global": "~4.4.0",
+        "is-function": "^1.0.1"
+      }
+    },
    "@vitejs/plugin-vue": {
      "version": "3.0.1",
      "resolved": "https://registry.npmmirror.com/@vitejs/plugin-vue/-/plugin-vue-3.0.1.tgz",
@@ -5339,6 +5628,11 @@
        }
      }
    },
+    "@xmldom/xmldom": {
+      "version": "0.7.5",
+      "resolved": "https://registry.npmmirror.com/@xmldom/xmldom/-/xmldom-0.7.5.tgz",
+      "integrity": "sha512-V3BIhmY36fXZ1OtVcI9W+FxQqxVLsPKcNjWigIaa81dLC9IolJl5Mt4Cvhmr0flUnjSpTdrbMTSbXqYqV5dT6A=="
+    },
    "acorn": {
      "version": "8.8.0",
      "resolved": "https://registry.npmmirror.com/acorn/-/acorn-8.8.0.tgz",
@@ -5364,6 +5658,17 @@
      "integrity": "sha512-tNEZYz5G/zYunxFm7sfhAxkXEuLj3K6BKwv6ZURlsF6yiUQ65z0Q2wZW9L5cPUl9ocofGvXOdFYbFHp0+6MOig==",
      "dev": true
    },
+    "aes-decrypter": {
+      "version": "3.1.3",
+      "resolved": "https://registry.npmmirror.com/aes-decrypter/-/aes-decrypter-3.1.3.tgz",
+      "integrity": "sha512-VkG9g4BbhMBy+N5/XodDeV6F02chEk9IpgRTq/0bS80y4dzy79VH2Gtms02VXomf3HmyRe3yyJYkJ990ns+d6A==",
+      "requires": {
+        "@babel/runtime": "^7.12.5",
+        "@videojs/vhs-utils": "^3.0.5",
+        "global": "^4.4.0",
+        "pkcs7": "^1.0.4"
+      }
+    },
    "agent-base": {
      "version": "6.0.2",
      "resolved": "https://registry.npmmirror.com/agent-base/-/agent-base-6.0.2.tgz",
@@ -5735,9 +6040,9 @@
      "dev": true
    },
    "dayjs": {
-      "version": "1.11.4",
-      "resolved": "https://registry.npmmirror.com/dayjs/-/dayjs-1.11.4.tgz",
-      "integrity": "sha512-Zj/lPM5hOvQ1Bf7uAvewDaUcsJoI6JmNqmHhHl3nyumwe0XHwt8sWdOVAPACJzCebL8gQCi+K49w7iKWnGwX9g=="
+      "version": "1.11.5",
+      "resolved": "https://registry.npmmirror.com/dayjs/-/dayjs-1.11.5.tgz",
+      "integrity": "sha512-CAdX5Q3YW3Gclyo5Vpqkgpj8fSdLQcRuzfX6mC6Phy0nfJ0eGYOeS7m4mt2plDWLAtA4TqTakvbboHvUxfe4iA=="
    },
    "debug": {
      "version": "4.3.4",
@@ -5830,6 +6135,11 @@
        "esutils": "^2.0.2"
      }
    },
+    "dom-walk": {
+      "version": "0.1.2",
+      "resolved": "https://registry.npmmirror.com/dom-walk/-/dom-walk-0.1.2.tgz",
+      "integrity": "sha512-6QvTW9mrGeIegrFXdtQi9pk7O/nSK6lSdXW2eqUspN5LWD7UTji2Fqw5V2YLjBpHEoU9Xl/eUWNpDeZvoyOv2w=="
+    },
    "ee-first": {
      "version": "1.1.1",
      "resolved": "https://registry.npmmirror.com/ee-first/-/ee-first-1.1.1.tgz",
@@ -6597,6 +6907,15 @@
        "is-glob": "^4.0.3"
      }
    },
+    "global": {
+      "version": "4.4.0",
+      "resolved": "https://registry.npmmirror.com/global/-/global-4.4.0.tgz",
+      "integrity": "sha512-wv/LAoHdRE3BeTGz53FAamhGlPLhlssK45usmGFThIi4XqnBmjKQ16u+RNbP7WvigRZDxUsM0J3gcQ5yicaL0w==",
+      "requires": {
+        "min-document": "^2.19.0",
+        "process": "^0.11.10"
+      }
+    },
    "globals": {
      "version": "13.17.0",
      "resolved": "https://registry.npmmirror.com/globals/-/globals-13.17.0.tgz",
@@ -6739,6 +7058,11 @@
      "integrity": "sha512-JmXMZ6wuvDmLiHEml9ykzqO6lwFbof0GG4IkcGaENdCRDDmMVnny7s5HsIgHCbaq0w2MyPhDqkhTUgS2LU2PHA==",
      "dev": true
    },
+    "individual": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmmirror.com/individual/-/individual-2.0.0.tgz",
+      "integrity": "sha512-pWt8hBCqJsUWI/HtcfWod7+N9SgAqyPEaF7JQjwzjn5vGrpg6aQ5qeAFQ7dx//UH4J1O+7xqew+gCeeFt6xN/g=="
+    },
    "inflight": {
      "version": "1.0.6",
      "resolved": "https://registry.npmmirror.com/inflight/-/inflight-1.0.6.tgz",
@@ -6797,6 +7121,11 @@
      "integrity": "sha512-SbKbANkN603Vi4jEZv49LeVJMn4yGwsbzZworEoyEiutsN3nJYdbO36zfhGJ6QEDpOZIFkDtnq5JRxmvl3jsoQ==",
      "dev": true
    },
+    "is-function": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmmirror.com/is-function/-/is-function-1.0.2.tgz",
+      "integrity": "sha512-lw7DUp0aWXYg+CBCN+JKkcE0Q2RayZnSvnZBlwgxHBQhqt5pZNVy4Ri7H9GmmXkdu7LUthszM+Tor1u/2iBcpQ=="
+    },
    "is-glob": {
      "version": "4.0.3",
      "resolved": "https://registry.npmmirror.com/is-glob/-/is-glob-4.0.3.tgz",
@@ -6895,6 +7224,11 @@
      "integrity": "sha512-OYWlK0j+roh+eyaMROlNbS5cd5R25Y+IUpdl7cNdB8HNrkgwQzIS7L9MegxOiWNBj9dQhA/yAxiMwCC5mwNoBw==",
      "dev": true
    },
+    "keycode": {
+      "version": "2.2.1",
+      "resolved": "https://registry.npmmirror.com/keycode/-/keycode-2.2.1.tgz",
+      "integrity": "sha512-Rdgz9Hl9Iv4QKi8b0OlCRQEzp4AgVxyCtz5S/+VIHezDmrDhkp2N2TqBWOLz0/gbeREXOOiI9/4b8BY9uw2vFg=="
+    },
    "ko-sleep": {
      "version": "1.1.4",
      "resolved": "https://registry.npmmirror.com/ko-sleep/-/ko-sleep-1.1.4.tgz",
@@ -6972,6 +7306,16 @@
        "yallist": "^4.0.0"
      }
    },
+    "m3u8-parser": {
+      "version": "4.7.1",
+      "resolved": "https://registry.npmmirror.com/m3u8-parser/-/m3u8-parser-4.7.1.tgz",
+      "integrity": "sha512-pbrQwiMiq+MmI9bl7UjtPT3AK603PV9bogNlr83uC+X9IoxqL5E4k7kU7fMQ0dpRgxgeSMygqUa0IMLQNXLBNA==",
+      "requires": {
+        "@babel/runtime": "^7.12.5",
+        "@videojs/vhs-utils": "^3.0.5",
+        "global": "^4.4.0"
+      }
+    },
    "magic-string": {
      "version": "0.25.9",
      "resolved": "https://registry.npmmirror.com/magic-string/-/magic-string-0.25.9.tgz",
@@ -7026,6 +7370,14 @@
        "mime-db": "1.52.0"
      }
    },
+    "min-document": {
+      "version": "2.19.0",
+      "resolved": "https://registry.npmmirror.com/min-document/-/min-document-2.19.0.tgz",
+      "integrity": "sha512-9Wy1B3m3f66bPPmU5hdA4DR4PB2OfDU/+GS3yAB7IQozE3tqXaVv2zOjgla7MEGSRv95+ILmOuvhLkOK6wJtCQ==",
+      "requires": {
+        "dom-walk": "^0.1.0"
+      }
+    },
    "minimatch": {
      "version": "3.1.2",
      "resolved": "https://registry.npmmirror.com/minimatch/-/minimatch-3.1.2.tgz",
@@ -7061,12 +7413,32 @@
        "pkg-types": "^0.3.3"
      }
    },
+    "mpd-parser": {
+      "version": "0.21.1",
+      "resolved": "https://registry.npmmirror.com/mpd-parser/-/mpd-parser-0.21.1.tgz",
+      "integrity": "sha512-BxlSXWbKE1n7eyEPBnTEkrzhS3PdmkkKdM1pgKbPnPOH0WFZIc0sPOWi7m0Uo3Wd2a4Or8Qf4ZbS7+ASqQ49fw==",
+      "requires": {
+        "@babel/runtime": "^7.12.5",
+        "@videojs/vhs-utils": "^3.0.5",
+        "@xmldom/xmldom": "^0.7.2",
+        "global": "^4.4.0"
+      }
+    },
    "ms": {
      "version": "2.1.2",
      "resolved": "https://registry.npmmirror.com/ms/-/ms-2.1.2.tgz",
      "integrity": "sha512-sGkPx+VjMtmA6MX27oA4FBFELFCZZ4S4XqeGOXCv68tT+jb3vk/RyaKWP0PTKyWtmLSM0b+adUTEvbs1PEaH2w==",
      "dev": true
    },
+    "mux.js": {
+      "version": "6.0.1",
+      "resolved": "https://registry.npmmirror.com/mux.js/-/mux.js-6.0.1.tgz",
+      "integrity": "sha512-22CHb59rH8pWGcPGW5Og7JngJ9s+z4XuSlYvnxhLuc58cA1WqGDQPzuG8I+sPm1/p0CdgpzVTaKW408k5DNn8w==",
+      "requires": {
+        "@babel/runtime": "^7.11.2",
+        "global": "^4.4.0"
+      }
+    },
    "mz": {
      "version": "2.7.0",
      "resolved": "https://registry.npmmirror.com/mz/-/mz-2.7.0.tgz",
@@ -7329,6 +7701,14 @@
        }
      }
    },
+    "pkcs7": {
+      "version": "1.0.4",
+      "resolved": "https://registry.npmmirror.com/pkcs7/-/pkcs7-1.0.4.tgz",
+      "integrity": "sha512-afRERtHn54AlwaF2/+LFszyAANTCggGilmcmILUzEjvs3XgFZT+xE6+QWQcAGmu4xajy+Xtj7acLOPdx5/eXWQ==",
+      "requires": {
+        "@babel/runtime": "^7.5.5"
+      }
+    },
    "pkg-types": {
      "version": "0.3.3",
      "resolved": "https://registry.npmmirror.com/pkg-types/-/pkg-types-0.3.3.tgz",
@@ -7372,6 +7752,11 @@
      "integrity": "sha512-vkcDPrRZo1QZLbn5RLGPpg/WmIQ65qoWWhcGKf/b5eplkkarX0m9z8ppCat4mlOqUsWpyNuYgO3VRyrYHSzX5g==",
      "dev": true
    },
+    "process": {
+      "version": "0.11.10",
+      "resolved": "https://registry.npmmirror.com/process/-/process-0.11.10.tgz",
+      "integrity": "sha512-cdGef/drWFoydD1JsMzuFf8100nZl+GT+yacc2bEced5f9Rjk4z+WtFUTBu9PhOi9j/jfmBPu0mMEY4wIdAF8A=="
+    },
    "process-nextick-args": {
      "version": "2.0.1",
      "resolved": "https://registry.npmmirror.com/process-nextick-args/-/process-nextick-args-2.0.1.tgz",
@@ -7483,6 +7868,11 @@
        "picomatch": "^2.2.1"
      }
    },
+    "regenerator-runtime": {
+      "version": "0.13.9",
+      "resolved": "https://registry.npmmirror.com/regenerator-runtime/-/regenerator-runtime-0.13.9.tgz",
+      "integrity": "sha512-p3VT+cOEgxFsRRA9X4lkI1E+k2/CtnKtU4gcxyaCUreilL/vqI6CdZ3wxVUx3UOUg+gnUOQQcRI7BmSI656MYA=="
+    },
    "regexpp": {
      "version": "3.2.0",
      "resolved": "https://registry.npmmirror.com/regexpp/-/regexpp-3.2.0.tgz",
@@ -7539,12 +7929,28 @@
        "queue-microtask": "^1.2.2"
      }
    },
+    "rust-result": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmmirror.com/rust-result/-/rust-result-1.0.0.tgz",
+      "integrity": "sha512-6cJzSBU+J/RJCF063onnQf0cDUOHs9uZI1oroSGnHOph+CQTIJ5Pp2hK5kEQq1+7yE/EEWfulSNXAQ2jikPthA==",
+      "requires": {
+        "individual": "^2.0.0"
+      }
+    },
    "safe-buffer": {
      "version": "5.1.2",
      "resolved": "https://registry.npmmirror.com/safe-buffer/-/safe-buffer-5.1.2.tgz",
      "integrity": "sha512-Gd2UZBJDkXlY7GbJxfsE8/nvKkUEU1G38c1siN6QP6a9PT9MmHB8GnpscSmMJSoF8LOIrt8ud/wPtojys4G6+g==",
      "dev": true
    },
+    "safe-json-parse": {
+      "version": "4.0.0",
+      "resolved": "https://registry.npmmirror.com/safe-json-parse/-/safe-json-parse-4.0.0.tgz",
+      "integrity": "sha512-RjZPPHugjK0TOzFrLZ8inw44s9bKox99/0AZW9o/BEQVrJfhI+fIHMErnPyRa89/yRXUUr93q+tiN6zhoVV4wQ==",
+      "requires": {
+        "rust-result": "^1.0.0"
+      }
+    },
    "safer-buffer": {
      "version": "2.1.2",
      "resolved": "https://registry.npmmirror.com/safer-buffer/-/safer-buffer-2.1.2.tgz",
@@ -7964,6 +8370,11 @@
        "punycode": "^2.1.0"
      }
    },
+    "url-toolkit": {
+      "version": "2.2.5",
+      "resolved": "https://registry.npmmirror.com/url-toolkit/-/url-toolkit-2.2.5.tgz",
+      "integrity": "sha512-mtN6xk+Nac+oyJ/PrI7tzfmomRVNFIWKUbG8jdYFt52hxbiReFAXIjYskvu64/dvuW71IcB7lV8l0HvZMac6Jg=="
+    },
    "urllib": {
      "version": "2.38.1",
      "resolved": "https://registry.npmmirror.com/urllib/-/urllib-2.38.1.tgz",
@@ -8029,6 +8440,39 @@
      "integrity": "sha512-l8lCEmLcLYZh4nbunNZvQCJc5pv7+RCwa8q/LdUx8u7lsWvPDKmpodJAJNwkAhJC//dFY48KuIEmjtd4RViDrA==",
      "dev": true
    },
+    "video.js": {
+      "version": "7.20.2",
+      "resolved": "https://registry.npmmirror.com/video.js/-/video.js-7.20.2.tgz",
+      "integrity": "sha512-hdvAHKAyaL6bCDkeu0pPtFYKi1EDaOUovm7FN1xqBDolUxgH8FKy1WIgTS+Ouuaw7R54SCTcSeXjZEizhy9ouQ==",
+      "requires": {
+        "@babel/runtime": "^7.12.5",
+        "@videojs/http-streaming": "2.14.2",
+        "@videojs/vhs-utils": "^3.0.4",
+        "@videojs/xhr": "2.6.0",
+        "aes-decrypter": "3.1.3",
+        "global": "^4.4.0",
+        "keycode": "^2.2.0",
+        "m3u8-parser": "4.7.1",
+        "mpd-parser": "0.21.1",
+        "mux.js": "6.0.1",
+        "safe-json-parse": "4.0.0",
+        "videojs-font": "3.2.0",
+        "videojs-vtt.js": "^0.15.3"
+      }
+    },
+    "videojs-font": {
+      "version": "3.2.0",
+      "resolved": "https://registry.npmmirror.com/videojs-font/-/videojs-font-3.2.0.tgz",
+      "integrity": "sha512-g8vHMKK2/JGorSfqAZQUmYYNnXmfec4MLhwtEFS+mMs2IDY398GLysy6BH6K+aS1KMNu/xWZ8Sue/X/mdQPliA=="
+    },
+    "videojs-vtt.js": {
+      "version": "0.15.4",
+      "resolved": "https://registry.npmmirror.com/videojs-vtt.js/-/videojs-vtt.js-0.15.4.tgz",
+      "integrity": "sha512-r6IhM325fcLb1D6pgsMkTQT1PpFdUdYZa1iqk7wJEu+QlibBwATPfPc9Bg8Jiym0GE5yP1AG2rMLu+QMVWkYtA==",
+      "requires": {
+        "global": "^4.3.1"
+      }
+    },
    "vite": {
      "version": "3.0.5",
      "resolved": "https://registry.npmmirror.com/vite/-/vite-3.0.5.tgz",

--- a/package.json
+++ b/package.json
@@ -17,10 +17,12 @@
    "@vueuse/core": "^9.1.0",
    "axios": "^0.27.2",
    "blueimp-md5": "^2.19.0",
+    "dayjs": "^1.11.5",
    "element-plus": "^2.2.12",
    "lodash-es": "^4.17.21",
    "pinia": "^2.0.17",
    "qs": "^6.11.0",
+    "video.js": "^7.20.2",
    "vue": "^3.2.37",
    "vue-router": "^4.1.3"
  },
@@ -29,6 +31,7 @@
    "@types/blueimp-md5": "^2.18.0",
    "@types/node": "^16.11.45",
    "@types/qs": "^6.9.7",
+    "@types/video.js": "^7.3.45",
    "@vitejs/plugin-vue": "^3.0.1",
    "@vue/eslint-config-typescript": "^11.0.0",
    "@vue/tsconfig": "^0.1.3",

--- a/src/components/base/AppUpload.vue
+++ b/src/components/base/AppUpload.vue
@@ -12,7 +12,7 @@ interface Props {
 }

 const props = withDefaults(defineProps<Props>(), {
-  prefix: 'upload/saas-learn/'
+  prefix: 'upload/saas-lab/'
 })

 const emit = defineEmits(['update:modelValue', 'success'])
@@ -117,7 +117,7 @@ const handlePreview: UploadProps['onPreview'] = uploadFile => {
          <el-icon><Plus /></el-icon>
        </template>
        <template v-else>
-          <el-button round>本地文件</el-button>
+          <el-button type="primary" plain round>本地文件</el-button>
        </template>
      </template>
      <div class="avatar-uploader" v-else>

--- a/src/components/base/AppVideoPlayer.vue
+++ b/src/components/base/AppVideoPlayer.vue
+<script lang="ts">
+const DEFAULT_OPTIONS = {
+  controls: true,
+  autoplay: false,
+  controlBar: {
+    pictureInPictureToggle: false
+  },
+  // fluid: true,
+  responsive: true
+  // playbackRates: [0.5, 1, 1.5, 2]
+}
+const DEFAULT_EVENTS = [
+  'abort',
+  'canplay',
+  'canplaythrough',
+  'durationchange',
+  'emptied',
+  'ended',
+  'error',
+  'loadeddata',
+  'loadedmetadata',
+  'pause',
+  'play',
+  'playing',
+  'progress',
+  'ratechange',
+  'resize',
+  'seeked',
+  'seeking',
+  'stalled',
+  'suspend',
+  'timeupdate',
+  'volumechange',
+  'waiting'
+]
+</script>
+
+<script setup lang="ts">
+import videojs from 'video.js'
+import type { VideoJsPlayerOptions, VideoJsPlayer } from 'video.js'
+import 'video.js/dist/video-js.css'
+
+interface Props {
+  src?: string | { src: string; type?: string }
+  options?: VideoJsPlayerOptions
+}
+const props = defineProps<Props>()
+const emit = defineEmits(['ready', ...DEFAULT_EVENTS])
+
+let player = $ref<VideoJsPlayer | null>()
+const videoRef = $ref<HTMLVideoElement>()
+
+const videoOptions = $computed<VideoJsPlayerOptions>(() => {
+  return Object.assign({}, DEFAULT_OPTIONS, props.options)
+})
+
+watch(
+  () => props.src,
+  src => {
+    src && changeSrc(src)
+  },
+  { deep: true, immediate: true }
+)
+
+// 初始化播放器
+function initPlayer() {
+  if (!videoRef) return
+  if (player) {
+    player.dispose()
+    player = null
+  }
+  player = videojs(videoRef, videoOptions, function onPlayerReady() {
+    props.src && changeSrc(props.src)
+    // 注册事件
+    DEFAULT_EVENTS.forEach(eventName => {
+      this.on(eventName, (...arg) => {
+        // console.log(eventName, ...arg)
+        emit(eventName, ...arg)
+      })
+    })
+    emit('ready', this)
+  })
+  return player
+}
+function changeSrc(src: string | { src: string; type?: string }) {
+  if (!player || !src) return
+
+  // if (!player.paused()) {
+  //   console.log(2)
+  //   player.pause()
+  // }
+  player.src(src)
+  // player.load()
+  // player.play()
+}
+onMounted(() => {
+  initPlayer()
+})
+onUnmounted(() => {
+  player && player.dispose()
+})
+</script>
+
+<template>
+  <video class="video-js vjs-default-skin vjs-big-play-centered" ref="videoRef"></video>
+</template>
+
+<style>
+.video-js {
+  font-size: 12px;
+}
+</style>
--- a/src/modules/student/lab/api.ts
+++ b/src/modules/student/lab/api.ts
@@ -36,3 +36,23 @@ export function addExperimentDiscuss(data: { experiment_id: string; title: strin
 export function addExperimentDiscussComment(data: { discussion_id: string; content: string }) {
  return httpRequest.post('/api/student/v1/student/experiment-topic/comment', data)
 }
+
+// 获取实验记录
+export function getExperimentRecord(params: { experiment_id: string }) {
+  return httpRequest.get('/api/student/v1/student/experiment-record/detail', { params })
+}
+
+// 截图
+export function uploadExperimentPicture(data: { experiment_id: string; pictures: string }) {
+  return httpRequest.post('/api/student/v1/student/experiment-record/upload-pictures', data)
+}
+
+// 上传实验报告
+export function uploadExperimentReport(data: { experiment_id: string; file: string }) {
+  return httpRequest.post('/api/student/v1/student/experiment-record/upload-report', data)
+}
+
+// 提交实验记录
+export function submitExperimentRecord(data: { experiment_id: string }) {
+  return httpRequest.post('/api/student/v1/student/experiment-record/submit', data)
+}
--- a/src/modules/student/lab/components/Discuss.vue
+++ b/src/modules/student/lab/components/Discuss.vue
@@ -10,7 +10,7 @@ interface Props {
  experiment_id?: string
 }
 const props = defineProps<Props>()
-const params = reactive({ tag: 3, page: 0, 'per-page': 10 })
+const params = reactive({ tag: 1, page: 0, 'per-page': 10 })
 let list = $ref<ExperimentDiscussType[]>([])
 let hasMore = $ref(false)
 let isLoading = $ref(false)
@@ -26,9 +26,7 @@ function fetchInfo() {
      isLoading = false
    })
 }
-onMounted(() => {
-  fetchInfo()
-})
+watch(() => props.experiment_id, handleRefetch, { immediate: true })

 const isEmpty = $computed(() => {
  return !props.experiment_id || !list.length

--- a/src/modules/student/lab/components/ReportDialog.vue
+++ b/src/modules/student/lab/components/ReportDialog.vue
 <script setup lang="ts">
 import type { FormInstance, FormRules } from 'element-plus'
-// import { ElMessage } from 'element-plus'
+import type { ExperimentRecord } from '../types'
+import { ElMessage } from 'element-plus'
+import dayjs from 'dayjs'
+import { uploadExperimentReport } from '../api'

 interface Props {
-  data?: any
+  experiment_id: string
 }

 const props = defineProps<Props>()

-defineEmits<{
+const detail = $ref<ExperimentRecord>(inject('detail'))
+
+const emit = defineEmits<{
  (e: 'update'): void
  (e: 'update:modelValue', visible: boolean): void
 }>()

 const formRef = $ref<FormInstance>()
-const form = reactive({ files: [] })
+const form = reactive<any>({ files: [] })
 watchEffect(() => {
-  Object.assign(form, props.data)
+  if (detail?.file) {
+    form.files = [detail.file]
+  }
 })
 const rules = ref<FormRules>({
-  files: [{ required: true, message: '请输入话题描述', trigger: 'blur' }]
+  files: [{ required: true, message: '请上传实验报告文件', trigger: 'blur' }]
 })
 // 提交
 function handleSubmit() {
@@ -27,16 +34,25 @@ function handleSubmit() {
 }
 // 修改
 const update = () => {
-  // submitSuggestion(form).then(() => {
-  //   ElMessage({ message: '提交成功', type: 'success' })
-  //   emit('update')
-  //   formRef?.resetFields()
-  // })
+  const [file] = form.files
+  uploadExperimentReport({
+    experiment_id: props.experiment_id,
+    file: JSON.stringify({ name: file.name, url: file.url, upload_time: dayjs().format('YYYY-MM-DD HH:mm:ss') })
+  }).then(() => {
+    ElMessage({ message: '上传成功', type: 'success' })
+    emit('update')
+    emit('update:modelValue', false)
+  })
 }
 </script>

 <template>
-  <el-dialog title="上传实验报告" :close-on-click-modal="false" width="600px">
+  <el-dialog
+    title="上传实验报告"
+    :close-on-click-modal="false"
+    width="600px"
+    @update:modelValue="$emit('update:modelValue')"
+  >
    <el-form ref="formRef" :model="form" :rules="rules">
      <el-form-item label="实验报告文件" prop="files">
        <AppUpload v-model="form.files">

--- a/src/modules/student/lab/components/Result.vue
+++ b/src/modules/student/lab/components/Result.vue
 <script setup lang="ts">
+import type { ExperimentRecord } from '../types'
 interface Props {
  experiment_id?: string
 }
-defineProps<Props>()
+const props = defineProps<Props>()
+
+const detail = $ref<ExperimentRecord>(inject('detail'))
+const isEmpty = $computed(() => {
+  return !props.experiment_id || !detail
+})
 </script>

 <template>
-  <div>result</div>
+  <el-empty description="暂无数据" v-if="isEmpty" />
+  <template v-else>
+    <h2>我的成绩</h2>
+    <h2>实验过程</h2>
+    <ul class="picture-list">
+      <li v-for="item in detail.pictures" :key="item.url">
+        <img :src="item.url" />
+        <p>截图时间：{{ item.upload_time }}</p>
+      </li>
+    </ul>
+  </template>
 </template>

-<style lang="scss" scoped></style>
+<style lang="scss" scoped>
+.picture-list {
+  li {
+    position: relative;
+    height: 200px;
+    margin: 20px 0;
+    img {
+      width: 100%;
+      height: 100%;
+      object-fit: cover;
+    }
+    p {
+      position: absolute;
+      left: 0;
+      right: 0;
+      bottom: 0;
+      padding: 0 10px;
+      font-size: 14px;
+      color: #fff;
+      line-height: 30px;
+      text-align: right;
+      background-color: rgba(0, 0, 0, 0.5);
+    }
+  }
+}
+</style>
--- a/src/modules/student/lab/components/VideoItem.vue
+++ b/src/modules/student/lab/components/VideoItem.vue
 <script setup lang="ts">
 import type { ExperimentVideoType, PlayInfo } from '../types'
+import AppVideoPlayer from '@/components/base/AppVideoPlayer.vue'
 import { getExperimentVideoPlayInfo } from '../api'
 interface Props {
  data: ExperimentVideoType
@@ -11,7 +12,9 @@ function fetchInfo() {
    playList = res.data.play_info_list
  })
 }
-console.log(playList)
+const playUrl = $computed(() => {
+  return playList[0]?.PlayURL || ''
+})
 onMounted(() => {
  fetchInfo()
 })
@@ -19,16 +22,22 @@ onMounted(() => {
 <template>
  <div class="video-item">
    <h2>{{ data.name }}</h2>
-    <img :src="data.cover" />
+    <!-- <img :src="data.cover" /> -->
+    <AppVideoPlayer
+      :options="{ sources: [{ src: playUrl, type: 'application/x-mpegURL' }] }"
+      style="width: 100%"
+      v-if="playUrl"
+    ></AppVideoPlayer>
  </div>
 </template>

 <style lang="scss" scoped>
 .video-item {
  h2 {
-    font-size: 16px;
+    font-size: 14px;
+    font-weight: 500;
    color: #333;
-    margin-bottom: 10px;
+    padding: 10px 0;
    text-align: center;
  }
  img {

--- a/src/modules/student/lab/types.ts
+++ b/src/modules/student/lab/types.ts
@@ -83,3 +83,45 @@ export interface UserType {
  real_name: string
  username: string
 }
+
+export interface ExperimentRecord {
+  experiment_id: string
+  student_id: string
+  commit_time: string
+  pictures: ExperimentRecordFile[]
+  file: ExperimentRecordFile
+  checker_id: string
+  check_time: string
+  score_details: string
+  score: string
+  status: 0 | 1 | 2
+  checker_user: UserType
+  experiment: {
+    id: string
+    name: string
+    score: number
+    length: number
+  }
+  course: CourseType
+  student: ExperimentRecordStudent
+}
+export interface ExperimentRecordFile {
+  url: string
+  name: string
+  upload_time: string
+}
+
+export interface ExperimentRecordStudent {
+  id: string
+  name: string
+  specialty: {
+    id: string
+    name: string
+  }
+  classes: [
+    {
+      id: string
+      name: string
+    }
+  ]
+}
--- a/src/modules/student/lab/views/Index.vue
+++ b/src/modules/student/lab/views/Index.vue
 <script setup lang="ts">
-import type { CourseType } from '../types'
+import type { CourseType, ExperimentRecord } from '../types'
 import { HomeFilled, Select, UploadFilled, FullScreen } from '@element-plus/icons-vue'
 import { useGetCourseList } from '../composables/useGetCourseList'
+import { upload } from '@/utils/upload'
+import { getExperimentRecord, uploadExperimentPicture, submitExperimentRecord } from '../api'
+import dayjs from 'dayjs'

 const Book = defineAsyncComponent(() => import('../components/Book.vue'))
 const Video = defineAsyncComponent(() => import('../components/Video.vue'))
@@ -20,6 +23,19 @@ const { courses } = useGetCourseList()
 const experimentList = $computed(() => {
  return form.course?.experiments || []
 })
+let detail = $ref<ExperimentRecord>()
+provide('detail', $$(detail))
+
+function fetchInfo() {
+  if (!form.experiment_id) return
+  getExperimentRecord({ experiment_id: form.experiment_id }).then(res => {
+    detail = Array.isArray(res.data.data) ? undefined : res.data.data
+  })
+}
+watchEffect(() => {
+  fetchInfo()
+})
+
 // 右侧
 const LAB_URL = import.meta.env.VITE_LAB_URL
 let iframeKey = $ref(Date.now())
@@ -30,7 +46,13 @@ function handleBackHome() {

 const reportDialogVisible = $ref(false)
 // 是否已经提交
-const submitted = $ref(false)
+const submitted = $computed(() => {
+  return detail ? detail.status !== 0 : false
+})
+// 是否禁用
+const disabled = $computed(() => {
+  return submitted || !form.experiment_id
+})
 const iframeRef = $ref<HTMLIFrameElement>()

 let screenshotLoading = $ref(false)
@@ -48,11 +70,9 @@ function handleCapture() {
 function handleCaptureCallback(event: MessageEvent) {
  const { data } = event
  if (data.action === 'screenshot' && data.timestamp === screenshotTimestamp) {
-    console.log(data)
-    const img = new Image()
-    img.src = data.dataURL
-    document.body.appendChild(img)
-    screenshotLoading = false
+    upload(data.blob).then(url => {
+      uploadPicture(url)
+    })
  }
 }
 onMounted(() => {
@@ -61,6 +81,24 @@ onMounted(() => {
 onUnmounted(() => {
  window.removeEventListener('message', handleCaptureCallback, false)
 })
+
+// 上传截图
+function uploadPicture(url: string) {
+  const pictures = detail?.pictures || []
+  pictures.unshift({ url, name: 'screenshot.png', upload_time: dayjs().format('YYYY-MM-DD HH:mm:ss') })
+  uploadExperimentPicture({ experiment_id: form.experiment_id, pictures: JSON.stringify(pictures) }).then(() => {
+    screenshotLoading = false
+    if (!detail) {
+      fetchInfo()
+    }
+  })
+}
+// 提交实验
+function handleSubmit() {
+  submitExperimentRecord({ experiment_id: form.experiment_id }).then(() => {
+    fetchInfo()
+  })
+}
 </script>

 <template>
@@ -100,14 +138,14 @@ onUnmounted(() => {
            >返回首页</el-button
          >
          <div>
-            <el-button type="primary" :icon="Select" :disabled="submitted">提交</el-button>
-            <el-button type="primary" :icon="UploadFilled" :disabled="submitted" @click="reportDialogVisible = true"
+            <el-button type="primary" :icon="Select" :disabled="disabled" @click="handleSubmit">提交</el-button>
+            <el-button type="primary" :icon="UploadFilled" :disabled="disabled" @click="reportDialogVisible = true"
              >上传报告</el-button
            >
            <el-button
              type="primary"
              :icon="FullScreen"
-              :disabled="submitted"
+              :disabled="disabled"
              :loading="screenshotLoading"
              @click="handleCapture"
              >截图</el-button
@@ -122,7 +160,12 @@ onUnmounted(() => {
    </div>
  </section>
  <!-- 上传报告 -->
-  <ReportDialog v-model="reportDialogVisible" v-if="reportDialogVisible"></ReportDialog>
+  <ReportDialog
+    v-model="reportDialogVisible"
+    :experiment_id="form.experiment_id"
+    @update="fetchInfo"
+    v-if="reportDialogVisible && form.experiment_id"
+  ></ReportDialog>
 </template>

 <style lang="scss" scoped>

--- a/src/utils/upload.ts
+++ b/src/utils/upload.ts
+import md5 from 'blueimp-md5'
+import { getSignature, uploadFile } from '@/api/base'
+
+export async function upload(blob: Blob) {
+  const key = 'upload/saas-lab/' + md5(new Date().getTime() + Math.random().toString(36).slice(-8)) + '.png'
+  const response: any = await getSignature()
+  const params = {
+    key,
+    OSSAccessKeyId: response.accessid,
+    policy: response.policy,
+    signature: response.signature,
+    success_action_status: '200',
+    file: blob,
+    url: `${response.host}/${key}`
+  }
+  await uploadFile(params)
+  return params.url
+}