ScanCode.vue
1.91 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
<template>
<view v-if="scanShow">
<!-- 自定义扫码只在H5做展示，uni.scancode不支持H5，H5联盟暂未支持，需自行实现，H5扫码需https支持，若无则手动输入 -->
<u-navbar title="扫码" placeholder v-if="isH5">
<view class="" slot="left">
<u-icon name="arrow-left" @click="close"></u-icon>
</view>
</u-navbar>
<!-- <Navbar canBack title="扫码" /> -->
<!-- HTML -->
<view class="scanCss" v-if="isH5">
<mumu-get-qrcode @success='qrcodeSucess' @error="qrcodeError"></mumu-get-qrcode>
</view>
</view>
</template>
<script>
import mumuGetQrcode from '@/uni_modules/mumu-getQrcode/components/mumu-getQrcode/mumu-getQrcode.vue'
export default {
name: "ScanCode",
components: {
mumuGetQrcode
},
data() {
return {
environment: uni.$u.platform,
isH5: uni.$u.platform === 'h5',
isMP: uni.$u.platform === 'mp-weixin',
isApp:uni.$u.platform === 'app',
scanShow: false
};
},
mounted() {
console.log("当前环境", this.environment);
console.log("当前环境平台",uni.$u.os());
},
methods: {
open() {
this.scanShow = true;
let that = this;
if (this.environment !== 'h5') {
uni.scanCode({
success: function(res) {
console.log(res);
console.log('条码类型：' + res.scanType);
console.log('条码内容：' + res.result);
that.$emit('scanCode', res.result);
that.close();
},
fail:function(e) {
that.close();
},
})
}
},
close() {
console.log("关闭扫码");
this.scanShow = false;
this.$emit('close');
},
qrcodeSucess(s) {
console.log(s);
this.$emit('scanCode', s)
},
qrcodeError(e) {
console.log(e);
}
}
}
</script>
<style lang="scss" scoped>
.scanCss {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
width: 100vw;
height: 100vh;
background: #000;
overflow: hidden;
}
</style>