注册发行详情页面制作

src/assets/css/sprite.less

@@ -29,6 +29,7 @@
 .icon-message { width: 50px; height: 50px; background-position: -1770px -981px; }
 .icon-more { width: 10px; height: 18px; background-position: -2050px -775px; }
 .icon-password { width: 36px; height: 36px; background-position: -1864px -1169px; }
+.icon-pdf-icon { width: 46px; height: 28px; background-position: -1297px -670px; }
 .icon-pdf { width: 46px; height: 60px; background-position: -1696px -1055px; }
 .icon-photo-default { width: 124px; height: 124px; background-position: -1232px -526px; }
 .icon-progress-act { width: 36px; height: 36px; background-position: -1920px -1169px; }
@@ -43,5 +44,4 @@
 .icon-user-question { width: 32px; height: 36px; background-position: -1920px -1225px; }
 .icon-user { width: 36px; height: 36px; background-position: -1808px -1225px; }
 .icon-verification { width: 36px; height: 36px; background-position: -1864px -1225px; }
-.icon-wechat { width: 80px; height: 78px; background-position: -1940px -847px; }
-.icon-pdf-icon { width: 46px; height: 28px; background-position: -1297px -670px; }
\ No newline at end of file
+.icon-wechat { width: 80px; height: 78px; background-position: -1940px -847px; }
\ No newline at end of file

src/views/infoDisclosure/components/infoDisclosureList.vue

@@ -51,12 +51,7 @@ export default {
       this.loading = false
     },
     jumpDetail(id) {
-      this.$router.push({
-        name: 'RegIssueDetail',
-        query: {
-          id
-        }
-      })
+      // todo pdf
     }
   }
 }

src/views/regIssue/components/DetailList.vue

 <template>
   <div class="list_container">
-    <!-- {{type}} -->
-    <div class="item" v-for="(item,index) in list" :key="index">
+    <div class="item" v-for="(item,index) in list" :key="index" v-show="type==1">
       <h2>{{item.title}}</h2>
       <div class="item_child">
         <div class="child" v-for="(childItem,childIndex) in item.arr" :key="childIndex" @click="jumpPdfDetail(childItem)">
@@ -10,8 +9,19 @@
         </div>
       </div>
     </div>
-    <div class="item-other">
-      1
+    <div class="item-other" v-show="type!=1">
+      <div class="file-item" v-for="(item,index) in fileList" :key="index" @click="jumpPdfDetail(item)">
+        <div class="file-title">
+          <img :src="pdfIcon2">
+          <span>{{item.title}}</span>
+        </div>
+        <div class="file-time">
+          <div class="file-item-right">
+            <img :src="timeUpdateIcon" alt="">
+            <span>更新日期：{{item.time}}</span>
+          </div>
+        </div>
+      </div>
     </div>
   </div>
 </template>
@@ -21,12 +31,13 @@ export default {
   props: {
     type: {
       type: String,
-      default: '1'
     }
   },
   data() {
     return {
       pdfIcon: require('@/assets/icon/pdf_icon.png'),
+      pdfIcon2: require('@/assets/icon/pdf.png'),
+      timeUpdateIcon: require('@/assets/icon/time_update.png'),
       list: [
         {
           title: '无锡产业发展集团有限公司2020年三季度财务报表',
@@ -49,6 +60,23 @@ export default {
             { time: '2021.4.13', title: '终稿' },
           ]
         }
+      ],
+      fileList: [
+        {
+          id: 1,
+          title: '【初稿】无锡产业发展集团有限公司2020年三季度财务报表',
+          time: '2021-4-12 '
+        },
+        {
+          id: 2,
+          title: '【初稿】无锡产业发展集团有限公司2020年三季度财务报表',
+          time: '2021-4-13 '
+        },
+        {
+          id: 3,
+          title: '【初稿】无锡产业发展集团有限公司2020年三季度财务报表',
+          time: '2021-4-14 '
+        }
       ]
     }
   },
@@ -124,4 +152,47 @@ export default {
     }
   }
 }
+.file-item {
+  border-radius: 8px;
+  background-color: #fff;
+  box-shadow: 0px 0px 6px 0px rgba(2, 15, 41, 0.06);
+  .file-title {
+    padding: 10px 15px 10px 0;
+    margin-left: 15px;
+    border-bottom: 1px solid #efefef;
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    img {
+      width: 22px;
+      height: 29px;
+      margin-right: 10px;
+    }
+    span {
+      font-size: 13px;
+      color: #388de2;
+      text-decoration: underline;
+      flex: 1;
+    }
+  }
+}
+.file-time {
+  padding: 10px 0;
+  display: flex;
+  justify-content: flex-end;
+  .file-item-right {
+    display: flex;
+    align-items: center;
+    img {
+      width: 15px;
+      height: 15px;
+      margin-right: 7px;
+    }
+    span {
+      font-size: 12px;
+      color: #888d8d;
+      margin-right: 15px;
+    }
+  }
+}
 </style>
\ No newline at end of file