diff --git a/package-lock.json b/package-lock.json index 9e12ab2..ad5064d 100644 --- a/package-lock.json +++ b/package-lock.json @@ -13,6 +13,7 @@ "sass": "^1.85.1", "swiper": "^11.2.5", "unplugin-auto-import": "^19.1.1", + "video.js": "^8.22.0", "vue": "^3.5.13" }, "devDependencies": { @@ -390,6 +391,17 @@ "@babel/core": "^7.0.0-0" } }, + "node_modules/@babel/runtime": { + "version": "7.26.10", + "resolved": "https://registry.npmmirror.com/@babel/runtime/-/runtime-7.26.10.tgz", + "integrity": "sha512-2WJMeRQPHKSPemqk/awGrAiuFfzBmOIPXKizAsVhWH9YJqLZ0H+HS4c8loHGgW6utJ3E/ejXQUsiGaQy2NZ9Fw==", + "dependencies": { + "regenerator-runtime": "^0.14.0" + }, + "engines": { + "node": ">=6.9.0" + } + }, "node_modules/@babel/template": { "version": "7.26.9", "resolved": "https://registry.npmmirror.com/@babel/template/-/template-7.26.9.tgz", @@ -1818,6 +1830,51 @@ "integrity": "sha512-oh8q2Zc32S6gd/j50GowEjKLoOVOwHP/bWVjKJInBwQqdOYMdPrf1oVlelTlyfFK3CKxL1uahMDAr+vy8T7yMQ==", "devOptional": true }, + "node_modules/@videojs/http-streaming": { + "version": "3.17.0", + "resolved": "https://registry.npmmirror.com/@videojs/http-streaming/-/http-streaming-3.17.0.tgz", + "integrity": "sha512-Ch1P3tvvIEezeZXyK11UfWgp4cWKX4vIhZ30baN/lRinqdbakZ5hiAI3pGjRy3d+q/Epyc8Csz5xMdKNNGYpcw==", + "dependencies": { + "@babel/runtime": "^7.12.5", + "@videojs/vhs-utils": "^4.1.1", + "aes-decrypter": "^4.0.2", + "global": "^4.4.0", + "m3u8-parser": "^7.2.0", + "mpd-parser": "^1.3.1", + "mux.js": "7.1.0", + "video.js": "^7 || ^8" + }, + "engines": { + "node": ">=8", + "npm": ">=5" + }, + "peerDependencies": { + "video.js": "^8.19.0" + } + }, + "node_modules/@videojs/vhs-utils": { + "version": "4.1.1", + "resolved": "https://registry.npmmirror.com/@videojs/vhs-utils/-/vhs-utils-4.1.1.tgz", + "integrity": "sha512-5iLX6sR2ownbv4Mtejw6Ax+naosGvoT9kY+gcuHzANyUZZ+4NpeNdKMUhb6ag0acYej1Y7cmr/F2+4PrggMiVA==", + "dependencies": { + "@babel/runtime": "^7.12.5", + "global": "^4.4.0" + }, + "engines": { + "node": ">=8", + "npm": ">=5" + } + }, + "node_modules/@videojs/xhr": { + "version": "2.7.0", + "resolved": "https://registry.npmmirror.com/@videojs/xhr/-/xhr-2.7.0.tgz", + "integrity": "sha512-giab+EVRanChIupZK7gXjHy90y3nncA2phIOyG3Ne5fvpiMJzvqYwiTOnEVW2S4CoYcuKJkomat7bMXA/UoUZQ==", + "dependencies": { + "@babel/runtime": "^7.5.5", + "global": "~4.4.0", + "is-function": "^1.0.1" + } + }, "node_modules/@vitejs/plugin-vue": { "version": "5.2.1", "resolved": "https://registry.npmmirror.com/@vitejs/plugin-vue/-/plugin-vue-5.2.1.tgz", @@ -2189,6 +2246,14 @@ } } }, + "node_modules/@xmldom/xmldom": { + "version": "0.8.10", + "resolved": "https://registry.npmmirror.com/@xmldom/xmldom/-/xmldom-0.8.10.tgz", + "integrity": "sha512-2WALfTl4xo2SkGCYRt6rDTFfk9R1czmBvUQy12gK2KuRKIpWEhcbbzy8EZXtz/jkRqHX8bFEc6FC1HjX4TUWYw==", + "engines": { + "node": ">=10.0.0" + } + }, "node_modules/acorn": { "version": "8.14.1", "resolved": "https://registry.npmmirror.com/acorn/-/acorn-8.14.1.tgz", @@ -2200,6 +2265,17 @@ "node": ">=0.4.0" } }, + "node_modules/aes-decrypter": { + "version": "4.0.2", + "resolved": "https://registry.npmmirror.com/aes-decrypter/-/aes-decrypter-4.0.2.tgz", + "integrity": "sha512-lc+/9s6iJvuaRe5qDlMTpCFjnwpkeOXp8qP3oiZ5jsj1MRg+SBVUmmICrhxHvc8OELSmc+fEyyxAuppY6hrWzw==", + "dependencies": { + "@babel/runtime": "^7.12.5", + "@videojs/vhs-utils": "^4.1.1", + "global": "^4.4.0", + "pkcs7": "^1.0.4" + } + }, "node_modules/alien-signals": { "version": "1.0.4", "resolved": "https://registry.npmmirror.com/alien-signals/-/alien-signals-1.0.4.tgz", @@ -2631,6 +2707,11 @@ "integrity": "sha512-+HlytyjlPKnIG8XuRG8WvmBP8xs8P71y+SKKS6ZXWoEgLuePxtDoUEiH7WkdePWrQ5JBpE6aoVqfZfJUQkjXwA==", "dev": true }, + "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/eastasianwidth": { "version": "0.2.0", "resolved": "https://registry.npmmirror.com/eastasianwidth/-/eastasianwidth-0.2.0.tgz", @@ -2962,6 +3043,15 @@ "node": ">= 6" } }, + "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": "11.12.0", "resolved": "https://registry.npmmirror.com/globals/-/globals-11.12.0.tgz", @@ -3054,6 +3144,11 @@ "node": ">=8" } }, + "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", @@ -3455,6 +3550,16 @@ "integrity": "sha512-JNAzZcXrCt42VGLuYz0zfAzDfAvJWW6AfYlDBQyDV5DClI2m5sAmK+OIO7s59XfsRsWHp02jAJrRadPRGTt6SQ==", "dev": true }, + "node_modules/m3u8-parser": { + "version": "7.2.0", + "resolved": "https://registry.npmmirror.com/m3u8-parser/-/m3u8-parser-7.2.0.tgz", + "integrity": "sha512-CRatFqpjVtMiMaKXxNvuI3I++vUumIXVVT/JpCpdU/FynV/ceVw1qpPyyBNindL+JlPMSesx+WX1QJaZEJSaMQ==", + "dependencies": { + "@babel/runtime": "^7.12.5", + "@videojs/vhs-utils": "^4.1.1", + "global": "^4.4.0" + } + }, "node_modules/magic-string": { "version": "0.30.17", "resolved": "https://registry.npmmirror.com/magic-string/-/magic-string-0.30.17.tgz", @@ -3491,6 +3596,14 @@ "node": ">=8.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/mini-svg-data-uri": { "version": "1.4.4", "resolved": "https://registry.npmmirror.com/mini-svg-data-uri/-/mini-svg-data-uri-1.4.4.tgz", @@ -3568,6 +3681,20 @@ "random": "bin/random" } }, + "node_modules/mpd-parser": { + "version": "1.3.1", + "resolved": "https://registry.npmmirror.com/mpd-parser/-/mpd-parser-1.3.1.tgz", + "integrity": "sha512-1FuyEWI5k2HcmhS1HkKnUAQV7yFPfXPht2DnRRGtoiiAAW+ESTbtEXIDpRkwdU+XyrQuwrIym7UkoPKsZ0SyFw==", + "dependencies": { + "@babel/runtime": "^7.12.5", + "@videojs/vhs-utils": "^4.0.0", + "@xmldom/xmldom": "^0.8.3", + "global": "^4.4.0" + }, + "bin": { + "mpd-to-m3u8-json": "bin/parse.js" + } + }, "node_modules/ms": { "version": "2.1.3", "resolved": "https://registry.npmmirror.com/ms/-/ms-2.1.3.tgz", @@ -3580,6 +3707,22 @@ "integrity": "sha512-VNTrAak/KhO2i8dqqnqnAHOa3cYBwXEZe9h+D5h/1ZqFSTEFHdM65lR7RoIqq3tBBYavsOXV84NoHXZ0AkPyqQ==", "dev": true }, + "node_modules/mux.js": { + "version": "7.1.0", + "resolved": "https://registry.npmmirror.com/mux.js/-/mux.js-7.1.0.tgz", + "integrity": "sha512-NTxawK/BBELJrYsZThEulyUMDVlLizKdxyAsMuzoCD1eFj97BVaA8D/CvKsKu6FOLYkFojN5CbM9h++ZTZtknA==", + "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", @@ -3799,6 +3942,17 @@ "node": ">= 6" } }, + "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": "2.1.0", "resolved": "https://registry.npmmirror.com/pkg-types/-/pkg-types-2.1.0.tgz", @@ -3976,6 +4130,14 @@ "integrity": "sha512-1NNCs6uurfkVbeXG4S8JFT9t19m45ICnif8zWLd5oPSZ50QnwMfK+H3jv408d4jw/7Bttv5axS5IiHoLaVNHeQ==", "dev": true }, + "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/quansync": { "version": "0.2.8", "resolved": "https://registry.npmmirror.com/quansync/-/quansync-0.2.8.tgz", @@ -4032,6 +4194,11 @@ "node": ">=8.10.0" } }, + "node_modules/regenerator-runtime": { + "version": "0.14.1", + "resolved": "https://registry.npmmirror.com/regenerator-runtime/-/regenerator-runtime-0.14.1.tgz", + "integrity": "sha512-dYnhHh0nJoMfnkZs6GmmhFknAGRrLznOu5nc9ML+EJxGvrx6H7teuevqVqCuPcPK//3eDrrjQhehXVx9cnkGdw==" + }, "node_modules/resolve": { "version": "1.22.10", "resolved": "https://registry.npmmirror.com/resolve/-/resolve-1.22.10.tgz", @@ -4778,6 +4945,53 @@ "node": ">= 0.4.0" } }, + "node_modules/video.js": { + "version": "8.22.0", + "resolved": "https://registry.npmmirror.com/video.js/-/video.js-8.22.0.tgz", + "integrity": "sha512-xge2kpjsvC0zgFJ1cqt+wTqsi21+huFswlonPFh7qiplypsb4FN/D2Rz6bWdG/S9eQaPHfWHsarmJL/7D3DHoA==", + "dependencies": { + "@babel/runtime": "^7.12.5", + "@videojs/http-streaming": "^3.17.0", + "@videojs/vhs-utils": "^4.1.1", + "@videojs/xhr": "2.7.0", + "aes-decrypter": "^4.0.2", + "global": "4.4.0", + "m3u8-parser": "^7.2.0", + "mpd-parser": "^1.3.1", + "mux.js": "^7.0.1", + "videojs-contrib-quality-levels": "4.1.0", + "videojs-font": "4.2.0", + "videojs-vtt.js": "0.15.5" + } + }, + "node_modules/videojs-contrib-quality-levels": { + "version": "4.1.0", + "resolved": "https://registry.npmmirror.com/videojs-contrib-quality-levels/-/videojs-contrib-quality-levels-4.1.0.tgz", + "integrity": "sha512-TfrXJJg1Bv4t6TOCMEVMwF/CoS8iENYsWNKip8zfhB5kTcegiFYezEA0eHAJPU64ZC8NQbxQgOwAsYU8VXbOWA==", + "dependencies": { + "global": "^4.4.0" + }, + "engines": { + "node": ">=16", + "npm": ">=8" + }, + "peerDependencies": { + "video.js": "^8" + } + }, + "node_modules/videojs-font": { + "version": "4.2.0", + "resolved": "https://registry.npmmirror.com/videojs-font/-/videojs-font-4.2.0.tgz", + "integrity": "sha512-YPq+wiKoGy2/M7ccjmlvwi58z2xsykkkfNMyIg4xb7EZQQNwB71hcSsB3o75CqQV7/y5lXkXhI/rsGAS7jfEmQ==" + }, + "node_modules/videojs-vtt.js": { + "version": "0.15.5", + "resolved": "https://registry.npmmirror.com/videojs-vtt.js/-/videojs-vtt.js-0.15.5.tgz", + "integrity": "sha512-yZbBxvA7QMYn15Lr/ZfhhLPrNpI/RmCSCqgIff57GC2gIrV5YfyzLfLyZMj0NnZSAz8syB4N0nHXpZg9MyrMOQ==", + "dependencies": { + "global": "^4.3.1" + } + }, "node_modules/vite": { "version": "6.2.0", "resolved": "https://registry.npmmirror.com/vite/-/vite-6.2.0.tgz", diff --git a/package.json b/package.json index 8820495..63ba3f1 100644 --- a/package.json +++ b/package.json @@ -15,6 +15,7 @@ "sass": "^1.85.1", "swiper": "^11.2.5", "unplugin-auto-import": "^19.1.1", + "video.js": "^8.22.0", "vue": "^3.5.13" }, "devDependencies": { diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index a2f9b47..6d85561 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -23,6 +23,9 @@ importers: unplugin-auto-import: specifier: ^19.1.1 version: 19.1.1(@vueuse/core@9.13.0(vue@3.5.13(typescript@5.7.3))) + video.js: + specifier: ^8.22.0 + version: 8.22.0 vue: specifier: ^3.5.13 version: 3.5.13(typescript@5.7.3) @@ -196,6 +199,10 @@ packages: peerDependencies: '@babel/core': ^7.0.0-0 + '@babel/runtime@7.26.10': + resolution: {integrity: sha512-2WJMeRQPHKSPemqk/awGrAiuFfzBmOIPXKizAsVhWH9YJqLZ0H+HS4c8loHGgW6utJ3E/ejXQUsiGaQy2NZ9Fw==} + engines: {node: '>=6.9.0'} + '@babel/template@7.26.9': resolution: {integrity: sha512-qyRplbeIpNZhmzOysF/wFMuP9sctmh2cFzRAZOn1YapxBsE1i9bJIY586R/WBLfLcmcBlM8ROBiQURnnNy+zfA==} engines: {node: '>=6.9.0'} @@ -711,6 +718,19 @@ packages: '@types/web-bluetooth@0.0.16': resolution: {integrity: sha512-oh8q2Zc32S6gd/j50GowEjKLoOVOwHP/bWVjKJInBwQqdOYMdPrf1oVlelTlyfFK3CKxL1uahMDAr+vy8T7yMQ==} + '@videojs/http-streaming@3.17.0': + resolution: {integrity: sha512-Ch1P3tvvIEezeZXyK11UfWgp4cWKX4vIhZ30baN/lRinqdbakZ5hiAI3pGjRy3d+q/Epyc8Csz5xMdKNNGYpcw==} + engines: {node: '>=8', npm: '>=5'} + peerDependencies: + video.js: ^8.19.0 + + '@videojs/vhs-utils@4.1.1': + resolution: {integrity: sha512-5iLX6sR2ownbv4Mtejw6Ax+naosGvoT9kY+gcuHzANyUZZ+4NpeNdKMUhb6ag0acYej1Y7cmr/F2+4PrggMiVA==} + engines: {node: '>=8', npm: '>=5'} + + '@videojs/xhr@2.7.0': + resolution: {integrity: sha512-giab+EVRanChIupZK7gXjHy90y3nncA2phIOyG3Ne5fvpiMJzvqYwiTOnEVW2S4CoYcuKJkomat7bMXA/UoUZQ==} + '@vitejs/plugin-vue-jsx@4.1.1': resolution: {integrity: sha512-uMJqv/7u1zz/9NbWAD3XdjaY20tKTf17XVfQ9zq4wY1BjsB/PjpJPMe2xiG39QpP4ZdhYNhm4Hvo66uJrykNLA==} engines: {node: ^18.0.0 || >=20.0.0} @@ -822,11 +842,18 @@ packages: '@vueuse/shared@9.13.0': resolution: {integrity: sha512-UrnhU+Cnufu4S6JLCPZnkWh0WwZGUp72ktOF2DFptMlOs3TOdVv8xJN53zhHGARmVOsz5KqOls09+J1NR6sBKw==} + '@xmldom/xmldom@0.8.10': + resolution: {integrity: sha512-2WALfTl4xo2SkGCYRt6rDTFfk9R1czmBvUQy12gK2KuRKIpWEhcbbzy8EZXtz/jkRqHX8bFEc6FC1HjX4TUWYw==} + engines: {node: '>=10.0.0'} + acorn@8.14.1: resolution: {integrity: sha512-OvQ/2pUDKmgfCg++xsTX1wGxfTaszcHVcTctW4UJB4hibJx2HXxxO5UmVgyjMa+ZDsiaf5wWLXYpRWMmBI0QHg==} engines: {node: '>=0.4.0'} hasBin: true + aes-decrypter@4.0.2: + resolution: {integrity: sha512-lc+/9s6iJvuaRe5qDlMTpCFjnwpkeOXp8qP3oiZ5jsj1MRg+SBVUmmICrhxHvc8OELSmc+fEyyxAuppY6hrWzw==} + alien-signals@1.0.4: resolution: {integrity: sha512-DJqqQD3XcsaQcQ1s+iE2jDUZmmQpXwHiR6fCAim/w87luaW+vmLY8fMlrdkmRwzaFXhkxf3rqPCR59tKVv1MDw==} @@ -996,6 +1023,9 @@ packages: dlv@1.1.3: resolution: {integrity: sha512-+HlytyjlPKnIG8XuRG8WvmBP8xs8P71y+SKKS6ZXWoEgLuePxtDoUEiH7WkdePWrQ5JBpE6aoVqfZfJUQkjXwA==} + dom-walk@0.1.2: + resolution: {integrity: sha512-6QvTW9mrGeIegrFXdtQi9pk7O/nSK6lSdXW2eqUspN5LWD7UTji2Fqw5V2YLjBpHEoU9Xl/eUWNpDeZvoyOv2w==} + eastasianwidth@0.2.0: resolution: {integrity: sha512-I88TYZWc9XiYHRQ4/3c5rjjfgkjhLyW2luGIheGERbNQ6OY7yTybanSpDXZa8y7VUP9YmDcYa+eyq4ca7iLqWA==} @@ -1110,6 +1140,9 @@ packages: resolution: {integrity: sha512-7Bv8RF0k6xjo7d4A/PxYLbUCfb6c+Vpd2/mB2yRDlew7Jb5hEXiCD9ibfO7wpk8i4sevK6DFny9h7EYbM3/sHg==} hasBin: true + global@4.4.0: + resolution: {integrity: sha512-wv/LAoHdRE3BeTGz53FAamhGlPLhlssK45usmGFThIi4XqnBmjKQ16u+RNbP7WvigRZDxUsM0J3gcQ5yicaL0w==} + globals@11.12.0: resolution: {integrity: sha512-WOBp/EEGUiIsJSp7wcv/y6MO+lV9UoncWqxuFfm8eBwzWNgyfBd6Gz+IeKQ9jCmyhoH99g15M3T+QaVHFjizVA==} engines: {node: '>=4'} @@ -1147,6 +1180,9 @@ packages: resolution: {integrity: sha512-zymm5+u+sCsSWyD9qNaejV3DFvhCKclKdizYaJUuHA83RLjb7nSuGnddCHGv0hk+KY7BMAlsWeK4Ueg6EV6XQg==} engines: {node: '>=8'} + is-function@1.0.2: + resolution: {integrity: sha512-lw7DUp0aWXYg+CBCN+JKkcE0Q2RayZnSvnZBlwgxHBQhqt5pZNVy4Ri7H9GmmXkdu7LUthszM+Tor1u/2iBcpQ==} + is-glob@4.0.3: resolution: {integrity: sha512-xelSayHH36ZgE7ZWhli7pW34hNbNl8Ojv5KVmkJD4hBdD3th8Tfk9vYasLM+mXWOZhFkgZfxhLSnrwRr4elSSg==} engines: {node: '>=0.10.0'} @@ -1291,6 +1327,9 @@ packages: lru-cache@5.1.1: resolution: {integrity: sha512-KpNARQA3Iwv+jTA0utUVVbrh+Jlrr1Fv0e56GGzAFOXN7dk/FviaDW8LHmK52DlcH4WP2n6gI8vN1aesBFgo9w==} + m3u8-parser@7.2.0: + resolution: {integrity: sha512-CRatFqpjVtMiMaKXxNvuI3I++vUumIXVVT/JpCpdU/FynV/ceVw1qpPyyBNindL+JlPMSesx+WX1QJaZEJSaMQ==} + magic-string@0.30.17: resolution: {integrity: sha512-sNPKHvyjVf7gyjwS4xGTaW/mCnF8wnjtifKBEhxfZ7E/S8tQ0rssrwGNn6q8JH/ohItJfSQp9mBtQYuTlH5QnA==} @@ -1305,6 +1344,9 @@ packages: resolution: {integrity: sha512-PXwfBhYu0hBCPw8Dn0E+WDYb7af3dSLVWKi3HGv84IdF4TyFoC0ysxFd0Goxw7nSv4T/PzEJQxsYsEiFCKo2BA==} engines: {node: '>=8.6'} + min-document@2.19.0: + resolution: {integrity: sha512-9Wy1B3m3f66bPPmU5hdA4DR4PB2OfDU/+GS3yAB7IQozE3tqXaVv2zOjgla7MEGSRv95+ILmOuvhLkOK6wJtCQ==} + mini-svg-data-uri@1.4.4: resolution: {integrity: sha512-r9deDe9p5FJUPZAk3A59wGH7Ii9YrjjWw0jmw/liSbHl2CHiyXj6FcDXDu2K3TjVAXqiJdaw3xxwlZZr9E6nHg==} hasBin: true @@ -1327,6 +1369,10 @@ packages: resolution: {integrity: sha512-eQsKcWzIaZzEZ07NuEyO4Nw65g0hdWAyurVol1IPl1gahRwY+svqzfgfey8U8dahLwG44d6/RwEzuK52rSa/JQ==} hasBin: true + mpd-parser@1.3.1: + resolution: {integrity: sha512-1FuyEWI5k2HcmhS1HkKnUAQV7yFPfXPht2DnRRGtoiiAAW+ESTbtEXIDpRkwdU+XyrQuwrIym7UkoPKsZ0SyFw==} + hasBin: true + ms@2.0.0: resolution: {integrity: sha512-Tpp60P6IUJDTuOq/5Z8cdskzJujfwqfOTkrwIwj7IRISpnkJnT6SyJ4PCPnGMoFjC9ddhal5KVIYtAt97ix05A==} @@ -1336,6 +1382,11 @@ packages: muggle-string@0.4.1: resolution: {integrity: sha512-VNTrAak/KhO2i8dqqnqnAHOa3cYBwXEZe9h+D5h/1ZqFSTEFHdM65lR7RoIqq3tBBYavsOXV84NoHXZ0AkPyqQ==} + mux.js@7.1.0: + resolution: {integrity: sha512-NTxawK/BBELJrYsZThEulyUMDVlLizKdxyAsMuzoCD1eFj97BVaA8D/CvKsKu6FOLYkFojN5CbM9h++ZTZtknA==} + engines: {node: '>=8', npm: '>=5'} + hasBin: true + mz@2.7.0: resolution: {integrity: sha512-z81GNO7nnYMEhrGh9LeymoE4+Yr0Wn5McHIZMK5cfQCl+NDX08sCZgUc9/6MHni9IWuFLm1Z3HTCXu2z9fN62Q==} @@ -1431,6 +1482,10 @@ packages: resolution: {integrity: sha512-saLsH7WeYYPiD25LDuLRRY/i+6HaPYr6G1OUlN39otzkSTxKnubR9RTxS3/Kk50s1g2JTgFwWQDQyplC5/SHZg==} engines: {node: '>= 6'} + pkcs7@1.0.4: + resolution: {integrity: sha512-afRERtHn54AlwaF2/+LFszyAANTCggGilmcmILUzEjvs3XgFZT+xE6+QWQcAGmu4xajy+Xtj7acLOPdx5/eXWQ==} + hasBin: true + pkg-types@1.3.1: resolution: {integrity: sha512-/Jm5M4RvtBFVkKWRu2BLUTNP8/M2a+UwuAX+ae4770q1qVGtfjG+WTCupoZixokjmHiry8uI+dlY8KXYV5HVVQ==} @@ -1484,6 +1539,10 @@ packages: resolution: {integrity: sha512-dle9A3yYxlBSrt8Fu+IpjGT8SY8hN0mlaA6GY8t0P5PjIOZemULz/E2Bnm/2dcUOena75OTNkHI76uZBNUUq3A==} engines: {node: ^10 || ^12 || >=14} + process@0.11.10: + resolution: {integrity: sha512-cdGef/drWFoydD1JsMzuFf8100nZl+GT+yacc2bEced5f9Rjk4z+WtFUTBu9PhOi9j/jfmBPu0mMEY4wIdAF8A==} + engines: {node: '>= 0.6.0'} + quansync@0.2.8: resolution: {integrity: sha512-4+saucphJMazjt7iOM27mbFCk+D9dd/zmgMDCzRZ8MEoBfYp7lAvoN38et/phRQF6wOPMy/OROBGgoWeSKyluA==} @@ -1501,6 +1560,9 @@ packages: resolution: {integrity: sha512-GDhwkLfywWL2s6vEjyhri+eXmfH6j1L7JE27WhqLeYzoh/A3DBaYGEj2H/HFZCn/kMfim73FXxEJTw06WtxQwg==} engines: {node: '>= 14.18.0'} + regenerator-runtime@0.14.1: + resolution: {integrity: sha512-dYnhHh0nJoMfnkZs6GmmhFknAGRrLznOu5nc9ML+EJxGvrx6H7teuevqVqCuPcPK//3eDrrjQhehXVx9cnkGdw==} + resolve@1.22.10: resolution: {integrity: sha512-NPRy+/ncIMeDlTAsuqwKIiferiawhefFJtkNSW0qZJEqMEb+qBt/77B/jGeeek+F0uOeN05CDa6HXbbIgtVX4w==} engines: {node: '>= 0.4'} @@ -1675,6 +1737,21 @@ packages: resolution: {integrity: sha512-pMZTvIkT1d+TFGvDOqodOclx0QWkkgi6Tdoa8gC8ffGAAqz9pzPTZWAybbsHHoED/ztMtkv/VoYTYyShUn81hA==} engines: {node: '>= 0.4.0'} + video.js@8.22.0: + resolution: {integrity: sha512-xge2kpjsvC0zgFJ1cqt+wTqsi21+huFswlonPFh7qiplypsb4FN/D2Rz6bWdG/S9eQaPHfWHsarmJL/7D3DHoA==} + + videojs-contrib-quality-levels@4.1.0: + resolution: {integrity: sha512-TfrXJJg1Bv4t6TOCMEVMwF/CoS8iENYsWNKip8zfhB5kTcegiFYezEA0eHAJPU64ZC8NQbxQgOwAsYU8VXbOWA==} + engines: {node: '>=16', npm: '>=8'} + peerDependencies: + video.js: ^8 + + videojs-font@4.2.0: + resolution: {integrity: sha512-YPq+wiKoGy2/M7ccjmlvwi58z2xsykkkfNMyIg4xb7EZQQNwB71hcSsB3o75CqQV7/y5lXkXhI/rsGAS7jfEmQ==} + + videojs-vtt.js@0.15.5: + resolution: {integrity: sha512-yZbBxvA7QMYn15Lr/ZfhhLPrNpI/RmCSCqgIff57GC2gIrV5YfyzLfLyZMj0NnZSAz8syB4N0nHXpZg9MyrMOQ==} + vite-plugin-mock@3.0.2: resolution: {integrity: sha512-bD//HvkTygGmk+LsIAdf0jGNlCv4iWv0kZlH9UEgWT6QYoUwfjQAE4SKxHRw2tfLgVhbPQVv/+X3YlNWvueGUA==} engines: {node: '>=16.0.0'} @@ -1934,6 +2011,10 @@ snapshots: transitivePeerDependencies: - supports-color + '@babel/runtime@7.26.10': + dependencies: + regenerator-runtime: 0.14.1 + '@babel/template@7.26.9': dependencies: '@babel/code-frame': 7.26.2 @@ -2291,6 +2372,28 @@ snapshots: '@types/web-bluetooth@0.0.16': {} + '@videojs/http-streaming@3.17.0(video.js@8.22.0)': + dependencies: + '@babel/runtime': 7.26.10 + '@videojs/vhs-utils': 4.1.1 + aes-decrypter: 4.0.2 + global: 4.4.0 + m3u8-parser: 7.2.0 + mpd-parser: 1.3.1 + mux.js: 7.1.0 + video.js: 8.22.0 + + '@videojs/vhs-utils@4.1.1': + dependencies: + '@babel/runtime': 7.26.10 + global: 4.4.0 + + '@videojs/xhr@2.7.0': + dependencies: + '@babel/runtime': 7.26.10 + global: 4.4.0 + is-function: 1.0.2 + '@vitejs/plugin-vue-jsx@4.1.1(vite@6.2.0(jiti@2.4.2)(lightningcss@1.29.2)(sass@1.85.1)(yaml@2.7.0))(vue@3.5.13(typescript@5.7.3))': dependencies: '@babel/core': 7.26.9 @@ -2463,8 +2566,17 @@ snapshots: - '@vue/composition-api' - vue + '@xmldom/xmldom@0.8.10': {} + acorn@8.14.1: {} + aes-decrypter@4.0.2: + dependencies: + '@babel/runtime': 7.26.10 + '@videojs/vhs-utils': 4.1.1 + global: 4.4.0 + pkcs7: 1.0.4 + alien-signals@1.0.4: {} ansi-regex@5.0.1: {} @@ -2608,6 +2720,8 @@ snapshots: dlv@1.1.3: {} + dom-walk@0.1.2: {} + eastasianwidth@0.2.0: {} echarts@5.6.0: @@ -2758,6 +2872,11 @@ snapshots: package-json-from-dist: 1.0.1 path-scurry: 1.11.1 + global@4.4.0: + dependencies: + min-document: 2.19.0 + process: 0.11.10 + globals@11.12.0: {} graceful-fs@4.2.11: {} @@ -2784,6 +2903,8 @@ snapshots: is-fullwidth-code-point@3.0.0: {} + is-function@1.0.2: {} + is-glob@4.0.3: dependencies: is-extglob: 2.1.1 @@ -2885,6 +3006,12 @@ snapshots: dependencies: yallist: 3.1.1 + m3u8-parser@7.2.0: + dependencies: + '@babel/runtime': 7.26.10 + '@videojs/vhs-utils': 4.1.1 + global: 4.4.0 + magic-string@0.30.17: dependencies: '@jridgewell/sourcemap-codec': 1.5.0 @@ -2898,6 +3025,10 @@ snapshots: braces: 3.0.3 picomatch: 2.3.1 + min-document@2.19.0: + dependencies: + dom-walk: 0.1.2 + mini-svg-data-uri@1.4.4: {} minimatch@9.0.5: @@ -2919,12 +3050,24 @@ snapshots: dependencies: commander: 13.1.0 + mpd-parser@1.3.1: + dependencies: + '@babel/runtime': 7.26.10 + '@videojs/vhs-utils': 4.1.1 + '@xmldom/xmldom': 0.8.10 + global: 4.4.0 + ms@2.0.0: {} ms@2.1.3: {} muggle-string@0.4.1: {} + mux.js@7.1.0: + dependencies: + '@babel/runtime': 7.26.10 + global: 4.4.0 + mz@2.7.0: dependencies: any-promise: 1.3.0 @@ -2990,6 +3133,10 @@ snapshots: pirates@4.0.6: {} + pkcs7@1.0.4: + dependencies: + '@babel/runtime': 7.26.10 + pkg-types@1.3.1: dependencies: confbox: 0.1.8 @@ -3043,6 +3190,8 @@ snapshots: picocolors: 1.1.1 source-map-js: 1.2.1 + process@0.11.10: {} + quansync@0.2.8: {} queue-microtask@1.2.3: {} @@ -3057,6 +3206,8 @@ snapshots: readdirp@4.1.2: {} + regenerator-runtime@0.14.1: {} + resolve@1.22.10: dependencies: is-core-module: 2.16.1 @@ -3270,6 +3421,32 @@ snapshots: utils-merge@1.0.1: {} + video.js@8.22.0: + dependencies: + '@babel/runtime': 7.26.10 + '@videojs/http-streaming': 3.17.0(video.js@8.22.0) + '@videojs/vhs-utils': 4.1.1 + '@videojs/xhr': 2.7.0 + aes-decrypter: 4.0.2 + global: 4.4.0 + m3u8-parser: 7.2.0 + mpd-parser: 1.3.1 + mux.js: 7.1.0 + videojs-contrib-quality-levels: 4.1.0(video.js@8.22.0) + videojs-font: 4.2.0 + videojs-vtt.js: 0.15.5 + + videojs-contrib-quality-levels@4.1.0(video.js@8.22.0): + dependencies: + global: 4.4.0 + video.js: 8.22.0 + + videojs-font@4.2.0: {} + + videojs-vtt.js@0.15.5: + dependencies: + global: 4.4.0 + vite-plugin-mock@3.0.2(esbuild@0.25.0)(mockjs@1.1.0)(vite@6.2.0(jiti@2.4.2)(lightningcss@1.29.2)(sass@1.85.1)(yaml@2.7.0)): dependencies: bundle-require: 4.2.1(esbuild@0.25.0) diff --git a/src/assets/common/bg_banner.png b/src/assets/common/bg_banner.png new file mode 100644 index 0000000..a6c3bb8 Binary files /dev/null and b/src/assets/common/bg_banner.png differ diff --git a/src/assets/common/bg_banner_1.png b/src/assets/common/bg_banner_1.png new file mode 100644 index 0000000..c18bc81 Binary files /dev/null and b/src/assets/common/bg_banner_1.png differ diff --git a/src/assets/common/bg_banner_footer.png b/src/assets/common/bg_banner_footer.png new file mode 100644 index 0000000..7ad0d63 Binary files /dev/null and b/src/assets/common/bg_banner_footer.png differ diff --git a/src/assets/common/bg_footer.png b/src/assets/common/bg_footer.png new file mode 100644 index 0000000..d2a0bf1 Binary files /dev/null and b/src/assets/common/bg_footer.png differ diff --git a/src/assets/common/bg_player_dialog.png b/src/assets/common/bg_player_dialog.png new file mode 100644 index 0000000..646c700 Binary files /dev/null and b/src/assets/common/bg_player_dialog.png differ diff --git a/src/assets/common/bg_real_dialog.png b/src/assets/common/bg_real_dialog.png new file mode 100644 index 0000000..59a1628 Binary files /dev/null and b/src/assets/common/bg_real_dialog.png differ diff --git a/src/assets/common/boderBg.png b/src/assets/common/boderBg.png new file mode 100644 index 0000000..c779469 Binary files /dev/null and b/src/assets/common/boderBg.png differ diff --git a/src/assets/common/deviceTotal.png b/src/assets/common/deviceTotal.png new file mode 100644 index 0000000..bb742aa Binary files /dev/null and b/src/assets/common/deviceTotal.png differ diff --git a/src/assets/common/dialog_title_icon.png b/src/assets/common/dialog_title_icon.png new file mode 100644 index 0000000..f0deb14 Binary files /dev/null and b/src/assets/common/dialog_title_icon.png differ diff --git a/src/assets/common/player_icon.png b/src/assets/common/player_icon.png new file mode 100644 index 0000000..1d388bf Binary files /dev/null and b/src/assets/common/player_icon.png differ diff --git a/src/assets/fonts/FileZilla_Server_1.9.4_win64-setup.exe b/src/assets/fonts/FileZilla_Server_1.9.4_win64-setup.exe deleted file mode 100644 index 49ad7b4..0000000 Binary files a/src/assets/fonts/FileZilla_Server_1.9.4_win64-setup.exe and /dev/null differ diff --git a/src/components/CustomTable/src/baseTable.scss b/src/components/CustomTable/src/baseTable.scss index fa28b69..6672cb6 100644 --- a/src/components/CustomTable/src/baseTable.scss +++ b/src/components/CustomTable/src/baseTable.scss @@ -65,6 +65,9 @@ } } } + .fixed_pagination{ + padding: 12px 20px 0; + } /* full_table */ &.full_table { .el-table--large .el-table__cell { @@ -99,6 +102,9 @@ } } } + .fixed_pagination{ + padding: 28px 20px; + } } } diff --git a/src/components/videoPlayer/Player.vue b/src/components/videoPlayer/Player.vue new file mode 100644 index 0000000..b6433c6 --- /dev/null +++ b/src/components/videoPlayer/Player.vue @@ -0,0 +1,11 @@ + + \ No newline at end of file diff --git a/src/components/videoPlayer/RealPlayer.vue b/src/components/videoPlayer/RealPlayer.vue new file mode 100644 index 0000000..e31f938 --- /dev/null +++ b/src/components/videoPlayer/RealPlayer.vue @@ -0,0 +1,4 @@ + + \ No newline at end of file diff --git a/src/components/videoPlayer/index.ts b/src/components/videoPlayer/index.ts new file mode 100644 index 0000000..e69de29 diff --git a/src/styles/element-plus.scss b/src/styles/element-plus.scss index 2cacf7b..f6b0b83 100644 --- a/src/styles/element-plus.scss +++ b/src/styles/element-plus.scss @@ -17,8 +17,25 @@ // ) ); + /* 引入 Element Plus 样式 */ @use "element-plus/theme-chalk/src/index.scss" as *; + + +.el-button.is-text:not(.is-disabled):hover { + background-color: transparent; +} + +.el-button.is-text:not(.is-disabled):hover { + background-color: transparent; +} + +.el-button:hover { + color: white; + background-color: transparent; + outline: none; +} + /* 表格 */ .ds_table { position: relative; @@ -34,7 +51,6 @@ justify-content: flex-end; right: 0; bottom: 0; - padding: 28px 20px; } .noneFixed_pagination { display: flex; diff --git a/src/views/dashboard/AppearanceMonitor.scss b/src/views/dashboard/AppearanceMonitor.scss index 848142e..dce587c 100644 --- a/src/views/dashboard/AppearanceMonitor.scss +++ b/src/views/dashboard/AppearanceMonitor.scss @@ -1,4 +1,6 @@ .appearance-monitor-warp { + box-sizing: border-box; + padding-top: 32px; height: 100%; display: flex; justify-content: center; @@ -6,42 +8,34 @@ // .appearance-monitor-right { // display: flex; // } - .pagination-container { - margin-top: 20px; + + .appearance-monitor-search-box { display: flex; - justify-content: flex-end; + align-items: center; + gap: 12px; + margin: 16px 0; } - :deep(.el-pagination__total) { - color: #606266; - margin-right: 10px; - } - - :deep(.el-pagination__sizes .el-select__inner) { - background: #002a5c; - color: white; - border: 1px solid #409eff; - } - - :deep(.el-pagination__item), - :deep(.el-pagination__button) { - background: #002a5c; - color: white; - border: 1px solid #409eff; - margin-right: 5px; - } - - :deep(.el-pagination__item.is-active) { - background: #409eff; - color: white; + .right-panel{ + .el-scrollbar__view { + background: transparent !important; + height: 600px; + } } + + .appearance-monitor-left { .monitor-left-top { box-sizing: border-box; padding: 32px 16px; + margin-bottom: 16px; min-height: 600px; + background-image: url("@/assets/common/boderBg.png"); + background-size: 100% 100%; + background-position: center; + background-repeat: no-repeat; img { width: 100%; - height: 600px; + height: 590px; } } .monitor-left-bottom { @@ -55,7 +49,7 @@ border-radius:4px; img { width: 100%; - height: 100%; + height: 144px; border-radius:4px; } } diff --git a/src/views/dashboard/AppearanceMonitor.vue b/src/views/dashboard/AppearanceMonitor.vue index f06e559..1eaf07c 100644 --- a/src/views/dashboard/AppearanceMonitor.vue +++ b/src/views/dashboard/AppearanceMonitor.vue @@ -2,28 +2,15 @@
- 监控画面 + 监控画面 +
- - + + Slide @@ -41,57 +28,48 @@
- - - - - - - - - - + +
- - -
- +
+ + + + + + + + + + + + + + 查询 + + + 重置 + +
+ +
+
+ +
+
+
diff --git a/src/views/dashboard/PoleMonitor.scss b/src/views/dashboard/PoleMonitor.scss index 4f715fa..3f86ef9 100644 --- a/src/views/dashboard/PoleMonitor.scss +++ b/src/views/dashboard/PoleMonitor.scss @@ -1,71 +1,89 @@ .pole-monitor-wrap { - .search-section{ - padding: 16px 0; - } - .pole-monitor-search-box { - display: flex; - align-items: center; - gap: 12px; - margin: 16px 0; + background-image: url("@/assets/common/bg_banner.png"); + // background-color: red; + background-size: contain; + background-position: center; + background-repeat: no-repeat; +.bg_footer_desp{ + width: 100%; + height: 20px; + background-image: url("@/assets/common/bg_banner_footer.png"); + // background-color: red; + background-size: contain; + background-position: bottom center; + background-repeat: no-repeat; } -.right-panel{ - .el-scrollbar__view { - background: transparent !important; - height: 600px; + + .search-section { + padding: 16px 0; } -} - .pole-monitor-main { - .left-panel { + .pole-main-content { + width: 100%; + } + + .pole-monitor-search-box { + display: flex; + align-items: center; + gap: 12px; + margin: 16px 0; + } + .right-panel { + .el-scrollbar__view { + background: transparent !important; + height: 600px; + } + } + .pole-monitor-main { + .left-panel { .main-image { - box-sizing: border-box; - min-height: 512px; - img { - width: 100%; - height: 512px; - } + box-sizing: border-box; + min-height: 512px; + img { + width: 100%; + height: 512px; + } } .thumbnail-container { - width: 100%; - overflow: visible; - .swiper { + width: 100%; + overflow: visible; + .swiper { + width: 100%; + height: 100%; + .swiper-slide { + width: 20%; + border-radius: 4px; + img { width: 100%; - height: 100%; - .swiper-slide { - width: 20%; - border-radius:4px; - img { - width: 100%; - height: 100%; - border-radius:4px; - } - } - .active-slide img { - border-radius:4px; - border: 2px solid #2ECCE0; - } - .swiper-button-prev, - .swiper-button-next { - background-color: rgba(0, 0, 0, 0.5); - color: white; - width: 32px; - height: 32px; - border-radius: 50%; - } - - .swiper-button-prev::after, - .swiper-button-next::after { - font-size: 12px ; - color: #FFF; - } - - /* 修改按钮悬停样式 */ - .swiper-button-prev:hover, - .swiper-button-next:hover { - background-color: rgba(0, 0, 0, 0.8); - } + height: 144px; + border-radius: 4px; } - + } + .active-slide img { + border-radius: 4px; + border: 2px solid #2ecce0; + } + .swiper-button-prev, + .swiper-button-next { + background-color: rgba(0, 0, 0, 0.5); + color: white; + width: 32px; + height: 32px; + border-radius: 50%; + } + + .swiper-button-prev::after, + .swiper-button-next::after { + font-size: 12px; + color: #fff; + } + + /* 修改按钮悬停样式 */ + .swiper-button-prev:hover, + .swiper-button-next:hover { + background-color: rgba(0, 0, 0, 0.8); + } + } } - } - } -} \ No newline at end of file + } + } +} diff --git a/src/views/dashboard/PoleMonitor.vue b/src/views/dashboard/PoleMonitor.vue index 16f1645..d3dd0c2 100644 --- a/src/views/dashboard/PoleMonitor.vue +++ b/src/views/dashboard/PoleMonitor.vue @@ -2,12 +2,12 @@ * @Author: donghao donghao@supervision.ltd * @Date: 2025-03-06 15:15:01 * @LastEditors: donghao donghao@supervision.ltd - * @LastEditTime: 2025-03-12 11:43:32 + * @LastEditTime: 2025-03-12 14:31:43 * @FilePath: \vite-ai\data-dashboard\src\views\dashboard\PoleMonitor.vue * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE -->