feat: 模板区分pc与mobile

app/index/view/pc/product/newpro.html

@@ -0,0 +1,57 @@
+{extend name="public/base" /}
+{block name="style"}
+<link rel="stylesheet" href="__CSS__/product_newpro.css">
+{/block}
+{block name="main"}
+<div class="orico_Page_newproducts">
+  <!-- 新品-->
+  <!-- 主打产品banner轮播 -->
+  <div class="opdBanner">
+    {volist name="focus_image" id="fo"}
+    <a {notempty name="fo.link" }href="{$fo.link}" {/notempty}><img src="{$fo.image}" class="opdbannerImg" /></a>
+    {/volist}
+  </div>
+  <div class="oricoNewPrMain">
+    {volist name="newpros" id="vo"}
+    <div class="cat">
+      <h1 class="ori-pd-title">
+        <div class="catname">{$vo.category.name}</div>
+      </h1>
+      <div class="ori-pd-list">
+        {volist name="vo.products" id="pro"}
+        <a class="oripditem" href="{:url('product/detail', ['id' => $pro.id])}">
+          <img src="{:thumb($pro.cover_image)}" class="prdimg prdimg-show" />
+          <div class="prdName">{$pro.name}</div>
+          <div class="prddec">{$pro.spu}</div>
+          {eq name="pro.is_new" value="1"}
+          <div class="newcp">New</div>
+          {/eq}
+        </a>
+        {/volist}
+      </div>
+    </div>
+    {/volist}
+  </div>
+</div>
+{/block}
+{block name="script"}
+<script type="text/javascript">
+  $(function () {
+    // 显示第一张图片
+    $('.opdbannerImg').eq(0).show();
+    let currentIndex = 0;
+    const imgCount = $('.opdbannerImg').length;
+    setInterval(() => {
+      // 淡出当前图片
+      $('.opdbannerImg').eq(currentIndex).fadeTo(10, 0, () => {
+        // 隐藏当前图片
+        $('.opdbannerImg').eq(currentIndex).hide();
+        // 计算下一张图片的索引
+        currentIndex = (currentIndex + 1) % imgCount;
+        // 显示并淡入下一张图片
+        $('.opdbannerImg').eq(currentIndex).show().fadeTo(10, 1);
+      });
+    }, 10000);
+  });
+</script>
+{/block}