feat: mobile成功分销商页面

This commit is contained in:
2025-05-27 15:37:51 +08:00
parent 15743c6f53
commit 7e22638c02
7 changed files with 562 additions and 16 deletions

View File

@@ -162,9 +162,9 @@ class ContactUs extends Common
'ip' => request()->ip(),
]);
if ($ret->isEmpty()) {
return error(lang('contact_distributor.send_fail'));
return error(lang('信息提交失败!'));
}
return success(lang('contact_distributor.send_success'));
return success(lang('信息已成功提交!'));
}
// 获取企业规模

View File

@@ -32,6 +32,9 @@ return [
'行业' => 'Industry',
'询问内容' => 'Inquiry',
'提交' => 'SUBMIT',
'信息已成功提交!' => 'Add Success',
'信息提交失败!' => 'Add Fail',
// 验证器中文本
'validate_first_name_require' => '名不能为空',
'validate_first_name_max' => '名不能超过64个字符',
@@ -60,4 +63,36 @@ return [
'全站搜索' => 'Search',
'搜索' => 'Search',
'请搜索' => 'Please search...',
// 成为分销商页面
'成为经销商' => 'Become a Distributor',
'准备好加入我们了吗?<br> 在下面输入您的详细信息我们的销售团队将在2个工作日内回复您。' => 'Ready to join us?<br/>Enter your details below and our Sales team will get back to you within 2 business days.',
'公司名称' => 'Company Name',
'请输入公司名称' => 'Enter your Company Name',
'电子邮件' => 'Contact Email',
'请输入邮箱' => 'Enter your Email',
'电话号码' => 'Phone Number',
'请输入电话号码' => 'Enter your Phone Number',
'业务类型' => 'Type of Business',
'在线商店网址' => 'Online Store URL',
'企业规模' => 'Enterprise Size',
'公司地址' => 'Company Address',
'请输入地址' => 'Enter Address',
'留言' => 'Message',
'请输入留言' => 'Enter your message',
// 成为分销商验证器提示
'公司名称不能为空' => 'Company Name is required',
'公司名称不能超过64个字符' => 'Company Name cannot exceed 64 characters',
'邮箱不能为空' => 'Email is required',
'邮箱格式不正确' => 'Email format is incorrect',
'邮箱不能超过128个字符' => 'Email cannot exceed 128 characters',
'电话号码不能为空' => 'Phone Number is required',
'电话号码不能超过64个字符' => 'Phone Number cannot exceed 64 characters',
'业务类型不能为空' => 'Type of Business is required',
'业务类型不能超过128个字符' => 'Type of Business cannot exceed 128 characters',
'企业规模不能为空' => 'Enterprise Size is required',
'企业规模不能超过128个字符' => 'Enterprise Size cannot exceed 128 characters',
'公司地址不能为空' => 'Company Address is required',
'公司地址不能超过255个字符' => 'Company Address cannot exceed 255 characters',
'留言不能为空' => 'Message is required',
];

View File

@@ -30,19 +30,19 @@ class ContactUsDistributorValidate extends Validate
* @var array
*/
protected $message = [
'corp_name.require' => 'contact_distributor.validate_name_required',
'corp_name.max' => 'contact_distributor.validate_name_max',
'email.require' => 'contact_distributor.validate_email_required',
'email.email' => 'contact_distributor.validate_email_email',
'email.max' => 'contact_distributor.validate_email_max',
'phone.require' => 'contact_distributor.validate_phone_required',
'phone.max' => 'contact_distributor.validate_phone_max',
'business_type.require' => 'contact_distributor.validate_business_type_required',
'business_type.max' => 'contact_distributor.validate_business_type_max',
'enterprise_size.require' => 'contact_distributor.validate_enterprise_size_required',
'enterprise_size.max' => 'contact_distributor.validate_enterprise_size_max',
'address.require' => 'contact_distributor.validate_address_required',
'address.max' => 'contact_distributor.validate_address_max',
'message.require' => 'contact_distributor.validate_message_required',
'corp_name.require' => '公司名称不能为空',
'corp_name.max' => '公司名称不能超过64个字符',
'email.require' => '邮箱不能为空',
'email.email' => '邮箱格式不正确',
'email.max' => '邮箱不能超过128个字符',
'phone.require' => '电话号码不能为空',
'phone.max' => '电话号码不能超过64个字符',
'business_type.require' => '业务类型不能为空',
'business_type.max' => '业务类型不能超过128个字符',
'enterprise_size.require' => '企业规模不能为空',
'enterprise_size.max' => '企业规模不能超过128个字符',
'address.require' => '公司地址不能为空',
'address.max' => '公司地址不能超过255个字符',
'message.require' => '留言不能为空',
];
}

