nsgk_mobile/src/views/onlineHome/villageAffairsDetail.vue

<template>
  <div class="app-container">
    <van-nav-bar
      :title="type"
      left-arrow
      @click-left="$router.back(-1)"
    />
    <p class="title">{{form.title}}</p>
    <van-row style="text-align: center;margin: 0.3rem 0;">
      <van-col span="2" :offset="1">
        <van-image
          width="24"
          height="24"
          src="../../../static/images/onlineHome/threeAffair1.png"
          style="margin-top: 5px;"
        />
      </van-col>
      <van-col span="20">
        <van-row>
          <van-col span="24" style="text-align: left;font-size: 10px;">{{form.createBy}}</van-col>
        </van-row>
        <van-row>
          <van-col span="24" style="text-align: left;font-size: 10px;">{{form.createTime}}</van-col>
        </van-row>
      </van-col>
    </van-row>
    <div id="content" style="padding: 0 10px"></div>
    <p style="margin-top:20px;padding: 0 10px">附件下载</p>
    <van-cell v-for="(item,index) in fileList" :key="index">
      <a :href="item.fileUrl">{{index+1}}.{{item.fileName}}</a>
    </van-cell>
  </div>
</template>

<script>
    import onlineHomeIndex from "../onlineHomeIndex";
    import {attachmentList, getAffairs, getVillageAffairs, listAffairs} from "../../api/onlineHome/threeAffairs";
    import request from '@/utils/request'
    export default {
      components: {

      },
        name: "villageAffairsDetail",
      data() {
        return {
          id:null,
          type:"",
          // 查询参数
          queryParams: {
            pageNum: 1,
            pageSize: 10,
            title: null,
            openType: null,
            deptId: null,
            isWechat: null,
            status: null,
          },
          form:{},
          fileList: [], //上传附件图片列表
          fileListData: [], //上传附件图片列表参数
        };
      },
      created() {
        console.log(this.$route.query.type)
        if(this.$route.query.type== "1"){
          this.type = "政策法规"
        }else if(this.$route.query.type== "2"){
          this.type = "惠农政策"
        }else if(this.$route.query.type== "3"){
          this.type = "工作动态"
        }else if(this.$route.query.type== "4"){
          this.type = "制度建设"
        }
        this.id = this.$route.query.id
        this.getDetail();
      },
      methods: {
        getDetail() {
          getVillageAffairs(this.id).then(response => {
            this.form = response.data
            document.getElementById('content').innerHTML = response.data.content;
            let params = {
              "fileType" : "0",
              "tableName":"t_village_affairs",
              "tableId":this.id,
            }
            attachmentList(params).then((res) => {
              console.log(res)
              res.rows.map(r => {
                r.fileUrl = location.protocol+"//"+location.host+request.defaults.baseURL+r.fileUrl
                this.fileList.push(r)
              })
            });
          })
        },
      },
    }
</script>

<style scoped lang="scss">
  .app-container {
    padding-bottom: 0.5rem;
    height: 100vh;
    background-color: #fff;
  }
  .title{
    text-align: center;
    font-size: 0.6rem;
  }
  #content{
    overflow: hidden;
  }
</style>