detail.html 11.8 KB

Raw Blame History Permalink

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8"/>
    <title>Yoho!Buy运营平台</title>
    <script src="/pfcms/js/include.js"></script>

    <link rel="stylesheet" href="/pfcms/css/swiper.min.css">
    <script src="/pfcms/js/utils/swiper.min.js"></script>

    <style>
        .btn-long {
            width: 120px;
            height: 37px;
            line-height: 37px;
            font-size: 15px;
            color: white;
            border-radius: 5px;
            display: inline-block;
            cursor: pointer;
            text-align: center;
        }

        .btn-long:hover {
            opacity: 0.9;
        }

        /* 可以设置样式，也可以不设置*/
        .swiper-container {
            width: 700px;
            height: 400px;
        }

        td {
            font-size: 14px;
        }
    </style>
</head>
<body class="easyui-layout">


<div region="center" id="articleDetail" style="margin-left: 20px">
    <div id="tt" class="easyui-layout" fit="true" style="overflow-y: scroll">
        <form name="publishArticleForm" id="publishArticleForm" method="post">
            <input id="checkedId" name="articleId" type="hidden"/>
            <input id="articleImages" name="articleImages" type="hidden"/>
            <input id="articleSkns" name="articleSkns" type="hidden"/>

            <div style="margin-top: 20px;margin-left: 30px">
                <h2>查看详情</h2>
                <table border="0" style="width:95%;margin-top:5px;line-height:30px;" id="tab">

                    <tr style="height: 60px">
                        <td style="font-size: 18px">
                            笔记详情
                        </td>
                    </tr>

                    <tr style="height: 60px">
                        <td>
                            <div>
                                用户Uid： <span id="authorUid"></span> &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;昵称：<span
                                    id="nickName" style="margin-left: 10px"></span>
                                <br>
                                内容类型：长文章<br>
                                内容来源： <span id="sourceStr"></span>
                                <br>
                                版权声明： <span id="copyright"></span>
                                <br>
                                审核状态：<span id="authStatusStr"></span>
                            </div>
                        </td>
                    </tr>


                    <tr style="height: 50px">
                        <td>
                            <div id="labelList">

                            </div>

                        </td>
                    </tr>
                    <tr style="height: 50px">
                        <td>
                            <div id="topic">

                            </div>

                        </td>
                    </tr>

                    <tr style="height: 60px">
                        <td>

                            <div id="articleBody">
                                标题： <span id="articleTitle"></span>
                                <br>
                                副标题： <span id="articleSubtitle"></span>
                                <br>
                                <div style="float: left"> 封面图：</div><div id="coverImg"></div>
                                正文：<div id="content"></div>

                            </div>

                        </td>

                    </tr>
                    <tr style="height: 60px">
                        <td id="goodstd">
                            <div style="float: left;margin-left: 30px">
                                <a id="publishBtn" class="btn-info" style="display: none">发布</a>
                                <a id="cancelBtn" class="btn-info" style="display: none">取消定时</a>
                            </div>
                            <div style="float: left;margin-left: 30px">
                                <a id="timerBtn" class="btn-info" style="display: none">定时发布</a>
                            </div>
                        </td>
                    </tr>

                </table>
            </div>
        </form>

    </div>

</div>

</body>


