lex 1 年間 前
コミット
8f4f43917e
2 ファイル変更23 行追加13 行削除
  1. 20 10
      src/components/card-preview/index.tsx
  2. 3 3
      src/views/notation/index.tsx

+ 20 - 10
src/components/card-preview/index.tsx

@@ -1,5 +1,5 @@
-import { NModal } from 'naive-ui';
-import { defineComponent, toRef, watch } from 'vue';
+import { NModal, NSpin } from 'naive-ui';
+import { defineComponent, ref, toRef, watch } from 'vue';
 import styles from './index.module.less';
 import VideoModal from './video-modal';
 import MusicModal from './music-modal';
@@ -22,6 +22,7 @@ export default defineComponent({
   setup(props, { emit }) {
     const show = toRef(props.show);
     const item = toRef(props.item);
+    const pptLoading = ref(true);
 
     watch(
       () => props.show,
@@ -42,6 +43,9 @@ export default defineComponent({
           v-model:show={show.value}
           onUpdate:show={() => {
             emit('update:show', show.value);
+            if (!show.value) {
+              pptLoading.value = true;
+            }
           }}
           preset="card"
           showIcon={false}
@@ -58,14 +62,20 @@ export default defineComponent({
           {item.value.type === 'MUSIC' && <MusicModal item={item.value} />}
           {item.value.type === 'SONG' && <SongModal item={item.value} />}
           {item.value.type === 'PPT' && (
-            <iframe
-              class={styles.pptBox}
-              src={`https://view.officeapps.live.com/op/embed.aspx?src=${encodeURIComponent(
-                item.value.content
-              )}`}
-              width="100%"
-              height="100%"
-              frameborder="1"></iframe>
+            <NSpin show={pptLoading.value}>
+              <iframe
+                class={styles.pptBox}
+                src={`https://view.officeapps.live.com/op/embed.aspx?src=${encodeURIComponent(
+                  item.value.content
+                )}`}
+                onLoad={() => {
+                  console.log('loading end');
+                  pptLoading.value = false;
+                }}
+                width="100%"
+                height="100%"
+                frameborder="1"></iframe>
+            </NSpin>
           )}
           {!['VIDEO', 'MUSIC', 'SONG', 'PPT'].includes(item.value.type) && (
             <TheEmpty />

+ 3 - 3
src/views/notation/index.tsx

@@ -24,9 +24,9 @@ export default defineComponent({
       src: `${
         /(192|localhost)/.test(location.origin)
           ? // ?
-            // 'https://test.lexiaoya.cn'
-            'http://localhost:3050'
-          : location.origin
+            'https://test.lexiaoya.cn'
+          : // 'http://localhost:3050'
+            location.origin
       }/notation/#/create?v=${Date.now()}&Authorization=${Authorization}${openCreateUrl}`
       //   src: `http://localhost:3050/#/create?Authorization=${Authorization}`
     });