Files
mi-home-web/settings.html

192 lines
7.6 KiB
HTML

<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>设置 - 米家智能家居</title>
<link rel="stylesheet" href="styles/main.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/css/all.min.css">
</head>
<body>
<div class="container" id="settings-page">
<!-- 头部导航 -->
<div class="settings-header">
<div class="header-left">
<i class="fas fa-arrow-left" onclick="history.back()"></i>
<h1>设置</h1>
</div>
</div>
<!-- 设置内容 -->
<div class="settings-content">
<!-- 更新设置 -->
<div class="settings-section">
<div class="section-title">更新</div>
<div class="settings-item">
<div class="item-content">
<span class="item-title">检查更新</span>
</div>
<i class="fas fa-chevron-right"></i>
</div>
</div>
<!-- 首页设置 -->
<div class="settings-section">
<div class="section-title">首页</div>
<div class="settings-item">
<div class="item-content">
<span class="item-title">快捷开关音效</span>
</div>
<div class="toggle-switch active">
<div class="toggle-slider"></div>
</div>
</div>
<div class="settings-item">
<div class="item-content">
<span class="item-title">快捷卡片</span>
<span class="item-subtitle"></span>
</div>
<i class="fas fa-chevron-right"></i>
</div>
<div class="settings-item">
<div class="item-content">
<span class="item-title">家庭房间管理</span>
</div>
<i class="fas fa-chevron-right"></i>
</div>
</div>
<!-- 设备设置 -->
<div class="settings-section">
<div class="section-title">设备</div>
<div class="settings-item">
<div class="item-content">
<span class="item-title">紧急事件电话通知</span>
</div>
<i class="fas fa-chevron-right"></i>
</div>
<div class="settings-item">
<div class="item-content">
<span class="item-title">自动发现设备</span>
</div>
<i class="fas fa-chevron-right"></i>
</div>
<div class="settings-item">
<div class="item-content">
<span class="item-title">人脸识别管理</span>
</div>
<i class="fas fa-chevron-right"></i>
</div>
<div class="settings-item">
<div class="item-content">
<span class="item-title">云存储管理</span>
</div>
<i class="fas fa-chevron-right"></i>
</div>
</div>
<!-- 安全设置 -->
<div class="settings-section">
<div class="section-title">安全设置</div>
<div class="settings-item">
<div class="item-content">
<span class="item-title">消息设置</span>
</div>
<i class="fas fa-chevron-right"></i>
</div>
<div class="settings-item">
<div class="item-content">
<span class="item-title">单位设置</span>
</div>
<i class="fas fa-chevron-right"></i>
</div>
<div class="settings-item">
<div class="item-content">
<span class="item-title">人脸识别管理</span>
</div>
<i class="fas fa-chevron-right"></i>
</div>
<div class="settings-item">
<div class="item-content">
<span class="item-title">云存储管理</span>
</div>
<i class="fas fa-chevron-right"></i>
</div>
<div class="settings-item">
<div class="item-content">
<span class="item-title">安全设置</span>
</div>
<i class="fas fa-chevron-right"></i>
</div>
<div class="settings-item">
<div class="item-content">
<span class="item-title">消息设置</span>
</div>
<i class="fas fa-chevron-right"></i>
</div>
<div class="settings-item">
<div class="item-content">
<span class="item-title">单位设置</span>
</div>
<i class="fas fa-chevron-right"></i>
</div>
</div>
<!-- 商城页面 -->
<div class="settings-section">
<div class="section-title">商城页面</div>
<div class="settings-item">
<div class="item-content">
<span class="item-title">商城页面</span>
<span class="item-subtitle">已开启</span>
</div>
<i class="fas fa-chevron-right"></i>
</div>
</div>
<!-- 隐私与安全 -->
<div class="settings-section">
<div class="section-title">隐私与安全</div>
<div class="settings-item">
<div class="item-content">
<span class="item-title">地区</span>
<span class="item-subtitle">中国大陆</span>
</div>
<i class="fas fa-chevron-right"></i>
</div>
<div class="settings-item">
<div class="item-content">
<span class="item-title">语言</span>
<span class="item-subtitle">简体</span>
</div>
<i class="fas fa-chevron-right"></i>
</div>
</div>
<!-- 帮助 -->
<div class="settings-section">
<div class="section-title">帮助</div>
<div class="settings-item">
<div class="item-content">
<span class="item-title">系统权限管理</span>
</div>
<i class="fas fa-chevron-right"></i>
</div>
</div>
</div>
</div>
<script>
// 切换开关功能
document.addEventListener('DOMContentLoaded', function() {
const toggleSwitches = document.querySelectorAll('.toggle-switch');
toggleSwitches.forEach(toggle => {
toggle.addEventListener('click', function() {
this.classList.toggle('active');
});
});
});
</script>
</body>
</html>