Commit e2ced02a authored by miaojiale's avatar miaojiale

分片

parent e906e461
NODE_ENV = 'development' NODE_ENV = 'development'
VUE_APP_URL = 'https://zcas.wzswsj.gov.cn:8079/screening-api/' VUE_APP_URL = 'https://zcas.wzswsj.gov.cn:8079/screening-api/'
VUE_APP_IMG = 'https://inno.sh-sict.com/wjy-mobile/' VUE_APP_IMG = 'https://inno.sh-sict.com/gastric/'
...@@ -1532,6 +1532,41 @@ ...@@ -1532,6 +1532,41 @@
"@popperjs/core": "^2.9.2" "@popperjs/core": "^2.9.2"
} }
}, },
"@videojs/http-streaming": {
"version": "2.14.3",
"resolved": "https://registry.npmmirror.com/@videojs/http-streaming/-/http-streaming-2.14.3.tgz",
"integrity": "sha512-2tFwxCaNbcEZzQugWf8EERwNMyNtspfHnvxRGRABQs09W/5SqmkWFuGWfUAm4wQKlXGfdPyAJ1338ASl459xAA==",
"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"
}
},
"@vue/babel-helper-vue-jsx-merge-props": { "@vue/babel-helper-vue-jsx-merge-props": {
"version": "1.2.1", "version": "1.2.1",
"resolved": "https://registry.npmjs.org/@vue/babel-helper-vue-jsx-merge-props/-/babel-helper-vue-jsx-merge-props-1.2.1.tgz", "resolved": "https://registry.npmjs.org/@vue/babel-helper-vue-jsx-merge-props/-/babel-helper-vue-jsx-merge-props-1.2.1.tgz",
...@@ -2408,6 +2443,11 @@ ...@@ -2408,6 +2443,11 @@
"@xtuc/long": "4.2.2" "@xtuc/long": "4.2.2"
} }
}, },
"@xmldom/xmldom": {
"version": "0.7.6",
"resolved": "https://registry.npmmirror.com/@xmldom/xmldom/-/xmldom-0.7.6.tgz",
"integrity": "sha512-HHXP9hskkFQHy8QxxUXkS7946FFIhYVfGqsk0WLwllmexN9x/+R4UBLvurHEuyXRfVEObVR8APuQehykLviwSQ=="
},
"@xtuc/ieee754": { "@xtuc/ieee754": {
"version": "1.2.0", "version": "1.2.0",
"resolved": "https://registry.npmjs.org/@xtuc/ieee754/-/ieee754-1.2.0.tgz", "resolved": "https://registry.npmjs.org/@xtuc/ieee754/-/ieee754-1.2.0.tgz",
...@@ -2467,6 +2507,17 @@ ...@@ -2467,6 +2507,17 @@
"integrity": "sha512-aT6camzM4xEA54YVJYSqxz1kv4IHnQZRtThJJHhUMRExaU5spC7jX5ugSwTaTgJliIgs4VhZOk7htClvQ/LmRA==", "integrity": "sha512-aT6camzM4xEA54YVJYSqxz1kv4IHnQZRtThJJHhUMRExaU5spC7jX5ugSwTaTgJliIgs4VhZOk7htClvQ/LmRA==",
"dev": true "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"
}
},
"aggregate-error": { "aggregate-error": {
"version": "3.1.0", "version": "3.1.0",
"resolved": "https://registry.npmjs.org/aggregate-error/-/aggregate-error-3.1.0.tgz", "resolved": "https://registry.npmjs.org/aggregate-error/-/aggregate-error-3.1.0.tgz",
...@@ -6390,6 +6441,11 @@ ...@@ -6390,6 +6441,11 @@
} }
} }
}, },
"dom-walk": {
"version": "0.1.2",
"resolved": "https://registry.npmmirror.com/dom-walk/-/dom-walk-0.1.2.tgz",
"integrity": "sha512-6QvTW9mrGeIegrFXdtQi9pk7O/nSK6lSdXW2eqUspN5LWD7UTji2Fqw5V2YLjBpHEoU9Xl/eUWNpDeZvoyOv2w=="
},
"domain-browser": { "domain-browser": {
"version": "1.2.0", "version": "1.2.0",
"resolved": "https://registry.npmjs.org/domain-browser/-/domain-browser-1.2.0.tgz", "resolved": "https://registry.npmjs.org/domain-browser/-/domain-browser-1.2.0.tgz",
...@@ -7451,6 +7507,15 @@ ...@@ -7451,6 +7507,15 @@
"integrity": "sha1-jFoUlNIGbFcMw7/kSWF1rMTVAqs=", "integrity": "sha1-jFoUlNIGbFcMw7/kSWF1rMTVAqs=",
"dev": true "dev": true
}, },
"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": { "globals": {
"version": "11.12.0", "version": "11.12.0",
"resolved": "https://registry.npmjs.org/globals/-/globals-11.12.0.tgz", "resolved": "https://registry.npmjs.org/globals/-/globals-11.12.0.tgz",
...@@ -8115,6 +8180,11 @@ ...@@ -8115,6 +8180,11 @@
"resolved": "https://registry.npmjs.org/indexes-of/-/indexes-of-1.0.1.tgz", "resolved": "https://registry.npmjs.org/indexes-of/-/indexes-of-1.0.1.tgz",
"integrity": "sha1-8w9xbI4r00bHtn0985FVZqfAVgc=" "integrity": "sha1-8w9xbI4r00bHtn0985FVZqfAVgc="
}, },
"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=="
},
"infer-owner": { "infer-owner": {
"version": "1.0.4", "version": "1.0.4",
"resolved": "https://registry.npmjs.org/infer-owner/-/infer-owner-1.0.4.tgz", "resolved": "https://registry.npmjs.org/infer-owner/-/infer-owner-1.0.4.tgz",
...@@ -8370,6 +8440,11 @@ ...@@ -8370,6 +8440,11 @@
"integrity": "sha512-zymm5+u+sCsSWyD9qNaejV3DFvhCKclKdizYaJUuHA83RLjb7nSuGnddCHGv0hk+KY7BMAlsWeK4Ueg6EV6XQg==", "integrity": "sha512-zymm5+u+sCsSWyD9qNaejV3DFvhCKclKdizYaJUuHA83RLjb7nSuGnddCHGv0hk+KY7BMAlsWeK4Ueg6EV6XQg==",
"dev": true "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": { "is-glob": {
"version": "2.0.1", "version": "2.0.1",
"resolved": "https://registry.npmjs.org/is-glob/-/is-glob-2.0.1.tgz", "resolved": "https://registry.npmjs.org/is-glob/-/is-glob-2.0.1.tgz",
...@@ -8633,6 +8708,11 @@ ...@@ -8633,6 +8708,11 @@
"resolved": "https://registry.npmjs.org/js-file-download/-/js-file-download-0.4.12.tgz", "resolved": "https://registry.npmjs.org/js-file-download/-/js-file-download-0.4.12.tgz",
"integrity": "sha512-rML+NkoD08p5Dllpjo0ffy4jRHeY6Zsapvr/W86N7E0yuzAO6qa5X9+xog6zQNlH102J7IXljNY2FtS6Lj3ucg==" "integrity": "sha512-rML+NkoD08p5Dllpjo0ffy4jRHeY6Zsapvr/W86N7E0yuzAO6qa5X9+xog6zQNlH102J7IXljNY2FtS6Lj3ucg=="
}, },
"js-md5": {
"version": "0.7.3",
"resolved": "https://registry.npmmirror.com/js-md5/-/js-md5-0.7.3.tgz",
"integrity": "sha512-ZC41vPSTLKGwIRjqDh8DfXoCrdQIyBgspJVPXHBGu4nZlAEvG3nf+jO9avM9RmLiGakg7vz974ms99nEV0tmTQ=="
},
"js-message": { "js-message": {
"version": "1.0.7", "version": "1.0.7",
"resolved": "https://registry.npmjs.org/js-message/-/js-message-1.0.7.tgz", "resolved": "https://registry.npmjs.org/js-message/-/js-message-1.0.7.tgz",
...@@ -8745,6 +8825,11 @@ ...@@ -8745,6 +8825,11 @@
} }
} }
}, },
"keycode": {
"version": "2.2.1",
"resolved": "https://registry.npmmirror.com/keycode/-/keycode-2.2.1.tgz",
"integrity": "sha512-Rdgz9Hl9Iv4QKi8b0OlCRQEzp4AgVxyCtz5S/+VIHezDmrDhkp2N2TqBWOLz0/gbeREXOOiI9/4b8BY9uw2vFg=="
},
"killable": { "killable": {
"version": "1.0.1", "version": "1.0.1",
"resolved": "https://registry.npmjs.org/killable/-/killable-1.0.1.tgz", "resolved": "https://registry.npmjs.org/killable/-/killable-1.0.1.tgz",
...@@ -9066,6 +9151,16 @@ ...@@ -9066,6 +9151,16 @@
"yallist": "^3.0.2" "yallist": "^3.0.2"
} }
}, },
"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"
}
},
"make-dir": { "make-dir": {
"version": "3.1.0", "version": "3.1.0",
"resolved": "https://registry.npmjs.org/make-dir/-/make-dir-3.1.0.tgz", "resolved": "https://registry.npmjs.org/make-dir/-/make-dir-3.1.0.tgz",
...@@ -9308,6 +9403,14 @@ ...@@ -9308,6 +9403,14 @@
"integrity": "sha512-jf84uxzwiuiIVKiOLpfYk7N46TSy8ubTonmneY9vrpHNAnp0QBt2BxWV9dO3/j+BoVAb+a5G6YDPW3M5HOdMWQ==", "integrity": "sha512-jf84uxzwiuiIVKiOLpfYk7N46TSy8ubTonmneY9vrpHNAnp0QBt2BxWV9dO3/j+BoVAb+a5G6YDPW3M5HOdMWQ==",
"dev": true "dev": true
}, },
"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"
}
},
"mini-css-extract-plugin": { "mini-css-extract-plugin": {
"version": "0.9.0", "version": "0.9.0",
"resolved": "https://registry.npmjs.org/mini-css-extract-plugin/-/mini-css-extract-plugin-0.9.0.tgz", "resolved": "https://registry.npmjs.org/mini-css-extract-plugin/-/mini-css-extract-plugin-0.9.0.tgz",
...@@ -9545,6 +9648,17 @@ ...@@ -9545,6 +9648,17 @@
"run-queue": "^1.0.3" "run-queue": "^1.0.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": { "ms": {
"version": "2.1.2", "version": "2.1.2",
"resolved": "https://registry.npmjs.org/ms/-/ms-2.1.2.tgz", "resolved": "https://registry.npmjs.org/ms/-/ms-2.1.2.tgz",
...@@ -9566,6 +9680,15 @@ ...@@ -9566,6 +9680,15 @@
"integrity": "sha1-iZ8R2WhuXgXLkbNdXw5jt3PPyQE=", "integrity": "sha1-iZ8R2WhuXgXLkbNdXw5jt3PPyQE=",
"dev": true "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": { "mz": {
"version": "2.7.0", "version": "2.7.0",
"resolved": "https://registry.npmjs.org/mz/-/mz-2.7.0.tgz", "resolved": "https://registry.npmjs.org/mz/-/mz-2.7.0.tgz",
...@@ -10304,6 +10427,14 @@ ...@@ -10304,6 +10427,14 @@
"pinkie": "^2.0.0" "pinkie": "^2.0.0"
} }
}, },
"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-dir": { "pkg-dir": {
"version": "4.2.0", "version": "4.2.0",
"resolved": "https://registry.npmjs.org/pkg-dir/-/pkg-dir-4.2.0.tgz", "resolved": "https://registry.npmjs.org/pkg-dir/-/pkg-dir-4.2.0.tgz",
...@@ -11219,8 +11350,7 @@ ...@@ -11219,8 +11350,7 @@
"process": { "process": {
"version": "0.11.10", "version": "0.11.10",
"resolved": "https://registry.npmjs.org/process/-/process-0.11.10.tgz", "resolved": "https://registry.npmjs.org/process/-/process-0.11.10.tgz",
"integrity": "sha1-czIwDoQBYb2j5podHZGn1LwW8YI=", "integrity": "sha1-czIwDoQBYb2j5podHZGn1LwW8YI="
"dev": true
}, },
"process-nextick-args": { "process-nextick-args": {
"version": "2.0.1", "version": "2.0.1",
...@@ -11871,11 +12001,27 @@ ...@@ -11871,11 +12001,27 @@
"aproba": "^1.1.1" "aproba": "^1.1.1"
} }
}, },
"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": { "safe-buffer": {
"version": "5.1.2", "version": "5.1.2",
"resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.1.2.tgz", "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.1.2.tgz",
"integrity": "sha512-Gd2UZBJDkXlY7GbJxfsE8/nvKkUEU1G38c1siN6QP6a9PT9MmHB8GnpscSmMJSoF8LOIrt8ud/wPtojys4G6+g==" "integrity": "sha512-Gd2UZBJDkXlY7GbJxfsE8/nvKkUEU1G38c1siN6QP6a9PT9MmHB8GnpscSmMJSoF8LOIrt8ud/wPtojys4G6+g=="
}, },
"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"
}
},
"safe-regex": { "safe-regex": {
"version": "1.1.0", "version": "1.1.0",
"resolved": "https://registry.npmjs.org/safe-regex/-/safe-regex-1.1.0.tgz", "resolved": "https://registry.npmjs.org/safe-regex/-/safe-regex-1.1.0.tgz",
...@@ -13624,6 +13770,11 @@ ...@@ -13624,6 +13770,11 @@
"requires-port": "^1.0.0" "requires-port": "^1.0.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=="
},
"use": { "use": {
"version": "3.1.1", "version": "3.1.1",
"resolved": "https://registry.npmjs.org/use/-/use-3.1.1.tgz", "resolved": "https://registry.npmjs.org/use/-/use-3.1.1.tgz",
...@@ -13757,6 +13908,39 @@ ...@@ -13757,6 +13908,39 @@
} }
} }
}, },
"video.js": {
"version": "7.20.3",
"resolved": "https://registry.npmmirror.com/video.js/-/video.js-7.20.3.tgz",
"integrity": "sha512-JMspxaK74LdfWcv69XWhX4rILywz/eInOVPdKefpQiZJSMD5O8xXYueqACP2Q5yqKstycgmmEKlJzZ+kVmDciw==",
"requires": {
"@babel/runtime": "^7.12.5",
"@videojs/http-streaming": "2.14.3",
"@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.4"
}
},
"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"
}
},
"vm-browserify": { "vm-browserify": {
"version": "1.1.2", "version": "1.1.2",
"resolved": "https://registry.npmjs.org/vm-browserify/-/vm-browserify-1.1.2.tgz", "resolved": "https://registry.npmjs.org/vm-browserify/-/vm-browserify-1.1.2.tgz",
......
...@@ -15,6 +15,7 @@ ...@@ -15,6 +15,7 @@
"fastclick": "^1.0.6", "fastclick": "^1.0.6",
"js-base64": "^2.4.9", "js-base64": "^2.4.9",
"js-file-download": "^0.4.1", "js-file-download": "^0.4.1",
"js-md5": "^0.7.3",
"lodash": "^4.17.4", "lodash": "^4.17.4",
"marked": "^0.3.19", "marked": "^0.3.19",
"mescroll.js": "^1.4.0", "mescroll.js": "^1.4.0",
...@@ -25,6 +26,7 @@ ...@@ -25,6 +26,7 @@
"qs": "^6.5.2", "qs": "^6.5.2",
"v-distpicker": "^1.0.16", "v-distpicker": "^1.0.16",
"vant": "^2.12.45", "vant": "^2.12.45",
"video.js": "^7.20.3",
"vue": "^2.6.11", "vue": "^2.6.11",
"vue-carousel": "^0.6.5", "vue-carousel": "^0.6.5",
"vue-product-zoomer": "^2.0.10", "vue-product-zoomer": "^2.0.10",
......
<template> <template>
<div id="app"> <div id="app">
<transition :name="routerAnimate"> <transition :name="routerAnimate">
<keep-alive> <keep-alive :include="keepAlive">
<router-view <router-view class="app-content"></router-view>
class="app-content"
v-if="$route.meta.keepAlive"
></router-view>
</keep-alive> </keep-alive>
</transition> </transition>
<transition :name="routerAnimate">
<router-view
class="app-content"
v-if="!$route.meta.keepAlive"
></router-view>
</transition>
</div> </div>
</template> </template>
...@@ -22,14 +13,28 @@ export default { ...@@ -22,14 +13,28 @@ export default {
name: 'app', name: 'app',
data () { data () {
return { return {
aliveRoute: [], routerAnimate: '',
routerAnimate: '' keepAlive: [],
aliveRoute: ['peopleList']
} }
}, },
watch: { watch: {
// 监听 $route 为内页设置不同的过渡效果 // 监听 $route 为内页设置不同的过渡效果
"$route" (to, from) { "$route" (to, from) {
/*动态设置路由缓存 start*/
//?需要缓存的组件
if (this.aliveRoute.includes(to.name)) {
to.meta.keepAlive = true
}
// console.log(to.path + '---' + to.meta.keepAlive);
let aliveRoute = this.$router.options.routes.filter(e => e.meta && e.meta.keepAlive).map(e => e.name)
this.keepAlive = aliveRoute
/*动态设置路由缓存 end*/
// console.log(aliveRoute);
if (to.meta.index === from.meta.index) { if (to.meta.index === from.meta.index) {
this.routerAnimate = ""
return; return;
// this.routerAnimate = "slide-left" // this.routerAnimate = "slide-left"
} }
......
...@@ -13,24 +13,20 @@ const v1 = `/gastric-cancer${process.env.VUE_APP_MOD || ""}-user`; ...@@ -13,24 +13,20 @@ const v1 = `/gastric-cancer${process.env.VUE_APP_MOD || ""}-user`;
const ewellDefectData = `/gastric-cancer${process.env.VUE_APP_MOD || ""}-data`; const ewellDefectData = `/gastric-cancer${process.env.VUE_APP_MOD || ""}-data`;
const im = `/gastric-cancer${process.env.VUE_APP_MOD || ""}-im`; const im = `/gastric-cancer${process.env.VUE_APP_MOD || ""}-im`;
export const API = { export const API = {
//居民端跳转 //登录
postCToken: (data) => { login: (data) => {
return post(`${v1}/app/customer/forward`, data); return post(`${v1}/user/login`, data);
}, },
getPeopleList: (data) => {
/******************* return post(`${ewellDefectData}/report/hospital`, data);
* 患者端-首页 *
*******************/
//文章推荐
postArticle: (data) => {
return post(`${ewellDefectData}/app/index/article/list`, data);
}, },
//! 筛查档案 getVideoList: (data) => {
reportInfo: (data) => {
return get( return get(
`${ewellDefectData}/app/customer/screen/report?patientId=${data.patientId}`, `${ewellDefectData}/app/report/video/mine?pageNum=${data.pageNum}&pageSize=${data.pageSize}&dataId=${data.dataId}`,
data data
); );
}, },
fileUpload: (data) => {
return post(`${ewellDefectData}/app/report/video/upload`, data);
}
}; };
...@@ -8,32 +8,26 @@ let CommonAlert = function (msg) { ...@@ -8,32 +8,26 @@ let CommonAlert = function (msg) {
if (msg.length > 0) { if (msg.length > 0) {
return Toast({ return Toast({
message: msg, message: msg,
duration: 1500, duration: 1500
}); });
} }
}; };
// axios.defaults.timeout = 5000; // axios.defaults.timeout = 5000;
if (process.env.NODE_ENV == "development") { if (process.env.NODE_ENV == "development") {
// axios.defaults.baseURL = 'https://inno.sh-sict.com/screening-api/'; axios.defaults.baseURL = "https://inno.sh-sict.com/gastric-api/";
} else { } else {
axios.defaults.baseURL = process.env.VUE_APP_URL; axios.defaults.baseURL = process.env.VUE_APP_URL;
} }
window.baseURL = axios.defaults.baseURL; window.baseURL = axios.defaults.baseURL;
//http request 拦截器 //http request 拦截器
axios.create({ axios.create({
withCredentials: true, withCredentials: true
}); });
axios.interceptors.request.use( axios.interceptors.request.use(
(config) => { (config) => {
config.data = config.data; config.data = config.data;
config.headers["user-cookie"] = localStorage.getItem("token"); config.headers["user-cookie"] = localStorage.getItem("vd_token");
if (config.url === "/ewell-tumors-user/province/list") {
//坐下判断如果是获取省市接口则不做拦截
}
// else if(!localStorage.getItem("token")){
// toLogin()
// }
return config; return config;
}, },
(error) => { (error) => {
...@@ -47,10 +41,7 @@ axios.interceptors.request.use( ...@@ -47,10 +41,7 @@ axios.interceptors.request.use(
*/ */
const toLogin = () => { const toLogin = () => {
router.replace({ router.replace({
path: "/register", path: "/login"
query: {
redirect: router.currentRoute.fullPath,
},
}); });
}; };
...@@ -60,8 +51,8 @@ axios.interceptors.response.use( ...@@ -60,8 +51,8 @@ axios.interceptors.response.use(
if (response.data.code === 0 || response.data.code === -1) { if (response.data.code === 0 || response.data.code === -1) {
CommonAlert(response.data.message); CommonAlert(response.data.message);
} else if (response.data.code === -100) { } else if (response.data.code === -100) {
localStorage.removeItem('token') localStorage.removeItem("vd_token");
window.location.hash = "/register"; window.location.hash = "/login";
} }
return response; return response;
}, },
...@@ -159,7 +150,7 @@ export function post(url, data = {}, params = {}) { ...@@ -159,7 +150,7 @@ export function post(url, data = {}, params = {}) {
return new Promise((resolve, reject) => { return new Promise((resolve, reject) => {
axios axios
.post(url, data, { .post(url, data, {
params, params
}) })
.then( .then(
(response) => { (response) => {
...@@ -176,8 +167,8 @@ export function postForm(url, data = {}) { ...@@ -176,8 +167,8 @@ export function postForm(url, data = {}) {
axios axios
.post(url, qs.stringify(data), { .post(url, qs.stringify(data), {
headers: { headers: {
"Content-Type": "application/x-www-form-urlencoded", "Content-Type": "application/x-www-form-urlencoded"
}, }
}) })
.then( .then(
(response) => { (response) => {
...@@ -197,8 +188,8 @@ export function expoertExcel(url, data = {}) { ...@@ -197,8 +188,8 @@ export function expoertExcel(url, data = {}) {
.post(url, qs.stringify(data), { .post(url, qs.stringify(data), {
responseType: "blob", responseType: "blob",
headers: { headers: {
"Content-Type": "application/x-www-form-urlencoded", "Content-Type": "application/x-www-form-urlencoded"
}, }
}) })
.then( .then(
(response) => { (response) => {
...@@ -217,20 +208,20 @@ export function downloadExcel(url, data = {}, title = "筛查信息导出表") { ...@@ -217,20 +208,20 @@ export function downloadExcel(url, data = {}, title = "筛查信息导出表") {
method: "post", method: "post",
url: url, url: url,
data: data, data: data,
responseType: "blob", responseType: "blob"
}) })
.then((res) => { .then((res) => {
if ("msSaveOrOpenBlob" in navigator) { if ("msSaveOrOpenBlob" in navigator) {
//兼容ie //兼容ie
let blob = new Blob([res.data], { let blob = new Blob([res.data], {
type: "application/vnd.ms-excel", type: "application/vnd.ms-excel"
}); });
window.navigator.msSaveOrOpenBlob(blob, `${title}.xlsx`); window.navigator.msSaveOrOpenBlob(blob, `${title}.xlsx`);
return; return;
} else { } else {
const link = document.createElement("a"); const link = document.createElement("a");
let blob = new Blob([res.data], { let blob = new Blob([res.data], {
type: "application/vnd.ms-excel", type: "application/vnd.ms-excel"
}); });
link.style.display = "none"; link.style.display = "none";
link.href = URL.createObjectURL(blob); link.href = URL.createObjectURL(blob);
......
...@@ -17,6 +17,8 @@ import "vant/lib/index.css"; ...@@ -17,6 +17,8 @@ import "vant/lib/index.css";
import "vant/lib/index.less"; import "vant/lib/index.less";
import "../src/styles/vantTheme.less"; import "../src/styles/vantTheme.less";
import 'video.js/dist/video-js.min.css'
import clipboard from "clipboard"; import clipboard from "clipboard";
Vue.prototype.clipboard = clipboard; Vue.prototype.clipboard = clipboard;
Vue.use(Scroll); Vue.use(Scroll);
......
...@@ -8,12 +8,12 @@ ...@@ -8,12 +8,12 @@
:has-header="false" :has-header="false"
:has-footer="false" :has-footer="false"
> >
<van-form @submit="onSubmit"> <van-form @submit="onSubmit">
<div class="title">登录</div> <div class="title">登录</div>
<van-field <van-field
v-model="username" v-model="userName"
name="username" name="userName"
label="" label=""
placeholder="用户名" placeholder="用户名"
:rules="[{ required: true, message: '请填写用户名' }]" :rules="[{ required: true, message: '请填写用户名' }]"
...@@ -30,10 +30,10 @@ ...@@ -30,10 +30,10 @@
<van-button <van-button
round round
block block
:loading='loading'
type="info" type="info"
class="btn" class="btn"
native-type="submit" native-type="submit"
@click="$router.push('/peopleList')"
>提交</van-button> >提交</van-button>
</div> </div>
</van-form> </van-form>
...@@ -41,18 +41,48 @@ ...@@ -41,18 +41,48 @@
</div> </div>
</template> </template>
<script> <script>
import { encryption } from "../utils/encryption.js";
export default { export default {
name: 'login', name: 'login',
data () { data () {
return { return {
username: '', loading: false,
userName: '',
password: '', password: '',
}; };
}, },
methods: { methods: {
onSubmit (values) { onSubmit (values) {
// 成功的回调函数
this.loading = true
console.log('submit', values); console.log('submit', values);
let data = {
userName: encryption.encrypt(this.userName),
password: encryption.encrypt(this.password),
validateText: '',
validateKey: +new Date()
};
this.$API.login(data).then(res => {
this.loading = false
if (res.code == 1) {
localStorage.setItem('vd_token', res.result)
this.$toast.success({
type: 'success',
forbidClick: true,
message: '登录成功',
onClose: () => {
this.$router.push('/peopleList')
},
duration: 1500
})
}
})
}, },
},
mounted () {
if (localStorage.getItem('vd_token')) {
this.$router.push('/peopleList')
}
} }
}; };
</script> </script>
...@@ -66,15 +96,15 @@ export default { ...@@ -66,15 +96,15 @@ export default {
position: absolute; position: absolute;
top: 30%; top: 30%;
transform: translateY(-50%); transform: translateY(-50%);
.title{ .title {
text-align: center; text-align: center;
font-size: 20px; font-size: 20px;
margin: 20px 0; margin: 20px 0;
} }
.van-field{ .van-field {
// height: 44px; // height: 44px;
} }
.btn{ .btn {
height: 44px; height: 44px;
border-radius: 22px !important; border-radius: 22px !important;
} }
......
...@@ -9,65 +9,62 @@ ...@@ -9,65 +9,62 @@
:has-footer="false" :has-footer="false"
> >
<!-- 列表 --> <!-- 列表 -->
<div <van-list
class="list_content" class="list_content"
ref="scroller" ref="scroller"
v-model="loading"
:immediate-check='false'
:finished="finished"
finished-text="没有更多了"
offset="100"
@load="loadMore"
> >
<van-list <van-cell-group
v-model="loading" inset
:immediate-check='false' v-for="(item, index) in peopleList"
:finished="finished" :key="index"
finished-text="没有更多了"
:offset='100'
@load="loadMore"
> >
<van-cell-group <van-cell
inset center
v-for="(item, index) in peopleList" is-link
:key="index" @click="JumpTo(item.id)"
> >
<van-cell <template #title>
center <div class="avater">
is-link <div
@click="JumpTo(item.id)" class="circle"
> :style="{background:item.riskRank=='a'?'#ED4014':item.riskRank=='b'?'#FF9900':'#2DB7F5'}"
<template #title> >
<div class="avater">
<div
class="circle"
:style="{background:item.riskRank=='a'?'#ED4014':item.riskRank=='b'?'#FF9900':'#2DB7F5'}"
>
</div>
{{ item.name }}
</div> </div>
</template> {{ item.name }}
<template #right-icon> </div>
<div class="right"> </template>
<div class="plan_time"> <template #right-icon>
计划随访时间 : {{ item.followUpTime }} <div class="right">
</div> <div class="plan_time">
<div class="module"> 计划随访时间 : {{ item.followUpTime }}
模式 : {{ item.diseaseType | vtol }}
</div>
</div> </div>
</template> <div class="module">
<template #label> 模式 : {{ item.diseaseType | vtol }}
<span> </div>
{{ item.patientInfo?item.patientInfo.sex=='a'?'':'':'--' }} </div>
</span> </template>
&nbsp; <template #label>
<span> <span>
{{ item.patientInfo?item.patientInfo.birthday:'--' }} {{ item.patientInfo?item.patientInfo.sex=='a'?'':'':'--' }}
</span> </span>
&nbsp; &nbsp;
<span> <span>
{{ item.patientInfo?item.patientInfo.address:'--' }} {{ item.patientInfo?item.patientInfo.birthday:'--' }}
</span> </span>
</template> &nbsp;
</van-cell> <span>
</van-cell-group> {{ item.patientInfo?item.patientInfo.address:'--' }}
</van-list> </span>
</div> </template>
</van-cell>
</van-cell-group>
</van-list>
</v-content> </v-content>
</div> </div>
</template> </template>
...@@ -94,56 +91,47 @@ export default { ...@@ -94,56 +91,47 @@ export default {
pageSize: this.pageSize pageSize: this.pageSize
} }
this.finished = false; this.finished = false;
setTimeout(() => { this.$API.getPeopleList(data).then(res => {
this.loading = false this.loading = false
this.totalCount = 40 this.totalCount = res.object.totalCount
this.setNum(this.pageSize) this.peopleList = [...this.peopleList, ...res.object.list]
if (this.peopleList.length >= this.totalCount) { if (this.peopleList.length >= this.totalCount) {
this.finished = true this.finished = true
} }
}, 1000); })
}, },
loadMore () { loadMore () {
this.pageNum++ this.pageNum++
this.getList() this.getList()
}, },
setNum (num) {
for (let i = 0; i < num; i++) {
this.peopleList.push(
{
name: "test06271021",
followUpTime: '2022-08-88',
diseaseType: 'sj_wzz',
id: "62b90d53e4b0123121be58a8",
patientInfo: {
sex: 'a',
birthday: '1976-08-11',
address: '上海'
},
riskRank: 'c'
}
)
}
}
}, },
created () { created () {
this.peopleList = []
this.getList() this.getList()
}, },
activated () { activated () {
const scrollTop = this.$route.meta.scrollTop; const scrollTops = this.$route.meta.scrollTop;
const $wrapper = document.querySelector('.list_content'); const $content = document.querySelector('.list_content');
if (scrollTop && $wrapper) { if (scrollTops && $content) {
document.querySelector('.list_content').scrollTop = scrollTop; this.$nextTick(() => {
var scrollTop = this.$el.querySelector('.list_content')
scrollTop.scrollTop = scrollTops - 1
})
} }
}, },
beforeRouteLeave (to, from, next) {
const $content = document.querySelector('.list_content'); // 列表的外层容器
const scrollTop = $content ? $content.scrollTop : 0;
from.meta.scrollTop = scrollTop;
next()
},
mounted () { mounted () {
}, },
watch: {}, watch: {},
filters: { filters: {
vtol (v) { vtol (v) {
if (v) { if (v) {
return [{ let item = [{
label: "无症状早癌筛查流程", label: "无症状早癌筛查流程",
value: "sj_wzz", value: "sj_wzz",
}, },
...@@ -154,11 +142,15 @@ export default { ...@@ -154,11 +142,15 @@ export default {
{ {
label: "院内胃癌筛查流程", label: "院内胃癌筛查流程",
value: "sj_nj", value: "sj_nj",
}].filter(e => e.value == v)[0].label }].filter(e => e.value == v)
if (item.length > 0) {
return item[0].label
} else {
return '--'
}
} else { } else {
return '--' return '--'
} }
} }
}, },
}; };
...@@ -169,10 +161,8 @@ export default { ...@@ -169,10 +161,8 @@ export default {
color: #127bff; color: #127bff;
} }
.content {
}
.list_content { .list_content {
height: calc(100vh - 44px); height: 100%;
overflow: auto; overflow: auto;
padding: 20px 0; padding: 20px 0;
} }
......
<template> <template>
<div> <div>
<van-loading
v-if="uploadLoading"
type="spinner"
class="loading_box"
vertical
text-color="#fff"
text-size='16'
>
上传中,请勿退出...
</van-loading>
<x-header :left-options="{backText: '',showBack:true}"> <x-header :left-options="{backText: '',showBack:true}">
内镜视频 内镜视频
<div <div
class="uploadBtn" class="uploadBtn"
slot="right" slot="right"
> >
<van-uploader> <van-uploader
:after-read="afterRead"
:max-count='1'
accept='video/*'
>
<van-button type="text">上传文件</van-button> <van-button type="text">上传文件</van-button>
</van-uploader> </van-uploader>
</div> </div>
...@@ -17,7 +31,16 @@ ...@@ -17,7 +31,16 @@
has-header has-header
:has-footer="false" :has-footer="false"
> >
<div class="list_content"> <van-list
:immediate-check='false'
class="list_content"
ref="scroller"
v-model="loading"
:finished="finished"
finished-text="没有更多了"
:offset="100"
@load="onLoad"
>
<van-row <van-row
type="flex" type="flex"
justify="space-between" justify="space-between"
...@@ -27,38 +50,41 @@ ...@@ -27,38 +50,41 @@
:key="index" :key="index"
class="col" class="col"
> >
<!-- 视频 --> <!-- 图片 -->
<video <div class="img_box">
id="video" <van-image
controls id="video"
preload="auto" :src="'https://inno.sh-sict.com/gastric/gastric-resources/' + item.coverUrl"
loop="loop" />
x5-video-player-fullscreen="true" <div class="start_icon">
x5-video-orientation="portraint" <van-icon
playsinline="true" name="play-circle-o"
x5-video-player-type="h5" size="50"
style="object-fit:fill" color='#e6e6e6'
> @click="showVideo(item.videoName)"
<!-- :poster="'https://img1.baidu.com/it/u=3009731526,373851691&fm=253&fmt=auto&app=138&f=JPEG?w=800&h=500'" --> />
<source src="../assets/img/video.mp4"> </div>
</video>
<div class="label">
{{item.name}}
</div> </div>
<div class="label"> <div
{{item.time}} class="van-ellipsis"
style="font-size:12px;"
>
{{item.videoName}}
</div> </div>
<div class="label"> <div class="label van-ellipsis">
{{item.createTime}}
</div>
<div class="label van-ellipsis">
<a>诊断详情</a> <a>诊断详情</a>
<a <a
style="color:#127BFF;" style="color:#127BFF;"
@click="showPop(item.describe)" @click="showPop(item)"
>点击查看</a> >点击查看</a>
</div> </div>
</van-col> </van-col>
</van-row> </van-row>
</div> </van-list>
</v-content> </v-content>
<van-popup <van-popup
v-model="show" v-model="show"
...@@ -72,7 +98,7 @@ ...@@ -72,7 +98,7 @@
诊断日期: 诊断日期:
</div> </div>
<div class="value"> <div class="value">
{{ describe.date }} {{ describe.diagnosisTime || '--' }}
</div> </div>
</div> </div>
<div class="item"> <div class="item">
...@@ -80,7 +106,7 @@ ...@@ -80,7 +106,7 @@
诊断所见: 诊断所见:
</div> </div>
<div class="value"> <div class="value">
{{ describe.see }} {{ describe.finding || '--' }}
</div> </div>
</div> </div>
<div class="item"> <div class="item">
...@@ -88,7 +114,7 @@ ...@@ -88,7 +114,7 @@
诊断结果: 诊断结果:
</div> </div>
<div class="value"> <div class="value">
{{ describe.result }} {{ describe.diagnosis || '--' }}
</div> </div>
</div> </div>
</div> </div>
...@@ -96,72 +122,101 @@ ...@@ -96,72 +122,101 @@
</div> </div>
</template> </template>
<script> <script>
// 引入
import { uploadByPieces } from '../utils/upload'
export default { export default {
name: 'videoList',
data () { data () {
return { return {
show: false, show: false,
describe: {},//诊断详情 describe: {},//诊断详情
videoList: [ videoList: [],
{ loading: false,
name: '视频', finished: false,
url: 'https://docs.egret.com/engine/img/engine2d.mp4', pageNum: 1,
time: '2022-01-04', pageSize: 10,
describe: { totalCount: 0,
date: '2022-01-08', uploadLoading: false
see: '大肿瘤',
result: '倒计时20天'
}
},
{
name: '视频',
url: 'https://docs.egret.com/engine/img/engine2d.mp4',
time: '2022-01-04',
describe: {
date: '2022-01-08',
see: '大肿瘤',
result: '倒计时20天'
}
},
{
name: '视频',
url: 'https://docs.egret.com/engine/img/engine2d.mp4',
time: '2022-01-04',
describe: {
date: '2022-01-08',
see: '大肿瘤',
result: '倒计时20天'
}
},
{
name: '视频',
url: 'https://docs.egret.com/engine/img/engine2d.mp4',
time: '2022-01-04',
describe: {
date: '2022-01-08',
see: '大肿瘤',
result: '倒计时20天'
}
}
],
} }
}, },
methods: { methods: {
jumpTo () { onLoad () {
console.log('双穿视屏'); if (!this.finished) {
this.pageNum++
this.getVideoList()
}
},
getVideoList () {
let data = {
pageNum: this.pageNum,
pageSize: this.pageSize,
dataId: this.$route.query.id
}
this.$API.getVideoList(data).then(res => {
this.loading = false
if (res.code == 1) {
this.totalCount = res.object.totalCount
this.videoList = [...this.videoList, ...res.object.list]
}
if (this.videoList.length >= this.totalCount) {
this.finished = true
}
})
}, },
showPop (data) { showPop (data) {
this.show = true this.show = true
this.describe = data this.describe = data
}, },
}, showVideo (url) {
beforeRouteEnter (to, from, next) { this.$router.push(`/videoShow?src=${url}`)
from.meta.keepAlive = true },
next() afterRead (file) {
this.uploadLoading = true
// console.log(file);
uploadByPieces({
randoms: '', // 随机数,这里作为给后端处理分片的标识 根据项目看情况 是否要加
file: file.file, // 视频实体
pieceSize: 10, // 分片大小
dataId: this.$route.query.id,
success: data => {
console.log('分片上传视频成功', data)
this.uploadLoading = false
this.pageNum = 1
this.videoList = []
this.getVideoList()
},
error: e => {
console.log('分片上传视频失败', e)
}
})
},
}, },
mounted () { mounted () {
this.videoList = []
this.getVideoList()
}, },
watch: {} activated () {
const scrollTop = this.$route.meta.scrollTop;
const $content = document.querySelector('.list_content');
if (scrollTop && $content) {
this.$nextTick(() => {
console.log(scrollTop);
document.querySelector('.list_content').scrollTop = scrollTop;
})
}
},
beforeRouteLeave (to, from, next) {
if (to.path != '/videoShow') {
from.meta.keepAlive = false
} else
if (to.path == '/videoShow') {
from.meta.keepAlive = true
const $content = document.querySelector('.list_content'); // 列表的外层容器
const scrollTop = $content ? $content.scrollTop : 0;
from.meta.scrollTop = scrollTop;
}
next()
}
} }
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
...@@ -170,7 +225,8 @@ export default { ...@@ -170,7 +225,8 @@ export default {
} }
.list_content { .list_content {
padding: 14px 14px; padding: 14px 14px;
height: 100%;
overflow: auto;
.col { .col {
width: 48%; width: 48%;
padding: 10px; padding: 10px;
...@@ -186,11 +242,30 @@ export default { ...@@ -186,11 +242,30 @@ export default {
#video { #video {
width: 100%; width: 100%;
height: 150px; height: 150px;
img {
display: block;
margin: 0;
padding: 0;
}
} }
.uploadBtn { .uploadBtn {
transform: translateY(-16px) translatex(12px); transform: translateY(-16px) translatex(12px);
color: #fff; color: #fff;
} }
.img_box {
position: relative;
.start_icon {
height: 150px;
position: absolute;
left: 0;
top: 0;
width: 100%;
background: rgba(0, 0, 0, 0.5);
display: flex;
justify-content: center;
align-items: center;
}
}
.pop_content { .pop_content {
padding: 20px; padding: 20px;
.item { .item {
...@@ -204,4 +279,17 @@ export default { ...@@ -204,4 +279,17 @@ export default {
} }
} }
} }
.loading_box {
width: 100%;
height: 100%;
position: absolute;
left: 0;
top: 0;
display: flex;
justify-content: center;
align-items: center;
z-index: 10000;
background: rgba(0, 0, 0, 0.5);
color: #fff;
}
</style> </style>
\ No newline at end of file
<template>
<div class="video_box">
<div class="top">
<van-icon
name="cross"
class="closeIcon"
@click="closeVideo"
/>
</div>
<div class="video">
<video
ref="videoPlayer"
class="video-js"
id="videoplayer"
></video>
</div>
</div>
</template>
<script>
import videojs from 'video.js';
export default {
data () {
return {
player: null,
}
},
computed: {
src () {
return this.$route.query.src
}
},
methods: {
// 实例化播放器
createVideo () {
let options = {
autoplay: false,
controls: true,
sources: [
{
src: 'https://inno.sh-sict.com/gastric-api/gastric-cancer-data/file/show?videoName=' + this.src,
}
]
}
this.player = videojs('videoplayer', options, function onPlayerReady () {
console.log('onPlayerReady', this);
})
},
closeVideo () {
this.$router.go(-1)
}
},
mounted () {
this.$nextTick(() => {
this.createVideo()
})
this.$once('hook:beforeDestroy', () => {
this.player.dispose();
})
},
}
</script>
<style lang="scss" scoped>
.video_box {
display: flex;
flex-direction: column;
width: 100%;
height: 100%;
position: relative;
.top {
height: 40px;
background: #000;
text-align: right;
color: #fff;
font-size: 20px;
padding: 5px 10px 0 0;
}
.video {
flex: 1;
}
}
#videoplayer {
width: 100%;
height: 100%;
}
::v-deep .video-js .vjs-big-play-button {
font-size: 0.5rem;
width: 1.5rem;
height: 0.8rem;
top: 50%;
left: 50%;
transform: translateX(-50%) translateY(-50%);
}
</style>
\ No newline at end of file
...@@ -15,15 +15,21 @@ const page = [ ...@@ -15,15 +15,21 @@ const page = [
}, },
{ {
path: "/peopleList", path: "/peopleList",
meta: { index: 1, keepAlive: true, scrollTop: 0 }, meta: { index: 2, keepAlive: true, scrollTop: 0 },
name: "peopleList", name: "peopleList",
component: () => import("@/pages/peopleList") component: () => import("@/pages/peopleList")
}, },
{ {
path: "/videoList", path: "/videoList",
meta: { index: 2 }, meta: { index: 3, keepAlive: true, scrollTop: 0 },
name: "videoList", name: "videoList",
component: () => import("@/pages/videoList") component: () => import("@/pages/videoList")
},
{
path: "/videoShow",
meta: { index: 3, keepAlive: false },
name: "videoShow",
component: () => import("@/pages/videoShow")
} }
]; ];
......
import md5 from "js-md5"; //引入MD5加密
import { API } from "@/axios/api"; // 这里指前端调用接口的api方法
export const uploadByPieces = ({
randoms,
file,
pieceSize = 10,
progress,
dataId,
success,
error
}) => {
// 如果文件传入为空直接 return 返回
// if (!file || !file.length) return;
console.log(file);
let fileMD5 = ""; // 总文件列表
const chunkSize = pieceSize * 1024 * 1024; // 5MB一片
const chunkCount = Math.ceil(file.size / chunkSize); // 总片数
// 获取md5
const readFileMD5 = () => {
// 读取视频文件的md5
console.log("获取文件的MD5值");
let fileRederInstance = new FileReader();
console.log("file", file);
fileRederInstance.readAsBinaryString(file);
fileRederInstance.addEventListener("load", (e) => {
let fileBolb = e.target.result;
fileMD5 = md5(fileBolb);
console.log("fileMD5", fileMD5);
console.log("文件未被上传,将分片上传");
readChunkMD5();
});
};
const getChunkInfo = (file, currentChunk, chunkSize) => {
let start = currentChunk * chunkSize;
let end = Math.min(file.size, start + chunkSize);
let chunk = file.slice(start, end);
return { start, end, chunk };
};
// 针对每个文件进行chunk处理
const readChunkMD5 = () => {
// 针对单个文件进行chunk上传
for (var i = 0; i < chunkCount; i++) {
const { chunk } = getChunkInfo(file, i, chunkSize);
console.log("总片数" + chunkCount);
console.log("分片后的数据---测试:" + i);
console.log(chunk);
uploadChunk({ chunk, currentChunk: i, chunkCount });
}
};
const uploadChunk = (chunkInfo) => {
// progressFun()
let config = {
headers: {
"Content-Type": "multipart/form-data"
}
};
// 创建formData对象,下面是结合不同项目给后端传入的对象。
let fetchForm = new FormData();
fetchForm.append("identifier", randoms);
fetchForm.append("chunkNumber", chunkInfo.currentChunk + 1);
fetchForm.append("chunkSize", chunkSize);
fetchForm.append("currentChunkSize", chunkInfo.chunk.size);
fetchForm.append("file", chunkInfo.chunk);
fetchForm.append("filename", file.name);
fetchForm.append("totalChunks", chunkInfo.chunkCount);
fetchForm.append("totalSize", chunkSize);
fetchForm.append("dataId", dataId);
// fetchForm.append('md5', fileMD5)
API.fileUpload(fetchForm, config)
.then((res) => {
console.log("分片上传返回信息:" + res);
if (res.code == 1) {
// 结合不同项目 将成功的信息返回出去,这里可变的是指 res.data[0]
success();
// 下面如果在项目中没有用到可以不用打开注释
// if (chunkInfo.currentChunk < chunkInfo.chunkCount - 1) {
// console.log("分片上传成功")
// } else {
// // 当总数大于等于分片个数的时候
// if ((chunkInfo.currentChunk + 1) == chunkInfo.chunkCount) {
// console.log("文件开始------合并成功")
// success(res.data[0])
// }
// }
} else {
console.log(res.message);
}
})
.catch((e) => {
error && error(e);
});
};
readFileMD5(); // 开始执行代码
};
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment