Qrcodejs2 QR code generation JS

<div class="qrcode" ref="qrCodeUrl"></div>
<div class="rxpired-box" v-show="rxpired">
<p> Has expired </p>
<Button type="primary" @click="bindRefresh"> Click refresh </Button>
</div>

import QRCode from 'qrcodejs2'

methods: {
    
            //  Switching scanning 
            bindScan(){
    
                if(!this.isScan){
    
                    this.isScan = true
                    this.getSanCodeKey()
                }
                this.loginType = 1
            },
            //  Generate qr code 
            creatQrCode() {
    
                let url= `${window.location.protocol}//${window.location.host}/pages/users/scan_login/index?key=${this.codeKey}`;
                var qrcode = new QRCode(this.$refs.qrCodeUrl, {
    
                    text: url, //  The content that needs to be converted into QR code 
                    width: 160,
                    height: 160,
                    colorDark: '#000000',
                    colorLight: '#ffffff',
                    correctLevel: QRCode.CorrectLevel.H
                })
            },
            //  Close modal box 
            closeModel () {
    
                let msg = this.$Message.loading({
    
                    content: ' Logon ...',
                    duration: 0
                });
                AccountLogin({
    
                    account: this.formInline.username,
                    password: this.formInline.password,
                    imgcode: this.formInline.code
                }).then(async res => {
    
                    msg();
                    let expires = this.getExpiresTime(res.data.exp_time);
                    //  Record user login information 
                    setCookies('kefu_uuid', res.data.kefuInfo.uid, expires);
                    setCookies('kefu_token', res.data.token, expires);
                    setCookies('kefu_expires_time', res.data.exp_time, expires);
                    setCookies('kefuInfo', res.data.kefuInfo, expires);

                    //  Record user information 
                    this.$store.commit('kefu/setInfo', res.data.kefuInfo)




                    if(this.$store.state.media.isMobile){
    
                        // Mobile page 
                        return this.$router.replace({
     path: this.$route.query.redirect || '/kefu/mobile_list' });
                    }else{
    
                        // pc page 
                       return this.$router.replace({
     path: this.$route.query.redirect || '/kefu/pc_list' });
                    }
                }).catch(res => {
    

                    msg();
                    let data = res === undefined ? {
    } : res;
                    this.errorNum++;
                    this.captchas();
                    this.$Message.error(data.msg || ' Login failed ');
                    if (this.jigsaw) this.jigsaw.reset();
                });
            },
            getExpiresTime (expiresTime) {
    
                let nowTimeNum = Math.round(new Date() / 1000);
                let expiresTimeNum = expiresTime - nowTimeNum;
                return parseFloat(parseFloat(parseFloat(expiresTimeNum / 60) / 60) / 24);
            },
            closefail () {
    
                if (this.jigsaw) this.jigsaw.reset();
                this.$Message.error(' Check error ');
            },
            handleResize (event) {
    
                this.fullWidth = document.documentElement.clientWidth

            },
            captchas: function () {
    
                this.imgcode = Setting.apiBaseURL + '/captcha_pro?' + Date.parse(new Date());
            },
            handleSubmit (name) {
    
                this.$refs[name].validate((valid) => {
    
                    if (valid) {
    
                        this.closeModel();
                    }
                })
            },
            //  Get customer service scanning code key
            getSanCodeKey(){
    
                getSanCodeKey().then(res=>{
    
                    this.codeKey = res.data.key
                    this.creatQrCode()
                    this.scanTime = setInterval(()=>{
    
                        this.timeNum++
                        if(this.timeNum>=60){
    
                            this.timeNum = 0
                            window.clearInterval(this.scanTime)
                            this.rxpired = true
                        }else{
    
                            this.getScanStatus()
                        }

                    },1000)
                }).catch(error=>{
    
                    this.timeNum = 0
                    window.clearInterval(this.scanTime)
                    this.rxpired = true
                    this.$Message.error(error.msg)
                })
            },
            //  Code scanning login status 
            getScanStatus(){
    
                scanStatus(this.codeKey).then(async res=>{
    
                    // 0 =  When the QR code expires, you need to obtain the authorization certificate again 
                    if(res.data.status == 0){
    
                        this.timeNum = 0
                        window.clearInterval(this.scanTime)
                        this.rxpired = true
                    }
                    // 1= Scanning 
                    if(res.data.status == 1){
    

                    }
                    // 3  Scanning succeeded. Logging in 
                    if(res.data.status == 3){
    
                        window.clearInterval(this.scanTime)
                        let expires = this.getExpiresTime(res.data.exp_time);
                        //  Record user login information 
                        setCookies('kefu_uuid', res.data.kefuInfo.uid, expires);
                        setCookies('kefu_token', res.data.token, expires);
                        setCookies('kefu_expires_time', res.data.exp_time, expires);
                        setCookies('kefuInfo', res.data.kefuInfo, expires);
                        //  Record user information 
                        this.$store.commit('kefu/setInfo', res.data.kefuInfo)
                        if(this.$store.state.media.isMobile){
    
                            // Mobile page 
                            return this.$router.replace({
     path: this.$route.query.redirect || '/kefu/mobile_list' });
                        }else{
    
                            // pc page 
                            return this.$router.replace({
     path: this.$route.query.redirect || '/kefu/pc_list' });
                        }
                    }
                }).catch(error=>{
    
                    this.$Modal.error({
    
                        title: ' Tips ',
                        content: error.msg
                    });
                    this.timeNum = 0
                    window.clearInterval(this.scanTime)
                    this.rxpired = true
                })
            },
            //  Refresh QR code 
            bindRefresh(){
    
                this.$refs.qrCodeUrl.innerHTML = ''
                this.rxpired = false
                this.getSanCodeKey()
            }
        },