获取验证码功能

yaolonglong

3 天以前 b5f084460e9e639358fbf91056a86be8d0a5c4b2

 policy/scodePage/scodePage.vue

@@ -1,162 +1,166 @@
<template>
   <view>
        <u-navbar
            @rightClick="rightClick"
            :autoBack="true"
            :placeholder="false"
            bgColor="transparent"
            leftIconColor="white"
         >
         </u-navbar>
      <image src="/static/policy/back.png" mode="widthFix" class="back-image"></image>
      <view class="page-box">
         <view class="code-hint">
            <template v-if="color == 'green'">
               <view>
                  <image src="/static/policy/success.png" mode="widthFix"></image>
                  <text>成功-绿码</text>
               </view>
               <view class="hint">
                  可对此企业进行核查
               </view>
            </template>
            <template  v-if="color == 'red'">
               <view >
                  <image src="/static/policy/error.png" mode="widthFix"></image>
                  <text>失败-红码</text>
               </view>
               <view class="hint">
                  请核查企业信息
               </view>
            </template>
         </view>
         <!-- 二维码 -->
         <view class="qrcode">
            <image src="/static/policy/qrcode-border.png" class="border" mode="widthFix"></image>
            <image :src="uqrcodeImage" mode="widthFix" class="qrcode-1"></image>
            <view class="code-time">
               <text>扫码时间：</text>{{$u.timeFormat(new Date(), 'yyyy-mm-dd hh:MM:ss')}}
            </view>
         </view>
         <view class="code">
            <view class="item">
               <text class="label">执法人员</text>
               <text class="value">{{userInfo.nickName}}</text>
            </view>
            <view class="write-border"></view>
            <view class="item">
               <text class="label">执法部门</text>
               <text class="value">{{userInfo.dept.deptName}}</text>
            </view>
         </view>
         <view class="hint-text">
            当前企业存在<text>{{list.length}}</text>条未完成的执法任务
         </view>
         <!-- <view class="hint-text">
            当前企业未完成的执法任务
         </view> -->
         <view class="down-block">
            <swiper style="height: 500rpx;" :indicator-dots="false"  :interval="3000" :duration="1000">
               <swiper-item v-for="(item,index) in list" :key="index">
                  <view class="box">
                     <view class="title">{{item.enforceReason}}</view>
                     <view class="user-news">
                        <text>{{item.applyUser}}</text>
                        <view class="driver"></view>
                        <text>{{item.applyDeptName}}</text>
                     </view>
                     <view class="font-13">
                        <text>执法对象：</text>{{item.companyName}}
                     </view>
                     <view class="border"></view>
                     <view class="font-12 margin-bottom">
                        <text>执法时间：</text>{{item.planTime}}
                     </view>
                     <view class="font-12">
                        <text>申请时间：</text>{{item.applyTime}}
                     </view>
                     <view class="button-entery">
                        <view class="button" v-if="item.isSelect" @click="doScanOrder(item.orderId, index)">确认执法</view>
                     </view>
                  </view>
               </swiper-item>
            </swiper>
         </view>
      </view>
      <uqrcode class="hide-canvas" :size="470" sizeUnit="rpx" v-if="companyCode" ref="uqrcode" canvas-id="qrcode" :value="companyCode" :options="{ backgroundColor: color,useDynamicSize: true,  areaColor: '#ffffff', foregroundColor: '#ffffff' }"></uqrcode>
		
   </view>
</template>

<script>
   import { getScanList, doScanOrder } from '@/api/policy.js'
   import { getInfo } from '@/api/auth.js'
   export default {
      data() {
         return {
            companyCode: '',
            uqrcodeImage: '',
            list: [],
            userInfo: {},
            color: '',
				
         }
      },
      onReady() {
			
      },
      onLoad(options) {
         this.getScanList(options.code)
			
         this.getInfo()
      },
      methods: {
         getScanList(companyCode){
            getScanList({companyCode}).then(val => {
               this.list = val.data.data.map(item => {
                  item['isSelect'] = true
                  return item
               })
               if(this.list.length) {
                  this.color = 'green'
               } else {
                  this.color = 'red'
               }
               this.companyCode = companyCode
               setTimeout(() => {
                  this.$refs.uqrcode.toTempFilePath({
                    success: res => {
                     this.uqrcodeImage = res.tempFilePath
                    }
                  });
               }, 500)
            })
         },
         getInfo() {
            getInfo().then(val => {
               console.log(val.data.data)
               this.userInfo = val.data.data
            })
         },
         doScanOrder(item, index) {
            doScanOrder(item).then(val => {
               if(val.data.code == 200) {
                  uni.showToast({
                     title: '确认执法成功',
                     icon: 'none'
                  })
                  this.list[index].isSelect = false
               }
            })
         }
      }
   }
