<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
    <head>
        <meta charset="UTF-8">
        <title>人员库列表</title>
        <meta name="viewport" content="width=device-width,initial-scale=1,user-scalable=0,viewport-fit=cover">
        <link rel="stylesheet" th:href="@{/static/css/weui.css}" href="../static/css/weui.css">
        <link rel="stylesheet" th:href="@{/static/css/example.css}" href="../static/css/example.css">
    </head>
    <body>
        <div class="container" id="app" style="display:flex;flex-direction:column;">
            <div class="page__hd">
                <h1 class="page__title" th:text="${device.aliasName}"></h1>
                <p class="page__desc">照片库列表</p>
                <div class="right-corner">
                    <a class="weui-btn weui-btn_mini weui-btn_default" @click="gotoDeviceList()">返回</a>
                </div>
            </div>
            <div>
                <button class="weui-btn weui-btn_mini weui-btn_primary" @click="remoteOpened()">远程开门</button>
                <button class="weui-btn weui-btn_mini weui-btn_warn" @click="remoteReboot()">重启设备</button>
            </div>
            <div class="weui-cells" style="flex:1;overflow:auto;">
                <a class="weui-cell  weui-cell_access" @click="gotoPeopleList(item)"  v-for="(item,index) in list">
                    <div class="weui-cell__bd">
                        <p v-html="item.Name"></p>
                        <small v-html="'人员数：' + item.FaceNum"></small>
                    </div>
                    <div class="weui-cell__ft"></div>
                </a>
            </div>
        </div>
        <script th:src="@{/static/js/jquery.min.js}" src="../static/js/jquery.min.js"></script>
        <script th:src="@{/static/js/jquery.cookie.min.js}" src="../static/js/jquery.cookie.min.js"></script>
        <script th:src="@{/static/js/vue.js}" src="../static/js/vue.js"></script>
        <script th:src="@{/static/js/weui.min.js}" src="../static/js/weui.min.js"></script>
        <script type="text/javascript" th:inline="javascript">
            var path = [[${#httpServletRequest.contextPath}]];
            var device = [[${device}]];
        </script>
        <script type="text/javascript">
            var vm = new Vue({
                el:"#app",
                data : {
                    list: [],
                    className: "",
                    token:$.cookie('devOpsToken'),
                    loading: false
                },
                methods: {
                    gotoDeviceList() {
                        window.location.href = path + "/devOps/listOfDevice";
                    },
                    gotoPeopleList(lib){
                        window.location.href = path + "/devOps/listOfPeople?deviceId=" + device.id + "&libId=" + lib.ID + "&libName=" + encodeURIComponent(lib.Name);
                    },
                    pageSearch() {
                        var self = this;
                        self.loading = true;

                        $.get(path + "/devOps/queryPeopleLib",{
                            deviceNo : device.deviceNo
                        },
                        function(rs){
                            self.loading = false;

                            if(rs.result){
                                self.list = rs.data.Response.Data.LibList;
                            }else{
                                alert(rs.message);
                            }
                        }, "json");
                    },
                    delayAlert(msg) {
                        setTimeout(function(){
                            weui.alert(msg);
                        },500);
                    },
                    remoteOpened(){
                        var self = this;

                        weui.confirm('是否确定打开' + device.aliasName +'？', function(){
                            $.post(path + "/devOps/remoteOpened",{
                                deviceId : device.id
                            },
                            function(rs){
                                if(rs.result){
                                    self.delayAlert(rs.message);
                                }else{
                                    self.delayAlert(rs.message);
                                }
                            },"json");
                        }, null);
                    },
                    remoteReboot() {
                        var self = this;

                        weui.confirm('是否确定重启' + device.aliasName + '？', function(){
                            $.post(path + "/base/deviceInfo/reboot",{
                                deviceId : device.id
                            },
                            function(rs){
                                if(rs.result){
                                    self.delayAlert(rs.message);
                                }else{
                                    self.delayAlert(rs.message);
                                }
                            },"json");
                        }, null);
                    }
                },
                mounted: function() {
                    this.pageSearch();
                }
            });
        </script>
    </body>
</html>