tv_show_v1/templates/door/index.html

{% extends "base.html" %}

{% block title %}办公楼大门控制{% endblock %}

{% block content %}
    <div class="module-header">
        <h2>🚪 办公楼大门控制</h2>
    </div>
    
    <div class="sub-section">
        <div style="background: #f8f9fa; padding: 20px; border-radius: 10px; border: 1px solid #eee; margin-bottom: 20px;">
            <h4 style="margin-bottom: 15px; color: #2ecc71;">🔓 远程开门</h4>
            <div class="control-row">
                <div class="control-group" style="flex: 2;">
                   <p style="color: #666; margin-bottom: 0; display: flex; align-items: center; height: 100%;">控制办公楼大门 (ID: 1)</p>
                </div>
                <div class="control-group" style="flex: 0 0 auto;">
                    <button class="btn btn-primary" onclick="remoteOpenDoor()">远程开门</button>
                </div>
            </div>
        </div>

        <div style="background: #f8f9fa; padding: 20px; border-radius: 10px; border: 1px solid #eee;">
            <h4 style="margin-bottom: 15px; color: #e74c3c;">⚙️ 模式设置</h4>
            <div class="control-row">
                <div class="control-group">
                    <label for="doorControlWay">控制模式</label>
                    <select id="doorControlWay">
                        <option value="0">在线 (普通模式)</option>
                        <option value="1">常开 (保持开启)</option>
                        <option value="2">常闭 (保持关闭)</option>
                    </select>
                </div>
                <div class="control-group" style="flex: 0 0 auto;">
                    <button class="btn btn-warning" onclick="setDoorMode()">应用设置</button>
                </div>
            </div>
        </div>
    </div>
{% endblock %}

{% block scripts %}
<script>
    async function remoteOpenDoor() {
        const doorId = 1; 
        const payload = { door_id: doorId };

        try {
            showLoading(true);
            const response = await fetch('/api/door/open', {
                method: 'POST',
                headers: { 'Content-Type': 'application/json' },
                body: JSON.stringify(payload)
            });
            const result = await response.json();
            if (result.success) {
                showMessage(result.message);
            } else {
                showMessage(result.message, 'error');
            }
        } catch (error) {
            showMessage('网络错误: ' + error.message, 'error');
        } finally {
            showLoading(false);
        }
    }

    async function setDoorMode() {
        const controlWay = parseInt(document.getElementById('doorControlWay').value);
        const payload = { control_way: controlWay };
        const modeName = controlWay === 0 ? '在线' : (controlWay === 1 ? '常开' : '常闭');
        if (!confirm(`确定要将门禁设置为"${modeName}"模式吗？`)) return;

        try {
            showLoading(true);
            const response = await fetch('/api/door/control', {
                method: 'POST',
                headers: { 'Content-Type': 'application/json' },
                body: JSON.stringify(payload)
            });
            const result = await response.json();
            if (result.success) {
                showMessage(result.message);
            } else {
                showMessage(result.message, 'error');
            }
        } catch (error) {
            showMessage('网络错误: ' + error.message, 'error');
        } finally {
            showLoading(false);
        }
    }
</script>
{% endblock %}