From 09132fa0cc6f9d9dba97e12b50700c2ef51a0b6e Mon Sep 17 00:00:00 2001
From: liukangdong <898885815@qq.com>
Date: 星期日, 29 九月 2024 11:30:31 +0800
Subject: [PATCH] 月台屏
---
h5_meeting/pages/index/index.vue | 76 +++++++++++++++++++++++++++++--------
1 files changed, 59 insertions(+), 17 deletions(-)
diff --git a/h5_meeting/pages/index/index.vue b/h5_meeting/pages/index/index.vue
index 91910e4..44a7607 100644
--- a/h5_meeting/pages/index/index.vue
+++ b/h5_meeting/pages/index/index.vue
@@ -16,8 +16,8 @@
<text v-if="info.meetingListResponseList && info.meetingListResponseList.length > 0 && info.meetingListResponseList[0].meetingStatus == 3">宸茬粨鏉�</text>
<text v-if="info.meetingListResponseList && info.meetingListResponseList.length > 0 && info.meetingListResponseList[0].meetingStatus == 5">宸叉挙閿�</text>
</view>
- <view class="meeting_name">{{meetingInfo.meetingName}}</view>
- <view class="meeting_con">
+ <view v-if="meetingInfo.meetingName" class="meeting_name">{{meetingInfo.meetingName}}</view>
+ <view v-if="meetingInfo.meetingTime && meetingInfo.bookingUser" class="meeting_con">
<view class="content">
<view class="line">
<image src="@/static/ic_time@2x.png"></image>
@@ -28,7 +28,9 @@
<text>棰勭害浜猴細{{meetingInfo.bookingUser }}</text>
</view>
</view>
- <vueQr v-if="meetingInfo.id" :text="meetingInfo.id" class="qrcode" />
+ <view v-if="meetingInfo.meetingTime" class="qrcode_wrap">
+ <canvas id="qrcode" canvas-id="qrcode" class="qrcode"></canvas>
+ </view>
</view>
<view class="meeting_wrap">
<view class="title">浠婃棩浼氳锛坽{ info.meetingListResponseList && info.meetingListResponseList.length > 0 ? info.meetingListResponseList.length : 0 }}锛�</view>
@@ -49,13 +51,13 @@
</view>
<!-- -->
- <swiper v-if="info.fileType == 0 && info.multifileList && info.multifileList.length > 0" class="swiper" circular autoplay indicator-dots>
+ <swiper v-if="info.fileType == 0 && (info.meetingListResponseList == null || info.meetingListResponseList.length == 0)" class="swiper" circular autoplay indicator-dots>
<swiper-item v-for="item in info.multifileList">
<image class="swiper_item" :src="item.fileurlFull" mode="aspectFill"></image>
</swiper-item>
</swiper>
<!-- -->
- <template v-if="info.fileType == 1 && info.multifileList && info.multifileList.length > 0">
+ <template v-if="info.fileType == 1 && info.multifileList && info.multifileList.length > 0 && (info.meetingListResponseList == null || info.meetingListResponseList.length == 0)">
<video :src="info.multifileList[0].fileurlFull" class="app_video" :autoplay="true" loop :controls="false"></video>
</template>
</view>
@@ -63,12 +65,13 @@
<script>
import dayjs from 'dayjs'
- import vueQr from 'vue-qr/src/packages/vue-qr.vue'
+ // import vueQr from 'vue-qr/src/packages/vue-qr.vue'
+ import UQRCode from 'uqrcodejs'
import {
meetScreenData
} from '@/api/index.js'
export default {
- components: {vueQr},
+ // components: {vueQr},
data() {
return {
time: '',
@@ -87,7 +90,7 @@
meetingInfo: {}
}
},
- onLoad() {
+ onShow() {
this.initDatetime()
this.param = uni.getStorageSync('param') || {}
if (!this.param.code) {
@@ -96,6 +99,8 @@
})
}
this.getData()
+ },
+ onReady() {
},
methods: {
getData() {
@@ -105,9 +110,29 @@
this.info = res.data
if(this.info.meetingListResponseList && this.info.meetingListResponseList.length > 0){
this.meetingInfo = this.info.meetingListResponseList[0]
- this.$forceUpdate()
+ this.$nextTick(() => {
+ this.qrcodeCreate()
+ this.$forceUpdate()
+ })
}
})
+ },
+ qrcodeCreate(){
+ // 鑾峰彇uQRCode瀹炰緥
+ var qr = new UQRCode();
+ // 璁剧疆浜岀淮鐮佸唴瀹�
+ // qr.data = "https://uqrcode.cn/doc";
+ qr.data = "https://open.weixin.qq.com/connect/oauth2/authorize?appid=wxac2a80c2144c4ee0&redirect_uri=http://192.168.0.109:8080/redirect.html&response_type=code&scope=snsapi_base&state=1#wechat_redirect";
+ // 璁剧疆浜岀淮鐮佸ぇ灏忥紝蹇呴』涓巆anvas璁剧疆鐨勫楂樹竴鑷�
+ qr.size = 83;
+ // 璋冪敤鍒朵綔浜岀淮鐮佹柟娉�
+ qr.make();
+ // 鑾峰彇canvas涓婁笅鏂�
+ var canvasContext = uni.createCanvasContext('qrcode', this); // 濡傛灉鏄粍浠讹紝this蹇呴』浼犲叆
+ // 璁剧疆uQRCode瀹炰緥鐨刢anvas涓婁笅鏂�
+ qr.canvasContext = canvasContext;
+ // 璋冪敤缁樺埗鏂规硶灏嗕簩缁寸爜鍥炬缁樺埗鍒癱anvas涓�
+ qr.drawCanvas();
},
touchend() {
this.touchNum++
@@ -140,6 +165,9 @@
</script>
<style lang="scss" scoped>
+ page,body{
+ overflow: hidden;
+ }
.swiper{
position: fixed;
top: 0;
@@ -169,7 +197,7 @@
display: flex;
flex-direction: column;
justify-content: space-between;
- padding-bottom: 35rpx;
+ padding-bottom: 42rpx;
color: #fff;
overflow: hidden;
.meeting_wrap {
@@ -222,7 +250,13 @@
.name {
flex: 1;
font-weight: bold;
- font-size: 39rpx;
+ font-size: 39rpx;
+ width: 100%;
+ word-break: break-all;
+ text-overflow: ellipsis;
+ display: -webkit-box;
+ -webkit-box-orient: vertical;
+ -webkit-line-clamp: 3; /* 瓒呭嚭鍑犺鐪佺暐 */
}
.line {
@@ -232,7 +266,7 @@
}
.empty {
- background: rgba(255, 255, 255, 0.11);
+ background: rgba(255, 255, 255, 0.11) !important;
}
}
}
@@ -258,11 +292,19 @@
}
}
}
-
- .qrcode {
- width: 166rpx;
- height: 166rpx;
+ .qrcode_wrap{
+ width: 92px;
+ height: 92px;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ background-color: #fff;
+ .qrcode {
+ width: 84px;
+ height: 84px;
+ }
}
+
}
.meeting_name {
@@ -285,7 +327,7 @@
}
.header_wrap {
- padding: 34rpx 34rpx 0 0;
+ padding: 42rpx 34rpx 0 0;
display: flex;
justify-content: space-between;
align-items: center;
--
Gitblit v1.9.3