jsm-mall-h5-front/src/packageEnter/pages/insurance/insuranceContract/index.vue

<template>
  <zj-page-container>
    <zj-fiex-column>
      <view class="page-content" v-if="!loading">
        <view class="rich-text-content" v-show="content">
          <rich-text :nodes="content"></rich-text>
        </view>
        <view class="please-read">
          <view class="please-read-title"> 请阅读: </view>
          <view
            class="please-read-contract"
            v-for="(item, index) in insureAgreeList"
            :key="index"
            @click="goDetailsAgreement(item)"
          >
            《{{ item.agreementName }}》
          </view>
        </view>
      </view>
      <view slot="after" class="bottom-reservation">
        <u-button :disabled="ins > 0 ? true : false" type="primary" @click="gopay"
          >了解并继续{{ ins > 0 ? `(${ins}s)` : '' }}
        </u-button>
      </view>
    </zj-fiex-column>
  </zj-page-container>
</template>
<script>
import ZjFiexColumn from '@/components/zj-container/zj-fiex-column.vue'
import ZjPageContainer from '@/components/zj-container/zj-page-container.vue'
import { countdown } from '@/utils/tool.js'
export default {
  components: {
    ZjFiexColumn,
    ZjPageContainer
  },
  data() {
    return {
      loading: true,
      content: '',
      insureAgreeList: [],
      ins: 0,
      djs: countdown(
        s => {
          this.ins = s
        },
        () => {
          this.ins = 0
        },
        5
      ),
      websitId: '',
      id: ''
    }
  },
  onLoad({ websitId, id }) {
    this.id = id
    this.websitId = websitId
    uni.showLoading({
      title: '加载中'
    })

    this.$api.post('/worker/detail', { id }).then(res => {
      var { agreements, policyName, text } = res.data
      uni.setNavigationBarTitle({
        title: policyName
      })
      this.content = text
      this.insureAgreeList = agreements
      this.$nextTick(() => {
        this.loading = false
        this.djs.start()
        uni.hideLoading()
      })
    })
  },
  methods: {
    goDetailsAgreement(item) {
      if (item.id) {
        uni.navigateTo({
          url: `/packageEnter/pages/insurance/detailsAgreement/index?id=${item.id}`
        })
      }
    },
    gopay() {
      uni.navigateTo({
        url: `/packageEnter/pages/insurance/determineInfo/index?websitId=${this.websitId}&id=${this.id}`
      })
    }
  }
}
</script>
<style lang="scss" scoped>
@import './style.scss';
</style>