Halaman utama Jelajahi Bantuan
Masuk
jianyu
/
jy-docs
6
0
Fork 0
Berkas Masalah 0 Permintaan Tarik 0 Wiki
Jelajahi Sumber

fix: 样式调整

cuiyalong 4 tahun lalu
induk
b56ad72e67
melakukan
cea3a71dfb
13 mengubah file dengan 86 tambahan dan 22 penghapusan
Tampilan Split Tampilkan Statistik Diff
  1. TEMPAT SAMPAH
      jydocs-mobile/src/assets/icon/down-blue.png
  2. TEMPAT SAMPAH
      jydocs-mobile/src/assets/icon/down-grey.png
  3. 1 1
      jydocs-mobile/src/components/docs-card/Price.vue
  4. 12 3
      jydocs-mobile/src/views/Home.vue
  5. 4 1
      jydocs-mobile/src/views/Search.vue
  6. 8 1
      jydocs-pc/public/index.html
  7. TEMPAT SAMPAH
      jydocs-pc/src/assets/images/icon/down-blue.png
  8. TEMPAT SAMPAH
      jydocs-pc/src/assets/images/icon/down-grey.png
  9. 14 2
      jydocs-pc/src/components/doc-item-card/Card.vue
  10. 1 1
      jydocs-pc/src/components/doc-item-card/Price.vue
  11. 10 2
      jydocs-pc/src/views/Search.vue
  12. 17 5
      jydocs-pc/src/views/UserCollections.vue
  13. 19 6
      jydocs-pc/src/views/UserDocs.vue

TEMPAT SAMPAH
jydocs-mobile/src/assets/icon/down-blue.png
Tampilan Berkas


TEMPAT SAMPAH
jydocs-mobile/src/assets/icon/down-grey.png
Tampilan Berkas


+ 1 - 1
jydocs-mobile/src/components/docs-card/Price.vue
Tampilan Berkas 

@@ -35,7 +35,7 @@ export default class Price extends Vue {
 
     font-size: 14px;
 
     color: #ff3a20;
 
     &.bought {
 
-      color: $color_main;
 
+      color: #686868;
 
     }
 
   }
 
 }

+ 12 - 3
jydocs-mobile/src/views/Home.vue
Tampilan Berkas 

@@ -4,7 +4,7 @@
 
     <div class="new-group base-group">
 
       <div class="title-group flex-r-c center left">
 
         <span></span>
 
-        <h5>最新文档</h5>
 
+        <h5 class="module-title">最新文档</h5>
 
       </div>
 
       <div class="list-group flex-c-c">
 
         <van-skeleton class="van-loading-skeleton line-style" :row="5" :loading="showLoading.new">
 
@@ -26,7 +26,7 @@
 
     <div class="hot-group base-group">
 
       <div class="title-group flex-r-c center left">
 
         <span></span>
 
-        <h5>热门下载</h5>
 
+        <h5 class="module-title">热门下载</h5>
 
       </div>
 
       <div class="list-group flex-c-c">
 
         <van-skeleton class="van-loading-skeleton line-style" :row="5" :loading="showLoading.hot">
 
@@ -48,7 +48,7 @@
 
     <div class="keep-group base-group">
 
       <div class="title-group flex-r-c center left">
 
         <span></span>
 
-        <h5>精选推荐</h5>
 
+        <h5 class="module-title">精选推荐</h5>
 
       </div>
 
       <div class="list-group card-group flex-c-c">
 
         <van-skeleton avatar avatar-shape="square" class="van-loading-skeleton card-style"
 