</script>
<style>
   page{
      padding-bottom: 20rpx;
   }
</style>
<style lang="scss" scoped>
@import "./scodePage.scss";
</style>
<template>

  <view>

    <u-navbar @rightClick="rightClick" :autoBack="true" :placeholder="false" bgColor="transparent"

      leftIconColor="white">

    </u-navbar>

    <image src="/static/policy/back.png" mode="widthFix" class="back-image"></image>

    <view class="page-box">

      <view class="code-hint">

        <template v-if="color == 'green'">

          <view>

            <image src="/static/policy/success.png" mode="widthFix"></image>

            <text>成功-绿码</text>

          </view>

          <view class="hint">

            可对此企业进行核查

          </view>

        </template>

        <template v-if="color == 'red'">

          <view>

            <image src="/static/policy/error.png" mode="widthFix"></image>

            <text>失败-红码</text>

          </view>

          <view class="hint">

            请核查企业信息

          </view>

        </template>

      </view>

      <!-- 二维码 -->

      <view class="qrcode">

        <image src="/static/policy/qrcode-border.png" class="border" mode="widthFix"></image>

        <image :src="uqrcodeImage" mode="widthFix" class="qrcode-1"></image>

        <view class="code-time">

          <text>扫码时间：</text>{{$u.timeFormat(new Date(), 'yyyy-mm-dd hh:MM:ss')}}

        </view>

      </view>

      <view class="code">

        <view class="item">

          <text class="label">执法人员</text>

          <text class="value">{{userInfo.nickName}}</text>

        </view>

        <view class="write-border"></view>

        <view class="item">

          <text class="label">执法部门</text>

          <text class="value">{{userInfo.dept.deptName}}</text>

        </view>

      </view>

      <view class="hint-text">

        当前企业存在<text>{{list.length}}</text>条未完成的执法任务

      </view>

      <!-- <view class="hint-text">

            当前企业未完成的执法任务

         </view> -->

      <view class="down-block">

        <swiper style="height: 500rpx;" :indicator-dots="false" :interval="3000" :duration="1000">

          <swiper-item v-for="(item,index) in list" :key="index">

            <view class="box">

              <view class="title">{{item.enforceReason}}</view>

              <view class="user-news">

                <text>{{item.applyUser || ''}}</text>

                <view class="driver"></view>

                <text>{{item.applyDeptName || item.applyDeptNames || ''}}</text>

              </view>

              <view class="font-13">

                <text>执法对象：</text>{{item.companyName}}

              </view>

              <view class="border"></view>

              <view class="font-12 margin-bottom">

                <text>执法时间：</text>{{item.planTime || item.planMonth || ''}}

              </view>

              <view class="font-12">

                <text>申请时间：</text>{{item.applyTime || ''}}

              </view>

              <view class="button-entery">

                <view class="button" v-if="item.isSelect" @click="doScanOrder(item.orderId, index)">确认执法</view>

              </view>

            </view>

          </swiper-item>

        </swiper>

      </view>

    </view>

    <uqrcode class="hide-canvas" :size="470" sizeUnit="rpx" v-if="companyCode" ref="uqrcode" canvas-id="qrcode"

      :value="companyCode"

      :options="{ backgroundColor: color,useDynamicSize: true,  areaColor: '#ffffff', foregroundColor: '#ffffff' }">

    </uqrcode>



  </view>

</template>



<script>

  import {

    getScanList,

    doScanOrder

  } from '@/api/policy.js'

  import {

    getInfo

  } from '@/api/auth.js'

  export default {

    data() {

      return {

        companyCode: '',

        uqrcodeImage: '',

        list: [],

        userInfo: {},

        color: '',



      }

    },

    onReady() {



    },

    onLoad(options) {

      this.getScanList(options.code)



      this.getInfo()

    },

    methods: {

      getScanList(companyCode) {

        getScanList({

          companyCode

        }).then(val => {

          this.list = val.data.data.map(item => {

            item['isSelect'] = true

            return item

          })

          if (this.list.length) {

            this.color = 'green'

          } else {

            this.color = 'red'

          }

          this.companyCode = companyCode

          setTimeout(() => {

            this.$refs.uqrcode.toTempFilePath({

              success: res => {

                this.uqrcodeImage = res.tempFilePath

              }

            });

          }, 500)

        })

      },

      getInfo() {

        getInfo().then(val => {

          this.userInfo = val.data.data

        })

      },

      doScanOrder(item, index) {

        doScanOrder(item).then(val => {

          if (val.data.code == 200) {

            uni.showToast({

              title: '确认执法成功',

              icon: 'none'

            })

            this.list[index].isSelect = false

          }

        })

      }

    }

  }

</script>

<style>

  page {

    padding-bottom: 20rpx;

  }

</style>

<style lang="scss" scoped>

  @import "./scodePage.scss";

</style>