<script>

    var articleId = getUrlParam("articleId");
    $(function () {
        //加载数据
        console.log("articleId:" + articleId);
        //获取文章的详细信息
        $.ajax({
            type: "get",
            url: serverContextPath + "/grassArticle/getArticleById?articleId=" + articleId,
            success: function (data) {
                debugger
                if (data != null && data.code == 200) {//成功的
                    var detailInfo = data.data;
                    $("#authorUid").html(detailInfo.authorUid);
                    $("#nickName").html(detailInfo.nickName);
                    $("#sourceStr").html(detailInfo.sourceStr);
                    $("#content").html(detailInfo.articleContent == null || detailInfo.articleContent.length == 0 ? "空" :  detailInfo.articleContent);
                    $("#articleTitle").html(detailInfo.articleTitle);
                    $("#articleSubtitle").html(detailInfo.articleSubtitle);

                    var imgHtml = '';
                    if(detailInfo.coverImg !=null && detailInfo.coverImg !=''){
                        var width = detailInfo.imgWidth;
                        var height = detailInfo.imgHeight;
                        var w = width;
                        if(width >240){
                            w =240;
                        }
                        var h = w * height/width;
                        imgHtml = '<img src="'+detailInfo.coverImg+'" style="width:'+w+'px;height:'+h+'px;"/>';
                        $("#coverImg").html(imgHtml);
                    }


                    var copyrightStr = "";
                    var copyright = detailInfo.copyright;
                    if(copyright ==null || copyright=='1'){
                        copyrightStr = "原创";
                    }
                    if(copyright=='2'){
                        copyrightStr = "第三方授权";
                    }
                    if(copyright=='3'){
                        copyrightStr = "未授权";
                    }
                    if(copyright=='4'){
                        copyrightStr = "其他";
                    }
                    $("#copyright").html(copyrightStr);

                    var authStatusStr = "";
                    var authStatus = detailInfo.authStatus;
                    if (authStatus == null || authStatus == '0') {
                        authStatusStr = "待审核";
                        // $("#authBtn").attr("style", "display:block");
                    } else if (authStatus == '1' ) {
                        authStatusStr = "已通过";
                        if(detailInfo.publishTime == 'N'){
                            $("#cancelBtn").attr("style", "display:block");
                        }
                    } else if (authStatus == '2') {
                        authStatusStr = "未通过";
                        // $("#authBtn").attr("style", "display:block");
                    }else if(authStatus == '9'){
                        authStatusStr = "未审核";
                        $("#publishBtn").attr("style", "display:block");
                        $("#timerBtn").attr("style", "display:block");
                    }
                    $("#authStatusStr").html(authStatusStr);

                    if (detailInfo.labelList != null && detailInfo.labelList.length > 0) {
                        var labelStr = "关联标签：  ";
                        for (var i = 0; i < detailInfo.labelList.length; i++) {
                            labelStr += "<span style='margin-left: 10px'>#" + detailInfo.labelList[i].name + "</span>";
                        }
                        $("#labelList").html(labelStr);
                    } else {
                        $("#labelList").html("关联标签： 无");
                    }

                    if (detailInfo.topicName != null ) {
                        var topicStr = "关联话题：  ";
                        topicStr += "<span style='margin-left: 10px'>#" + detailInfo.topicName + "</span>";
                        $("#topic").html(topicStr);
                    } else {
                        $("#topic").html("关联话题： 无");
                    }


                }
            }
        });


    });

    //获取url中的参数方法
    function getUrlParam(name) {
        //构造一个含有目标参数的正则表达式对象
        var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)");
        //匹配目标参数
        var r = window.location.search.substr(1).match(reg);
        //返回参数
        if (r != null) {
            return unescape(r[2]);
        } else {
            return null;
        }
    }

    //发布
    $("#publishBtn").linkbutton({
        iconCls: "icon-search",
        onClick: function () {
            publishArticle(articleId);
        }
    });

    //定时发布
    $("#timerBtn").linkbutton({
        iconCls: "icon-search",
        onClick: function () {
            getEditDialog(articleId,1);
        }
    });

    //取消定时
    $("#cancelBtn").linkbutton({
        iconCls: "icon-search",
        onClick: function () {
            switchTimer(articleId, 2,'');
        }
    });


    function switchTimer(id, status,publishTime) {
        debugger
        var operateType = status == 1 ? 3 : 4;
        $.post(serverContextPath + "/grassArticle/updateArticle.do?articleId=" + id + "&publishTime=" + publishTime+ "&operateType="+ operateType, function (data) {
            if(data.code != 200){
                alert(data.message);
            }else{
                $.messager.alert("操作成功", "操作成功", "info");
                location .reload();
            }
        }, "json");
    }

    function publishArticle(id) {
        debugger
        var operateType = 5;
        $.post(serverContextPath + "/grassArticle/updateArticle.do?articleId=" + id +  "&operateType="+ operateType, function (data) {
            if(data.code != 200){
                alert(data.message);
            }else{
                $.messager.alert("操作成功", "发布成功", "info");
                location .reload();
            }
        }, "json");
    }

    // 定时 选择时间
    function getEditDialog(id, status){
        var timeChoose = $("<div id='timeChoose'>").appendTo($(document.body));
        var title =  "选择时间";
        var textVar = "确认";

        $(timeChoose).myDialog({
            title: title,
            width: "20%",
            height: "20%",
            resizable:false,
            buttons:[{
                id : "saveBtn",
                text:textVar,
                iconCls : "icon-save",
                handler:function(){
                    debugger;
                    if($("#publishTimeStr").datetimebox('getValue') !=null && $("#publishTimeStr").datetimebox('getValue') !=''){
                        var time = parseInt(new Date($("#publishTimeStr").datetimebox('getValue')).getTime() );
                        switchTimer(id, status,time);
                    }
                    $(timeChoose).dialog("close");
                }
            }, {
                text: "关闭",
                iconCls: "icon-cancel",
                handler: function () {
                    $.messager.confirm("确认", "确认关闭吗？", function (flag) {
                        if(flag){
                            $(timeChoose).dialog("close");
                        }
                    });
                }
            }],
            modal: true,
            href: contextPath + "/html/grass/article/chooseTime.html"
        });
    }


</script>
</html>