@@ -148,13 +148,22 @@ export default class extends Vue {
 
   padding-bottom: 40px;
 
   box-sizing: border-box;
 
 
+  .module-title {
 
+    font-size: 18px;
 
+    font-weight: normal;
 
+    line-height: 26px;
 
+    color: #171826;
 
+  }
 
+
 
   .d-title {
 
     font-size: 14px;
 
     line-height: 20px;
 
+    color: #171826;
 
   }
 
   .price-text {
 
     font-size: 13px;
 
     line-height: 28px;
 
+    color: #5F5E64;
 
   }
 
 
   ::v-deep .van-loading-skeleton {

+ 4 - 1
jydocs-mobile/src/views/Search.vue
Tampilan Berkas 

@@ -23,7 +23,7 @@
 
           @click="sortAndSearch(item, index)"
 
         >
 
           <span class="s-i-label">{{ item.label }}</span>
 
-          <van-icon name="down" class="s-i-icon" />
 
+          <van-icon :name="'diy-down-' + (item.active ? 'blue' : 'grey')" class="s-i-icon" />
 
         </div>
 
       </div>
 
     </div>
 
@@ -332,6 +332,9 @@ export default class extends Vue {
 
 }
 
 </script>
 
 <style scoped lang="scss">
 
+@include diy-icon('down-grey', 16, 16);
 
+@include diy-icon('down-blue', 16, 16);
 
+
 
 .pages--search {
 
   background-color: #F5F6F7;
 
   box-sizing: border-box;

+ 8 - 1
jydocs-pc/public/index.html
Tampilan Berkas 

@@ -27,7 +27,14 @@
 
       <link href='https://web2-jytest.jydev.jianyu360.com/pccss/public-nav-1200.css?v=6302' rel="stylesheet" type="text/css"/>
 
     <% } %>
 
   </head>
 
-  <body>
 
+  <style>
 
+    .docs-app {
 
+      margin: 0 auto;
 
+      width: 1200px;
 
+      max-width: 1200px;
 
+    }
 
+  </style>
 
+  <body style="background-color: #fff;">
 
     <noscript>
 
       <strong>We're sorry but app1 doesn't work properly without JavaScript enabled. Please enable it to continue.</strong>
 
     </noscript>

TEMPAT SAMPAH
jydocs-pc/src/assets/images/icon/down-blue.png
Tampilan Berkas


TEMPAT SAMPAH
jydocs-pc/src/assets/images/icon/down-grey.png
Tampilan Berkas


+ 14 - 2
jydocs-pc/src/components/doc-item-card/Card.vue
Tampilan Berkas 

@@ -97,7 +97,7 @@ export default {
 
       default: ''
 
     },
 
     docType: {
 
-      type: String,
 
+      type: [String, Number],
 
       default: 'pdf'
 
     },
 
     subInfo: {
 
@@ -148,12 +148,24 @@ export default {
 
 <!-- Add "scoped" attribute to limit CSS to this component only -->
 
 <style lang="scss" scoped>
 
 .docs-card {
 
+  position: relative;
 
   width: 100%;
 
   padding: 18px;
 
   font-size: 14px;
 
   line-height: 24px;
 
-  border-bottom: 1px solid rgba($color: #000, $alpha: 0.05);
 
+  // border-bottom: 1px solid rgba($color: #000, $alpha: 0.05);
 
   cursor: pointer;
 
+  border-radius: 8px;
 
+  overflow: hidden;
 
+  &:after {
 
+    content: '';
 
+    position: absolute;
 
+    bottom: 0;
 
+    left: 18px;
 
+    width: calc(100% - 36px);
 
+    height: 1px;
 
+    background-color: rgba($color: #000, $alpha: 0.05);
 
+  }
 
 
   .card-desc,
 
   .card-title {

+ 1 - 1
jydocs-pc/src/components/doc-item-card/Price.vue
Tampilan Berkas 

@@ -21,7 +21,7 @@ export default {
 
 .price-container {
 
   display: flex;
 
   align-items: center;
 
-  @include diy-icon("iconLogoLight");
 
+  @include diy-icon("iconLogoLight", 22, 22);
 
 
   .p-r {
 
     margin-left: 4px;

+ 10 - 2
jydocs-pc/src/views/Search.vue
Tampilan Berkas 

@@ -8,10 +8,10 @@
 
           v-for="(item, index) in sortTypeList"
 
           :key="index"
 
           @click="sortAndSearch(item, index)"
 
-          :class="{ active: item.active }"
 
+          :class="{ active: item.active, reverse: item.sort }"
 
         >
 
           <span class="sort-text">{{ item.label }}</span>
 
-          <span class="sort-icon" :class="item.sort ? 'el-icon-top' : 'el-icon-bottom'"></span>
 
+          <span class="sort-icon" :class="'el-icon-jy-' + (item.active ? 'down-blue' : 'down-grey')"></span>
 
         </span>
 
       </div>
 
       <div class="search-result-list" v-loading="listState.loading">
 
@@ -198,6 +198,9 @@ export default {
 
 }
 
 </script>
 
 <style lang="scss" scoped>
 
+@include diy-icon('down-grey', 18, 18);
 
+@include diy-icon('down-blue', 18, 18);
 
+
 
 .search-container {
 
   padding-top: 48px;
 
 }
 
@@ -224,6 +227,11 @@ export default {
 
       .sort-icon {
 
         color: #aaa;
 
       }
 
+      &.reverse {
 
+        .sort-icon {
 
+          transform: rotate(180deg);
 
+        }
 
+      }
 
       &.active {
 
         .sort-text,
 
         .sort-icon {

+ 17 - 5
jydocs-pc/src/views/UserCollections.vue
Tampilan Berkas 

@@ -15,7 +15,7 @@
 
           @onClick="toDocDetail(item)"
 
         >
 
           <template slot="price">
 
-            <div class="highlight-text" v-if="item.Cost === '已购买'">已购买</div>
 
+            <div class="bought" v-if="item.Cost === '已购买'">已购买</div>
 
             <Price v-else :price="item.Cost" />
 
           </template>
 
         </doc-card>
 
@@ -92,10 +92,12 @@ export default {
 
     },
 
     toDocDetail (item) {
 
       const { DocId: id } = item
 
-      this.$router.push({
 
-        name: 'content',
 
-        params: { id }
 
-      })
 
+      // this.$router.push({
 
+      //   name: 'content',
 
+      //   params: { id }
 
+      // })
 
+      window.open(`../content/${id}`) // 打开新窗口
 
+      // window.open(`${process.env.VUE_APP_BASE_URL}/content/${id}`) // 打开新窗口
 
     },
 
     onPageChange (p) {
 
       this.listState.pageNum = p
 
@@ -145,6 +147,16 @@ export default {
 
     .user-d-list {
 
       border-top: 1px solid transparent;
 
       min-height: 500px;
 
+      ::v-deep {
 
+        .docs-card {
 
+          margin-left: -18px;
 
+          box-sizing: content-box;
 
+          width: 1200px;
 
+        }
 
+      }
 
+    }
 
+    .bought {
 
+      color: #686868;
 
     }
 
     .u-d-h-r {
 
       display: inline-block;

+ 19 - 6
jydocs-pc/src/views/UserDocs.vue
Tampilan Berkas 

@@ -92,10 +92,12 @@ export default {
 
     },
 
     toDocDetail (item) {
 
       const { DocId: id } = item
 
-      this.$router.push({
 
-        name: 'content',
 
-        params: { id }
 
-      })
 
+      // this.$router.push({
 
+      //   name: 'content',
 
+      //   params: { id }
 
+      // })
 
+      window.open(`../content/${id}`) // 打开新窗口
 
+      // window.open(`${process.env.VUE_APP_BASE_URL}/content/${id}`) // 打开新窗口
 
     },
 
     onPageChange (p) {
 
       this.listState.pageNum = p
 
@@ -145,14 +147,25 @@ export default {
 
     .user-d-list {
 
       border-top: 1px solid transparent;
 
       min-height: 500px;
 
+      ::v-deep {
 
+        .docs-card {
 
+          margin-left: -18px;
 
+          box-sizing: content-box;
 
+          width: 1200px;
 
+        }
 
+      }
 
+    }
 
+    .bought {
 
+      color: #686868;
 
     }
 
     .u-d-h-r {
 
       display: inline-block;
 
-      width: 170px;
 
+      width: 155px;
 
       .u-d-h-item {
 
         display: inline-block;
 
-        width: 50%;
 
+        width: 55%;
 
         &.size {
 
+          width: 45%;
 
           text-align: center;
 
         }
 
       }