horzi_rai_wxa/reportPages/reportSecretDetail/components/researchSummary.vue

<template>
  <!-- 精选/上周、研究汇总 -->
  <view class="container-summary forbid-copy" v-if="dataList.length > 0">
    <view class="content" v-for="(item, index) in dataList" :key="index">
      <view class="content-title global_title">
        <image :src="item.IcoLink" mode=""></image>
        <text>{{ item.PermissionName }}</text>
      </view>
      <view class="content-list" v-for="(key, num) in item.List" :key="num">
        <view style="display:inline-block">
           <text class="list-subject" v-if="key.SubjectName">{{ key.SubjectName }}:</text>
        </view>
        <mp-html :content="strFontSize(key.Body)" />
        <view class="subject-detali" v-if="key.ReportLink">
          <text style="color: #376cbb" @click="reportLinkDetali(key)">点击查看</text>
        </view>
        <view class="subject-detali" v-else>
          <text style="display:inline-block">相关调研纪要、深度报告请</text>
          <text style="color: #376cbb; margin-left: 10rpx;display:inline-block" @click="industry(key.List)">点击查看</text>
        </view>
      </view>
    </view>
    <view class="select-box">
      <u-popup v-model="areacodeShow" mode="bottom" @close="cancel">
        <view class="box" style="color: #2c83ff" v-for="(item) in list" :key="item.IndustrialManagementId" @click="industryDetitle(item)"> {{ item.IndustryName }}</view>
        <view class="box box-bottom" style="color: #a9afb8" @click="cancel">取消</view>
      </u-popup>
    </view>
  </view>
</template>

<script>
export default {
  props: {
    dataList: {
      type: Array,
      default: [],
      required: true,
    },
  },
  data() {
    return {
      list: [],
      areacodeShow: false,
    };
  },
  methods: {
    reportLinkDetali(item) {
      if (item.IsHaveVideo) {
        //跳转路演精华
        uni.navigateTo({
          url: "/reportPages/roadEssence/roadEssence?id=" + item.ReportLink,
        });
      } else {
        uni.navigateTo({
          url: "/pageMy/reportDetail/reportDetail?id=" + item.ReportLink,
        });
      }
    },
    industry(item) {
      if (item.length > 1) {
        this.list = item;
        this.areacodeShow = true;
      } else if (item.length > 0 || item.length == 1) {
        uni.navigateTo({
          url: "/reportPages/IndustryReport/IndustryReport?id=" + item[0].IndustrialManagementId,
        });
      }
    },
    industryDetitle(item) {
      uni.navigateTo({
        url: "/reportPages/IndustryReport/IndustryReport?id=" + item.IndustrialManagementId,
      });

      this.areacodeShow = false;
    },
    cancel() {
      this.areacodeShow = false;
    },
  },
  watch: {},
};
</script>

<style lang="scss" scope>
.container-summary {
  .content {
    color: #4a4a4a;
    .content-title {
      display: flex;
      font-size: 32rpx;
      align-items: center;
      justify-content: center;
      margin-bottom: 62rpx;
      color: #4A4A4A;
      image {
        width: 48rpx;
        height: 44rpx;
        margin-right: 12rpx;
      }
    }
    .content-list {
      font-size: 32rpx;
      font-weight: 400;
    }
    .list-subject {
       background: #376cbb;
        padding: 3rpx 34rpx;
        color: #fff;
        border-radius: 0rpx 50rpx 50rpx 0rpx;
      font-weight: 500;
      margin-bottom: 20rpx;
    }
    .subject-detali {
      // display: flex;
      text-align:right;
      font-size: 28rpx;
      margin: 20rpx 0 60rpx 0;
    }
  }
  .select-box {
    width: 100%;

    .box {
      height: 95prx;
      line-height: 95rpx;
      text-align: center;
      font-size: 32rpx;
      border-bottom: 1rpx solid #ebebeb;
    }

    .box-bottom {
      border-bottom: none !important;
    }
  }
}
</style>