<template>
	<view class="relay-control">
		<!-- 设备状态 -->
		<!-- <button type="default" @click="consolebutton()">ceshi </button> -->

		<view class="card">
			<view class="status-titletop">{{title}}</view>
			<view style="padding:20rpx;">
				<u--form labelPosition="left" labelWidth="100"
					:labelStyle="{ marginRight: '16px', lineHeight: '32px', width: '50px', whiteSpace: 'nowrap', overflow: 'hidden', textOverflow: 'ellipsis',color: '#000000' }">
					<view class="version-wrap">
						<u-form-item :label="$tt('status.deviceVersion')">
							<u-row>
								<u-col span="8">
									<u--text :text="'Version' + device.firmwareVersion"></u--text>
								</u-col>
							</u-row>
						</u-form-item>
					</view>
				</u--form>
			</view>
		</view>




		<!-- 继电器状态显示 -->
		<view class="relay-status">
			<view class="status-title">继电器状态</view>
			<view class="relay-grid">
				<view class="relay-item" v-for="(item, index) in relayList" :key="index"
					:class="{'relay-active': item.status === 1}">
					<!-- 可点击的继电器名称 -->
					<view class="relay-name" @click="checkOnline(editRelayName, index)">
						{{item.remark}}
						<u-icon name="edit-pen" size="16" color="#999"></u-icon>
					</view>

					<view class="relay-state" :class="{'active': item.status  === 1}">
						<view class="status-indicator" :class="{'active': item.status === 1}"></view>
						当前状态：{{item.status === 1 ? '吸合' : '断开'}}
					</view>

					<u-button :type="item.status === 1 ? 'error' : 'primary'" size="normal"
						@click="checkOnline(toggleRelay, index)" :disabled="device.status  !== 3"
						:class="{'btn-active': item.status === 1}">
						{{item.status === 1 ? '断开' : '吸合'}}
					</u-button>
				</view>
			</view>
		</view>

		<!-- 时间方案配置 -->
		<!-- 		<view class="time-schedule">
			<view class="schedule-title">时间方案配置</view>
			<view class="schedule-list">
				<view class="schedule-item" v-for="(item, index) in scheduleList" :key="index">
					<view class="schedule-info">
						<text>时间：{{item.time}}</text>
						<text>动作：{{item.action === 1 ? '开启' : '关闭'}}</text>
						<text>继电器：{{item.relayIndexes.map(index => index + 1).join(', ')}}</text>
						<text>重复日期：{{item.weekdays.map(index => weekdays[index]).join(', ')}}</text>
					</view>
					<u-button type="error" size="mini" @click="deleteSchedule(index)">删除</u-button>
				</view>
			</view>
			<view class="add-schedule">
				<u-button type="primary" @click="showAddSchedule">添加时间方案</u-button>
			</view>
		</view> -->

		<!-- 时间方案配置 -->
		<view class="time-schedule">
			<view class="schedule-header">
				<view class="schedule-title">定时任务</view>
				<view style="display: flex; justify-content: flex-end;">
					<u-button style="width: 180rpx; height: 40rpx;" type="primary" size="mini"
						@click="checkOnline(showAddSchedule)" :disabled="device.status  !== 3">
						添加
					</u-button>
				</view>
			</view>
			<view class="empty-tip" v-if="scheduleList.length  === 0">
				<u-icon name="list" size="50" color="#c0c4cc"></u-icon>
				<text>暂无时间方案，点击添加按钮创建</text>
			</view>
			<view class="schedule-list">
				<view class="schedule-card" v-for="(item, index) in scheduleList" :key="index">
					<view class="schedule-time">
						<u-icon name="clock" size="18" color="#3c9cff"></u-icon>
						<text>{{item.time}}</text>
					</view>

					<view class="schedule-content">
						<!-- 			<view class="schedule-row">
							<text class="label">动作：</text>
							<u-tag :text="item.action  === 1 ? '开启' : '关闭'"
								:type="item.action  === 1 ? 'success' : 'error'" size="mini"></u-tag>
						</view> -->

						<view class="schedule-row">
							<text class="label">继电器：</text>
							<view class="relay-tags">
								<u-tag v-for="relayIndex in item.relayIndexes" :key="relayIndex"
									:text="relayList[relayIndex] && relayList[relayIndex].remark ? relayList[relayIndex].remark : '继电器' + (relayIndex + 1)"
									type="primary" size="mini" />
							</view>
						</view>

						<view class="schedule-row">
							<text class="label">重复日期：</text>
							<view class="weekday-tags">
								<u-tag v-for="dayIndex in item.weekdays" :key="dayIndex" :text="weekdays[dayIndex]"
									plain size="mini"></u-tag>
							</view>
						</view>
					</view>

					<view class="schedule-actions">
						<u-button type="primary" size="mini" plain @click="checkOnline(editSchedule, index)"
							:disabled="device.status  !== 3">
							编辑
						</u-button>
						<u-button type="error" size="mini" plain @click="checkOnline(deleteSchedule, index)"
							:disabled="device.status  !== 3">
							删除
						</u-button>
					</view>
				</view>
			</view>
		</view>


		<!-- 添加/编辑时间方案弹窗 -->
		<u-popup :show="showPopup" mode="center" @close="closeSchedulePopup">
			<view class="popup-content">
				<view class="popup-title">{{isEditing ? '编辑时间方案' : '添加时间方案'}}</view>
				<u--form :model="scheduleForm" ref="uForm">
					<u-form-item label="时间">
						<u-input v-model="scheduleForm.time" placeholder="请选择时间" @focus="openTimePicker" />
					</u-form-item>

					<!-- 	<u-form-item label="动作">
						<u-radio-group v-model="scheduleForm.action">
							<u-radio :name="1" label="开启"></u-radio>
							<u-radio :name="0" label="关闭"></u-radio>
						</u-radio-group>
					</u-form-item> -->

					<u-form-item label="选择继电器">
						<view class="checkbox-group">
							<view v-for="(item, index) in relayList" :key="index" class="checkbox-item"
								:class="{ 'selected': scheduleForm.relayIndexes.includes(index) }"
								@click="toggleRelayCheckbox(index)">
								<view class="checkbox-wrapper">
									<view class="checkbox"
										:class="{ 'checked': scheduleForm.relayIndexes.includes(index) }">
										<view v-if="scheduleForm.relayIndexes.includes(index)"
											class="checkbox-checkmark">✓</view>
									</view>
									<view class="relay-info">
										<text class="checkbox-label">{{ item.remark || item.name }}</text>
										<text class="relay-status-text"
											:class="{ 'active': scheduleForm.relayIndexes.includes(index) }">
											{{ scheduleForm.relayIndexes.includes(index) ? '吸合' : '断开' }}
										</text>
									</view>
								</view>
							</view>
						</view>
					</u-form-item>

					<u-form-item label="重复日期">
						<view class="checkbox-group repeat-weekdays-group">
							<view v-for="(day, index) in weekdays" :key="index" class="checkbox-item"
								@click="toggleWeekdayCheckbox(index)">
								<view class="checkbox-wrapper">
									<view class="checkbox"
										:class="{ 'checked': scheduleForm.weekdays.includes(index) }">
										<view v-if="scheduleForm.weekdays.includes(index)" class="checkbox-checkmark">✓
										</view>
									</view>
									<text class="checkbox-label">{{ day }}</text>
								</view>
							</view>
						</view>
					</u-form-item>
				</u--form>

				<view class="popup-buttons">
					<u-button @click="closeSchedulePopup">取消</u-button>
					<u-button type="primary"
						@click="isEditing ? updateSchedule() : addSchedule()">{{isEditing ? '更新' : '确定'}}</u-button>
				</view>
			</view>
		</u-popup>

		<!-- 时间选择器 -->
		<u-datetime-picker :show="showTimePicker" v-model="tempTime" mode="time" @confirm="timeConfirm"
			@cancel="showTimePicker = false" />


		<!-- 继电器名称编辑弹窗 -->
		<u-popup :show="showRelayEditPopup" mode="center" @close="showRelayEditPopup = false">
			<view class="popup-content">
				<view class="popup-title">修改继电器名称</view>
				<u--form :model="relayEditForm" ref="uForm">
					<!-- 				<u-form-item label="名称">
						<u-input v-model="relayEditForm.name" placeholder="请输入继电器名称" />
					</u-form-item> -->

					<u-form-item label="备注">
						<u-input v-model="relayEditForm.remark" placeholder="请输入备注信息" />
					</u-form-item>
				</u--form>

				<view class="popup-buttons">
					<u-button @click="showRelayEditPopup = false">取消</u-button>
					<u-button type="primary" @click="confirmRelayEdit">确定</u-button>
				</view>
			</view>
		</u-popup>
	</view>
</template>

<script>
	import {
		getLatestFirmware,
		relateChannelList,
		getOrderControl
	} from '@/apis/modules/device.js';
	import {
		serviceInvoke
	} from '@/apis/modules/runtime.js';
	import {
		getSipStatusInfo,
		getLocationWayInfo
	} from '@/helpers/common.js'

	export default {
		name: 'relay-control',
		props: {
			device: {
				type: Object,
				default: null,
				required: true
			}
		},
		created() {
			console.log("jinlaile ")
			// 1秒后执行提取继电器列表 
			setTimeout(() => {
				this.extractRelayList();
				this.parseScheduleConfig(); // 解析时间方案 、
				// this.consolebutton()
			}, 1000);
			this.updateDeviceStatus(this.device);

			this.mqttCallback();

		},
		onLoad: function(option) {
			console.log(JSON.stringify(this.device))

		},
		data() {
			return {
				title: '设备离线',
				show: false,
				firmware: {},
				showTimePicker: false,
				showPopup: false,
				tempTime: '',
				weekdays: ['周日', '周一', '周二', '周三', '周四', '周五', '周六'],
				bgStyle: '',
				shadowUnEnable: false,
				scheduleList: [], // 初始化为空数组，等待解析数据 
				showRelayEditPopup: false,
				relayEditForm: {
					index: null,
					name: '',
					remark: ''
				},
				relayList: [], // 初始化为空数组，等待提取数据 

				scheduleList: [],
				scheduleForm: {
					time: '12:00:00',
					action: 1,
					relayIndexes: [],
					weekdays: []
				},
				isEditing: false, // 是否处于编辑模式
				editingIndex: -1 // 当前编辑的时间方案索引
			}
		},

		methods: {
			// 检查设备是否在线 
			checkOnline(callback, ...args) {
				if (this.device.status !== 3) {
					uni.showToast({
						title: '设备离线，无法操作',
						icon: 'none'
					});
					return false;
				}
				if (typeof callback === 'function') {
					return callback.apply(this, args);
				}
				return true;
			},
			// 编辑继电器名称 
			editRelayName(index) {
				if (!this.checkOnline()) return;

				this.relayEditForm = {
					index,
					name: this.relayList[index].name,
					remark: this.relayList[index].remark || ''
				};
				this.showRelayEditPopup = true;
			},

			// 确认修改继电器信息 
			async confirmRelayEdit() {
				try {
					const {
						index,
						name,
						remark
					} = this.relayEditForm;

					// 1. 更新本地数据 
					this.relayList[index].name = name;
					this.relayList[index].remark = remark;

					// 2. 找到对应的备注物模型 
					const channel = index + 1; // 继电器通道号(1-4)
					const remarkModel = this.device.thingsModels.find(
						item => item.id === `remark_ch${channel}`
					);

					if (remarkModel) {
						// 3. 更新物模型值 
						remarkModel.shadow = remark;

						// 4. 通过MQTT发布更新 
						await this.mqttPublish(this.device, remarkModel);
					}

					this.showRelayEditPopup = false;
					uni.showToast({
						title: '修改成功',
						icon: 'success'
					});
				} catch (error) {
					console.error(' 修改继电器信息失败:', error);
					uni.showToast({
						title: '修改失败: ' + error.message,
						icon: 'none'
					});
				}
			},

			// 解析时间方案配置 
			parseScheduleConfig() {
				try {
					// 从 thingsModelValue 中找到 cfg_param 
					const thingsModelValue = JSON.parse(this.device.thingsModelValue);
					const cfgParam = thingsModelValue.find(item => item.id === 'cfg_param');

					if (cfgParam && cfgParam.value) {
						// 提取 JSON 部分（去掉前面的 "JSON="）
						const jsonStr = cfgParam.value.startsWith('JSON=') ?
							cfgParam.value.substring(5) :
							cfgParam.value;

						// 解析 JSON 
						const config = JSON.parse(jsonStr);

						// 转换格式为 scheduleList 需要的格式 
						this.scheduleList = config.shedule.map(item => {
							// 将 time_s（秒数）转换为 HH:mm:ss 格式 
							const hours = Math.floor(item.time_s / 3600);
							const minutes = Math.floor((item.time_s % 3600) / 60);
							const seconds = item.time_s % 60;
							const time =
								`${hours.toString().padStart(2,  '0')}:${minutes.toString().padStart(2,  '0')}:${seconds.toString().padStart(2,  '0')}`;

							// 将 week 字符串转换为 weekdays 数组 
							const weekdays = item.week.split('').map((day, index) => day === '1' ? index : null)
								.filter(index => index !== null);

							// 获取选中的继电器索引 
							const relayIndexes = [];
							if (item.sw1_s === 1) relayIndexes.push(0);
							if (item.sw2_s === 1) relayIndexes.push(1);
							if (item.sw3_s === 1) relayIndexes.push(2);
							if (item.sw4_s === 1) relayIndexes.push(3);

							return {
								time,
								action: relayIndexes.length > 0 ? 1 : 0, // 如果有选中的继电器则为开启 
								relayIndexes,
								weekdays,
								originalData: item // 保留原始数据 
							};
						});

						console.log(' 解析出的时间方案:', this.scheduleList);
					}
				} catch (error) {
					console.error(' 解析时间方案配置出错:', error);
				}
			},

			// 提取继电器列表 
			extractRelayList() {
				console.log("device.thingsModels", JSON.stringify(this.device.thingsModels))
				// 从 device.thingsModels  中筛选出所有开关状态属性，并按sw_chX编号升序排序
				const relayItems = this.device.thingsModels
					.filter(item => item.id.startsWith('sw_ch') && item.datatype.type === 'bool')
					.sort((a, b) => {
						const aNum = parseInt(a.id.replace('sw_ch', ''));
						const bNum = parseInt(b.id.replace('sw_ch', ''));
						return aNum - bNum;
					});

				// 转换为继电器列表格式 
				this.relayList = relayItems.map((item, index) => ({
					name: `继电器${index + 1}`,
					status: item.shadow !== undefined && item.shadow !== null && item.shadow !== ''
						? parseInt(item.shadow)
						: (item.value !== undefined && item.value !== null && item.value !== '' ? parseInt(item.value) : 0),
					remark: this.getRelayRemark(index + 1),
					model: JSON.parse(JSON.stringify(item))
				}));

				console.log(' 继电器列表:', JSON.stringify(this.relayList));
			},


			// 获取继电器备注（从 remark_chX 属性）
			getRelayRemark(channel) {
				const remarkItem = this.device.thingsModels.find(item =>
					item.id === `remark_ch${channel}`
				);
				return remarkItem ? remarkItem.shadow : '';
			},
			// mqtt回调
			/* Mqtt回调处理 */
			mqttCallback() {
				console.log("mqttCallback")
				this.$mqttTool.client.on('message', (topic, message, buffer) => {
					let topics = topic.split('/');
					let productId = topics[1];
					let deviceNum = topics[2];
					message = JSON.parse(message.toString());

					// 判断是否是当前设备的消息 
					if (this.device.serialNumber !== deviceNum) return;

					// 处理状态更新 
					if (topics[3] == 'status') {
						console.log(' 接收到【设备状态-运行】主题：', topic);
						console.log(' 接收到【设备状态-运行】内容：', JSON.stringify(message));
						this.device.status = message.status;
						this.device.isShadow = message.isShadow;
						this.device.rssi = message.rssi;
						this.updateDeviceStatus(this.device);
					}
					// 处理物模型属性更新 
					else if (topics[3] == 'property' || topics[3] == 'function' || topic.endsWith('ws/service')) {
						console.log(' 接收到【物模型】主题：', topic);
						console.log(' 接收到【物模型】内容：', JSON.stringify(message));
						console.log("message.message")
						// 更新继电器状态 
						if (Array.isArray(message.message)) {
							message.message.forEach(item => {
								// 检查是否是继电器状态更新 
								if (item.id && item.id.startsWith('sw_ch')) {
									const channel = parseInt(item.id.replace('sw_ch', ''));
									if (!isNaN(channel) && channel >= 1 && channel <= 4) {
										const index = channel - 1;
										this.relayList[index].status = parseInt(item.value) || 0;
									}
								}
								// 检查是否是继电器备注更新 
								else if (item.id && item.id.startsWith('remark_ch')) {
									const channel = parseInt(item.id.replace('remark_ch', ''));
									if (!isNaN(channel) && channel >= 1 && channel <= 4) {
										const index = channel - 1;
										this.relayList[index].remark = item.value || '';
									}
								}
							});
						}
					}
				});
			},
			//发送指令
			async mqttPublish(device, model) {

				const command = {};
				command[model.id] = model.shadow;
				const params = {
					deviceId: device.deviceId,
					modelId: model.modelId
				}
				//判断是否有权限
				const response = await getOrderControl(params);
				if (response.code != 200) {
					uni.$u.toast(response.msg);
					return;
				}
				const data = {
					serialNumber: device.serialNumber,
					productId: device.productId,
					remoteCommand: command,
					identifier: model.id,
					modelName: model.name,
					isShadow: device.status != 3,
					type: model.type,
				}
				serviceInvoke(data).then(response => {
					if (response.code === 200) {
						uni.showToast({
							icon: 'none',
							title: this.$tt('status.service')
						});
					}
				})
			},
			/** 更新设备状态 */
			updateDeviceStatus(device) {
				if (device.status === 3) {
					this.title = this.$tt('status.online');
					this.bgStyle =
						'background-color:#5ac725;border-top-left-radius:6px;border-top-right-radius:6px;';
					this.shadowUnEnable = false;
				} else {
					if (device.isShadow === 1) {
						this.bgStyle =
							'background-color:#3c9cff;border-top-left-radius:6px;border-top-right-radius:6px;';
						this.title = this.$tt('status.shadow');
						this.shadowUnEnable = false;
					} else {
						this.bgStyle =
							'background-color:#909399;border-top-left-radius:6px;border-top-right-radius:6px;';
						this.title = this.$tt('status.deviceOffline');
						this.shadowUnEnable = true;
					}
				}
			},
			consolebutton() {
				console.log("按钮打印", JSON.stringify(this.device))
			},
			// 切换继电器状态 
			async toggleRelay(index) {
				if (!this.checkOnline()) return;

				try {
					// 1. 更新本地状态 
					const newStatus = this.relayList[index].status === 1 ? 0 : 1;
					this.relayList[index].status = newStatus;

					// 2. 找到对应的物模型 
					const channel = index + 1; // 继电器通道号(1-4)
					const switchModel = this.device.thingsModels.find(
						item => item.id === `sw_ch${channel}`
					);

					if (switchModel) {
						// 3. 更新物模型值 
						switchModel.shadow = newStatus.toString();

						// 4. 通过MQTT发布更新 
						await this.mqttPublish(this.device, switchModel);
					}
				} catch (error) {
					console.error(' 切换继电器状态失败:', error);
					// 回滚状态 
					this.relayList[index].status = this.relayList[index].status === 1 ? 0 : 1;
					uni.showToast({
						title: '操作失败: ' + error.message,
						icon: 'none'
					});
				}
			},
			showAddSchedule() {
				if (!this.checkOnline()) return;

				// 重置编辑状态
				this.isEditing = false;
				this.editingIndex = -1;

				const now = new Date();
				const hours = now.getHours().toString().padStart(2, '0');
				const minutes = now.getMinutes().toString().padStart(2, '0');
				const seconds = now.getSeconds().toString().padStart(2, '0');
				this.scheduleForm = {
					time: `${hours}:${minutes}:${seconds}`,
					action: 1,
					relayIndexes: [],
					weekdays: []
				};
				this.showPopup = true;
			},
			openTimePicker() {
				this.showTimePicker = true;
				// 以当前表单时间为准，若无则默认12:00:00
				this.tempTime = this.scheduleForm.time || '12:00:00';
			},
			timeConfirm(e) {
				let timeStr = '';
				let value = e.value !== undefined ? e.value : this.tempTime;
				// 如果是时间戳
				if (typeof value === 'number') {
					const date = new Date(value);
					const hours = date.getHours().toString().padStart(2, '0');
					const minutes = date.getMinutes().toString().padStart(2, '0');
					const seconds = date.getSeconds().toString().padStart(2, '0');
					timeStr = `${hours}:${minutes}:${seconds}`;
				} else if (typeof value === 'string') {
					// 兼容直接选择字符串
					timeStr = value;
				}
				this.scheduleForm.time = timeStr;
				this.showTimePicker = false;
			},
			async addSchedule() {
				try {
					// 1. 添加时间方案到本地列表 
					const newSchedule = {
						...this.scheduleForm
					};
					console.log('【addSchedule】newSchedule:', newSchedule); // 打印表单内容
					this.scheduleList.push(newSchedule);
					this.showPopup = false;

					// 2. 转换为设备需要的格式 
					const deviceSchedule = this.convertToDeviceSchedule(newSchedule);
					console.log('【addSchedule】deviceSchedule:', deviceSchedule); // 打印转换后内容

					// 3. 准备要发送的数据 
					const scheduleConfig = {
						shedule: [...this.scheduleList.map(s => s.originalData || this.convertToDeviceSchedule(s))]
					};
					console.log('【addSchedule】scheduleConfig:', scheduleConfig); // 打印最终发送内容

					// 4. 找到 cfg_param 模型 
					const cfgParamModel = this.device.thingsModels.find(item => item.id === 'cfg_param');
					if (!cfgParamModel) {
						throw new Error('找不到定时配置模型');
					}

					// 5. 更新模型值 
					cfgParamModel.shadow = `JSON=${JSON.stringify(scheduleConfig)}`;

					// 6. 通过 MQTT 发布 
					await this.mqttPublish(this.device, cfgParamModel);

					uni.showToast({
						title: '时间方案添加成功',
						icon: 'success'
					});
				} catch (error) {
					console.error(' 添加时间方案失败:', error);
					uni.showToast({
						title: '添加失败: ' + error.message,
						icon: 'none'
					});
				}
			},

			// 将前端格式转换为设备格式 
			convertToDeviceSchedule(schedule) {
				console.log('【convertToDeviceSchedule】入参 schedule:', schedule);
				// 保证 time 字符串为 HH:mm:ss 格式
				let timeStr = schedule.time;
				if (timeStr.length === 5) { // 只有HH:mm
					timeStr += ':00';
				}
				const [hours, minutes, seconds] = timeStr.split(':').map(Number);
				console.log('【convertToDeviceSchedule】split结果:', hours, minutes, seconds);
				const time_s = hours * 3600 + minutes * 60 + seconds;
				console.log('【convertToDeviceSchedule】time_s:', time_s);

				// 将星期数组转换为字符串 
				const weekArr = new Array(7).fill('0');
				schedule.weekdays.forEach(day => weekArr[day] = '1');
				const week = weekArr.join('');

				// 设置继电器状态 
				const relayStatus = [0, 0, 0, 0]; // 默认全部关闭 
				schedule.relayIndexes.forEach(index => relayStatus[index] = 1);

				return {
					time_s,
					week,
					sw1_s: relayStatus[0],
					sw2_s: relayStatus[1],
					sw3_s: relayStatus[2],
					sw4_s: relayStatus[3]
				};
			},

			async deleteSchedule(index) {
				if (!this.checkOnline()) return;

				try {
					// 1. 从列表中删除 
					this.scheduleList.splice(index, 1);

					// 2. 准备要发送的数据 
					const scheduleConfig = {
						shedule: this.scheduleList.map(s => s.originalData || this.convertToDeviceSchedule(s))
					};

					// 3. 找到 cfg_param 模型 
					const cfgParamModel = this.device.thingsModels.find(item => item.id === 'cfg_param');
					if (!cfgParamModel) {
						throw new Error('找不到定时配置模型');
					}

					// 4. 更新模型值 
					cfgParamModel.shadow = `JSON=${JSON.stringify(scheduleConfig)}`;

					// 5. 通过 MQTT 发布 
					await this.mqttPublish(this.device, cfgParamModel);

					uni.showToast({
						title: '删除成功',
						icon: 'success'
					});
				} catch (error) {
					console.error(' 删除时间方案失败:', error);
					uni.showToast({
						title: '删除失败: ' + error.message,
						icon: 'none'
					});
				}
			},

			// 编辑时间方案
			editSchedule(index) {
				if (!this.checkOnline()) return;

				// 设置编辑模式
				this.isEditing = true;
				this.editingIndex = index;

				// 获取要编辑的时间方案
				const schedule = this.scheduleList[index];

				// 填充表单数据
				this.scheduleForm = {
					time: schedule.time,
					action: schedule.action,
					relayIndexes: [...schedule.relayIndexes], // 深拷贝数组
					weekdays: [...schedule.weekdays] // 深拷贝数组
				};
				console.log(JSON.stringify(this.scheduleForm))
				// 显示弹窗
				this.showPopup = true;
			},

			// 更新时间方案
			async updateSchedule() {
				try {
					// 1. 更新本地数据
					const updatedSchedule = {
						...this.scheduleForm
					};
					// 不再保留 originalData，确保下发最新内容
					this.scheduleList[this.editingIndex] = updatedSchedule;
					this.showPopup = false;

					// 2. 转换为设备需要的格式
					const deviceSchedule = this.convertToDeviceSchedule(updatedSchedule);
					console.log('【updateSchedule】deviceSchedule:', deviceSchedule);

					// 3. 准备要发送的数据
					const scheduleConfig = {
						shedule: this.scheduleList.map(s => this.convertToDeviceSchedule(s))
					};
					console.log('【updateSchedule】scheduleConfig:', JSON.stringify(scheduleConfig));

					// 4. 找到 cfg_param 模型
					const cfgParamModel = this.device.thingsModels.find(item => item.id === 'cfg_param');
					if (!cfgParamModel) {
						throw new Error('找不到定时配置模型');
					}

					// 5. 更新模型值
					cfgParamModel.shadow = `JSON=${JSON.stringify(scheduleConfig)}`;

					// 6. 通过 MQTT 发布
					await this.mqttPublish(this.device, cfgParamModel);

					// 7. 重置编辑状态
					this.isEditing = false;
					this.editingIndex = -1;

					uni.showToast({
						title: '时间方案更新成功',
						icon: 'success'
					});
				} catch (error) {
					console.error('更新时间方案失败:', error);
					uni.showToast({
						title: '更新失败: ' + error.message,
						icon: 'none'
					});
				}
			},

			// 切换继电器checkbox
			toggleRelayCheckbox(index) {
				const currentIndex = this.scheduleForm.relayIndexes.indexOf(index);
				if (currentIndex > -1) {
					// 如果已选中，则移除
					this.scheduleForm.relayIndexes.splice(currentIndex, 1);
				} else {
					// 如果未选中，则添加
					this.scheduleForm.relayIndexes.push(index);
				}
			},

			// 切换星期checkbox
			toggleWeekdayCheckbox(index) {
				const currentIndex = this.scheduleForm.weekdays.indexOf(index);
				if (currentIndex > -1) {
					// 如果已选中，则移除
					this.scheduleForm.weekdays.splice(currentIndex, 1);
				} else {
					// 如果未选中，则添加
					this.scheduleForm.weekdays.push(index);
				}
			},

			// 关闭时间方案弹窗
			closeSchedulePopup() {
				this.showPopup = false;
				this.resetScheduleForm();
			},

			// 重置表单（在关闭弹窗时调用）
			resetScheduleForm() {
				this.scheduleForm = {
					time: '12:00:00',
					action: 1,
					relayIndexes: [],
					weekdays: []
				};
				this.isEditing = false;
				this.editingIndex = -1;
			},
		}
	}
