Ver código fonte

增加视频显示

快乐的梦鱼 1 mês atrás
pai
commit
cfd968ffa4
3 arquivos alterados com 12 adições e 1 exclusões
  1. 1 0
      server/api/article/[id].ts
  2. 4 0
      src/assets/scss/main.scss
  3. 7 1
      src/pages/page/[id].vue

+ 1 - 0
server/api/article/[id].ts

@@ -10,6 +10,7 @@ export interface IArticle {
   title: string;
   desc: string;
   image: string,
+  video?: string,
   images: string;
   seotitle: string;
   keywords: string;

+ 4 - 0
src/assets/scss/main.scss

@@ -726,6 +726,10 @@ footer {
       max-width: 100%;
     }
   }
+
+  video {
+    max-width: 100%;
+  }
 }
 
 /* 联系我们页面样式 */

+ 7 - 1
src/pages/page/[id].vue

@@ -74,7 +74,8 @@
 
                   <div class="content" v-html="articlesData.content.value.content">
                   </div>
-                  <a-empty v-if="!articlesData.content.value.content && !articlesData.content.value.image"
+                  <video v-if="articlesData.content.value.video" :src="articlesData.content.value.video" controls></video>
+                  <a-empty v-if="isEmpty"
                     description="暂无内容"
                   />
                 </div>
@@ -118,6 +119,11 @@ const articlesData = await useSSrSimpleDataLoader('articles' + articleId, async
   return res.data;
 });
 
+const isEmpty = computed(() => articlesData.content.value 
+  && !articlesData.content.value.content 
+  && !articlesData.content.value.image 
+  && !articlesData.content.value.video);
+
 watch(() => route.query.id, async (newVal, oldVal) => {
   if (newVal !== oldVal) {
     articlesData.loadData(undefined, true);