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.
281 lines
16 KiB
281 lines
16 KiB
<!DOCTYPE html>
|
|
<html lang="en">
|
|
|
|
<head>
|
|
{php}
|
|
$current_cate_id = $current_cate['id'] ?? '';
|
|
// var_dump($current_cate);exit;
|
|
{/php}
|
|
|
|
<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/news.js"></script>
|
|
<link rel="modulepreload" crossorigin href="/themes/dist_static/static/js/common.js" />
|
|
<link rel="modulepreload" crossorigin href="/themes/dist_static/static/js/news2.js" />
|
|
<link rel="stylesheet" crossorigin href="/themes/dist_static/static/css/common.css" />
|
|
<link rel="stylesheet" crossorigin href="/themes/dist_static/static/css/pagination.css" />
|
|
<link rel="stylesheet" crossorigin href="/themes/dist_static/static/css/empty.css" />
|
|
<link rel="stylesheet" crossorigin href="/themes/dist_static/static/css/news.css" />
|
|
</head>
|
|
|
|
<body>
|
|
<!-- 引入公共头部 -->
|
|
<!-- header -->
|
|
{include file="components/header"}
|
|
|
|
<main class="main-news" data-header-dark data-nav="新闻动态">
|
|
{php}$news_root_id = uiId('news');{/php}
|
|
{hcTaglib:category id="$news_root_id" item="vo" field="id,title,alias"}
|
|
{php}
|
|
$news_cate_info = $vo;
|
|
$news_cate_info_alias = $vo['alias'] ?? '';
|
|
{/php}
|
|
{/hcTaglib:category}
|
|
<div class="n-page section__wrap">
|
|
<div class="n-head">
|
|
<h1 class="n-head__title">
|
|
<span>Learn about RAYNEN</span>
|
|
<span>News</span>
|
|
</h1>
|
|
<div class="n-tabs" role="tablist" aria-label="News categories">
|
|
{php}
|
|
$news_active_cat = (string)input('cat', '');
|
|
if ($news_active_cat === '' || $news_active_cat === 'all') {
|
|
$news_active_cat = (string)($current_cate_id ?: ($news_cate_info['id'] ?? ''));
|
|
}
|
|
$news_all_cat = (string)($news_cate_info['id'] ?? '');
|
|
$news_video_id = (string)uiId('news_video');
|
|
$is_news_video = ($news_video_id !== '' && $news_video_id !== '0' && $news_active_cat === $news_video_id);
|
|
{/php}
|
|
<a href="{$news_cate_info_alias}?cat={$news_cate_info['id']}" class="n-tabs__item{if $news_active_cat == $news_all_cat} is-active{/if}" role="tab" aria-selected="{if $news_active_cat == $news_all_cat}true{else /}false{/if}" data-cat="{$news_cate_info['id']}">All</a>
|
|
{hcTaglib:subcategory pid="$news_cate_info['id']" item="vo" sort=""}
|
|
<a href="{$vo.alias}?cat={$vo['id']}" class="n-tabs__item{if $news_active_cat == $vo['id']} is-active{/if}" role="tab" aria-selected="{if $news_active_cat == $vo['id']}true{else /}false{/if}" data-cat="{$vo.id}">{$vo.title}</a>
|
|
{/hcTaglib:subcategory}
|
|
</div>
|
|
</div>
|
|
|
|
{hcTaglib:contentPage2 cid="$current_cate_id" mainField="id,category_id,title,sub_title,thumbnail,content,description,create_time,is_top" subField="" name="hc_featured" limit="100" item="content_sub22" isTop="1"}
|
|
{/hcTaglib:contentPage2}
|
|
{php}
|
|
$news_has_featured = false;
|
|
if (!empty($hc_featured)) {
|
|
if (is_object($hc_featured) && method_exists($hc_featured, 'isEmpty')) {
|
|
$news_has_featured = !$hc_featured->isEmpty();
|
|
} elseif (is_countable($hc_featured)) {
|
|
$news_has_featured = count($hc_featured) > 0;
|
|
}
|
|
}
|
|
{/php}
|
|
{if $news_has_featured && !$is_news_video}
|
|
<article class="n-featured">
|
|
<div class="n-featured__swiper swiper">
|
|
<div class="swiper-wrapper">
|
|
{volist name="hc_featured" id="vo_content"}
|
|
{php}
|
|
$content = $vo_content['content'] ?? ''; // 富文本
|
|
$description = $vo_content['description'] ?? ''; // 描述
|
|
$title = $vo_content['title'] ?? ''; // 标题
|
|
$create_time_str = $vo_content['publish_time'] ?? $vo_content['create_time'];
|
|
{/php}
|
|
<div class="swiper-slide n-featured__slide" data-category="company">
|
|
<div class="n-featured__media">
|
|
<img src="{$vo_content['thumbnail']['url'] ?? ''}" width="720" height="480" alt="{$vo_content.title}" />
|
|
</div>
|
|
<div class="n-featured__body">
|
|
<div class="n-featured__content">
|
|
<time class="n-featured__date" datetime="{$create_time_str}">{:date('Y-m-d',strtotime($create_time_str)) ?? ''}</time>
|
|
<h2 class="n-featured__title">{$title}</h2>
|
|
<p class="n-featured__desc">
|
|
{$description|raw}
|
|
</p>
|
|
</div>
|
|
<div class="n-featured__foot">
|
|
<a class="n-link" href="{:hcUrl('detail/index',['id'=>$vo_content['id'],'cid'=>$vo_content['category_id']])}">
|
|
<span>Explore more</span>
|
|
<img
|
|
src="data:image/svg+xml,%3csvg%20viewBox='0%200%2016.502%206.66113'%20xmlns='http://www.w3.org/2000/svg'%20xmlns:xlink='http://www.w3.org/1999/xlink'%20width='16.501953'%20height='6.661133'%20fill='none'%20customFrame='%23000000'%3e%3cpath%20id='箭头%202'%20d='M0%202.83057L16%202.83057L16%203.83057L0%203.83057L0%202.83057ZM15.2929%203.33057L12.818%200.855693C12.62%200.657703%2012.62%200.346575%2012.818%200.148586C13.016%20-0.0494041%2013.3271%20-0.0494046%2013.5251%200.148585L16.3536%202.97701C16.5515%203.175%2016.5515%203.48613%2016.3536%203.68412L13.5251%206.51255C13.3271%206.71054%2013.016%206.71054%2012.818%206.51255C12.62%206.31456%2012.62%206.00343%2012.818%205.80544L15.2929%203.33057Z'%20fill='rgb(102,102,102)'%20fill-rule='nonzero'%20/%3e%3c/svg%3e"
|
|
alt="" width="16" height="7" />
|
|
</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
{/volist}
|
|
|
|
</div>
|
|
</div>
|
|
<div class="n-featured__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>
|
|
</article>
|
|
{/if}
|
|
|
|
<div class="n-grid{if $is_news_video} n-grid--video{/if}">
|
|
|
|
{hcTaglib:contentPage2 cid="$current_cate_id" mainField="id,category_id,title,sub_title,thumbnail,cover,content,description,create_time,publish_time,is_top" subField="" name="hc_content" limit="6" item="content_sub22" isTop="222"}
|
|
{/hcTaglib:contentPage2}
|
|
|
|
{volist name="hc_content" id="vo_content"}
|
|
{php}
|
|
$content = $vo_content['content'] ?? '';
|
|
$description = $vo_content['description'] ?? '';
|
|
$create_time_str = $vo_content['publish_time'] ?? $vo_content['create_time'];
|
|
{/php}
|
|
|
|
{if $is_news_video}
|
|
<button type="button" class="n-v-card" data-video-src="{$vo_content['cover']['url'] ?? ''}">
|
|
<div class="n-v-card__media">
|
|
<img class="n-v-card__cover" src="{$vo_content['thumbnail']['url'] ?? ''}" alt="" width="400" height="225" loading="lazy" />
|
|
{notempty name="description"}
|
|
<span class="n-v-card__duration">{$description}</span>
|
|
{/notempty}
|
|
<span class="n-v-card__play" aria-hidden="true">
|
|
<img src="data:image/svg+xml,%3csvg%20viewBox='0%200%2013.5386%2016'%20xmlns='http://www.w3.org/2000/svg'%20xmlns:xlink='http://www.w3.org/1999/xlink'%20width='13.538574'%20height='16.000000'%20fill='none'%20customFrame='%23000000'%3e%3cpath%20id='多边形%201'%20d='M8.86093%201.45695L15.1085%2012.0297C15.5024%2012.6963%2015.0219%2013.5384%2014.2476%2013.5384L1.75245%2013.5384C0.978149%2013.5384%200.497614%2012.6963%200.891523%2012.0297L7.13907%201.45695C7.52614%200.801924%208.47387%200.801924%208.86093%201.45695Z'%20fill='rgb(255,255,255)'%20fill-rule='evenodd'%20transform='matrix(0,1,-1,0,13.5386,0)'%20/%3e%3c/svg%3e" alt="" width="14" height="16" />
|
|
</span>
|
|
</div>
|
|
<h3 class="n-v-card__title">{$vo_content.title}</h3>
|
|
<time class="n-v-card__date" datetime="{$create_time_str}">{$create_time_str|date='Y-m-d'}</time>
|
|
</button>
|
|
{else /}
|
|
{php}
|
|
$is_item_video = ($news_video_id !== '' && $news_video_id !== '0' && (string)($vo_content['category_id'] ?? '') === $news_video_id);
|
|
{/php}
|
|
<article class="n-card{if $is_item_video} n-card--video{/if}" data-category="{if $is_item_video}video{else /}insight{/if}"{if $is_item_video} data-video-src="{$vo_content['cover']['url'] ?? ''}"{/if}>
|
|
<div class="n-card__top">
|
|
<time class="n-card__date" datetime="{$create_time_str}">{:date('Y-m-d',strtotime($create_time_str)) ?? ''}</time>
|
|
<h3 class="n-card__title">{$vo_content.title}</h3>
|
|
{if !$is_item_video}
|
|
<a class="n-link n-link--sm" href="{:hcUrl('detail/index',['id'=>$vo_content['id'],'cid'=>$vo_content['category_id']])}">
|
|
<span>Explore more</span>
|
|
<img
|
|
src="data:image/svg+xml,%3csvg%20viewBox='0%200%2016.502%206.66113'%20xmlns='http://www.w3.org/2000/svg'%20xmlns:xlink='http://www.w3.org/1999/xlink'%20width='16.501953'%20height='6.661133'%20fill='none'%20customFrame='%23000000'%3e%3cpath%20id='箭头%202'%20d='M0%202.83057L16%202.83057L16%203.83057L0%203.83057L0%202.83057ZM15.2929%203.33057L12.818%200.855693C12.62%200.657703%2012.62%200.346575%2012.818%200.148586C13.016%20-0.0494041%2013.3271%20-0.0494046%2013.5251%200.148585L16.3536%202.97701C16.5515%203.175%2016.5515%203.48613%2016.3536%203.68412L13.5251%206.51255C13.3271%206.71054%2013.016%206.71054%2012.818%206.51255C12.62%206.31456%2012.62%206.00343%2012.818%205.80544L15.2929%203.33057Z'%20fill='rgb(102,102,102)'%20fill-rule='nonzero'%20/%3e%3c/svg%3e"
|
|
alt="" width="16" height="7" />
|
|
</a>
|
|
{/if}
|
|
</div>
|
|
<div class="n-card__media">
|
|
<img src="{$vo_content['thumbnail']['url'] ?? ''}" alt="" loading="lazy" />
|
|
{if $is_item_video}
|
|
{notempty name="description"}
|
|
<span class="n-card__duration">{$description}</span>
|
|
{/notempty}
|
|
<span class="n-card__play" aria-hidden="true">
|
|
<img src="data:image/svg+xml,%3csvg%20viewBox='0%200%2013.5386%2016'%20xmlns='http://www.w3.org/2000/svg'%20xmlns:xlink='http://www.w3.org/1999/xlink'%20width='13.538574'%20height='16.000000'%20fill='none'%20customFrame='%23000000'%3e%3cpath%20id='多边形%201'%20d='M8.86093%201.45695L15.1085%2012.0297C15.5024%2012.6963%2015.0219%2013.5384%2014.2476%2013.5384L1.75245%2013.5384C0.978149%2013.5384%200.497614%2012.6963%200.891523%2012.0297L7.13907%201.45695C7.52614%200.801924%208.47387%200.801924%208.86093%201.45695Z'%20fill='rgb(255,255,255)'%20fill-rule='evenodd'%20transform='matrix(0,1,-1,0,13.5386,0)'%20/%3e%3c/svg%3e" alt="" width="14" height="16" />
|
|
</span>
|
|
{/if}
|
|
</div>
|
|
</article>
|
|
{/if}
|
|
{/volist}
|
|
|
|
</div>
|
|
|
|
{php}
|
|
$list_empty = isHcListEmpty($hc_content ?? null);
|
|
if ($list_empty) {
|
|
$empty_text = $is_news_video ? 'No matching videos' : 'No matching news';
|
|
}
|
|
{/php}
|
|
{if $list_empty}
|
|
{include file="components/empty"}
|
|
{else /}
|
|
<!-- 分页 -->
|
|
{$hc_content|raw}
|
|
{/if}
|
|
|
|
<div class="n-v-modal" id="n-v-modal" hidden>
|
|
<div class="n-v-modal__backdrop" data-n-v-modal-close></div>
|
|
<div class="n-v-modal__dialog" role="dialog" aria-modal="true" aria-labelledby="n-v-modal-title">
|
|
<div class="n-v-modal__head">
|
|
<h2 class="n-v-modal__title" id="n-v-modal-title">Video</h2>
|
|
<button type="button" class="n-v-modal__close" data-n-v-modal-close aria-label="Close">
|
|
<img src="data:image/svg+xml,%3csvg%20xmlns='http://www.w3.org/2000/svg'%20width='16'%20height='16'%20viewBox='0%200%2016%2016'%20fill='none'%3e%3cpath%20d='M1.5%201.5L14.5%2014.5M14.5%201.5L1.5%2014.5'%20stroke='%23fff'%20stroke-width='1.5'%20stroke-linecap='round'/%3e%3c/svg%3e" alt="" width="16" height="16" aria-hidden="true" />
|
|
</button>
|
|
</div>
|
|
<div class="n-v-modal__body">
|
|
<video class="n-v-modal__video" id="n-v-modal-video" controls playsinline></video>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
</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>
|