{{template "header"}}
<style>
    .card-box {
        padding: 0px;
    }

    thead {
        background: #f5f5f5;
    }

    .btn-sm {
        padding: 2px 6px;
        font-size: 12px;
    }

    .text-danger {
        color: #ff5d48 !important;
        margin-right: 5px;
    }
</style>
<div class="row">
    <!-- Page-Title -->
    <div class="row">
        <div class="col-sm-12">
            <h4 class="page-title">系统设置</h4>
        </div>

        <div class="col-sm-12">
            <div class="card-box table-responsive">
                <table class="table table-hover">
                    <thead>
                    <tr>
                        <th width="15%">名称</th>
                        <th>介绍</th>
                        <th>更新时间</th>
                        <th width="10%;">配置状态</th>
                        <th width="10%;">状态</th>
                        <th width="6%">操作</th>
                    </tr>
                    </thead>
                    <tbody id="tableList">
                    {{range $i, $e := .dataList}}
                    <tr>
                        <td>{{$e.setting_name}} </td>
                        <td>{{$e.setting_dis}}</td>
                        <td>{{$e.update_time}}</td>
                        <td>{{if ne $e.info ""}}
                            已配置
                        {{else}}
                            未配置
                        {{end}}
                        </td>
                        <td><input type="checkbox" id="checkbox-{{$e.id}}" data-plugin="switchery"
                                   onchange="updateStatusFunc('{{$e.id}}',this)" data-color="#039cfd" data-size="small"
                        {{if eq $e.status 1}}
                                   checked
                        {{end}}
                        />
                        </td>
                        <td>
                            <button type="button" class="btn btn-primary  btn-sm"
                                    onclick="settingSubFunc('{{$e.id}}','{{$e.type}}')" data-toggle="modal"><i
                                    class="fa fa-edit"></i> 配置
                            </button>
                        </td>
                    </tr>
                    {{end}}
                    </tbody>
                </table>
            </div>
        </div>

    </div>
</div>

<!-- Modal -->
<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span>
                </button>
                <h4 class="modal-title" id="myModalLabel">E-mail 通知设置</h4>
            </div>
            <div class="modal-body">
                <div class="form-group">
                    <label for=""><span class="text-danger">*</span>发送人(账号)</label>
                    <input type="email" class="form-control" id="email" name="email" placeholder="请填写发送人账号">
                </div>
                <div class="form-group">
                    <label for=""><span class="text-danger">*</span>密码</label>
                    <input type="text" class="form-control" id="pass" name="pass" placeholder="请填写发送人密码">
                </div>
                <div class="form-group">
                    <label for=""><span class="text-danger">*</span>SMTP</label>
                    <input type="text" class="form-control" id="host" name="host" placeholder="例:smtp.126.com">
                </div>
                <div class="form-group">
                    <label for=""><span class="text-danger">*</span>端口</label>
                    <input type="number" class="form-control" id="port" name="port" placeholder="例:465">
                </div>
            </div>
            <div class="modal-footer">
                <button type="submit" class="btn btn-primary" onclick="updateEmailPost()">保存</button>
            </div>
        </div>
    </div>
</div>
<input type="hidden" value="" id="settingId">
{{template "footer" }}
<script>
    function settingSubFunc(id, type) {
        $("#settingId").val(id)
        getSettingInfo(id, type)
        switch (type) {
            case "mail":
                $('#myModal').modal('show')
                break
            case "login":
                $('#settingLoginModal').modal('show')
                break
            default:
                break
        }
    }

    var getSettingInfo = function (id, type) {
        $.ajax({
            type: "get",
            url: "/get/setting/info?id=" + id
        }).success(function (result) {
            if (result.code == 200) {
                var arr = result.data[0].info.split("&&")
                if (arr.length == 4 && result.data[0].type == "mail") {
                    $("#email").val(arr[2])
                    $("#pass").val(arr[3])
                    $("#host").val(arr[0])
                    $("#port").val(arr[1])
                } else if (arr.length == 2 && result.data[0].type == "login") {
                    $("#loginName").val(arr[0])
                    $("#loginPwd").val(arr[1])
                }
            }
        }).fail(function (err) {
            console.log(err)
        })
    };

    function updateEmailPost() {
        var params = {
            email: $("#email").val(),
            pass: $("#pass").val(),
            host: $("#host").val(),
            port: $("#port").val(),
            id: $("#settingId").val()
        };

        $.ajax({
            type: "post",
            url: "/post/setting/update",
            data: params
        }).success(function (result) {
            if (result.code == 200) {
                if (!$("#checkbox-" + params.id).prop("checked")) {
                    $("#checkbox-" + params.id).click()
                }
            }
            $('#myModal').modal('hide')

        }).fail(function (err) {
            console.log(err)
        })
    }

    function updateStatusFunc(id, ele) {
        var params = {
            "id": id,
            "status": $(ele).is(":checked") ? 1 : 0
        };

        $.ajax({
            type: "post",
            url: "/post/setting/checkSetting",
            data: params
        }).success(function (result) {
            if (result.code == 10003) {
                swal(result.msg)
                $(ele).click()
            }
        }).fail(function (err) {
            console.log(err)
        })
    }
</script>