<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="referrer" content="no-referrer">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1, maximum-scale=1">
    <meta http-equiv="pragma" content="no-cache">
    <meta http-equiv="cache-control" content="no-cache">
    <meta http-equiv="expires" content="0">

    <title>webchat-公众号文章编辑</title>

    <link rel="shortcut icon" href="/favicon.ico" />
    <link rel="bookmark" href="/favicon.ico" />

    <link href="/ref/wangeditor5/editor.css" rel="stylesheet">
    <link href="/css/client/writer.css" rel="stylesheet" type="text/css" />

    <link rel="stylesheet" href="/css/common/common.css">
    <link rel="stylesheet" href="/css/client/writer.css">
    <link href="/ref/layui-v2.6.8/layui/css/layui.css" rel="stylesheet" type="text/css" />

    <script src="/ref/jquery/jquery-3.4.1.js" type="text/javascript"></script>
    <script src="/ref/layui-v2.6.8/layui/layui.js" type="text/javascript"></script>
    <script src="/ref/wangeditor5/editor.js"></script>

</head>
<body style="overflow-x: hidden; background-color: #f6f8f9;">
<center>
    <span th:text="${id}" style="display: none" id="id"></span>

    <div class="article-container">
        <div id="title"></div>
        <div class="author-container">
            <span class="public-account-info">
                <img src="" id="public-account-photo">
                <span id="public-account-name"></span>
            </span>
            <span class="pub-time">发布于：<span id="pub-time">刚刚</span></span>
        </div>
        <div id="description"></div>
        <div id="content"></div>
    </div>

    <div class="article-qr">
        <div style="line-height: 20px; padding-bottom: 10px">手机扫码阅读</div>
        <img id="qr">
    </div>

</center>

<script src="/js/common/login.js"></script>
<script>
    loadArticleDetail($("#id").text());
    function loadArticleDetail(id) {
        $.ajax({
            url:"/api/article/detail/"+id,
            type:"get",
            success:function (data) {
                data = eval(data);
                if (data.success){
                    var article = data.data;
                    if (article == null){
                        // 文章不存在
                        location.href = "/error/404";
                        return;
                    }
                    $("#title").text(article.title);
                    $("#public-account-photo").attr("src",article.publicAccountInfo.photo);
                    $("#public-account-name").text(article.publicAccountInfo.userName);
                    $("#content").html(article.content);
                    $("#description").text(article.description);
                    // $("#pub-time").text(formatMsgTime(article.publishTime));
                    document.title = article.title;
                    $.each($("div[id^='w-e-textarea-']"), function (index, tt) {
                        tt.setAttribute("contenteditable", false);
                        tt.setAttribute("id", "we-"+index);
                    })
                }
            }
        })
    }

    var imageUrl = '/api/qr/create?url=' + location.href;
    document.getElementById('qr').src = imageUrl;
</script>
<script>
    if(/Android|webOS|iPhone|iPod|BlackBerry/i.test(navigator.userAgent)) {
        $(".article-container").css({"width": "calc(100% - 20px)", "padding": "10px"});
    }
</script>
</body>
</html>
