From 2583bfd2846e83dd0b31e515f5c5605c0b4c9f10 Mon Sep 17 00:00:00 2001
From: 康凯 <kangk26@foxmail.com>
Date: Fri, 17 Dec 2021 18:14:00 +0800
Subject: [PATCH] 更换文档在线浏览服务对象

---
 src/views/scenery/detail.vue |   96 +++++++++++++++++++++++++++++++++++++++++-------
 1 files changed, 82 insertions(+), 14 deletions(-)

diff --git a/src/views/scenery/detail.vue b/src/views/scenery/detail.vue
index 7ff3e7b..747e3ce 100644
--- a/src/views/scenery/detail.vue
+++ b/src/views/scenery/detail.vue
@@ -27,7 +27,9 @@
           </div>
         </mt-tab-container-item>
         <mt-tab-container-item id="2">
-          <CustomSearch3 v-on:search="SearchImages"></CustomSearch3>
+          <div class="search-div">
+            <CustomSearch3 v-on:search="SearchImages"></CustomSearch3>
+          </div>
           <div class="content-images"
                v-infinite-scroll="NextImages"
                :infinite-scroll-disabled="images.scrollDisabled"
@@ -44,7 +46,9 @@
           </div>
         </mt-tab-container-item>
         <mt-tab-container-item id="3">
-          <CustomSearch3 v-on:search="SearchVideos"></CustomSearch3>
+          <div class="search-div">
+            <CustomSearch3 v-on:search="SearchVideos"></CustomSearch3>
+          </div>
           <div class="content-videos"
                v-infinite-scroll="NextVideos"
                :infinite-scroll-disabled="videos.scrollDisabled"
@@ -61,6 +65,7 @@
                 <div class="item-introduce">{{ item.description }}</div>
               </div>
             </div>
+            <div class="line"></div>
           </div>
         </mt-tab-container-item>
       </mt-tab-container>
@@ -117,7 +122,8 @@
           window.open(fileUrl);
         } else {
           //https://view.officeapps.live.com/op/view.aspx?src=
-          window.open("http://www.xdocin.com/xdoc?_func=to&_format=html&_cache=1&_xdoc=" + fileUrl.replace(/\\/g, ''));
+          //http://www.xdocin.com/xdoc?_func=to&_format=html&_cache=1&_xdoc=
+          window.open("https://view.officeapps.live.com/op/view.aspx?src=" + fileUrl.replace(/\\/g, ''));
         }
       }
     },
@@ -239,6 +245,12 @@
 </script>
 
 <style scoped>
+.line {
+  width: 100%;
+  border: 1px solid #EEEEEE;
+  margin: 3vh 0;
+}
+
 .data-detail {
   width: 100%;
 }
@@ -323,35 +335,62 @@
 }
 
 .data-detail .content {
-  width: 90%;
-  height: 84.1vh;
-  margin-left: 5%;
-  border-radius: 30px;
+  display: flex;
+  flex-direction: column;
+  justify-content: flex-start;
+  align-items: center;
+
+  width: 100%;
+  height: 84vh;
+  background: #F8F8F8;
+}
+
+.mint-navbar {
+  width: 100%;
+}
+
+.mint-navbar /deep/ .mint-tab-item{
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  align-items: center;
+
+  padding: 7px 0;
 }
 
 .mint-navbar /deep/ .mint-tab-item-label {
+  width: 8rem;
   font-size: 2rem;
   font-family: Source Han Sans CN;
   font-weight: 500;
   line-height: 2rem;
   color: #767676;
   opacity: 1;
+
+  padding: 10px 0;
 }
 
 .mint-navbar /deep/ .is-selected {
   color: #BC0000;
-  border-bottom: 0.3vh solid #BC0000;
+  border-bottom: 0px;
 }
 
 .mint-navbar /deep/ .is-selected .mint-tab-item-label {
   color: #BC0000;
+  border-bottom: 0.3vh solid #BC0000;
+}
+
+.mint-tab-container {
+  width: 100%;
 }
 
 .mint-tab-container /deep/ .mint-tab-container-item:nth-child(1) {
-  padding-top: 5vh;
 }
 
 .content-keyword {
+  margin-top: 1vh;
+  padding: 5%;
+  background: #FFFFFF;
   text-align: left;
   font-size: 1.87rem;
   font-family: Source Han Serif CN;
@@ -372,6 +411,10 @@
 }
 
 .content-introduction {
+  margin-top: 1vh;
+  padding: 5% 5% 15% 5%;
+  border-radius: 0 0 30px 30px;
+  background: #FFFFFF;
   text-align: left;
   font-size: 1.87rem;
   font-family: Source Han Serif CN;
@@ -392,11 +435,12 @@
 }
 
 .mint-tab-container /deep/ .mint-tab-container-item:nth-child(2) {
-  padding-top: 2vh;
 }
 
-.custom-search3 {
-  margin-bottom: 2vh;
+.search-div {
+  background: #FFFFFF;
+  padding: 5%;
+  margin-bottom: 1vh;
 }
 
 .content-images {
@@ -405,9 +449,22 @@
   flex-direction: row;
   justify-content: flex-start;
   align-items: flex-start;
+  align-content:flex-start;
+
+  height: 65vh;
+  overflow: scroll;
+  padding-top: 2vh;
+  background: #FFFFFF;
+  border-radius: 0 0 30px 30px;
 }
 
 .content-images .content-item {
+  display: flex;
+  flex-wrap: wrap;
+  flex-direction: column;
+  justify-content: center;
+  align-items: center;
+
   width: 50%;
   height: 25vh;
 }
@@ -442,14 +499,25 @@
 }
 
 .mint-tab-container /deep/ .mint-tab-container-item:nth-child(3) {
-  padding-top: 2vh;
+
 }
 
 .content-videos {
   display: flex;
+  flex-wrap: wrap;
   flex-direction: column;
   justify-content: flex-start;
   align-items: center;
+
+  height: 65vh;
+  overflow: scroll;
+  padding-top: 4vh;
+  background: #FFFFFF;
+  border-radius: 0 0 30px 30px;
+}
+
+.content-videos .line{
+  width: 90%;
 }
 
 .content-videos .content-item {
@@ -460,7 +528,7 @@
   align-items: center;
 
   height: 10vh;
-  margin: 2vh auto;
+  width: 90%;
 }
 
 .content-videos .item-left {

--
Gitblit v1.9.3