This commit is contained in:
gaofeng
2026-05-12 18:27:28 +08:00
commit 6d9aee81aa
3664 changed files with 274415 additions and 0 deletions

View File

@@ -0,0 +1,242 @@
{include file="public/head" /}
<style>
body.user-page {
min-height: 100vh;
display: flex;
flex-direction: column;
background: #f5f7fb;
}
.user-main {
flex: 1;
padding: 32px 0 52px;
}
.account-layout {
display: grid;
grid-template-columns: 240px minmax(0, 1fr);
gap: 18px;
align-items: start;
}
.account-nav,
.account-panel {
background: #fff;
border: 1px solid rgba(15, 23, 42, .08);
border-radius: 8px;
box-shadow: 0 8px 24px rgba(15, 23, 42, .06);
overflow: hidden;
}
.account-nav__title,
.account-panel__title {
background: var(--main-color);
color: #fff;
font-size: 17px;
font-weight: 800;
line-height: 50px;
padding: 0 20px;
}
.account-nav__link {
display: flex;
align-items: center;
gap: 9px;
height: 50px;
padding: 0 18px;
color: #263241;
border-bottom: 1px solid #eef1f5;
text-decoration: none;
font-size: 15px;
}
.account-nav__link:hover,
.account-nav__link.is-active {
color: var(--main-color);
background: rgba(21, 56, 84, .06);
text-decoration: none;
}
.account-panel__body {
padding: 18px;
}
.order-list {
display: grid;
gap: 14px;
}
.order-card {
border: 1px solid #dfe5ee;
border-radius: 8px;
overflow: hidden;
background: #fff;
}
.order-grid {
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
}
.order-item {
display: grid;
grid-template-columns: 96px minmax(0, 1fr);
gap: 8px;
padding: 12px 14px;
border-bottom: 1px solid #edf1f5;
color: #334155;
line-height: 1.55;
min-width: 0;
}
.order-item:nth-child(odd) {
border-right: 1px solid #edf1f5;
}
.order-item strong {
color: #0f172a;
font-weight: 700;
white-space: nowrap;
}
.order-item span {
word-break: break-word;
}
.order-actions {
display: flex;
justify-content: flex-end;
gap: 10px;
padding: 12px 14px;
background: #f8fafc;
}
.account-btn {
display: inline-flex;
align-items: center;
justify-content: center;
min-width: 92px;
height: 36px;
padding: 0 16px;
border-radius: 4px;
background: var(--main-color);
color: #fff;
text-decoration: none;
font-weight: 700;
}
.account-btn:hover {
color: #fff;
background: #0f2b42;
text-decoration: none;
}
.empty-state {
padding: 52px 20px;
text-align: center;
color: #64748b;
}
.empty-state .account-btn {
margin-top: 16px;
}
@media (max-width: 768px) {
.user-main {
padding: 20px 12px 36px;
}
.account-layout {
grid-template-columns: 1fr;
gap: 12px;
}
.account-nav {
display: grid;
grid-template-columns: repeat(3, minmax(0, 1fr));
}
.account-nav__title {
display: none;
}
.account-nav__link {
justify-content: center;
padding: 0 8px;
font-size: 14px;
border-right: 1px solid #eef1f5;
}
.order-grid {
grid-template-columns: 1fr;
}
.order-item {
grid-template-columns: 88px minmax(0, 1fr);
}
.order-item:nth-child(odd) {
border-right: 0;
}
}
</style>
<body class="user-page">
{include file="public/newnav" /}
<main class="user-main">
<div class="layui-container">
<div class="account-layout">
<aside class="account-nav">
<div class="account-nav__title">个人中心</div>
<a href="{:url('user/index')}" class="account-nav__link is-active">
<i class="bi bi-receipt"></i><span>我的订单</span>
</a>
<a href="{:url('user/invoice')}" class="account-nav__link">
<i class="bi bi-file-earmark-text"></i><span>自助开票</span>
</a>
<a href="{:url('visa/index')}" class="account-nav__link">
<i class="bi bi-send"></i><span>签证申请</span>
</a>
</aside>
<section class="account-panel">
<div class="account-panel__title">我的订单</div>
<div class="account-panel__body">
<div class="order-list">
{volist name="order_list" id="vo"}
<article class="order-card">
<div class="order-grid">
<div class="order-item"><strong>订单号</strong><span>{$vo.order_sn}</span></div>
<div class="order-item"><strong>姓名</strong><span>{$vo.last_name} {$vo.first_name}</span></div>
<div class="order-item"><strong>出生日期</strong><span>{$vo.birth_date}</span></div>
<div class="order-item"><strong>护照号</strong><span>{$vo.passport_number}</span></div>
<div class="order-item"><strong>手机号</strong><span>{$vo.phone}</span></div>
<div class="order-item"><strong>下单时间</strong><span>{$vo.reg_time}</span></div>
<div class="order-item"><strong>状态</strong><span>{$vo.order_text}</span></div>
</div>
<div class="order-actions">
{eq name="$vo.pay_status" value="1"}
{eq name="$vo.invoice" value="0"}
<a class="account-btn" href="{:url('invoice/index',array('order_sn'=>$vo['order_sn']))}">开发票</a>
{/eq}
{/eq}
</div>
</article>
{/volist}
</div>
{empty name="order_list"}
<div class="empty-state">
<div>暂无订单记录</div>
<a class="account-btn" href="{:url('visa/index')}">去登记</a>
</div>
{/empty}
</div>
</section>
</div>
</div>
</main>
{include file="public/newfooter" /}
</body>
</html>

