bigDataApp/pages/equipList/modification.vue

<template>
	<view>
		<view class="">
			<view class="mod">
				<view class="mod_name">
					<p><span style="color: #ff0000;" v-if="quanxian.namealter">*</span>设备名称</p>
					<input type="text" v-model="moddata.device_name" :class="quanxian.namealter?'namebg':''"
						:disabled="!quanxian.namealter" />
				</view>
				<view class="mod_id">
					<p>设备ID</p>
					<input type="text" :value="moddata.imei || moddata.device_id" disabled />
				</view>
				<view class="mod_user">
					<p>适配用户</p>
					<input type="text" :value="moddata.real_name==''?'无':moddata.real_name" disabled />
				</view>
				<view class="mod_city" @click="amendcity" v-if="$QueryPermission(109)">
					<p><span style="color: #ff0000;" v-if="quanxian.cityalter">*</span>设备位置</p>
					<view style="display: flex;">
						<input type="text" :value="city" disabled style="width: 400rpx;" />
						<u-icon name="arrow-right"></u-icon>
					</view>
				</view>
				<view class="mod_time">
					<p>设备添加时间</p>
					<input type="text" :value="moddata.addtime|timeFormat()" disabled />
				</view>
				<p style="width: 90%;margin: 0 auto;text-align: right;color: #06B535;"><span
						style="color: #ff0000;">*</span>为可修改</p>
				<view class="sub" v-if="quanxian.infoalter" @click="btn">
					提 交
				</view>
			</view>
		</view>
		<view class="loading" v-if="loading">
			<image src="../../static/images/ajax-loader.gif" mode="" class="img"></image>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				loading: false,
				moddata: [],
				city: "",
				selectcityTF: false,
				quanxian: {
					namealter: false,
					cityalter: false,
					infoalter: false
				}
			}
		},
		methods: {
			async eqlistcity(lat, lng) { //修改设备定位
				const res = await this.$myRequest({
					url: '/api/api_gateway?method=forecast.worm_lamp.revise_device_lnglat',
					data: {
						device_id: this.moddata.imei,
						lat: lat,
						lng: lng
					}
				})
				console.log(res)
				if (res == false) {
					uni.showToast({
						title: "修改地址失败",
						icon: "none"
					})
				} else {
					uni.showToast({
						title: "修改地址成功",
						icon: "none"
					})
				}
			},
			async eqlistname() { //修改设备名称
				const res = await this.$myRequest({
					url: '/api/api_gateway?method=forecast.worm_lamp.revise_device',
					data: {
						device_id: this.moddata.imei,
						device_name: this.moddata.device_name,
					}
				})
				console.log(res)
				if (res == false) {
					uni.showToast({
						title: "修改名称失败",
						icon: "none"
					})
				} else {
					uni.showToast({
						title: "修改名称成功",
						icon: "none"
					})
					uni.removeStorage({
						key: "location"
					})
					this.clickLeft()
				}
			},
			async eqlistuser(id, imei) { //获取设备信息
				const res = await this.$myRequest({
					url: '/api/api_gateway?method=forecast.worm_lamp.lamp_list',
					data: {
						device_type_id: id,
						device_id: imei,
					}
				})
				this.moddata = res.data[0]
				console.log(res)
				this.selectaddress(this.moddata.lng, this.moddata.lat)
			},
			async xyeqlistuser(imei) { //获取设备信息
				const res = await this.$myRequest({
					url: '/api/api_gateway?method=sex_lure_nl.sex_lure.nl_device_list',
					data: {
						device_id: imei,
					}
				})
				console.log(res)
				this.moddata = res.data[0]
				this.selectaddress(this.moddata.lng, this.moddata.lat)
			},
			btn() {
				this.equipmentSubmit()
				// this.eqlistcity(this.moddata.lat, this.moddata.lng)
				// this.eqlistname()
			},
			equipmentSubmit() {
				if (!this.moddata.lat || !this.moddata.lng || !this.moddata.device_name) {

					uni.showToast({
						title: "请检查设备名称和设备位置是否填写完毕",
						icon: "none"
					})

					return
				}

				if (!this.moddata.imei) {
					uni.showToast({
						title: "未查询到当前设备ID,请刷新后重试！",
						icon: "none"
					})
					return
				}
				
				const payload = {
						device_id: this.moddata.imei,
						device_name: this.moddata.device_name,
						lat: this.moddata.lat,
						lng: this.moddata.lng
					}
					
				console.log(payload,'submit equipment info')

				this.$myRequest({
					url: '/api/api_gateway?method=forecast.worm_lamp.revise_device_name_lnglat',
					data: payload
				}).then(res=>{
					console.log(res,'-------------------------------------')
					if(res == false){
						uni.showToast({
							title: "修改失败，请稍后再试",
							icon: "none"
						})
					}else{
						uni.showToast({
							title: "修改成功",
							icon: "none"
						})
						
						this.clickLeft()
					}
				})
			},
			clickLeft() {
				uni.navigateBack({
					delta: 1
				})
			},
			amendcity() { //修改设备地址
				if (this.quanxian.cityalter) {
					this.selectcityTF = true
					uni.navigateTo({
						url: "../fourBase/city"
					})
				} else {
					uni.showToast({
						title: "您暂无权限进行此操作，如有需要，请联系管理员",
						icon: "none"
					})
				}
			},
			selectaddress(lng, lat) { //获取分布位置
				uni.request({
					type: "GET",
					url: "https://restapi.amap.com/v3/geocode/regeo?output=JSON&location=" + lng + "," + lat +
						"&key=78ce288400f4fc6d9458989875c833c2&radius=1000&extensions=all",
					dataType: "json",
					complete: ress => {
						// console.log(ress)
						if (ress.data.regeocode.formatted_address.length == 0) {
							this.city = "--"
						} else {
							this.city = ress.data.regeocode.formatted_address
						}
					}
				});
			},
		},
		onLoad(option) {
			console.log(option)
			if (option.id == 10) {
				this.xyeqlistuser(JSON.parse(option.data).device_id)
			} else {
				this.eqlistuser(option.id, JSON.parse(option.data).imei)
			}
			uni.getStorage({
				key: "jurisdiction",
				success: (res) => {
					console.log(JSON.parse(res.data))
					let items = JSON.parse(res.data).filter((item) => {
						return item.purview_name == "设备管理"
					})
					let items2 = items[0].children.filter((item) => {
						return item.purview_name == "设备列表"
					})
					this.quanxian.namealter = items2[0].children.some((item) => {
						return item.purview_name == "修改名称"
					})
					this.quanxian.cityalter = items2[0].children.some((item) => {
						return item.purview_name == "添加位置"
					})
					this.quanxian.infoalter = items2[0].children.some((item) => {
						return item.purview_name == "修改名称" || item.purview_name == "添加位置"
					})
				},
			})
		},
		onShow() {
			uni.getStorage({
				key: "location",
				success: (res) => {
					this.moddata.lat = res.data[1]
					this.moddata.lng = res.data[0]
					this.selectaddress(this.moddata.lng, this.moddata.lat)
				}
			})
		}
	}
</script>

<style lang="scss" scoped>
	.loading {
		position: fixed;
		top: 0;
		left: 0;
		right: 0;
		bottom: 0;
		text-align: center;

		.img {
			width: 300rpx;
			height: 40rpx;
		}
	}
</style>

<style lang="scss">
	page {
		background-color: #FAFAFA;
	}

	.mod {
		width: 100%;
		padding-top: 30rpx;

		.mod_name,
		.mod_id,
		.mod_user,
		.mod_time,
		.mod_city {
			width: 90%;
			margin: 0 auto 30rpx;
			display: flex;
			justify-content: space-between;
			background-color: #FFFFFF;
			padding: 20rpx 10rpx;
			color: #57C77A;
			line-height: 50rpx;

			.namebg {
				background-color: #FAFAFA;
			}

			input {
				text-align: right;
				font-size: 28rpx;
				padding: 10rpx;
			}
		}
	}

	.sub {
		width: 90%;
		margin: 30rpx auto;
		text-align: center;
		height: 70rpx;
		line-height: 70rpx;
		background-color: #57C77A;
		border-radius: 35rpx;
		color: #FFFFFF;
	}
</style>