feat: 优化用户界面和功能实现

- 新增自定义用户信息卡片样式
- 优化登录页面输入框和按钮样式
- 重构首页布局和图标展示
- 添加多种操作图标资源
- 改进用户退出登录逻辑
- 优化页面跳转和错误处理

pages/index/index.scss

@@ -1,34 +1,114 @@
-.gap{
-	border-radius: ;
-}
+
+/* 首页样式文件 */
+
+/* 主容器 */
 .home-container {
-	width: 360px;
-	height: 594px;
-	background-color: white;
+  width: 100%;
+  min-height: 100vh;
+  background: linear-gradient(135deg, #f0f2f5 0%, #e1e5ee 100%);
+  padding: 20rpx;
+  box-sizing: border-box;
 }
-.home-banner-box {
-	width: 360px;
-	height: 180px;
+
+/* 板块容器 */
+.section-container {
+  width: 100%;
 }
-.home-button-box{
-	padding: 20px;
-	width: 360px;
-	height: 310px;
+
+/* 板块卡片 */
+.section-card {
+  background-color: #ffffff;
+  border-radius: 20rpx;
+  padding: 10rpx;
+  box-shadow: 0 6rpx 16rpx rgba(0, 0, 0, 0.08);
+  margin-bottom: 10rpx;
 }
-.home-button-action:active{
-	border: 1px solid #b6b6b6;
-	opacity: .70;
+
+/* 板块标题 */
+.section-title {
+  font-size: 36rpx;
+  font-weight: 600;
+  margin: 0 0 20rpx 10rpx;
+  color: #2c3e50;
+  letter-spacing: 1rpx;
+  text-shadow: 0 2rpx 4rpx rgba(0, 0, 0, 0.1);
 }
-.box-1{
-	display: flex;
-	flex-direction: column;
-	align-items: center;
-	justify-content: center;
-	
+
+/* 网格容器 */
+.grid-container {
+  display: flex;
+  flex-wrap: wrap;
+  justify-content: space-between;
+  width: 100%;
 }
-.box-2{
-	display: flex;
-	flex-direction: row;
-	align-items: center;
-	justify-content: center;
+
+/* 网格项 */
+.grid-item {
+  width: 24%; /* 一行4个，每个占24%宽度，留有间隙 */
+  background-color: #ffffff;
+  border-radius: 20rpx;
+  margin-bottom: 20rpx;
+  box-shadow: 0 6rpx 16rpx rgba(0, 0, 0, 0.08);
+  transition: all 0.3s ease;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  padding: 20rpx 0;
+  box-sizing: border-box;
+}
+
+/* 网格项悬停效果 */
+.grid-item:hover {
+  transform: translateY(-4rpx);
+  box-shadow: 0 10rpx 24rpx rgba(0, 0, 0, 0.12);
+}
+
+/* 网格项点击效果 */
+.grid-item:active {
+  transform: scale(0.96);
+  box-shadow: 0 2rpx 8rpx rgba(0, 0, 0, 0.1);
+}
+
+/* 占位网格项 */
+.grid-item.placeholder {
+  visibility: hidden;
+}
+
+/* 图标 */
+.grid-icon {
+  width: 80rpx;
+  height: 80rpx;
+  margin-bottom: 15rpx;
+}
+
+/* 文字 */
+.grid-text {
+  font-size: 28rpx;
+  color: #4a5568;
+  letter-spacing: 0.5rpx;
+  line-height: 1.4;
+  font-weight: 500;
+  text-align: center;
+}
+
+/* 板块间隔 */
+.section-gap {
+  height: 40rpx;
+}
+
+/* 响应式调整 */
+@media screen and (max-width: 360px) {
+  .grid-item {
+    width: 23%;
+  }
+  
+  .grid-icon {
+    width: 70rpx;
+    height: 70rpx;
+  }
+  
+  .grid-text {
+    font-size: 24rpx;
+  }
 }