View File

@@ -0,0 +1,7 @@
{extend name="public/base" /}
{block name="style"}
<link rel="stylesheet" type="text/css" href="css/introduction.css" />
{/block}
{block name="main"}
{/block}

View File

@@ -0,0 +1,107 @@
{extend name="public/base" /}
{block name="style"}
<link rel="stylesheet" type="text/css" href="__CSS__/contactus_distributor.css" />
{/block}
{block name="main"}
<div class="oricoEGapp">
<!-- 内容-->
<div class="cooperapp_bdpage" style="background:#F2F2F2;">
<div class="cooperapp_bd_main" style="margin-top: 60px;">
<form action="" method="post">
<h1 class="cooperapp_t1">{:lang('成为经销商')}</h1>
<p class="cooperapp_s1">{:lang('准备好加入我们了吗?<br> 在下面输入您的详细信息我们的销售团队将在2个工作日内回复您。')}</p>
<!--内容-->
<div class="bd_ct cooperapp_bd_ct">
<div class="thimg">
<img src="__IMAGES__/distributor_focus_image.webp" alt="" srcset="" class="cooperapp_bdimg">
</div>
<div class="bd_from">
<div class="theit">
<div class="bditem">
<label class="itlable">{:lang('公司名称')}<span class="redtag">*</span></label>
<input type="text" class="form-control itinp companyName" placeholder="{:lang('请输入公司名称')}" />
</div>
</div>
<div class="theit">
<div class="bditem">
<label class="itlable">{:lang('电子邮件')}<span class="redtag">*</span></label>
<input type="text" class="form-control itinp email" placeholder="{:lang('请输入邮箱')}" />
</div>
</div>
<div class="theit">
<div class="bditem bditem1">
<label class="itlable">{:lang('电话号码')}<span class="redtag">*</span></label>
<input type="text" class="form-control itinp mphone" placeholder="{:lang('请输入电话号码')}" />
</div>
</div>
<div class="theit">
<div class="bditem">
<label class="itlable">{:lang('业务类型')}<span class="redtag">*</span></label>
<select name="business_type" class="form-control itinp business_type">
{volist name="types" id="ty"}
<option value="{$ty.value}">{$ty.name}</option>
{/volist}
</select>
</div>
</div>
<div class="theit">
<div class="bditem">
<label class="itlable">{:lang('在线商店网址')}</label>
<input type="text" class="form-control itinp url" placeholder="{:lang('请输入网址')}" />
</div>
</div>
<div class="theit">
<div class="bditem bditem1">
<label class="itlable">{:lang('企业规模')}<span class="redtag">*</span></label>
<select name="enterprise_size" data-pf-type="FormInput" class="form-control itinp enterprise_size">
{volist name="sizes" id="si"}
<option value="{$si.value}">{$si.name}</option>
{/volist}
</select>
</div>
</div>
<div class="theit">
<div class="bditem bditem1">
<label class="itlable">{:lang('公司地址')}<span class="redtag">*</span></label>
<input type="text" class="form-control itinp address" placeholder="{:lang('请输入地址')}">
</div>
</div>
<div class="theit">
<div class="bditem bditem1">
<label class="itlable">{:lang('留言')}<span class="redtag">*</span></label>
<textarea class="ittextarea message" placeholder="{:lang('请输入留言')}"></textarea>
</div>
</div>
</div>
</div>
<!-- 提交-->
<div class="bttj" id="send">{:lang('提交')}</div>
</form>
</div>
</div>
</div>
{/block}
{block name="script"}
<script type="text/javascript">
$(function () {
$("#send").click(function () {
var form = $(this).parents("form");
$.ajax({
url: "{:url('contactus/distributor')}",
type: "post",
data: form.serialize(),
dataType: "json",
success: function (r) {
if (r.code == 0) {
form.get(0).reset();
}
alert(r.msg);
},
error: function (e) {
console.error(e);
}
})
})
})
</script>
{/block}

