From a0a1c206612de9a3e9d64f3d45564c0ff03f93f6 Mon Sep 17 00:00:00 2001
From: MrShi <1878285526@qq.com>
Date: 星期四, 02 一月 2025 15:22:13 +0800
Subject: [PATCH] 环境
---
h5/pages/polling/task.vue | 462 +++++++++++++++++++++++++++++++++++++++------------------
1 files changed, 313 insertions(+), 149 deletions(-)
diff --git a/h5/pages/polling/task.vue b/h5/pages/polling/task.vue
index 17f1208..6ba466e 100644
--- a/h5/pages/polling/task.vue
+++ b/h5/pages/polling/task.vue
@@ -1,130 +1,251 @@
<template>
<view class="main_app">
-<!-- <view class="head_wrap">
+ <!-- <view class="head_wrap">
<view class="search_wrap">
<image class="mr12 search" src="@/static/home/ic_search@2x.png" mode="widthFix"></image>
<input v-model="param.keyword" @confirm="getList()" type="text" placeholder="鎼滅储妤煎畤/鎴块棿鍚嶇О" placeholder-class="placeholder9" />
</view>
- </view> -->
- <!-- -->
- <view class="tabs">
- <view class="tab" :class="{active: activeTab == 0}" @click="tabsClick(0)">
- <text>寰呭鐞�</text>
- <text class="border"></text>
- </view>
- <view class="tab" :class="{active: activeTab == 1}" @click="tabsClick(1)">
- <text>宸插鐞�</text>
- <text class="border"></text>
- </view>
- <view class="tab" @click="allClick">
- <view class="name">
- <image v-if="selectAll" class="icon" src="@/static/checked.png" mode=""></image>
- <image v-else class="icon" src="@/static/check.png" mode=""></image>
- <text>鏌ョ湅鍏ㄩ儴</text>
- </view>
- <text class="border"></text>
- </view>
- </view>
+ </view> -->
<!-- -->
- <view class="list">
- <view class="item" v-for="item in 10" @click="itemClick(item)">
- <image v-if="item.stats == 1" src="@/static/side/xunjianed.png" class="icon"></image>
- <image v-else src="@/static/side/xunjian.png" class="icon"></image>
- <view class="content">
- <view class="name_wrap line">
- <view class="name">宸℃閰掑晩</view>
- <view class="status">寰呭紑濮�</view>
- </view>
- <view class="line">浠诲姟鏃ユ湡锛歺xx</view>
- <view class="line">鎵ц鏃堕棿锛�121212</view>
- <view class="line">
- <view>瀹屾垚鎯呭喌锛�121212</view>
- <view class="btn">
- <image src="@/static/side/ic_saoma@2x.png" class="saoma" mode=""></image>
- <view>鎵爜宸℃</view>
- </view>
- </view>
+ <view class="tabs">
+ <view class="tab" :class="{active: param.queryStatus == '0,1'}" @click="tabsClick('0,1')">
+ <text>寰呭鐞�</text>
+ <text class="border"></text>
+ </view>
+ <view class="tab" :class="{active: param.queryStatus == 3}" @click="tabsClick(3)">
+ <text>宸插鐞�</text>
+ <text class="border"></text>
+ </view>
+ <view class="tab" @click="allClick">
+ <view class="name">
+ <image v-if="selectAll" class="icon" src="@/static/checked.png" mode=""></image>
+ <image v-else class="icon" src="@/static/check.png" mode=""></image>
+ <text>鏌ョ湅鍏ㄩ儴</text>
</view>
+ <text class="border"></text>
</view>
</view>
<!-- -->
+ <scroll-view scroll-y="true" class="scroll_Y" @scrolltolower="scrolltolower">
+ <view class="list">
+ <view class="item" v-for="item in list">
+ <image @click="itemClick(item)" v-if="item.status == 0 || item.status == 1" src="@/static/side/xunjianed.png" class="icon"></image>
+ <image @click="itemClick(item)" v-else src="@/static/side/xunjian.png" class="icon"></image>
+ <view class="content">
+ <view class="name_wrap line">
+ <view class="name" @click="itemClick(item)">{{item.planTitle}}</view>
+ <view class="status" @click="itemClick(item)" :class="{
+ green: item.status == 1,
+ red: item.status == 2,
+ gray: item.status == 3 || item.status == 4
+ }">{{statusM[item.status]}}</view>
+ </view>
+ <view class="line" @click="itemClick(item)" v-if="item.startDate">浠诲姟鏃ユ湡锛歿{ item.startDate.slice(0, 11) }}</view>
+ <view class="line" @click="itemClick(item)">鎵ц鏃堕棿锛歿{ item.startDate.slice(11, 16) }} 鑷� {{ item.endDate.slice(11, 16) }}</view>
+ <view class="line">
+ <view @click="itemClick(item)">瀹屾垚鎯呭喌锛歿{item.finishNum || 0}}/{{item.patrolNum}}</view>
+ <view v-if="param.queryStatus == '0,1'" class="btn" @click="openSc(item)">
+ <image src="@/static/side/ic_saoma@2x.png" class="saoma" mode=""></image>
+ <view>鎵爜宸℃</view>
+ </view>
+ </view>
+ </view>
+ </view>
+ </view>
+ </scroll-view>
+
+ <!-- -->
+ <!-- -->
+ <view class="reader-box" @click="stopScan" v-if="isScaning">
+ <view class="reader" id="reader"></view>
+ </view>
</view>
</template>
<script>
+ import {
+ ywPatrolTaskPost,
+ getPointRecordByCode
+ } from '@/api'
+ import {
+ Html5Qrcode
+ } from 'html5-qrcode';
export default {
data() {
return {
- param: {},
- activeTab: 0,
- selectAll: false
+ param: {
+ queryStatus: '0,1'
+ },
+ list: [],
+ activeTab: 0,
+ selectAll: false,
+ page: 1,
+
+ statusM: {
+ 0: '寰呭紑濮�',
+ 1: '杩涜涓�',
+ 2: '宸茶秴鏈�',
+ 3: '宸插畬鎴�',
+ 4: '宸插彇娑�',
+ },
+ html5Qrcode: null,
+ isScaning: false,
+ // activeItem: {}
};
},
- methods: {
- tabsClick(val) {
- this.activeTab = val
+ onLoad() {
+ this.getList()
+ },
+ methods: {
+ openSc(item) {
+ this.isScaning = true;
+ Html5Qrcode.getCameras().then((devices) => {
+ if (devices && devices.length) {
+ this.html5Qrcode = new Html5Qrcode('reader');
+ this.html5Qrcode.start({
+ facingMode: 'environment'
+ }, {
+ focusMode: 'continuous', //璁剧疆杩炵画鑱氱劍妯″紡
+ fps: 5, //璁剧疆鎵爜璇嗗埆閫熷害
+ qrbox: 280 //璁剧疆浜岀淮鐮佹壂鎻忔澶у皬
+ },
+ (decodeText, decodeResult) => {
+ if (decodeText) { //杩欓噷decodeText灏辨槸閫氳繃鎵弿浜岀淮鐮佸緱鍒扮殑鍐呭
+ this.stopScan(); //鍏抽棴鎵爜鍔熻兘
+ getPointRecordByCode({
+ taskId: item.id,
+ pointCode: decodeText
+ }).then(ress=> {
+ if(ress.data){
+ uni.navigateTo({
+ url: '/pages/polling/point?id=' + ress.data.id
+ })
+ }else{
+ this.showToast('鏈尮閰嶅埌宸℃鐐�,璇烽噸鏂版壂鎻�')
+ }
+ })
+ }
+ },
+ (err) => {
+ // console.log(err); //閿欒淇℃伅
+ }
+ );
+ }
+ });
},
- allClick() {
- this.selectAll = !this.selectAll
+
+ stopScan() {
+ console.log('鍋滄鎵爜')
+ this.isScaning = false;
+ if (this.html5Qrcode) {
+ this.html5Qrcode.stop();
+ }
},
- itemClick() {
- uni.navigateTo({
- url: '/pages/polling/detail'
- })
- },
- getList() {
- console.log('---');
+ scrolltolower() {
+ const {
+ total,
+ list
+ } = this
+ if (list.length < total) {
+ this.page = this.page + 1
+ this.getList()
+ } else {
+ this.showToast('鏆傛棤鏇村鏁版嵁')
+ }
+ },
+ tabsClick(val) {
+ this.param.queryStatus = val
+ this.page = 1
+ this.list = []
+ this.getList()
+ },
+ allClick() {
+ this.selectAll = !this.selectAll
+ this.list = []
+ this.page = 1
+ this.getList()
+ },
+ itemClick(item) {
+ uni.navigateTo({
+ url: '/pages/polling/detail?id=' + item.id
+ })
+ },
+ getList() {
+ const {
+ page,
+ param,
+ selectAll
+ } = this
+ ywPatrolTaskPost({
+ model: {
+ ...param,
+ dealUserId: selectAll ? '' : uni.getStorageSync('userInfo').id,
+ },
+ page,
+ capacity: 10
+ }).then(res => {
+ this.list = [...this.list, ...res.data.records]
+ this.total = res.data.total
+ })
}
}
}
</script>
-<style lang="scss" scoped>
- .main_app{
- padding: 0 30rpx;
- }
- .tabs{
- display: flex;
- width: 750rpx;
- margin: 12rpx -30rpx 0;
- border-bottom: 1rpx solid #E5E5E5;
- .tab{
- font-size: 30rpx;
- color: #666666;
- flex: 1;
- display: flex;
- flex-direction: column;
- align-items: center;
- justify-content: flex-end;
- height: 88rpx;
- .name{
- display: flex;
- align-items: center;
- }
- .icon{
- width: 28rpx;
- height: 28rpx;
- margin-right: 10rpx;
- }
- .border{
- width: 54rpx;
- height: 6rpx;
- background-color: #fff;
- border-radius: 3rpx;
- margin-top: 24rpx;
- }
- }
- .active{
- font-weight: 600;
- font-size: 32rpx;
- color: #222222;
- .border{
- background-color: $primaryColor;
- }
-
- }
-
+<style lang="scss" scoped>
+ .main_app {
+ padding: 0 30rpx;
}
+
+ .tabs {
+ display: flex;
+ width: 750rpx;
+ margin: 12rpx -30rpx 0;
+ border-bottom: 1rpx solid #E5E5E5;
+
+ .tab {
+ font-size: 30rpx;
+ color: #666666;
+ flex: 1;
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ justify-content: flex-end;
+ height: 88rpx;
+
+ .name {
+ display: flex;
+ align-items: center;
+ }
+
+ .icon {
+ width: 28rpx;
+ height: 28rpx;
+ margin-right: 10rpx;
+ }
+
+ .border {
+ width: 54rpx;
+ height: 6rpx;
+ background-color: #fff;
+ border-radius: 3rpx;
+ margin-top: 24rpx;
+ }
+ }
+
+ .active {
+ font-weight: 600;
+ font-size: 32rpx;
+ color: #222222;
+
+ .border {
+ background-color: $primaryColor;
+ }
+
+ }
+
+ }
+
.head_wrap {
display: flex;
align-items: center;
@@ -137,9 +258,11 @@
background: #F7F7F7;
border-radius: 38rpx;
padding-left: 30rpx;
- input{
- flex: 1;
+
+ input {
+ flex: 1;
}
+
.search {
width: 28rpx;
height: 28rpx;
@@ -148,66 +271,107 @@
}
+ .scroll_Y {
+ height: calc(100vh - 230rpx);
+ }
+
.list {
.item {
display: flex;
- // height: 290rpx;
- padding: 30rpx 0;
+ // height: 290rpx;
+ padding: 30rpx 0;
border-bottom: 2rpx solid #E5E5E5;
+ &:nth-last-child(1){
+ border: none;
+ }
.icon {
width: 80rpx;
- height: 80rpx;
+ height: 80rpx;
margin-right: 24rpx;
}
.content {
- flex: 1;
- color: #666666;
- display: flex;
- flex-direction: column;
- justify-content: space-between;
- .line{
- margin-bottom: 20rpx;
- display: flex;
- justify-content: space-between;
- align-items: center;
- .btn{
- display: flex;
- align-items: center;
- justify-content: center;
- width: 180rpx;
- height: 60rpx;
- background: $primaryColor;
- color: #fff;
- font-size: 26rpx;
- box-shadow: 0rpx 4rpx 12rpx 0rpx rgba(0,104,255,0.3);
- border-radius: 30rpx;
- .saoma{
- width: 28rpx;
- height: 28rpx;
- margin-right: 8rpx;
- }
- }
- &:nth-last-child(1){
- margin-bottom: 0;
- }
- }
- .name_wrap{
- display: flex;
- justify-content: space-between;
- align-items: center;
- .name{
- display: flex;
- align-items: flex-end;
- font-weight: 600;
- font-size: 34rpx;
- color: #222222;
- }
- .status{
- color: $primaryColor;
- }
+ flex: 1;
+ color: #666666;
+ display: flex;
+ flex-direction: column;
+ justify-content: space-between;
+
+ .line {
+ margin-bottom: 20rpx;
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+
+ .btn {
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ width: 180rpx;
+ height: 60rpx;
+ background: $primaryColor;
+ color: #fff;
+ font-size: 26rpx;
+ box-shadow: 0rpx 4rpx 12rpx 0rpx rgba(0, 104, 255, 0.3);
+ border-radius: 30rpx;
+
+ .saoma {
+ width: 28rpx;
+ height: 28rpx;
+ margin-right: 8rpx;
+ }
+ }
+
+ &:nth-last-child(1) {
+ margin-bottom: 0;
+ }
+ }
+
+ .name_wrap {
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+
+ .name {
+ display: flex;
+ align-items: flex-end;
+ font-weight: 600;
+ font-size: 34rpx;
+ color: #222222;
+ }
+
+ .status {
+ color: $primaryColor;
+ }
+
+ .green {
+ color: #0ADE79;
+ }
+
+ .gray {
+ color: #999999;
+ }
}
}
}
}
+
+ .reader-box {
+ position: fixed;
+ top: 0;
+ bottom: 0;
+ left: 0;
+ right: 0;
+ background-color: rgba(0, 0, 0, 0.5);
+ }
+
+ .reader {
+ width: 100%;
+ // width: 540rpx;
+ // height: 540rpx;
+ position: absolute;
+ top: 50%;
+ left: 50%;
+ transform: translate(-50%, -50%);
+ }
</style>
\ No newline at end of file
--
Gitblit v1.9.3