shangjia1.1/pages/store/cashier/cashier.vue

136 lines
4.2 KiB
Vue

<template>
<view class="body" style="overflow: hidden;padding-bottom: 0rpx">
<view class="" style="width: 100%;height: 20px;visibility: hidden;"></view>
<view class="arrow-left">
<i class="uni-btn-icon" @click="backto" style="color: rgb(255, 255, 255); font-size: 27px;"></i>
</view>
<view class="yld_pay_body" :class="showEncy ? 'hide' : ''">
<view class=""
style="z-index: 111;font-size: 35px; color: #fff;font-weight:800;letter-spacing: 4px;margin: 0 60px;">
<view class="">
扫我付款
</view>
<view class="">
随机减免
</view>
</view>
<view class="top-nav page-first" id="top-nav">
<view class="" style="height: 13px;"></view>
<view class="qrcode">
<canvas id="qrcode" canvas-id="qrcode"
:style="'width: ' + sysWidth * 0.35 * qrcodeWidth + 'px;height:' + sysWidth * 0.35 * qrcodeWidth + 'px;'"></canvas>
</view>
<view class="merchname" :style="'font-size:' + 13 + 'px;'">
{{ yld_merch_userdata.name }}
</view>
</view>
</view>
<!-- 广告 -->
<view class="guanggao">
<video :autoplay="true" :loop="true" :show-fullscreen-btn='false' :show-play-btn='false'
:enable-progress-gesture='false' :show-center-play-btn='false' :controls='false'
:style="'width: ' + sysWidth+ 'px;height: calc(100vh - 195px);'"
src="https://yuledui.oss-cn-qingdao.aliyuncs.com/merch_manage/img/cashier/2.mp4"></video>
<!-- </swiper-item> -->
<!-- <swiper-item :style="'width: ' + sysWidth + 'px;'">
<view class="swiper-item">
<image src="https://yuledui.oss-cn-qingdao.aliyuncs.com/merch_manage/img/cashier/1.jpg" mode="" :style="'width: ' + sysWidth+ 'px;'"
mode="widthFix"></image>
</view>
</swiper-item> -->
<!-- <swiper-item :style="'width: ' + sysWidth + 'px;'">
<view class="swiper-item">
<image src="https://yuledui.oss-cn-qingdao.aliyuncs.com/merch_manage/img/cashier/2.jpg" mode="" :style="'width: ' + sysWidth * 1.5 + 'px;'"
mode="widthFix"></image>
</view>
</swiper-item>
<swiper-item :style="'width: ' + sysWidth + 'px;'">
<view class="swiper-item">
<image src="https://yuledui.oss-cn-qingdao.aliyuncs.com/merch_manage/img/cashier/3.jpg" mode="" :style="'width: ' + sysWidth * 1.5 + 'px;'"
mode="widthFix"></image>
</view>
</swiper-item> -->
<!-- <swiper-item :style="'width: ' + sysWidth + 'px;'">
<video :autoplay="false" :loop="false"
:show-play-btn="true" :muted="true"
:style="'width: ' + sysWidth+ 'px;height:456rpx;'" src="https://yuledui.oss-cn-qingdao.aliyuncs.com/merch_manage/img/cashier/1.mp4"></video>
</swiper-item> -->
<!-- </swiper> -->
</view>
<view>
<image class="bgimg"
src="http://yuledui.oss-cn-qingdao.aliyuncs.com/merch_manage/img/qrcode/cashier/pay-bg.jpg"
id="ecny-img-body-srolltag" mode="scaleToFill" />
</view>
</view>
</template>
<script>
import UQRCode from '@/uni_modules/Sansnn-uQRCode/js_sdk/uqrcode/uqrcode.js';
export default {
data() {
return {
showEncy: false,
sysWidth: uni.getSystemInfoSync().windowWidth,
qrcodeWidth: 0.6,
yld_merch_userdata: uni.getStorageSync("yld_merch_userdata"),
}
},
components: {},
onReady() {
this.makeQRCode()
},
onPullDownRefresh() {
setTimeout(function() {
uni.showToast({
title: '刷新成功',
icon: 'none'
})
uni.stopPullDownRefresh()
}, 688)
},
onHide() {
this.init()
},
onUnload() {
clearInterval(lisenTask)
},
methods: {
backto() {
uni.navigateBack({
delta: 1
})
},
// 生成聚合收款码
makeQRCode(total = null) {
let qrcodeText = "https://yld.angyakeji.com/www/public/view/merge_qrcode/index.html?a=1&scene=merchid%3d"
let qrOption = {
text: qrcodeText,
size: this.sysWidth * this.qrcodeWidth * 0.35,
foreground: {
image: {
src: "",
width: 0.2,
height: 0.2
}
}
}
// qrOption.foreground.image.src = 'http://yuledui.oss-cn-qingdao.aliyuncs.com/merch_manage/img/home_swiper.png'
const ctx = uni.createCanvasContext('qrcode')
const uqrcode = new UQRCode(qrOption, ctx)
uqrcode.make()
uqrcode.draw()
},
},
}
</script>
<style lang="scss" scoped>
@import './cashier.scss';
</style>