horzi_rai_wxa/reportPages/reportSecretDetail/components/reportChoiceness.vue

<template>
  <view>
    <view class="container-report forbid-copy" v-if="dataListResearch.length > 0">
      <view class="content" v-for="(item, index) in dataListResearch" :key="index">
        <view v-if="item.Type === 'YANX'" class="official-notice">
          <image src=" https://hzchart.oss-cn-shanghai.aliyuncs.com/cygx/mfyx_icon.png"></image>
        </view>
        <view class="content-title">
          <view></view>
          <image :src="item.IcoLink" mode=""></image>
          <text style="margin-right: 26rpx">{{ item.ListName }}</text>
          <view></view>
        </view>
        <view class="content-list" v-for="(key, num) in item.List" :key="num">
          <view style="display: inline-block">
            <view class="list-title" :class="num == 0 ? '' : 'list-tophight'" v-if="key.PermissionName">
              <image :src="key.IcoLink" mode=""></image>
              <text>{{ key.PermissionName }}:</text>
            </view>
          </view>
          <view class="list-boby" :class="{ 'no-top': !key.PermissionName }" v-for="(val, indexs) in key.List" :key="indexs">
            <mp-html :content="strFontSize(val.Body)" />
            <view class="list-detali" :class="{ 'list-boby-border': num !== item.List.length - 1 || indexs !== key.List.length - 1 }" v-if="val.ReportLink" @click="goListDetali(val)">
              点击查看详情
            </view>
          </view>
        </view>
      </view>
    </view>
  </view>
</template>

<script>
export default {
  props: {
    dataListResearch: {
      type: Array,
      required: true,
      default: [],
    },
  },
  data() {
    return {};
  },
  methods: {
    goListDetali(item) {
      if (item.IsHaveVideo) {
        //跳转路演精华
        uni.navigateTo({
          url: "/reportPages/roadEssence/roadEssence?id=" + item.ReportLink,
        });
      } else {
        uni.navigateTo({
          url: "/pageMy/reportDetail/reportDetail?id=" + item.ReportLink,
        });
      }
    },
  },
};
</script>

<style lang="scss" scope>
.container-report {
  margin-top: 60rpx;
  .content {
    color: #4a4a4a;
    .content-title {
      display: flex;
      font-size: 32rpx;
      align-items: center;
      justify-content: center;
      margin: 30rpx 0 30rpx;
      color: #4a4a4a;
      image {
        width: 40rpx;
        height: 44rpx;
        margin: 0 20rpx 0 26rpx;
      }
      view {
        flex: 1;
        border: 2rpx dashed #333333;
      }
    }
    .content-list {
      font-size: 32rpx;
      font-weight: 400;
      .list-title {
        display: flex;
        align-items: center;
        background: $uni-color-new;
        padding: 3rpx 34rpx;
        color: #fff;
        border-radius: 0rpx 50rpx 50rpx 0rpx;
        overflow: hidden;
        image {
          width: 32rpx;
          height: 32rpx;
        }
        text {
          margin-left: 10rpx;
        }
      }
      .list-boby {
        margin-bottom: 30rpx;
        padding-top: 30rpx;
      }
      .no-top {
        padding-top: 0rpx !important;
      }
      .list-tophight {
        margin-top: 30rpx;
      }
      .list-boby-border {
        border-bottom: 2rpx dashed #e2e2e2;
      }
      .list-detali {
        font-size: 28rpx;
        color: $uni-color-new;
        margin: 20rpx 0 5rpx;
        text-align: right;
        padding-bottom: 30rpx;
      }
    }
    .official-notice {
      width: calc(100% + 68rpx);
      margin-left: -34rpx;
      height: 150rpx;
      margin-top: 70rpx;

      image {
        width: 100%;
        height: 100%;
      }
    }
  }
}
</style>