BJ_web_developers / jy_parkingOS

  <template>
      <view>

          <uni-section :title="`${cardRuleName}(${cardTypeName})`" type="line">

              <uni-card padding="0" spacing="0">
                  <uni-list>

                      <uni-list-item title="适应车场" :rightText="plName">

                          <text></text>
                      </uni-list-item>

                      <uni-list-item :title="`价格：¥${price}/张`" :rightText="`商户库存：${cardNum}张`"></uni-list-item>

                  </uni-list>
              </uni-card>
          </uni-section>
  

          <view class=" uni-card" style="padding: 10px 0">

              <view class="qr-box">
                  <canvas canvas-id="qrcode" v-show="qrShow" style="width: 300rpx;margin: 0 auto;"/>

              </view>
          </view>
  

          <view class="tip-wrap">

              <uni-notice-bar single text="温馨提示:"/>
              <uni-notice-bar single text="卡券自动发放，扫码领券后会自动刷新卡券二维码。"/>

          </view>
  
          <view class="uni-padding-wrap uni-common-mt">

              <button type="primary" style="margin-bottom: 15px" @click="stopProvide">{{provideText}}</button>
              <button type="warn" @click="toPrintCard">打印静态二维码</button>

          </view>

  
  
      </view>
  </template>
  
  <script>

  import uQRCode from '../../common/uqrcode.js' //引入uqrcode.js

  export default {
    data() {

      return {

        qrShow: false,

        cardTypeName: '',// 卡类型名称
        cardRuleName: '',// 卡名称

        plName: '', // 停车场
        price: '', // 卡价格
        cardNum: '', // 库存
        timer: null, // 定时器
        qrUrl: '',// 二维码url
        provideText:'停止自动发放',
        cardRelParkNo:'',//商券规则关联车场和商户编码

      }
    },
    onLoad(params) {
      wx.showShareMenu({
        withShareTicket: true
      })

      let option = JSON.parse(params.optionData)
      console.log(option)
      this.cardRelParkNo = option.cardRelParkNo
      this.cardTypeName = option.cardTypeName
      this.cardRuleName = option.cardRuleName
      this.plName = option.plName
      this.price = option.value
      this.cardNum = option.cardNum

      // this.maxNum = option.cardNum
      this.getCouponDynamicQR()

    },
    onShow() {
      var me = this;

    },

    computed: {},

    methods: {

      getCouponDynamicQR() {
        let that = this
        let paramsData = {

          cardRelParkNo: this.cardRelParkNo,

          codeType: '2'

        }

        // 首页信息获取 接口
        that.$myRequest({
          url: that.$common.getCouponDynamicQR,
          method: 'POST',
          data: that.$common.requestSign(paramsData)
        }).then(res => {
          console.log(res)

          that.qrUrl = res.data.qrUrl
          that.qrFun(that.qrUrl) //调用二维码方法
          that.timer = setInterval(() => {
            // 业务逻辑
            console.log('11')
            that.qrFun(that.qrUrl) //调用二维码方法
          }, 300000)
          console.log(that.qrUrl)

        })

      },

      //**生成二维码**//

      qrFun: function (text) {

        this.qrShow = true
        uQRCode.make({
          canvasId: 'qrcode',
          componentInstance: this,
          text: text,
          size: 150,
          margin: 0,
          backgroundColor: '#ffffff',
          foregroundColor: '#000000',
          fileType: 'jpg',
          errorCorrectLevel: uQRCode.errorCorrectLevel.H,

          success: res => {
          }

        })

      },
      stopProvide: function () {
        let that = this
        // provideText:'停止自动发放'
        if(that.provideText == '停止自动发放'){
          that.provideText = '开始自动发放'
          clearInterval(that.timer)
          that.timer = null;
        }else{
          that.provideText = '停止自动发放'
          that.qrFun(that.qrUrl) //调用二维码方法
          that.timer = setInterval(() => {
            // 业务逻辑
            console.log('11')
            that.qrFun(that.qrUrl) //调用二维码方法
          }, 300000)
        }
      },
      toPrintCard: function () {
        uni.navigateTo({
  
          url: '../businessCard/printCard?cardRelParkNo='+this.cardRelParkNo+
          '&cardTypeName='+ this.cardTypeName+
          '&cardRuleName='+this.cardRuleName+
          '&plName='+this.plName+
          '&price='+this.price+
          '&cardNum='+this.cardNum
        });

      }

    }
  }
  </script>
  
  <style lang="scss" scoped>

      /deep/ .uni-section {

          padding-bottom: 10px;
      }

      .tip-wrap /deep/ .uni-noticebar {

          margin-bottom: 0;
      }

  </style>