更新弹窗显示

dev-dist/sw.js

@@ -68,12 +68,7 @@ if (!self.define) {
     });
   };
 }
-<<<<<<< HEAD
 define(['./workbox-5357ef54'], (function (workbox) { 'use strict';
-=======
-define(['./workbox-ab7aa862'], function (workbox) {
-  'use strict';
->>>>>>> master
 
   self.skipWaiting();
   workbox.clientsClaim();
@@ -83,7 +78,6 @@ define(['./workbox-ab7aa862'], function (workbox) {
    * requests for URLs in the manifest.
    * See https://goo.gl/S9QRab
    */
-<<<<<<< HEAD
   workbox.precacheAndRoute([{
     "url": "registerSW.js",
     "revision": "3ca0b8505b4bec776b69afdba2768812"
@@ -91,21 +85,6 @@ define(['./workbox-ab7aa862'], function (workbox) {
     "url": "index.html",
     "revision": "0.5pln1ddsdpg"
   }], {});
-=======
-  workbox.precacheAndRoute(
-    [
-      {
-        url: 'registerSW.js',
-        revision: '3ca0b8505b4bec776b69afdba2768812'
-      },
-      {
-        url: 'index.html',
-        revision: '0.npjf49t2n6o'
-      }
-    ],
-    {}
-  );
->>>>>>> master
   workbox.cleanupOutdatedCaches();
   workbox.registerRoute(
     new workbox.NavigationRoute(workbox.createHandlerBoundToURL('index.html'), {

src/views/notation/index.module.less

@@ -1,11 +1,21 @@
-.wrap{
+.wrap {
+  width: 100%;
+  height: 100%;
+  background-color: #fff;
+  border-radius: 15px;
+
+  iframe {
     width: 100%;
     height: 100%;
-    background-color: #fff;
-    border-radius: 15px;
-    iframe{
-        width: 100%;
-        height: 100%;
-        border: none;
-    }
+    border: none;
+  }
+}
+
+.previewWindow {
+  width: 100%;
+  height: 100vh;
+
+  .previewIframe {
+    height: 100vh;
+  }
 }

src/views/notation/index.tsx

@@ -1,10 +1,15 @@
-import { defineComponent, onMounted, reactive } from 'vue';
+import { defineComponent, onMounted, reactive, ref } from 'vue';
 import { useUserStore } from '/src/store/modules/users';
 import styles from './index.module.less';
+import PreviewWindow from '../preview-window';
+import { state } from '/src/state';
+import { NModal } from 'naive-ui';
 
 export default defineComponent({
   name: 'notation-a',
   setup() {
+    const previewModal = ref(false);
+    const previewParams = ref({} as any);
     const userStore = useUserStore();
     const Authorization = userStore.getToken || '';
     console.log(Authorization);
@@ -19,7 +24,16 @@ export default defineComponent({
     });
     const handleOpen = (e: MessageEvent) => {
       if (e.data.api === 'notation_open') {
-        window.open(e.data.url);
+        console.log(e.data, state.application);
+        console.log(previewModal.value);
+        // if (!state.application) {
+        previewModal.value = true;
+        previewParams.value = {
+          url: e.data.url
+        };
+        // } else {
+        //   window.open(e.data.url);
+        // }
       }
     };
     onMounted(() => {
@@ -28,6 +42,16 @@ export default defineComponent({
     return () => (
       <div class={styles.wrap}>
         <iframe src={data.src}></iframe>
+
+        <NModal
+          v-model:show={previewModal.value}
+          class={styles.previewWindow}
+          showIcon={false}
+          displayDirective="show">
+          <iframe
+            class={styles.previewIframe}
+            src={previewParams.value.url}></iframe>
+        </NModal>
       </div>
     );
   }

src/views/preview-window/index.tsx

@@ -22,6 +22,7 @@ export default defineComponent({
   emit: ['update:show'],
   setup(props, { emit }) {
     const { show, type, params } = toRefs(props);
+    console.log(type.value, 'type');
     watch(
       () => props.show,
       () => {
@@ -63,6 +64,12 @@ export default defineComponent({
         ) : (
           ''
         )}
+        {/* 曲谱 */}
+        {type.value === 'notation' ? (
+          <iframe src={params.value.src}></iframe>
+        ) : (
+          ''
+        )}
       </NModal>
     );
   }