View File

@@ -0,0 +1,397 @@
.cooperapp_bdpage {
width: 100%;
background: #f2f2f2;
position: relative;
}
.cooperapp_bd_main {
background: #fff;
border-radius: 8px;
padding: 24px 16px;
margin: 20px;
margin-top: 70px;
}
.cooperapp_t1 {
font-size: 18px;
color: #004bfa;
text-align: left;
font-family: Montserrat-Bold, Montserrat;
font-weight: 700;
margin-top: 0;
margin-bottom: 12px;
}
.cooperapp_s1 {
font-size: 12px;
color: #707070;
text-align: center;
text-align: left;
font-family: Montserrat-Medium, Montserrat;
font-weight: 500;
}
.bd_ct {
width: 100%;
display: flex;
flex-direction: row;
justify-content: space-between;
}
.cooperapp_bd_ct {
width: 100%;
flex-direction: column;
}
.cooperapp_bdimg {
width: 100%;
}
.thimg {
margin-top: 12px;
width: 100%;
margin-bottom: 24px;
}
.bdimg {
width: 100%;
height: 100%;
}
.bd_from {
display: flex;
flex: 1;
flex-direction: column;
}
.theit {
display: flex;
flex-direction: row;
justify-content: space-between;
margin-bottom: 20px;
}
.bditem {
display: flex;
flex-direction: column;
flex: 1;
}
.bditem1 {
width: 100%;
}
.itlable {
font-size: 12.5px;
font-family: Montserrat-Medium, Montserrat;
color: #000000;
font-weight: bold;
padding-bottom: 5px;
width: fit-content;
position: relative;
}
.redtag {
position: absolute;
right: -10px;
top: 0px;
color: #ee2f53;
}
.itinp {
font-size: 16px;
background: #f2f2f2;
/*border: none !important;*/
border-radius: 8px;
height: 48px;
border: none;
box-shadow: none;
font-family: Montserrat-Regular, Montserrat;
}
.itselectopen {
width: 100%;
height: 48px;
display: flex;
background: #f2f2f2;
border: none !important;
border-radius: 8px;
box-shadow: none;
align-items: center;
justify-content: space-between;
}
.dropdown-menu {
width: 100%;
}
.ittextarea {
height: 100px;
padding: 15px;
background: #f2f2f2;
border-radius: 8px;
font-family: Montserrat-Regular, Montserrat;
border: 0;
}
.bttj {
font-size: 14px;
font-family: Montserrat-Bold, Montserrat;
font-weight: bold;
width: 212px;
padding: 15px 60px;
background: #004bfa;
border-radius: 28px;
color: #fff;
text-align: center;
margin: 0 auto;
margin-top: 10px;
}
.iotbpage {
width: 100%;
height: 100%;
display: flex;
flex-direction: column;
align-items: center;
position: relative;
overflow: auto;
padding-top: 50px;
}
.iotb_bgw {
width: 100%;
background-color: #fff;
display: flex;
flex-direction: column;
align-items: center;
}
.bdimg1 {
width: 100%;
}
.iotbt1 {
font-size: 18px;
font-family: Montserrat-Bold, Montserrat;
padding-bottom: 24px;
padding-top: 40px;
font-weight: 700;
color: #000;
}
.iotb_part1 {
padding: 0 20px;
display: flex;
flex-direction: row;
justify-content: space-between;
flex-wrap: wrap;
padding-bottom: 40px;
align-items: baseline;
}
.iotb_p1_item {
width: 45%;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
}
.iotb_p1_item img {
width: 72px;
height: 72px;
}
.iotbic1 {
width: 120px;
height: 120px;
}
.iotbtp1 {
font-size: 14px;
font-family: Montserrat-Bold, Montserrat;
font-weight: bold;
padding-bottom: 11px;
word-break: break-word;
}
.iotbts1 {
text-align: center;
font-size: 12px;
font-family: Montserrat-Medium, Montserrat;
color: #9e9e9f;
word-break: break-word;
}
.iotb_part2 {
width: 100%;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
}
.fdimgs {
padding-bottom: 60px;
margin: 0 auto;
display: flex;
flex-direction: row;
align-items: center;
justify-content: space-between;
}
.iotb_part3 {
width: 100%;
padding-bottom: 81px;
display: flex;
background-color: #fff;
flex-direction: column;
}
.odmmain {
width: 70%;
margin: 0 auto;
display: flex;
align-items: center;
justify-content: center;
flex-direction: column;
}
.odmconten {
width: 81%;
margin: 0 auto;
display: flex;
flex-direction: row;
justify-content: space-between;
flex-wrap: wrap;
}
.odmitem {
width: 41%;
display: flex;
flex-direction: column;
align-items: center;
padding-bottom: 24px;
}
.appodmimg {
width: 72px;
height: 72px;
display: flex;
align-items: center;
justify-content: center;
border-radius: 50%;
box-shadow: 0px 2px 5px rgba(124, 162, 207, 0.2);
}
.odms1 {
color: #202020;
font-size: 14px;
padding-top: 12px;
text-align: center;
font-family: Montserrat-Medium, Montserrat;
overflow-wrap: break-word;
word-break: break-word;
}
.appcoofootimg {
width: 100%;
}
.sfbt1 {
text-align: center;
font-size: 18px;
font-family: Montserrat-Bold, Montserrat;
font-weight: bold;
padding-bottom: 24px;
padding-top: 24px;
color: #000;
}
.sfbchecks {
display: flex;
flex-direction: column;
}
.sfbcheckboxlist {
width: 100%;
display: flex;
flex-direction: column;
align-items: center;
}
.sfbcheckboxit {
margin: 0 !important;
border: 1px solid #ccc;
width: 16px !important;
height: 16px !important;
border-radius: 2px !important;
margin-right: 10px !important;
}
.cit {
width: 100%;
font-size: 14px;
font-family: Montserrat-Regular, Montserrat;
color: #000;
display: flex;
flex-direction: row;
align-items: center;
margin-bottom: 12px;
font-weight: 400;
}
.bd_main1 {
max-height: none;
}
.ittextarea2 {
height: 200px;
}
.bditem select {
border: 1px solid #f2f2f2;
}
.bd_from .form-control {
display: block;
/*width: 100%;*/
padding: 2px 12px;
font-size: 14px;
line-height: 1.42857143;
color: #555;
transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
}
.wcu_list {
display: flex;
flex-direction: column;
padding: 0 20px;
}
.wcu_ltem {
width: 100%;
margin-bottom: 12px;
background: #fff;
border-radius: 8px;
display: flex;
flex-direction: column;
/*padding: 0 20px;*/
}
.wcu_ltem .fbit {
width: 100%;
}
.wcu_s1 {
color: #000;
font: 16px;
font-family: Montserrat-Medium, Montserrat;
font-weight: 500;
padding: 20px 24px;
}
.bd_main2 {
padding-bottom: 75px;
}

Binary file not shown.

After

Width:  |  Height:  |  Size: 17 KiB