Quellcode durchsuchen

feat: 上传资源支持ppt类型

TIANYONG vor 1 Jahr
Ursprung
Commit
cc0e354a46

BIN
src/common/images/icon-ppt.png


+ 6 - 0
src/components/card-preview/index.module.less

@@ -16,4 +16,10 @@
       text-overflow: ellipsis;
     }
   }
+}
+.maxCard {
+  width: 1200px;
+  .pptBox {
+    height: 700px;
+  }
 }

+ 3 - 3
src/components/card-preview/index.tsx

@@ -45,7 +45,7 @@ export default defineComponent({
           }}
           preset="card"
           showIcon={false}
-          class={['modalTitle background', styles.cardPreview]}
+          class={['modalTitle background', styles.cardPreview, item.value.type === 'PPT' && styles.maxCard]}
           title={item.value.title}
           blockScroll={false}>
           {item.value.type === 'VIDEO' && (
@@ -53,8 +53,8 @@ export default defineComponent({
           )}
           {item.value.type === 'MUSIC' && <MusicModal item={item.value} />}
           {item.value.type === 'SONG' && <SongModal item={item.value} />}
-
-          {!['VIDEO', 'MUSIC', 'SONG'].includes(item.value.type) && (
+          {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>}  
+          {!['VIDEO', 'MUSIC', 'SONG', 'PPT'].includes(item.value.type) && (
             <TheEmpty />
           )}
         </NModal>

+ 9 - 1
src/components/card-type/index.tsx

@@ -5,6 +5,7 @@ import iconImage from '@common/images/icon-image.png';
 import iconVideo from '@common/images/icon-video.png';
 import iconAudio from '@common/images/icon-audio.png';
 import iconMusic from '@common/images/icon-music.png';
+import iconPPT from '@common/images/icon-ppt.png';
 import iconCollectDefault from '@common/images/icon-collect-default.png';
 import iconCollectActive from '@common/images/icon-collect-active.png';
 import TheNoticeBar from '../TheNoticeBar';
@@ -13,7 +14,7 @@ import VideoPlayer from './video-player';
 
 type itemType = {
   id: string | number;
-  type: 'IMG' | 'VIDEO' | 'SONG' | 'MUSIC';
+  type: 'IMG' | 'VIDEO' | 'SONG' | 'MUSIC' | 'PPT';
   coverImg: string;
   content?: string;
   title: string;
@@ -99,6 +100,9 @@ export default defineComponent({
         case 'MUSIC':
           typeImg = iconMusic;
           break;
+        case 'PPT':
+          typeImg = iconPPT;
+          break;          
       }
       return typeImg;
     };
@@ -183,6 +187,10 @@ export default defineComponent({
                     previewDisabled={props.disabledMouseHover}
                   />
                 )}
+                {/* ppt */}
+                {/* {props.item.type === 'PPT' && (
+                  <iframe src={`https://view.officeapps.live.com/op/embed.aspx?src=${encodeURIComponent(props.item.content)}`} width='100%' height='100%' frameborder='1'></iframe>
+                )}                 */}
               </>
             ),
             footer: () => (

+ 2 - 1
src/enums/pageEnum.ts

@@ -25,5 +25,6 @@ export enum NaturalTypeEnum {
   IMG = 'IMG',
   VIDEO = 'VIDEO',
   MUSIC = 'MUSIC',
-  SONG = 'SONG'
+  SONG = 'SONG',
+  PPT = 'PPT'
 }

+ 2 - 1
src/utils/contants.ts

@@ -26,7 +26,8 @@ export const resourceType = {
   MUSIC: '乐谱',
   IMG: '图片',
   SONG: '音频',
-  VIDEO: '视频'
+  VIDEO: '视频',
+  PPT: 'PPT'
 };
 
 /**

+ 8 - 1
src/views/attend-class/index.tsx

@@ -279,6 +279,7 @@ export default defineComponent({
     };
 
     onMounted(() => {
+      // debugger
       // initMoveable();
       const query = route.query;
       console.log(query, props.preStudentNum, '学生人数');
@@ -555,6 +556,7 @@ export default defineComponent({
       acitveTimer.value = setTimeout(
         () => {
           const item = data.itemList[index];
+          
           if (item) {
             if (item.type == 'MUSIC') {
               activeData.model = true;
@@ -582,6 +584,9 @@ export default defineComponent({
                 data.animationState = 'end'
               });
             }
+            if (item.type === 'PPT') {
+              //
+            }
           }
         },
         activeData.isAnimation ? 800 : 0
@@ -1203,7 +1208,9 @@ export default defineComponent({
                             }
                           }}
                         />
-                      ) : (
+                      ) 
+                      : m.type === 'PPT' ? <iframe src={`https://view.officeapps.live.com/op/embed.aspx?src=${encodeURIComponent(m.content)}`} width='100%' height='100%' frameborder='1'></iframe>
+                      : (
                         <MusicScore
                           activeModel={activeData.model}
                           activeStatus={popupData.activeIndex === mIndex}

+ 4 - 2
src/views/natural-resources/components/my-resources/save-modal/index.tsx

@@ -97,6 +97,8 @@ export default defineComponent({
         ? NaturalTypeEnum.SONG
         : file.type.includes('video')
         ? NaturalTypeEnum.VIDEO
+        : file.type.includes('vnd.openxmlformats-officedocument.presentationml.presentation') || file.type.includes('vnd.ms-powerpoint')
+        ? NaturalTypeEnum.PPT
         : 'other';
 
       console.log(type, 'type');
@@ -323,7 +325,7 @@ export default defineComponent({
           // }}
           customRequest={onCustomRequest}
           v-model:fileList={fileListRef.value}
-          accept=".jpg,jpeg,.png,audio/mp3,video/mp4"
+          accept=".jpg,jpeg,.png,audio/mp3,video/mp4,application/vnd.ms-powerpoint,application/vnd.openxmlformats-officedocument.presentationml.presentation"
           multiple={true}
           max={10}
           // disabled={props.disabled}
@@ -339,7 +341,7 @@ export default defineComponent({
               <div class={styles.iconUploadAdd} />
               <h3>点击或者拖动文件到该区域来上传</h3>
               <p>
-                仅支持JPG、PNG、MP3、MP4格式文件,单次最多支持
+                仅支持JPG、PNG、MP3、MP4、PPT格式文件,单次最多支持
                 <br />
                 上传10个文件
               </p>

+ 6 - 0
src/views/natural-resources/components/my-resources/upload-modal/index.tsx

@@ -25,6 +25,7 @@ import iconImage from '@common/images/icon-image.png';
 import iconVideo from '@common/images/icon-video.png';
 import iconAudio from '@common/images/icon-audio.png';
 import iconMusic from '@common/images/icon-music.png';
+import iconPPT from '@common/images/icon-ppt.png';
 import iconUploadDelete from '../../../images/btn-remove.png';
 import { materialSave, materialUpdateAll } from '../../../api';
 import { NaturalTypeEnum } from '@/enums/pageEnum';
@@ -37,6 +38,8 @@ export const formatUrlType = (url: string) => {
     return NaturalTypeEnum.SONG;
   } else if (url?.indexOf('.mp4') > -1) {
     return NaturalTypeEnum.VIDEO;
+  } else if (url?.indexOf('.ppt') > -1) {
+    return NaturalTypeEnum.PPT;
   } else {
     return NaturalTypeEnum.IMG;
   }
@@ -86,6 +89,9 @@ export default defineComponent({
         case 'MUSIC':
           typeImg = iconMusic;
           break;
+        case 'PPT':
+          typeImg = iconPPT;
+          break;          
       }
       return typeImg;
     };

+ 2 - 2
vite.config.ts

@@ -23,8 +23,8 @@ function resolve(dir: string) {
 }
 // https://vitejs.dev/config/
 // https://github.com/vitejs/vite/issues/1930 .env
-// const proxyUrl = 'https://dev.kt.colexiu.com/';
-const proxyUrl = 'https://test.lexiaoya.cn';
+const proxyUrl = 'https://dev.kt.colexiu.com/';
+// const proxyUrl = 'https://test.lexiaoya.cn';
 export default defineConfig({
   base: './',
   plugins: [