</script>

<style lang="scss">
	/* 添加禁用状态的样式 */
	.u-button[disabled] {
		opacity: 0.6;
		cursor: not-allowed;
	}

	.relay-name[disabled] {
		opacity: 0.6;
		cursor: not-allowed;
	}

	/* 继电器名称样式 */
	.relay-name {
		color: #333;
		font-weight: 500;
		margin-bottom: 10rpx;
		display: flex;
		align-items: center;
		justify-content: center;
		gap: 8rpx;
		padding: 8rpx;
		border-radius: 8rpx;
	}

	.relay-name:active {
		background-color: #f0f0f0;
	}

	/* 编辑图标样式 */
	.u-icon-edit-pen {
		opacity: 0.6;
		transition: opacity 0.3s;
	}

	.relay-name:hover .u-icon-edit-pen {
		opacity: 1;
	}

	.empty-tip {
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		padding: 40rpx 0;
		color: #c0c4cc;
		font-size: 28rpx;
		gap: 20rpx;
	}

	.card {
		box-shadow: 0 1px 0px 0 rgba(0, 0, 0, 0.1);
		border-radius: 20rpx;
		background-color: #fff;

		&:not(:last-child) {
			margin-bottom: 20rpx;
		}

		.status-title {
			font-weight: bold;
			font-size: 15px;
			color: #333333;
			line-height: 42rpx;
			text-align: left;
			font-style: normal;
			text-transform: none;
			padding: 15rpx 28rpx;
		}

		.version-wrap {
			background-color: #F7F7F7;
			border-radius: 10rpx;
			padding: 0 42rpx;
			font-family: PingFang SC, PingFang SC;
			font-weight: 400;
			font-size: 24rpx;
			color: #000000;
			line-height: 42rpx;
			text-align: left;
			font-style: normal;
		}
	}

	.relay-control {
		padding: 20rpx;

		.relay-status,
		.time-schedule {
			background-color: #fff;
			border-radius: 12rpx;
			padding: 20rpx;
			margin-bottom: 20rpx;
		}

		.schedule-header {
			display: flex;
			justify-content: space-between;
			align-items: center;
			margin-bottom: 20rpx;
		}

		.schedule-title {
			font-size: 32rpx;
			font-weight: bold;
			color: #333;
		}

		.schedule-list {
			display: flex;
			flex-direction: column;
			gap: 20rpx;
		}

		.schedule-card {
			background-color: #f9f9f9;
			border-radius: 12rpx;
			padding: 20rpx;
			display: flex;
			flex-direction: column;
			gap: 15rpx;
			position: relative;
			box-shadow: 0 2rpx 10rpx rgba(0, 0, 0, 0.05);
		}

		.schedule-time {
			display: flex;
			align-items: center;
			gap: 10rpx;
			font-size: 28rpx;
			font-weight: bold;
			color: #333;
		}

		.schedule-content {
			display: flex;
			flex-direction: column;
			gap: 12rpx;
			padding-left: 28rpx;
		}

		.schedule-row {
			display: flex;
			align-items: center;
			font-size: 26rpx;
		}

		.label {
			color: #666;
			min-width: 120rpx;
		}

		.relay-tags,
		.weekday-tags {
			display: flex;
			flex-wrap: wrap;
			gap: 8rpx;
		}

		.schedule-actions {
			display: flex;
			justify-content: flex-end;
			margin-top: 10rpx;
			gap: 10rpx;
		}

		.status-title,
		.schedule-title {
			font-size: 32rpx;
			font-weight: bold;
			margin-bottom: 20rpx;
		}

		.status-titletop {
			font-weight: bold;
			font-size: 15px;
			color: #333333;
			line-height: 42rpx;
			text-align: left;
			font-style: normal;
			text-transform: none;
			padding: 15rpx 28rpx;
		}

		.relay-grid {
			display: grid;
			grid-template-columns: repeat(2, 1fr);
			gap: 20rpx;
		}

		.relay-item {
			background-color: #f5f5f5;
			padding: 20rpx;
			border-radius: 8rpx;
			text-align: center;
			transition: all 0.3s ease;
			border: 2rpx solid transparent;

			&.relay-active {
				background-color: #e6f9ea;
				border-color: #52c41a;
				box-shadow: 0 2rpx 8rpx rgba(82, 196, 26, 0.15);
			}

			.relay-name {
				font-size: 28rpx;
				margin-bottom: 10rpx;
			}

			.relay-state {
				font-size: 24rpx;
				color: #666;
				margin-bottom: 10rpx;
				display: flex;
				align-items: center;
				justify-content: center;
				gap: 8rpx;

				&.active {
					color: #52c41a;
				}

				.status-indicator {
					width: 12rpx;
					height: 12rpx;
					border-radius: 50%;
					background-color: #ccc;
					transition: all 0.3s ease;

					&.active {
						background-color: #52c41a;
						box-shadow: 0 0 8rpx rgba(82, 196, 26, 0.4);
					}
				}
			}

			.btn-active {
				background-color: #52c41a !important;
				border-color: #52c41a !important;
			}
		}

		/* 弹窗专属样式 */
		.popup-content {
			background-color: #fff;
			padding: 30rpx;
			border-radius: 12rpx;
			width: 80vw;
			max-height: 80vh;
			overflow-y: auto;

			.popup-title {
				text-align: center;
				font-size: 32rpx;
				font-weight: bold;
				margin-bottom: 30rpx;
			}

			/* 原生checkbox样式 */
			.checkbox-group {
				display: grid;
				grid-template-columns: repeat(2, 1fr);
				gap: 15rpx;
				padding: 10rpx 0;
			}

			.checkbox-item {
				width: 100%;
				padding: 12rpx 8rpx;
				border-radius: 6rpx;
				background-color: #f8f8f8;
				border: 1px solid #eee;
				box-sizing: border-box;
				transition: all 0.3s ease;
				min-height: 60rpx;
				display: flex;
				align-items: center;
			}

			.checkbox-item:active {
				background-color: #e8f4ff;
				border-color: #3c9cff;
			}

			.checkbox-wrapper {
				display: flex;
				align-items: center;
				gap: 12rpx;
				width: 100%;
			}

			.checkbox {
				width: 36rpx;
				height: 36rpx;
				border: 2rpx solid #ddd;
				border-radius: 6rpx;
				display: flex;
				align-items: center;
				justify-content: center;
				background-color: #fff;
				transition: all 0.3s ease;
				flex-shrink: 0;
			}

			.checkbox.checked {
				background-color: #3c9cff;
				border-color: #3c9cff;
			}

			.checkbox-checkmark {
				color: #fff;
				font-size: 24rpx;
				font-weight: bold;
				line-height: 1;
			}

			.checkbox-label {
				font-size: 26rpx;
				color: #333;
				flex: 1;
				white-space: nowrap;
				overflow: hidden;
				text-overflow: ellipsis;
			}

			.relay-info {
				display: flex;
				flex-direction: column;
				gap: 4rpx;
				flex: 1;
			}

			.relay-status-text {
				font-size: 22rpx;
				color: #999;
				transition: all 0.3s ease;
			}

			.relay-status-text.active {
				color: #52c41a;
				font-weight: bold;
			}

			.checkbox-item.selected {
				background-color: #e6f9ea;
				border-color: #52c41a;
			}

			/* 表单输入框样式 */
			::v-deep .u-input {
				padding: 12rpx 20rpx;
				background-color: #f8f8f8;
				border-radius: 8rpx;
			}

			/* 按钮区域 */
			.popup-buttons {
				display: flex;
				justify-content: space-around;
				margin-top: 30rpx;
				gap: 20rpx;

				.u-button {
					flex: 1;
				}
			}
		}
	}

	/* 响应式调整 */
	@media (min-width: 768px) {
		.schedule-card {
			flex-direction: row;
			align-items: center;
			justify-content: space-between;
		}

		.schedule-content {
			flex: 1;
			flex-direction: row;
			flex-wrap: wrap;
			gap: 15rpx 30rpx;
		}

		.schedule-row {
			margin-bottom: 0;
		}

		.schedule-actions {
			margin-top: 0;
		}
	}

	/* 小屏幕适配 */
	@media (max-width: 375px) {
		.checkbox-group {
			grid-template-columns: 1fr;
			gap: 12rpx;
		}

		.checkbox-item {
			min-height: 56rpx;
			padding: 10rpx 6rpx;
		}

		.checkbox-label {
			font-size: 24rpx;
		}
	}
</style>