https://iampho.ru/var/cache/asset20_19627d7ffc26d3e8dcac08de81197abb.js

1app.qrPayMainComponent={components:{profileCard:app.profileCardComponent,},props:['loc','panelUrl',],data(){return{loading:!0,sec:null,code:null,available:!0,isImgLoad:!1,expireDate:null,loyaltyInfo:null,status:null,gradeType:null,grades:null,nextGrade:null,currency:null,showCard:!1,}},computed:{qrMarkup(){if(!this.code||!window.fpQrSvg){return''}
2try{return window.fpQrSvg.plain(this.code)}catch(e){return''}},qrSrc(){if(!this.code){return}
3const panelUrl=this.panelUrl||'https://app.foodpicasso.com';return `${panelUrl}/qr/svg/generate?qrText=${encodeURIComponent(this.code)}`},time(){const minutes=('0'+Math.floor(this.sec/60%60)).slice(-2);const seconds=('0'+Math.floor(this.sec%60)).slice(-2);return `${minutes}:${seconds}`},},mounted(){this.getData()},methods:{close(){this.$emit('close')},getData(){const payload={};app.fetch('/qr/getPayData',payload,(res)=>{this.loading=!1;if(res.error){this.$emit('error',res.message);return}
4if(res.available===!1){this.available=!1;return}
5this.code=res.code;this.nextGrade=res.nextGrade;this.grades=res.grades;this.gradeType=res.gradeType;this.status=res.status;this.currency=res.currency;this.loyaltyInfo=res.loyaltyInfo;this.showCard=res.showCard;this.setTimer(res.expireDate)})},setTimer(expireDate){if(!expireDate){return}
6const timer=setInterval(()=>{const secondDelta=Math.trunc(expireDate-(Date.now()/1000));if(secondDelta<=0){this.sec=0;clearInterval(timer);return}
7this.sec=secondDelta;if(!this.expireDate){this.expireDate=expireDate}},1000)},onLoadImg(){this.isImgLoad=!0},},template:`
8        <div class="qrPay">
9             <profileCard v-if="showCard"
10                          :status="status"
11                          :gradeType="gradeType"
12                          :grades="grades"
13                          :nextGrade="nextGrade"
14                          :currency="currency"
15                          :loyaltyInfo="loyaltyInfo"
16                          :loc="loc" />            
17
18            <div class="qrPay__container">
19
20                <div v-if="available === false" class="qrPay__unavailable">
21                    <div class="qrPay__unavailableTitle">{{loc['qrPay/noPhone/title']}}</div>
22                    <div class="qrPay__unavailableHint">{{loc['qrPay/noPhone/hint']}}</div>
23                </div>
24
25                <template v-else>
26                    <div class="qrPay__hint">{{loc['qrPay/hint']}}</div>
27
28                    <!-- Спиннер ждёт только картинку с сервера: рисованный код готов сразу. -->
29                    <div class="qrPay__qr">
30                        <div v-if="qrMarkup"
31                             class="qrPay__img qrPay__img--drawn"
32                             v-html="qrMarkup"></div>
33
34                        <template v-else>
35                            <img v-if="qrSrc"
36                                 :src="qrSrc"
37                                 class="qrPay__img"
38                                 @load="onLoadImg()">
39                            <transition name="fade">
40                                <div v-if="loading || !isImgLoad" class="qrPay__spinner">
41                                    <div class="spinner__item"></div>
42                                </div>
43                            </transition>
44                        </template>
45                    </div>
46
47                    <div class="qrPay__code">{{code}}</div>
48
49                    <transition name="fade">
50                        <div v-if="expireDate" class="qrPay__timer">
51                            {{loc['qrPay/codeValidityPeriod']}}:
52                            <span class="qrPay__time">{{time}}</span>
53                        </div>
54                    </transition>
55                </template>
56            </div>
57
58        </div>
59           `};app.addModule(()=>{const DRAWER_ASSETS=['/assets/vendor/qrcode/qrcode.min.js','/assets/common/qr/qr-svg.js',];const DRAWER_TIMEOUT_MS=3000;let drawerLoading=null;const loadScript=(src)=>new Promise((resolve,reject)=>{const script=document.createElement('script');script.async=!1;script.src=src;script.onload=resolve;script.onerror=()=>reject(new Error(src));document.head.appendChild(script)});const loadDrawer=()=>{if(window.qrcode&&window.fpQrSvg){return Promise.resolve()}
60if(!drawerLoading){drawerLoading=Promise.all(DRAWER_ASSETS.map(loadScript)).catch((error)=>{drawerLoading=null;throw error})}
61return drawerLoading};const drawerReady=()=>Promise.race([loadDrawer().catch(()=>{}),new Promise((resolve)=>setTimeout(resolve,DRAWER_TIMEOUT_MS)),]);const openViewer=()=>{app.openViewer({mobile:{withTick:!0,maxHeight:'calc(100dvh - 20px)'},desktop:{maxWidth:'500px'},component:{components:{qrPayMain:app.qrPayMainComponent,},computed:{...Vuex.mapState(['loc','panelUrl']),},methods:{close(){this.$emit('close')},onError(message){app.growl(message,'danger');this.close()},},store:app.store,template:`
62            <div>
63                <qrPayMain :loc="loc"
64                           :panelUrl="panelUrl"
65                           @close="close"
66                           @error="onError"/>
67            </div>
68            `}})};PubSub.subscribe('showProfileQrPay',()=>{drawerReady().then(openViewer)})});