|
@@ -0,0 +1,319 @@
|
|
|
+<!-- 进出记录详情 -->
|
|
|
+<template>
|
|
|
+ <view class="record-info-page">
|
|
|
+ <view class="top-button-box">
|
|
|
+ <!-- <view class="sub-box">
|
|
|
+ <picker class="sub-box-min-box" @change="bindPickerChange" :value="subIndex" :range="subNameList">
|
|
|
+ <view class="uni-input sub-box-name">{{subNameList[subIndex]}}</view>
|
|
|
+ <view class="sub-box-button">v</view>
|
|
|
+ </picker>
|
|
|
+ </view> -->
|
|
|
+ <view class="right-time-box">
|
|
|
+ <uni-section class="section-time-box" :title="'日期范围用法:' + '[' + range + ']'" type="line"></uni-section>
|
|
|
+ <uni-datetime-picker v-model="range" type="daterange" @change="changeLog($event)" />
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+
|
|
|
+ <scroll-view scroll-y @scrolltolower="scrollGet" class="info-max-box">
|
|
|
+ <view class="for-box" v-for="(item,index) in dataList" :key="index">
|
|
|
+ <view class="time-p">{{item.showInTime}}</view>
|
|
|
+ <view class="for-min-box" v-for="(minItem,minIndex) in item.list" :key="minIndex" @click="tableButton(minItem)">
|
|
|
+ <view class="top-name-box">
|
|
|
+ <view class="position-left"></view>
|
|
|
+ <img v-if="minItem.avatar" :src="baseUrl+minItem.avatar">
|
|
|
+ <img v-else src="@/pages_basics/images/icon_01.png">
|
|
|
+ <view class="top-name-p">{{minItem.userName}}</view>
|
|
|
+ <view class="top-type-p"
|
|
|
+ :class="minItem.accessStatus==1?'colorA':(minItem.accessStatus==2?'colorB':(minItem.accessStatus==3?'colorC':''))">
|
|
|
+ {{minItem.accessStatusStr}}
|
|
|
+ </view>
|
|
|
+ <view class="position-right"></view>
|
|
|
+ </view>
|
|
|
+ <view class="titme-bottom-p">签到时间:{{minItem.inTime?minItem.inTime:'-'}}</view>
|
|
|
+ <view class="titme-bottom-p">离开时间:{{minItem.outTime?minItem.outTime:'-'}}</view>
|
|
|
+ <view class="titme-bottom-p">停留时间:{{minItem.hoursMinutes?minItem.hoursMinutes:'-'}}</view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="get-data-null-p" v-if="getDataType">- 没有更多数据 -</view>
|
|
|
+ </scroll-view>
|
|
|
+ </view>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+ import {
|
|
|
+ config
|
|
|
+ } from '@/api/request/config.js'
|
|
|
+ import {
|
|
|
+ laboratoryAppletSignSubList,
|
|
|
+ laboratoryAppletPassOutList
|
|
|
+ } from '@/pages_basics/api/index.js'
|
|
|
+ export default {
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ baseUrl: config.base_url,
|
|
|
+ range: [],
|
|
|
+ subNameList: [],
|
|
|
+ subList: [],
|
|
|
+ subIndex: 0,
|
|
|
+ // 查询参数
|
|
|
+ queryParams: {
|
|
|
+ page: 1,
|
|
|
+ pageSize: 10,
|
|
|
+ },
|
|
|
+ //数据列表
|
|
|
+ dataList: [],
|
|
|
+ total: 0,
|
|
|
+ getDataType: false,
|
|
|
+ }
|
|
|
+ },
|
|
|
+ onLoad(option) {
|
|
|
+
|
|
|
+ },
|
|
|
+ onShow() {
|
|
|
+ // this.laboratoryAppletSignSubList();
|
|
|
+ this.getList();
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ //选中数据
|
|
|
+ tableButton(item) {
|
|
|
+ if(item.accessStatus == 2){
|
|
|
+ uni.navigateTo({
|
|
|
+ url: '/pages_basics/views/record/infoPage?item=' + encodeURIComponent(JSON.stringify(item)) //安全警报
|
|
|
+ });
|
|
|
+ }
|
|
|
+ },
|
|
|
+ changeLog(e) {
|
|
|
+ this.$set(this.queryParams,'page',1);
|
|
|
+ this.getList();
|
|
|
+ },
|
|
|
+ bindPickerChange(e) {
|
|
|
+ this.$set(this, 'subIndex', e.detail.value);
|
|
|
+ this.$set(this.queryParams,'page',1);
|
|
|
+ this.getList();
|
|
|
+ },
|
|
|
+ //滚动加载事件
|
|
|
+ scrollGet() {
|
|
|
+ if (this.total / this.queryParams.pageSize <= this.queryParams.page) {
|
|
|
+ this.$set(this, 'getDataType', true);
|
|
|
+ } else {
|
|
|
+ this.queryParams.page += 1;
|
|
|
+ this.$nextTick(() => {
|
|
|
+ this.getList();
|
|
|
+ })
|
|
|
+ }
|
|
|
+ },
|
|
|
+ //获取数据列表
|
|
|
+ async getList() {
|
|
|
+ let self = this;
|
|
|
+ let obj = JSON.parse(JSON.stringify(this.queryParams));
|
|
|
+ obj.subId = this.subIndex == 0 ? '' : this.subList[this.subIndex].subId;
|
|
|
+ if (this.range[0]) {
|
|
|
+ obj.startTime = this.range[0] + 'T00:00:00'
|
|
|
+ obj.endTime = this.range[1] + 'T23:59:59'
|
|
|
+ } else {
|
|
|
+ obj.startTime = '';
|
|
|
+ obj.endTime = '';
|
|
|
+ }
|
|
|
+ const {
|
|
|
+ data
|
|
|
+ } = await laboratoryAppletPassOutList(obj);
|
|
|
+ if (data.code == 200) {
|
|
|
+ let list = [];
|
|
|
+ if(this.queryParams.page != 1){
|
|
|
+ list = JSON.parse(JSON.stringify(this.dataList));
|
|
|
+ }
|
|
|
+ data.data.records.forEach((item) => {
|
|
|
+ let num = 0;
|
|
|
+ list.forEach((minItem) => {
|
|
|
+ if (item.showInTime == minItem.showInTime) {
|
|
|
+ num++
|
|
|
+ minItem.list.push(item)
|
|
|
+ }
|
|
|
+ })
|
|
|
+ if (num == 0) {
|
|
|
+ list.push({
|
|
|
+ showInTime: item.showInTime,
|
|
|
+ list: [item]
|
|
|
+ })
|
|
|
+ }
|
|
|
+ })
|
|
|
+ this.$set(this, 'dataList', list);
|
|
|
+ this.$set(this, 'total', data.data.total);
|
|
|
+ if (data.data.total / this.queryParams.pageSize <= this.queryParams.page) {
|
|
|
+ this.$set(this, 'getDataType', true);
|
|
|
+ }
|
|
|
+ }
|
|
|
+ },
|
|
|
+ //查询实验室
|
|
|
+ async laboratoryAppletSignSubList() {
|
|
|
+ let self = this;
|
|
|
+ const {
|
|
|
+ data
|
|
|
+ } = await laboratoryAppletSignSubList();
|
|
|
+ if (data.code == 200) {
|
|
|
+ let nameList = ['全部'];
|
|
|
+ let list = [{
|
|
|
+ subName: '全部',
|
|
|
+ subId: ''
|
|
|
+ }];
|
|
|
+ data.data.forEach((item) => {
|
|
|
+ nameList.push(item.subName)
|
|
|
+ list.push({
|
|
|
+ subName: item.subName,
|
|
|
+ subId: item.subId,
|
|
|
+ })
|
|
|
+ })
|
|
|
+ this.$set(this, 'subNameList', nameList);
|
|
|
+ this.$set(this, 'subList', list);
|
|
|
+ this.$set(this, 'subIndex', 0);
|
|
|
+ }
|
|
|
+ },
|
|
|
+ }
|
|
|
+ }
|
|
|
+</script>
|
|
|
+
|
|
|
+<style lang="stylus" scoped>
|
|
|
+ .record-info-page {
|
|
|
+ height: 100%;
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+ overflow: hidden;
|
|
|
+
|
|
|
+ .top-button-box {
|
|
|
+ padding: 20rpx;
|
|
|
+ display: flex;
|
|
|
+
|
|
|
+ .sub-box {
|
|
|
+ width: 250rpx;
|
|
|
+ height: 70rpx;
|
|
|
+ border-radius: 10rpx;
|
|
|
+ margin-right: 10rpx;
|
|
|
+ border: 1px solid #dedede;
|
|
|
+ background-color: #fff;
|
|
|
+ overflow: hidden;
|
|
|
+
|
|
|
+ .sub-box-min-box {
|
|
|
+ .sub-box-name {
|
|
|
+ padding-left: 10rpx;
|
|
|
+ line-height: 70rpx;
|
|
|
+ display: inline-block;
|
|
|
+ width: 200rpx;
|
|
|
+ overflow: hidden
|
|
|
+ }
|
|
|
+
|
|
|
+ .sub-box-button {
|
|
|
+ display: inline-block;
|
|
|
+ line-height: 70rpx;
|
|
|
+ width: 40rpx;
|
|
|
+ text-align: center;
|
|
|
+ color: #dedede;
|
|
|
+ overflow: hidden
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .right-time-box {
|
|
|
+ flex: 1;
|
|
|
+ height: 80rpx;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .info-max-box {
|
|
|
+ flex: 1;
|
|
|
+ overflow-y scroll;
|
|
|
+
|
|
|
+ .for-box {
|
|
|
+ .time-p {
|
|
|
+
|
|
|
+ margin: 0 32rpx;
|
|
|
+ font-size: 30rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .for-min-box {
|
|
|
+ background: #fff;
|
|
|
+ margin: 32rpx;
|
|
|
+ padding-bottom: 30rpx;
|
|
|
+ .top-name-box {
|
|
|
+ position: relative;
|
|
|
+ display: flex;
|
|
|
+ border-bottom: 1rpx dashed #dedede;
|
|
|
+ margin-bottom: 30rpx;
|
|
|
+
|
|
|
+ img {
|
|
|
+ width: 70rpx;
|
|
|
+ height: 70rpx;
|
|
|
+ border-radius: 50%;
|
|
|
+ margin: 27rpx 31rpx 33rpx 31rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .top-name-p {
|
|
|
+ line-height: 130rpx;
|
|
|
+ font-size: 28rpx;
|
|
|
+ flex: 1;
|
|
|
+ display: block;
|
|
|
+ overflow: hidden;
|
|
|
+ text-overflow: ellipsis;
|
|
|
+ white-space: nowrap;
|
|
|
+ }
|
|
|
+
|
|
|
+ .top-type-p {
|
|
|
+ line-height: 130rpx;
|
|
|
+ margin-right: 40rpx;
|
|
|
+ font-size: 28rpx;
|
|
|
+ display: block;
|
|
|
+ overflow: hidden;
|
|
|
+ text-overflow: ellipsis;
|
|
|
+ white-space: nowrap;
|
|
|
+ }
|
|
|
+
|
|
|
+ .colorA {
|
|
|
+ color: #0183FA;
|
|
|
+ }
|
|
|
+
|
|
|
+ .colorB {
|
|
|
+ color: #999999;
|
|
|
+ }
|
|
|
+
|
|
|
+ .colorC {
|
|
|
+ color: #FA5801;
|
|
|
+ }
|
|
|
+
|
|
|
+ .position-left {
|
|
|
+ position: absolute;
|
|
|
+ left: -15rpx;
|
|
|
+ top: 114rpx;
|
|
|
+ width: 30rpx;
|
|
|
+ height: 30rpx;
|
|
|
+ background: #f5f5f5;
|
|
|
+ border-radius: 15rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .position-right {
|
|
|
+ position: absolute;
|
|
|
+ right: -15rpx;
|
|
|
+ top: 114rpx;
|
|
|
+ width: 30rpx;
|
|
|
+ height: 30rpx;
|
|
|
+ background: #f5f5f5;
|
|
|
+ border-radius: 15rpx;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .titme-bottom-p {
|
|
|
+ line-height: 50rpx;
|
|
|
+ font-size: 28rpx;
|
|
|
+ margin: 0 32rpx;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .get-data-null-p {
|
|
|
+ text-align: center;
|
|
|
+ line-height: 40rpx;
|
|
|
+ padding-bottom: 40px;
|
|
|
+ color: #999;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ }
|
|
|
+</style>
|