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 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 class="list-title" :class="num == 0 ? '' : 'list-tophight'" v-if="key.PermissionName">
            <image :src="key.IcoLink" mode=""></image>
            <text>{{ key.PermissionName }}:</text>
          </view>
          <view class="list-boby" :class="{ 'list-boby-border': indexs !== 0, 'no-top': !key.PermissionName }" v-for="(val, indexs) in key.List" :key="indexs">
            <mp-html :content="val.Body" />
            <view class="list-detali" 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 {
  .content {
    color: #4a4a4a;
    .content-title {
      display: flex;
      font-size: 32rpx;
      font-weight: 700;
      align-items: center;
      justify-content: center;
      margin-bottom: 60rpx;
      image {
        width: 48rpx;
        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;
        image {
          width: 48rpx;
          height: 44rpx;
        }
        text {
          margin-left: 10rpx;
        }
      }
      .list-boby {
        margin-bottom: 30rpx;
        padding-top: 30rpx;
      }
      .no-top {
        padding-top: 0rpx !important;
      }
      .list-tophight {
        margin-top: 60rpx;
      }
      .list-boby-border {
        border-top: 2rpx dashed #e2e2e2;
      }
      .list-detali {
        font-size: 28rpx;
        color: #3385ff;
        margin: 20rpx 0;
      }
    }
  }
}
</style>