View File

@@ -0,0 +1,273 @@
{include file="public/head" /}
<style>
body.user-page {
min-height: 100vh;
display: flex;
flex-direction: column;
background: #f5f7fb;
}
.user-main {
flex: 1;
padding: 32px 0 52px;
}
.account-layout {
display: grid;
grid-template-columns: 240px minmax(0, 1fr);
gap: 18px;
align-items: start;
}
.account-nav,
.account-panel {
background: #fff;
border: 1px solid rgba(15, 23, 42, .08);
border-radius: 8px;
box-shadow: 0 8px 24px rgba(15, 23, 42, .06);
overflow: hidden;
}
.account-nav__title,
.account-panel__title {
background: var(--main-color);
color: #fff;
font-size: 17px;
font-weight: 800;
line-height: 50px;
padding: 0 20px;
}
.account-nav__link {
display: flex;
align-items: center;
gap: 9px;
height: 50px;
padding: 0 18px;
color: #263241;
border-bottom: 1px solid #eef1f5;
text-decoration: none;
font-size: 15px;
}
.account-nav__link:hover,
.account-nav__link.is-active {
color: var(--main-color);
background: rgba(21, 56, 84, .06);
text-decoration: none;
}
.account-panel__body {
padding: 22px;
}
.invoice-tip {
margin: 0 0 20px;
padding: 12px 14px;
border: 1px solid rgba(149, 30, 20, .16);
border-radius: 6px;
color: #951e14;
background: rgba(149, 30, 20, .05);
line-height: 1.7;
text-align: center;
}
.invoice-tip a {
color: var(--main-color);
font-weight: 800;
text-decoration: none;
}
.invoice-form .layui-form-label {
display: block;
float: none;
width: auto;
padding: 0 0 7px;
color: #1f2937;
text-align: left;
font-weight: 800;
}
.invoice-form .layui-form-label span {
color: #e53935;
margin-left: 3px;
}
.invoice-form .layui-input-block {
margin-left: 0;
min-height: auto;
}
.invoice-form .layui-input {
height: 50px;
border: 1px solid #d8dee8;
border-radius: 4px;
font-size: 15px;
}
.invoice-form .layui-input:focus {
border-color: var(--main-color) !important;
box-shadow: 0 0 0 3px rgba(21, 56, 84, .08);
}
.invoice-form .layui-btn {
height: 50px;
line-height: 50px;
border-radius: 6px;
background: var(--main-color);
font-size: 17px;
font-weight: 800;
}
@media (max-width: 768px) {
.user-main {
padding: 20px 12px 36px;
}
.account-layout {
grid-template-columns: 1fr;
gap: 12px;
}
.account-nav {
display: grid;
grid-template-columns: repeat(3, minmax(0, 1fr));
}
.account-nav__title {
display: none;
}
.account-nav__link {
justify-content: center;
padding: 0 8px;
font-size: 14px;
border-right: 1px solid #eef1f5;
}
.account-panel__body {
padding: 18px;
}
}
</style>
<body class="user-page">
{include file="public/newnav" /}
<main class="user-main">
<div class="layui-container">
<div class="account-layout">
<aside class="account-nav">
<div class="account-nav__title">个人中心</div>
<a href="{:url('user/index')}" class="account-nav__link">
<i class="bi bi-receipt"></i><span>我的订单</span>
</a>
<a href="{:url('user/invoice')}" class="account-nav__link is-active">
<i class="bi bi-file-earmark-text"></i><span>自助开票</span>
</a>
<a href="{:url('user/multiple')}" class="account-nav__link">
<i class="bi bi-files"></i><span>合并开票</span>
</a>
</aside>
<section class="account-panel">
<div class="account-panel__title">自助开票</div>
<div class="account-panel__body">
<p class="invoice-tip">
适用于单个订单开票。多个订单请使用
<a href="{:url('user/multiple')}">合并开票</a>
</p>
<form class="layui-form invoice-form" id="lookupform" name="form1" autocomplete="off">
<div class="layui-row layui-col-space24">
<div class="layui-col-xs12 layui-col-md6">
<div class="layui-form-item">
<label class="layui-form-label" for="passport_number">护照号码<span>*</span></label>
<div class="layui-input-block">
<input type="text" id="passport_number" name="passport_number"
maxlength="9" minlength="9" lay-verify="required"
placeholder="输入护照号码" class="layui-input">
</div>
</div>
</div>
<div class="layui-col-xs12 layui-col-md6">
<div class="layui-form-item">
<label class="layui-form-label" for="order_sn">订单号<span>*</span></label>
<div class="layui-input-block">
<input type="text" id="order_sn" name="order_sn" lay-verify="required"
placeholder="输入订单号" class="layui-input">
</div>
</div>
</div>
<div class="layui-col-xs12 layui-col-md6">
<div class="layui-form-item">
<label class="layui-form-label" for="last_name">姓氏<span>*</span></label>
<div class="layui-input-block">
<input type="text" id="last_name" name="last_name" maxlength="45"
lay-verify="required|englishName" placeholder="填写姓氏拼音"
class="layui-input">
</div>
</div>
</div>
<div class="layui-col-xs12 layui-col-md6">
<div class="layui-form-item">
<label class="layui-form-label" for="first_name">名字<span>*</span></label>
<div class="layui-input-block">
<input type="text" id="first_name" name="first_name" maxlength="40"
lay-verify="required|englishName" placeholder="填写名字拼音"
class="layui-input">
</div>
</div>
</div>
<div class="layui-col-xs12">
<button class="layui-btn layui-btn-fluid" lay-submit lay-filter="invoiceSubmit">提交</button>
</div>
</div>
</form>
</div>
</section>
</div>
</div>
</main>
{include file="public/newfooter" /}
<script>
layui.use(function () {
var $ = layui.$;
var form = layui.form;
var layer = layui.layer;
form.verify({
englishName: [/^[A-Za-z]+$/, '请填写英文拼音']
});
form.on('submit(invoiceSubmit)', function () {
var index1;
$.ajax({
type: 'POST',
url: "{:url('user/checkInvoice')}",
data: $('#lookupform').serialize(),
beforeSend: function () {
index1 = layer.load(1, {shade: [0.3, '#fff']});
},
success: function (data) {
layer.close(index1);
if (data.status == 1) {
layer.msg('查询成功');
window.location.href = data.url;
} else {
layer.msg(data.msg);
}
},
error: function () {
layer.close(index1);
layer.msg('请求失败,请稍后重试');
}
});
return false;
});
});
</script>
</body>
</html>

View File

@@ -0,0 +1,368 @@
{include file="public/head" /}
<style>
body.login-page {
min-height: 100vh;
display: flex;
flex-direction: column;
background: #f5f7fb;
}
.login-main {
flex: 1;
padding: 42px 0 56px;
}
.login-card {
max-width: 520px;
margin: 0 auto;
background: #fff;
border: 1px solid rgba(15, 23, 42, .08);
border-radius: 8px;
box-shadow: 0 8px 24px rgba(15, 23, 42, .08);
overflow: hidden;
}
.login-card__hd {
background: var(--main-color);
color: #fff;
padding: 18px 24px;
}
.login-card__hd h1 {
margin: 0;
font-size: 22px;
font-weight: 800;
line-height: 1.35;
letter-spacing: 0;
}
.login-card__hd p {
margin: 6px 0 0;
color: rgba(255, 255, 255, .76);
font-size: 13px;
line-height: 1.6;
}
.login-form {
padding: 28px 24px 26px;
}
.login-form .layui-form-item {
margin-bottom: 18px;
}
.login-form .layui-input-wrap {
width: 100%;
}
.login-form .layui-input {
height: 50px;
border: 1px solid #d8dee8;
border-radius: 4px;
font-size: 15px;
}
.login-form .layui-input:focus {
border-color: var(--main-color) !important;
box-shadow: 0 0 0 3px rgba(21, 56, 84, .08);
}
.login-code-row {
display: grid;
grid-template-columns: minmax(0, 1fr) 148px;
gap: 12px;
}
.login-get {
width: 100%;
height: 50px;
line-height: 50px;
padding: 0 12px;
border-radius: 4px;
border-color: var(--main-color);
color: var(--main-color);
background: #fff;
font-weight: 700;
}
.login-get:hover,
.login-get:focus {
border-color: var(--main-color);
color: var(--main-color);
background: rgba(21, 56, 84, .06);
}
.login-get[disabled] {
border-color: #d8dee8 !important;
color: #9aa3af !important;
background: #f6f7f9 !important;
cursor: not-allowed;
}
.login-submit {
height: 50px;
line-height: 50px;
border-radius: 6px;
background: var(--main-color);
border-color: var(--main-color);
font-size: 17px;
font-weight: 800;
}
.login-submit:hover,
.login-submit:focus {
background: #0f2b42;
border-color: #0f2b42;
}
.login-agreement {
margin-top: 2px;
color: #475569;
font-size: 13px;
line-height: 1.7;
}
.login-agreement a {
color: var(--main-color);
font-weight: 700;
text-decoration: none;
}
.login-agreement a:hover {
text-decoration: underline;
}
.layui-form-checked[lay-skin=primary] > i {
border-color: var(--main-color) !important;
background-color: var(--main-color);
color: #fff;
}
.login-terms {
padding: 20px;
max-height: 70vh;
overflow-y: auto;
color: #333;
line-height: 1.8;
}
.login-terms h3 {
margin: 10px 0 8px;
color: var(--main-color);
font-size: 18px;
font-weight: 700;
}
.login-terms p {
margin: 0 0 10px;
font-size: 13px;
}
@media (max-width: 768px) {
.login-main {
padding: 24px 12px 36px;
}
.login-card__hd,
.login-form {
padding-left: 18px;
padding-right: 18px;
}
.login-code-row {
grid-template-columns: 1fr;
gap: 10px;
}
}
</style>
<body class="login-page">
{include file="public/newnav" /}
<main class="login-main">
<div class="layui-container">
<section class="login-card">
<div class="login-card__hd">
<h1>用户登录</h1>
<p>使用手机号验证码登录后,可查看订单进度和已提交的申请信息。</p>
</div>
<form class="layui-form login-form" autocomplete="off">
<div class="layui-form-item">
<div class="login-code-row">
<div class="layui-input-wrap">
<div class="layui-input-prefix">
<i class="layui-icon layui-icon-cellphone"></i>
</div>
<input type="text" name="phone" value="" lay-verify="required|phone"
placeholder="{:lang('visa.phone_placeholder')}"
lay-reqtext="{:lang('visa.phone_placeholder')}" autocomplete="off"
class="layui-input" id="reg-cellphone">
</div>
<input class="login-get layui-btn layui-btn-primary" type="button"
id="getcode" value="获取验证码" lay-on="reg-get-vercode">
</div>
</div>
<div class="layui-form-item">
<div class="layui-input-wrap">
<div class="layui-input-prefix">
<i class="layui-icon layui-icon-vercode"></i>
</div>
<input type="text" name="vercode" value="" lay-verify="required"
placeholder="{:lang('contact.yzm')}" lay-reqtext="请填写验证码"
autocomplete="off" class="layui-input">
</div>
</div>
<div class="layui-form-item login-agreement">
<input type="checkbox" lay-filter="termsCheckbox" name="agreement" lay-skin="primary"
title="{:lang('visa.terms_acceptance')}" checked
lay-verify="required|checkboxRequired">
</div>
<div class="layui-form-item" style="margin-bottom: 0;">
<button class="layui-btn layui-btn-fluid login-submit" lay-submit lay-filter="demo-reg">登录</button>
</div>
</form>
</section>
</div>
</main>
{include file="public/newfooter" /}
<script>
layui.use(function () {
var $ = layui.$;
var form = layui.form;
var layer = layui.layer;
var util = layui.util;
var wait = 60;
var timer = null;
form.verify({
checkboxRequired: function () {
if (!$('input[name="agreement"]').prop('checked')) {
return '请先阅读并接受《条款与条件》及《隐私政策》';
}
}
});
function getLayerArea() {
return window.innerWidth <= 768 ? ['90%', '90%'] : ['50%', '60%'];
}
function openTermsDialog() {
layer.open({
type: 1,
title: '{:lang(\'js.terms_privacy_title\')}',
area: getLayerArea(),
btn: ['关闭'],
content: `
<div class="login-terms">
<h3>{:lang('js.terms_conditions')}</h3>
<p>{:str_replace('%country%', $country ?? '', lang('js.terms_intro'))}</p>
<p>{:str_replace('%country%', $country ?? '', lang('js.our_services'))}</p>
<p>{:str_replace('%country%', $country ?? '', lang('js.application_process'))}</p>
<p>{:lang('js.read_confirmation')}</p>
<h3>{:lang('js.privacy_policy')}</h3>
<p>{:lang('js.privacy_intro')}</p>
<h3>1. {:lang('js.scope')}</h3>
<p>{:lang('js.scope_content')}</p>
<h3>2. {:lang('js.information_use')}</h3>
<p>{:lang('js.information_use_content')}</p>
<h3>3. {:lang('js.information_disclosure')}</h3>
<p>{:lang('js.information_disclosure_content')}</p>
<h3>4. {:lang('js.information_storage')}</h3>
<p>{:lang('js.information_storage_content')}</p>
<h3>5. {:lang('js.cookie_use')}</h3>
<p>{:lang('js.cookie_use_content')}</p>
<h3>6. {:lang('js.information_security')}</h3>
<p>{:lang('js.information_security_content')}</p>
<h3>7. {:lang('js.policy_changes')}</h3>
<p>{:lang('js.policy_changes_content')}</p>
</div>
`
});
}
form.on('checkbox(termsCheckbox)', function (data) {
if (data.elem.checked) {
openTermsDialog();
}
});
form.on('submit(demo-reg)', function (data) {
if (!data.field.agreement) {
layer.msg('请先阅读并接受《条款与条件》及《隐私政策》', {icon: 2});
return false;
}
$.ajax({
url: '/home/login/login',
type: 'post',
data: data.field,
success: function (res) {
if (res.code == 1) {
layer.msg('登录成功', {icon: 1}, function () {
window.location.href = res.url;
});
} else {
layer.msg(res.msg, {icon: 2});
}
},
error: function () {
layer.msg('请求失败,请稍后重试', {icon: 2});
}
});
return false;
});
function settime() {
var $code = $('#getcode');
if (wait <= 0) {
$code.removeAttr('disabled').val('获取验证码');
wait = 60;
timer = null;
return;
}
$code.prop('disabled', true).val('重新发送 ' + wait + 's');
wait--;
timer = setTimeout(settime, 1000);
}
util.on('lay-on', {
'reg-get-vercode': function () {
var isvalid = form.validate('#reg-cellphone');
if (isvalid) {
$.ajax({
url: '/home/login/login_code',
type: 'POST',
data: {mobile: $('#reg-cellphone').val()},
dataType: 'json',
success: function (data) {
if (data.code == 1) {
if (timer) {
clearTimeout(timer);
}
wait = 60;
settime();
} else {
layer.msg(data.msg, {icon: 2});
}
},
error: function () {
layer.msg('验证码发送失败,请稍后重试', {icon: 2});
}
});
}
}
});
});
</script>
</body>
</html>

