feat: mobile 联系我们留言页

This commit is contained in:
2025-05-29 10:45:29 +08:00
parent ce013a9379
commit 7d8f8f670e
5 changed files with 300 additions and 5 deletions

View File

@@ -1,6 +1,8 @@
<?php
// 这是系统自动生成的公共文件
use think\facade\Lang;
if (!function_exists('str_contains')) {
/**
* 检查字符串是否包含子字符串
@@ -99,8 +101,7 @@ if (!function_exists('thumb')) {
}
}
if (!function_exists('get_path_from_img_tag'))
{
if (!function_exists('get_path_from_img_tag')) {
/**
* 从img标签中获取图片路径
* @param string $img
@@ -116,3 +117,26 @@ if (!function_exists('get_path_from_img_tag'))
return '';
}
}
if (!function_exists('lang_i18n')) {
/**
* 获取国际化语言包
* 根据请求页面path获取分组语言对应值
*
* @param string $name 语言包名称
* @param array $vars 替换变量
* @param string $lang 语言标识
* @return string
*/
function lang_i18n(string $name, array $vars = [], string $lang = '') {
if (is_null($name)) {
return '';
}
$path = strtolower(request()->controller() . '/' . request()->action());
$lang_key = "{$path}.{$name}";
if (!Lang::has($lang_key, $lang)) {
return $name;
}
return Lang::get($lang_key, $vars, $lang);
}
}

View File

@@ -89,10 +89,10 @@ class ContactUs extends Common
'user_agent' => request()->header('user-agent'),
]);
if ($msg->isEmpty()) {
return error(lang('contact_message.send_fail'));
return error(lang('信息提交失败!'));
}
return success(lang('contact_message.send_success'));
return success(lang('信息已成功提交!'));
}
$focus_image = [];
@@ -103,6 +103,7 @@ class ContactUs extends Common
->where('status', '=', 1)
->order(['sort' => 'asc', 'id' => 'desc']);
}])
->atPlatform(request()->from)
->uniqueLabel([
'BANNER_6801be1e7d686',
'BANNER_6801c053ce12e',

View File

@@ -71,4 +71,16 @@ return [
'电话号码' => 'Phone Number',
'您对哪个产品品类感兴趣?' => 'Products you are interested in?',
'当前选定语言的采购可选品类配置出错' => 'The procurement category configuration for the currently selected language is incorrect',
// 联系我们留言页
'contactus/message' => [
'我们的信息' => 'Our Information',
'姓名' => 'Your name',
'电子邮箱' => 'Your email',
'您的问题' => 'Your message',
'提交您的问题' => 'Send Us Your Question',
'请输入内容...' => 'This is your placeholder text',
'发送' => 'SEND',
'成为经销商' => 'Become a Distributor',
],
];

View File

@@ -0,0 +1,102 @@
{extend name="public/base" /}
{block name="style"}
<link rel="stylesheet" type="text/css" href="__CSS__/contactus_message.css" />
{/block}
{block name="main"}
<div class="oricoEGapp">
<!-- 内容 -->
<div class="oricoEGapp-Contact">
<!-- banner -->
{notempty name="focus_image"}
<div class="banner img-responsives margin-top-90">
<a {notempty name="focus_image.link"} href="{$focus_image.link}" {/notempty}>
<img src="{$focus_image.image}" />
</a>
</div>
{/notempty}
<!-- 我们的信息 -->
<div class="content">
<div class="title">{:lang_i18n('我们的信息')}</div>
{notempty name="our_information"}
{assign name="first_info" value="$our_information|array_shift"/}
<div class="info">
{notempty name="first_info.image"}
<div class="left"><img src="{$first_info.image}" /></div>
{/notempty}
<div class="right">
<div class="des">{$first_info.desc|raw}</div>
</div>
</div>
{assign name="chunk_info" value="$our_information|array_chunk=2"}
{volist name="chunk_info" id="chunk"}
<div class="line"></div>
<div class="info">
{notempty name="chunk.0.image"}
<div class="left"><img src="{$chunk.0.image}" /></div>
{/notempty}
<div class="right">
{volist name="chunk" id="info" key="k"}
<div class="info_title {neq name='k' value='1'}m-t-20{/neq}">{$info.title}:</div>
<div class="des"> {$info.desc|raw}</div>
{/volist}
</div>
</div>
{/volist}
{/notempty}
</div>
<!-- question -->
<div class="content">
<div class="title">{:lang_i18n('提交您的问题')}</div>
<form action="" method="post" autocomplete="off">
<div class="question">
<div class="title">{:lang_i18n('姓名')} <span class="red">*</span></div>
<div class="des">
<input type="text" name="name" id="name" placeholder="{:lang_i18n('请输入内容...')}" class="form-control itinp">
</div>
</div>
<div class="question">
<div class="title">{:lang_i18n('电子邮箱')} <span class="red">*</span></div>
<div class="des">
<input type="text" name="email" id="email" placeholder="{:lang_i18n('请输入内容...')}" class="form-control itinp">
</div>
</div>
<div class="question">
<div class="title">{:lang_i18n('您的问题')} <span class="red">*</span></div>
<div class="des">
<textarea rows="6" name="message" id="message" class="ittextarea message" placeholder="{:lang_i18n('请输入内容...')}"></textarea>
</div>
</div>
<div class="question">
<span class="send" id="send">{:lang_i18n('发送')}</span>
</div>
</form>
</div>
<!-- Become a Distributor -->
<div class="contact_b"><a href="{:url('contactus/distributor')}">{:lang_i18n('成为经销商')}</a></div>
</div>
</div>
{/block}
{block name="script"}
<script type="text/javascript">
$(function () {
$("#send").click(function () {
var form = $(this).parents("form");
$.ajax({
url: "{:url('contactus/message')}",
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.msg);
}
})
})
})
</script>
{/block}

