smartswrtch-app/page_user/wifijoint/index.vue

<template>
	<view class="">
		<u-navbar title="设备控制" :border-bottom="false" :background="bgc" title-color='#262B37' back-icon-color="#262B37"
			title-size='36' height='50' :custom-back="btnmy"></u-navbar>
		<view class="title">
			控制台
		</view>
		<view class="shuom">
			请扫描设备上的二维码
		</view>
		<view class="iptbox">
			<view class="qrcode" @click="qrcode()">
				<image src="https://api.ccttiot.com/smartmeter/img/static/uy7BNwAMIKwvstqFnRhs" mode="aspectFit">
				</image>
			</view>
			<input type="text" class="ips" v-model="storeId" placeholder="请扫描设备上的二维码" style="margin-left: 32rpx;"
				placeholder-class="my-placeholder"/>
			<!-- <input type="text" class="ips" v-model="storeIds" v-if="storeIds" placeholder="请扫描设备上的二维码" style="margin-left: 32rpx;"
				placeholder-class="my-placeholder" /> -->
		</view>
		<view class="machao">
			MAC号：{{obj.mac == undefined ? '--' : obj.mac}}
		</view>
		<view class="machao">
			电压：{{obj.voltage == undefined ? '--' : obj.voltage}}V
		</view>
		<view class="machao">
			功率：{{obj.realTimePower == undefined ? '--' : obj.realTimePower}}KW
		</view>
		<view class="machao">
			电流：{{obj.electricity == undefined ? '--' : obj.electricity}}A
		</view>
		<view class="machao">
			网络：<text v-if="onlineStatus == '离线'" style="color: red;">离线</text> <text v-if="onlineStatus == '在线'"
				style="color: green;">在线</text>
		</view>
		<view class="machao">
			状态：<text v-if="powerStatus == '关闭'" style="color: red;">关闭</text> <text v-if="powerStatus == '开启'"
				style="color: green;">开启</text>
		</view>
		<view class="machao">
			版本号：{{obj.version == undefined ? '--' : obj.version}}
		</view>
		<view class="machao">
			最后在线时间：{{obj.lastOnlineTime == undefined ? '--' : obj.lastOnlineTime}}
		</view>
		
		<view class="jiaozhun">
			<view class="input">
				<button @click="btnjian">-</button>
				<input type="text" v-model="valuedian" placeholder="输入校准电压"/>  
				<button @click="btnadd">+</button>
			</view>
			<view class="view" @click="btnjiaozhun">
				校准电压
			</view>
		</view>

		<view class="list">
			<view class="anniulist">
				<view class="anniu" @click="btnkq">
					开启
				</view>
				<view class="anniu" @click="btngb">
					关闭
				</view>
				<view class="anniu" @click="btnsx">
					刷新
				</view>
			</view>
			<view class="fanhui" @click="btnfh">
				返回
			</view>
		</view>

	</view>
</template>

<script>
	export default {
		data() {
			return {
				bgc: {
					backgroundColor: "#F7FAFE",
				},
				storeId: '',
				storeIds: '',
				obj: {},
				id: '',
				onlineStatus: '--',
				powerStatus: '--',
				valuedian:220,
				xshu:'1',
				x:''
			}
		},
		onLoad(options) {
			if (options.sn) {
				this.storeId = options.sn
				this.getsn()
			} 
		},
		// 分享到好友（会话）
		onShareAppMessage: function() {
			return {
				title: '创想物联',
				path: '/pages/shouye/index'
			}
		},

		// 分享到朋友圈  
		onShareTimeline: function() {
			return {
				title: '创想物联',
				query: '',
				path: '/pages/shouye/index'
			}
		},
		methods: {
			btnjian(){
				this.valuedian = Number(this.valuedian) - 1
			},
			btnadd(){
				this.valuedian = Number(this.valuedian) + 1
			},
			btnjiaozhun(){
				this.x = this.obj.voltage / this.valuedian * this.xshu 
				console.log(this.x)
			},
			
			btnmy() {
				uni.reLaunch({
					url: '/pages/my'
				})
			},
			qrcode() {
				uni.scanCode({
					onlyFromCamera: true,
					scanType: ['qrCode'],
					success: res => {
						function getQueryParam(url, paramName) {
							let regex = new RegExp(`[?&]${paramName}=([^&]*)`)
							let results = regex.exec(url);
							return results ? decodeURIComponent(results[1].replace(/\+/g, ' ')) : null
						}
						let sceneValue = res.result
						let decodedValue = decodeURIComponent(sceneValue)
						let id = getQueryParam(decodedValue, 's')
						this.storeId = id
						this.getsn()
					},
					fail: err => {
						console.error('扫描失败：', err)
						uni.showToast({
							title: '扫描失败',
							icon: 'none'
						})
					}
				})
			},

			getsn() {
				if (this.storeId == '' || this.storeId == null) {
					this.$u.get(`/app/device/${this.storeIds}/bySn`).then(res => {
						if (res.code == 200) {
							this.obj = res.data
							this.id = res.data.deviceId
							if (res.data.onlineStatus == 0) {
								this.onlineStatus = '离线'
							} else if (res.data.onlineStatus == 1) {
								this.onlineStatus = '在线'
							}
							if (res.data.powerStatus == 0) {
								this.powerStatus = '关闭'
							} else if (res.data.powerStatus == 1) {
								this.powerStatus = '开启'
							}
							uni.showToast({
								title: res.msg,
								icon: 'success',
								duration: 2000,
							})
							uni.hideLoading()
						} else {
							uni.showToast({
								title: res.msg,
								icon: 'none',
								duration: 2000,
							})
						}
					})
				}else{
					this.$u.get(`/app/device/${this.storeId}/bySn`).then(res => {
						if (res.code == 200) {
							this.obj = res.data
							this.id = res.data.deviceId
							if (res.data.onlineStatus == 0) {
								this.onlineStatus = '离线'
							} else if (res.data.onlineStatus == 1) {
								this.onlineStatus = '在线'
							}
							if (res.data.powerStatus == 0) {
								this.powerStatus = '关闭'
							} else if (res.data.powerStatus == 1) {
								this.powerStatus = '开启'
							}
							uni.showToast({
								title: res.msg,
								icon: 'success',
								duration: 2000,
							})
							uni.hideLoading()
						} else {
							uni.showToast({
								title: res.msg,
								icon: 'none',
								duration: 2000,
							})
						}
					})
				}
			},

			// 返回录入
			btnfh() {
				uni.reLaunch({
					url: '/page_fenbao/zhuce'
				})
			},

			// 开启
			btnkq() {
				uni.showLoading({
					title: '设备开启中...'
				})
				this.$u.put(`/app/device/admin/${this.id}/switch?open=true`).then((res) => {
					if (res.code == 200) {
						// setTimeout(()=>{
						// 	this.btnsx()
						// },1000)
						uni.showToast({
							title: '开启成功',
							icon: 'success',
							duration: 2000
						})
						this.powerStatus = '开启'
					} else {
						uni.showToast({
							title: '开启失败',
							icon: 'none',
							duration: 2000
						})
					}
				})
			},
			// 关闭
			btngb() {
				uni.showLoading({
					title: '设备关闭中...'
				})
				this.$u.put(`/app/device/admin/${this.id}/switch?open=false`).then((res) => {
					if (res.code == 200) {
						// setTimeout(()=>{
						// 	this.btnsx()
						// },1000)
						uni.showToast({
							title: '关闭成功',
							icon: 'success',
							duration: 2000
						})
						this.powerStatus = '关闭'
					} else {
						uni.showToast({
							title: '关闭失败',
							icon: 'none',
							duration: 2000
						})
					}
				})
			},
			// 刷新
			btnsx() {

				this.$u.get(`/app/device/v2/refreshIot?deviceNo=${this.storeId}`).then((res) => {
					if (res.code == 200) {
						this.getsn()
						uni.showToast({
							title: '刷新成功',
							icon: 'success',
							duration: 2000
						})
					} else {
						uni.showToast({
							title: '刷新失败',
							icon: 'none',
							duration: 2000
						})
					}
				})
			}


		}
	}
