Merge branch 'dev'

app/admin/controller/v1/System.php

@@ -366,6 +366,18 @@ class System
                         'url'  => (string)url('/index/topic/laptop/index')
                     ],
                 ]
+            ],
+            [
+                'id'       => 9,
+                'name'     => '闪存（SSD）专题',
+                'url'      => '',
+                'children' => [
+                    [
+                        'id'   => 101,
+                        'name' => '首页',
+                        'url'  => (string)url('/index/topic/ssd/index')
+                    ],
+                ]
             ]
         ];
     }
@@ -413,7 +425,7 @@ class System
                 break;
         }
         if (empty($data)) return [];
-        
+
         return [
             'id'   => $data['id'],
             'name' => $data['name'],
@@ -438,4 +450,4 @@ class System
 
         return [];
     }
-}
+}

app/index/controller/TopicSsd.php

@@ -0,0 +1,52 @@
+<?php
+declare (strict_types = 1);
+
+namespace app\index\controller;
+
+use app\index\model\SysBannerModel;
+use think\facade\View;
+
+/**
+ * 专题 - SSD
+ */
+class TopicSsd extends Common
+{
+    /**
+     * 专题 - SSD首页
+     */
+    public function index()
+    {
+        $banners = SysBannerModel::with([
+                'items' => function ($query) {
+                    $query->withoutField(['sort', 'created_at', 'updated_at', 'deleted_at'])
+                        ->order(['sort' => 'asc', 'id' => 'desc'])
+                        ->enabled(true);
+                }
+            ])
+            ->atPlatform(request()->from)
+            ->uniqueLabel([
+                'BANNER_69faaf8582967', // 专题 - 闪存（SSD）首页 - 焦点图
+                'BANNER_69fab1bed8f71', // 专题 - 闪存（SSD）首页 - 产品
+            ])
+            ->language($this->lang_id)
+            ->enabled(true)
+            ->order(['sort' => 'asc', 'id' => 'desc'])
+            ->select();
+
+        $data = [];
+        if (!$banners->isEmpty()) {
+            $banners_map = [];
+            foreach ($banners as $banner) {
+                $banners_map[$banner->unique_label] = $banner;
+            }
+
+            // 焦点图轮播图
+            $data['top_focus_images'] = data_get($banners_map, 'BANNER_69faaf8582967')?->items->toArray();
+            // 产品
+            $data['products'] = data_get($banners_map, 'BANNER_69fab1bed8f71')?->items->toArray();
+        }
+        View::assign('data', $data);
+
+        return View::fetch('index');
+    }
+}

app/index/route/route.php

@@ -119,6 +119,12 @@ Route::group('topic', function () {
         // 专题 - 笔记本电脑首页
         Route::get('index', 'TopicLaptop/index');
     });
+
+    // 专题 - SSD
+    Route::group('ssd', function() {
+        // 专题 - SSD首页
+        Route::get('index', 'TopicSsd/index');
+    });
 });
 
 // 数据迁移

app/index/view/mobile/topic_ssd/index.html

@@ -0,0 +1,43 @@
+{extend name="public/base" /}
+{block name="style"}
+<link rel="stylesheet" href="__CSS__/topic_laptop/header.css">
+<link rel="stylesheet" href="__CSS__/topic_laptop/footer.css">
+<link rel="stylesheet" href="__CSS__/topic_ssd/index.css">
+<!-- 将rem适配JS移到这里，确保优先执行 -->
+<script type="text/javascript">
+    (function (doc, win)
+    {
+        var docEl = doc.documentElement;
+        var resizeEvt = 'orientationchange' in window ? 'orientationchange' : 'resize';
+
+        function setRootFontSize ()
+        {
+            var clientWidth = docEl.clientWidth;
+            if (!clientWidth) return;
+            var fontSize = clientWidth / 7.5;
+            // 直接修改内联样式，优先级最高
+            docEl.setAttribute('style', 'font-size: ' + fontSize + 'px !important;');
+        }
+
+        setRootFontSize();
+        win.addEventListener(resizeEvt, setRootFontSize);
+        doc.addEventListener('DOMContentLoaded', setRootFontSize);
+    })(document, window);
+</script>
+{/block}
+{block name="main"}
+<div class="m-sc-main" style="margin-top:42px;">
+    {volist name="data.top_focus_images" id="item"}
+    <a href="{$item.link}"  class="m-sc-mt20">
+        <img src="{$item.image}" alt="" class="m-sc-main-img" loading="lazy">
+    </a>
+    {/volist}
+    <div class="m-sc-main-imgs m-sc-mt20 m-sc-mb34">
+        {volist name="data.products" id="item"}
+        <a href="{$item.link}"  class="">
+            <img src="{$item.image}" alt="" class="m-sc-main-img1" loading="lazy">
+        </a>
+        {/volist}
+    </div>
+</div>
+{/block}

app/index/view/pc/topic_ssd/index.html

