本地生活新增表单填写项

This commit is contained in:
wangxiaowei 2024-11-19 15:11:01 +08:00
parent db47d28936
commit 8edd900115

@ -9,145 +9,257 @@
<div class="layui-card layui-form">
<div class="layui-tab-item layui-show">
<div class="layui-form-item" id="one-shop">
<label class="layui-form-label"><span style="color:red;">*</span>用户:</label>
<div class="layui-input-inline" style="display: flex">
<div id="sel_user_id"></div>
<input type="hidden" id="user_id" name="user_id">
<a class="layui-btn layui-btn-normal select-goods">绑定用户</a>
</div>
</div>
<div class="layui-collapse" style="margin-bottom: 20px;">
<div class="layui-colla-item">
<h2 class="layui-colla-title">表单填写</h2>
<div class="layui-form-item">
<label class="layui-form-label"><span style="color:red;">*</span>商家名称:</label>
<div class="layui-input-inline">
<input type="text" name="shopName" id="shopName" autocomplete="off" class="layui-input">
</div>
</div>
<div class="layui-colla-content layui-show">
<div class="layui-form-item" id="one-shop">
<label class="layui-form-label"><span style="color:red;">*</span>用户:</label>
<div class="layui-input-inline" style="display: flex">
<div id="sel_user_id"></div>
<input type="hidden" id="user_id" name="user_id">
<a class="layui-btn layui-btn-normal select-goods">绑定用户</a>
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">商家Logo:</label>
<div class="layui-input-block">
<div class="like-upload-image">
<div class="upload-image-elem"><a id="add-shop" class="add-upload-video" data-type="shop_logo"> + 添加图片</a></div>
<input type="hidden" name="shopLogo" >
<div class="layui-form-item">
<label class="layui-form-label"><span style="color:red;">*</span>商家名称:</label>
<div class="layui-input-inline">
<input type="text" name="shopName" id="shopName" autocomplete="off" class="layui-input">
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label"><span style="color:red;">*</span>账户类型:</label>
<div class="layui-input-inline">
<select id="bankType" name="bankType" class="layui-select" lay-filter="bankType">
<option value="1">对公银行账户</option>
<option value="2">对私银行账户</option>
</select>
</div>
</div>
<div id="largeNumberBlock" class="layui-form-item">
<label class="layui-form-label"><span style="color:red;">*</span>大额行号:</label>
<div class="layui-input-inline">
<input type="text" name="largeNumber" id="largeNumber" lay-verType="tips" lay-verify="crftNo1"
switch-tab="0" autocomplete="off" class="layui-input">
</div>
</div>
<div id="bank_user_name_block" class="layui-form-item">
<label class="layui-form-label"><span style="color:red;">*</span> 户名:</label>
<div class="layui-input-inline">
<input type="text" name="bank_user_name" id="bank_user_name" autocomplete="off" class="layui-input">
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label"><span style="color:red;">*</span>银行名称:</label>
<div class="layui-input-inline">
<input type="text" name="bankName" id="bankName" autocomplete="off" class="layui-input">
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label"><span style="color:red;">*</span>银行卡号:</label>
<div class="layui-input-inline">
<input type="text" name="bankCard" id="bankCard" autocomplete="off" class="layui-input">
</div>
</div>
<div class="layui-form-item">
<label for="name" class="layui-form-label"><span style="color:red;">*</span>商户联系人:</label>
<div class="layui-input-inline">
<input type="text" name="name" id="name" autocomplete="off" class="layui-input">
</div>
</div>
<div class="layui-form-item">
<label for="empowerPhone" class="layui-form-label"><span style="color:red;">*</span>联系电话:</label>
<div class="layui-input-inline">
<input type="text" name="empowerPhone" id="empowerPhone" autocomplete="off" class="layui-input">
</div>
</div>
<div class="layui-form-item">
<label for="crftNo1" class="layui-form-label">营业执照有效期开始日期(无营业执照可不填):</label>
<div class="layui-input-inline">
<input type="text" name="business-license-start" id="business-license-start" autocomplete="off" class="layui-input">
</div>
</div>
<div class="layui-form-item">
<label for="crftNo1" class="layui-form-label">营业执照有效期结束日期(无营业执照可不填):</label>
<div class="layui-input-inline">
<input type="text" name="business-license-end" id="business-license-end" autocomplete="off" class="layui-input">
</div>
</div>
<div class="layui-form-item">
<label for="crftNo1" class="layui-form-label">邮箱:</label>
<div class="layui-input-inline">
<input type="text" name="email" id="email" autocomplete="off" class="layui-input">
</div>
</div>
<div class="layui-form-item">
<label for="crftNo1" class="layui-form-label">社会信用代码:</label>
<div class="layui-input-inline">
<input type="text" name="crftNo1" id="crftNo1" autocomplete="off" class="layui-input">
</div>
</div>
<div class="layui-form-item">
<label for="sort" class="layui-form-label">排序:</label>
<div class="layui-input-inline">
<input type="text" name="sort" id="sort" autocomplete="off" class="layui-input">
</div>
<div class="layui-form-mid layui-word-aux">数字越大越靠前</div>
</div>
</div>
<div class="layui-form-mid layui-word-aux">建议尺寸:宽200像素*高200像素的jpg,jpeg,png图片</div>
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label"><span style="color:red;">*</span>账户类型:</label>
<div class="layui-input-inline">
<select id="bankType" name="bankType" class="layui-select" lay-filter="bankType">
<option value="1">对公银行账户</option>
<option value="2">对私银行账户</option>
</select>
</div>
</div>
<div class="layui-colla-item">
<h2 class="layui-colla-title">文件上传</h2>
<div id="largeNumberBlock" class="layui-form-item">
<label class="layui-form-label"><span style="color:red;">*</span>大额行号:</label>
<div class="layui-input-inline">
<input type="text" name="largeNumber" id="largeNumber" lay-verType="tips" lay-verify="crftNo1"
switch-tab="0" autocomplete="off" class="layui-input">
</div>
</div>
<div class="layui-colla-content layui-show">
<div class="layui-form-item">
<label class="layui-form-label"><span style="color:red;">*</span>自拍照:</label>
<div class="layui-input-block">
<div class="like-upload-image">
<div class="upload-image-elem"><a id="self-photo" class="add-upload-video" data-type="self_photo"> + 添加图片</a></div>
<input type="hidden" name="selfPhoto">
</div>
<div class="layui-form-mid layui-word-aux">建议尺寸:宽200像素*高200像素的jpg,jpeg,png图片</div>
</div>
</div>
<div id="bank_user_name_block" class="layui-form-item">
<label class="layui-form-label"><span style="color:red;">*</span> 户名:</label>
<div class="layui-input-inline">
<input type="text" name="bank_user_name" id="bank_user_name" autocomplete="off" class="layui-input">
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label"><span style="color:red;">*</span>身份证正面:</label>
<div class="layui-input-block">
<div class="like-upload-image">
<div class="upload-image-elem"><a id="id-front" class="add-upload-video" data-type="id_card"> + 添加图片</a></div>
<input type="hidden" name="idFront">
</div>
<div class="layui-form-mid layui-word-aux">建议尺寸:宽200像素*高200像素的jpg,jpeg,png图片</div>
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label"><span style="color:red;">*</span>银行名称:</label>
<div class="layui-input-inline">
<input type="text" name="bankName" id="bankName" autocomplete="off" class="layui-input">
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label"><span style="color:red;">*</span>身份证背面:</label>
<div class="layui-input-block">
<div class="like-upload-image">
<div class="upload-image-elem"><a id="id-back" class="add-upload-video" data-type="id_card"> + 添加图片</a></div>
<input type="hidden" name="idBack">
</div>
<div class="layui-form-mid layui-word-aux">建议尺寸:宽200像素*高200像素的jpg,jpeg,png图片</div>
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label"><span style="color:red;">*</span>银行卡号:</label>
<div class="layui-input-inline">
<input type="text" name="bankCard" id="bankCard" autocomplete="off" class="layui-input">
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">商家Logo:</label>
<div class="layui-input-block">
<div class="like-upload-image">
<div class="upload-image-elem"><a id="add-shop" class="add-upload-video" data-type="shop_logo"> + 添加图片</a></div>
<input type="hidden" name="shopLogo" >
</div>
<div class="layui-form-mid layui-word-aux">建议尺寸:宽200像素*高200像素的jpg,jpeg,png图片</div>
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">营业执照:</label>
<div class="layui-input-block">
<div class="like-upload-image">
<div class="upload-image-elem"><a id="business-license" class="add-upload-video" data-type="bussines_license"> + 添加图片</a></div>
<input type="hidden" name="businessLicense">
<div class="layui-form-item">
<label class="layui-form-label">营业执照:</label>
<div class="layui-input-block">
<div class="like-upload-image">
<div class="upload-image-elem"><a id="business-license" class="add-upload-video" data-type="bussines_license"> + 添加图片</a></div>
<input type="hidden" name="businessLicense">
</div>
<div class="layui-form-mid layui-word-aux">建议尺寸:宽200像素*高200像素的jpg,jpeg,png图片</div>
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">开户许可证:</label>
<div class="layui-input-block">
<div class="like-upload-image">
<div class="upload-image-elem"><a id="open-account" class="add-upload-video" data-type="open_account"> + 添加图片</a></div>
<input type="hidden" name="openAccount">
</div>
<div class="layui-form-mid layui-word-aux">建议尺寸:宽200像素*高200像素的jpg,jpeg,png图片</div>
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">银行卡正面:</label>
<div class="layui-input-block">
<div class="like-upload-image">
<div class="upload-image-elem"><a id="front-bank-card" class="add-upload-video" data-type="front_bank_card"> + 添加图片</a></div>
<input type="hidden" name="frontBankCard">
</div>
<div class="layui-form-mid layui-word-aux">建议尺寸:宽200像素*高200像素的jpg,jpeg,png图片</div>
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">银行卡反面:</label>
<div class="layui-input-block">
<div class="like-upload-image">
<div class="upload-image-elem"><a id="back-bank-card" class="add-upload-video" data-type="back_bank_card"> + 添加图片</a></div>
<input type="hidden" name="backBankCard">
</div>
<div class="layui-form-mid layui-word-aux">建议尺寸:宽200像素*高200像素的jpg,jpeg,png图片</div>
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">非法人对私身份证正面照:</label>
<div class="layui-input-block">
<div class="like-upload-image">
<div class="upload-image-elem"><a id="front-unincorporate" class="add-upload-video" data-type="front_unincorporate"> + 添加图片</a></div>
<input type="hidden" name="frontUnincorporate">
</div>
<div class="layui-form-mid layui-word-aux">建议尺寸:宽200像素*高200像素的jpg,jpeg,png图片</div>
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">非法人对私身份证反面照:</label>
<div class="layui-input-block">
<div class="like-upload-image">
<div class="upload-image-elem"><a id="back-unincorporate" class="add-upload-video" data-type="back_unincorporate"> + 添加图片</a></div>
<input type="hidden" name="backUnincorporate">
</div>
<div class="layui-form-mid layui-word-aux">建议尺寸:宽200像素*高200像素的jpg,jpeg,png图片</div>
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">非法人授权结算书合影照片:</label>
<div class="layui-input-block">
<div class="like-upload-image">
<div class="upload-image-elem"><a id="unincorporate-group" class="add-upload-video" data-type="unincorporate_group"> + 添加图片</a></div>
<input type="hidden" name="unincorporateGroup">
</div>
<div class="layui-form-mid layui-word-aux">建议尺寸:宽200像素*高200像素的jpg,jpeg,png图片</div>
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">非法人对私上传的授权书(无营业执照可不填):</label>
<div class="layui-input-block">
<div class="like-upload-image">
<div class="upload-image-elem"><a id="unincorporate-authorize" class="add-upload-video" data-type="unincorporate_authorize"> + 添加图片</a></div>
<input type="hidden" name="unincorporateAuthorize">
</div>
<div class="layui-form-mid layui-word-aux">建议尺寸:宽200像素*高200像素的jpg,jpeg,png图片</div>
</div>
</div>
</div>
<div class="layui-form-mid layui-word-aux">建议尺寸:宽200像素*高200像素的jpg,jpeg,png图片</div>
</div>
</div>
<div class="layui-form-item">
<label for="crftNo1" class="layui-form-label">社会信用代码:</label>
<div class="layui-input-inline">
<input type="text" name="crftNo1" id="crftNo1" autocomplete="off" class="layui-input">
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label"><span style="color:red;">*</span>自拍照:</label>
<div class="layui-input-block">
<div class="like-upload-image">
<div class="upload-image-elem"><a id="self-photo" class="add-upload-video" data-type="self_photo"> + 添加图片</a></div>
<input type="hidden" name="selfPhoto">
</div>
<div class="layui-form-mid layui-word-aux">建议尺寸:宽200像素*高200像素的jpg,jpeg,png图片</div>
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label"><span style="color:red;">*</span>身份证正面:</label>
<div class="layui-input-block">
<div class="like-upload-image">
<div class="upload-image-elem"><a id="id-front" class="add-upload-video" data-type="id_card"> + 添加图片</a></div>
<input type="hidden" name="idFront">
</div>
<div class="layui-form-mid layui-word-aux">建议尺寸:宽200像素*高200像素的jpg,jpeg,png图片</div>
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label"><span style="color:red;">*</span>身份证背面:</label>
<div class="layui-input-block">
<div class="like-upload-image">
<div class="upload-image-elem"><a id="id-back" class="add-upload-video" data-type="id_card"> + 添加图片</a></div>
<input type="hidden" name="idBack">
</div>
<div class="layui-form-mid layui-word-aux">建议尺寸:宽200像素*高200像素的jpg,jpeg,png图片</div>
</div>
</div>
<div class="layui-form-item">
<label for="name" class="layui-form-label"><span style="color:red;">*</span>商户联系人:</label>
<div class="layui-input-inline">
<input type="text" name="name" id="name" autocomplete="off" class="layui-input">
</div>
</div>
<div class="layui-form-item">
<label for="empowerPhone" class="layui-form-label"><span style="color:red;">*</span>联系电话:</label>
<div class="layui-input-inline">
<input type="text" name="empowerPhone" id="empowerPhone" autocomplete="off" class="layui-input">
</div>
</div>
<div class="layui-form-item">
<label for="sort" class="layui-form-label">排序:</label>
<div class="layui-input-inline">
<input type="text" name="sort" id="sort" autocomplete="off" class="layui-input">
</div>
<div class="layui-form-mid layui-word-aux">数字越大越靠前</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">商家地址:</label>
<div class="layui-input-block">
@ -169,6 +281,7 @@
</div>
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">地理位置:</label>
<div class="layui-input-block">
@ -186,6 +299,7 @@
</div>
</div>
</div>
<div id="container" style="position: relative;z-index: 500;"></div>
</div>
<div class="layui-form-item layui-hide">
@ -219,7 +333,8 @@
}
});
laydate.render({type:"datetime", elem:"#expire_time", trigger:"click",min:0});
laydate.render({type:"date", elem:"#business-license-start", trigger:"click",min:0});
laydate.render({type:"date", elem:"#business-license-end", trigger:"click",min:0});
like.delUpload();
$(document).on("click", ".add-upload-image", function () {
@ -346,6 +461,35 @@
}
});
// 上传身份证正面
var uploadInst = likeupload.render({
elem: '#id-front' //绑定元素
,url: "{:url('shop.LocalStore/uploadImage')}" //上传接口
,accept: 'images'
,data: {type: 'id_card'}
,exts: "jpg|png|jpeg"
,before: function(obj){ //obj参数包含的信息,跟 choose回调完全一致,可参见上文。
layer.load(); //上传loading
}
,done: function(res, index, upload){
if (res.code === 1) {
var template = '<div class="upload-image-div">';
template += '<img src="'+ res.data.file +'" alt="img">';
template += '<div class="del-upload-btn">x</div>';
$("#id-front").parent().before(template)
$("input[name='idFront']").val(res.data.file)
} else {
layer.msg('上传错误');
return false;
}
layer.closeAll('loading'); //关闭loading
}
,error: function(index, upload){
layer.closeAll('loading'); //关闭loading
}
});
// 上传身份证反面
var uploadInst = likeupload.render({
elem: '#id-back' //绑定元素
@ -375,6 +519,209 @@
}
});
// 开户许可证
var uploadInst = likeupload.render({
elem: '#open-account' //绑定元素
,url: "{:url('shop.LocalStore/uploadImage')}" //上传接口
,accept: 'images'
,data: {type: 'open_account'}
,exts: "jpg|png|jpeg"
,before: function(obj){ //obj参数包含的信息,跟 choose回调完全一致,可参见上文。
layer.load(); //上传loading
}
,done: function(res, index, upload){
if (res.code === 1) {
var template = '<div class="upload-image-div">';
template += '<img src="'+ res.data.file +'" alt="img">';
template += '<div class="del-upload-btn">x</div>';
$("#open-account").parent().before(template)
$("input[name='openAccount']").val(res.data.file)
} else {
layer.msg('上传错误');
return false;
}
layer.closeAll('loading'); //关闭loading
}
,error: function(index, upload){
layer.closeAll('loading'); //关闭loading
}
});
// 银行卡正面
var uploadInst = likeupload.render({
elem: '#front-bank-card' //绑定元素
,url: "{:url('shop.LocalStore/uploadImage')}" //上传接口
,accept: 'images'
,data: {type: 'front_bank_card'}
,exts: "jpg|png|jpeg"
,before: function(obj){ //obj参数包含的信息,跟 choose回调完全一致,可参见上文。
layer.load(); //上传loading
}
,done: function(res, index, upload){
if (res.code === 1) {
var template = '<div class="upload-image-div">';
template += '<img src="'+ res.data.file +'" alt="img">';
template += '<div class="del-upload-btn">x</div>';
$("#front-bank-card").parent().before(template)
$("input[name='frontBankCard']").val(res.data.file)
} else {
layer.msg('上传错误');
return false;
}
layer.closeAll('loading'); //关闭loading
}
,error: function(index, upload){
layer.closeAll('loading'); //关闭loading
}
});
// 银行卡反面
var uploadInst = likeupload.render({
elem: '#back-bank-card' //绑定元素
,url: "{:url('shop.LocalStore/uploadImage')}" //上传接口
,accept: 'images'
,data: {type: 'back_bank_card'}
,exts: "jpg|png|jpeg"
,before: function(obj){ //obj参数包含的信息,跟 choose回调完全一致,可参见上文。
layer.load(); //上传loading
}
,done: function(res, index, upload){
if (res.code === 1) {
var template = '<div class="upload-image-div">';
template += '<img src="'+ res.data.file +'" alt="img">';
template += '<div class="del-upload-btn">x</div>';
$("#back-bank-card").parent().before(template)
$("input[name='backBankCard']").val(res.data.file)
} else {
layer.msg('上传错误');
return false;
}
layer.closeAll('loading'); //关闭loading
}
,error: function(index, upload){
layer.closeAll('loading'); //关闭loading
}
});
// 非法人对私身份证正面照
var uploadInst = likeupload.render({
elem: '#front-unincorporate' //绑定元素
,url: "{:url('shop.LocalStore/uploadImage')}" //上传接口
,accept: 'images'
,data: {type: 'front_unincorporate'}
,exts: "jpg|png|jpeg"
,before: function(obj){ //obj参数包含的信息,跟 choose回调完全一致,可参见上文。
layer.load(); //上传loading
}
,done: function(res, index, upload){
if (res.code === 1) {
var template = '<div class="upload-image-div">';
template += '<img src="'+ res.data.file +'" alt="img">';
template += '<div class="del-upload-btn">x</div>';
$("#front-unincorporate").parent().before(template)
$("input[name='frontUnincorporate']").val(res.data.file)
} else {
layer.msg('上传错误');
return false;
}
layer.closeAll('loading'); //关闭loading
}
,error: function(index, upload){
layer.closeAll('loading'); //关闭loading
}
});
// 非法人对私身份证反面照
var uploadInst = likeupload.render({
elem: '#back-unincorporate' //绑定元素
,url: "{:url('shop.LocalStore/uploadImage')}" //上传接口
,accept: 'images'
,data: {type: 'back_unincorporate'}
,exts: "jpg|png|jpeg"
,before: function(obj){ //obj参数包含的信息,跟 choose回调完全一致,可参见上文。
layer.load(); //上传loading
}
,done: function(res, index, upload){
if (res.code === 1) {
var template = '<div class="upload-image-div">';
template += '<img src="'+ res.data.file +'" alt="img">';
template += '<div class="del-upload-btn">x</div>';
$("#back-unincorporate").parent().before(template)
$("input[name='backUnincorporate']").val(res.data.file)
} else {
layer.msg('上传错误');
return false;
}
layer.closeAll('loading'); //关闭loading
}
,error: function(index, upload){
layer.closeAll('loading'); //关闭loading
}
});
// 非法人授权结算书合影照片
var uploadInst = likeupload.render({
elem: '#unincorporate-group' //绑定元素
,url: "{:url('shop.LocalStore/uploadImage')}" //上传接口
,accept: 'images'
,data: {type: 'unincorporate_group'}
,exts: "jpg|png|jpeg"
,before: function(obj){ //obj参数包含的信息,跟 choose回调完全一致,可参见上文。
layer.load(); //上传loading
}
,done: function(res, index, upload){
if (res.code === 1) {
var template = '<div class="upload-image-div">';
template += '<img src="'+ res.data.file +'" alt="img">';
template += '<div class="del-upload-btn">x</div>';
$("#unincorporate-group").parent().before(template)
$("input[name='unincorporateGroup']").val(res.data.file)
} else {
layer.msg('上传错误');
return false;
}
layer.closeAll('loading'); //关闭loading
}
,error: function(index, upload){
layer.closeAll('loading'); //关闭loading
}
});
// 非法人对私上传的授权书(无营业执照可不填)
var uploadInst = likeupload.render({
elem: '#unincorporate-authorize' //绑定元素
,url: "{:url('shop.LocalStore/uploadImage')}" //上传接口
,accept: 'images'
,data: {type: 'unincorporate_authorize'}
,exts: "jpg|png|jpeg"
,before: function(obj){ //obj参数包含的信息,跟 choose回调完全一致,可参见上文。
layer.load(); //上传loading
}
,done: function(res, index, upload){
if (res.code === 1) {
var template = '<div class="upload-image-div">';
template += '<img src="'+ res.data.file +'" alt="img">';
template += '<div class="del-upload-btn">x</div>';
$("#unincorporate-authorize").parent().before(template)
$("input[name='unincorporateAuthorize']").val(res.data.file)
} else {
layer.msg('上传错误');
return false;
}
layer.closeAll('loading'); //关闭loading
}
,error: function(index, upload){
layer.closeAll('loading'); //关闭loading
}
});
function switchTab(number) {
$('.layui-tab-card .layui-tab-title li').removeClass('layui-this');
$('.layui-tab-content .layui-tab-item').removeClass('layui-show');