nsgk_mobile/src/views/notice/noticeDetail.vue

<template>
  <div class="app-container">
    <van-nav-bar
      title="项目公告"
      left-arrow
      fixed
      placeholder
      @click-left="onClickLeft"
    />
    <van-cell title="项目名称" :value="noticeDetail.projectName" />

    <van-cell v-if="noticeDetail.projectStatus == '2'" title="终止原因" type="textarea" :value="noticeDetail.terminateReason" />
    <template v-else>
    <van-cell title="项目编号" :value="noticeDetail.projectCode" />
    <van-cell title="转出方式" :value="noticeDetail.rollout" />
    <van-cell title="交易方式" :value="noticeDetail.dealType" />
    <van-cell title="成交时间" :value="noticeDetail.dealTime" />
    <van-cell title="标的区域" :value="noticeDetail.deptName" />
    <van-cell title="转出方" :value="noticeDetail.outName" />
    <van-cell title="受让方" :value="noticeDetail.memberType == 1 ? noticeDetail.realname:noticeDetail.companyName" />
    <van-cell title="公示开始时间" :value="noticeDetail.dealPublicityStartTime" />
    <van-cell title="公示结束时间" :value="noticeDetail.dealPublicityStopTime" />
    <van-cell title="转出面积/数量" :value="noticeDetail.allCount+noticeDetail.allCountUnit" />
    <van-cell title="转出年限" :value="noticeDetail.outStartTime+'至'+noticeDetail.outStopTime" />
    <van-cell title="成交价格" :value="noticeDetail.dealMoney+noticeDetail.unit" />
    <van-cell title="成交金额" :value="noticeDetail.dealMoneySum" />
    </template>
    <div v-if="noticeDetail.projectStatus == '2'">
      <van-divider>附件</van-divider>
      <van-cell :title="item.fileName" :url="'/api'+item.fileUrl" is-link v-for="(item,index) in attachmentQueryList">
        <!-- 使用 right-icon 插槽来自定义右侧图标 -->
        <template #icon>
          <img src="../../assets/images/file_icon.png" style="display: block;width: 24px;margin-right: 5px;" alt="">
        </template>
      </van-cell>
    </div>
  </div>
</template>

<script>
  import {attachmentQuery, noticeDetails} from "@/api/notice/index";
export default {
  name: "noticeDetail",
  data() {
    return {
      noticeDetail:'',
      attachmentQueryList:[]
    };
  },
  created() {
    this.getDetail();

  },
  methods: {
    //成交公告集合
    getDetail(){
      console.log(this.$route.query.id)
      noticeDetails(this.$route.query.id).then(response => {
        console.log(response)
        this.noticeDetail = response.data;
        //转出方式字典
        this.getDicts("rollout_type").then(res => {
          this.noticeDetail.rollout = this.selectDictLabel(res.data,response.data.rollout);
        });
        //交易方式字典
        this.getDicts("deal_type").then(res => {
          this.noticeDetail.dealType = this.selectDictLabel(res.data,response.data.dealType);
        });
        //面积单位字典
        this.getDicts("area_unit").then(res => {
          this.noticeDetail.allCountUnit = this.selectDictLabel(res.data,response.data.allCountUnit);
        });
        //成交价格字典
        this.getDicts("price_unit").then(res => {
          this.noticeDetail.unit = this.selectDictLabel(res.data,response.data.unit);
        });
        let query = {
          tableName: 't_transaction_deal_publicity',
          bizPath: 'transaction',
          tableId:this.$route.query.id,
          fileType:''
        }
        attachmentQuery(query).then(response => {
          this.attachmentQueryList = response.rows;
        });
      });
    },

  },
};
</script>

<style scoped lang="scss">
.app-container {
  padding: 0 0 0.5rem;
  background: #ffffff;
}
.title{
  font-size: 0.5rem;
  margin-bottom: 0.5rem;
}
.van-row{
  margin-bottom: 0.4rem;
}
.van-col{
  font-size: 0.4rem;
  color: #666666;
}
</style>