View File

@@ -0,0 +1,156 @@
@charset "UTF-8";
.oricoEGapp-Contact {
/*新增*/
}
.oricoEGapp-Contact .banner {
position: relative;
margin-top: 3.3rem;
}
.oricoEGapp-Contact .banner_title {
font-family: "Montserrat-Bold";
font-size: 1.5rem;
position: absolute;
top: 50%;
margin-top: -0.75rem;
color: #fff;
z-index: 9;
text-align: center;
width: 100%;
}
.oricoEGapp-Contact .content {
background-color: #fff;
margin-top: 0.75rem;
padding: 2rem 1.25rem;
color: #000;
}
.oricoEGapp-Contact .title {
font-family: "Montserrat-Bold";
font-size: 1rem;
}
.oricoEGapp-Contact .info {
padding-top: 2.125rem;
padding-bottom: 2rem;
display: flex;
justify-content: flex-start;
}
.oricoEGapp-Contact .info .left {
width: 3rem;
height: 3rem;
margin-right: 1rem;
}
.oricoEGapp-Contact .info .left img {
width: 3rem;
height: 3rem;
}
.oricoEGapp-Contact .info .right .des {
font-family: "Montserrat-Regular";
font-size: 0.875rem;
line-height: 1.25rem;
}
.oricoEGapp-Contact .info_title {
font-family: "Montserrat-Bold";
font-size: 0.875rem;
line-height: 1.25rem;
margin-bottom: 0.22rem;
}
.oricoEGapp-Contact .m-t-20 {
margin-top: 1.11rem;
}
.oricoEGapp-Contact .question {
margin-top: 1.11rem;
}
.oricoEGapp-Contact .question .title {
margin-top: 0.5rem;
font-family: "Montserrat-Bold";
font-size: 0.875rem;
line-height: 1.25rem;
}
.oricoEGapp-Contact .question .des {
margin-top: 0.5rem;
}
.oricoEGapp-Contact .question .des input {
background-color: #f2f2f2;
border-radius: 0.5rem;
padding: 1rem;
width: calc(100% - 2rem);
width: -webkit-calc(100% - 2rem);
width: -moz-calc(100% - 2rem);
}
.oricoEGapp-Contact .question .des textarea {
background-color: #f2f2f2;
border-radius: 0.5rem;
padding: 1rem;
width: calc(100% - 2rem);
border: 1px solid transparent;
}
.oricoEGapp-Contact .send {
display: inline-block;
background-color: #004bfa;
font-family: "Montserrat-Bold";
font-size: 0.875rem;
padding: 0.75rem 1.5rem;
color: #fff;
border-radius: 1.25rem;
}
.oricoEGapp-Contact .red {
color: #ee2f53;
}
.oricoEGapp-Contact .contact_b {
font-family: "Montserrat-SemiBold";
font-size: 1rem;
padding-top: 1.125rem;
padding-bottom: 1.125rem;
color: #004bfa;
width: 100%;
text-align: center;
background-color: #fff;
margin-top: 0.67rem;
}
.oricoEGapp-Contact .contact_b a {
color: #004bfa;
}
.oricoEGapp-Contact .line {
width: 100%;
height: 1px;
background-color: #f1f1f1;
}
.oricoEGapp-Contact input::-webkit-input-placeholder {
color: #9e9e9f;
font-size: 0.875rem;
font-family: "Montserrat-Regular";
}
.oricoEGapp-Contact input:-moz-placeholder {
color: #9e9e9f;
font-size: 0.875rem;
font-family: "Montserrat-Regular";
}
.oricoEGapp-Contact input::-moz-placeholder {
color: #9e9e9f;
font-size: 0.875rem;
font-family: "Montserrat-Regular";
}
.oricoEGapp-Contact input:-ms-input-placeholder {
color: #9e9e9f;
font-size: 0.875rem;
font-family: "Montserrat-Regular";
}
.oricoEGapp-Contact textarea::-webkit-input-placeholder {
color: #9e9e9f;
font-size: 0.875rem;
font-family: "Montserrat-Regular";
}
.oricoEGapp-Contact textarea:-moz-placeholder {
color: #9e9e9f;
font-size: 0.875rem;
font-family: "Montserrat-Regular";
}
.oricoEGapp-Contact textarea::-moz-placeholder {
color: #9e9e9f;
font-size: 0.875rem;
font-family: "Montserrat-Regular";
}
.oricoEGapp-Contact textarea:-ms-input-placeholder {
color: #9e9e9f;
font-size: 0.875rem;
font-family: "Montserrat-Regular";
}