<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org" xmlns:sptg="http://www.thymeleaf.org">
    <head>
        <script th:replace="common/head"></script>
        <style>
            .layui-form-item {
                margin-bottom: 0;
            }
            .layui-form-text{
                line-height: 38px;
            }
        </style>
    </head>
    <body>
        <div class="layui-fluid">
            <input type="hidden" lay-verify="required" name="id" th:value="${id}" />
            <div class="layui-row layui-col-space15">
                <div class="layui-col-md12">
                    <div class="layui-tab layui-tab-card">
                        <ul class="layui-tab-title">
                            <li class="layui-this">基本设备信息</li>
                            <li>远程设备信息</li>
                        </ul>
                        <div class="layui-tab-content">
                            <div style="display: flex;justify-content: center;">
                                <button type="button" lay-submit="" lay-filter="obtainInfo" sptg:security="device:info:obtain"
                                        class="layui-btn layui-btn-primary layui-btn-sm">远程设备信息获取
                                </button>
                                <button type="button" lay-submit="" lay-filter="refresh" class="layui-btn layui-btn-primary layui-btn-sm">
                                    <i class="layui-icon layui-icon-refresh"></i>
                                </button>
                            </div>
                            <div class="layui-tab-item layui-show">
                            <div id="device_info"></div>
                            </div>
                            <div class="layui-tab-item">
                                <fieldset class="layui-elem-field">
                                    <legend>远程设备信息</legend>
                                    <div class="layui-field-box">
                                        <div class="layui-form-item">
                                            <label class="layui-form-label"><span>设备序列号：</span></label>
                                            <div class="layui-input-inline"><span class="layui-form-text" th:text="${deviceRemoteInfo}?${deviceRemoteInfo.serialNumber}:'未知'"></span></div>
                                            <label class="layui-form-label"><span>远程设备IP：</span></label>
                                            <div class="layui-input-inline"><span class="layui-form-text" th:text="${deviceRemoteInfo}?${deviceRemoteInfo.remoteIp}:'未知'"></span></div>
                                            <label class="layui-form-label"><span>远程设备端口：</span></label>
                                            <div class="layui-input-inline"><span class="layui-form-text" th:text="${deviceRemoteInfo}?${deviceRemoteInfo.remotePort}:'未知'"></span></div>
                                        </div>
                                        <div class="layui-form-item">
                                            <label class="layui-form-label"><span>摄像头型号：</span></label>
                                            <div class="layui-input-inline"><span class="layui-form-text" th:text="${deviceRemoteInfo}?${deviceRemoteInfo.cameraModel}:'未知'"></span></div>
                                            <label class="layui-form-label"><span>流量卡IMEI码：</span></label>
                                            <div class="layui-input-inline"><span class="layui-form-text" th:text="${deviceRemoteInfo}?${deviceRemoteInfo.imei}:'未知'"></span></div>
                                        </div>
                                        <div class="layui-form-item">
                                            <label class="layui-form-label"><span>屏幕亮度：</span></label>
                                            <div class="layui-input-inline"><span class="layui-form-text" th:text="${deviceRemoteInfo}?${deviceRemoteInfo.screenBrightness}:'未知'"></span></div>
                                            <label class="layui-form-label"><span>声音大小：</span></label>
                                            <div class="layui-input-inline"><span class="layui-form-text" th:text="${deviceRemoteInfo}?${deviceRemoteInfo.volume}:'未知'"></span></div>
                                            <label class="layui-form-label"><span>人脸识别度：</span></label>
                                            <div class="layui-input-inline"><span class="layui-form-text" th:text="${deviceRemoteInfo}?${deviceRemoteInfo.faceThreshold} + '%,时可进行开门':'未知'"></span></div>
                                        </div>
                                        <div class="layui-form-item">
                                            <label class="layui-form-label"><span>定时开关屏：</span></label>
                                            <div th:switch="${deviceRemoteInfo} != null">
                                                <div class="layui-input-inline">
                                                    <div th:case="true" >
                                                        <div th:switch="${deviceRemoteInfo.timingOpenScreen}">
                                                            <span class="layui-badge layui-bg-green" style="margin-top: 10px;" th:case="1">开启</span>
                                                            <span class="layui-badge layui-bg-black" style="margin-top: 10px;" th:case="2">关闭</span>
                                                            <span class="layui-badge layui-bg-black" style="margin-top: 10px;" th:case="*">未知</span>
                                                        </div>
                                                    </div>
                                                    <div th:case="false"><span class="layui-badge layui-bg-black" style="margin-top: 10px;">未知</span></div>
                                                </div>
                                            </div>
                                            <label class="layui-form-label"><span>活体检测：</span></label>
                                            <div th:switch="${deviceRemoteInfo} != null">
                                                <div class="layui-input-inline">
                                                    <div th:case="true" >
                                                        <div th:switch="${deviceRemoteInfo.liveDetect}">
                                                            <span class="layui-badge layui-bg-green" style="margin-top: 10px;" th:case="1">开启</span>
                                                            <span class="layui-badge layui-bg-black" style="margin-top: 10px;" th:case="2">关闭</span>
                                                            <span class="layui-badge layui-bg-black" style="margin-top: 10px;" th:case="*">未知</span>
                                                        </div>
                                                    </div>
                                                    <div th:case="false"><span class="layui-badge layui-bg-black" style="margin-top: 10px;">未知</span></div>
                                                </div>
                                            </div>
                                        </div>
                                        <div class="layui-form-item">
                                            <label class="layui-form-label"><span>CPU温度：</span></label>
                                            <div th:switch="${deviceRemoteInfo} != null">
                                                <div class="layui-input-inline">
                                                    <div th:case="true">
                                                        <div th:switch="${deviceRemoteInfo.cpuTemperature} != null">
                                                            <span class="layui-form-text" th:case="true" th:text="${deviceRemoteInfo.cpuTemperature} + '°C'"></span>
                                                            <span class="layui-form-text" th:case="*">未知</span>
                                                        </div>
                                                    </div>
                                                    <div th:case="*"><span class="layui-form-text">未知</span></div>
                                                </div>
                                            </div>
                                            <label class="layui-form-label"><span>硬盘空间使用率：</span></label>
                                            <div class="layui-input-inline"><span class="layui-form-text" th:text="${deviceRemoteInfo}?${deviceRemoteInfo.diskSpaceUsage} + '%':'未知'"></span></div>
                                        </div>
                                        <div class="layui-form-item">
                                            <label class="layui-form-label"><span>设备门禁卡总数：</span></label>
                                            <div class="layui-input-inline"><span class="layui-form-text" th:text="${deviceRemoteInfo}?${deviceRemoteInfo.cardTotal}:'未知'"></span></div>
                                            <label class="layui-form-label"><span>设备人脸总数：</span></label>
                                            <div class="layui-input-inline"><span class="layui-form-text" th:text="${deviceRemoteInfo}?${deviceRemoteInfo.faceTotal}:'未知'"></span></div>
                                            <label class="layui-form-label"><span>设备禁用信息：</span></label>
                                            <div class="layui-input-inline"><span class="layui-form-text" th:text="${deviceRemoteInfo}?${deviceRemoteInfo.disableInfo}:'未知'"></span></div>
                                        </div>
                                        <div class="layui-form-item">
                                            <label class="layui-form-label"><span>设备当前版本：</span></label>
                                            <div class="layui-input-inline"><span class="layui-form-text" th:text="${deviceRemoteInfo}?${deviceRemoteInfo.pkgVersion}:'未知'"></span></div>
                                            <label class="layui-form-label"><span>恢复出厂的升级包版本：</span></label>
                                            <div class="layui-input-inline"><span class="layui-form-text" th:text="${deviceRemoteInfo}?${deviceRemoteInfo.restorePkgVersion}:'未知'"></span></div>
                                        </div>
                                        <div class="layui-form-item">
                                            <label class="layui-form-label"><span>创建时间：</span></label>
                                            <div class="layui-input-inline"><span class="layui-form-text" th:text="${deviceRemoteInfo}?${#dates.format(deviceRemoteInfo.createDate,'yyyy-MM-dd HH:mm:ss')}:'未知'"></span></div>
                                            <label class="layui-form-label"><span>更新时间：</span></label>
                                            <div class="layui-input-inline"><span class="layui-form-text" th:text="${deviceRemoteInfo}?${#dates.format(deviceRemoteInfo.updateDate,'yyyy-MM-dd HH:mm:ss')}:'未知'"></span></div>
                                        </div>
                                    </div>
                                </fieldset>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </body>
    <!-- javascript -->
    <script type="text/javascript" th:src="@{'/layui/layui.js'}" charset="utf-8"></script>
    <script type="text/javascript">
        layui.config({
            base: '/' //静态资源所在路径
        });
    </script>
    <script type="text/javascript" th:src="@{'/js/device/device-info.js'}" charset="utf-8"></script>

    <!-- 设备信息 -->
    <script type="text/html" id="device_info_template">
        <fieldset class="layui-elem-field">
            <legend>基本信息</legend>
            <div class="layui-field-box">
                <div class="layui-form-item">
                    <label class="layui-form-label"><span>设备别名：</span></label>
                    <div class="layui-input-inline"><span class="layui-form-text">{{ d.data.alias }}</span></div>
                    <label class="layui-form-label"><span>设备名称：</span></label>
                    <div class="layui-input-inline"><span class="layui-form-text">{{ d.data.name }}</span></div>
                    <label class="layui-form-label"><span>设备序列号：</span></label>
                    <div class="layui-input-inline"><span class="layui-form-text">{{ d.data.serialNumber }}</span></div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label"><span>设备厂商：</span></label>
                    <div class="layui-input-inline">
                        {{#  layui.each(d.data.deviceFactoryDict, function(index, item){ }}
                            {{#  if(d.data.deviceFactory == item.dictKey){ }}
                            <span class="layui-badge layui-bg-blue" style="margin-top: 10px;">{{ item.dictValue }}</span>
                        {{#  } }}
                        {{#  }); }}
                    </div>
                    <label class="layui-form-label"><span>设备型号：</span></label>
                    <div class="layui-input-inline"><span class="layui-form-text">{{ null == d.data.deviceModelNumber ? '未知' : d.data.deviceModelNumber }}</span></div>
                    <label class="layui-form-label"><span>设备版本号：</span></label>
                    <div class="layui-input-inline">
                        <span class="layui-form-text">{{ null == d.data.versionNumber ? '未知' : d.data.versionNumber }}</span>
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label"><span>创建人：</span></label>
                    <div class="layui-input-inline">
                        <span class="layui-form-text">{{ d.data.createAccountName ? d.data.createAccountName : '未知' }}</span>
                    </div>
                    <label class="layui-form-label"><span>创建时间：</span></label>
                    <div class="layui-input-inline">
                        <span class="layui-form-text">{{ layui.util.toDateString(d.data.createDate,"yyyy-MM-dd HH:mm:ss") }}</span>
                    </div>
                </div>
            </div>
        </fieldset>
        <fieldset class="layui-elem-field">
            <legend>安装状态</legend>
            <div class="layui-field-box">
                <div class="layui-form-item">
                    <label class="layui-form-label"><span>小区名称：</span></label>
                    <div class="layui-input-inline"><span class="layui-form-text">{{ d.data.xqName }}</span></div>
                    <label class="layui-form-label"><span>单元名称：</span></label>
                    <div class="layui-input-inline"><span class="layui-form-text">{{ d.data.dyName ? d.data.dyName : '无' }}</span></div>
                    <label class="layui-form-label"><span>位置名称：</span></label>
                    <div class="layui-input-inline"><span class="layui-form-text">{{ d.data.installPath }}</span></div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label"><span>在线状态：</span></label>
                    <div class="layui-input-inline">
                        {{# var overTime = new Date().getTime() - 1000 * 60 * 30; }}
                        {{#  if(d.data.lastHeartbeat > overTime){ }}
                        <span class="layui-badge layui-bg-green" style="margin-top: 10px;">在线</span>
                        {{#  } else { }}
                        <span class="layui-badge layui-bg-cyan" style="margin-top: 10px;">离线</span>
                        {{#  } }}
                    </div>
                </div>
            </div>
        </fieldset>
        <fieldset class="layui-elem-field">
            <legend>基本配置</legend>
            <div class="layui-field-box">
                <div class="layui-form-item">
                    <label class="layui-form-label"><span>设备尺寸：</span></label>
                    <div class="layui-input-inline"><span class="layui-form-text">{{ d.data.size ? d.data.size + '寸' : '未知'}}</span></div>
                    <label class="layui-form-label"><span>屏幕亮度：</span></label>
                    <div class="layui-input-inline"><span class="layui-form-text">{{ d.data.options ? d.data.options.screenBrightness : '未知' }}</span></div>
                    <label class="layui-form-label"><span>通话音量：</span></label>
                    <div class="layui-input-inline"><span class="layui-form-text">{{ d.data.options ? d.data.options.callVolume : '未知' }}</span></div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label"><span>开门密码：</span></label>
                    <div class="layui-input-inline"><span class="layui-form-text">{{ d.data.options ? d.data.options.openDoorPwd : '未知' }}</span></div>
                    <label class="layui-form-label"><span>管理密码：</span></label>
                    <div class="layui-input-inline"><span class="layui-form-text">{{ d.data.options ? d.data.options.adminPwd : '未知' }}</span></div>
                    <label class="layui-form-label"><span>开门时长：</span></label>
                    <div class="layui-input-inline"><span class="layui-form-text">{{ d.data.options ? d.data.options.delay + 's' : '未知' }}</span></div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label"><span>显示姓名：</span></label>
                    <div class="layui-input-inline">
                        {{#  if(d.data.options ? d.data.options.isShowUsername == 1 : '未知'){ }}
                        <span class="layui-badge layui-bg-green" style="margin-top: 10px;">显示</span>
                        {{#  } else if(d.data.options ? d.data.options.isShowUsername == 2 : '未知') { }}
                        <span class="layui-badge layui-bg-black" style="margin-top: 10px;">不显示</span>
                        {{#  } }}
                    </div>
                    <label class="layui-form-label"><span>启用策略：</span></label>
                    <div class="layui-input-inline">
                        {{#  if(d.data.timeStrategyIsEnable == 1){ }}
                        <span class="layui-badge layui-bg-green" style="margin-top: 10px;">是</span>
                        {{#  } else if(d.data.timeStrategyIsEnable == 2) { }}
                        <span class="layui-badge layui-bg-black" style="margin-top: 10px;">否</span>
                        {{#  } }}
                    </div>
                    <label class="layui-form-label"><span>设备朝向：</span></label>
                    <div class="layui-input-inline">
                        {{#  if(d.data.isOut == 1){ }}
                        <span class="layui-badge layui-bg-green" style="margin-top: 10px;">进</span>
                        {{#  } else if(d.data.isOut == 2) { }}
                        <span class="layui-badge layui-bg-black" style="margin-top: 10px;">出</span>
                        {{#  } }}
                    </div>
                </div>
            </div>
        </fieldset>
        <fieldset class="layui-elem-field">
            <legend>广告信息</legend>
            <div class="layui-field-box">
                <div class="layui-form-item">
                    <label class="layui-form-label"><span>广告音量：</span></label>
                    <div class="layui-input-inline"><span class="layui-form-text">{{d.data.options ?  d.data.options.adVolume : '未知' }}</span></div>
                    <label class="layui-form-label"><span>广告播放模式：</span></label>
                    <div class="layui-input-inline">
                        {{#  if(!d.data.options){ }}
                        <span class="layui-badge layui-bg-black" style="margin-top: 10px;">未知</span>
                        {{#  } else if(d.data.options.playModel == '1') { }}
                        <span class="layui-badge layui-bg-green" style="margin-top: 10px;">循环播放</span>
                        {{#  } else if(d.data.options.playModel == '2') { }}
                        <span class="layui-badge layui-bg-black" style="margin-top: 10px;">靠近播放</span>
                        {{#  } else if(d.data.options.playModel == '3') { }}
                        <span class="layui-badge layui-bg-blue" style="margin-top: 10px;">按性别和年龄播放</span>
                        {{#  } }}
                    </div>
                </div>
            </div>
        </fieldset>
        <fieldset class="layui-elem-field">
            <legend>设备功能</legend>
            <div class="layui-field-box">
                <div class="layui-form-item">
                    <label class="layui-form-label"><span>是否支持门禁卡片功能：</span></label>
                    <div class="layui-input-inline">
                        {{#  if(d.data.haveCard == '1'){ }}
                        <span class="layui-badge layui-bg-green" style="margin-top: 10px;">支持</span>
                        {{#  } else if(d.data.haveCard == '2') { }}
                        <span class="layui-badge layui-bg-black" style="margin-top: 10px;">不支持</span>
                        {{#  } }}
                    </div>
                    <label class="layui-form-label"><span>是否支持人脸识别功能：</span></label>
                    <div class="layui-input-inline">
                        {{#  if(d.data.haveFace == '1'){ }}
                        <span class="layui-badge layui-bg-green" style="margin-top: 10px;">支持</span>
                        {{#  } else if(d.data.haveFace == '2') { }}
                        <span class="layui-badge layui-bg-black" style="margin-top: 10px;">不支持</span>
                        {{#  } }}
                    </div>
                    <label class="layui-form-label"><span>是否支持视频通话功能：</span></label>
                    <div class="layui-input-inline">
                        {{#  if(d.data.haveCall == '1'){ }}
                        <span class="layui-badge layui-bg-green" style="margin-top: 10px;">支持</span>
                        {{#  } else if(d.data.haveCall == '2') { }}
                        <span class="layui-badge layui-bg-black" style="margin-top: 10px;">不支持</span>
                        {{#  } }}
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label"><span>是否支持视频通话功能：</span></label>
                    <div class="layui-input-inline">
                        {{#  if(d.data.haveCall == '1'){ }}
                        <span class="layui-badge layui-bg-green" style="margin-top: 10px;">支持</span>
                        {{#  } else if(d.data.haveCall == '2') { }}
                        <span class="layui-badge layui-bg-black" style="margin-top: 10px;">不支持</span>
                        {{#  } }}
                    </div>
                    <label class="layui-form-label"><span>是否支持一键重启功能：</span></label>
                    <div class="layui-input-inline">
                        {{#  if(d.data.reboot == '1'){ }}
                        <span class="layui-badge layui-bg-green" style="margin-top: 10px;">支持</span>
                        {{#  } else if(d.data.reboot == '2') { }}
                        <span class="layui-badge layui-bg-black" style="margin-top: 10px;">不支持</span>
                        {{#  } }}
                    </div>
                </div>
            </div>
        </fieldset>
        <fieldset class="layui-elem-field">
            <legend>人脸识别功能信息</legend>
            <div class="layui-field-box">
                <div class="layui-form-item">
                    <label class="layui-form-label"><span>活体检测：</span></label>
                    <div class="layui-input-inline">
                        {{#  if(!d.data.options){ }}
                        <span class="layui-badge layui-bg-black" style="margin-top: 10px;">未知</span>
                        {{#  } else if(d.data.options.liveDetect == '1') { }}
                        <span class="layui-badge layui-bg-black" style="margin-top: 10px;">开启</span>
                        {{#  } else if(d.data.options.liveDetect == '2') { }}
                        <span class="layui-badge layui-bg-black" style="margin-top: 10px;">关闭</span>
                        {{#  } }}
                    </div>
                    <label class="layui-form-label"><span>识别框位置：</span></label>
                    <div class="layui-input-inline">
                        {{#  if(!d.data.options){ }}
                        <span class="layui-badge layui-bg-black" style="margin-top: 10px;">未知</span>
                        {{#  } else if(d.data.options.discernBoxPosition == '1') { }}
                        <span class="layui-badge layui-bg-green" style="margin-top: 10px;">左上角</span>
                        {{#  } else if(d.data.options.discernBoxPosition == '2') { }}
                        <span class="layui-badge layui-bg-black" style="margin-top: 10px;">左下角</span>
                        {{#  } else if(d.data.options.discernBoxPosition == '3') { }}
                        <span class="layui-badge layui-bg-blue" style="margin-top: 10px;">中间位置</span>
                        {{#  } else if(d.data.options.discernBoxPosition == '4') { }}
                        <span class="layui-badge layui-bg-cyan" style="margin-top: 10px;">右下角</span>
                        {{#  } }}
                    </div>
                    <label class="layui-form-label" style="padding-right: 0px"><span>识别度达：</span></label>
                    <div class="layui-input-inline"><span class="layui-form-text">{{d.data.options ? d.data.options.fillLight + '%,时可进行开门' : '未知'}}</span></div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label"><span>补光灯亮度：</span></label>
                    <div class="layui-input-inline"><span class="layui-form-text">{{d.data.options ? d.data.options.fillLight : '未知' }}</span></div>
                </div>
            </div>
        </fieldset>
        <fieldset class="layui-elem-field">
            <legend>流量卡信息</legend>
            <div class="layui-field-box">
                <div class="layui-form-item">
                    <label class="layui-form-label"><span>绑定状态:</span></label>
                    <div class="layui-input-inline">
                        {{#  if(d.data.flowCardId != null){ }}
                        <span class="layui-badge layui-bg-green" style="margin-top: 10px;">已绑定</span>
                        {{#  } else { }}
                        <span class="layui-badge layui-bg-black" style="margin-top: 10px;">未绑定</span>
                        {{#  } }}
                    </div>
                    <label class="layui-form-label"><span>流量卡卡号:</span></label>
                    <div class="layui-input-inline">
                        {{#  if(d.data.flowCardId != null){ }}
                        <span class="layui-badge layui-bg-green" style="margin-top: 10px;">{{ d.data.flowCardNum }}</span>
                        {{#  } else { }}
                        <span class="layui-badge layui-bg-red" style="margin-top: 10px;">未绑定</span>
                        {{#  } }}
                    </div>
                    <label class="layui-form-label"><span>流量卡有效期:</span></label>
                    <div class="layui-input-inline" style="width: 300px">
                        <span class="layui-form-text">{{ d.data.flowCardBeginDate != null ? layui.util.toDateString(d.data.flowCardBeginDate,"yyyy-MM-dd HH:mm:ss") : ""}}
                            - {{ d.data.flowCardEndDate != null ? layui.util.toDateString(d.data.flowCardEndDate,"yyyy-MM-dd HH:mm:ss") : "" }}</span>
                    </div>
                </div>
            </div>
        </fieldset>
        <fieldset class="layui-elem-field">
            <legend>备注</legend>
            <div class="layui-field-box">
                <div class="layui-input-block" style="margin-left: 10px">
                    <span class="layui-form-text">{{ d.data.remark ? d.data.remark : '暂无备注' }}</span>
                </div>
            </div>
        </fieldset>
    </script>

</html>
