build

dist/colexiu.html

@@ -22,10 +22,10 @@
       display: block;
     }
   </style>
-  <script type="module" crossorigin src="./assets/colexiu-b528cb41.js"></script>
-  <link rel="modulepreload" crossorigin href="./assets/index-e266a786.js">
-  <link rel="modulepreload" crossorigin href="./assets/vue3-lottie.es-72654336.js">
-  <link rel="modulepreload" crossorigin href="./assets/index-e79eb738.js">
+  <script type="module" crossorigin src="./assets/colexiu-04fe49e5.js"></script>
+  <link rel="modulepreload" crossorigin href="./assets/index-aee05a52.js">
+  <link rel="modulepreload" crossorigin href="./assets/vue3-lottie.es-b19f5e18.js">
+  <link rel="modulepreload" crossorigin href="./assets/index-316a5563.js">
   <link rel="stylesheet" href="./assets/index-96963695.css">
   <link rel="stylesheet" href="./assets/colexiu-7ef7fd8c.css">
   <script type="module">import.meta.url;import("_").catch(()=>1);async function* g(){};window.__vite_is_modern_browser=true;</script>
@@ -38,7 +38,7 @@
   
   <script nomodule>!function(){var e=document,t=e.createElement("script");if(!("noModule"in t)&&"onbeforeload"in t){var n=!1;e.addEventListener("beforeload",(function(e){if(e.target===t)n=!0;else if(!e.target.hasAttribute("nomodule")||!n)return;e.preventDefault()}),!0),t.type="module",t.src=".",e.head.appendChild(t),t.remove()}}();</script>
   <script nomodule crossorigin id="vite-legacy-polyfill" src="./assets/polyfills-legacy-63a969f1.js"></script>
-  <script nomodule crossorigin id="vite-legacy-entry" data-src="./assets/colexiu-legacy-bf3e28a5.js">System.import(document.getElementById('vite-legacy-entry').getAttribute('data-src'))</script>
+  <script nomodule crossorigin id="vite-legacy-entry" data-src="./assets/colexiu-legacy-6a512e8e.js">System.import(document.getElementById('vite-legacy-entry').getAttribute('data-src'))</script>
 </body>
 
 </html>

dist/index.html

@@ -73,9 +73,9 @@
       }
     })
   </script>
-  <script type="module" crossorigin src="./assets/index-38cfc57a.js"></script>
-  <link rel="modulepreload" crossorigin href="./assets/index-e266a786.js">
-  <link rel="modulepreload" crossorigin href="./assets/index-e79eb738.js">
+  <script type="module" crossorigin src="./assets/index-cc1d1bc4.js"></script>
+  <link rel="modulepreload" crossorigin href="./assets/index-aee05a52.js">
+  <link rel="modulepreload" crossorigin href="./assets/index-316a5563.js">
   <link rel="stylesheet" href="./assets/index-96963695.css">
   <link rel="stylesheet" href="./assets/index-efde85b1.css">
   <script type="module">import.meta.url;import("_").catch(()=>1);async function* g(){};window.__vite_is_modern_browser=true;</script>
@@ -92,7 +92,7 @@
   
   <script nomodule>!function(){var e=document,t=e.createElement("script");if(!("noModule"in t)&&"onbeforeload"in t){var n=!1;e.addEventListener("beforeload",(function(e){if(e.target===t)n=!0;else if(!e.target.hasAttribute("nomodule")||!n)return;e.preventDefault()}),!0),t.type="module",t.src=".",e.head.appendChild(t),t.remove()}}();</script>
   <script nomodule crossorigin id="vite-legacy-polyfill" src="./assets/polyfills-legacy-63a969f1.js"></script>
-  <script nomodule crossorigin id="vite-legacy-entry" data-src="./assets/index-legacy-0bef09ff.js">System.import(document.getElementById('vite-legacy-entry').getAttribute('data-src'))</script>
+  <script nomodule crossorigin id="vite-legacy-entry" data-src="./assets/index-legacy-fda0501e.js">System.import(document.getElementById('vite-legacy-entry').getAttribute('data-src'))</script>
 </body>
 
 </html>

dist/orchestra.html

@@ -23,11 +23,11 @@
       transition: opacity .3s;
     }
   </style>
-  <script type="module" crossorigin src="./assets/orchestra-77d00a94.js"></script>
-  <link rel="modulepreload" crossorigin href="./assets/index-e266a786.js">
-  <link rel="modulepreload" crossorigin href="./assets/vue3-lottie.es-72654336.js">
+  <script type="module" crossorigin src="./assets/orchestra-74bea6be.js"></script>
+  <link rel="modulepreload" crossorigin href="./assets/index-aee05a52.js">
+  <link rel="modulepreload" crossorigin href="./assets/vue3-lottie.es-b19f5e18.js">
   <link rel="stylesheet" href="./assets/index-96963695.css">
