ziqim/Yangcai365_web/manage/zview/template/templateShow.zml

${Scripts.src(zhiqim_uploadlarge.js)}
<script>
function doTemplateDownload()
{//下载文件
    Z.Location.href("templateDownload.htm?mediaId=" + '${media.getMediaId()}');
}

function doTemplateShare()
{//作品库分享
	var shareOperator = Z("#shareOperator").val();
	if(!shareOperator){
		Z.alert("请选择设计师！");
		return;
	}
    var ajax = new Z.Ajax();
    ajax.setClassName("TemplatePresenter");
    ajax.setMethodName("doTemplateShare");
    ajax.addParam("mediaId", '${media.getMediaId()}');
    ajax.addParam("operatorCode", shareOperator);
    ajax.setFailureAlert();
    ajax.setSuccess(function(){
    	Z.success("分享成功", shareList_hide());
    });
    ajax.execute();
}

function doCancelShare()
{// 取消分享
   var ajax = new Z.Ajax();
    ajax.setClassName("TemplatePresenter");
    ajax.setMethodName("doCancelShare");
    ajax.addParam("mediaId", '${media.getMediaId()}');
    ajax.setFailureAlert();
    ajax.setSuccess(function(){
    	Z.success("取消成功");
    });
    ajax.execute();
}

function doTemplateLabel()
{//关联标签
    var dialog = new Z.Dialog();
    dialog.shadow = true;
    dialog.title = "关联行业";
    dialog.hasTitle = true;
    dialog.fixed = true;
    
    var mediaId = '${media.getMediaId()}';
    dialog.url = "templateLabel.htm?mediaId=" + mediaId;
    dialog.width = 1000;
    dialog.height = 600;
    dialog.execute();
}

/*悬浮展示分享列表*/
function shareList_show(){ Z(".share-list").show();}
function shareList_hide(){ Z(".share-list").hide();Z("#share-list [index='0']").click();}

/*收藏点击事件*/
var eventId = '${userEventId}';
function doTemplateCollect(ele)
{
    Z(ele).toggleClass("active");
    //执行操作
    if(Z(ele).hasClass("active"))
    {
        var ajax = new Z.Ajax();
        ajax.setClassName("TemplatePresenter");
        ajax.setMethodName("doTemplateCollect");
        ajax.addParam('${media.getMediaId()}')
        ajax.addParam(eventId);
        ajax.setFailureAlert();
        ajax.setSuccess(function(){
            var collect = this.responseText;
            var collectNum = collect.split("+");
            Z("#collect").text(collectNum[0]);
            eventId = collectNum[1];
         });
         
        ajax.execute();
    }
    else
    {
        var ajax = new Z.Ajax();
        ajax.setClassName("TemplatePresenter");
        ajax.setMethodName("doTemplateCollect");
        ajax.addParam('${media.getMediaId()}')
        ajax.addParam(eventId);
        ajax.setFailureAlert();
        ajax.setSuccess(function(){
            var collect = this.responseText;
            Z("#collect").text(collect);
            eventId = 0;
         });
         
        ajax.execute();
    }
}

/**/
function selectTag(ele)
{//选中标签
    var $active = Z(".tag-edit-list .tab .active");
    $active.removeClass("active");
    var next = $active.next("span");
    $active.next("span").removeClass("zi-hide").addClass("active");
}

function addKeywords(ev)
{//添加关键字
    if (ev.type=="keydown" && ev.keyCode != "13"){
        return;
    }
    Z.E.forbidden(ev);
    var val = Z("#keywords").val();
    if (Z.V.isEmptyBlank(val))
    {
        Z.alert("请输入添加内容！", function(){ Z("#keywords")[0].focus();});
        return;
    }
    
    var ajax = new Z.Ajax();
    ajax.setClassName("LabelPresenter");
    ajax.setMethodName("doTemplateCustomLabelAdd");
    ajax.addParam("mediaId", '${media.getMediaId()}')
    ajax.addParam("keywordName", val);
    ajax.setFailure(function(){Z.alert(ajax.responseText, function(){ Z("#keywords")[0].focus();});});
    ajax.setSuccess(function(){
        var keywordName = this.responseText;
        var $item = Z('<span class="item-diy z-bg-blue"><i class="z-font z-error" onclick="delThisKeyword(this, \'' + keywordName + '\');"></i>' + val + '</span>');
        
        var $wrap = Z(".kwywordItem-list");
        $wrap.append($item);
        Z("#keywords").val("");
    });
    ajax.execute();
}

