feat: 联系我们 - 客户服务

app/index/common.php

@@ -1,2 +1,15 @@
 <?php
 // 这是系统自动生成的公共文件
+
+if (!function_exists('str_contains')) {
+    /**
+     * 检查字符串是否包含子字符串
+     * @param string $haystack 要搜索的字符串
+     * @param string $needle 要搜索的子字符串
+     * @return bool
+     */
+    function str_contains(string $haystack, string $needle): bool
+    {
+        return \think\helper\Str::contains($haystack, $needle);
+    }
+}

app/index/controller/ContactUs.php

@@ -11,6 +11,7 @@ use app\index\model\SysBannerModel;
 use app\index\validate\ContactUsDistributorValidate;
 use app\index\validate\ContactUsMessageValidate;
 use think\facade\View;
+use \think\helper\Str;
 
 /**
  * 联系我们控制器
@@ -22,6 +23,36 @@ class ContactUs extends Common
      */
     public function index()
     {
+        $focus_image = [];
+        $info_datas  = [];
+        // 获取banner
+        $banner = SysBannerModel::with(['items' => function($query) {
+                $query->withoutField(['status', 'created_at', 'updated_at', 'deleted_at'])
+                    ->where('status', '=', 1)
+                    ->order(['sort' => 'asc', 'id' => 'desc']);
+            }])
+            ->uniqueLabel(['BANNER_6805e3d32dcc2', 'BANNER_6806090c1838f'])
+            ->language($this->lang_id)
+            ->enabled(true)
+            ->select();
+        if (!$banner->isEmpty()) {
+            $banner_map = [];
+            foreach ($banner as $v) {
+                $banner_map[$v->unique_label] = $v;
+            }
+            $focus_image = data_get($banner_map, 'BANNER_6805e3d32dcc2')?->items->first()?->toArray();
+            $info_datas  = data_get($banner_map, 'BANNER_6806090c1838f')?->items->each(function($item) {
+                if (Str::contains($item->title, '<br/>')) {
+                    $title             = explode('<br/>', $item->title);
+                    $item->title       = $title[0];
+                    $item->title_short = $title[1];
+                }
+                return $item;
+            })->chunk(4)->toArray();
+        }
+        View::assign('focus_image', $focus_image);
+        View::assign('info_datas', $info_datas);
+
         return View::fetch('index');
     }
 

app/index/lang/en-us.php

@@ -46,6 +46,9 @@ return [
         'events'      => 'Brand Events',
         'development' => 'Tech Development',
     ],
