wit-uniapp/pages/Workorder/Intelligentdoorlock/Intelligentdoorlock.vue

<template>
	<view class="billall">

		<!-- 列表 -->
		<!-- <t-table>
			<t-tr>
				<t-th>序号</t-th>
				<t-th>姓名</t-th>
				<t-th>年龄</t-th>
				<t-th>爱好</t-th>
				<t-th>操作</t-th>
			</t-tr>
			<t-tr v-for="item in tableList" :key="item.id">
				<t-td>{{ item.id + 1 }}</t-td>
				<t-td>{{ item.name }}</t-td>
				<t-td>{{ item.age }}</t-td>
				<t-td>{{ item.hobby }}</t-td>
				  <t-td align="left"> <u-button @click="edit(item)"  size="small" type="primary" :plain="true" text="编辑"></u-button></t-td>
				
			</t-tr>
		</t-table> -->

		<view class="u-listdata">
			<view style="padding:10rpx 0 0 30rpx">
				共有 <span style="color: red">{{totalnumber}}</span>条记录
			</view>

			<u-list @scrolltolower="scrolltolower" :pagingEnabled='true'>
				<u-list-item v-for="(item, index) in indexList" :key="index">

					<view class="companylist">
					
						<h3>{{item.name}}</h3>
						<view class="Currentamount">
							房间编号:{{item.roomid}}
						</view>
						<view class="Currentamount">
							用户总数量: {{item.usernum}}
						</view>
						<view class="Currentamount">
							设备编号:￥{{item.deviceId}}
						</view>
						<view class="Currentamount">
							网关编号: {{item.deviceno}}
						</view>
						<view class="Currentamount">
							安装时间: {{item.installationtime}}
						</view>
											
						<view class="mjkg">
							<view class="anniu">
								<u-button  type="primary" :plain="true" text="开门记录" @click="kaimen(item)"></u-button>
							</view>
							<view class="anniu">
								<u-button  type="primary" :plain="true" text="远程开门" @click="Remotedooropening(item)"></u-button>
							</view>	
							<view class="anniu">
								<u-button  type="primary" :plain="true" text="临时密码"  @click="mima(item)"></u-button>
							</view>		
							<view class="anniu">
								<u-button  type="primary" :plain="true" text="查看租户"  @click="seedetail(item)"></u-button>
							</view>
						
						</view>
					</view>

				</u-list-item>
			</u-list>

		</view>

		<!-- 门锁信息 -->
		<u-popup :show="showms" mode="bottom" @close="closems" :closeable='true'>
			<view class="mensuoxx">
				<h3>临时密码</h3>

				<u-cell-group>
					<u-cell icon="lock-opened-fill" title="临时密码" :value='lsmima'></u-cell>

				</u-cell-group>
			</view>
		</u-popup>

		<u-notify ref="uNotify" message=""></u-notify>
	</view>
</template>

<script>
	// import tTable from '@/components/t-table/t-table.vue';
	// import tTh from '@/components/t-table/t-th.vue';
	// import tTr from '@/components/t-table/t-tr.vue';
	// import tTd from '@/components/t-table/t-td.vue';
	export default {
		components: {
			// tTable,
			// tTh,
			// tTr,
			// tTd
		},
		data() {

			return {
				showms: false,

				totalnumber: 0,
				setyesno: true,
				lsmima: '',
				indexList: [],
				dataList: [],
				dataForm: {
					"currentPage": 0,
					"deviceId": "",
					"pageSize": 10,
					"roomId": "",
					"tempPwd": "",
					"tenantsId": "",
					"userName": ""
				},

				showtype: false,
				showdct: false,
				mytitle: '',
				alldata: [],
				showfloor: false,
				loading: false,
				columns: [],
				pd: true,
				columnData: [],
				myday: '',
				mytype: '全部',
				showPicker: false,




			}
		},
		//监听页面加载，其参数为上个页面传递的数据，参数类型为 Object（用于页面传参
		onLoad() {
			this.getalldata();

		},
		//监听页面初次渲染完成。注意如果渲染速度快，会在页面进入动画完成前触发
		onReady() {
			// 微信小程序需要用此写法

		},

		//监听页面隐藏
		onHide() {},
		//监听窗口尺寸变化
		onResize() {},
		//监听页面卸载
		onUnload() {},
		//监听用户下拉动作，一般用于下拉刷新
		onPullDownRefresh() {},


		methods: {
			Remotedooropening(e) {
				let postdata = {
					cmdType: 'RemoteOpenDoor',
					roomId: e.roomid
				};
				this.$api.post('/lock/issuedCmd', postdata)
					.then(res => {
						if (res.data.code == 0) {
this.$refs.uNotify.success(res.data.data)

						} else {
							this.$refs.uNotify.error(res.data.msg)
						}
					})
			},

			seedetail(e) {
				uni.navigateTo({
					url: `/pages/Workorder/Intelligentdoorlock/Tenantdetails/Tenantdetails?companyOrgId=${e.roomid}`
				});
			},
			kaimen(e) {
				uni.navigateTo({
					url: `/pages/Workorder/Intelligentdoorlock/Dooropeningrecord/Dooropeningrecord?companyOrgId=${e.roomid}`
				});
			},
			mima(e) {


				let postdata = {
					"currentPage": 0,
					"deviceId": "",
					"pageSize": 10,
					"roomId": e.roomid,
					"tempPwd": "",
					"tenantsId": "",
					"userName": ""
				};
				this.$api.post('/lock/getTempPwd', postdata)
					.then(res => {

						if (res.data.code == 0) {
							this.showms = true;
							this.lsmima = res.data.data;
							// console.log('111111111111111111',this.lsmima)
						} else {
							this.$refs.uNotify.error(res.data.msg)
						}
					})

			},
			closems() {
				this.showms = false
				// console.log('close');
			},




			scrolltolower() {
				if (this.pd) {
					this.getalldata();
				} else {
					return
				}
			},

			getalldata() {
				this.$api.post('/lock/page', this.dataForm)
					.then(res => {
						this.totalnumber = res.data.data.total;
						if (res.data.data.list.length != 0) {
							this.indexList.push(...res.data.data.list);
							this.dataForm.currentPage = this.dataForm.currentPage + 1;
							this.pd = true;
						} else {
							uni.showToast({
								title: '暂无更多数据了',
								icon: 'none',
								duration: 1500
							})
							this.pd = false;
						}

					})
			},








		}
	}