function delThisKeyword(ele, keywordName)
{//删除关键字
    Z(ele).parent().remove();
    
    var ajax = new Z.Ajax();
    ajax.setClassName("LabelPresenter");
    ajax.setMethodName("doTemplateCustomLabelDelete");
    ajax.addParam("mediaId", '${media.getMediaId()}');
    ajax.addParam("keywordName", keywordName);
    ajax.setFailureAlert();
    ajax.setSuccess(function(){location.reload();});
    ajax.execute();
        
}

function doTemplateDelete()
{//删除用户模板   
    var mediaId = '${media.getMediaId()}';
    if(Z.V.isEmpty(mediaId))
    {
        Z.alert("请选择模板");
        return;
    }
    
    Z.confirm("你确定要删除该模板吗？", function(){
    
        var ajax = new Z.Ajax();
        ajax.setClassName("TemplatePresenter");
        ajax.setMethodName("doTemplateDelete");
        ajax.addParam("mediaId", mediaId);
         ajax.setFailureAlert();
        ajax.setSuccess(function(){
            parent.document.querySelectorAll('.z-red')[0].click();
            parent.Z.Dialog.close();
        });
        ajax.setLoading(document, true);
        ajax.execute();
    });
}

function doTemplateEdit()
{//编辑
    window.open("/zhiqimMediaEditor/mediaDesign.htm?isTemplateEdit=true&mediaId=" + '${media.getMediaId()}' + "&bleedSize=" + '${media.getBleedSize()}');
}

function doTemplateCopy()
{//复制
    var mediaId = '${media.getMediaId()}';
    
    var ajax = new Z.Ajax();
    ajax.setClassName("TemplatePresenter");
    ajax.setMethodName("doTemplateCopy");
    ajax.addParam("mediaId", mediaId);
    ajax.setFailureAlert();
    ajax.setSuccess(function(){
        Z.success("复制成功", function(){parent.Z.L.reload();});
    });
    ajax.setLoading(document, true);
    ajax.execute();
}

function doTemplateToSys()
{//申请系统模板
    var mediaId = '${media.getMediaId()}';
    
    var ajax = new Z.Ajax();
    ajax.setClassName("TemplatePresenter");
    ajax.setMethodName("doTemplateToSys");
    ajax.addParam("mediaId", mediaId);
    ajax.setFailureAlert();
    ajax.setSuccess(function(){
        Z.success("申请成功", function(){Z.L.reload();});
    });
    ajax.setLoading(document, true);
    ajax.execute();
}

function doTemplateToBest()
{//申请精品模板
    var mediaId = '${media.getMediaId()}';
    
    var ajax = new Z.Ajax();
    ajax.setClassName("TemplatePresenter");
    ajax.setMethodName("doTemplateToBest");
    ajax.addParam("mediaId", mediaId);
    ajax.setFailureAlert();
    ajax.setSuccess(function(){
        Z.success("申请成功", function(){Z.L.reload();});
    });
    ajax.setLoading(document, true);
    ajax.execute();
}

function doTemplateToMy()
{//发布模板
    var mediaId = '${media.getMediaId()}';
    
    var ajax = new Z.Ajax();
    ajax.setClassName("TemplatePresenter");
    ajax.setMethodName("doTemplateToMy");
    ajax.addParam("mediaId", mediaId);
    ajax.setFailureAlert();
    ajax.setSuccess(function(){
        Z.success("申请成功", function(){Z.L.reload();});
    });
    ajax.setLoading(document, true);
    ajax.execute();
}

function doTemplateCancel(type)
{//取消模板/精品
    var mediaId = '${media.getMediaId()}';
    
    var ajax = new Z.Ajax();
    ajax.setClassName("TemplatePresenter");
    ajax.setMethodName("doTemplateCancel");
    ajax.addParam("mediaId", '${media.getMediaId()}');
    ajax.addParam("type", type);
    ajax.setFailureAlert();
    ajax.setSuccess(function(){
        Z.success("取消", function(){Z.L.reload();});
    });
    ajax.setLoading(document, true);
    ajax.execute();
}