-  <link rel="stylesheet" href="./assets/orchestra-a02eaebd.css">
+  <link rel="stylesheet" href="./assets/orchestra-b1847d4d.css">
   <script type="module">import.meta.url;import("_").catch(()=>1);async function* g(){};window.__vite_is_modern_browser=true;</script>
   <script type="module">!function(){if(window.__vite_is_modern_browser)return;console.warn("vite: loading legacy chunks, syntax error above and the same error below should be ignored");var e=document.getElementById("vite-legacy-polyfill"),n=document.createElement("script");n.src=e.src,n.onload=function(){System.import(document.getElementById('vite-legacy-entry').getAttribute('data-src'))},document.body.appendChild(n)}();</script>
 </head>
@@ -49,7 +49,7 @@
   
   <script nomodule>!function(){var e=document,t=e.createElement("script");if(!("noModule"in t)&&"onbeforeload"in t){var n=!1;e.addEventListener("beforeload",(function(e){if(e.target===t)n=!0;else if(!e.target.hasAttribute("nomodule")||!n)return;e.preventDefault()}),!0),t.type="module",t.src=".",e.head.appendChild(t),t.remove()}}();</script>
   <script nomodule crossorigin id="vite-legacy-polyfill" src="./assets/polyfills-legacy-63a969f1.js"></script>
-  <script nomodule crossorigin id="vite-legacy-entry" data-src="./assets/orchestra-legacy-39ae933f.js">System.import(document.getElementById('vite-legacy-entry').getAttribute('data-src'))</script>
+  <script nomodule crossorigin id="vite-legacy-entry" data-src="./assets/orchestra-legacy-0805ba2d.js">System.import(document.getElementById('vite-legacy-entry').getAttribute('data-src'))</script>
 </body>
 
 </html>

dist/share-orchestra-evaluating/index.css

