<style lang="scss" scoped>
	.equipmentSetting-ctn{
		padding: 20rpx 30rpx
		:not(not) {
			box-sizing: border-box;
		}
	}
	.equipment-setting-row{
		display: flex;
		align-items: center;
		height: 50rpx;
		margin-bottom: 30rpx;
		&-right{
			text-align: right;
			flex-grow:1;
			color: $uni-text-color-main;
		}
	}
	.reportPopup-ctn{
		.reportPopup-title{
			padding: 32rpx 0;
			text-align: center;
		}
		.reportPopup-clock{
			padding: 10rpx 30rpx;
			display: flex;
			border-top: 1px solid #F7F7F7;
			border-bottom: 1px solid #F7F7F7;
		}
		.reportPopup-btn{
			display: flex;
			&-cancel,&-confirm{
				flex: 1;
				text-align: center;
				padding: 30rpx 0;
			}
			&-confirm{
				border-left:1px solid #f7f7f7;
				color: $uni-text-color-main;
			}
		}
	}
	
</style>

<template>
	<view class="equipmentSetting-ctn">
		<view class="equipment-top-setting">
			<view class="equipment-setting-row" v-for="(item,index) in settingList" :key="index" @tap="pickSettingBoxFn(item)">
				<view class="">
					<tui-icon :name="item.icon"></tui-icon>
				</view>
				<view class="pl20">{{item.name}}</view>
				<view class="equipment-setting-row-right">
					<u-icon name="arrow-right" size="32"></u-icon>
				</view>
			</view>
		</view>
		
		<u-popup v-model="settingPopupObj.reportPopupFlag" mode="center" border-radius="16" width="550">
			<view class="reportPopup-ctn">
				<view class="reportPopup-title">
					上报间隔
				</view>
				<view class="reportPopup-clock">
					<u-icon name="clock" size="36" class="mr10"></u-icon>
					<u-input ></u-input>
				</view>
				<view class="reportPopup-btn">
					<view class="reportPopup-btn-cancel" @click="reportCancelFn">取消</view>
					<view class="reportPopup-btn-confirm" @click="reportConfirmFn">确定</view>
				</view>
			</view>
		</u-popup>
		<!-- <u-modal v-model="settingPopupObj.protectionPopupFlag" content="确定发送指令吗？" :show-cancel-button="true" @confirm="protectionConfirmFn"></u-modal> -->
		<!-- <u-modal v-model="settingPopupObj.removalPopupFlag" content="确定发送指令吗？" :show-cancel-button="true" @confirm="removalConfirmFn"></u-modal> -->
		<u-modal v-model="settingPopupFlag" content="确定发送指令吗？" :show-cancel-button="true" @confirm="settingConfirmFn"></u-modal>
		
	</view>
</template>

<script>
	export default{
		data(){
			return {
				settingPopupObj:{
					reportPopupFlag:false,
				// 	protectionPopupFlag:false,
				// 	removalPopupFlag:false
				},
				settingList:[{
					name:"上报间隔",
					icon:"report"
				},{
					name:"布防",
					icon:"safe"
				},{
					name:"撤防",
					icon:"not-safe"
				},{
					name:"立即定位",
					icon:"location"
				},{
					name:"控制断电",
					icon:"duandian"
				},{
					name:"恢复通电",
					icon:"tongdian"
				},{
					name:"设备重启",
					icon:"chongqi"
				},{
					name:"恢复出厂设置",
					icon:"reset"
				},{
					name:"指令记录",
					icon:"time"
				},{
					name:"解绑设备",
					icon:"unbind-equipment"
				}],
				currentPickPopup:{},
				settingPopupFlag:false
			}
		},
		onLoad() {
			
		},
		methods:{
			pickSettingBoxFn(item){
				console.log(item,"item");
				this.currentPickPopup = item;
				switch (this.currentPickPopup.name){
					case "上报间隔":
						this.settingPopupObj.reportPopupFlag = true;
						break;
					case "指令记录":
						uni.navigateTo({
							url:"./instructRecord"
						})
						break;
					case "解绑设备":
						console.log("dd");
						break;
					default:
						this.settingPopupFlag = true;
						break;
				}
			},
			settingConfirmFn(){
				switch (this.currentPickPopup.name){
					case "布防":
						console.log("布防");
						break;
					case "撤防":
						console.log("撤防");
						break;
					default:
						break;
				}
			},
			// 上报间隔取消
			reportCancelFn(){
				this.settingPopupObj.reportPopupFlag = false;
			},
			// 上报间隔确定
			reportConfirmFn(){
				this.settingPopupObj.reportPopupFlag = false;
			}
			// // 布防指令确定
			// protectionConfirmFn(){
				
			// },
			// // 撤防指令确定
			// removalConfirmFn(){
				
			// }
		}
	}
</script>