function doDownloadPdf(mediaId)
{//下载pdf
    var ajax = new Z.Ajax();
    ajax.setClassName("TemplatePresenter");
    ajax.setMethodName("doDownloadPdf");
    ajax.addParam("mediaId", mediaId);
    ajax.setFailureAlert();
    ajax.setSuccess(function()
    {
        var fileName = mediaId + ".pdf";   
        var element1 = document.createElement("a");
        element1.href = ajax.responseText;
        element1.setAttribute("download", fileName);
        element1.click();
    });
    ajax.setLoading(document);
    ajax.execute();
}

function doWorksUpload()
{
    var dialog = new Z.Dialog();
    dialog.shadow = true;
    dialog.title = "上传外部稿件";
    dialog.fixed = true;
    dialog.url = "externalDraftUpload.htm?mediaId="+${media.getMediaId()}+"&templatePage=${urlParam}";
    dialog.width = 800;
    dialog.height =300;
    dialog.execute();
}

function doWorksDownload(mediaId){
    var ajax = new Z.Ajax();
    ajax.setClassName("TemplatePresenter");
    ajax.setMethodName("checkWorksDownload");
    ajax.addParam("mediaId", mediaId);
    ajax.setFailureAlert();
    ajax.setSuccess(function()
    {
        var dialog = new Z.Dialog();
        dialog.shadow = true;
        dialog.title = "下载外部稿件";
        dialog.fixed = true;
        dialog.url = "externalDraftDownload.htm?mediaId="+mediaId;
        dialog.width = 800;
        dialog.height =500;
        dialog.execute();
    });
    ajax.setLoading(document);
    ajax.execute();   
}

function doFileDownload(filetype,url){
    if(filetype=='pdf'){
        var fileName = ${mediaId} + ".pdf";   
        var element1 = document.createElement("a");
        element1.href = url;
        element1.setAttribute("download", fileName);
        element1.click();
    }else{
        window.open(url);
        var ajax = new Z.Ajax();
	    ajax.setClassName("TemplatePresenter");
	    ajax.setMethodName("doTemplateDownload");
	    ajax.addParam("mediaId", ${mediaId});
	    ajax.setFailureAlert();
	    ajax.setSuccess();
	    ajax.execute();
    }
}
Z.onload(function()
{
  document.getElementById('share-list').style.display='none';
})
</script>
<style>
body,.mainbody{height:100%}
/*图片展示区*/
.show-thumb{left:0;top:0;bottom:0;right:300px;padding:30px;}
.show-thumb-list{align-items:center;align-content:center;justify-content:center;flex-wrap:wrap;overflow-y: auto;}<!--display:flex;-->
<#if media.getMediaUrl().indexOf(",")==-1>
.show-thumb-list>li{padding:5px;max-width:45%;}
<#else>
.show-thumb-list>li{padding:5px;}
 </#if>
