睿能科技
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.
 
 
 
 
 
 

147 lines
8.9 KiB

<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>视频教程 - 睿能科技</title>
<meta name="keywords" content="视频教程,伺服调试,横机制版,产品培训,睿能科技">
<meta name="description" content="睿能科技视频教程,提供伺服调试、横机制版等相关培训视频。">
<!-- 公共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/video.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/pagination.css">
<link rel="stylesheet" crossorigin href="/themes/dist_static/static/css/empty.css">
<link rel="stylesheet" crossorigin href="/themes/dist_static/static/css/video.css">
</head>
<body>
<!-- 引入公共头部 -->
<!-- header -->
{include file="components/header"}
<main class="main-video" data-header-dark data-nav="服务支持">
<div class="v-page section__wrap">
<div class="v-head">
<h1 class="v-head__title">{$current_cate.title}</h1>
<p class="v-head__desc">{$current_cate.description}</p>
</div>
<div class="v-toolbar">
<div class="v-filter__group">
<button type="button" class="v-filter" aria-haspopup="listbox" aria-expanded="false" data-filter-trigger>
<span>按产品筛选</span>
<svg class="v-filter__chevron" viewBox="0 0 11.2728 6.90918" width="11" height="7" fill="none" aria-hidden="true">
<path d="M0.636353 0.636272L5.63635 5.63627L10.6364 0.63623" stroke="currentColor" stroke-width="1.8" />
</svg>
</button>
<div class="v-filter__dropdown" data-filter-dropdown hidden>
<button type="button" class="v-filter__dropdown-item is-active" data-tab="{$current_cate.id}" data-filter-clear>全部</button>
{volist name="sub_cates" id="vo"}
<button type="button" data-tab="{$vo.id}" class="v-filter__dropdown-item">{$vo.title}</button>
{/volist}
</div>
</div>
<form class="s-search" role="search" data-tab-search>
<img class="s-search__icon" src="data:image/svg+xml,%3csvg%20viewBox='0%200%2024%2024'%20xmlns='http://www.w3.org/2000/svg'%20xmlns:xlink='http://www.w3.org/1999/xlink'%20width='24.000000'%20height='24.000000'%20fill='none'%3e%3crect%20id='搜索'%20width='24.000000'%20height='24.000000'%20x='0.000000'%20y='0.000000'%20fill='rgb(255,255,255)'%20fill-opacity='0'%20/%3e%3cpath%20id='矢量%203'%20d='M15.8481%2017.1208C14.4808%2018.2114%2012.7482%2018.8633%2010.8633%2018.8633C6.44506%2018.8633%202.86328%2015.2816%202.86328%2010.8633C2.86328%206.445%206.44506%202.86328%2010.8633%202.86328C15.2815%202.86328%2018.8633%206.445%2018.8633%2010.8633C18.8633%2012.7482%2018.2114%2014.4808%2017.1208%2015.8481L21.136%2019.8633L19.8633%2021.136L15.8481%2017.1208ZM17.0632%2010.8633C17.0632%207.43908%2014.2874%204.66326%2010.8633%204.66326C7.4392%204.66326%204.66332%207.43908%204.66332%2010.8633C4.66332%2014.2875%207.4392%2017.0633%2010.8633%2017.0633C14.2874%2017.0633%2017.0632%2014.2875%2017.0632%2010.8633Z'%20fill='rgb(175,181,185)'%20fill-rule='evenodd'%20/%3e%3c/svg%3e" alt="" width="24" height="24" />
<input class="s-search__input" type="search" name="keywords" placeholder="请输入您想搜索视频的关键词" autocomplete="off" />
<button class="s-search__btn" type="submit">搜索</button>
</form>
</div>
<div class="v-grid">
{hcTaglib:contentPage mainField="*" subField="*" name="hc_content" limit="12" item="vo"}
<button type="button" class="v-card" data-video-src="{$vo.url}">
<div class="v-card__media">
<img class="v-card__cover" src="{$vo.thumbnail.url ?? ''}" alt="" width="400" height="225"
loading="lazy" />
<span class="v-card__duration">{$vo.description}</span>
<span class="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>
<h2 class="v-card__title">{$vo.title}</h2>
<time class="v-card__date" datetime="{$vo.publish_time}">{$vo.publish_time}</time>
</button>
{/hcTaglib:contentPage}
</div>
{php}
$list_empty = isHcListEmpty($hc_content ?? null);
if ($list_empty) {
$empty_text = '暂无相关视频';
}
{/php}
{if $list_empty}
{include file="components/empty"}
{else /}
{$hc_content|raw}
{/if}
<div class="v-modal" id="v-modal" hidden>
<div class="v-modal__backdrop" data-v-modal-close></div>
<div class="v-modal__dialog" role="dialog" aria-modal="true" aria-labelledby="v-modal-title">
<div class="v-modal__head">
<h2 class="v-modal__title" id="v-modal-title">视频播放</h2>
<button type="button" class="v-modal__close" data-v-modal-close aria-label="关闭">
<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="v-modal__body">
<video class="v-modal__video" id="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>