Browse Source

将联系客服按钮添加到主页面,与消息中心按钮并排显示

pull/1/head
Default User 3 months ago
parent
commit
fcfef0416b
  1. 17
      pages/index/index.js
  2. 3
      pages/index/index.wxml
  3. 21
      pages/index/index.wxss

17
pages/index/index.js

@ -29,6 +29,23 @@ Page({
});
},
// 跳转到客服列表页面
navigateToCustomerService() {
wx.navigateTo({
url: '/pages/customer-service/index',
success: function() {
console.log('成功跳转到客服列表页面');
},
fail: function(error) {
console.error('跳转到客服列表页面失败:', error);
wx.showToast({
title: '跳转失败,请稍后重试',
icon: 'none'
});
}
});
},
onLoad() {
console.log('首页初始化')
},

3
pages/index/index.wxml

@ -1,7 +1,10 @@
<view class="container">
<image src="/images/生成鸡蛋贸易平台图片.png" style="width: 100%; height: 425rpx; margin: -280rpx auto 20rpx; display: block;"></image>
<view class="title" style="margin-top: 60rpx;">中国最专业的鸡蛋现货交易平台</view>
<view class="btn-container">
<button class="btn message-btn" bindtap="navigateToChat">消息中心</button>
<button class="btn service-btn" bindtap="navigateToCustomerService">联系客服</button>
</view>
<view class="desc" style="margin: 30rpx 0; text-align: center; padding: 0 20rpx;">
</view>

21
pages/index/index.wxss

@ -68,11 +68,30 @@ page {
background: rgba(76, 175, 80, 0.15);
}
/* 按钮容器样式,用于并排显示按钮 */
.btn-container {
display: flex;
flex-direction: row;
justify-content: space-around;
margin: 30rpx auto 0;
width: 80%;
gap: 20rpx;
}
/* 消息按钮样式 */
.message-btn {
color: #FF6B6B;
background: rgba(255, 107, 107, 0.15);
margin-top: 30rpx;
margin: 0;
width: 48%;
}
/* 联系客服按钮样式 */
.service-btn {
color: #1677ff;
background: rgba(22, 119, 255, 0.15);
margin: 0;
width: 48%;
}
/* 立即入驻按钮样式 */

Loading…
Cancel
Save