<template>
  <view>
    <custom-nav-bar position="fixed" color="black" :left-text="options.name" left-arrow border />

    <view class="list flex flex-center flex-col">
      <image class="qr" :src="recursionObj.icon" :show-menu-by-longpress="true"></image>
      <view class="qr-text">{{ recursionObj.remark }}</view>
    </view>
  </view>
</template>

<script>
  import * as publicApi from '@/api/publicApi';

  export default {
    data() {
      return {
        recursionObj: {
          icon: '',
          remark: ''
        },

        options: {
          name: ''
        }
      };
    }
    /**
     * 生命周期函数--监听页面加载
     */
    ,
    onLoad(options) {
      this.options = options
      this.recursionApi();
    },
    methods: {
      async recursionApi() {
        const {
          data
        } = await publicApi.recursionApi({
          bannerType: this.options.bannerType,
          parentId: this.options.parentId
        });
        if (data.length) {
          this.recursionObj = data[0]
        }
      }
    }
  };
</script>
<style lang="less">
  .list {
    margin-top: 207rpx;
    width: 100%;

    .qr {
      width: 576rpx;
      height: 576rpx;
    }

    .qr-text {
      margin-top: 55rpx;
      width: 543rpx;
      font-size: 30rpx;
      font-weight: 400;
      color: #222222;
      line-height: 40rpx;
      text-align: justify;
      text-align-last: center;
    }
  }
</style>