Skip to content

任超 / js.portalStaticPage

Go to a project
Toggle navigation
Toggle navigation pinning
f80537cc by 任超
Options

style:图片上传

1 parent eeb38948
Inline Side-by-side
Showing 3 changed files with 89 additions and 81 deletions
......@@ -460,6 +460,12 @@ input[type='file'] {
display: none;
opacity: 0;
}
.mask1 {
display: block;
}
.mask1:hover {
opacity: 1;
}
.mask:hover {
opacity: 1;
}
......@@ -487,4 +493,19 @@ input[type='file'] {
text-align: center;
writing-mode:vertical-lr;
margin-left: 5px;
}
.folkObligee {
display: none;
}
.folkObligee ul li {
width: 30%;
display: inline-block;
margin-bottom: 10px;
font-size: 14px;
}
.folkObligee ul li p {
display: inline-block;
}
.folkObligee ul li span {
color: #9B9B9B;
}
\ No newline at end of file
......
......@@ -38,6 +38,24 @@ $(function () {
loadSqrDetail()
//读取邮寄信息
loadMailDetail();
// 在这里页面显示进行处理
console.log(99999, slsqxx)
if (slsqxx.sqrlb == '1' && slsqxx.sqfs == '2') {
$('.obtaining_license').hide();
$('#obligeeInformation').text('权利人信息');
$('.nextSubmitButton').append('<div class="next_button">' +
'<button type="button" lay-submit="" lay-filter="submit1" class="layui-btn layui-btn-normal">' +
'<a onclick="skipClick()">下一步</a>' +
'</button>' +
'</div>')
} else {
$('#obligeeInformation').text('义务人信息');
$('.nextSubmitButton').empty();
}
//
if (slsqxx.sqfs == '1') {
$('.folkObligee').show();
}
});
//读取受理信息
......@@ -222,90 +240,30 @@ function skipClick() {
}
}
// //加载材料信息
// function LoadClxxDiv() {
// let clxxDic = $("#clxx");
// let clxxContent;
// $.each(slsqxx.slclList, function (index, item) {
// clxxContent = '<div class="img_update">';
// clxxContent += '<div class="fileBox">';
// clxxContent += '<div class="fileSpan vm">';
// clxxContent += '<input type="file" multiple id="fileInput' + index + '" onchange="handleUpdate(this,' + index + ', ' + slsqxx.slclList[index].fs + ')"/>';
// clxxContent += '<div class="pictureUpload"></div>';
// clxxContent += '<div class="file_name">';
// if (slsqxx.slclList[index].fs == item.slclmxDetailList.length) {
// clxxContent += '<img class="update" src="../../staticImages/Yes.png">';
// } else {
// clxxContent += '<img class="update" src="../../staticImages/update.png">';
// clxxContent += '<p class="updatetext">点击文件上传</p>';
// }
// clxxContent += '</div>';
// clxxContent += '<ul class="fileListName" id="fileULName' + index + '">'
// $.each(item.slclmxDetailList, function (childIndex, childIitem) {
// clxxContent += '<li class="fileName">' + '<span title="' + childIitem.fileName + '">' + childIitem.fileName + '</span>' + '<img bsmSlclmx="' + childIitem.bsmSlclmx + '" class="operation" src="../../staticImages/chacha.png">' + '</li>'
// });
// clxxContent += '</ul>';
// clxxContent += '</div>';
// clxxContent += '<div class="certificate">' + slsqxx.slclList[index].clmc + '【' + slsqxx.slclList[index].wjlxmc + '】（' + slsqxx.slclList[index].fs + '份）</div>';
// clxxContent += '</div>';
// clxxContent += '</div>';
// clxxDic.append(clxxContent);
// });
// }
// function handleUpdate(e, index, sizeNum) {
// let name = e.files[0].name;
// let fileul = $("#fileULName" + index);
// if (fileul.find("li").length >= slsqxx.slclList[index].fs) {
// return false
// } else {
// _uploadSlcl(e.files[0], slsqxx.slclList[index].bsmCl, $("#fileULName" + index), sizeNum);
// fileul.append('<li class="fileName">' + '<span title="' + name + '">' + name + '</span>' + '<img class="operation" src="../../staticImages/chacha.png">' + '</li>');
// }
// }
// $(document).on("click", ".pictureUpload", function (e) {
// layer.msg('已经完成上传最大限度', { icon: 5 });
// })
// $(document).on("click", ".fileListName .fileName .operation", function (e) {
// var that = this
// $.ajax({
// type: "post", //提交方式
// url: portal.api_url + "/portal/FillInformation/deleteSlcl",//路径
// dataType: "json",
// data: {
// 'bsmSlclmx': $(that).attr('bsmSlclmx')
// },
// //数据，这里使用的是Json格式进行传输
// success: function (result) {//返回数据根据结果进行相应的处理
// if (result.code == 200) {
// $(that).parent().remove();
// layer.msg('删除成功！');
// } else {
// layer.msg('删除失败！');
// }
// }
// });
// });
//加载材料信息
function LoadClxxDiv() {
let clxxDic = $("#clxx");
let clxxContent;
$.each(slsqxx.slclList, function (index, item) {
clxxContent = '<div id="' + item.bsmCl + '" class="conImageUpdate">';
clxxContent += '<h5 class="imageUpdateTitle">' + slsqxx.slclList[index].clmc + '</h5>';
clxxContent += '<h5 class="imageUpdateTitle">' + item.clmc + '</h5>';
for (i = 0; i < item.fs; i++) {
clxxContent += '<div style="float: left;" class="itemImageUpdate">';
clxxContent += '<img class="pic" src="../../staticImages/update.png">';
if (item.slclmxDetailList.length > i) {
clxxContent += '<div style="float: left;" id="' + item.slclmxDetailList[i].bsmSlclmx + '" class="itemImageUpdate">';
clxxContent += '<img class="pic" src="' + item.slclmxDetailList[i].preViewUrl + '">';
clxxContent += '<div class="mask mask1"><p><img class="enlarge" src="../../staticImages/fangda.png"><img class="delete" src="../../staticImages/shanchu.png"></p></div>';
} else {
clxxContent += '<div style="float: left;" class="itemImageUpdate">';
clxxContent += '<img class="pic" src="../../staticImages/update.png">';
clxxContent += '<div class="mask"><p><img class="enlarge" src="../../staticImages/fangda.png"><img class="delete" src="../../staticImages/shanchu.png"></p></div>';
}
clxxContent += '<input name="file" accept="image/*" type="file" style="display: none" />';
clxxContent += '<div class="mask"><p><img class="enlarge" src="../../staticImages/fangda.png"> <img class="delete" src="../../staticImages/shanchu.png"></p></div>';
clxxContent += '<div class="certificate">';
clxxContent += '<span>' + slsqxx.slclList[index].clmc + '【' + slsqxx.slclList[index].wjlxmc + '】（' + slsqxx.slclList[index].fs + '-' + (i + 1) + '）</span>';
clxxContent += '</div>';
clxxContent += '</div>';
}
clxxContent += '</div>';
clxxDic.append(clxxContent);
});
......@@ -316,24 +274,23 @@ function LoadClxxDiv() {
function AddCLxxClick() {
//上传事件
$(".pic").click(function () {
$(this).next().click(); //隐藏了input:file样式后，点击头像就可以本地上传
$(this).next().on("change", function () {
$(this).next().next().click(); //隐藏了input:file样式后，点击头像就可以本地上传
$(this).next().next().on("change", function () {
var objUrl = getObjectURL(this.files[0]); //获取图片的路径，该路径不是图片在本地的路径
var file = this.files[0].type;
if (file=='') {
if (file == '') {
layer.msg('请上传，jpg,png,jpeg,gif格式文件');
return false;
}
if (objUrl) {
let imageData = UploadPicture(this.files[0], $(this).parent().parent().prop("id"));
console.log(999, imageData)
if (imageData.bsm_slclmx == "") {
if (imageData.bsmSlclmx == "") {
layer.msg('图片上传失败，请稍后上传！');
}
else {
layer.msg('图片上传成功');
$(this).prev().attr("src", imageData.preViewUrl);//将图片路径存入src中，显示出图片
$(this).parent().attr("id", imageData.bsm_slclmx);
$(this).prev().prev().attr("src", imageData.preViewUrl);//将图片路径存入src中，显示出图片
$(this).parent().attr("id", imageData.bsmSlclmx);
$(this).parent().find('.mask').show();
}
}
......@@ -378,7 +335,7 @@ function AddCLxxClick() {
$(document).on("click", ".enlarge", function (e) {
let src = $(this).parent().parent().siblings(".pic").attr('src')
console.log($(this).parent().parent().siblings(".pic").attr('src'))
var imgHtml = "<img style='width:1000px;height:600px' src='"+src+"' />";
var imgHtml = "<img style='width:1000px;height:600px' src='" + src + "' />";
layer.open({
type: 1,
title: false,
......
......@@ -161,7 +161,7 @@
</div>
<!-----------------权利人信息------------------ -->
<div class="person_info">
<h3>权利人信息</h3>
<h3 id="obligeeInformation">权利人信息</h3>
<div class="person_radio">
<input type="radio" class="radioInfo" name="1" value="1" checked>
<p>单独所有</p>
......@@ -195,11 +195,41 @@
<p>添加个人信息</p>
</div>
</div>
<!-- 单方申请权利人信息 -->
<div class="person_info folkObligee">
<h3>权利人信息</h3>
<ul>
<li>
<span>公司名称：</span>
<p>西安紫薇房产</p>
</li>
<li>
<span>统一社会信用代码：</span>
<p>789798789798</p>
</li>
<li>
<span>联系电话：</span>
<p>18740677380</p>
</li>
<li>
<span>法人信息：</span>
<p>任超</p>
</li>
<li>
<span>证件类型：</span>
<p>身份证</p>
</li>
<li>
<span>证件号码：</span>
<p>6101279879798798</p>
</li>
</ul>
</div>
<!-----------------资料上传------------------ -->
<div class="data_upload" id="clxx">
<h3>资料上传</h3>
</div>
<div class="nextSubmitButton"></div>
<!-- 领证方式 -->
<div class="obtaining_license">
<h3>领证方式</h3>
......