Compare commits
5 Commits
b83a5c665c
...
eefc81784f
| Author | SHA1 | Date | |
|---|---|---|---|
| eefc81784f | |||
|
|
64969ea916 | ||
|
|
1e0565cdb6 | ||
|
|
0a0a20ebf9 | ||
| ce5d0244c0 |
@@ -13,6 +13,7 @@ use app\index\model\ProductRelatedModel;
|
||||
use app\index\model\ProductSkuAttrModel;
|
||||
use app\index\model\ProductSkuModel;
|
||||
use app\index\model\SysBannerModel;
|
||||
use app\index\model\SysBannerProdCateMappingModel;
|
||||
use app\index\validate\ProductInquiryValidate;
|
||||
use think\facade\View;
|
||||
use think\helper\Arr;
|
||||
@@ -22,12 +23,50 @@ use think\helper\Arr;
|
||||
*/
|
||||
class Product extends Common
|
||||
{
|
||||
// 获取分类页的banner图焦点横幅
|
||||
private function getCategoryBanner($category_id)
|
||||
{
|
||||
$focus_image = [];
|
||||
// 获取产品分类页焦点横幅
|
||||
$banner = SysBannerModel::with(['items' => function($query) use($category_id) {
|
||||
$query->withoutField([
|
||||
'status',
|
||||
'created_at',
|
||||
'updated_at',
|
||||
'deleted_at'
|
||||
])
|
||||
->whereExists(function($q) use($category_id) {
|
||||
$r = $q->getModel()->getTable();
|
||||
$m = new SysBannerProdCateMappingModel;
|
||||
$q->model($m)->name($m->getName())
|
||||
->where("banner_item_id = $r.id")
|
||||
->where('product_category_id' , '=', $category_id);
|
||||
})
|
||||
->where('status', '=', 1)
|
||||
->order(['sort' => 'asc', 'id' => 'desc']);
|
||||
}])
|
||||
->uniqueLabel(['BANNER_6808abd813d78'])
|
||||
->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_6808abd813d78')?->items->toArray();
|
||||
}
|
||||
return $focus_image;
|
||||
}
|
||||
// 产品分类 - 查看顶层分类
|
||||
public function category()
|
||||
{
|
||||
// 参数
|
||||
$param = request()->param(['id']);
|
||||
|
||||
// 获取产品分类页焦点横幅
|
||||
View::assign('focus_image', $this->getCategoryBanner($param['id']));
|
||||
|
||||
// 获取分类及产品信息
|
||||
$categorys_data = ProductCategoryModel::field(['id', 'pid', 'name', 'path', 'level'])
|
||||
->language($this->lang_id)
|
||||
@@ -96,11 +135,13 @@ class Product extends Common
|
||||
foreach ($pros as $pro) {
|
||||
$pros_map[$pro['group_mark']][] = $pro;
|
||||
}
|
||||
foreach ($list as &$it) {
|
||||
if (isset($pros_map[$it['id']])) {
|
||||
$it['products'] = $pros_map[$it['id']];
|
||||
}
|
||||
foreach ($list as $k => &$it) {
|
||||
unset($it['children']);
|
||||
if (!isset($pros_map[$it['id']])) {
|
||||
unset($list[$k]);
|
||||
continue;
|
||||
}
|
||||
$it['products'] = $pros_map[$it['id']];
|
||||
}
|
||||
unset($it);
|
||||
}
|
||||
@@ -116,30 +157,8 @@ class Product extends Common
|
||||
// 参数
|
||||
$param = request()->param(['id']);
|
||||
|
||||
$focus_image = [];
|
||||
// 获取产品分类页焦点横幅
|
||||
$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_6808abd813d78'])
|
||||
->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_6808abd813d78')?->items->toArray();
|
||||
}
|
||||
View::assign('focus_image', $focus_image);
|
||||
View::assign('focus_image', $this->getCategoryBanner($param['id']));
|
||||
|
||||
// 获取分类及产品信息
|
||||
$categorys_data = ProductCategoryModel::field(['id', 'name', 'level'])
|
||||
@@ -496,7 +515,7 @@ class Product extends Common
|
||||
}
|
||||
|
||||
foreach ($pro_map as $k => $pro) {
|
||||
if (in_array($val['id'], explode(',', $k))) {
|
||||
if (in_array($val['id'], explode(',', strval($k)))) {
|
||||
$newpros[] = [
|
||||
'category' => $val,
|
||||
'products' => $pro,
|
||||
|
||||
15
app/index/model/SysBannerProdCateMappingModel.php
Normal file
15
app/index/model/SysBannerProdCateMappingModel.php
Normal file
@@ -0,0 +1,15 @@
|
||||
<?php
|
||||
declare (strict_types = 1);
|
||||
|
||||
namespace app\index\model;
|
||||
|
||||
use app\common\model\SysBannerProdCateMappingBaseModel;
|
||||
|
||||
/**
|
||||
* banner与产品分类关联表模型
|
||||
* @mixin \think\Model
|
||||
*/
|
||||
class SysBannerProdCateMappingModel extends SysBannerProdCateMappingBaseModel
|
||||
{
|
||||
//
|
||||
}
|
||||
@@ -16,6 +16,8 @@ Route::get('/', 'Index/index');
|
||||
Route::group('product', function () {
|
||||
// 产品分类页
|
||||
Route::get('category/:id', 'Product/category');
|
||||
// 产品分类 - 查看子类
|
||||
Route::get('subcategory/:id', 'Product/subcategory');
|
||||
// 产品详情页
|
||||
Route::get('detail/:id', 'Product/detail');
|
||||
// 产品询盘
|
||||
|
||||
@@ -1,71 +0,0 @@
|
||||
{extend name="public/base" /}
|
||||
{block name="style"}
|
||||
<link rel="stylesheet" href="__CSS__/category.css" type="text/css" />
|
||||
{/block}
|
||||
{block name="main"}
|
||||
<div class="orico_Page_products">
|
||||
{notempty name="focus_image"}
|
||||
<div class="focus_image">
|
||||
{volist name="focus_image" id="fimg"}
|
||||
<a {notempty name="fimg.link"}href="{$fimg.link}"{/notempty}><img src="{$fimg.image}" alt="" /></a>
|
||||
{/volist}
|
||||
</div>
|
||||
{/notempty}
|
||||
<!-- 首页主题内容 -->
|
||||
<div class="pageMain">
|
||||
{notempty name="categorys_data"}
|
||||
{volist name="categorys_data" id="vo"}
|
||||
<div class="ori-pd-title">
|
||||
<span>{$vo.name}</span>
|
||||
{eq name="vo.level" value="2"}
|
||||
<a href="{:url('product/category', ['id' => $vo.id])}">查看更多</a>
|
||||
{/eq}
|
||||
</div>
|
||||
{notempty name="vo.products"}
|
||||
<div class="ori-pd-list">
|
||||
{volist name="vo.products" id="vp"}
|
||||
<a class="oripditem" href="{:url('product/detail', ['id' => $vp.id])}">
|
||||
<div>
|
||||
{volist name="vp.sku" id="vs" key="vs_idx"}
|
||||
<img src="{$vs.main_image}" id="sku_image_{$vs.id}" class="prdimg {eq name='vs_idx' value='1'}prdimg-show{/eq}" />
|
||||
{/volist}
|
||||
</div>
|
||||
<div class="prdName">{$vp.name}</div>
|
||||
<div class="prddec">{$vp.spu}</div>
|
||||
{notempty name="vp.colors"}
|
||||
<div class="prd-colors">
|
||||
{volist name="vp.colors" id="vc" key="vc_idx"}
|
||||
<div class="prdolorit {eq name='vc_idx' value='1'}on{/eq}" data-sku_id="{$vc.sku_id}">
|
||||
{assign name="color_type" value=":rgb_or_image($vc.attr_value)" /}
|
||||
{eq name="color_type" value="IMAGE"}
|
||||
<img src="{$vc.attr_value}" />
|
||||
{elseif condition="$color_type == 'RGB'" /}
|
||||
<span class="rgb_hex" {:style(['background-color'=>$vc.attr_value])}></span>
|
||||
{/eq}
|
||||
</div>
|
||||
{/volist}
|
||||
</div>
|
||||
{/notempty}
|
||||
</a>
|
||||
{/volist}
|
||||
</div>
|
||||
{/notempty}
|
||||
{/volist}
|
||||
{/notempty}
|
||||
</div>
|
||||
</div>
|
||||
{/block}
|
||||
{block name="script"}
|
||||
<script type="text/javascript">
|
||||
$(function () {
|
||||
$('.prd-colors .prdolorit').click(function(event) {
|
||||
event.stopPropagation();
|
||||
event.preventDefault();
|
||||
|
||||
var sku_id = $(this).data('sku_id');
|
||||
$('#sku_image_' + sku_id).addClass('prdimg-show').siblings().removeClass('prdimg-show');
|
||||
$(this).addClass('on').siblings().removeClass('on');
|
||||
});
|
||||
})
|
||||
</script>
|
||||
{/block}
|
||||
@@ -4,7 +4,17 @@
|
||||
{/block}
|
||||
{block name="main"}
|
||||
<div class="orico_Page_category">
|
||||
<!--首页主题内容 -->
|
||||
<!-- banner轮播 -->
|
||||
{notempty name="focus_image"}
|
||||
<div class="opdBanner">
|
||||
{volist name="focus_image" id="fi"}
|
||||
<a {notempty name="fi.link" }href="{$fi.link}" {/notempty}>
|
||||
<img src="{$fi.image}" class="opdbannerImg" />
|
||||
</a>
|
||||
{/volist}
|
||||
</div>
|
||||
{/notempty}
|
||||
<!--分类/产品内容 -->
|
||||
<div class="pageMain">
|
||||
{volist name="list" id="vo"}
|
||||
<div class="cat">
|
||||
@@ -15,6 +25,7 @@
|
||||
<img src="/static/index/images/more.png" class="catmoreImg" />
|
||||
</a>
|
||||
</div>
|
||||
{notempty name="vo.products"}
|
||||
<div class="ori-pd-list">
|
||||
{volist name="vo.products" id="pro"}
|
||||
<a class="oripditem" href="{:url('product/detail', ['id' => $pro.id])}">
|
||||
@@ -29,8 +40,30 @@
|
||||
</a>
|
||||
{/volist}
|
||||
</div>
|
||||
{/notempty}
|
||||
</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}
|
||||
@@ -4,32 +4,83 @@
|
||||
{/block}
|
||||
{block name="main"}
|
||||
<div class="orico_Page_subcategory">
|
||||
<!--公共头部-->
|
||||
<iframe align="center" width="100%" height="60" src="head.html" frameborder="no" border="0" marginwidth="0"
|
||||
marginheight="0" scrolling="no"></iframe>
|
||||
<!-- 这个图片可能有可能没有-->
|
||||
<img src="/static/index/images/SSD-1920x900-CN.jpg" class="sbbanner">
|
||||
<!--首页主题内容 -->
|
||||
<div class="pageMain">
|
||||
<h1 class="ori-pd-title">Power Strip</h1>
|
||||
<div class="ori-pd-list">
|
||||
<a class="oripditem">
|
||||
<div>
|
||||
<img src="/static/index/images/prtest.jpg" class="prdimg prdimg-show" />
|
||||
<img src="/static/index/images/prtest1.jpg" class="prdimg" />
|
||||
</div>
|
||||
<div class="prdName">ORICO 5 in 1 Travel Power Strip</div>
|
||||
<div class="prddec">ORICO-AP3-2A3U</div>
|
||||
<div class="prd-colors">
|
||||
<div class="prdolorit on">
|
||||
<img src="/static/index/images/WH.jpg">
|
||||
</div>
|
||||
<div class="prdolorit">
|
||||
<img src="/static/index/images/BK.jpg">
|
||||
</div>
|
||||
</div>
|
||||
{notempty name="focus_image"}
|
||||
<div class="opdBanner">
|
||||
{volist name="focus_image" id="fi"}
|
||||
<a {notempty name="fi.link"}href="{$fi.link}"{/notempty}>
|
||||
<img src="{$fi.image}" alt="" class="opdbannerImg" />
|
||||
</a>
|
||||
{/volist}
|
||||
</div>
|
||||
{/notempty}
|
||||
<!-- 首页主题内容 -->
|
||||
<div class="pageMain">
|
||||
{notempty name="categorys_data"}
|
||||
{volist name="categorys_data" id="vo"}
|
||||
<div class="ori-pd-title">
|
||||
<span>{$vo.name}</span>
|
||||
</div>
|
||||
{notempty name="vo.products"}
|
||||
<div class="ori-pd-list">
|
||||
{volist name="vo.products" id="vp"}
|
||||
<a class="oripditem" href="{:url('product/detail', ['id' => $vp.id])}">
|
||||
<div>
|
||||
{volist name="vp.sku" id="vs" key="vs_idx"}
|
||||
<img src="{$vs.main_image}" id="sku_image_{$vs.id}" class="prdimg {eq name='vs_idx' value='1'}prdimg-show{/eq}" />
|
||||
{/volist}
|
||||
</div>
|
||||
<div class="prdName">{$vp.name}</div>
|
||||
<div class="prddec">{$vp.spu}</div>
|
||||
{notempty name="vp.colors"}
|
||||
<div class="prd-colors">
|
||||
{volist name="vp.colors" id="vc" key="vc_idx"}
|
||||
<div class="prdolorit {eq name='vc_idx' value='1'}on{/eq}" data-sku_id="{$vc.sku_id}">
|
||||
{assign name="color_type" value=":rgb_or_image($vc.attr_value)" /}
|
||||
{eq name="color_type" value="IMAGE"}
|
||||
<img src="{$vc.attr_value}" />
|
||||
{elseif condition="$color_type == 'RGB'" /}
|
||||
<span class="rgb_hex" {:style(['background-color'=>$vc.attr_value])}></span>
|
||||
{/eq}
|
||||
</div>
|
||||
{/volist}
|
||||
</div>
|
||||
{/notempty}
|
||||
</a>
|
||||
{/volist}
|
||||
</div>
|
||||
{/notempty}
|
||||
{/volist}
|
||||
{/notempty}
|
||||
</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);
|
||||
|
||||
$('.prd-colors .prdolorit').click(function(event) {
|
||||
event.stopPropagation();
|
||||
event.preventDefault();
|
||||
|
||||
var sku_id = $(this).data('sku_id');
|
||||
$('#sku_image_' + sku_id).addClass('prdimg-show').siblings().removeClass('prdimg-show');
|
||||
$(this).addClass('on').siblings().removeClass('on');
|
||||
});
|
||||
})
|
||||
</script>
|
||||
{/block}
|
||||
@@ -25,16 +25,15 @@
|
||||
</ul>
|
||||
<!-- 右边子菜单-->
|
||||
{volist name="header_categorys" id="vo" key="idx"}
|
||||
<div class="navItem_cyright" {eq name="idx" value="1" }style="display: block;"
|
||||
{else/}style="display: none;" {/eq}>
|
||||
<div class="navItem_cyright" {eq name="idx" value="1" }style="display: block;"{else/}style="display: none;"{/eq}>
|
||||
{volist name="vo.children" id="vc"}
|
||||
<dl class="nav_cyrightit">
|
||||
<dt>
|
||||
<a href="{:url('product/category', ['id' => $vc.id])}">{$vc.name}</a>
|
||||
<a href="{:url('product/subcategory', ['id' => $vc.id])}">{$vc.name}</a>
|
||||
</dt>
|
||||
{volist name="vc.children" id="vcc"}
|
||||
<dd>
|
||||
<a href="{:url('product/category', ['id' => $vcc.id])}">{$vcc.name}</a>
|
||||
<a href="{:url('product/subcategory', ['id' => $vcc.id])}">{$vcc.name}</a>
|
||||
</dd>
|
||||
{/volist}
|
||||
</dl>
|
||||
|
||||
@@ -19,6 +19,7 @@
|
||||
</div>
|
||||
<!-- 赛博云 -->
|
||||
{notempty name="data.cyber"}
|
||||
<!-- narssben-us 这个样式如果是中文就去掉 如果是因为就加在narssbshow后面-->
|
||||
<div class="nDtopCtMian narssbshow narssben-us">
|
||||
{notempty name="data.cyber.focus_image"}
|
||||
<div class="nDtopIt">
|
||||
|
||||
@@ -1,153 +0,0 @@
|
||||
.orico_Page_OEMandODM {
|
||||
width: 100%;
|
||||
position: relative;
|
||||
height: 100vh;
|
||||
overflow-y: auto;
|
||||
overflow-x: hidden;
|
||||
background: #f2f2f2;
|
||||
}
|
||||
.orico_Page_OEMandODM .OEMandODMpageMain {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
.orico_Page_OEMandODM .OEMandODMpageMain .iotbpage {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
position: relative;
|
||||
}
|
||||
.orico_Page_OEMandODM .OEMandODMpageMain .iotbpage .bdimg1 {
|
||||
width: 100%;
|
||||
}
|
||||
.orico_Page_OEMandODM .OEMandODMpageMain .iotbpage .iotb_bgw {
|
||||
width: 100%;
|
||||
background-color: #fff;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
}
|
||||
.orico_Page_OEMandODM .OEMandODMpageMain .iotbpage .iotb_bgw .iotbt1 {
|
||||
font-size: 2rem;
|
||||
font-family: Montserrat-Bold, Montserrat;
|
||||
padding-bottom: 4.0625rem;
|
||||
padding-top: 5.5rem;
|
||||
font-weight: 700;
|
||||
}
|
||||
.orico_Page_OEMandODM .OEMandODMpageMain .iotbpage .iotb_bgw .iotb_part1 {
|
||||
width: 75%;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: space-between;
|
||||
padding-bottom: 6.25rem;
|
||||
align-items: baseline;
|
||||
}
|
||||
.orico_Page_OEMandODM .OEMandODMpageMain .iotbpage .iotb_bgw .iotb_part1 .iotb_p1_item {
|
||||
width: 21rem;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
.orico_Page_OEMandODM .OEMandODMpageMain .iotbpage .iotb_bgw .iotb_part1 .iotb_p1_item .iotbic1 {
|
||||
width: 6.25rem;
|
||||
height: 6.25rem;
|
||||
margin-bottom: 1.25rem;
|
||||
}
|
||||
.orico_Page_OEMandODM .OEMandODMpageMain .iotbpage .iotb_bgw .iotb_part1 .iotb_p1_item .iotbtp1 {
|
||||
font-size: 18px;
|
||||
font-family: Montserrat-Bold, Montserrat;
|
||||
font-weight: bold;
|
||||
padding-bottom: 18px;
|
||||
}
|
||||
.orico_Page_OEMandODM .OEMandODMpageMain .iotbpage .iotb_bgw .iotb_part1 .iotb_p1_item .iotbts1 {
|
||||
text-align: center;
|
||||
font-size: 16px;
|
||||
font-family: Montserrat-Medium, Montserrat;
|
||||
color: #9e9e9f;
|
||||
}
|
||||
.orico_Page_OEMandODM .OEMandODMpageMain .iotbpage .iotb_part22 {
|
||||
padding-bottom: 5.625rem;
|
||||
background: #fff;
|
||||
width: 100%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
.orico_Page_OEMandODM .OEMandODMpageMain .iotbpage .iotb_part22 .iotbt1 {
|
||||
font-size: 32px;
|
||||
font-family: Montserrat-Bold, Montserrat;
|
||||
padding-bottom: 65px;
|
||||
padding-top: 88px;
|
||||
font-weight: 700;
|
||||
}
|
||||
.orico_Page_OEMandODM .OEMandODMpageMain .iotbpage .iotb_part22 .fdimgs {
|
||||
width: 70%;
|
||||
padding-bottom: 1.25rem;
|
||||
margin: 0 auto;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
}
|
||||
.orico_Page_OEMandODM .OEMandODMpageMain .iotbpage .iotb_part22 .fdimgs .fdimgs-div {
|
||||
width: 20rem;
|
||||
height: 15.9375rem;
|
||||
text-align: center;
|
||||
background: #fff;
|
||||
border-radius: 8px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
overflow: hidden;
|
||||
position: relative;
|
||||
}
|
||||
.orico_Page_OEMandODM .OEMandODMpageMain .iotbpage .iotb_part22 .fdimgs .fdimgs-div .fdimgs-div-span {
|
||||
position: absolute;
|
||||
bottom: 0px;
|
||||
z-index: 9999;
|
||||
background: linear-gradient(0deg, rgba(0, 0, 0, 0.5), rgba(200, 200, 200, 0.1));
|
||||
height: 45px;
|
||||
width: 100%;
|
||||
}
|
||||
.orico_Page_OEMandODM .OEMandODMpageMain .iotbpage .iotb_part22 .fdimgs .fdimgs-div .fdtitle {
|
||||
font-size: 18px;
|
||||
font-weight: bold;
|
||||
z-index: 9999;
|
||||
position: absolute;
|
||||
bottom: 0px;
|
||||
left: 0;
|
||||
right: 0;
|
||||
color: #fff;
|
||||
line-height: 45px;
|
||||
}
|
||||
.orico_Page_OEMandODM .OEMandODMpageMain .iotb_part2 {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
.orico_Page_OEMandODM .OEMandODMpageMain .iotb_part2 .iotbt1 {
|
||||
font-size: 32px;
|
||||
font-family: Montserrat-Bold, Montserrat;
|
||||
padding-bottom: 65px;
|
||||
padding-top: 88px;
|
||||
font-weight: 700;
|
||||
}
|
||||
.orico_Page_OEMandODM .OEMandODMpageMain .iotb_part2 .fdimgs {
|
||||
width: 70%;
|
||||
padding-bottom: 110px;
|
||||
margin: 0 auto;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
}
|
||||
.orico_Page_OEMandODM .OEMandODMpageMain .iotb_part2 .fdimgs img {
|
||||
border-style: none;
|
||||
font-size: 0;
|
||||
}
|
||||
@@ -1,115 +0,0 @@
|
||||
@charset "UTF-8";
|
||||
.orico_Page_products {
|
||||
width: 100%;
|
||||
position: relative;
|
||||
min-height: 100vh;
|
||||
overflow-y: auto;
|
||||
overflow-x: hidden;
|
||||
background: #f9f9f9;
|
||||
}
|
||||
.oricoCont{
|
||||
background: #f9f9f9;
|
||||
}
|
||||
.orico_Page_products .focus_image {
|
||||
padding-top: 3.75rem;
|
||||
}
|
||||
.orico_Page_products .focus_image img {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
object-fit: cover;
|
||||
}
|
||||
.orico_Page_products span{
|
||||
font-size: 24px;
|
||||
}
|
||||
.orico_Page_products p, .orico_Page_products a, .orico_Page_products div, .orico_Page_products span {
|
||||
font-family: "Microsoft YaHei", "Arial", sans-serif;
|
||||
}
|
||||
.orico_Page_products .pageMain {
|
||||
width: 85%;
|
||||
padding: 7.5rem 0 2.5rem;
|
||||
margin: 0 auto;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
padding-top: 6.2rem;
|
||||
}
|
||||
.orico_Page_products .pageMain .ori-pd-title {
|
||||
font-size: 1.5em;
|
||||
color: #101010;
|
||||
margin-bottom: 1.25rem;
|
||||
font-weight: 400;
|
||||
}
|
||||
.orico_Page_products .pageMain .ori-pd-list {
|
||||
display: flex;
|
||||
flex-wrap: wrap; /* 自动换行 */
|
||||
justify-content: flex-start; /* 水平方向均匀分布 */
|
||||
}
|
||||
.orico_Page_products .pageMain .ori-pd-list .oripditem {
|
||||
width: 24%;
|
||||
float: left;
|
||||
background: #fff;
|
||||
padding-bottom: 1em;
|
||||
margin-top: 15px;
|
||||
position: relative;
|
||||
margin-right: 1%;
|
||||
padding-top: 30px;
|
||||
padding-bottom: 70px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
.orico_Page_products .pageMain .ori-pd-list .oripditem .prdimg {
|
||||
display: inline-block;
|
||||
width: 100%;
|
||||
max-width: 220px;
|
||||
margin: 25px auto;
|
||||
display: none;
|
||||
}
|
||||
.orico_Page_products .pageMain .ori-pd-list .oripditem .prdimg-show {
|
||||
display: block;
|
||||
}
|
||||
.orico_Page_products .pageMain .ori-pd-list .oripditem .prdName {
|
||||
color: #101010;
|
||||
font-size: 0.875em;
|
||||
padding-bottom: 0.625rem;
|
||||
width:80%;
|
||||
text-align: center;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
.orico_Page_products .pageMain .ori-pd-list .oripditem .prddec {
|
||||
font-size: 0.875em;
|
||||
color: #737373;
|
||||
width:80%;
|
||||
text-align: center;
|
||||
}
|
||||
.orico_Page_products .pageMain .ori-pd-list .oripditem .prd-colors {
|
||||
width: 92%;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
margin-top: 0.3125rem;
|
||||
}
|
||||
.orico_Page_products .pageMain .ori-pd-list .oripditem .prd-colors .prdolorit {
|
||||
width: 1.3rem;
|
||||
height: 1.3rem;
|
||||
border-radius: 0.65rem;
|
||||
cursor: pointer;
|
||||
margin: 0 0.3125rem;
|
||||
}
|
||||
.orico_Page_products .pageMain .ori-pd-list .oripditem .prd-colors .prdolorit img {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
border-radius: 0.65rem;
|
||||
}
|
||||
.orico_Page_products .pageMain .ori-pd-list .oripditem .prd-colors .prdolorit .rgb_hex {
|
||||
display: block;
|
||||
height: 100%;
|
||||
border-radius: 100%;
|
||||
}
|
||||
.orico_Page_products .pageMain .ori-pd-list .oripditem:hover {
|
||||
box-shadow: 0px 5px 35px rgba(227, 227, 227, 0.75);
|
||||
transform: translate3d(0, -2px, 0);
|
||||
}
|
||||
@@ -2,7 +2,7 @@
|
||||
.orico_Page_category {
|
||||
width: 100%;
|
||||
position: relative;
|
||||
height: 100vh;
|
||||
min-height: 100vh;
|
||||
overflow-y: auto;
|
||||
overflow-x: hidden;
|
||||
background: #f9f9f9;
|
||||
@@ -13,6 +13,21 @@
|
||||
.orico_Page_category span {
|
||||
font-family: "Microsoft YaHei", "Arial", sans-serif;
|
||||
}
|
||||
.orico_Page_category .opdBanner {
|
||||
width: 100%;
|
||||
height: auto;
|
||||
position: relative;
|
||||
}
|
||||
.orico_Page_category .opdBanner .opdbannerImg {
|
||||
width: 100%;
|
||||
height: auto;
|
||||
display: none;
|
||||
object-fit: cover;
|
||||
transition: opacity 1s ease-in-out;
|
||||
}
|
||||
.orico_Page_category .opdbanner > a:first-child {
|
||||
display: block;
|
||||
}
|
||||
.orico_Page_category .pageMain {
|
||||
width: 85%;
|
||||
padding: 7.5rem 0 10px;
|
||||
|
||||
@@ -2,7 +2,7 @@
|
||||
.orico_Page_subcategory {
|
||||
width: 100%;
|
||||
position: relative;
|
||||
height: 100vh;
|
||||
min-height: 100vh;
|
||||
overflow-y: auto;
|
||||
overflow-x: hidden;
|
||||
background: #f9f9f9;
|
||||
@@ -10,6 +10,21 @@
|
||||
.orico_Page_subcategory p, .orico_Page_subcategory a, .orico_Page_subcategory div, .orico_Page_subcategory span {
|
||||
font-family: "Microsoft YaHei", "Arial", sans-serif;
|
||||
}
|
||||
.orico_Page_subcategory .opdBanner {
|
||||
width: 100%;
|
||||
height: auto;
|
||||
position: relative;
|
||||
}
|
||||
.orico_Page_subcategory .opdBanner .opdbannerImg {
|
||||
width: 100%;
|
||||
height: auto;
|
||||
display: none;
|
||||
object-fit: cover;
|
||||
transition: opacity 1s ease-in-out;
|
||||
}
|
||||
.orico_Page_subcategory .opdbanner > a:first-child {
|
||||
display: block;
|
||||
}
|
||||
.orico_Page_subcategory .pageMain {
|
||||
width: 85%;
|
||||
padding: 7.5rem 0 10px;
|
||||
@@ -84,6 +99,11 @@
|
||||
height: 100%;
|
||||
border-radius: 0.65rem;
|
||||
}
|
||||
.orico_Page_products .pageMain .ori-pd-list .oripditem .prd-colors .prdolorit .rgb_hex {
|
||||
display: block;
|
||||
height: 100%;
|
||||
border-radius: 100%;
|
||||
}
|
||||
.orico_Page_subcategory .pageMain .ori-pd-list .oripditem:hover {
|
||||
box-shadow: 0px 5px 35px rgba(227, 227, 227, 0.75);
|
||||
transform: translate3d(0, -2px, 0);
|
||||
|
||||
@@ -1,159 +0,0 @@
|
||||
.orico_Page_productxc {
|
||||
width: 100%;
|
||||
position: relative;
|
||||
height: 100vh;
|
||||
overflow-y: auto;
|
||||
overflow-x: hidden;
|
||||
background: #f2f2f2;
|
||||
}
|
||||
.orico_Page_productxc .productxcMain {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
.orico_Page_productxc .productxcMain p {
|
||||
font-family: inherit;
|
||||
}
|
||||
.orico_Page_productxc .productxcMain .culture_top {
|
||||
background: #f2f2f2;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
.orico_Page_productxc .productxcMain .culture_top img {
|
||||
height: auto;
|
||||
max-width: 100%;
|
||||
}
|
||||
.orico_Page_productxc .productxcMain .culture_top .culture_bril_con {
|
||||
max-width: 101.25rem;
|
||||
width: 80%;
|
||||
background: #f2f2f2;
|
||||
overflow: hidden;
|
||||
display: flex;
|
||||
margin: 0 auto;
|
||||
}
|
||||
.orico_Page_productxc .productxcMain .culture_top .culture_bril_con .culture_bril_div {
|
||||
width: 29%;
|
||||
height: 597px;
|
||||
background: #fff;
|
||||
overflow: hidden;
|
||||
text-align: center;
|
||||
margin-left: 6%;
|
||||
margin-top: 5rem;
|
||||
margin-bottom: 5rem;
|
||||
border-radius: 1rem;
|
||||
}
|
||||
.orico_Page_productxc .productxcMain .culture_top .culture_bril_con .culture_bril_div .iconimg {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
margin-top: 3.125rem;
|
||||
}
|
||||
.orico_Page_productxc .productxcMain .culture_top .culture_bril_con .culture_bril_div .iconimg img {
|
||||
height: auto;
|
||||
max-width: 100%;
|
||||
}
|
||||
.orico_Page_productxc .productxcMain .culture_top .culture_bril_con .culture_bril_div .title {
|
||||
font-size: 1.125rem;
|
||||
font-weight: 600;
|
||||
font-family: Montserrat-Bold, Montserrat;
|
||||
margin-top: 2rem;
|
||||
width: 90%;
|
||||
margin-left: 5%;
|
||||
}
|
||||
.orico_Page_productxc .productxcMain .culture_top .culture_bril_con .culture_bril_div .subtitle {
|
||||
width: 80%;
|
||||
font-size: 0.875rem;
|
||||
color: #707070;
|
||||
font-family: Montserrat-Medium, Montserrat;
|
||||
margin-top: 1.375rem;
|
||||
margin-left: 10%;
|
||||
}
|
||||
.orico_Page_productxc .productxcMain .culture_top .culture_bril_con .culture_bril_div:first-child {
|
||||
margin-left: 0;
|
||||
}
|
||||
.orico_Page_productxc .productxcMain .culture_vision {
|
||||
background-color: #fff;
|
||||
overflow: hidden;
|
||||
width: 100%;
|
||||
}
|
||||
.orico_Page_productxc .productxcMain .culture_vision .subtitle {
|
||||
font-size: 1.25rem;
|
||||
color: #101010;
|
||||
line-height: 2em;
|
||||
margin-bottom: 2%;
|
||||
font-weight: 600;
|
||||
font-family: Montserrat-Bold, Montserrat;
|
||||
}
|
||||
.orico_Page_productxc .productxcMain .culture_vision .swt-Container {
|
||||
width: 80%;
|
||||
margin: 0 auto;
|
||||
max-width: 101.25rem;
|
||||
}
|
||||
.orico_Page_productxc .productxcMain .culture_vision .swt-Container .title {
|
||||
font-size: 3em;
|
||||
font-weight: 600;
|
||||
color: #101010;
|
||||
text-align: center;
|
||||
padding-top: 2.3%;
|
||||
padding-bottom: 2%;
|
||||
line-height: 2em;
|
||||
font-family: "LATO-MEDIUM";
|
||||
}
|
||||
.orico_Page_productxc .productxcMain .culture_vision .swt-Container .swt-Table {
|
||||
margin-bottom: 4%;
|
||||
}
|
||||
.orico_Page_productxc .productxcMain .culture_vision .swt-Container .swt-Table .Table-Row {
|
||||
display: table-row;
|
||||
}
|
||||
.orico_Page_productxc .productxcMain .culture_vision .swt-Container .swt-Table .Table-Row .left {
|
||||
width: 46.7%;
|
||||
text-align: center;
|
||||
vertical-align: middle;
|
||||
}
|
||||
.orico_Page_productxc .productxcMain .culture_vision .swt-Container .swt-Table .Table-Row .left img {
|
||||
border-radius: 1rem;
|
||||
}
|
||||
.orico_Page_productxc .productxcMain .culture_vision .swt-Container .swt-Table .Table-Row .right {
|
||||
width: 46.7%;
|
||||
text-align: center;
|
||||
vertical-align: middle;
|
||||
}
|
||||
.orico_Page_productxc .productxcMain .culture_vision .swt-Container .swt-Table .Table-Row .right p {
|
||||
margin-left: 5%;
|
||||
text-align: left;
|
||||
display: inline-block;
|
||||
width: 90%;
|
||||
font-size: 1.25rem;
|
||||
color: #101010;
|
||||
line-height: 2em;
|
||||
margin-bottom: 2%;
|
||||
font-family: Montserrat-Bold, Montserrat;
|
||||
margin-right: 10%;
|
||||
}
|
||||
.orico_Page_productxc .productxcMain .culture_vision .swt-Container .swt-Table .Table-Row .right .des {
|
||||
font-size: 16px;
|
||||
color: #737373;
|
||||
line-height: 1.6rem;
|
||||
font-family: Montserrat-Medium, Montserrat;
|
||||
}
|
||||
.orico_Page_productxc .productxcMain .culture_vision .swt-Container .swt-Table .Table-Row .Table-Cell {
|
||||
display: table-cell;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
.orico_Page_productxc .productxcMain .culture_vision .swt-Container .swt-Table .Table-Row .center {
|
||||
width: 6.6%;
|
||||
}
|
||||
.orico_Page_productxc .productxcMain .culture_vision .swt-Container .culture_vision_02 .des {
|
||||
font-size: 1rem;
|
||||
color: #737373;
|
||||
line-height: 1.6rem;
|
||||
font-family: Montserrat-Medium, Montserrat;
|
||||
}
|
||||
.orico_Page_productxc .productxcMain .culture_vision .swt-Container .culture_vision_02 .des,
|
||||
.orico_Page_productxc .productxcMain .culture_vision .swt-Container .culture_vision_02 .subtitle {
|
||||
text-align: left;
|
||||
}
|
||||
.orico_Page_productxc .productxcMain .culture_vision .swt-Container .culture_vision_02 img {
|
||||
border-radius: 1rem;
|
||||
}
|
||||
@@ -93,16 +93,16 @@
|
||||
.narswljshow {
|
||||
display: none;
|
||||
}
|
||||
.narssben-us .nDtopIt2 .nDitImg {
|
||||
width: 291px !important;
|
||||
.narsDowloadPc .narssben-us .nDtopIt2 .nDitImg {
|
||||
width: 291px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
.narssben-us .nDtopIt2 .nDitImg img{
|
||||
.narsDowloadPc .narssben-us .nDtopIt2 .nDitImg img{
|
||||
width:70px !important;
|
||||
height:70px!important;
|
||||
}
|
||||
.narssben-us .nDtopIt2 .nDitImg .dwbt {
|
||||
.narsDowloadPc .narssben-us .nDtopIt2 .nDitImg .dwbt {
|
||||
padding: 6px 38px;
|
||||
background: #a1a7bf;
|
||||
border-radius: 20px;
|
||||
|
||||
@@ -56,4 +56,5 @@
|
||||
.narsPage-head .headcenter .logico {
|
||||
width: 13.375rem;
|
||||
height: 2.875rem;
|
||||
width:100%
|
||||
}
|
||||
Reference in New Issue
Block a user