+    'contact_index' => [
+        'title'                     => 'contact us',
+    ],
     'contact_message' => [
         'title'                     => 'contact us',
         'our_information'           => 'Our Information',

app/index/lang/zh-cn.php

@@ -46,6 +46,9 @@ return [
         'events'      => '品牌里程',
         'development' => '品牌活动',
     ],
+    'contact_index' => [
+        'title'                     => '客户服务',
+    ],
     'contact_message' => [
         'title'                     => '联系我们',
         'our_information'           => '我们的信息',

app/index/view/contact_us/index.html

@@ -0,0 +1,56 @@
+{extend name="public/base" /}
+{block name="title"}
+<title>{:lang('contact_index.title')}</title>
+{/block}
+{block name="style"}
+<link rel="stylesheet" href="__CSS__/contactus_index.css" />
+{/block}
+{block name="main"}
+<!--banner-->
+{notempty name="focus_image.image"}
+<div class="Swt-Banner position-r" >
+    <img src="{$focus_image.image}" alt="" style="margin-top: 60px;"/>
+</div>
+{/notempty}
+<!--内容-->
+<div class="narskfPage">
+    {notempty name="info_datas"}
+    <div class="narskf-content">
+        {volist name="info_datas" id="items"}
+        <div class="narskf-ct-row">
+            {gt name=":count($items)" value="2"}
+                {volist name="items" id="item"}
+                <a class="narskfit" href="{$item.link}">
+                    <img src="{$item.image}" class="narskico-img" />
+                    <span class="narskf-title">{$item.title}</span>
+                    {notempty name="item.title_short"}
+                    <span class="narskf-sm">{$item.title_short}</span>
+                    {/notempty}
+                    {notempty name="item.desc"}
+                    {if condition="str_contains($item.desc, '<img')"}
+                    <div class="narskfactive-ewm">
+                    {else/}
+                    <div class="narskf-sm narskf-font-26">
+                    {/if}
+                        {$item.desc|raw}
+                    </div>
+                    {/notempty}
+                </a>
+                {/volist}
+            {else/}
+                {volist name="items" id="item"}
+                <div class="narskfit narskfit2">
+                    <img src="{$item.image}" class="narskico-img" />
+                    <div class="narskfit2-ct">
+                        <span class="narskf-title">{$item.title}</span>
+                        <span class="narskf-sm">{$item.desc|raw}</span>
+                    </div>
+                </div>
+                {/volist}
+            {/gt}
+        </div>
+        {/volist}
+    </div>
+    {/notempty}
+</div>
+{/block}

public/static/index/css/contactus_index.css

@@ -0,0 +1,96 @@
+.narskfPage {
+    width: 100%;
+    height: 100%;
+    background: #F5F5F5;
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    overflow-y: auto;
+}
+.narskfPage .narskf-content {
+    display: flex;
+    flex-direction: column;
+    margin: 0 auto;
+    padding-top: 3.5rem;
+    padding-bottom: 9.25rem;
+}
+.narskfPage .narskf-content .narskf-ct-row {
+    width: 100%;
+    display: flex;
+    flex-direction: row;
+    justify-content: space-between;
+}
+.narskfPage .narskf-content .narskf-ct-row .narskfit {
+    width: 18rem;
+    height: 17.25rem;
+    border-radius: 0.125rem;
+    margin-right: 1rem;
+    margin-bottom: 1rem;
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    justify-content: center;
+    background: #fff;
+    cursor: pointer;
+    position: relative;
+}
+.narskfPage .narskf-content .narskf-ct-row .narskfit .narskf-title {
+    color: #262626;
+    font-size: 1.125rem;
+    padding-top: 1.6875rem;
+    padding-bottom: 0.375rem;
+}
+.narskfPage .narskf-content .narskf-ct-row .narskfit .narskf-sm {
+    color: #9a9a9a;
+    font-size: 1rem;
+}
+.narskfPage .narskf-content .narskf-ct-row .narskfit .narskf-font-26 {
+    color: #262626 !important;
+}
+.narskfPage .narskf-content .narskf-ct-row .narskfit .narskico-img {
+    width: 3.75rem;
+    height: 3.75rem;
+}
+.narskfPage .narskf-content .narskf-ct-row .narskfit .narskfactive-ewm {
+    width: 100%;
+    height: 100%;
+    position: absolute;
+    top: 0;
+    z-index: 1;
+    display: none;
+    align-items: center;
+    justify-content: center;
+}
+.narskfPage .narskf-content .narskf-ct-row .narskfit .narskfactive-ewm p,
+.narskfPage .narskf-content .narskf-ct-row .narskfit .narskfactive-ewm img {
+    width: 11rem;
+    width: 11rem;
+}
+.narskfPage .narskf-content .narskf-ct-row .narskfit2 {
+    width: 37rem;
+    height: 11.25rem;
+    flex-direction: row;
+}
+.narskfPage .narskf-content .narskf-ct-row .narskfit2 .narskico-img {
+    margin-right: 1.5rem;
+}
+.narskfPage .narskf-content .narskf-ct-row .narskfit2 .narskfit2-ct {
+    display: flex;
+    flex-direction: column;
+    text-align: left;
+}
+.narskfPage .narskf-content .narskf-ct-row .narskfit2 .narskfit2-ct .narskf-title {
+    padding-top: 0;
+    font-size: 1.5rem;
+    padding-bottom: 0.375rem;
+}
+.narskfPage .narskf-content .narskf-ct-row .narskfit2 .narskfit2-ct .narskf-sm {
+    font-size: 1.25rem;
+    color: #9A9A9A;
+}
+.narskfPage .narskf-content .narskf-ct-row .narskfit:last-child {
+    margin-right: 0rem;
+}
+.narskfPage .narskf-content .narskf-ct-row .narskfit:hover .narskfactive-ewm {
+    display: flex;
+}