aiotadmin/caiyunniu
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

初始化项目结构并添加官网首页

Browse Source
This commit is contained in:
aiotagro
2025-12-08 15:22:56 +08:00
commit f776972645
44 changed files with 2593 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

359
website/index.html Normal file
View File

@@ -0,0 +1,359 @@
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>云南智慧牛产业平台 - 数字化驱动畜牧业未来</title>
<!-- Bootstrap 3 -->
<link href="https://cdn.bootcdn.net/ajax/libs/twitter-bootstrap/3.4.1/css/bootstrap.min.css" rel="stylesheet">
<link href="css/animate.min.css" rel="stylesheet">
<link href="css/style.css" rel="stylesheet">
<!-- HTML5 shim 和 Respond.js 是为了让 IE8 支持 HTML5 元素和媒体查询（media queries）功能 -->
<!--[if lt IE 9]>
<script src="https://cdn.bootcdn.net/ajax/libs/html5shiv/3.7.3/html5shiv.min.js"></script>
<script src="https://cdn.bootcdn.net/ajax/libs/respond.js/1.4.2/respond.min.js"></script>
<![endif]-->
</head>
<body>
<!-- 导航栏 -->
<nav class="navbar navbar-default navbar-fixed-top">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar-collapse" aria-expanded="false">
<span class="sr-only">切换导航</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="index.html">云南智慧牛产业平台</a>
</div>
<div class="collapse navbar-collapse" id="navbar-collapse">
<ul class="nav navbar-nav navbar-right">
<li class="active"><a href="index.html">首页</a></li>
<li><a href="solutions.html">解决方案</a></li>
<li><a href="news.html">新闻中心</a></li>
<li><a href="about.html">关于我们</a></li>
<li><a href="help.html">帮助中心</a></li>
<li><a href="contact.html">联系我们</a></li>
<li><a href="#" class="btn btn-primary navbar-btn" style="margin-left: 10px;">登录 / 注册</a></li>
</ul>
</div>
</div>
</nav>
<!-- 轮播图 (Hero Section) -->
<div id="carousel-hero" class="carousel slide" data-ride="carousel">
<ol class="carousel-indicators">
<li data-target="#carousel-hero" data-slide-to="0" class="active"></li>
<li data-target="#carousel-hero" data-slide-to="1"></li>
<li data-target="#carousel-hero" data-slide-to="2"></li>
</ol>
<div class="carousel-inner" role="listbox">
<div class="item active" style="background-image: url('images/hero-1.jpg');">
<div class="carousel-overlay"></div>
<div class="carousel-caption">
<h1 class="animated fadeInDown">云南智慧牛产业平台</h1>
<p class="animated fadeInUp delay-1s">数字化驱动畜牧业未来，打造全产业链智慧生态</p>
<p class="animated fadeInUp delay-2s"><a class="btn btn-lg btn-primary" href="#" role="button">立即体验</a> <a class="btn btn-lg btn-default" href="#" role="button" style="background: transparent; color: white; border: 2px solid white;">了解更多</a></p>
</div>
</div>
<div class="item" style="background-image: url('images/hero-2.jpg');">
<div class="carousel-overlay"></div>
<div class="carousel-caption">
<h1 class="animated fadeInDown">智慧养殖解决方案</h1>
<p class="animated fadeInUp delay-1s">物联网+大数据，让养殖更轻松、更高效</p>
<p class="animated fadeInUp delay-2s"><a class="btn btn-lg btn-primary" href="solutions.html" role="button">查看方案</a></p>
</div>
</div>
<div class="item" style="background-image: url('images/hero-3.jpg');">
<div class="carousel-overlay"></div>
<div class="carousel-caption">
<h1 class="animated fadeInDown">可信牛只交易</h1>
<p class="animated fadeInUp delay-1s">全程溯源，资金托管，让交易更放心</p>
<p class="animated fadeInUp delay-2s"><a class="btn btn-lg btn-primary" href="#" role="button">进入交易大厅</a></p>
</div>
</div>
</div>
<a class="left carousel-control" href="#carousel-hero" role="button" data-slide="prev">
<span class="glyphicon glyphicon-chevron-left" aria-hidden="true"></span>
<span class="sr-only">上一张</span>
</a>
<a class="right carousel-control" href="#carousel-hero" role="button" data-slide="next">
<span class="glyphicon glyphicon-chevron-right" aria-hidden="true"></span>
<span class="sr-only">下一张</span>
</a>
</div>
<!-- 平台简介 -->
<section class="section-container text-center">
<div class="container">
<h2 class="section-title">平台简介</h2>
<div class="section-divider"></div>
<div class="row">
<div class="col-md-8 col-md-offset-2">
<p class="lead text-muted">
<span class="text-primary">云南智慧牛产业平台</span>（原彩云牛畜牧管理系统）致力于通过物联网、大数据、人工智能等先进技术，为畜牧业提供从养殖、交易、金融到监管的全方位数字化解决方案。
</p>
<p class="text-muted">我们旨在提升管理效率，降低运营成本，保障食品安全，推动产业升级，助力云南肉牛产业高质量发展。</p>
</div>
</div>
</div>
</section>
<!-- 核心服务 -->
<section class="section-container bg-gray">
<div class="container">
<div class="text-center">
<h2 class="section-title">核心服务</h2>
<p class="section-subtitle">打造全产业链闭环服务体系</p>
<div class="section-divider"></div>
</div>
<div class="row" style="margin-top: 40px;">
<div class="col-sm-6 col-md-3">
<div class="service-card hover-lift">
<div class="service-icon-wrapper" style="background: linear-gradient(135deg, #409EFF 0%, #3a8ee6 100%);">
<i class="glyphicon glyphicon-dashboard service-icon"></i>
</div>
<div class="service-content">
<h3>智慧养殖</h3>
<p>牛只档案、健康监测、繁殖管理、饲料管理，实现精细化养殖。</p>
<a href="solutions.html?tab=farming" class="btn btn-link">查看详情 &rarr;</a>
</div>
</div>
</div>
<div class="col-sm-6 col-md-3">
<div class="service-card hover-lift">
<div class="service-icon-wrapper" style="background: linear-gradient(135deg, #67C23A 0%, #5daf34 100%);">
<i class="glyphicon glyphicon-shopping-cart service-icon"></i>
</div>
<div class="service-content">
<h3>牛只交易</h3>
<p>在线交易大厅、价格行情、供需匹配、安全支付，让交易更便捷。</p>
<a href="solutions.html?tab=trading" class="btn btn-link">查看详情 &rarr;</a>
</div>
</div>
</div>
<div class="col-sm-6 col-md-3">
<div class="service-card hover-lift">
<div class="service-icon-wrapper" style="background: linear-gradient(135deg, #E6A23C 0%, #cf9236 100%);">
<i class="glyphicon glyphicon-yen service-icon"></i>
</div>
<div class="service-content">
<h3>金融服务</h3>
<p>活体抵押贷款、养殖保险、风险评估，解决资金难题。</p>
<a href="solutions.html?tab=finance" class="btn btn-link">查看详情 &rarr;</a>
</div>
</div>
</div>
<div class="col-sm-6 col-md-3">
<div class="service-card hover-lift">
<div class="service-icon-wrapper" style="background: linear-gradient(135deg, #F56C6C 0%, #dd6161 100%);">
<i class="glyphicon glyphicon-stats service-icon"></i>
</div>
<div class="service-content">
<h3>政府监管</h3>
<p>数据上报、合规检查、疫情预警、追溯体系，助力精准监管。</p>
<a href="solutions.html?tab=government" class="btn btn-link">查看详情 &rarr;</a>
</div>
</div>
</div>
</div>
</div>
</section>
<!-- 平台数据 -->
<section class="section-container data-section">
<div class="container">
<div class="text-center text-white">
<h2 class="section-title text-white">平台数据</h2>
<div class="section-divider bg-white"></div>
</div>
<div class="row" style="margin-top: 40px;">
<div class="col-md-6">
<div class="row">
<div class="col-xs-6 text-center data-item wow fadeInUp" data-wow-delay="0.2s">
<div class="number" data-symbol="+">1200</div>
<div class="label">入驻企业</div>
</div>
<div class="col-xs-6 text-center data-item wow fadeInUp" data-wow-delay="0.4s">
<div class="number" data-symbol="+">50000</div>
<div class="label">在栏牛只</div>
</div>
<div class="col-xs-6 text-center data-item wow fadeInUp" data-wow-delay="0.6s">
<div class="number">350000000</div>
<div class="label">累计交易额</div>
</div>
<div class="col-xs-6 text-center data-item wow fadeInUp" data-wow-delay="0.8s">
<div class="number" data-symbol="%">100</div>
<div class="label">安全溯源</div>
</div>
</div>
</div>
<div class="col-md-6">
<div id="main-chart" style="width: 100%; height: 350px;"></div>
</div>
</div>
</div>
</section>
<!-- 底部 Footer -->
<footer class="footer">
<div class="container">
<div class="row">
<div class="col-md-4">
<h3>联系我们</h3>
<p>电话：400-888-8888</p>
<p>邮箱：contact@caiyunniu.com</p>
<p>地址：云南省昆明市高新技术产业开发区</p>
</div>
<div class="col-md-4">
<h3>快速链接</h3>
<ul class="list-unstyled">
<li><a href="about.html">关于平台</a></li>
<li><a href="solutions.html">核心服务</a></li>
<li><a href="help.html">帮助中心</a></li>
<li><a href="contact.html">联系我们</a></li>
</ul>
</div>
<div class="col-md-4">
<h3>关注我们</h3>
<p>微信公众号：云南智慧牛</p>
<p>获取最新行业资讯和平台动态</p>
</div>
</div>
<div class="footer-bottom text-center">
<p>&copy; 2025 云南智慧牛产业平台 版权所有</p>
</div>
</div>
</footer>
<!-- Back to Top -->
<div id="back-to-top" title="回到顶部">
<i class="glyphicon glyphicon-chevron-up"></i>
</div>
<!-- Scripts -->
<script src="https://cdn.bootcdn.net/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script src="https://cdn.bootcdn.net/ajax/libs/twitter-bootstrap/3.4.1/js/bootstrap.min.js"></script>
<script src="https://cdn.bootcdn.net/ajax/libs/echarts/5.4.3/echarts.min.js"></script>
<script src="js/wow.min.js"></script>
<script>
// Initialize WOW.js
new WOW().init();
// Smooth Scroll
$(document).ready(function(){
// Counter Animation
$('.data-item .number').each(function () {
$(this).prop('Counter',0).animate({
Counter: $(this).text().replace(/,/g, '').replace(/\+/g, '')
}, {
duration: 2500,
easing: 'swing',
step: function (now) {
var text = Math.ceil(now).toLocaleString();
if($(this).data('symbol')) {
text += $(this).data('symbol');
}
$(this).text(text);
}
});
});
// Add smooth scrolling to all links
$("a").on('click', function(event) {
if (this.hash !== "") {
event.preventDefault();
var hash = this.hash;
$('html, body').animate({
scrollTop: $(hash).offset().top
}, 800, function(){
window.location.hash = hash;
});
}
});
// Back to Top Button
$(window).scroll(function() {
if ($(this).scrollTop() > 300) {
$('#back-to-top').fadeIn();
} else {
$('#back-to-top').fadeOut();
}
});
$('#back-to-top').click(function() {
$('html, body').animate({scrollTop: 0}, 800);
return false;
});
// Navbar Scroll Effect
$(window).scroll(function() {
if ($(this).scrollTop() > 50) {
$('.navbar-default').addClass('navbar-scrolled');
} else {
$('.navbar-default').removeClass('navbar-scrolled');
}
});
});
// ECharts 初始化
var chartDom = document.getElementById('main-chart');
var myChart = echarts.init(chartDom);
var option;
option = {
title: {
text: '月度交易额趋势',
textStyle: { color: '#fff' },
left: 'center'
},
tooltip: {
trigger: 'axis'
},
grid: {
left: '3%',
right: '4%',
bottom: '3%',
containLabel: true
},
xAxis: {
type: 'category',
boundaryGap: false,
data: ['1月', '2月', '3月', '4月', '5月', '6月'],
axisLabel: { color: '#fff' },
axisLine: { lineStyle: { color: '#fff' } }
},
yAxis: {
type: 'value',
axisLabel: { color: '#fff' },
splitLine: { lineStyle: { color: 'rgba(255,255,255,0.1)' } }
},
series: [
{
name: '交易额 (万元)',
type: 'line',
smooth: true,
data: [1200, 1320, 1010, 1340, 2900, 3500],
itemStyle: { color: '#409EFF' },
areaStyle: {
color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
{ offset: 0, color: 'rgba(64, 158, 255, 0.5)' },
{ offset: 1, color: 'rgba(64, 158, 255, 0.1)' }
])
}
}
]
};
option && myChart.setOption(option);
// 响应式图表
window.addEventListener('resize', function() {
myChart.resize();
});
</script>
</body>
</html>