@@ -0,0 +1,272 @@
+html, body{
+  margin: 0;
+  background: #ff8057;
+  min-height: 100vh;
+  background-image: url('./icons/header.png');
+  background-size: contain;
+  background-position: top center;
+  background-repeat: no-repeat;
+  font-family: PingFangSC-Regular, PingFang SC;
+  overflow-x: hidden;
+}
+
+:root{
+  --plyr-color-main: #ff8057;
+  --plyr-font-size-base: 30px;
+  --plyr-control-icon-size: 36px;
+  --plyr-range-thumb-height: 26px;
+  --plyr-control-spacing: 20px;
+  --plyr-font-size-small: 26px;
+  --plyr-video-background: transparent;
+}
+
+body{
+  padding-top: 1.80rem;
+  box-sizing: border-box;
+  padding-bottom: 0.10rem;
+}
+
+.content{
+  box-sizing: border-box;
+  width: 95%;
+  background-color: #fff;
+  border-radius: 0.10rem;
+  padding: 0.22rem 0.24rem;
+  margin: 0 2.5%;
+  position: relative;
+  overflow: hidden;
+  /* border: none;
+  box-shadow: none; */
+}
+
+.content .tag{
+  position: absolute;
+  top: -0.01rem;
+  right: 0.23rem;
+  width: 0.13rem;
+  height: 0.22rem;
+  background: url('./icons/tag.png') no-repeat center;
+  background-size: contain;
+}
+
+.content .userinfo{
+  display: flex;
+}
+
+.content .userinfo > img {
+  display: block;
+  width: 0.60rem;
+  height: 0.60rem;
+  margin-right: 0.15rem;
+  border-radius: 50%;
+}
+
+.content .userinfo .cont {
+  flex: 1;
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+}
+
+.content .userinfo .cont > p {
+  color: rgba(80, 80, 80, 1);
+  font-size: 0.14rem;
+  margin: 0;
+}
+
+.content .userinfo .cont > .name{
+  font-size: 0.18rem;
+  color: rgba(26, 26, 26, 1);
+}
+
+.content div.desc {
+  color: rgba(128, 128, 128, 1);
+  font-size: 0.14rem;
+  line-height: 1.5;
+  position: relative;
+  margin: 0;
+  margin-top: 0.20rem;
+  margin-left: 0.20rem;
+}
+
+.content div.desc::before {
+  content: "";
+  background: url('./icons/dot.png') no-repeat center;
+  background-size: contain;
+  display: block;
+  width: 0.06rem;
+  height: 0.06rem;
+  margin-right: 0.10rem;
+  position: absolute;
+  top: 0.06rem;
+  left: -0.14rem;
+}
+
+.content .tit{
+  font-size: 0.16rem;
+  color: #000;
+}
+
+.content .info{
+  font-size: 0.14rem;
+  color: #808080;
+}
+
+.video-container{
+  border-radius: 0.20rem;
+  border: 0.04rem solid #F3F3F3;
+  overflow: hidden;
+  margin-top: 0.17rem;
+}
+
+.video{
+  max-width: 100%;
+  width: 0.289rem;
+  margian: 0 auto;
+  display: block;
+}
+
+.plyr__control--overlaid{
+  background-color: rgba(0, 0, 0, .5)!important;
+}
+
+.plyr--stopped.plyr__poster-enabled .plyr__poster{
+  background-color: #fff!important;
+  background-size: 70%;
+}
+
+.line{
+  margin-top: 0.21rem;
+  width: 3.00rem;
+  height: 0.02rem;
+  border-top: 0.03rem dotted #ff8057;
+  position: relative;
+}
+
+.line::after,
+.line::before{
+  content: "";
+  display: block;
+  position: absolute;
+  width: 0.23rem;
+  height: 0.23rem;
+  border-radius: 100%;
+  background-color: #ff8057;
+  z-index: 2;
+}
+
+.line::after{
+  right: -0.46rem;
+  top: -0.12rem;
+}
+
+.line::before{
+  left: -0.38rem;
+  top: -0.12rem;
+}
+
+.app{
+  margin-top: 0.18rem;
+  display: flex;
+  justify-content: space-between;
+}
+
+.app-info {
+  padding: 0.10rem 0;
+  display: flex;
+  flex: 1;
+  flex-direction: column;
+  justify-content: space-around;
+}
+
+.app-title{
+  color: rgba(80, 80, 80, 1);
+  font-size: 0.18rem;
+  font-weight: bold;
+}
+
+.app-desc{
+  font-size: 0.16rem;
+  color: rgba(80, 80, 80, 1);
+}
+
+.app-desc > span{
+  color: #ff8057;
+  font-weight: bold;
+}
+
+.app-subtitle{
+  font-size: 0.12rem;
+  color: #fff;
+  background: #ff8057;
+  height: 0.20rem;
+  line-height: 0.20rem;
+  border-radius: 0.10rem;
+  padding-left: 0.05rem;
+  display: inline-block;
+  width: 1.70rem;
+  font-weight: bold;
+}
+
+.app > .img{
+  width: 0.96rem;
+  height: 0.96rem;
+  position: relative;
+  display: flex;
+}
+.app > .img #qrcode{
+  width: 100%;
+  height: 100%;
+}
+.app > .img .logo{
+  position: absolute;
+  top: .36rem;
+  left: .36rem;
+  width: .24rem;
+  height: .24rem;
+  border-radius: .04rem;
+}
+
+.video,
+.plyr__video-wrapper,
+.plyr,
+.plyr__poster,
+.plyr__video-wrapper{
+  border-radius: 0.20rem;
+  overflow: hidden;
+}
+
+.fraction{
+  display: flex;
+  margin: 0.10rem 0;
+  margin-left: 0.20rem;
+}
+
+.fraction .item{
+  display: flex;
+  color: #ff8057;
+  font-size: 0.10rem;
+  font-weight: bold;
+}
+
+.fraction .item .view{
+  flex: 1;
+  height: 0.16rem;
+  width: 1.37rem;
+  background: #F5F4F2;
+  border-radius: 0.04rem;
+  margin: 0 0.06rem;
+  position: relative;
+}
+
+.fraction .item .view>span{
+  display: block;
+  flex: 1;
+  height: 0.16rem;
+  width: 0%;
+  border-radius: 0.04rem;
+  background: linear-gradient(90deg, #FF9E7F 0%, #ff8057 100%);
+  position: absolute;
+  top: 0;
+  left: 0;
+}

dist/share-orchestra-evaluating/index.html

@@ -0,0 +1,111 @@
+<!DOCTYPE html>
+<html lang="zh">
+<head>
+  <meta charset="UTF-8">
+  <meta http-equiv="X-UA-Compatible" content="IE=edge">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0">
+  <meta name="description" content="酷乐秀APP，器乐学习的不二选择">
+  <title>酷乐秀</title>
+  <link rel="stylesheet" href="index.css">
+  <script src="../helpers/rem-fit.min.js"></script>
+  <script src="../helpers/qs.min.js"></script>
+  <script src="../helpers/html2canvas.js"></script>
+  <script src="../helpers/qrcode.js"></script>
+  <script>
+    var remFit = new RemFit(3.75,true)
+    remFit.init()
+    window.addEventListener('resize', function () {
+      remFit.init()
+    })
+    var parseSearch = Qs.parse(window.location.search, { ignoreQueryPrefix: true })
+  </script>
+  <!-- <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/plyr@3.6.8/dist/plyr.css"> -->
+</head>
+<body>
+  <div class="content">
+    <div class="tag"></div>
+    <div class="userinfo">
+      <img id="avatar" crossOrigin="anonymous"/>
+      <div class="cont">
+        <p class="name" id="name"></p>
+        <p class="sub" id="subjectName"></p>
+      </div>
+    </div>
+    <div class="desc">
+      <div class="tit">我用小酷Ai智能评测获得了<span id="score"></span>分！</div>
+      <div class="info" id="examSongName"></div>
+    </div>
+    <div class="fraction" style="display: none;">
+      <div class="item" id="intonation">
+        <div class="decs">音准</div>
+        <div class="view"><span id="intonation-view"></span></div>
+        <div class="val" id="intonation-val"></div>
+      </div>
+    </div>
+    <div class="fraction" style="display: none;">
+      <div class="item" id="cadence">
+        <div class="decs">节奏</div>
+        <div class="view"><span id="cadence-view"></span></div>
+        <div class="val" id="cadence-val"></div>
+      </div>
+    </div>
+    <div class="fraction" style="display: none;">
+      <div class="item" id="integrity">
+        <div class="decs">节奏</div>
+        <div class="view"><span id="integrity-view"></span></div>
+        <div class="val" id="integrity-val"></div>
+      </div>
+    </div>
+    <div class="line"></div>
+    <div class="app">
+      <div class="app-info">
+        <div class="app-title">酷乐秀</div>
+        <div class="app-desc">器乐学习的<span>不二选择</span></div>
+        <div class="app-subtitle">小酷Ai见证你的成长！</div>
+      </div>
+      <div class="img">
+        <img id="qrcode" src="./icons/qrcode.png"/>
+        <img class="logo" src="./icons/logo.png"/>
+      </div>
+    </div>
+  </div>
+  <script>
+    document.getElementById('avatar').src = (decodeURIComponent(parseSearch.avatar) || './icons/avatar.png') + '?v=' + parseInt(Math.random() * 10000000)
+    document.getElementById('name').innerText = parseSearch.name || ''
+    document.getElementById('subjectName').innerText = parseSearch.subjectName || ''
+    document.getElementById('examSongName').innerText = parseSearch.examSongName || ''
+    document.getElementById('score').innerText = parseSearch.score || ''
+    if (parseSearch.intonation) {
+      document.getElementById('intonation').parentElement.style.display = 'flex'
+      document.getElementById('intonation-val').innerText = parseSearch.intonation || ''
+      document.getElementById('intonation-view').style.width = parseSearch.intonation + '%' || ''
+    }
+    if (parseSearch.cadence) {
+      document.getElementById('cadence').parentElement.style.display = 'flex'
+      document.getElementById('cadence-val').innerText = parseSearch.cadence || ''
+      document.getElementById('cadence-view').style.width = parseSearch.cadence + '%' || ''
+    }
+    if (parseSearch.integrity) {
+      document.getElementById('integrity').parentElement.style.display = 'flex'
+      document.getElementById('integrity-val').innerText = parseSearch.integrity || ''
+      document.getElementById('integrity-view').style.width = parseSearch.integrity + '%' || ''
+    }
+
+    window.addEventListener('load', function () {
+      QRCode.toDataURL(location.origin + '/accompany/colexiu-report-share.html?id=' + (parseSearch.id || '') + '&musicId=' + (parseSearch.musicId || '') + '&client=web', { errorCorrectionLevel: 'H', width: 192 }, function (err, val) {
+        console.log(val)
+        document.getElementById('qrcode').setAttribute('src', val)
+        html2canvas(document.body)
+        .then((canvas) => canvas.toDataURL())
+        .then(res => {
+          // console.log(res)
+          if (window.setPng) {
+            window.setPng(res)
+          }
+        })
+      })
+    })
+  </script>
+  <!-- <script src="./index.js"></script> -->
+</body>
+</html>

dist/share-orchestra-evaluating/index.js

@@ -0,0 +1,10 @@
+;(function() {
+  new Plyr(document.querySelector('.video'), {
+    controls: ['play-large', 'play', 'progress', 'current-time', 'airplay', 'fullscreen',],
+    fullscreen: {
+      enabled: true,
+      fallback: true,
+      iosNative: true,
+    }
+  })
+})()