<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8" />
    <meta name="viewport" content="user-scalable=0,width=device-width,initial-scale=1.0" />
    <meta name="format-detection" content="telephone=no,email=no,date=no,address=no" />
    <link rel="stylesheet" type="text/css" href="../css/aui-cnc2.css" />
    <link rel="stylesheet" type="text/css" href="../css/common-cnc2.css" />
</head>

<body>
    <section class="aui-content container aui-margin-b-10" style="display: none;">
        <div class="aui-grid">
            <div class="aui-row tab-content aui-padding-t-15 tab1" id="test">
                <div class="aui-content aui-margin-b-15">
                    <ul class="aui-list" id="reasoncon">
                        <script id="DotTemplate" type="text/x-dot-template">
                            {{~it.data:value:index}}
                            <li class="aui-list-item msgitem" data-id="{{= value.id}}">
                                <div style="width:100%;">
                                    <div class="ctime" style="color:{{ if(value.read_sign=='0'){ }}#585858{{ }else{ }}#ccc{{ } }};text-align:center;width:100%;">{{= value.yeartime}}</div>
                                    <div class="aui-list-item-inner" style="width:100%;font-size: 0.7rem;{{ if(value.read_sign=='0'){ }}font-weight:600;{{ }else{ }}color:#ccc;{{ } }}">
                                        ● {{= value.content}}
                                    </div>
                                </div>
                            </li>

                            {{~}}
                        </script>
                    </ul>
                </div>
            </div>
            <div class="aui-row tab-content tab2" style="display: none;">
                <div class="aui-content aui-margin-b-15">
                    <ul class="aui-list" id="reasoncon2">
                        <script id="DotTemplate2" type="text/x-dot-template">
                            {{~it.data:value:index}}
                            <li class="aui-list-item msgitem" data-id="{{= value.id}}">
                                <div style="width:100%;">
                                    <div class="ctime" style="color:{{ if(value.read_sign=='0'){ }}#585858{{ }else{ }}#ccc{{ } }};text-align:center;width:100%;">{{= value.yeartime}}</div>
                                    <div class="aui-list-item-inner" style="width:100%;font-size: 0.7rem;{{ if(value.read_sign=='0'){ }}font-weight:600;{{ }else{ }}color:#ccc;{{ } }}">
                                        ● {{= value.content}}
                                    </div>
                                </div>
                            </li>
                            {{~}}
                        </script>
                    </ul>
                </div>
            </div>
        </div>
    </section>
</body>

<script type="text/javascript" src="../script/api.js"></script>
<script type="text/javascript" src="../script/md5.js"></script>
<script type="text/javascript" src="../script/common.js"></script>
<script type="text/javascript" src="../script/swipe.js"></script>
<script type="text/javascript" src="../script/SHA1.js"></script>
<script type="text/javascript" src="../script/doT.min.js"></script>
<script type="text/javascript" src="../script/remotedb.js"></script>
<script type="text/javascript" src="../script/list.js"></script>
<script type="text/javascript" src="../script/aui-tab.js"></script>
<script type="text/javascript" src="../script/aui-toast.js"></script>
<script type="text/javascript" src="../script/aui-selectbox.js"></script>
<script type="text/javascript" src="../script/aui-popup-new.js"></script>
<script type="text/javascript" src="../script/zepto.min.js"></script>
<script type="text/javascript" src="../script/jquery.min.js"></script>
<script type="text/javascript" src="../script/CryptoJS/core.js"></script>
<script type="text/javascript" src="../script/CryptoJS/cipher-core.js"></script>
<script type="text/javascript" src="../script/CryptoJS/mode-ecb.js"></script>
<script type="text/javascript" src="../script/CryptoJS/aes.js"></script>
<script type="text/javascript" src="../script/aui-collapse.js"></script>
<script type="text/javascript" src="../script/i18next-12.0.0.min.js"></script>
<script type="text/javascript" src="../script/i18nextLocizeBackend.min.js"></script>
<script type="text/javascript" src="../script/jquery-i18next.min.js"></script>
<script type="text/javascript" src="../script/jquery.cookie.js"></script>
<script type="text/javascript" src="../script/i18n-app.js"></script>

