official_website/templates/foxui01/index.html

319 lines
16 KiB
HTML

<!--
* @Descripttion : FOXCMS是一款高效的PHP多端跨平台内容管理系统
* @Author : FoxCMS Team
* @Date : 2023-01-10 09:33:37
* @version : V1.08
* @copyright : ©2021-现在 贵州黔狐科技股份有限公司 版权所有
* @LastEditTime : 2024-07-06 10:15:54
-->
<!DOCTYPE html>
<html lang="cn">
<head>
{include file="header"/}
<title>{fox:basic name='title'/}</title>
<meta name="keywords" content="{fox:basic name='keyword'/}" />
<meta name="description" content="{fox:basic name='description'/}" />
</head>
<body>
<!-- 顶部 -->
<header class="foxui-border-bottom foxui-bg-white">{include file="nav"/}</header>
<!-- 主体内容 -->
<main class="index-main">
<!-- 通栏图 -->
<div class="foxcms-index-banner">
<div class="foxcms-banner-pc foxui-hidden-sm foxui-hidden-xs">
<div class="swiper index-swiper-pc" style="--swiper-navigation-color: #666; --swiper-pagination-bullet-inactive-color: #666; --swiper-pagination-color: #666">
<div class="swiper-wrapper">
{fox:adv pid='2' sid="ad1"}
<div class="swiper-slide">
<div class="swiper-item" style="background-image: url([$ad.img_url])">
<div class="foxcms-container">
<div class="foxui-row foxui-gutter-10">
<div class="foxui-col-sm-24 foxui-col-lg-24">
<div class="content left">
<h1 style="color: #333">[$ad.title]</h1>
<p style="color: #666">[$ad.adv_info]</p>
<a style="color: #666; border-color: #666" href="[$ad.link]" class="view-btn">
<span>查看详情</span>
<i class="foxui-icon-qianwang-o"></i>
</a>
</div>
</div>
</div>
</div>
</div>
</div>
{/fox:adv}
</div>
<div class="swiper-button-next"></div>
<div class="swiper-button-prev"></div>
<div class="swiper-pagination"></div>
</div>
</div>
<div class="foxcms-banner-h5 foxui-visible-sm foxui-visible-xs">
<div class="swiper index-swiper-h5" style="--swiper-navigation-color: #fff; --swiper-pagination-bullet-inactive-color: #fff; --swiper-pagination-color: #fff">
<div class="swiper-wrapper">
{fox:adv pid='2'}
<div class="swiper-slide">
<div class="swiper-item" style="background-image: url([$ad.img_url])">
<div class="foxcms-container">
<div class="foxui-row foxui-gutter-10">
<div class="foxui-col-sm-24">
<div class="content left">
<h1 style="color: #333">[$ad.title]</h1>
<p style="color: #666">[$ad.adv_info]</p>
<a style="color: #666; border-color: #666" href="[$ad.link]" class="view-btn">
<span>查看详情</span>
<i class="foxui-icon-qianwang-o"></i>
</a>
</div>
</div>
</div>
</div>
</div>
</div>
{/fox:adv}
</div>
</div>
</div>
</div>
<!-- 公司简介 -->
<div class="company-info">
<div class="foxui-row foxui-gutter-0">
{fox:channel name="field" typeid="1" type="self"}
<div class="foxui-col-md-12">
<div class="pic wow slideInUp">
<img src="[$field.pic_url]" alt="{fox:basic name='name'/}"/>
</div>
</div>
<div class="foxui-col-md-12">
<div class="text wow slideInUp">
<div class="text-inner">
<h1>[$field.name]</h1>
<h4>[$field.en_name]</h4>
<p>{fox:single calltype="parent" name='content' filter='cn_substr,320'/}</p>
<div>
<a class="foxui-link" href="[$field.link]">
<span>查看详情</span>
<i class="foxui-icon-qianwang-o"></i>
</a>
</div>
</div>
</div>
</div>
{/fox:channel}
</div>
</div>
<!-- 核心数据 -->
<div class="more-section foxui-bg-white">
<div class="foxcms-container">
{fox:channel name="field" typeid="87" type="self"}
<div class="more-section-head" style="justify-content: center">
<div class="title">
<h1>[$field.name]</h1>
</div>
</div>
<div class="more-section-list">
<div class="foxui-row foxui-gutter-0">
{fox:list name='item' pagesize="3" typeid='87'}
<div class="col foxui-col-xs-12 foxui-col-sm-8 foxui-col-lg-6 w-1-3">
<div class="foxui-display-flex foxui-justify-content-center flex-wrap">
<img src="[$item.img_url]" alt="" style="width: 150px; height: 150px;" />
<h2 class="w-full foxui-display-flex foxui-justify-content-center foxui-align-items-center">[$item.title]</h2>
<h2 class="w-full foxui-display-flex foxui-justify-content-center foxui-align-items-center">[$item.brief_title]</h2>
</div>
</div>
{/fox:list}
</div>
</div>
{/fox:channel}
</div>
</div>
<!-- 业务板块 -->
<div class="tabs-section">
<div class="foxcms-container">
{fox:channel name="field" typeid = "88"}
<div class="" style="text-align: center;margin-top: 40px;">
<h1 style="font-size: 40px;color: #000;font-weight: bold;">[$field.name]</h1>
</div>
<div class="foxui-tabs foxui-type-line foxui-position-right" style="text-align: center;margin-top: 0;">
<div class="foxui-tabs-content" style="display: flex;flex-wrap: wrap;padding: 24px 0">
{fox:channel name="cv" pname="field" calltype="parent" type="son" notypeid="self"}
<div class="foxui-col-sm-12 foxui-col-lg-8">
<a href="[$cv.link]" class="list-case-item" style="display: block">
<div class="pic">
<img src="[$cv.pic_url]" alt="" />
</div>
<div class="cover">
<div class="cover-head">
</div>
<div class="cover-foot">
<h2>[$cv.name]</h2>
<h3>[$cv.en_name]</h3>
</div>
</div>
</a>
</div>
{/fox:channel}
</div>
</div>
{/fox:channel}
</div>
</div>
<!-- 新闻资讯 -->
<div class="foxui-bg-white">
<div class="tabs-section news-section">
{fox:channel name="field" typeid = "5"}
<div class="foxcms-container">
<div style="display: flex;">
<div style="width: 33.33%;"></div>
<div style="width: 33.33%;text-align: center;">
<h1 style="font-size: 40px;color: #000;font-weight: bold;">[$field.name]</h1>
</div>
<div style="width: 33.33%;display: flex;justify-content: end;align-items: end;">
{fox:channel name="cv" pname="field" calltype="parent" type="son" notypeid="self"}
<div class="foxui-tabs-item{if $index==1} is-active{/if}">[$cv.name]</div>
{/fox:channel}
</div>
</div>
<div class="foxui-tabs foxui-type-line foxui-position-right foxui-margin-top-0">
<div class="foxui-tabs-content" style="padding: 24px 0;">
{fox:channel name="cv" pname="field" calltype="parent" type="son" notypeid="self"}
<div class="foxui-tabs-pane">
<div class="swiper recommend-swiper enterprise-swiper">
<div class="swiper-wrapper">
{fox:article name='av' pname='cv' calltype="parent" row="6" flag='c'}
<div class="swiper-slide">
<a href="[$av.link]" class="list-article-item wow slideInUp">
<div class="pic">
<img src="[$av.img_url]" alt="" />
</div>
<div class="text">
<div class="info">
<div class="left">
<span>[$av.column]</span>
<span>[$field.release_time|date='Y-m-d']</span>
</div>
<div class="right">
<i class="foxui-icon-xianshi-o"></i>
<span>[$av.click]</span>
</div>
</div>
<h1 class="foxui-ellipsis-2">[$av.title]</h1>
<p class="foxui-ellipsis-3">[$av.content | cn_substr=120]</p>
</div>
</a>
</div>
{/fox:article}
</div>
<div class="swiper-pagination"></div>
<div class="swiper-button-prev"></div>
<div class="swiper-button-next"></div>
</div>
<div class="more-btn" style="margin-top: 40px; margin-bottom: 40px">
<a class="more-plain-btn" href="[$cv.link]">
<span>MORE</span>
<i class="foxui-icon-qianwang-o"></i>
</a>
</div>
</div>
{/fox:channel}
</div>
</div>
</div>
{/fox:channel}
</div>
</div>
</main>
<!-- 底部 -->
<footer class="wow slideInUp">{include file="footer"/}</footer>
</body>
<script src="_STATIC_/skin/js/foxui-1.21.min.js"></script>
<script src="_STATIC_/skin/js/common.js"></script>
<script src="_STATIC_/skin/js/form.js"></script>
<script>
setTimeout(() => {
new Swiper('.index-swiper-pc', {
loop: true,
autoplay: true,
pagination: {
el: '.index-swiper-pc .swiper-pagination',
},
navigation: {
nextEl: '.index-swiper-pc .swiper-button-next',
prevEl: '.index-swiper-pc .swiper-button-prev',
},
});
new Swiper('.index-swiper-h5', {
loop: true,
autoplay: true,
});
new Swiper('.enterprise-swiper', {
slidesPerView: 1,
spaceBetween: 30,
breakpoints: {
991: { slidesPerView: 3 },
},
pagination: {
el: '.enterprise-swiper .swiper-pagination',
clickable: true,
},
navigation: {
nextEl: '.enterprise-swiper .swiper-button-next',
prevEl: '.enterprise-swiper .swiper-button-prev',
},
});
new Swiper('.industry-swiper', {
slidesPerView: 1,
spaceBetween: 30,
breakpoints: {
991: { slidesPerView: 3 },
},
pagination: {
el: '.industry-swiper .swiper-pagination',
clickable: true,
},
navigation: {
nextEl: '.industry-swiper .swiper-button-next',
prevEl: '.industry-swiper .swiper-button-prev',
},
});
new Swiper('.media-swiper', {
slidesPerView: 1,
spaceBetween: 30,
breakpoints: {
991: { slidesPerView: 3 },
},
pagination: {
el: '.media-swiper .swiper-pagination',
clickable: true,
},
navigation: {
nextEl: '.media-swiper .swiper-button-next',
prevEl: '.media-swiper .swiper-button-prev',
},
});
}, 300);
</script>
<style>
.w-1-3 {
width: 33.33%;
}
.w-full {
width: 100%;
}
.flex-wrap {
flex-wrap: wrap;
}
</style>
</html>