settle_down_wx/pages/subPackages/industrialPolicy/detail.vue

<template>
    <div class="industralDetail">
       <div class="industralBox">
         <div class="industralTitle">{{detail.title}}</div>
         <div class="industralTime">{{detail.releaseTime}} &nbsp;|&nbsp; 园区管委会</div>
       </div>
       <div class="industralBox">
         <div class="industralTitle">简介</div>
         <div class="industralInfo" v-html="detail.content">
<!--           (1) 对规模达到1亿元的创业投资基金，可按不超过基金规模1%的比例给予奖励;达到2亿元的，可按不超过1.5%的比例给予奖励;达到5亿元的，可按不超过2%的比例给予奖励。-->
         </div>
         <img style="width: 100%;height: 100%" v-for="item in imgUrlList" :src="item.url" alt="" />
         <div v-for="item in fileUrlList" style=" font-size: 16px; margin: 10px;color: #0000FF" @click="jumpFile(item)">
           {{item.name}}
         </div>
<!--         <div class="industralInfo">-->
<!--           (2) 对规模达到2亿元的私募股权基金，可按不超过基金规模1%的比例给予奖励:达到5亿元的，可按不超过1.5%的比例给予奖励:达到10亿元的，可按不超过2%的比例给予奖励。-->
<!--         </div>-->
<!--         <div class="industralInfo">-->
<!--           (3) 对规模达到5亿元的私募证券基金，可接不超过基金规模0.5%的比例给予奖励;达到10亿元的，可按不超过1%的比例给予奖励;达到20亿元的，可按不超过1.5%的比例给子奖励。-->
<!--         </div>-->
       </div>
    </div>
</template>

<script>
import { policyGetById } from "@/js_sdk/http.js";
export default {
  name: "detail",
  data(){
    return{
      detail: {},
      fileUrlList: [],
      imgUrlList: []
    }
  },
  onLoad(item) {
    // console.log(item.id)
    this.selectById(item.id)
  },
  methods:{
    selectById(id) {
      const _this = this
      policyGetById({ id }).then((res) => {
        console.log(res)
        if (res.data) {
          const det = _this.getItemJson(res.data)
          _this.detail = det
          if (det.fileUrl && det.fileUrl.length > 2) {
            const themeUrlList = []
            const imgUrlList = []
            const files = _this.$common.castEval(det.fileUrl)
            files.forEach(item => {
              const ul = {
                name: item.name,
                url: item.url.replace('server', 'smartParkH5Server')
              }
              if (item.name.indexOf('png') > -1 || item.name.indexOf('jpg') > -1 || item.name.indexOf('jpeg') > -1) {
                imgUrlList.push(ul)
              } else {
                themeUrlList.push(ul)
              }
            })
            if (imgUrlList.length > 0) {
              _this.imgUrlList = imgUrlList
            }
            _this.fileUrlList = themeUrlList
          }
        }
      })
      console.log(_this.detail)
    },
    getItemJson: function(item) {
      item.releaseTime = this.$common.transDate(item.releaseTime)
      // item.serviceType = this.dc_map.QUICK_SELECTION[item.serviceType]
      if (item.content && item.content.indexOf('smartParkH5Server' > -1)) {
        item.content = item.content.replace('server', 'smartParkH5Server')
      }
      if (item.content.indexOf('width') !== -1 && item.content.indexOf('height') !== -1) {
        item.content = item.content.replace(/width="(\S*)"/, 'width="100%"').replace(/height="(\S*)"/, 'height="100%"')
      }

      return item
    },
    jumpFile(item) {
      console.log(window.location.href)
      console.log(window.location.href.split('#')[0])
      wx.miniProgram.navigateTo({ url: '/pages/file/download?callBackUrl=' + encodeURIComponent(window.location.href.split('#')[0]) +
            '&url=' + item.url + '&name=' + item.name })
    },
  }
}
</script>

<style lang="scss">
    .industralDetail{
      .industralBox{
        padding: 32rpx;
        background: white;
        margin: 24rpx 0;
        .industralTitle{
          color: rgba(34, 34, 34, 1);
          font-size: 32rpx;
          font-weight: 600;
        }
        .industralTime{
          font-size: 28rpx;
          margin-top: 16rpx;
          color: rgba(136, 136, 136, 1);
        }
        .industralInfo{
          margin: 24rpx 0;
          line-height: 50rpx;
          font-size: 28rpx;
          color: #444444;
        }
      }
    }
</style>