Browse Source

报告列表样式修改

jwyu 2 years ago
parent
commit
edca0a756e
3 changed files with 59 additions and 2 deletions
  1. BIN
      src/assets/report_tag.png
  2. 29 1
      src/views/report/Index.vue
  3. 30 1
      src/views/report/Search.vue

BIN
src/assets/report_tag.png


+ 29 - 1
src/views/report/Index.vue

@@ -205,7 +205,11 @@ let filterSize=ref('30%')
         <!-- 报告列表 -->
         <div class="report-list-wrap" v-show="listState.secClassifyId!=0">
             <div class="item" v-for="item in listState.list" :key="item.id" @click="goReportDetail(item)">
-                <div class="title">{{item.title}}</div>
+                <div class="title">
+                    <span class="label">【NO.{{item.stage}}|FICC】</span>
+                    <span>{{item.title}}</span>
+                    <span v-if="item.create_time">({{item.create_time.substring(5,7)}}{{item.create_time.substring(8,10)}})</span>
+                </div>
                 <div class="intro">{{item.abstract}}</div>
                 <div class="time">{{item.publish_time}}</div>
             </div>
@@ -655,6 +659,23 @@ let filterSize=ref('30%')
             font-size: 20px;
             font-weight: 600;
             cursor: pointer;
+            .label{
+                display: inline-block;
+                background-image: url('@/assets/report_tag.png');
+                background-size: cover;
+                background-position: right center;
+                background-repeat: no-repeat;
+                color: #fff;
+                font-size: 12px;
+                padding-right: 20px;
+                padding-top: 3px;
+                padding-bottom: 3px;
+                box-sizing: border-box;
+                margin-right: 5px;
+            }
+            span{
+                vertical-align: middle;
+            }
         }
         .intro{
             font-size: 14px;
@@ -674,6 +695,13 @@ let filterSize=ref('30%')
             padding: 10px 0;
             .title{
                 font-size: 14px;
+                .label{
+                    font-size: 10px;
+                    padding-right: 20px;
+                    padding-top: 2px;
+                    padding-bottom: 2px;
+                    margin-right: 3px;
+                }
             }
             .intro{
                 margin-bottom: 10px;

+ 30 - 1
src/views/report/Search.vue

@@ -72,7 +72,11 @@ function goReportDetail(item){
         <div v-if="listState.list.length===0" class="empty">no results</div>
         <div class="report-list-wrap" v-else>
             <div class="item" v-for="item in listState.list" :key="item.id" @click="goReportDetail(item)">
-                <div class="title" v-html="item.title"></div>
+                <div class="title">
+                    <span class="label">【NO.{{item.stage}}|FICC】</span>
+                    <span v-html="item.title"></span>
+                    <span v-if="item.create_time">({{item.create_time.substring(5,7)}}{{item.create_time.substring(8,10)}})</span>
+                </div>
                 <div class="intro" v-html="item.content_sub"></div>
                 <div class="time">{{item.publish_time}}</div>
             </div>
@@ -141,6 +145,24 @@ function goReportDetail(item){
         .title{
             font-size: 20px;
             font-weight: 600;
+            cursor: pointer;
+            .label{
+                display: inline-block;
+                background-image: url('@/assets/report_tag.png');
+                background-size: cover;
+                background-position: right center;
+                background-repeat: no-repeat;
+                color: #fff;
+                font-size: 12px;
+                padding-right: 20px;
+                padding-top: 3px;
+                padding-bottom: 3px;
+                box-sizing: border-box;
+                margin-right: 5px;
+            }
+            span{
+                vertical-align: middle;
+            }
         }
         .intro{
             font-size: 14px;
@@ -163,6 +185,13 @@ function goReportDetail(item){
             padding: 10px 0;
             .title{
                 font-size: 14px;
+                .label{
+                    font-size: 10px;
+                    padding-right: 20px;
+                    padding-top: 2px;
+                    padding-bottom: 2px;
+                    margin-right: 3px;
+                }
             }
             .time{
                 font-size: 12px;