+
核心功能
+专业、高效、易用的服务平台
+-
-
- +
-
记账管理
最专业的个人记账服务
- - +
-
健康档案
满足健康档案记录需求
- - +
-
茅台预约
提供安全高效自动预约
- - +
-
-->
智聪物联
@@ -103,12 +101,25 @@-- 智聪网络科技 技术领先 想您所想 -
-- 提供个人资产记账、健康档案管理、i茅台预约服务、物联平台服务 -
+++ + 技术领先 + 想您所想 +
++ 提供个人资产记账服务 +
++ 健康档案管理服务 +
++ i茅台预约服务 +
++ 物联网平台建设服务 +
+@@ -154,6 +165,22 @@ }else{ this.$router.push({path:'/'}) } + }, + goToService: function(type) { + const links = { + accounting: this.isMobile ? 'http://investh5.qdintc.com' : 'http://invest.qdintc.com', + health: this.isMobile ? 'http://healthh5.qdintc.com' : 'http://health.qdintc.com', + imaotai: this.isMobile ? 'http://imaotaih5.qdintc.com' : 'http://imaotai.qdintc.com', + iot: '#' // 物联平台链接，暂时未开放 + } + if(links[type] && links[type] !== '#') { + window.open(links[type], '_blank') + } + } + }, + computed: { + isMobile() { + return Util.os.android || Util.os.iPhone || Util.os.mobile || Util.os.isapp || Util.os.harmonyOS } } @@ -161,100 +188,181 @@ diff --git a/src/views/callus.vue b/src/views/callus.vue index b505d56..e55afa5 100644 --- a/src/views/callus.vue +++ b/src/views/callus.vue @@ -7,40 +7,65 @@ 首页 --- 联系我们->注册账号->免费使用 -
-- 满足您的记账需求、健康记录、茅台预约 -
+ + -- --
-
-
-
-
微信公众号
- -intc126 智聪PL
-
- -
-
-
智聪网络科技客服
-客服电话：17753252359
-智聪网络科技微信：intcqd
-智聪记账客服微信：qdintc126
-智聪健康客服微信：intchealth
-
- - - - -
++ +++++1+联系我们
+→+++2+注册账号
+→+++3+免费使用
+满足您的记账需求、健康记录、茅台预约、物联网建设
++++ +微信公众号
+ ++++++++
智聪PL
+扫码关注，获取更多资讯+++联系方式
+ ++++++++
客服微信
+客服电话：17753252359+@@ -55,6 +80,8 @@ import feature2 from '../assets/img/feature2.png' import feature3 from '../assets/img/feature3.png' import feature4 from '../assets/img/feature4.png' + import wxgzh from '../assets/img/wxgzh.jpg' + import zckj from '../assets/img/zckj.jpg' import Util from '../Util' export default{ components: {Page, Logo, ZuiHeader, ZuiFooter,ZuiButton}, @@ -64,6 +91,8 @@ feature2: feature2, feature3: feature3, feature4: feature4, + wxgzh: wxgzh, + zckj: zckj, carouselPerPage: (Util.os.android || Util.os.iPhone|| Util.os.wechat|| Util.os.mobile|| Util.os.isapp|| Util.os.harmonyOS) ? 1 : 2 } }, @@ -82,38 +111,388 @@ } diff --git a/src/views/less/home-page.less b/src/views/less/home-page.less index 75ebec0..5d77e73 100644 --- a/src/views/less/home-page.less +++ b/src/views/less/home-page.less @@ -2,38 +2,82 @@ overflow-x: hidden; .banner { text-align: center; - padding: 180px 20px; + padding: 200px 20px 180px; background: url('../img/zhichou-banner.jpg') center no-repeat; background-size: cover; position: relative; overflow: hidden; - &:before { - content: ''; + min-height: 500px; + display: flex; + align-items: center; + justify-content: center; + + // 增强的渐变遮罩 + .banner-overlay { position: absolute; top: 0; left: 0; right: 0; bottom: 0; - background: linear-gradient(180deg, rgba(13,38,56,0.00) 0%, rgba(13,38,56,0.35) 100%); + background: linear-gradient(135deg, + rgba(13,38,56,0.75) 0%, + rgba(53,163,186,0.6) 50%, + rgba(13,38,56,0.75) 100%); pointer-events: none; + z-index: 1; } - img { - top: 0; - left: 0; - right: 0; - width: 100%; - height: auto; + + .banner-content { + position: relative; + z-index: 2; + max-width: 1200px; margin: 0 auto; - position: absolute; - } - h1 { - color: #fff; - font-size: 42px; - margin: 0; - text-shadow: 0 2px 12px rgba(0,0,0,0.25); - } - h3 { - color: #fff; - font-size: 24px; - margin-top: 28px; - text-shadow: 0 1px 6px rgba(0,0,0,0.2); + padding: 40px 30px; + background: rgba(13, 38, 56, 0.4); + border-radius: 20px; + backdrop-filter: blur(10px); + border: 1px solid rgba(255, 255, 255, 0.1); + + h1 { + color: #fff; + font-size: 56px; + font-weight: 700; + margin: 0 0 40px; + text-shadow: 0 4px 20px rgba(0,0,0,0.4); + letter-spacing: 2px; + } + + .banner-slogans { + display: flex; + flex-wrap: nowrap; + justify-content: center; + gap: 15px; + margin: 30px 0; + + h2 { + color: #fff; + font-size: 24px; + font-weight: 500; + margin: 0; + padding: 12px 20px; + background: rgba(255,255,255,0.15); + border-radius: 8px; + backdrop-filter: blur(10px); + text-shadow: 0 2px 8px rgba(0,0,0,0.3); + transition: all 0.3s ease; + white-space: nowrap; + + &:hover { + background: rgba(255,255,255,0.25); + transform: translateY(-2px); + } + } + } + + .banner-subtitle { + color: rgba(255,255,255,0.95); + font-size: 18px; + margin-top: 40px; + text-shadow: 0 2px 10px rgba(0,0,0,0.3); + letter-spacing: 1px; + } } } .nav { @@ -53,8 +97,14 @@ padding: 60px 0 40px 0; border: 1px solid #32ADC6; position: relative; + cursor: pointer; + transition: all 0.3s ease; + border-radius: 12px; + &:hover { text-decoration: none; + transform: translateY(-5px); + box-shadow: 0 10px 30px rgba(0,0,0,0.15); .watermark { color: #fff !important; } @@ -147,40 +197,212 @@ margin: 30px 0 165px 0; } .service { - padding: 72px 0; + padding: 50px 20px 40px; text-align: center; + background: linear-gradient(180deg, #f8fffe 0%, #fff 100%); + position: relative; + overflow: hidden; + + // 背景装饰 + &::before { + content: ''; + position: absolute; + top: 50%; + left: 50%; + transform: translate(-50%, -50%); + width: 800px; + height: 800px; + background: radial-gradient(circle, rgba(53, 163, 186, 0.03) 0%, transparent 70%); + pointer-events: none; + } + + .service-content { + position: relative; + z-index: 1; + } + h1 { - color: #6AC2B5; - font-size: 52px; - line-height: 70px; + color: #35A3BA; + font-size: 38px; + line-height: 1.6; + margin: 0; + font-weight: 600; } + h3 { - color: #000; - font-size: 40px; - margin-top: 15px; + color: #666; + font-size: 20px; + margin-top: 20px; + font-weight: 400; + letter-spacing: 0.5px; } - h4 { - font-size: 29px; - line-height: 32px; - font-weight: normal; + + .service-highlight { + display: inline-flex; + align-items: center; + gap: 10px; margin-top: 40px; + padding: 16px 32px; + background: linear-gradient(135deg, #FF6B35 0%, #FF8C61 100%); + border-radius: 50px; + box-shadow: 0 4px 15px rgba(255, 107, 53, 0.3); + transition: all 0.3s ease; + + .highlight-icon { + font-size: 24px; + animation: sparkle 2s infinite; + } + + .highlight-text { + color: #fff; + font-size: 20px; + font-weight: 600; + letter-spacing: 1px; + } + + &:hover { + transform: scale(1.05); + box-shadow: 0 6px 20px rgba(255, 107, 53, 0.4); + } } } + + @keyframes sparkle { + 0%, 100% { transform: scale(1); opacity: 1; } + 50% { transform: scale(1.2); opacity: 0.8; } + } .apply-hr { color: #fff; text-align: center; - background: #6AC2B5; - padding: 49px 0 50px 0; + background: linear-gradient(135deg, #1e3c72 0%, #2a5298 50%, #7e22ce 100%); + padding: 60px 20px; + position: relative; + overflow: hidden; + + // 动态网格背景 + &::before { + content: ''; + position: absolute; + top: 0; + left: 0; + right: 0; + bottom: 0; + background-image: + linear-gradient(rgba(255,255,255,0.03) 1px, transparent 1px), + linear-gradient(90deg, rgba(255,255,255,0.03) 1px, transparent 1px); + background-size: 50px 50px; + animation: gridMove 20s linear infinite; + pointer-events: none; + } + + // 发光圆圈装饰 + &::after { + content: ''; + position: absolute; + top: 50%; + left: 50%; + transform: translate(-50%, -50%); + width: 600px; + height: 600px; + background: radial-gradient(circle, rgba(139, 92, 246, 0.15) 0%, transparent 70%); + border-radius: 50%; + animation: pulse 4s ease-in-out infinite; + pointer-events: none; + } + + .apply-hr-content { + position: relative; + z-index: 1; + } + h2 { - font-size: 39px; + font-size: 42px; + margin: 0; + line-height: 1.6; + display: flex; + align-items: center; + justify-content: center; + flex-wrap: wrap; + gap: 20px; + + .apply-title { + font-weight: 700; + letter-spacing: 3px; + text-shadow: 0 0 20px rgba(139, 92, 246, 0.5), 0 0 40px rgba(139, 92, 246, 0.3); + background: linear-gradient(90deg, #fff 0%, #e0e7ff 50%, #fff 100%); + background-size: 200% auto; + -webkit-background-clip: text; + -webkit-text-fill-color: transparent; + background-clip: text; + animation: shimmer 3s linear infinite; + } + + .apply-tag { + display: inline-block; + padding: 8px 24px; + background: rgba(255, 255, 255, 0.08); + border-radius: 25px; + font-size: 18px; + font-weight: 500; + backdrop-filter: blur(10px); + border: 1px solid rgba(139, 92, 246, 0.4); + box-shadow: 0 4px 15px rgba(139, 92, 246, 0.2), + inset 0 1px 0 rgba(255, 255, 255, 0.1); + transition: all 0.3s ease; + position: relative; + overflow: hidden; + + &::before { + content: ''; + position: absolute; + top: 0; + left: -100%; + width: 100%; + height: 100%; + background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.2), transparent); + transition: left 0.5s ease; + } + + &:hover { + background: rgba(139, 92, 246, 0.25); + border-color: rgba(139, 92, 246, 0.6); + transform: translateY(-3px); + box-shadow: 0 6px 20px rgba(139, 92, 246, 0.4), + inset 0 1px 0 rgba(255, 255, 255, 0.2); + + &::before { + left: 100%; + } + } + } } + h4 { - font-size: 29px; - font-weight: normal; - margin-top: 20px; + font-size: 16px; + font-weight: 300; + margin-top: 25px; + opacity: 0.9; + letter-spacing: 1.5px; + line-height: 1.8; + text-shadow: 0 2px 10px rgba(0, 0, 0, 0.3); } } + + @keyframes gridMove { + 0% { transform: translate(0, 0); } + 100% { transform: translate(50px, 50px); } + } + + @keyframes pulse { + 0%, 100% { transform: translate(-50%, -50%) scale(1); opacity: 0.5; } + 50% { transform: translate(-50%, -50%) scale(1.1); opacity: 0.8; } + } + + @keyframes shimmer { + 0% { background-position: 0% center; } + 100% { background-position: 200% center; } + } .features { background: #DEF0EF; padding: 50px 0; @@ -216,18 +438,33 @@ overflow-x: hidden; width: 100%; .banner { - padding: 60px 15px; - h1 { - font-size: 20px; - line-height: 1.4; - .br { - display: block; + padding: 80px 15px 60px; + min-height: 400px; + + .banner-content { + padding: 30px 20px; + margin: 0 10px; + + h1 { + font-size: 32px; + margin: 0 0 25px; + letter-spacing: 1px; + } + + .banner-slogans { + flex-direction: column; + gap: 12px; + + h2 { + font-size: 18px; + padding: 10px 20px; + } + } + + .banner-subtitle { + font-size: 14px; + margin-top: 25px; } - } - h3 { - font-size: 12px; - line-height: 1.5; - margin-top: 15px; } } .nav { @@ -279,19 +516,29 @@ margin: 0 0 30px 0; } .service{ - padding: 30px 15px; + padding: 40px 15px; + h1{ - font-size: 22px; - line-height: 32px; + font-size: 20px; + line-height: 1.6; } h3{ - font-size: 16px; - line-height: 24px; + font-size: 15px; + line-height: 1.5; + margin-top: 15px; } - h4{ - font-size: 14px; - line-height: 22px; - margin-top: 20px; + + .service-highlight { + margin-top: 30px; + padding: 12px 24px; + + .highlight-icon { + font-size: 20px; + } + + .highlight-text { + font-size: 16px; + } } } .features{ @@ -316,15 +563,28 @@ } .apply-hr{ - padding: 25px 15px; + padding: 45px 15px; + h2{ - font-size: 18px; - line-height: 26px; + font-size: 24px; + line-height: 1.6; + flex-direction: column; + gap: 12px; + + .apply-title { + letter-spacing: 2px; + font-size: 26px; + } + + .apply-tag { + font-size: 16px; + padding: 6px 20px; + } } h4{ font-size: 14px; - line-height: 20px; - margin-top: 10px; + line-height: 1.8; + margin-top: 20px; } } .apply-hr-form{ diff --git a/src/views/resource.vue b/src/views/resource.vue index 6f26891..4605869 100644 --- a/src/views/resource.vue +++ b/src/views/resource.vue @@ -7,47 +7,91 @@ 首页 --- 安卓APP下载->系统介绍->使用手册 -
-- 满足您的记账需求、健康记录、茅台预约 -
+ + + + +++下载专区
+满足您的记账需求、健康记录、茅台预约
+-
- -+++
记账管理平台
+专业的个人记账服务平台
++- -
-+++健康管理平台
+健康档案管理专家
++- -
-+++茅台预约平台
+茅台预约得力助手
+@@ -138,154 +182,327 @@ download(type) { } - -
-
-