You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
259 lines
13 KiB
259 lines
13 KiB
<!DOCTYPE html>
|
|
<html lang="en">
|
|
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>{$current_cate['seo_title']}</title>
|
|
<meta name="keywords" content="{$current_cate['seo_keywords']}">
|
|
<meta name="description" content="{$current_cate['seo_description']}">
|
|
<!-- 公共CSS 自动被打包进页面 -->
|
|
<link rel="icon" href="./favicon.ico" type="image/x-icon">
|
|
<script>
|
|
// 设计稿 1920px 宽度下 1rem = 16Px；放在 head 里避免刷新时 rem 闪动
|
|
(function () {
|
|
var h = document.documentElement
|
|
// 设计稿宽度
|
|
var DESIGN_WIDTH = 1920
|
|
// 设计稿1rem = 16Px
|
|
var REM_AT_DESIGN = 16
|
|
// 最小字体大小-限制, 同时注意所有的box的大小也有了最小限制
|
|
var MIN_ROOT_FONT_SIZE = 14
|
|
function setRootFontSize() {
|
|
// 当前屏幕可视宽度（每次计算都取最新值）
|
|
var W = h.getBoundingClientRect().width
|
|
var size = (W / DESIGN_WIDTH) * REM_AT_DESIGN
|
|
if (size < MIN_ROOT_FONT_SIZE) size = MIN_ROOT_FONT_SIZE
|
|
h.style.fontSize = size + 'px'
|
|
}
|
|
setRootFontSize()
|
|
var resizeRaf = 0
|
|
window.addEventListener('resize', function () {
|
|
if (resizeRaf) return
|
|
resizeRaf = requestAnimationFrame(function () {
|
|
resizeRaf = 0
|
|
setRootFontSize()
|
|
})
|
|
})
|
|
})()
|
|
</script>
|
|
<link rel="stylesheet" href="https://unpkg.com/lenis@1.3.23/dist/lenis.css">
|
|
<link rel="stylesheet" href="https://cdn.jsdelivr.net.cn/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css">
|
|
<link href="https://cdn.jsdelivr.net.cn/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" rel="stylesheet"
|
|
integrity="sha384-QWTKZyjpPEjISv5WaRU9OFeRpok6YctnYmDr5pNlyT2bRjXh0JMhjY6hW+ALEwIH" crossorigin="anonymous">
|
|
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/aos@2.3.4/dist/aos.min.css">
|
|
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/swiper@11/swiper-bundle.min.css">
|
|
|
|
<script type="module" crossorigin src="/themes/dist_static/static/js/solution.js"></script>
|
|
<link rel="modulepreload" crossorigin href="/themes/dist_static/static/js/common.js">
|
|
<link rel="stylesheet" crossorigin href="/themes/dist_static/static/css/common.css">
|
|
<link rel="stylesheet" crossorigin href="/themes/dist_static/static/css/solution.css">
|
|
</head>
|
|
|
|
<body>
|
|
<!-- header -->
|
|
{include file="components/header"}
|
|
<main class="main-solution" data-nav="解决方案">
|
|
{if !empty($sub_cates[0])}
|
|
<section class="sl-hero">
|
|
<div class="sl-hero__intro section__wrap" data-header-dark>
|
|
<h1 class="sl-hero__title">{$sub_cates[0]['title'] ?? ''}</h1>
|
|
<p class="sl-hero__desc">
|
|
{$sub_cates[0]['description'] ?? ''}
|
|
</p>
|
|
</div>
|
|
<div class="sl-hero__media" aria-hidden="true">
|
|
<img src="{$sub_cates[0]['thumbnail']['url'] ?? ''}" alt="" width="1920" height="720" />
|
|
</div>
|
|
</section>
|
|
{/if}
|
|
{if !empty($sub_cates[1])}
|
|
<section class="sl-adv section__wrap" id="adv" data-header-dark>
|
|
<h2 class="sl-adv__title">{$sub_cates[1]['title'] ?? ''}</h2>
|
|
<ul class="sl-adv__list">
|
|
{php}
|
|
$contents = getContentByCategory($sub_cates[1]['id'], $seller_id, 6, 'sort asc', ['thumbnail', 'category']);
|
|
{/php}
|
|
{volist name="contents" id="vo"}
|
|
<li class="sl-adv__item">
|
|
<h3 class="sl-adv__name">{$vo['title'] ?? ''}</h3>
|
|
<p class="sl-adv__text">{$vo['description'] ?? ''}</p>
|
|
</li>
|
|
{/volist}
|
|
</ul>
|
|
</section>
|
|
{/if}
|
|
{if !empty($sub_cates[2])}
|
|
<section class="sl-arch section__wrap" id="arch" data-header-dark>
|
|
<h2 class="sl-arch__title">{$sub_cates[2]['title'] ?? ''}</h2>
|
|
<div class="sl-arch__panel">
|
|
<img src="{$sub_cates[2]['thumbnail']['url'] ?? ''}" alt="{$sub_cates[2]['description'] ?? ''}" width="1630" height="650" />
|
|
</div>
|
|
</section>
|
|
{/if}
|
|
{if !empty($sub_cates[3])}
|
|
<section class="sl-core section__wrap" id="core" data-header-dark>
|
|
<div class="sl-core__head">
|
|
<h2 class="sl-core__title">{$sub_cates[3]['title'] ?? ''}</h2>
|
|
<div class="s-arrows">
|
|
<button type="button" class="s-arrows__prev" aria-label="Previous">
|
|
<svg viewBox="0 0 12.2529 11.314" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="12.252930" height="11.313965" fill="none" customFrame="#000000">
|
|
<path id="合并" d="M5.18202 1.41422L6.59622 0L12.2531 5.65686L12.2529 5.65702L10.8389 7.07108L6.59608 11.3139L5.18186 9.89966L8.4245 6.65702L-0 6.65702L0 4.657L8.42482 4.65702L5.18202 1.41422Z" fill="rgb(239,67,53)" fill-rule="evenodd" />
|
|
</svg>
|
|
|
|
</button>
|
|
<button type="button" class="s-arrows__next" aria-label="Next">
|
|
<svg viewBox="0 0 12.2529 11.314" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="12.252930" height="11.313965" fill="none" customFrame="#000000">
|
|
<path id="合并" d="M5.18202 1.41422L6.59622 0L12.2531 5.65686L12.2529 5.65702L10.8389 7.07108L6.59608 11.3139L5.18186 9.89966L8.4245 6.65702L-0 6.65702L0 4.657L8.42482 4.65702L5.18202 1.41422Z" fill="rgb(239,67,53)" fill-rule="evenodd" />
|
|
</svg>
|
|
|
|
</button>
|
|
</div>
|
|
</div>
|
|
<div class="sl-core__swiper swiper">
|
|
<div class="swiper-wrapper">
|
|
{php}
|
|
$contents = getMixContentBySolutionName($current_cate['title'],$sub_cates[3]['id'],$seller_id, 6);
|
|
{/php}
|
|
{volist name="contents" id="vo"}
|
|
<article class="swiper-slide sl-core__card">
|
|
<!-- TODO vo.source -> solution:商品 category:文章-->
|
|
<a class="sl-core__card-link" href="javascript:;">
|
|
<div class="sl-core__card-media">
|
|
<img src="{$vo['thumbnail'] ?? ''}" alt="{$vo['title'] ?? ''}" width="528" height="330" loading="lazy" />
|
|
</div>
|
|
<div class="sl-core__card-foot">
|
|
<h3 class="sl-core__card-name">{$vo['title'] ?? ''}</h3>
|
|
<span class="sl-core__card-arrow" aria-hidden="true">
|
|
<img src="data:image/svg+xml,%3csvg%20viewBox='0%200%2012.2529%2011.314'%20xmlns='http://www.w3.org/2000/svg'%20xmlns:xlink='http://www.w3.org/1999/xlink'%20width='12.252930'%20height='11.313965'%20fill='none'%20customFrame='%23000000'%3e%3cpath%20id='合并'%20d='M5.18202%201.41422L6.59622%200L12.2531%205.65686L12.2529%205.65702L10.8389%207.07108L6.59608%2011.3139L5.18186%209.89966L8.4245%206.65702L-0%206.65702L0%204.657L8.42482%204.65702L5.18202%201.41422Z'%20fill='rgb(239,67,53)'%20fill-rule='evenodd'%20/%3e%3c/svg%3e" alt="" width="12" height="11" />
|
|
</span>
|
|
</div>
|
|
</a>
|
|
</article>
|
|
{/volist}
|
|
</div>
|
|
</div>
|
|
<div class="sl-core__arrows-mobile">
|
|
<div class="s-arrows">
|
|
<button type="button" class="s-arrows__prev" aria-label="Previous">
|
|
<svg viewBox="0 0 12.2529 11.314" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="12.252930" height="11.313965" fill="none" customFrame="#000000">
|
|
<path id="合并" d="M5.18202 1.41422L6.59622 0L12.2531 5.65686L12.2529 5.65702L10.8389 7.07108L6.59608 11.3139L5.18186 9.89966L8.4245 6.65702L-0 6.65702L0 4.657L8.42482 4.65702L5.18202 1.41422Z" fill="rgb(239,67,53)" fill-rule="evenodd" />
|
|
</svg>
|
|
|
|
</button>
|
|
<button type="button" class="s-arrows__next" aria-label="Next">
|
|
<svg viewBox="0 0 12.2529 11.314" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="12.252930" height="11.313965" fill="none" customFrame="#000000">
|
|
<path id="合并" d="M5.18202 1.41422L6.59622 0L12.2531 5.65686L12.2529 5.65702L10.8389 7.07108L6.59608 11.3139L5.18186 9.89966L8.4245 6.65702L-0 6.65702L0 4.657L8.42482 4.65702L5.18202 1.41422Z" fill="rgb(239,67,53)" fill-rule="evenodd" />
|
|
</svg>
|
|
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
{/if}
|
|
{if !empty($sub_cates[4])}
|
|
<section class="sl-clients section__wrap" id="clients" data-header-dark>
|
|
<h2 class="sl-clients__title">{$sub_cates[4]['title'] ?? ''}</h2>
|
|
{php}
|
|
$contents = getContentByCategory($sub_cates[4]['id'], $seller_id, 20, 'sort asc', ['thumbnail', 'category']);
|
|
$clients_marquee = is_array($contents) && count($contents) > 5;
|
|
{/php}
|
|
<div class="sl-clients__viewport{if $clients_marquee} is-marquee{/if}">
|
|
<div class="sl-clients__grid">
|
|
{volist name="contents" id="vo"}
|
|
<div class="sl-clients__item"><img src="{$vo['thumbnail']['url'] ?? ''}" alt="" width="252" height="160" loading="lazy" /></div>
|
|
{/volist}
|
|
{if $clients_marquee}
|
|
{volist name="contents" id="vo"}
|
|
<div class="sl-clients__item" aria-hidden="true"><img src="{$vo['thumbnail']['url'] ?? ''}" alt="" width="252" height="160" loading="lazy" /></div>
|
|
{/volist}
|
|
{/if}
|
|
</div>
|
|
</div>
|
|
</section>
|
|
{/if}
|
|
{if !empty($sub_cates[5])}
|
|
<section class="sl-cases section__wrap" id="cases" data-header-dark>
|
|
<h2 class="sl-cases__title">{$sub_cates[5]['title'] ?? ''}</h2>
|
|
<div class="sl-cases__body">
|
|
<div class="sl-cases__stage" aria-hidden="true">
|
|
<div class="sl-cases__media-swiper swiper">
|
|
<div class="swiper-wrapper">
|
|
{php}
|
|
$contents = getContentByCategory($sub_cates[5]['id'], $seller_id, 6, 'sort asc', ['thumbnail', 'category']);
|
|
{/php}
|
|
{volist name="contents" id="vo"}
|
|
<div class="swiper-slide sl-cases__card">
|
|
<img src="{$vo['thumbnail']['url'] ?? ''}" alt="" width="650" height="457" />
|
|
</div>
|
|
{/volist}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="sl-cases__copy">
|
|
<div class="sl-cases__content-swiper swiper">
|
|
<div class="swiper-wrapper">
|
|
{php}
|
|
$contents = getContentByCategory($sub_cates[5]['id'], $seller_id, 6, 'sort asc', ['thumbnail', 'category']);
|
|
{/php}
|
|
{volist name="contents" id="vo"}
|
|
<article class="swiper-slide sl-cases__panel">
|
|
<h3 class="sl-cases__name">{$vo['title'] ?? ''}</h3>
|
|
<p class="sl-cases__sub-name">{$vo['sub_title'] ?? ''}</p>
|
|
<p class="sl-cases__desc">{$vo['description'] ?? ''}</p>
|
|
<div class="sl-cases__tags">
|
|
{php}$descArr = explode(',',$vo['seo_description']);{/php}
|
|
{if !empty($descArr)}
|
|
{volist name="descArr" id="vv"}
|
|
<span>{$vv}</span>
|
|
{/volist}
|
|
{/if}
|
|
</div>
|
|
</article>
|
|
{/volist}
|
|
</div>
|
|
</div>
|
|
<div class="sl-cases__nav">
|
|
<div class="s-arrows">
|
|
<button type="button" class="s-arrows__prev" aria-label="Previous">
|
|
<svg viewBox="0 0 12.2529 11.314" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="12.252930" height="11.313965" fill="none" customFrame="#000000">
|
|
<path id="合并" d="M5.18202 1.41422L6.59622 0L12.2531 5.65686L12.2529 5.65702L10.8389 7.07108L6.59608 11.3139L5.18186 9.89966L8.4245 6.65702L-0 6.65702L0 4.657L8.42482 4.65702L5.18202 1.41422Z" fill="rgb(239,67,53)" fill-rule="evenodd" />
|
|
</svg>
|
|
|
|
</button>
|
|
<button type="button" class="s-arrows__next" aria-label="Next">
|
|
<svg viewBox="0 0 12.2529 11.314" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="12.252930" height="11.313965" fill="none" customFrame="#000000">
|
|
<path id="合并" d="M5.18202 1.41422L6.59622 0L12.2531 5.65686L12.2529 5.65702L10.8389 7.07108L6.59608 11.3139L5.18186 9.89966L8.4245 6.65702L-0 6.65702L0 4.657L8.42482 4.65702L5.18202 1.41422Z" fill="rgb(239,67,53)" fill-rule="evenodd" />
|
|
</svg>
|
|
|
|
</button>
|
|
</div>
|
|
<div class="sl-cases__pager" aria-live="polite">
|
|
<span class="sl-cases__pager-current">1</span>
|
|
<span class="sl-cases__pager-sep">/</span>
|
|
<span class="sl-cases__pager-total">4</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
{/if}
|
|
</main>
|
|
|
|
{include file="components/mask"}
|
|
<!-- 模块：底部 -->
|
|
{include file="components/footer"}
|
|
|
|
|
|
<script src="https://unpkg.com/lenis@1.3.23/dist/lenis.min.js"></script>
|
|
<script src="https://cdn.jsdelivr.net/npm/jquery@3.7.1/dist/jquery.min.js"></script>
|
|
<script src="https://cdn.jsdelivr.net/npm/gsap@3/dist/gsap.min.js"></script>
|
|
<script src="https://cdn.jsdelivr.net/npm/gsap@3/dist/ScrollTrigger.min.js"></script>
|
|
<script src="https://cdn.jsdelivr.net/npm/swiper@11/swiper-bundle.min.js"></script>
|
|
<script src="https://cdn.jsdelivr.net.cn/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js" integrity="sha384-YvpcrYf0tY3lHB60NNkmXc5s9fDVZLESaAA55NDzOxhy9GkcIdslK1eN7N6jIeHz" crossorigin="anonymous"></script>
|
|
<script src="https://cdn.jsdelivr.net/npm/aos@2.3.4/dist/aos.min.js"></script>
|
|
<script src="https://unpkg.com/counterup2@2.0.2/dist/index.js"></script>
|
|
|
|
</body>
|
|
|
|
</html>
|