Browse Source

添加企业介绍页面并修改首页跳转逻辑

pull/19/head
徐飞洋 1 month ago
parent
commit
1f03db8688
  1. 3
      app.json
  2. 55
      pages/company/company.js
  3. 6
      pages/company/company.json
  4. 197
      pages/company/company.wxml
  5. 343
      pages/company/company.wxss
  6. 2
      pages/index/index.js

3
app.json

@ -18,7 +18,8 @@
"pages/customer-service/index", "pages/customer-service/index",
"pages/cooperation/index", "pages/cooperation/index",
"pages/goods/index", "pages/goods/index",
"pages/order/index" "pages/order/index",
"pages/company/company"
], ],
"subpackages": [ "subpackages": [
{ {

55
pages/company/company.js

@ -0,0 +1,55 @@
Page({
/**
* 页面的初始数据
*/
data: {
},
/**
* 生命周期函数--监听页面加载
*/
onLoad(options) {
},
/**
* 生命周期函数--监听页面初次渲染完成
*/
onReady() {
},
/**
* 生命周期函数--监听页面显示
*/
onShow() {
},
/**
* 生命周期函数--监听页面隐藏
*/
onHide() {
},
/**
* 生命周期函数--监听页面卸载
*/
onUnload() {
},
/**
* 页面相关事件处理函数--监听用户下拉动作
*/
onPullDownRefresh() {
},
/**
* 页面上拉触底事件的处理函数
*/
onReachBottom() {
},
/**
* 用户点击右上角分享
*/
onShareAppMessage() {
}
})

6
pages/company/company.json

@ -0,0 +1,6 @@
{
"navigationBarTitleText": "关于我们",
"navigationBarBackgroundColor": "#007aff",
"navigationBarTextStyle": "white",
"backgroundColor": "#f5f5f5"
}

197
pages/company/company.wxml

@ -0,0 +1,197 @@
<view class="company-container">
<!-- 头部banner -->
<view class="banner">
<image class="banner-img" src="https://trae-api-cn.mchost.guru/api/ide/v1/text_to_image?prompt=modern%20corporate%20banner%20with%20blue%20gradient%20background%2C%20professional%20business%20style%2C%20corporate%20logo%20placeholder%2C%20clean%20and%20minimalist%20design&image_size=landscape_16_9"></image>
<view class="banner-overlay">
<text class="banner-title">关于我们</text>
<text class="banner-subtitle">专业、创新、值得信赖的合作伙伴</text>
</view>
</view>
<!-- 关于我们 -->
<view class="section">
<view class="section-header">
<text class="section-title">一、关于我们</text>
<view class="section-line"></view>
</view>
<view class="section-content">
<text class="company-name">科技未来有限公司</text>
<text class="company-desc">成立于2018年,是一家专注于智能科技研发的高新技术企业。公司总部位于北京市海淀区,并在上海、深圳设有研发中心,业务覆盖全国各省市。</text>
<text class="company-desc">自成立以来,我们始终秉持"以客户为中心、以创新为驱动、以品质为基石"的核心经营理念,致力于为企业客户提供高品质的智能解决方案,凭借专业的能力和优质的服务,赢得了行业内的广泛认可和客户的高度信赖。</text>
</view>
</view>
<!-- 发展历程 -->
<view class="section">
<view class="section-header">
<text class="section-title">二、发展历程</text>
<view class="section-line"></view>
</view>
<view class="timeline">
<view class="timeline-item">
<view class="timeline-dot"></view>
<view class="timeline-content">
<text class="timeline-year">2018</text>
<text class="timeline-desc">公司正式成立,确立智能科技研发为核心业务方向</text>
</view>
</view>
<view class="timeline-item">
<view class="timeline-dot"></view>
<view class="timeline-content">
<text class="timeline-year">2019</text>
<text class="timeline-desc">首款智能硬件产品上线,获得国家高新技术企业认证</text>
</view>
</view>
<view class="timeline-item">
<view class="timeline-dot"></view>
<view class="timeline-content">
<text class="timeline-year">2021</text>
<text class="timeline-desc">在上海、深圳成立研发中心,完成A轮融资</text>
</view>
</view>
<view class="timeline-item">
<view class="timeline-dot"></view>
<view class="timeline-content">
<text class="timeline-year">2023</text>
<text class="timeline-desc">荣获"科技创新企业"奖项,推出AI智能助手系列产品</text>
</view>
</view>
<view class="timeline-item">
<view class="timeline-dot"></view>
<view class="timeline-content">
<text class="timeline-year">至今</text>
<text class="timeline-desc">已成为行业内具有影响力的智能科技企业,持续深耕核心领域并探索新业务方向</text>
</view>
</view>
</view>
</view>
<!-- 核心业务 -->
<view class="section">
<view class="section-header">
<text class="section-title">三、核心业务</text>
<view class="section-line"></view>
</view>
<view class="business-grid">
<view class="business-item">
<view class="business-icon">
<text>🤖</text>
</view>
<text class="business-title">智能硬件研发</text>
<text class="business-desc">专注于智能硬件的研发设计,为企业客户提供从方案设计到量产交付的全流程服务</text>
</view>
<view class="business-item">
<view class="business-icon">
<text>💻</text>
</view>
<text class="business-title">企业数字化转型</text>
<text class="business-desc">为传统企业提供数字化转型规划、系统搭建、运营指导等一站式服务</text>
</view>
<view class="business-item">
<view class="business-icon">
<text>📱</text>
</view>
<text class="business-title">AI智能解决方案</text>
<text class="business-desc">基于人工智能技术,为客户提供智能客服、数据分析、预测模型等解决方案</text>
</view>
</view>
</view>
<!-- 核心优势 -->
<view class="section">
<view class="section-header">
<text class="section-title">四、核心优势</text>
<view class="section-line"></view>
</view>
<view class="advantages-list">
<view class="advantage-item">
<view class="advantage-number">01</view>
<view class="advantage-content">
<text class="advantage-title">技术优势</text>
<text class="advantage-desc">拥有一支由行业资深专家组成的研发团队,累计获得20项发明专利,掌握核心AI算法技术</text>
</view>
</view>
<view class="advantage-item">
<view class="advantage-number">02</view>
<view class="advantage-content">
<text class="advantage-title">团队优势</text>
<text class="advantage-desc">核心团队成员拥有10年以上行业从业经验,对行业发展趋势和客户需求有深刻理解</text>
</view>
</view>
<view class="advantage-item">
<view class="advantage-number">03</view>
<view class="advantage-content">
<text class="advantage-title">品质优势</text>
<text class="advantage-desc">建立了完善的质量控制体系,从产品研发、生产到交付的全流程严格把控</text>
</view>
</view>
<view class="advantage-item">
<view class="advantage-number">04</view>
<view class="advantage-content">
<text class="advantage-title">客户资源</text>
<text class="advantage-desc">已与多家知名企业建立长期稳定的合作关系,拥有广泛的客户基础和良好的市场口碑</text>
</view>
</view>
</view>
</view>
<!-- 企业文化 -->
<view class="section">
<view class="section-header">
<text class="section-title">五、企业文化</text>
<view class="section-line"></view>
</view>
<view class="culture-grid">
<view class="culture-item">
<text class="culture-icon">🎯</text>
<text class="culture-title">企业使命</text>
<text class="culture-desc">用科技赋能行业发展,为客户创造更大价值</text>
</view>
<view class="culture-item">
<text class="culture-icon">🌟</text>
<text class="culture-title">企业愿景</text>
<text class="culture-desc">成为行业内领先的智能解决方案提供商,打造百年企业</text>
</view>
<view class="culture-item">
<text class="culture-icon">💡</text>
<text class="culture-title">核心价值观</text>
<text class="culture-desc">诚信、创新、协作、卓越、客户至上</text>
</view>
<view class="culture-item">
<text class="culture-icon">🔥</text>
<text class="culture-title">企业精神</text>
<text class="culture-desc">精益求精、开拓进取、团结拼搏</text>
</view>
</view>
</view>
<!-- 联系方式 -->
<view class="section contact-section">
<view class="section-header">
<text class="section-title">六、联系方式</text>
<view class="section-line"></view>
</view>
<view class="contact-info">
<view class="contact-item">
<text class="contact-icon">📍</text>
<text class="contact-label">公司地址</text>
<text class="contact-value">北京市海淀区中关村科技园区</text>
</view>
<view class="contact-item">
<text class="contact-icon">📞</text>
<text class="contact-label">联系电话</text>
<text class="contact-value">400-123-4567</text>
</view>
<view class="contact-item">
<text class="contact-icon">✉️</text>
<text class="contact-label">电子邮箱</text>
<text class="contact-value">contact@example.com</text>
</view>
<view class="contact-item">
<text class="contact-icon">🌐</text>
<text class="contact-label">官方网站</text>
<text class="contact-value">www.example.com</text>
</view>
</view>
</view>
</view>

343
pages/company/company.wxss

@ -0,0 +1,343 @@
.company-container {
min-height: 100vh;
background-color: #f5f5f5;
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
}
/* 头部banner */
.banner {
position: relative;
height: 300rpx;
overflow: hidden;
}
.banner-img {
width: 100%;
height: 100%;
object-fit: cover;
}
.banner-overlay {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
background: linear-gradient(to right, rgba(0, 122, 255, 0.8), rgba(0, 170, 255, 0.6));
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
color: white;
}
.banner-title {
font-size: 48rpx;
font-weight: bold;
margin-bottom: 20rpx;
}
.banner-subtitle {
font-size: 28rpx;
opacity: 0.9;
}
/* 通用 section 样式 */
.section {
background-color: white;
margin: 20rpx;
padding: 30rpx;
border-radius: 16rpx;
box-shadow: 0 2rpx 10rpx rgba(0, 0, 0, 0.05);
}
.section-header {
display: flex;
align-items: center;
margin-bottom: 30rpx;
}
.section-title {
font-size: 32rpx;
font-weight: bold;
color: #333;
margin-right: 20rpx;
}
.section-line {
flex: 1;
height: 2rpx;
background: linear-gradient(to right, #007aff, transparent);
}
/* 关于我们内容 */
.company-name {
font-size: 36rpx;
font-weight: bold;
color: #007aff;
margin-bottom: 20rpx;
display: block;
}
.company-desc {
font-size: 28rpx;
color: #666;
line-height: 44rpx;
margin-bottom: 20rpx;
display: block;
}
/* 发展历程 */
.timeline {
position: relative;
padding-left: 40rpx;
}
.timeline::before {
content: '';
position: absolute;
left: 15rpx;
top: 0;
bottom: 0;
width: 2rpx;
background-color: #e0e0e0;
}
.timeline-item {
position: relative;
margin-bottom: 40rpx;
}
.timeline-dot {
position: absolute;
left: -35rpx;
top: 8rpx;
width: 24rpx;
height: 24rpx;
border-radius: 50%;
background-color: #007aff;
border: 4rpx solid white;
box-shadow: 0 0 0 4rpx #e3f2fd;
}
.timeline-year {
font-size: 28rpx;
font-weight: bold;
color: #007aff;
margin-bottom: 10rpx;
display: block;
}
.timeline-desc {
font-size: 26rpx;
color: #666;
line-height: 40rpx;
}
/* 核心业务 */
.business-grid {
display: grid;
grid-template-columns: repeat(1, 1fr);
gap: 30rpx;
}
@media (min-width: 768rpx) {
.business-grid {
grid-template-columns: repeat(3, 1fr);
}
}
.business-item {
background-color: #f8f9fa;
padding: 30rpx;
border-radius: 12rpx;
text-align: center;
transition: transform 0.3s ease, box-shadow 0.3s ease;
}
.business-item:hover {
transform: translateY(-5rpx);
box-shadow: 0 5rpx 20rpx rgba(0, 0, 0, 0.1);
}
.business-icon {
width: 80rpx;
height: 80rpx;
background-color: #e3f2fd;
border-radius: 50%;
display: flex;
justify-content: center;
align-items: center;
margin: 0 auto 20rpx;
font-size: 40rpx;
}
.business-title {
font-size: 28rpx;
font-weight: bold;
color: #333;
margin-bottom: 15rpx;
display: block;
}
.business-desc {
font-size: 24rpx;
color: #666;
line-height: 36rpx;
}
/* 核心优势 */
.advantages-list {
display: flex;
flex-direction: column;
gap: 30rpx;
}
.advantage-item {
display: flex;
align-items: flex-start;
gap: 20rpx;
padding: 20rpx;
background-color: #f8f9fa;
border-radius: 12rpx;
}
.advantage-number {
font-size: 36rpx;
font-weight: bold;
color: #007aff;
opacity: 0.3;
min-width: 60rpx;
}
.advantage-content {
flex: 1;
}
.advantage-title {
font-size: 28rpx;
font-weight: bold;
color: #333;
margin-bottom: 10rpx;
display: block;
}
.advantage-desc {
font-size: 24rpx;
color: #666;
line-height: 36rpx;
}
/* 企业文化 */
.culture-grid {
display: grid;
grid-template-columns: repeat(2, 1fr);
gap: 20rpx;
}
.culture-item {
background-color: #f8f9fa;
padding: 30rpx;
border-radius: 12rpx;
text-align: center;
transition: transform 0.3s ease;
}
.culture-item:hover {
transform: translateY(-5rpx);
}
.culture-icon {
font-size: 48rpx;
margin-bottom: 15rpx;
display: block;
}
.culture-title {
font-size: 26rpx;
font-weight: bold;
color: #333;
margin-bottom: 10rpx;
display: block;
}
.culture-desc {
font-size: 22rpx;
color: #666;
line-height: 32rpx;
}
/* 联系方式 */
.contact-section {
margin-bottom: 40rpx;
}
.contact-info {
display: flex;
flex-direction: column;
gap: 25rpx;
}
.contact-item {
display: flex;
align-items: center;
gap: 20rpx;
padding: 20rpx;
background-color: #f8f9fa;
border-radius: 12rpx;
}
.contact-icon {
font-size: 32rpx;
min-width: 40rpx;
}
.contact-label {
font-size: 26rpx;
font-weight: bold;
color: #333;
min-width: 120rpx;
}
.contact-value {
font-size: 26rpx;
color: #666;
flex: 1;
}
/* 响应式设计 */
@media (max-width: 767rpx) {
.section {
margin: 10rpx;
padding: 20rpx;
}
.banner {
height: 250rpx;
}
.banner-title {
font-size: 36rpx;
}
.banner-subtitle {
font-size: 24rpx;
}
.section-title {
font-size: 28rpx;
}
.company-desc,
.timeline-desc,
.business-desc,
.advantage-desc,
.culture-desc,
.contact-value {
font-size: 24rpx;
}
.culture-grid {
grid-template-columns: repeat(1, 1fr);
}
}

2
pages/index/index.js

@ -2310,7 +2310,7 @@ Page({
sidebarBtnHidden: true sidebarBtnHidden: true
}); });
wx.navigateTo({ wx.navigateTo({
url: '/pages/cooperation/index' url: '/pages/company/company'
}) })
}, },

Loading…
Cancel
Save