Browse Source

扫一扫

h5_css
yanyan 3 years ago
parent
commit
3f26b6e547
  1. 4
      main.js
  2. 51
      pages/knowledge/knowledge.vue
  3. 125
      pages/scan/scan.vue
  4. 4
      utils/config.js

4
main.js

@ -13,8 +13,8 @@ import * as filters from '@/utils/formatFilter'
uni.$http = $http uni.$http = $http
Vue.prototype.$api = api Vue.prototype.$api = api
// $http.baseUrl = 'http://146.56.223.227:9527' $http.baseUrl = 'http://146.56.223.227:9527'
$http.baseUrl = 'http://localhost:9527' // $http.baseUrl = 'http://localhost:85'
$http.beforeRequest = function(options) { $http.beforeRequest = function(options) {
uni.showLoading({ uni.showLoading({

51
pages/knowledge/knowledge.vue

@ -1,8 +1,9 @@
<template> <template>
<view> <view>
知识库页面 知识库
<view class="footbox">
<tabbar :page="page"></tabbar> <tabbar :page="page"></tabbar>
</view>
</view> </view>
</template> </template>
@ -16,11 +17,55 @@
}, },
onShow() { onShow() {
this.page= "know" this.page= "know"
},
methods: {
}, },
components: {tabbar} components: {tabbar}
} }
</script> </script>
<style lang="scss"> <style lang="scss">
.scanBox {
position: fixed;
top: 0;
width: 100%;
height: 100vh;
background-color: #000000;
}
.camera {
position: relative;
width: 70vw;
height: 70vw;
margin: 20vh auto 0;
}
.coverImg{
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: 99999;
}
.scanTip {
padding: 20rpx 0 0 0;
font-size: 32rpx;
text-align: center;
color: #fff;
}
/* 开关手电筒 */
.scancodePic{
background: transparent !important;
width: 100rpx;
height: 100rpx;
padding: 0 !important;
}
.scancodePic>image{
width: 100%;
height: 100%;
}
</style> </style>

125
pages/scan/scan.vue

@ -1,48 +1,119 @@
<template> <template>
<view class="wrap"> <view>
<view class="footbox"> <!-- 扫描框 -->
<tabbar :page="page"></tabbar> <view class="scanBox" v-if="canScan">
</view> <camera class="camera" mode="scanCode" @scancode="scancode" :flash='flashBtn'>
<image class="coverImg" src="/static/images/border.png"></image>
</camera>
<view style="text-align: center;margin: 80rpx 0 40rpx 0;">
<button class="cu-btn scancodePic" @click="changeflashBtn()">
<image :src="flashBtn=='on'?scancodeOpen:scancodeClose"></image>
</button>
</view>
<view class="scanTip">请扫描二维码</view>
<!-- 关闭扫码页面 -->
<view class="footbox">
<tabbar :page="page"></tabbar>
</view>
</view>
</view> </view>
</template> </template>
<script> <script>
import tabbar from "@/components/tabbar/tabbar.vue"; import tabbar from "@/components/tabbar/tabbar.vue";
export default { export default {
data() { data() {
return { return {
page: "" page: "",
sceneName:"",
canScan: true, // 是否显示自定义扫码界面
flashBtn: 'off', // off关闭 on 打开手电筒
scanResult: '' ,// 扫描结果
scancodeOpen:"/static/images/turn_on.png",
scancodeClose:"/static/images/turn_off.png",
}; };
}, },
onLoad() {
this.QR();
// setInterval(() => {
// this.QR(); // 定时刷新数据
// }, 3000); // 每隔3秒刷新一次
},
onShow() { onShow() {
this.page= "scan" this.page= "scan"
}, },
methods: { methods: {
QR() { async scancode(event) {
uni.scanCode({ if (this.isTf) return;
success: (res) => { this.isTf = true;
console.log('扫描二维码成功,结果:' + res.result); setTimeout(() => {
}, // 3秒扫描一次
fail: (res) => { this.isTf = false;
console.log('扫描二维码出现错误') return;
} }, 3000);
uni.vibrateShort(); // 触发手机振动
const { result } = event.detail; // 获取校验扫描结果
const { data: res } = await uni.$http.post('/small/scene/manage/listApp',{guid:result})
if (res.rows.length==0) {
return uni.showToast({title: '未找到相关演练场景'})
}
res.rows.forEach(item=>{
this.sceneName = item.name
}) })
uni.navigateTo({
url: '/subpkg/role/role?guid=' + result+'&name='+this.sceneName
})
},
// 打开关闭手电筒
changeflashBtn(){
if(this.flashBtn=="off"){
this.flashBtn="on"
}else if(this.flashBtn=="on"){
this.flashBtn="off"
}
}, },
}, },
components: { components: {tabbar}
tabbar
}
} }
</script> </script>
<style lang="scss"> <style lang="scss">
@import url("@/static/base_css.css"); .scanBox {
position: fixed;
top: 0;
width: 100%;
height: 100vh;
background-color: #000000;
}
.camera {
position: relative;
width: 70vw;
height: 70vw;
margin: 20vh auto 0;
}
.coverImg{
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: 99999;
}
.scanTip {
padding: 20rpx 0 0 0;
font-size: 32rpx;
text-align: center;
color: #fff;
}
</style> /* 开关手电筒 */
.scancodePic{
background: transparent !important;
width: 100rpx;
height: 100rpx;
padding: 0 !important;
}
.scancodePic>image{
width: 100%;
height: 100%;
}
</style>

4
utils/config.js

@ -1,3 +1,3 @@
// let url_config = 'http://146.56.223.227:9527/' let url_config = 'http://146.56.223.227:9527/'
let url_config = 'http://localhost:9527/' // let url_config = 'http://localhost:85/'
export default url_config export default url_config
Loading…
Cancel
Save