</script>

<style lang="scss">
	.mensuoxx {
		width: 750rpx;
		height: 300rpx;

		h3 {
			width: 100%;
			height: 80rpx;
			text-align: center;
			line-height: 80rpx;
			margin-bottom: 50rpx;
		}
	}
.mjkg {
		display: flex;
		align-items: center;
		justify-content:flex-end;
		height: 120rpx;
		border-top: 2px solid #F6F6F6;
		margin-top: 20rpx;
	}
.anniu{
	width: 120rpx;
	margin-left: 30rpx;
}

	.Currentamount {
		padding-left: 30rpx;
		min-height: 50rpx;
		line-height: 50rpx;
		color: #BCB3A7;

		span {
			color: #FA5555;
			padding-left: 9rpx;
		}
	}

	.Callfee {
		width: 100rpx;
		height: 45rpx;
		text-align: center;
		line-height: 45rpx;
		color: #5C8FFF;
		border: 1px solid #5C8FFF;
		font-size: 22rpx;
		position: absolute;
		bottom: 10rpx;
		right: 10px;
		font-weight: bold;
	}

	.companylist {
		margin: 20rpx 30rpx;
		background: #fff;
		min-height: 380rpx;
		border-radius: 10px;
		position: relative;

		h3 {
			height: 70rpx;
			line-height: 70rpx;
			padding-left: 30rpx;
		}
	}

	.settled {
		background-color: #2B60DE;
		width: 120rpx;
		height: 60rpx;
		text-align: center;
		line-height: 60rpx;
		color: #fff;
		font-size: 14rpx;
		position: absolute;
		top: 0px;
		right: 0px;
		border-top-right-radius: 10rpx;
		border-bottom-left-radius: 10rpx;
	}

	.outstanding {
		background-color: #09C700;
		width: 120rpx;
		height: 60rpx;
		text-align: center;
		line-height: 60rpx;
		color: #fff;
		font-size: 14rpx;
		position: absolute;
		top: 110rpx;
		right: 0px;
		border-top-left-radius: 10rpx;
		border-bottom-left-radius: 10rpx;
	}

	.outstanding1 {
		background-color: #3090C7;
		width: 120rpx;
		height: 60rpx;
		text-align: center;
		line-height: 60rpx;
		color: #fff;
		font-size: 14rpx;
		position: absolute;
		top: 56%;
		right: 0px;
		border-top-left-radius: 10rpx;
		border-bottom-left-radius: 10rpx;
	}

	.outstanding2 {
		background-color: #4E8975;
		width: 120rpx;
		height: 60rpx;
		text-align: center;
		line-height: 60rpx;
		color: #fff;
		font-size: 14rpx;
		position: absolute;
		bottom: 0px;
		right: 0px;
		border-top-left-radius: 10rpx;
		border-bottom-right-radius: 10rpx;
	}




	.billall {}

	.topbill {
		display: flex;
		justify-content: space-around;
		align-items: center;
		height: 100rpx;
		background-color: #e6e6e6;
	}

	.topbilledit {
		display: flex;
		justify-content: space-around;
		align-items: center;
	}

	.changetime1 {
		padding-right: 10rpx;
	}
</style>