fix: 卡片改为纯白底,图标和文字改为深色,简洁美观

This commit is contained in:
Agent
2026-03-28 13:10:53 +00:00
parent 6bce9ad6cf
commit 05e37b3abe

View File

@@ -7,7 +7,7 @@
<text class="username">{{ userInfo.username || '用户' }}</text>
</view>
<view class="role-badge" :class="roleClass">
<Icon name="user" :size="24" color="#fff" />
<Icon name="user" :size="24" color="#667eea" />
<text class="role-text">{{ roleText }}</text>
</view>
</view>
@@ -56,37 +56,37 @@
<!-- 管理员菜单 -->
<template v-if="isAdmin">
<view class="menu-card" @click="goTo('/pages/order/create')">
<Icon name="edit" :size="36" color="#fff" />
<Icon name="edit" :size="36" color="#667eea" />
<text class="menu-card-title">创建订单</text>
</view>
<view class="menu-card" @click="goToTab('/pages/order/list')">
<Icon name="order" :size="36" color="#fff" />
<Icon name="order" :size="36" color="#667eea" />
<text class="menu-card-title">订单列表</text>
</view>
<view class="menu-card" @click="goTo('/pages/order/search')">
<Icon name="search" :size="36" color="#fff" />
<Icon name="search" :size="36" color="#667eea" />
<text class="menu-card-title">订单查询</text>
</view>
<view class="menu-card" @click="goTo('/pages/order/return')">
<Icon name="right" :size="36" color="#fff" />
<Icon name="right" :size="36" color="#667eea" />
<text class="menu-card-title">退货</text>
</view>
</template>
<!-- 销售菜单 -->
<template v-else-if="isSales">
<view class="menu-card" @click="goTo('/pages/order/create')">
<Icon name="edit" :size="36" color="#fff" />
<Icon name="edit" :size="36" color="#667eea" />
<text class="menu-card-title">创建订单</text>
</view>
<view class="menu-card" @click="goToTab('/pages/order/list')">
<Icon name="order" :size="36" color="#fff" />
<Icon name="order" :size="36" color="#667eea" />
<text class="menu-card-title">订单列表</text>
</view>
</template>
<!-- 顾客菜单 -->
<template v-else-if="isCustomer">
<view class="menu-card" @click="goToTab('/pages/order/list')">
<Icon name="order" :size="36" color="#fff" />
<Icon name="order" :size="36" color="#667eea" />
<text class="menu-card-title">我的订单</text>
</view>
</template>
@@ -98,44 +98,44 @@
<!-- 管理员菜单 -->
<template v-if="isAdmin">
<view class="menu-card" @click="goTo('/pages/product/manage')">
<Icon name="product" :size="36" color="#fff" />
<Icon name="product" :size="36" color="#667eea" />
<text class="menu-card-title">商品管理</text>
</view>
<view class="menu-card" @click="goTo('/pages/category/index')">
<Icon name="setting" :size="36" color="#fff" />
<Icon name="setting" :size="36" color="#667eea" />
<text class="menu-card-title">种类管理</text>
</view>
<view class="menu-card" @click="goStock()">
<Icon name="stock" :size="36" color="#fff" />
<Icon name="stock" :size="36" color="#667eea" />
<text class="menu-card-title">库存管理</text>
</view>
<view class="menu-card" @click="goTo('/pages/stock/in')">
<Icon name="plus" :size="36" color="#fff" />
<Icon name="plus" :size="36" color="#667eea" />
<text class="menu-card-title">入库</text>
</view>
<view class="menu-card" @click="goTo('/pages/stock/flow')">
<Icon name="flow" :size="36" color="#fff" />
<Icon name="flow" :size="36" color="#667eea" />
<text class="menu-card-title">库存流水</text>
</view>
</template>
<!-- 销售菜单 -->
<template v-else-if="isSales">
<view class="menu-card" @click="goTo('/pages/product/list')">
<Icon name="product" :size="36" color="#fff" />
<Icon name="product" :size="36" color="#667eea" />
<text class="menu-card-title">商品浏览</text>
</view>
</template>
<!-- 顾客菜单 -->
<template v-else-if="isCustomer">
<view class="menu-card" @click="goTo('/pages/product/list')">
<Icon name="product" :size="36" color="#fff" />
<Icon name="product" :size="36" color="#667eea" />
<text class="menu-card-title">商品浏览</text>
</view>
</template>
<!-- 游客菜单 -->
<template v-else-if="isGuest">
<view class="guest-card" @click="goTo('/pages/login/index')">
<Icon name="user" :size="80" color="#fff" />
<Icon name="user" :size="80" color="#667eea" />
<text class="guest-text">点击登录</text>
</view>
</template>
@@ -167,7 +167,7 @@
<!-- 退出登录 -->
<view class="logout-section" v-if="!isGuest">
<button class="logout-btn" @click="logout">
<Icon name="logout" :size="32" color="#fff" style="margin-right: 10rpx" />
<Icon name="logout" :size="32" color="#667eea" style="margin-right: 10rpx" />
退出登录
</button>
</view>
@@ -424,7 +424,7 @@ export default {
.menu-card {
width: 18%;
aspect-ratio: 1;
background: linear-gradient(135deg, #e0e5ec 0%, #ffffff 100%);
background: #ffffff;
border-radius: 12rpx;
margin: 8rpx;
display: flex;
@@ -432,7 +432,7 @@ export default {
align-items: center;
justify-content: center;
padding: 6rpx;
box-shadow: 0 4rpx 12rpx rgba(0, 0, 0, 0.08);
box-shadow: 0 2rpx 8rpx rgba(0, 0, 0, 0.06);
}
.menu-card:active {
@@ -441,7 +441,7 @@ export default {
.menu-card-title {
font-size: 20rpx;
color: #fff;
color: #333;
font-weight: bold;
margin-top: 6rpx;
}
@@ -488,6 +488,7 @@ export default {
}
.menu-card-title {
color: #333;
font-size: 28rpx;
font-weight: bold;
color: #333;