View File

@@ -0,0 +1,387 @@
{include file="public/head" /}
<style>
body.user-page {
min-height: 100vh;
display: flex;
flex-direction: column;
background: #f5f7fb;
}
.user-main {
flex: 1;
padding: 32px 0 52px;
}
.account-layout {
display: grid;
grid-template-columns: 240px minmax(0, 1fr);
gap: 18px;
align-items: start;
}
.account-nav,
.account-panel {
background: #fff;
border: 1px solid rgba(15, 23, 42, .08);
border-radius: 8px;
box-shadow: 0 8px 24px rgba(15, 23, 42, .06);
overflow: hidden;
}
.account-nav__title,
.account-panel__title {
background: var(--main-color);
color: #fff;
font-size: 17px;
font-weight: 800;
line-height: 50px;
padding: 0 20px;
}
.account-nav__link {
display: flex;
align-items: center;
gap: 9px;
height: 50px;
padding: 0 18px;
color: #263241;
border-bottom: 1px solid #eef1f5;
text-decoration: none;
font-size: 15px;
}
.account-nav__link:hover,
.account-nav__link.is-active {
color: var(--main-color);
background: rgba(21, 56, 84, .06);
text-decoration: none;
}
.account-panel__body {
padding: 22px;
}
.invoice-tip {
margin: 0 0 20px;
padding: 12px 14px;
border: 1px solid rgba(149, 30, 20, .16);
border-radius: 6px;
color: #951e14;
background: rgba(149, 30, 20, .05);
line-height: 1.7;
text-align: center;
}
.invoice-tip a {
color: var(--main-color);
font-weight: 800;
text-decoration: none;
}
.invoice-row {
position: relative;
margin-bottom: 16px;
padding: 18px;
border: 1px solid #dfe5ee;
border-radius: 8px;
background: #fff;
}
.invoice-row__actions {
display: flex;
justify-content: flex-end;
gap: 10px;
margin-top: 4px;
}
.invoice-action {
display: inline-flex;
align-items: center;
gap: 5px;
color: var(--main-color);
cursor: pointer;
font-weight: 800;
user-select: none;
}
.invoice-action.is-danger {
color: #951e14;
}
.invoice-form .layui-form-label {
display: block;
float: none;
width: auto;
padding: 0 0 7px;
color: #1f2937;
text-align: left;
font-weight: 800;
}
.invoice-form .layui-form-label span {
color: #e53935;
margin-left: 3px;
}
.invoice-form .layui-input-block {
margin-left: 0;
min-height: auto;
}
.invoice-form .layui-input {
height: 50px;
border: 1px solid #d8dee8;
border-radius: 4px;
font-size: 15px;
}
.invoice-form .layui-input:focus {
border-color: var(--main-color) !important;
box-shadow: 0 0 0 3px rgba(21, 56, 84, .08);
}
.invoice-submit {
height: 50px;
line-height: 50px;
border-radius: 6px;
background: var(--main-color);
font-size: 17px;
font-weight: 800;
}
@media (max-width: 768px) {
.user-main {
padding: 20px 12px 36px;
}
.account-layout {
grid-template-columns: 1fr;
gap: 12px;
}
.account-nav {
display: grid;
grid-template-columns: repeat(3, minmax(0, 1fr));
}
.account-nav__title {
display: none;
}
.account-nav__link {
justify-content: center;
padding: 0 8px;
font-size: 14px;
border-right: 1px solid #eef1f5;
}
.account-panel__body {
padding: 18px;
}
}
</style>
<body class="user-page">
{include file="public/newnav" /}
<main class="user-main">
<div class="layui-container">
<div class="account-layout">
<aside class="account-nav">
<div class="account-nav__title">个人中心</div>
<a href="{:url('user/index')}" class="account-nav__link">
<i class="bi bi-receipt"></i><span>我的订单</span>
</a>
<a href="{:url('user/invoice')}" class="account-nav__link">
<i class="bi bi-file-earmark-text"></i><span>自助开票</span>
</a>
<a href="{:url('user/multiple')}" class="account-nav__link is-active">
<i class="bi bi-files"></i><span>合并开票</span>
</a>
</aside>
<section class="account-panel">
<div class="account-panel__title">合并开票</div>
<div class="account-panel__body">
<p class="invoice-tip">
适用于多个订单合并开票。单个订单请使用
<a href="{:url('user/invoice')}">自助开票</a>
</p>
<form class="layui-form invoice-form" id="lookupform" name="form1" autocomplete="off">
<div id="invoiceRows">
<div class="invoice-row">
<div class="layui-row layui-col-space24">
<div class="layui-col-xs12 layui-col-md6">
<div class="layui-form-item">
<label class="layui-form-label">护照号码<span>*</span></label>
<div class="layui-input-block">
<input type="text" name="passport_number" maxlength="9" minlength="9"
lay-verify="required" placeholder="输入护照号码" class="layui-input">
</div>
</div>
</div>
<div class="layui-col-xs12 layui-col-md6">
<div class="layui-form-item">
<label class="layui-form-label">订单号<span>*</span></label>
<div class="layui-input-block">
<input type="text" name="order_sn" lay-verify="required"
placeholder="输入订单号" class="layui-input">
</div>
</div>
</div>
<div class="layui-col-xs12 layui-col-md6">
<div class="layui-form-item">
<label class="layui-form-label">姓氏<span>*</span></label>
<div class="layui-input-block">
<input type="text" name="last_name" maxlength="45"
lay-verify="required|englishName" placeholder="填写姓氏拼音"
class="layui-input">
</div>
</div>
</div>
<div class="layui-col-xs12 layui-col-md6">
<div class="layui-form-item">
<label class="layui-form-label">名字<span>*</span></label>
<div class="layui-input-block">
<input type="text" name="first_name" maxlength="40"
lay-verify="required|englishName" placeholder="填写名字拼音"
class="layui-input">
</div>
</div>
</div>
</div>
<div class="invoice-row__actions">
<span class="invoice-action js-add-row"><i class="layui-icon layui-icon-add-circle"></i>添加</span>
<span class="invoice-action is-danger js-remove-row"><i class="layui-icon layui-icon-reduce-circle"></i>删除</span>
</div>
</div>
</div>
<button class="layui-btn layui-btn-fluid invoice-submit" lay-submit lay-filter="multipleSubmit">提交</button>
</form>
</div>
</section>
</div>
</div>
</main>
{include file="public/newfooter" /}
<script>
layui.use(function () {
var $ = layui.$;
var form = layui.form;
var layer = layui.layer;
form.verify({
englishName: [/^[A-Za-z]+$/, '请填写英文拼音']
});
function refreshRemoveButtons() {
var $rows = $('#invoiceRows .invoice-row');
$rows.find('.js-remove-row').toggle($rows.length > 1);
}
function getRowData($row) {
return {
passport_number: $.trim($row.find("input[name='passport_number']").val()),
order_sn: $.trim($row.find("input[name='order_sn']").val()),
last_name: $.trim($row.find("input[name='last_name']").val()),
first_name: $.trim($row.find("input[name='first_name']").val())
};
}
function validateRow($row) {
var data = getRowData($row);
if (!data.passport_number) {
layer.msg('请输入护照号');
return false;
}
if (!data.order_sn) {
layer.msg('请输入订单号');
return false;
}
if (!data.last_name) {
layer.msg('请输入姓氏');
return false;
}
if (!data.first_name) {
layer.msg('请输入名字');
return false;
}
if (!/^[A-Za-z]+$/.test(data.last_name) || !/^[A-Za-z]+$/.test(data.first_name)) {
layer.msg('请填写英文拼音');
return false;
}
return true;
}
$(document).on('click', '.js-add-row', function () {
var $row = $(this).closest('.invoice-row');
if (!validateRow($row)) {
return false;
}
var $newRow = $row.clone(false, false);
$newRow.find('input').val('');
$('#invoiceRows').append($newRow);
refreshRemoveButtons();
});
$(document).on('click', '.js-remove-row', function () {
$(this).closest('.invoice-row').remove();
refreshRemoveButtons();
});
form.on('submit(multipleSubmit)', function () {
var datas = [];
var isValid = true;
var index1;
$('#invoiceRows .invoice-row').each(function () {
var $row = $(this);
if (!validateRow($row)) {
isValid = false;
return false;
}
datas.push(getRowData($row));
});
if (!isValid) {
return false;
}
$.ajax({
type: 'POST',
url: "{:url('user/checkMultiple')}",
data: {datas: JSON.stringify(datas)},
beforeSend: function () {
index1 = layer.load(1, {shade: [0.3, '#fff']});
},
success: function (data) {
layer.close(index1);
if (data.status == 1) {
layer.msg('查询成功');
window.location.href = data.url;
} else {
layer.msg(data.msg);
}
},
error: function () {
layer.close(index1);
layer.msg('请求失败,请稍后重试');
}
});
return false;
});
refreshRemoveButtons();
});
</script>
</body>
</html>