draftArticleDetail.html 14.4 KB
<!DOCTYPE html>
<html>

<!--<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>
                                内容来源: <span id="sourceStr"></span>
                                <br>
                                内容统计: 文字-<span id="contentLength" ></span>&nbsp;&nbsp;&nbsp; 图片-<span
                                    id="imgSize"></span>&nbsp;&nbsp;&nbsp;关联商品-<span id="productSize"></span>
                                <br>
                                审核状态:<span id="authStatusStr"></span>
                            </div>
                        </td>
                    </tr>

                    <tr style="height: 60px">
                        <td>
                            <div id="articleContent1" style="float: left">
                                <span>文字内容:</span>
                            </div>
                            <div id="articleContent"  style=" white-space: pre-wrap;float: left; margin-left: 18px; width: 800px;word-wrap:break-word">
                            </div>
                        </td>
                    </tr>
                    <tr style="height: 20px">
                        <td>
                            <div id="labelList">

                            </div>

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

                            </div>

                        </td>
                    </tr>
                    <tr style="height: 60px">
                        <td>
                            <div class="swiper-container">
                                <div class="swiper-wrapper" id="imageListDiv">

                                </div>
                                <!--&lt;!&ndash; 如果需要分页器 &ndash;&gt;-->
                                <!--<div class="swiper-pagination"></div>-->

                                <!-- 如果需要导航按钮 -->
                                <div class="swiper-button-prev"></div>
                                <div class="swiper-button-next"></div>

                                <!--&lt;!&ndash; 如果需要滚动条 &ndash;&gt;-->
                                <!--<div class="swiper-scrollbar"></div>-->
                            </div>
                        </td>
                    </tr>
                    <tr style="height: 60px">
                        <td>

                            <div id="relatedProduct">


                            </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>-->
<script>
    var mySwiper = new Swiper('.swiper-container', {
//        direction: 'vertical', // 垂直切换选项
//        loop: true, // 循环模式选项

//        // 如果需要分页器
//        pagination: {
//            el: '.swiper-pagination',
//        },
        observer: true,           //修改swiper自己或子元素时,自动初始化swiper
        observeParents: true,    //修改swiper的父元素时,自动初始化swipe
        // 如果需要前进后退按钮
        navigation: {
            nextEl: '.swiper-button-next',
            prevEl: '.swiper-button-prev',
        },

//        // 如果需要滚动条
//        scrollbar: {
//            el: '.swiper-scrollbar',
//        },
    })
</script>


<script>

    $(function () {
        //加载数据
        var data = paramObject.mkData;
        var articleId = data.articleId;

        //获取文章的详细信息
        $.ajax({
            type: "get",
            url: serverContextPath + "/grassArticle/getArticleById?articleId=" + articleId,
            success: function (data) {
                debugger
                if (data != null) {//成功的
                    var detailInfo = data.data;
                    $("#authorUid").html(detailInfo.authorUid);
                    $("#nickName").html(detailInfo.nickName);
                    $("#sourceStr").html(detailInfo.sourceStr);
                    $("#contentLength").html(detailInfo.articleContent == null ? 0 : detailInfo.articleContent.length);
                    $("#articleContent").html(detailInfo.articleContent == null || detailInfo.articleContent.length == 0 ? "空" :  detailInfo.articleContent);

                    var imgSize = detailInfo.imgList == null ? 0 : detailInfo.imgList.length;
                    $("#imgSize").html(imgSize);

                    //展示图片(肯定有图片,没图片那就是业务有问题,或者数据有问题)
                    if (detailInfo.imgList != null && detailInfo.imgList.length > 0) {
                        var imageDivStr = "";
                        for (var i = 0; i < detailInfo.imgList.length; i++) {
                            imageDivStr += '<div class="swiper-slide" style="text-align: center;line-height:300px;"><img src="' + detailInfo.imgList[i] + '" style="max-width: 400px;max-height:300px;margin-left: 100px;margin-right: 5px"/></div>';
                        }
                        $("#imageListDiv").html(imageDivStr);
                    }

                    var productSize = detailInfo.productlList == null ? 0 : detailInfo.productlList.length;
                    $("#productSize").html(productSize);
                    var authStatusStr = "";
                    var authStatus = detailInfo.authStatus;
                    if (authStatus == null || authStatus == '0') {
                        authStatusStr = "待审核";
                        // $("#authBtn").attr("style", "display:block");
                        $("#publishBtn").attr("style", "display:none");
                        $("#timerBtn").attr("style", "display:none");
                        $("#cancelBtn").attr("style", "display:none");
                    } else if (authStatus == '1' ) {
                        authStatusStr = "已通过";
                        if(detailInfo.hasPublished == 'N'){
                            // $("#cancelBtn").attr("style", "display:block");
                            $("#publishBtn").attr("style", "display:none");
                            $("#timerBtn").attr("style", "display:none");
                        }
                    } else if (authStatus == '2') {
                        authStatusStr = "未通过";
                        $("#publishBtn").attr("style", "display:none");
                        $("#timerBtn").attr("style", "display:none");
                        $("#cancelBtn").attr("style", "display:none");
                    }else if(authStatus == '9'){
                        authStatusStr = "未审核";
                        // $("#publishBtn").attr("style", "display:block");
                        // $("#timerBtn").attr("style", "display:block");
                        $("#cancelBtn").attr("style", "display:none");
                    }
                    $("#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("关联话题: 无");
                    }

                    //关联商品
                    if (detailInfo.productlList != null && detailInfo.productlList.length > 0) {
                        var productStr = "";
                        for (var i = 0; i < detailInfo.productlList.length; i++) {
                            productStr += "<div style='float:left;word-wrap:break-word;word-break: break-all;width: 100px;margin-left: 10px;font-size: 12px'>" +
                                "<img src='" + detailInfo.productlList[i].productImage + "' style='margin-left:30px;width:50px;height: 50px;align: center'><br>商品:"
                                + detailInfo.productlList[i].productName + "<br>skn:" +
                                detailInfo.productlList[i].productSkn + "</div>";
                        }
                        $("#relatedProduct").html(productStr);

                    } else {//没有关联商品
                        $("#relatedProduct").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>