</script>

<style lang="less">
	.jiaozhun{
		display: flex;
		padding: 50rpx;
		box-sizing: border-box;
		width: 100%;
		justify-content: space-between;
		button{
			height: 80rpx;
			line-height: 80rpx;
			background-color: #8883f0;
			color: #fff;
		}
		.input{
			input{
				height: 80rpx;
				line-height: 80rpx;
			}
			border: 1px solid #ccc;
			border-radius: 20rpx;
			display: flex;
			width: 400rpx;
			height: 80rpx;
			text-align: center;
		}
		.view{
			width: 200rpx;
			height: 80rpx;
			border-radius: 20rpx;
			background-color: #8883f0;
			color: #fff;
			text-align: center;
			line-height: 80rpx;
			font-size: 28rpx;
		}
	}
	.list {
		position: fixed;
		bottom: 50rpx;
		left: 50%;
		transform: translateX(-50%);

		.anniulist {
			width: 658rpx;
			margin: auto;
			margin-top: 200rpx;
			text-align: left;
			font-size: 32rpx;
			display: flex;
			justify-content: space-between;

			.anniu {
				width: 30%;
				height: 90rpx;
				border-radius: 20rpx;
				background-color: #8883f0;
				color: #fff;
				font-size: 32rpx;
				text-align: center;
				line-height: 90rpx;
			}
		}

		.fanhui {
			width: 658rpx;
			height: 90rpx;
			border-radius: 20rpx;
			background-color: #8883f0;
			color: #fff;
			font-size: 32rpx;
			text-align: center;
			line-height: 90rpx;
			margin: auto;
			margin-top: 50rpx;
		}
	}

	.machao {
		width: 658rpx;
		margin: auto;
		margin-top: 20rpx;
		text-align: left;
		font-size: 32rpx;
	}

	.title {
		font-size: 70rpx;
		font-weight: 600;
		text-align: left;
		width: 658rpx;
		margin: auto;
		margin-top: 30rpx;
	}

	.shuom {
		width: 658rpx;
		margin: auto;
		margin-top: 30rpx;
		text-align: left;
		font-size: 32rpx;
	}

	.iptbox {
		display: flex;
		align-items: center;
		flex-wrap: nowrap;
		padding: 22rpx;
		margin: 28rpx auto 0;
		width: 658rpx;
		height: 88rpx;
		background: #FFFFFF;
		box-shadow: 0rpx 0rpx 8rpx 0rpx rgba(0, 0, 0, 0.15);
		border-radius: 20rpx 20rpx 20rpx 20rpx;

		.qrcode {
			padding-right: 20rpx;
			border-right: 2rpx solid #D8D8D8;

			image {
				width: 54rpx;
				height: 54rpx;
			}
		}

		.ips {
			width: 630rpx;

		}

		image {
			width: 18rpx;
			height: 32rpx;
		}

		.my-placeholder {
			font-weight: 400;
			font-size: 32rpx;
			color: #808080;
		}
	}
</style>