| 
					
				 | 
			
			
				@@ -0,0 +1,174 @@ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+import { defineComponent } from 'vue'; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+import styles from './index.module.less'; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+import { NButton, NScrollbar } from 'naive-ui'; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+import w1 from './images/window/1.png'; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+import w2 from './images/window/2.png'; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+import w3 from './images/window/3.png'; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+import w4 from './images/window/4.png'; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+import w5 from './images/window/5.png'; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+import w6 from './images/window/6.png'; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+import w7 from './images/window/7.png'; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+import m1 from './images/mac/1.png'; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+import m2 from './images/mac/2.png'; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+import m3 from './images/mac/3.png'; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+import m4 from './images/mac/4.png'; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+import m5 from './images/mac/5.png'; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+import { browser } from '/src/helpers/utils'; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+export default defineComponent({ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  name: 'the-auth', 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  emits: ['close'], 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  setup(props, { emit }) { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    // 下载证书 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    const onDownload = () => { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      // const agent = navigator.userAgent.toLowerCase(); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      const isMac = (function () { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        return /macintosh|mac os x/i.test(navigator.userAgent); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      })(); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      if (isMac) { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        window.open('https://oss.dayaedu.com/https-ssl/安全证书.cer'); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      } else { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        window.open('https://oss.dayaedu.com/https-ssl/安全证书.pfx'); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      // emit('close'); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    }; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    return () => ( 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      <div class={styles.theAuth}> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        <div class={styles.theTitle}></div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        <i class={styles.iconClose} onClick={() => emit('close')}></i> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        <div class={styles.authContent}> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          <div class={styles.steps}> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+            <NScrollbar> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+              <div class={styles.step}> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+                <div class={styles.stepNum}>01</div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+                <div class={styles.stepContent}> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+                  <p class={styles.txt}> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+                    点击下方下载按钮,下载数据安全证书安装包 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+                  </p> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+                </div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+              </div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+              {browser().ios ? ( 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+                <> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+                  <div class={styles.step}> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+                    <div class={styles.stepNum}>02</div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+                    <div class={styles.stepContent}> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+                      <p class={styles.txt}> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+                        双击<span>《安全证书.cer》</span> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+                      </p> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+                      <div class={styles.imgs}> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+                        <img src={m1} class={styles.m1} /> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+                      </div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+                      <p class={styles.txt}> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+                        输入钥匙串密码,点击<span>【修改钥匙串】</span> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+                        (若无此步骤则忽略) 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+                      </p> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+                      <div class={styles.imgs}> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+                        <img src={m2} class={styles.m2} /> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+                      </div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+                    </div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+                  </div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+                  <div class={styles.step}> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+                    <div class={styles.stepNum}>03</div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+                    <div class={styles.stepContent}> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+                      <p class={styles.txt}> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+                        <span class={styles.red}>重启浏览器</span> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+                        (在电脑屏幕左上方选择当前浏览器并点击 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+                        <span>【退出】</span>),再重新打开音乐数字课堂网址 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+                      </p> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+                      <div class={styles.imgs}> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+                        <img src={m3} class={styles.m3} /> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+                      </div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+                    </div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+                  </div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+                  <div class={styles.step}> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+                    <div class={styles.stepNum}>04</div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+                    <div class={styles.stepContent}> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+                      <p class={styles.txt}> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+                        在【选择证书】弹窗中点击<span>【确定】</span> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+                        按钮(若浏览器没有弹出该弹窗请 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+                        <span class={styles.red}>重启电脑</span> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+                        后重试) 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+                      </p> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+                      <div class={styles.imgs}> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+                        <img src={m4} class={styles.m4} /> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+                      </div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+                      <p class={styles.txt}> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+                        输入电脑的用户名和密码(若无此步骤则忽略) 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+                      </p> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+                      <div class={styles.imgs}> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+                        <img src={m5} class={styles.m5} /> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+                      </div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+                    </div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+                  </div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+                </> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+              ) : ( 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+                <> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+                  <div class={styles.step}> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+                    <div class={styles.stepNum}>02</div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+                    <div class={styles.stepContent}> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+                      <p class={styles.txt}> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+                        双击<span>《安全证书.pfx》</span>,一直点击 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+                        <span>【下一步】</span>,直至<span>【完成】</span> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+                      </p> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+                      <div class={styles.imgs}> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+                        <img src={w1} class={styles.w1} /> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+                        <div class={styles.moreImg}> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+                          <img src={w2} /> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+                          <img src={w3} /> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+                          <img src={w4} /> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+                          <img src={w5} /> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+                        </div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+                        <img src={w6} class={styles.w6} /> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+                      </div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+                    </div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+                  </div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+                  <div class={styles.step}> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+                    <div class={styles.stepNum}>03</div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+                    <div class={styles.stepContent}> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+                      <p class={styles.txt}> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+                        <span class={styles.red}>重启浏览器</span> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+                        ,打开音乐数字课堂网址 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+                      </p> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+                    </div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+                  </div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+                  <div class={styles.step}> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+                    <div class={styles.stepNum}>04</div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+                    <div class={styles.stepContent}> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+                      <p class={styles.txt}> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+                        在【选择证书】弹窗中点击<span>【确定】</span> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+                        按钮(若浏览器没有弹出该弹窗请 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+                        <span class={styles.red}>重启电脑</span> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+                        后重试) 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+                      </p> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+                      <img src={w7} class={styles.w7} /> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+                    </div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+                  </div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+                </> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+              )} 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+              <div class={styles.step}> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+                <div class={styles.stepNum}>05</div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+                <div class={styles.stepContent}> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+                  <p class={styles.txt}> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+                    证书安装完成,开始使用音乐数字课堂吧。 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+                  </p> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+                </div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+              </div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+            </NScrollbar> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          </div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          <div class={styles.btnGroup}> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+            <NButton round type="primary" onClick={onDownload}> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+              下载证书 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+            </NButton> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          </div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        </div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      </div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    ); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+}); 
			 |