mkw-visit-wx/pages/bd/record.vue

<template>
	<view class="containers">
		<view class="dbbtns justify-between">
			<text v-for="item in btnList" :class="{'active':btnActive===item.value}" @click="btnActiveList(item.value)">
				{{item.label}}
			</text>
			<!-- <text >已完成</text>
			<text>待完成</text> -->
		</view>
		<view class="db">
			<view class="dblist">
				<view>
					<view v-for="(item, index) in list" :key="index">
						<view class="dbitem" @click="toDetail(item.id)">
							<text class="dbtype">{{item.type_text}}</text>
							<view class="dbstatus bm">
								<view class="justify-start">
									{{item.audit_status_text}}
									<button class="signBtn" @click.stop='signPic(item.id)' type="primary" v-if="nowadminID==item.accompany_id&&item.audit_status==3&&!item.accept_admin_sign">签字</button>
								</view>
								<view>
									<text style="margin-right:10px">访问时间：{{item.date}}</text>
									<text>{{item.visit_time.start_time}}至{{item.visit_time.end_time}}</text>
								</view>
							</view>
							<view class="dbinfo justify-left">
								<view>
									<view>被访人：<text>{{item.accept_admin.name}}</text></view>
									<view>部门：<text>{{item.accept_admin.department.name}}</text></view>
									<view>访问区域：<text>{{item.visit_area.name}}</text></view>
								</view>
								<view>
									<view>拜访人：<text>{{item.name}}</text></view>
									<view>电话：{{item.mobile}}</view>
									<view v-if="item.type=='1'">事由：<text>{{item.reason}}</text></view>
									<view v-else-if="item.type=='3'">车牌：<text>{{item.plate}}</text></view>
								</view>
							</view>
							<view  class="company">
								<view>
									拜访公司：<text>{{item.company_name?item.company_name:''}}</text>
								</view>
								
							</view>
							<view class="dblong">
								<view>长期访客申请：<text>{{item.long_time==0?'否':'是'}}</text></view>
								<text v-if="item.long_time==1">长期访问时间：{{item.start_date?item.start_date:''}} 至 {{item.end_date?item.end_date:''}}</text>
							</view>
						</view>
					</view>
				</view>
				<view v-if="isEmpty">
					<u-empty mode="data">
					</u-empty>
				</view>
			</view>

		</view>



	</view>
</template>

<script>
	import '@/static/css/bd.css'
	export default {
		data() {
			return {
				btnActive: "",
				nowadminID:'',
				btnList: [{
						label: "全部",
						value: ''
					},
					{
						label: "已完成",
						value: 4
					},
					{
						label: "待完成",
						value: 0
					}
				],
				list: [],
				select: {
					page: 1,
					page_size: 5,
					total: 0,
					audit_status: '',
					my_self:0,
					my_audit:0,
					my_accept_admin:0
				},
				isEmpty:false,
				recordType:""
			}
		},
		onLoad(options) {
			this.recordType = options.type
			this.select.my_audit = this.recordType=='mycheck'?1:0
			this.select.my_self = this.recordType=='call'?1:0
			this.select.my_accept_admin = this.recordType=='myrecord'?1:0
			this.nowadminID = uni.getStorageSync('userInfo_Bd').id
			console.log("this.nowadminID",this.nowadminID)
			this.loadList()
		},
		onPullDownRefresh() {
			this.select.page = 1
			this.loadList()
			uni.stopPullDownRefresh();
		},
		//上拉加载
		onReachBottom() {
			//当当前列表数据长度>=数据总长度时
			if (this.list.length >= this.select.total) {
				//提示
				uni.showToast({
					title: '没有更多了',
					duration: 1000,
					icon: 'none'
				})
			} else {
				//否则，页码+1，继续请求列表
				this.select.page++
				this.loadList()
			}
		},
		methods: {
			signPic(id){
				uni.navigateTo({
					url:'/pages/bd/signpic?id='+id
				})
			},
			toDetail(id) {
				uni.navigateTo({
					url: '/pages/bd/bddetail?id=' + id
				})
			},
			btnActiveList(val) {
				this.btnActive = val
				this.select.audit_status = val
				this.select.page = 1
				this.list = []
				this.isEmpty = false
				this.loadList()
			},
			loadList() {
				let that = this
				this.util.request({
					api: '/api/admin/visit/index',
					method: "get",
					requestType: "bd",
					data: {
						...this.select,
						page: this.select.page,
						// page_size: this.select.page_size,
						// audit_status: this.select.audit_status
					},
					utilSuccess: function(res) {
						if(res.total==0){
							that.isEmpty=true
						}
						if (that.select.page == 1) {
							that.list = res.data
						} else {
							that.list.push(...res.data)
						}
						that.select.total = res.total

					},
					utilFail: function(res) {
						uni.showToast({
							title: res,
							duration: 2000,
							icon: 'none'
						})
					}
				})
			},
		}
	}
</script>

<style scoped>
	.containers {
		background-color: #eceefe;
		min-height: 100vh;
		/* padding-top:20rpx; */
	}
	/deep/ .u-empty{
		min-height: 60vh;
	}
	.signBtn{
		    background-color: #044ed7;
		    padding: 0 30rpx;
		    margin-left: 40rpx;
		    font-size: 32rpx;
		    line-height: 2.3;
	}
	.company{
		padding-bottom:30rpx;
		margin-top:-10rpx;
	}
	.company text{
		color: #8f9596;
	}
</style>