/*信息列表区*/
.show-info{top:0;bottom:0;right:0;border-left:1px solid #e1e1e1;}
.show-info-list>li{font-size:14px;padding:15px 0;border-bottom:1px solid #f5f5f5;color:#777;}
/*顶部三要素*/
.show-info-list>li>span.tag{margin-right:28px;float:left;padding:15px 0;}
.show-info-list>li>span.tag:not(.view):hover,.show-info-list>li>span.tag.collect.active{color:#00a2eb;}
.show-info-list>li>span.tag>i{display:inline-block;width:17px;height:15px;vertical-align:middle;margin-right:5px;background:url(http://cdn.tubangzhu.com/static/tbz-main/images/preview-tag_8774a98.png) no-repeat;}
.show-info-list>li>span.tag.share>i{background-position:0 0;margin-right:3px;}
.show-info-list>li>span.tag.share:hover>i{background-position:0 -15px;}
.show-info-list>li>span.tag.view>i{background-position:-17px 0;}
.show-info-list>li>span.tag.view>i{background-position:-17px 0;}
.show-info-list>li>span.tag.collect>i{background-position:-35px 0;}
.show-info-list>li>span.tag.collect:hover>i,.show-info-list>li>span.tag.collect.active>i{background-position: -35px -15px;}
.show-info-list>li .z-button.z-xlarge{height:44px;}
/*分享列表*/
.share-list{position:absolute;top:45px;left:-5px;background:#fff;width:200px;line-height:35px;box-shadow:0 0 5px #aaa;border-radius:4px;padding:8px 15px;/*display:none;*/z-index:1;}
.share-list>span{position:absolute;width:10px;height:10px;background:#fff;-webkit-transform:rotate(45deg);-ms-transform:rotate(45deg);transform:rotate(45deg);top:-5px;left:30px;box-shadow:-1px -1px 0 #d4d2d2;}
/*标题图标*/
.list-title>i{background:url(http://cdn.tubangzhu.com/static/tbz-main/images/preview-tag_8774a98.png) no-repeat -187px 0;display:inline-block;width:10px;height:19px;vertical-align:middle;margin-right:5px;}
/*类型添加*/
.type-list{}
.type-list>li{padding:8px 0;border-bottom:1px dashed #f5f5f5;}
/*关键字选择区*/
.kwywords-list>.kwywordItem-list>span{display:inline-block;border-radius:3px;padding:5px 10px;margin:3px;position:relative;}
.kwywords-list>.kwywordItem-list>span>.z-error{display:none;position:absolute;right:-5px;top:-5px;border-radius:50%;margin:0;border:1px solid #777;width:15px;height:15px;line-height:14px;text-align:center;font-size:12px;background:#fff;z-index:9;cursor:pointer;}
.kwywords-list>.kwywordItem-list>span>.z-error:hover{color:#ea4a36;border-color:#ea4a36;}
.kwywords-list>.kwywordItem-list>span:hover .z-error{display:block;}
.kwywords-list>.item-add{position:relative;}
.kwywords-list>.item-add>input{width:100%;}
.kwywords-list>.item-add>button{padding:3px 10px;position:absolute;top:0;right:0;}
.fileDownload:hover{opacity: 0.8;}

/**/

</style>

<div class="z-relative z-w100p z-h100p z-overflow-x-hidden">
    <div class="show-thumb z-absolute">
        <ul class="show-thumb-list z-w100p z-h100p" style="text-align: center;">
            <#if media.getMediaUrl().indexOf(",")==-1>
                <li><img src="${media.getMediaUrl()}"/></li>
            <#else>
                <#for path : Arrays.toStringArray(media.getMediaUrl())>
                    <li>
                    <img style="width:400px;" src="${path}"/>
                    </li></br>
                </#for>
            </#if>
        </ul>
    </div>
    <div class="show-info z-absolute z-w300 z-pd15">
        <ul class="show-info-list z-relative z-h100p">
            <li class="zi-px15" style="color:#333;">
                <#if media.getTemplateStatus() == 1><button class="z-button z-gray z-mg-r12">审核中</button></#if>
                <#if media.getTemplateType() = 100 && media.getTemplateStatus() == 0><button class="z-button z-orange z-mg-r12" onclick="doTemplateToBest();">申请精品</button></#if>
                <#if media.getTemplateType() = 20  && media.getTemplateStatus() == 0><button class="z-button z-orange z-mg-r12" onclick="doTemplateToSys();">申请模板</button></#if>  
                <#if media.getTemplateType() = 10 && Validates.isEqual(media.getDesigner(), sessionUser.getOperatorCode())><button class="z-button z-purple" onclick="doTemplateToMy();">发布模板</button></#if>
                <#if ZmrPathRule.check(request, "/templateBestAudit.htm")>
                    <#if media.getTemplateType() = 100>
                    <button class="z-button z-red" onclick="doTemplateCancel(1);">取消模板</button>
                    <#elseif media.getTemplateType() = 110>
                    <button class="z-button z-red" onclick="doTemplateCancel(0);">取消精品</button>
                    </#if>
                </#if>
            </li>
            <#if media.getTemplateType()!=0 && media.getTemplateType()!=80>
                <#if Validates.isNotEmpty(fileTypeSet)>
                 <li class="z-clearfix">
                       	<p style="color: #333;font-size: 15px;margin-bottom: 10px;"><i class="z-font z-download"></i>模板下载（点击对应格式下载）</p>
                          <#for fileType : fileTypeSet>
                             <span class="fileDownload" style="background-color: #28a3ef;color: #FFF;border-radius: 5px;display: inline-block;font-size: 13px;width: 60px;height: 28px;text-align: center;line-height: 28px;cursor: pointer;" onclick="{Z(this).toggleClass('z-active');doFileDownload('${fileType}','${urlMap.get(fileType)}');}">${fileType.toUpperCase()}</span>
                         </#for>
                </li>
                </#if>
            </#if>
            <li class="z-clearfix z-relative z-color-999 zi-px13 zi-pd0">
                <span class="tag share z-pointer z-clearfix" onclick="shareList_show();">
                    <i></i>分享
                </span>
                <div id="share-list" class="share-list">
                    <span class="arr-top"></span>
                    <select class="z-select z-w150" id="shareOperator" data-role="z-select-search"  data-class="${zmr_color_class}">
                    	<option value="">请选择</option>
	                    <#for operator : oplist>
                            <option value="${operator.getOperatorCode()}">${operator.getOperatorCode()}</option>
	                    </#for>
		            </select>
		            <button class="z-button z-blue z-width-40" onclick="doTemplateShare();">确定</button>
		            <button class="z-button z-white z-width-40" onclick="shareList_hide();">取消</button>
                </div>
                <span class="tag view"><i></i>浏览(${browseNum})</span>
                <span class="tag collect z-pointer zi-mg-r0 <#if userEventId != 0>active</#if>" onclick="doTemplateCollect(this);"><i></i>收藏(<span id="collect" >${collectNum}</span>)</span>
            </li>
            <li class="z-clearfix" style="display: flex;align-items: center;">
            	<div style="display:inline-block;width:50%;">设计师：${media.getDesigner()} </div>
            	<div style="display:inline-block;color:red;"><img src="/zinc/images/fire.png" style="width: 16px;height: 16px;">热度：${score}</div>
            </li>
            <li class="z-clearfix">
                <div class="z-float-left z-w100p z-clearfix">
                    <!--<div class="z-float-left z-w50p z-pd5 z-pd-t3 z-pd-b3"><button class="z-button z-red zi-w100p" onclick="doTemplateDownload();"><i class="z-font z-download"></i>下载(${downNum})</button></div>-->
                    <#if Validates.isEmpty(media.getCreateChannel()) || "platform_design" == media.getCreateChannel()>
                   		<div class="z-float-left zi-w50p z-pd5 z-pd-t3 z-pd-b3"><button class="z-button z-blue zi-w100p" onclick="doTemplateCopy();"><i class="z-font z-text"></i>复制</button></div>
                    </#if>
                    <#if media.getTemplateType() != 80>
                    	<#if Validates.isEmpty(media.getCreateChannel()) || "platform_design" == media.getCreateChannel()>
	                        <#if Validates.isEqual(media.getDesigner(), sessionUser.getOperatorCode()) || ZmrPathRule.check(request, "/templateBestAudit.htm")>
	                            <div class="z-float-left zi-w50p z-pd5 z-pd-t3 z-pd-b3"><button class="z-button z-blue zi-w100p" onclick="doTemplateEdit();"><i class="z-font z-modify"></i>编辑</button></div>
	                        </#if>
                        </#if>
                        <#if ZmrPathRule.check(request, "/templateDelete.htm")><div class="z-float-left zi-w50p z-pd5 z-pd-t3 z-pd-b3"><button class="z-button z-red zi-w100p" onclick="doTemplateDelete();"><i class="z-font z-delete"></i>删除</button></div></#if>
                    </#if>
                    <#if urlParam == "SHARE">
                    	<div class="z-float-left zi-w50p z-pd5 z-pd-t3 z-pd-b3"><button class="z-button z-blue zi-w100p" onclick="doCancelShare();"><i class="z-font z-delete"></i>取消分享</button></div>
                    </#if>
                    <#if Validates.isEmpty(media.getCreateChannel()) || "out_draft" == media.getCreateChannel()>
	                    <#if media.getTemplateType()!=0 && media.getTemplateType()!=80>
	                    <div class="z-float-left zi-w50p z-pd5 z-pd-t3 z-pd-b3"><button class="z-button z-blue zi-w100p" onclick="doWorksUpload();"><i class="z-font z-add"></i>上传文件</button></div>
	                    </#if>
                    </#if>
                    <#if media.getTemplateType() == 80>
                    <div class="z-float-left zi-w50p z-pd5 z-pd-t3 z-pd-b3"><button class="z-button z-blue zi-w100p" onclick="doDownloadPdf('${media.getMediaId()}');">下载PDF</button></div>
                    </#if>
                </div>
            </li>
            <li class="tag-edit z-relative" data-value="一级 类型  二级 行业 三级 属性">
                <div class="z-h25 z-mg-t5 z-mg-b15">
                    <span class="z-float-right">
                        <#if ZmrPathRule.check(request, "/templateBestAudit.htm")>
                            <button class="z-button z-blue z-small" onclick="doTemplateLabel()"><i class="z-font z-modify"></i>修改</button>
                        <#elseif ZmrPathRule.check(request, "/templateAudit.htm") && media.getTemplateType() == 100>
                            <button class="z-button z-blue z-small" onclick="doTemplateLabel()"><i class="z-font z-modify"></i>修改</button>
                        <#else>
                            <#if media.getTemplateType() lt 100>
                            <button class="z-button z-blue z-small" onclick="doTemplateLabel()"><i class="z-font z-modify"></i>修改</button>
                            </#if>
                        </#if>
                    
                    </span>
                    <span class="list-title z-lh25"><i></i>行业属性</span>
                </div>
                <ul class="type-list">
                  <li>
                        ${DesignTypeDao.name(media.getTypeId())}&nbsp;
                        ${Global.get(DesignIndustryCache.class).getIndustryName(media.getIndustryId())}&nbsp;
                        <#for subsName : Arrays.toStringArray(media.getIndustrySubName())>
                            ${subsName}&nbsp;
                        </#for>
                        <#for attar : Arrays.toStringArray(media.getAttributeName())>
                            ${attar}&nbsp;
                        </#for>
                 </li>
                </ul>
            </li>
            <li class="keyword-edit">
                <div class="list-title z-mg-t5 z-mg-b15"><i></i>自定义标签</div>
                <div class="kwywords-list">
                    <div class="kwywordItem-list">
                    <#for keyword : DesignerPresenter.updateKeywordArr(media.getKeywordName(), "template", media.getMediaId())>
                        <span class="z-bg-blue"><i class="z-font z-error" onclick="delThisKeyword(this, '${keyword}');"></i>${keyword}</span>
                    </#for>
                    </div>
                    
                    <#if ZmrPathRule.check(request, "/templateBestAudit.htm")>
                        <div class="item-add z-w100p z-mg-t10"><input id="keywords" class="z-input z-small" type="text" onkeydown="addKeywords(event);">&nbsp;&nbsp;<button class="z-button z-small z-blue" onclick="addKeywords(event);">添加</button></div>
                    <#elseif ZmrPathRule.check(request, "/templateAudit.htm") && media.getTemplateType() == 100>
                        <div class="item-add z-w100p z-mg-t10"><input id="keywords" class="z-input z-small" type="text" onkeydown="addKeywords(event);">&nbsp;&nbsp;<button class="z-button z-small z-blue" onclick="addKeywords(event);">添加</button></div>
                    <#else>
                        <#if media.getTemplateType() lt 100>
                           <div class="item-add z-w100p z-mg-t10"><input id="keywords" class="z-input z-small" type="text" onkeydown="addKeywords(event);">&nbsp;&nbsp;<button class="z-button z-small z-blue" onclick="addKeywords(event);">添加</button></div>
                        </#if>
                    </#if>
                </div>
            </li>
            <li class="keyword-edit">
                 <div class="list-title z-mg-t5 z-mg-b15"><i></i>参数</div>
                 <ul class="type-list">
                 	<li>名称：${media.getMediaName()}</li>
                    <li>类型：${DesignTypeDao.name(media.getTypeId())}</li>
                    <#if media.getTypeId()==3>
                    <li>P 数：${media.getPageValue()}P</li>
                    <#else>
                    <li>面数：${media.getPageValue()}</li>
                    </#if>
                    <li>版式：<#if oddEven == 0>横版<#elseif oddEven == 1>竖版</#if></li>
                    <li>大小(px)：${media.getWidth()}X${media.getHeight()}</li>
                    <li>DPI：${media.getDpi()}</li>
                    <li>模板ID：${media.getMediaId()}</li>
                    <li>创建时间：${media.getCreateTime()}</li>
                    <li>更新时间：${media.getUpdateTime()}</li>
                 </ul>
            </li>
        </ul>
    </div>
</div>