|
@@ -9,8 +9,52 @@
|
|
|
//$("#name").focus();
|
|
|
$("#inputForm").validate({
|
|
|
submitHandler: function(form){
|
|
|
- loading('正在提交,请稍等...');
|
|
|
- form.submit();
|
|
|
+ var agentFlag = $('input[name="agentFlag"]:checked').val();
|
|
|
+ var statementType = $('input[name="statementType"]:checked').val();
|
|
|
+ var files = $('#statementFile').prop('files');
|
|
|
+ var fileName = $('#uploadFileName').val();
|
|
|
+ // 当文件名不为空,但文件列表为空时,代表代理声明文件为原文件,不需要重新上传
|
|
|
+ var originFileFlag = (files.length == 0 && fileName != '');
|
|
|
+ if (agentFlag == 1 && statementType == 4 && !originFileFlag) {
|
|
|
+ // 有代理商且选择了文件代理声明,且不是原文件
|
|
|
+ if (files.length == '') {
|
|
|
+ alertx('请选择上传文件');
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ var brandAuthId = $("#id").val();
|
|
|
+ var data = new FormData();
|
|
|
+ data.append('brandAuthId', brandAuthId);
|
|
|
+ data.append('file', files[0]);
|
|
|
+ data.append('fileName', fileName);
|
|
|
+ $('.upload-loading').show();
|
|
|
+ //上传文件
|
|
|
+ $.ajax({
|
|
|
+ url: "${ctx}/zplm/cmBrandAuth/uploadFile",
|
|
|
+ data: data,
|
|
|
+ type: "POST",
|
|
|
+ processData: false,
|
|
|
+ contentType: false,
|
|
|
+ dataType: "json",
|
|
|
+ success: function (res) {
|
|
|
+ $('.upload-loading').hide();
|
|
|
+ if (res.success){
|
|
|
+ loading('正在提交,请稍等...');
|
|
|
+ $("#statementFileId").val(res.statementFile.id);
|
|
|
+ //上传成功,保存授权
|
|
|
+ form.submit();
|
|
|
+ }else {
|
|
|
+ alertx("文件上传失败");
|
|
|
+ }
|
|
|
+ },
|
|
|
+ error: function (json) {
|
|
|
+ $('.upload-loading').hide();
|
|
|
+ alertx("文件上传失败");
|
|
|
+ }
|
|
|
+ });
|
|
|
+ } else {
|
|
|
+ loading('正在提交,请稍等...');
|
|
|
+ form.submit();
|
|
|
+ }
|
|
|
},
|
|
|
errorContainer: "#messageBox",
|
|
|
errorPlacement: function(error, element) {
|
|
@@ -25,62 +69,138 @@
|
|
|
});
|
|
|
</script>
|
|
|
<style>
|
|
|
- .iconBox{
|
|
|
- font-size: 0;
|
|
|
- }
|
|
|
- .controls .conList{
|
|
|
- display: inline-block;
|
|
|
- margin-right: 15px;
|
|
|
- }
|
|
|
- .conList .btn:nth-of-type(1){
|
|
|
- margin-left: 25px;
|
|
|
- }
|
|
|
- .upload-content {
|
|
|
- margin-top: -70px;
|
|
|
- }
|
|
|
- .upload-content .conList .btn:nth-of-type(1) {
|
|
|
- width: 90px;
|
|
|
- height: 100px;
|
|
|
- border: 2px solid #eee;
|
|
|
- background: #fff;
|
|
|
- position: relative;
|
|
|
- }
|
|
|
- .upload-content .conList .btn:nth-of-type(1)>div {
|
|
|
- position: absolute;
|
|
|
- top: 50%;
|
|
|
- left: 50%;
|
|
|
- transform: translate(-50%, -50%);
|
|
|
- color: #666;
|
|
|
- }
|
|
|
- .upload-content .conList .btn:nth-of-type(1) span {
|
|
|
- font-size: 35px;
|
|
|
- }
|
|
|
- .upload-content .conList .btn:nth-of-type(1) h5 {
|
|
|
- color: #666;
|
|
|
- }
|
|
|
- .cancel-upload {
|
|
|
- background: transparent;
|
|
|
- border: none;
|
|
|
- box-shadow: none;
|
|
|
- position: relative;
|
|
|
- top: -38px;
|
|
|
- left: -25px;
|
|
|
- cursor: pointer;
|
|
|
- z-index: 100;
|
|
|
- }
|
|
|
- .upload-content .conList ol li {
|
|
|
- width: 114px;
|
|
|
- min-height: 80px;
|
|
|
- text-align: center;
|
|
|
- background: #fff;
|
|
|
- position: relative;
|
|
|
- top: 120px;
|
|
|
- margin-left: 2px;
|
|
|
- }
|
|
|
- .hide-pic {
|
|
|
- display: none !important;
|
|
|
- }
|
|
|
+ .iconBox{
|
|
|
+ font-size: 0;
|
|
|
+ }
|
|
|
+ .controls .conList{
|
|
|
+ display: inline-block;
|
|
|
+ margin-right: 15px;
|
|
|
+ }
|
|
|
+ .conList .btn:nth-of-type(1){
|
|
|
+ margin-left: 25px;
|
|
|
+ }
|
|
|
+ .select2-choice{
|
|
|
+ width: 100px;
|
|
|
+ }
|
|
|
+ .upload-content {
|
|
|
+ margin-top: -70px;
|
|
|
+ }
|
|
|
+ .upload-content .conList .btn:nth-of-type(1) {
|
|
|
+ width: 90px;
|
|
|
+ height: 100px;
|
|
|
+ border: 2px solid #eee;
|
|
|
+ background: #fff;
|
|
|
+ position: relative;
|
|
|
+ }
|
|
|
+ .upload-content .conList .btn:nth-of-type(1)>div {
|
|
|
+ position: absolute;
|
|
|
+ top: 50%;
|
|
|
+ left: 50%;
|
|
|
+ transform: translate(-50%, -50%);
|
|
|
+ color: #666;
|
|
|
+ }
|
|
|
+ .upload-content .conList .btn:nth-of-type(1) span {
|
|
|
+ font-size: 35px;
|
|
|
+ }
|
|
|
+ .upload-content .conList .btn:nth-of-type(1) h5 {
|
|
|
+ color: #666;
|
|
|
+ }
|
|
|
+ .cancel-upload {
|
|
|
+ background: transparent;
|
|
|
+ border: none;
|
|
|
+ box-shadow: none;
|
|
|
+ position: relative;
|
|
|
+ top: -38px;
|
|
|
+ left: -25px;
|
|
|
+ cursor: pointer;
|
|
|
+ z-index: 100;
|
|
|
+ }
|
|
|
+ .upload-content .conList ol li {
|
|
|
+ width: 114px;
|
|
|
+ min-height: 80px;
|
|
|
+ text-align: center;
|
|
|
+ background: #fff;
|
|
|
+ position: relative;
|
|
|
+ top: 120px;
|
|
|
+ margin-left: 2px;
|
|
|
+ }
|
|
|
+ .hide-pic {
|
|
|
+ display: none !important;
|
|
|
+ }
|
|
|
+
|
|
|
+ .upload {
|
|
|
+ position: relative;
|
|
|
+ display: inline-block;
|
|
|
+ background: #D0EEFF;
|
|
|
+ border: 1px solid #99D3F5;
|
|
|
+ border-radius: 4px;
|
|
|
+ padding: 4px 12px;
|
|
|
+ color: #1E88C7;
|
|
|
+ text-decoration: none;
|
|
|
+ text-indent: 0;
|
|
|
+ line-height: 20px;
|
|
|
+ margin-left: 20px;
|
|
|
+ cursor: pointer;
|
|
|
+ width: 52px;
|
|
|
+ height: 20px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .upload input {
|
|
|
+ position: absolute;
|
|
|
+ width: 170px;
|
|
|
+ font-size: 20px;
|
|
|
+ right: 0;
|
|
|
+ top: 0;
|
|
|
+ opacity: 0;
|
|
|
+ cursor: pointer;
|
|
|
+ }
|
|
|
+
|
|
|
+ .upload:hover {
|
|
|
+ background: #AADFFD;
|
|
|
+ border-color: #78C3F3;
|
|
|
+ color: #004974;
|
|
|
+ text-decoration: none;
|
|
|
+ }
|
|
|
+
|
|
|
+ #file-list-display {
|
|
|
+ width: 600px;
|
|
|
+ height: auto;
|
|
|
+ float: left;
|
|
|
+ margin-left: 20px;
|
|
|
+ }
|
|
|
+
|
|
|
+ #file-list-display p {
|
|
|
+ line-height: 30px;
|
|
|
+ font-size: 14px;
|
|
|
+ color: #333333;
|
|
|
+ margin: 0;
|
|
|
+ }
|
|
|
+
|
|
|
+ #file-list-display p .del {
|
|
|
+ color: #2fa4e7;
|
|
|
+ font-size: 12px;
|
|
|
+ cursor: pointer;
|
|
|
+ margin-left: 20px;
|
|
|
+ }
|
|
|
|
|
|
+ #addSubmit {
|
|
|
+ margin-left: 20px;
|
|
|
+ }
|
|
|
+ #uploadFileName{
|
|
|
+ float: left;
|
|
|
+ }
|
|
|
+ .upload-loading{
|
|
|
+ width: 32px;
|
|
|
+ height: 32px;
|
|
|
+ float: left;
|
|
|
+ margin-left: 10px;
|
|
|
+ }
|
|
|
+ .upload-loading img{
|
|
|
+ width: 16px;
|
|
|
+ height: 16px;
|
|
|
+ display: block;
|
|
|
+ margin: 8px auto 0;
|
|
|
+ }
|
|
|
</style>
|
|
|
</head>
|
|
|
<body>
|
|
@@ -90,7 +210,8 @@
|
|
|
</ul><br/>
|
|
|
<form:form id="inputForm" modelAttribute="cmBrandAuth" action="${ctx}/zplm/cmBrandAuth/save" method="post" class="form-horizontal">
|
|
|
<form:hidden path="id"/>
|
|
|
- <sys:message content="${message}"/>
|
|
|
+ <form:hidden path="statementFileId"/>
|
|
|
+ <sys:message content="${message}"/>
|
|
|
<div class="control-group">
|
|
|
<label class="control-label"><span class="help-inline"><font color="red">*</font> </span>品牌:</label>
|
|
|
<div class="controls">
|
|
@@ -143,9 +264,11 @@
|
|
|
</div>
|
|
|
<div class="control-group">
|
|
|
<label class="control-label">代理声明:</label>
|
|
|
- <div class="controls">
|
|
|
+ <div class="controls" style="position: relative">
|
|
|
<input type="radio" name="statementType" value="1" onclick="changeStatementType()" ${cmBrandAuth.statementType eq null?"checked":cmBrandAuth.statementType eq 1?"checked":""}/>弹窗
|
|
|
<input type="radio" name="statementType" value="2" onclick="changeStatementType()" ${cmBrandAuth.statementType eq 2?"checked":""} />链接
|
|
|
+ <input type="radio" name="statementType" value="3" onclick="changeStatementType()" ${cmBrandAuth.statementType eq 3?"checked":""} />图片
|
|
|
+ <input type="radio" name="statementType" value="4" onclick="changeStatementType()" ${cmBrandAuth.statementType eq 4?"checked":""} />文件
|
|
|
</div>
|
|
|
</div>
|
|
|
<div class="control-group" id="statementContentDiv">
|
|
@@ -160,6 +283,30 @@
|
|
|
<form:input path="statementLink" htmlEscape="false" maxlength="255" class="input-xlarge required"/>
|
|
|
</div>
|
|
|
</div>
|
|
|
+ <div class="control-group iconBox" id="statementImageDiv">
|
|
|
+ <label class="control-label"><span class="help-inline"><font color="red">*</font> </span>图片:</label>
|
|
|
+ <div class="controls upload-content" id="statementImageBox">
|
|
|
+ <div class="conList">
|
|
|
+ <form:hidden id="statementImage" path="statementImage" htmlEscape="false" maxlength="255" class="input-xlarge required"/>
|
|
|
+ <sys:ckfinder input="statementImage" type="images" uploadPath="/photo" selectMultiple="false" maxWidth="100"
|
|
|
+ maxHeight="100"/>
|
|
|
+ <br>
|
|
|
+ <label style="margin-left: 150px">建议图片分辨率542px*542px</label>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="control-group" id="statementFileDiv">
|
|
|
+ <label class="control-label"><span class="help-inline"><font color="red">*</font> </span>文件路径:</label>
|
|
|
+ <div class="controls">
|
|
|
+ <form:input path="statementFile.name" id="uploadFileName" placeholder="支持pdf、word、ppt" disabled="true" class="input-xlarge required" />
|
|
|
+ <div class="upload">
|
|
|
+ <input type="file" name="file" id="statementFile" accept=".pdf,.doc,.ppt">选择文件
|
|
|
+ </div>
|
|
|
+ <div class="upload-loading" hidden>
|
|
|
+ <img alt="gif" src="/static/images/upload.gif" width="32px" border="none">
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
</div>
|
|
|
|
|
|
<div class="control-group">
|
|
@@ -175,10 +322,19 @@
|
|
|
</form:form>
|
|
|
<script type = text/javascript>
|
|
|
$(function () {
|
|
|
+ var files = document.getElementById("statementFile");
|
|
|
+ // var fileListDisplay = document.getElementById('file-list-display'), sendFile;
|
|
|
+ files.addEventListener("change", function (event) {
|
|
|
+ var name = event.target.files[0].name;
|
|
|
+ console.log(name)
|
|
|
+ $('#uploadFileName').val(name);
|
|
|
+ });
|
|
|
+
|
|
|
$('.upload-content .conList .btn:nth-of-type(1)').html('<div><span>+</span><h5>选择图片</h5></div>');
|
|
|
$('.upload-content .conList .btn:nth-of-type(2)').after('<img class="cancel-upload" src="/static/images/close-btn1.png">').remove();
|
|
|
$('.upload-content .conList').find('.cancel-upload').hide();
|
|
|
var observeEle = document.getElementsByClassName('upload-content')[0];
|
|
|
+ var observeEle1 = document.getElementsByClassName('upload-content')[1];
|
|
|
var MutationObserver = window.MutationObserver || window.WebKitMutationObserver;
|
|
|
var MutationObserverConfig = {
|
|
|
childList: true,
|
|
@@ -201,6 +357,7 @@
|
|
|
})
|
|
|
});
|
|
|
observer.observe(observeEle, MutationObserverConfig);
|
|
|
+ observer.observe(observeEle1, MutationObserverConfig);
|
|
|
|
|
|
$('body').on('click', '.cancel-upload', function () {
|
|
|
var wrapper = $(this).closest('.conList');
|
|
@@ -227,6 +384,13 @@
|
|
|
$(ele).parents(".conList").next().removeClass("hide-pic")
|
|
|
}
|
|
|
})
|
|
|
+ $("#statementImageBox").find("input.input-xlarge").each(function (i, ele) {
|
|
|
+ if ($(ele).val()) {
|
|
|
+ $(ele).next().find("li").css("z-index", "99");
|
|
|
+ $(ele).parents(".conList").find(".cancel-upload").show();
|
|
|
+ $(ele).parents(".conList").next().removeClass("hide-pic")
|
|
|
+ }
|
|
|
+ })
|
|
|
}, 200);
|
|
|
});
|
|
|
});
|
|
@@ -255,12 +419,26 @@
|
|
|
if (statementType == 1) {
|
|
|
$("#statementContentDiv").show();
|
|
|
$("#statementLinkDiv").hide();
|
|
|
- } else {
|
|
|
+ $("#statementImageDiv").hide();
|
|
|
+ $("#statementFileDiv").hide();
|
|
|
+ } else if (statementType == 2) {
|
|
|
$("#statementContentDiv").hide();
|
|
|
$("#statementLinkDiv").show();
|
|
|
+ $("#statementImageDiv").hide();
|
|
|
+ $("#statementFileDiv").hide();
|
|
|
+ } else if (statementType == 3) {
|
|
|
+ $("#statementContentDiv").hide();
|
|
|
+ $("#statementLinkDiv").hide();
|
|
|
+ $("#statementImageDiv").show();
|
|
|
+ $("#statementFileDiv").hide();
|
|
|
+ } else if (statementType == 4) {
|
|
|
+ $("#statementContentDiv").hide();
|
|
|
+ $("#statementLinkDiv").hide();
|
|
|
+ $("#statementImageDiv").hide();
|
|
|
+ $("#statementFileDiv").show();
|
|
|
}
|
|
|
}
|
|
|
-
|
|
|
+
|
|
|
//修改品牌,品牌logo跟着修改
|
|
|
function changeBrand() {
|
|
|
var brandId = $("#brandId").val();
|