摘牌详情

src/api/index.js

@@ -280,3 +280,11 @@ export const login = query => {
       data: query
   });
 };
+// 获取顶级资产类型
+export const end_detail = query => {
+  return request({
+      url: '/api/user.Asset/end_detail',
+      method: 'get',
+      params: query
+  });
+};

src/components/page/DelistingNotice.vue

@@ -88,6 +88,7 @@
       <el-table
         :data="listData"
         header-cell-class-name="theader"
+        @row-click="goDetails"
         :header-cell-style="{background:'#F3F3F3 !important',color:'#333333',height:'60px',fontSize:'14px'}"
         style="width: 100%">
         <el-table-column
@@ -162,6 +163,9 @@ export default {
     this.getData()
   },
   methods:{
+    goDetails(row, column, event){
+      this.$router.push({path:'/NoticeDetails',query:{id:row.id,type:1}})
+    },
     //时间戳转换时间
     formatDate(row,colnum){
       return moment(row[colnum.property]*1000).format('YYYY-MM-DD HH:mm:ss')

src/components/page/Listing.vue

@@ -152,7 +152,7 @@ export default {
       })
     },
     goDetails(id){
-      this.$router.push({path:'/NoticeDetails',query:{id:id}})
+      this.$router.push({path:'/NoticeDetails',query:{id:id,type:0}})
     },
     // 分页导航
     handlePageChange(val) {

src/components/page/NoticeDetails.vue

@@ -2,7 +2,7 @@
   <div>
     <div class="breadcrumb">
       <el-breadcrumb separator-class="el-icon-arrow-right">
-        <el-breadcrumb-item :to="{ path: '/Listing' }">挂牌公告</el-breadcrumb-item>
+        <el-breadcrumb-item :to="path">{{type==0?'挂牌公告':'摘牌公告'}}</el-breadcrumb-item>
         <el-breadcrumb-item>公告详情</el-breadcrumb-item>
       </el-breadcrumb>
     </div>
@@ -11,27 +11,27 @@
       <div class="detalie">
         <div class="detalie_title">所含标的物</div>
         <div class="detalie_content">
-          <div class="tabs_item" @click="goDetails">
-            <img src="../../assets/img/header_logo.png" alt="" class="tabs_item_img">
-            <div class="tabs_item_lable">有形实物资产</div>
+          <div class="tabs_item" @click="goDetails(detailsDate.id)" >
+            <img :src="detailsDate.serial_img" alt="" class="tabs_item_img">
+            <div class="tabs_item_lable">{{detailsDate.top_class_name}}</div>
             <div class="tabs_item_content">
-              <p class="tabs_item_content_title">资产标题名称字数多的显示…</p>
+              <p class="tabs_item_content_title">{{detailsDate.serial_name}}</p>
               <p class="tabs_item_content_p">
                 <span>评估价格： </span>
                 <span class="tabs_item_content_span">￥</span>
-                <span class="tabs_item_content_span tabs_item_content_span1">800,000.00</span>
+                <span class="tabs_item_content_span tabs_item_content_span1">{{detailsDate.price}}</span>
               </p>
               <p class="tabs_item_content_p">
                 <span>资产类型： </span>
-                <span class="tabs_item_content_span2 tabs_item_content_span3">房屋</span>
+                <span class="tabs_item_content_span2 tabs_item_content_span3">{{detailsDate.parent_class_name}}</span>
               </p>
               <p class="tabs_item_content_p">
                 <span>所在地： </span>
-                <span class="tabs_item_content_span2 tabs_item_content_span3">深圳</span>
+                <span class="tabs_item_content_span2 tabs_item_content_span3">{{detailsDate.city}}</span>
               </p>
               <p class="tabs_item_content_p">
                 <span>有效日期： </span>
-                <span class="tabs_item_content_span2 ">2022年7月15日  14:00 前</span>
+                <span class="tabs_item_content_span2 ">{{detailsDate.effective_date}}前</span>
               </p>
             </div>
           </div>
@@ -41,7 +41,9 @@
       <div class="detalie detalie1">
         <div class="detalie_title">公告内容</div>
         <div class="detalie_content">
-
+          <div class="detalie1_div">
+            <img :src="detailsDate.delist_file_img" alt="" class="detalie1_img">
+          </div>
         </div>
       </div>
     </div>
@@ -49,20 +51,41 @@
   </div>
 </template>
 <script>
+import {end_detail} from '../../api/index'
 export default {
   data(){
     return{
       query:{
         id:''
-      }
+      },
+      type:0,
+      path:{
+        path:'/Listing'
+      },
+      detailsDate:{}
     }
   },
   created(){
     this.query.id=this.$route.query.id
+    this.type=this.$route.query.type
+    if (this.type==0) {
+      this.path={path:'/Listing'}
+    }else{
+      this.path={path:'/DelistingNotice'}
+      this.end_detail()
+    }
   },
   methods:{
-    goDetails(){
-      this.$router.push({path:'/AssetDetails',query:{id:this.query.id}})
+    goDetails(id){
+      this.$router.push({path:'/AssetDetails',query:{id:id}})
+    },
+    end_detail(){
+      end_detail(this.query).then(res=>{
+        console.info(res)
+        if (res.code==100) {
+          this.detailsDate=res.data
+        }
+      })
     }
   }
 }
@@ -71,21 +94,23 @@ export default {
   .tabs{
     margin-top: 20px;
     /* display: flex; */
-    border: 1px solid #E9B7B7;
+    border: 1px solid rgba(215, 215, 215, 1);
+    /* border: 1px solid #E9B7B7; */
   }
   .detalie{
     display: flex;
     min-height: 360px;
   }
   .detalie1{
-    border-top: 1px solid #E9B7B7;
+    border-top: 1px solid rgba(215, 215, 215, 1);
   }
   .detalie_title{
     width: 110px;
-    height: 360px;
-    background: #F6E0E0;
+    min-height: 360px;
+    /* background: #F6E0E0; */
+    background-color: rgba(242, 242, 242, 1);
     font-size: 18px;
-    color: #C94C4C;
+    /* color: #C94C4C; */
     display: flex;
     align-items: center;
     justify-content: center;
@@ -93,16 +118,23 @@ export default {
     writing-mode: vertical-lr
   }
   .detalie_content{
-    background: #FDF8F8;
+    /* background: #FDF8F8; */
     padding: 20px 20px;
     width: 1088px;
     box-sizing: border-box;
-    border-left: 1px solid #E9B7B7;
+    border-left: 1px solid rgba(215, 215, 215, 1);
+  }
+  .detalie1_div{
+    text-align: center;
+  }
+  .detalie1_img{
+    width: 600px;
+    height: 600px;
   }
   .tabs_item{
     width: 283px;
     height: 300px;
-    border: 1px solid #E9B7B7;
+    border: 1px solid rgba(215, 215, 215, 1);
     margin-bottom: 20px;
     box-sizing: border-box;
     position: relative;