feat: 品牌介绍

app/index/controller/AboutUs.php

@@ -12,6 +12,48 @@ use think\facade\View;
  */
 class AboutUs extends Common
 {
+    /**
+     * 品牌介绍
+     */
+    public function introduction()
+    {
+        $focus_image = [];
+        $why         = [];
+        $service     = [];
+        $difference  = [];
+        // 获取品牌介绍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_680744b1d0000",
+                "BANNER_680744e7cacb3",
+                "BANNER_680744fd0998d",
+                "BANNER_68074513b5d20",
+            ])
+            ->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_680744b1d0000')?->items->first()?->toArray();
+            $why         = data_get($banner_map, 'BANNER_680744e7cacb3')?->items->toArray();
+            $service     = data_get($banner_map, 'BANNER_680744fd0998d')?->items->chunk(4)?->toArray();
+            $difference  = data_get($banner_map, 'BANNER_68074513b5d20')?->items->chunk(4)?->toArray();
+        }
+        View::assign('focus_image', $focus_image);
+        View::assign('why', $why);
+        View::assign('service', $service);
+        View::assign('difference', $difference);
+
+        return View::fetch('introduction');
+    }
+
     /**
      * 品牌故事
      */

app/index/lang/en-us.php

@@ -41,6 +41,12 @@ return [
         'no_data'            => 'No Result！',
         'no_video'           => 'No Video！',
     ],
+    'aboutus_introduction' => [
+        'title'                    => 'Introduction of the Brand',
+        'section_why_title'        => 'Why Choose Us',
+        'section_service_title'    => 'How We Can Help with Customization',
+        'section_difference_title' => 'For Different Situation',
+    ],
     'aboutus_mileage' => [
         'achievement' => 'Our Achievement',
         'events'      => 'Brand Events',

app/index/lang/zh-cn.php

@@ -41,6 +41,12 @@ return [
         'no_data'            => '查询无结果！',
         'no_video'           => '查询无此视频！',
     ],
+    'aboutus_introduction' => [
+        'title'                    => '品牌介绍',
+        'section_why_title'        => '选择我们的理由',
+        'section_service_title'    => '为您提供专属定制服务',
+        'section_difference_title' => '对于不同的情况',
+    ],
     'aboutus_mileage' => [
         'achievement' => 'ORICO荣耀',
         'events'      => '品牌里程',

app/index/route/route.php

@@ -50,6 +50,8 @@ Route::group('faq', function() {
 
 // 关于我们
 Route::group('aboutus', function() {
+    // 品牌介绍
+    Route::get('introduction', 'AboutUs/introduction');
     // 品牌故事
     Route::get('story', 'AboutUs/story');
     // 品牌里程

app/index/view/about_us/introduction.html

@@ -0,0 +1,65 @@
+{extend name="public/base" /}
+{block name="title"}
+{notempty name=":lang('aboutus_introduction.title')"}<title>{:lang('aboutus_introduction.title')}</title>{else/}{__BLOCK__}{/notempty}
+{/block}
+{block name="style"}
+<link rel="stylesheet" href="__CSS__/aboutus_introduction.css" />
+{/block}
+{block name="main"}
+<div class="orico_Page_introduction">
+    <!-- 内容-->
+    <div class="introductionMain">
+        <div class="iotbpage">
+            {notempty name="focus_image"}
+            <img src="{$focus_image.image}" alt="" class="bdimg1">
+            {/notempty}
+            <div class="iotb_bgw">
+                <h1 class="iotbt1">{:lang('aboutus_introduction.section_why_title')}</h1>
+                <div class="iotb_part1">
+                    {notempty name="why"}
+                    {volist name="why" id="wh"}
+                    <div class="iotb_p1_item">
+                        <img src="{$wh.image}" alt="" class="iotbic1">
+                        <p class="iotbtp1">{$wh.title}</p>
+                        <span class="iotbts1">{$wh.desc|raw}</span>
+                    </div>
+                    {/volist}
+                    {/notempty}
+                </div>
+            </div>
+            <div class="iotb_part2" style="background: #fff;">
+                <h1 class="iotbt1">{:lang('aboutus_introduction.section_service_title')}</h1>
+                {notempty name="service"}
+                {volist name="service" id="se"}
+                <div class="fdimgs">
+                    {volist name="se" id="s"}
+                    <div class="fdimgs-div">
+                        <img src="{$s.image}" alt="" class="fbit">
+                        <div class="fdimgs-div-span"></div>
+                        <span>{$s.title}</span>
+                    </div>
+                    {/volist}
+                </div>
+                {/volist}
+                {/notempty}
+            </div>
+        </div>
+        <div class="iotb_part2" style="padding-bottom:0;background: #f2f2f2;">
+            <h1 class="iotbt1">{:lang('aboutus_introduction.section_difference_title')}</h1>
+            {notempty name="difference"}
+            {volist name="difference" id="diff"}
+            <div class="fdimgs fdimgs1">
+                {volist name="diff" id="di"}
+                <div class="fdimgs-div">
+                    <img src="{$di.image}" alt="" class="fbit">
+                    <div class="fdimgs-div-span"></div>
+                    <span>{$di.title}</span>
+                </div>
+                {/volist}
+            </div>
+            {/volist}
+            {/notempty}
+        </div>
+    </div>
+</div>
+{/block}

public/static/index/css/aboutus_introduction.css

@@ -1,10 +1,11 @@
 .orico_Page_introduction {
   width: 100%;
   position: relative;
-  height: 100vh;
+  min-height: 100vh;
   overflow-y: auto;
   overflow-x: hidden;
   background: #f2f2f2;
+  padding-bottom: 90px;
 }
 .orico_Page_introduction .introductionMain {
   display: flex;
@@ -102,6 +103,9 @@
   position: relative;
   text-align: center;
 }
+.orico_Page_introduction .introductionMain .iotb_part2 .fdimgs.fdimgs1 .fdimgs-div {
+  height: 405px;
+}
 .orico_Page_introduction .introductionMain .iotb_part2 .fdimgs .fdimgs-div .fdimgs-div-span {
   position: absolute;
   bottom: 0px;