<script>
    var host, timeTemplate, timeTemplate2, mytab;

    apiready = function () {
        fnReady();

        ajaxsetup();

        timeTemplate = doT.template($("#DotTemplate").text());
        timeTemplate2 = doT.template($("#DotTemplate2").text());

        api.parseTapmode();

        host = $api.getStorage('host');

        api.addEventListener({
            name: 'showtopframe1'
        }, function (ret, err) {
            if (ret) {
                load_i18n(function (t, i18n) {
                    lang = t;
                    i18next = i18n;

                    ajaxsetup();

                    host = $api.getStorage('host');

                    getreasonList();

                    try {
                        var datartn = eval('(' + JSON.stringify(ret) + ')');

                        var ptabindex = datartn['value']['ptabindex'];

                        if (ptabindex) {
                            $('.tab-content').hide();
                            $('.tab' + ptabindex).show();
                        }
                    } catch (e) {} finally {}
                });
            }
        });

        api.addEventListener({
            name: 'doReadall'
        }, function (ret) {
            if (ret) {
                doReadall();
            }
        });

        load_i18n(function (t, i18n) {
            lang = t;
            i18next = i18n;

            getreasonList();

            $('.tab-content').hide();

            $('.tab' + (api.pageParam.ptabindex ? api.pageParam.ptabindex : 1)).show();
        });

        doRefreshEvent();

        console.log(headerHeight + subheaderHeight)

        $('.container').css('margin-top', headerHeight + subheaderHeight);
    };

    function doRefreshEvent() {
        api.setCustomRefreshHeaderInfo({
            bgColor: '#f0f0f0',
            image: {
                pull: 'widget://image/pull.png',
                transform: [
                    'widget://image/pull_end_image_frame_01.png',
                    'widget://image/pull_end_image_frame_02.png',
                    'widget://image/pull_end_image_frame_03.png',
                    'widget://image/pull_end_image_frame_04.png',
                    'widget://image/pull_end_image_frame_05.png'
                ],
                load: [
                    'widget://image/refreshing_image_frame_01.png',
                    'widget://image/refreshing_image_frame_02.png',
                    'widget://image/refreshing_image_frame_03.png',
                    'widget://image/refreshing_image_frame_04.png',
                    'widget://image/refreshing_image_frame_05.png',
                    'widget://image/refreshing_image_frame_06.png'
                ]
            }
        }, function (ret) {
            if (ret) {
                getreasonList();

                setTimeout(function () {
                    api.refreshHeaderLoadDone();
                }, 800);
            }
        });
    }

    function getreasonList() {
        $.ajax({
            url: host + "/Config/AppMsg/MsgList",
            data: JSON.stringify({
                // 0 获取所有 1:应急维修 2:计划维护 3:安灯 4:参数异常监控 5:设备异常监控 6:DNC程序监控 7:状态异常监控 
                // status: 0=未读 1=已读 不传 或者传 空字符串 获取全部
                "type": 0
            }),
            dataType: 'json',
            contentType: 'application/json',
            type: 'POST',
            success: function (result) {
                console.log(JSON.stringify(result));
                if (result.total) {
                    $('.container').show();
                    $('#reasoncon').html(timeTemplate(result));
                    listen_rowclick();
                }
            },
            error: function (err) {
                console.log(JSON.stringify(err));
            }
        })
    }

    function listen_rowclick() {
        $('.msgitem').click(function () {
            var _this = $(this);

            var id = _this.attr('data-id');

            $.ajax({
                url: host + "/Config/AppMsg/ReadMsgById",
                data: JSON.stringify({
                    'msgid': parseInt(id)
                }),
                dataType: 'json',
                contentType: 'application/json',
                type: 'POST',
                success: function (result) {
                    console.log(JSON.stringify(result));
                    if (result.ret == 1) {
                        _this.css('color', '#ccc');

                        _this.find('.ctime').css('color', '#ccc');

                        api.execScript({
                            name: 'root',
                            script: 'loadunread();'
                        });
                    } else {
                        customToast(lang(result.msg), 2000);
                    }
                }
            })
        });
    }

    function doReadall() {
        var msgids = [];

        var _this;

        $('.msgitem').each(function (index, item) {
            _this = $(this);

            // console.log(_this.css('color'));

            if ('rgb(38, 38, 38)' == _this.css('color')) {
                msgids.push(parseInt(_this.attr('data-id')));
            }
        });

        if (!msgids.length) {
            customToast(lang('6660138'), 2000);
            return;
        }

        api.showProgress({
            style: 'default',
            animationType: 'fade',
            title: lang('6660106'),
            text: lang('6660137'),
            modal: true
        });

        $.ajax({
            url: host + "/Config/AppMsg/ReadMsgById",
            data: JSON.stringify({
                "msgarr": msgids
            }),
            dataType: 'json',
            contentType: 'application/json',
            type: 'POST',
            success: function (result) {
                api.hideProgress();
                console.log(JSON.stringify(result));
                if (result.ret == 1) {
                    $('.msgitem').each(function (index, item) {
                        _this = $(this);

                        _this.css('color', '#ccc');

                        _this.find('.ctime').css('color', '#ccc');
                    });

                    api.execScript({
                        name: 'root',
                        script: 'loadunread();'
                    });
                } else {
                    customToast(lang(result.msg), 2000);
                }
            }
        })
    }

    function reloadMe() {
        console.log('reloadMe');
        location.reload();
    }
</script>

</html>