@@ -0,0 +1,44 @@
+{extend name="public/base" /}
+{block name="style"}
+<link rel="stylesheet" href="__CSS__/topic_laptop/header.css">
+<link rel="stylesheet" href="__CSS__/topic_laptop/footer.css">
+<link rel="stylesheet" href="__CSS__/topic_ssd/index.css">
+<script type="text/javascript">
+    (function (doc, win)
+    {
+        var docEl = doc.documentElement;
+        var resizeEvt = 'orientationchange' in window ? 'orientationchange' : 'resize';
+        var designWidth = 2560;
+        var designRemPx = 100;
+        function setRootFontSize ()
+        {
+            var clientWidth = docEl.clientWidth;
+            if (!clientWidth) return;
+            var fontSize = (clientWidth / designWidth) * designRemPx;
+            fontSize = Math.max(fontSize, 20);
+            fontSize = Math.min(fontSize, designRemPx);
+            docEl.style.fontSize = fontSize + 'px';
+        }
+
+        setRootFontSize();
+        win.addEventListener(resizeEvt, setRootFontSize);
+        doc.addEventListener('DOMContentLoaded', setRootFontSize);
+    })(document, window);
+</script>
+{/block}
+{block name="main"}
+<div class="sc-main">
+    {volist name="data.top_focus_images" id="item"}
+    <a href="{$item.link}"  class="sc-mt20">
+        <img src="{$item.image}" alt="" class="sc-main-img" loading="lazy">
+    </a>
+    {/volist}
+    <div class="sc-main-imgs sc-mt20 sc-mb-78">
+        {volist name="data.products" id="item"}
+        <a href="{$item.link}"  class="">
+            <img src="{$item.image}" alt="" class="sc-main-img1" loading="lazy">
+        </a>
+        {/volist}
+    </div>
+</div>
+{/block}

public/static/index/mobile/css/topic_ssd/index.css

@@ -0,0 +1,65 @@
+* {
+	margin: 0;
+	padding: 0;
+}
+html {
+	width: 100% !important;
+	overflow-x: hidden;
+    margin: 0 !important;
+    padding: 0 !important;
+    max-width: 100vw !important;
+}
+body {
+	width: 100%;
+	background: #fff;
+	overflow-x: hidden;
+    margin: 0 !important;
+    padding: 0 !important;
+    max-width: 100vw !important;
+}
+.m-sc-main {
+    width: 100%;
+    height: 100%;
+}
+
+a {
+    text-decoration: none;
+    display: block;
+}
+
+img {
+    display: block;
+}
+
+.m-sc-main-img {
+    width: 100%;
+    /* max-width: 2560px; */
+}
+
+.m-sc-mt20 {
+    margin-top: 0.1rem;
+}
+.m-sc-mt20:first-child {
+    margin-top: 0 !important;
+}
+.m-sc-mb34 {
+    margin-bottom: 0.34rem;
+}
+.m-sc-main-imgs {
+    display: grid;
+    grid-template-columns: 1fr 1fr;
+    gap: 0.1rem;
+    list-style: none;
+    /* 去除列表样式（如果有） */
+}
+
+.m-sc-main-imgs a {
+    display: block;
+}
+
+.m-sc-main-img1 {
+    width: 100%;
+    height: auto;
+    /* 保持比例 */
+    display: block;
+}

public/static/index/pc/css/topic_ssd/index.css

@@ -0,0 +1,68 @@
+
+html {
+    width: 100%;
+}
+body {
+	/* width: 100vw;
+	height: 100vh; */
+	background: #fff;
+	overflow-x: hidden;
+    scroll-behavior: smooth !important;
+    -webkit-overflow-scrolling: touch !important;
+}
+/* 当视口宽度大于1920px时生效 */
+@media screen and (min-width: 1920px) {
+    /* 这里写你的样式 */
+    body {
+        max-width:100% !important;
+        width: 100vw !important;
+    }
+   
+}
+.sc-main {
+    width: 100%;
+    height: 100%;
+    max-width: 2560px;
+    margin: 0 auto;
+}
+
+a {
+    text-decoration: none;
+    display: block;
+}
+
+img {
+    display: block;
+}
+
+.sc-main-img {
+    width: 100%;
+    max-width: 2560px;
+}
+.sc-mt20:first-child {
+    margin-top: 0 !important;
+}
+.sc-mt20 {
+    margin-top: 0.2rem;
+}
+.sc-mb-78 {
+    margin-bottom: 0.78rem;
+}
+.sc-main-imgs {
+    display: grid;
+    grid-template-columns: 1fr 1fr;
+    gap: 0.2rem;
+    list-style: none;
+    /* 去除列表样式（如果有） */
+}
+
+.sc-main-imgs a {
+    display: block;
+}
+
+.sc-main-img1 {
+    width: 100%;
+    height: auto;
+    /* 保持比例 */
+    display: block;
+}