Files
xk-doctor-wx/subPackages/sub_platform_admin/home/index.vue

341 lines
11 KiB
Vue
Raw Normal View History

2026-06-05 12:28:36 +08:00
<template>
<business-page-layout title="工作台" :show-tabbar="true" :tab-index="0">
<view class="workspace-container">
<!-- 极简流线型顶部个人信息区 -->
<view class="hero-section">
<view class="brand-info-wrap">
<view class="brand-text">
<view class="badge"><text class="badge-text">平台管理工作台</text></view>
<text class="store-name">{{ displayName }}</text>
<text class="store-sub">欢迎回来今天也要高效工作</text>
</view>
</view>
</view>
<!-- 快捷服务区多彩微拟物质感 (复用样式逻辑) -->
<view class="content-wrapper">
<view v-for="section in sections" :key="section.key" class="section-panel">
<view class="panel-header">
<text class="panel-title">{{ section.title }}</text>
</view>
<view class="service-grid">
<view
v-for="item in section.items"
:key="item.key"
class="service-card"
hover-class="service-card-hover"
@click="go(item)"
>
<view class="service-icon-box" :style="{ background: item.theme.bg }">
<!-- 使用 uView 1.x u-icon 组件 -->
<u-icon :name="item.icon" size="38" :color="item.theme.color"></u-icon>
</view>
<view class="service-info">
<text class="service-name">{{ item.label }}</text>
<text class="service-desc">{{ item.desc || '快捷进入' }}</text>
</view>
</view>
</view>
</view>
</view>
</view>
</business-page-layout>
</template>
<script>
import BusinessPageLayout from '@/subPackages/sub_platform_admin/components/business-page-layout.vue'
import { getPlatformAdminContext } from '@/subPackages/sub_platform_admin/common/context.js'
import { navigateToInputForm } from '@/subPackages/sub_salesperson/common/inputNavigation.js'
import platformAdminApi from '@/api/platformAdmin.js'
const ROOT = '/subPackages/sub_platform_admin'
const SALESPERSON_ROOT = '/subPackages/sub_salesperson'
export default {
components: { BusinessPageLayout },
provide() { return { businessContext: getPlatformAdminContext() } },
data() {
return {
displayName: '',
warehouseMenus: [],
// 预定义的全局主题池,用于动态分配没有明确指定主题的项
globalThemes: [
{ bg: 'linear-gradient(135deg, #FFF7ED, #FFEDD5)', color: '#F97316' }, // 橙金
{ bg: 'linear-gradient(135deg, #EFF6FF, #DBEAFE)', color: '#3B82F6' }, // 科技蓝
{ bg: 'linear-gradient(135deg, #FAF5FF, #F3E8FF)', color: '#A855F7' }, // 优雅紫
{ bg: 'linear-gradient(135deg, #F0FDF4, #DCFCE7)', color: '#22C55E' }, // 安全绿
]
}
},
computed: {
sections() {
const shared = '/subPackages/sub_business_shared'
const root = '/subPackages/sub_platform_admin'
return [
{
key: 'finance',
title: '财务管理',
items: [
{
key: 'withdrawal', label: '提现管理', desc: '提现流水查询', path: `${shared}/withdrawal/index`,
icon: 'red-packet-fill', // uView icon
theme: { bg: 'linear-gradient(135deg, #FFF7ED, #FFEDD5)', color: '#F97316' } // 橙金
},
{
key: 'withdrawal-audit', label: '提现审核', desc: '处理提现申请', path: `${root}/withdrawal/audit/index`,
icon: 'order',
theme: { bg: 'linear-gradient(135deg, #FEE2E2, #FECACA)', color: '#EF4444' } // 警戒红
},
{
key: 'reconciliation', label: '对账单', desc: '财务对账明细', path: `${shared}/reconciliation/index`,
icon: 'file-text-fill',
theme: { bg: 'linear-gradient(135deg, #EFF6FF, #DBEAFE)', color: '#3B82F6' } // 科技蓝
},
],
},
{
key: 'business',
title: '业务管理',
items: [
{
key: 'order', label: '商品订单', desc: '全平台订单概览', path: `${shared}/order/index`,
icon: 'bag-fill',
theme: { bg: 'linear-gradient(135deg, #F0FDF4, #DCFCE7)', color: '#22C55E' } // 安全绿
}
],
},
{
key: 'warehouse',
title: '仓库管理',
// 动态加载的仓库数据,在 onShow 中会进行加工
items: this.warehouseMenus.length ? this.warehouseMenus : [
// 提供一个默认的占位符,防止异步加载完成前显示空白
{
key: 'warehouse-loading', label: '总仓库', desc: '库存管理中心', path: '/subPackages/sub_business_shared/warehouse/index',
icon: 'car-fill',
theme: { bg: 'linear-gradient(135deg, #F3F4F6, #E5E7EB)', color: '#6B7280' } // 占位灰
}
]
},
{
key: 'input-audit',
title: '信息审核',
items: [
{
key: 'store-audit', label: '门店审核', desc: '新入门店审批', path: `${root}/store-input/audit/index`,
icon: 'home-fill',
theme: { bg: 'linear-gradient(135deg, #FAF5FF, #F3E8FF)', color: '#A855F7' } // 优雅紫
},
{
key: 'doctor-audit', label: '医生审核', desc: '入驻医生资质', path: `${root}/doctor-input/audit/index`,
icon: 'account-fill',
theme: { bg: 'linear-gradient(135deg, #EFF6FF, #DBEAFE)', color: '#3B82F6' } // 科技蓝
},
],
},
{
key: 'input-create',
title: '信息录入',
items: [
{
key: 'store-list', label: '门店列表', desc: '平台门店档案', path: `${SALESPERSON_ROOT}/store-input/index`,
icon: 'grid-fill',
theme: { bg: 'linear-gradient(135deg, #ECFEFF, #CFFAFE)', color: '#06B6D4' } // 青色
},
{
key: 'store-form', label: '门店录入', desc: '新增线下门店', path: `${SALESPERSON_ROOT}/store-input/form`, inputType: 'store', isForm: true,
icon: 'plus-square-fill',
theme: { bg: 'linear-gradient(135deg, #F0FDF4, #DCFCE7)', color: '#22C55E' } // 绿色
},
{
key: 'doctor-list', label: '医生列表', desc: '平台医生名册', path: `${SALESPERSON_ROOT}/doctor-input/index`,
icon: 'list-dot',
theme: { bg: 'linear-gradient(135deg, #FFFBEB, #FEF3C7)', color: '#D97706' } // 琥珀色
},
{
key: 'doctor-form', label: '医生录入', desc: '新增合作医生', path: `${SALESPERSON_ROOT}/doctor-input/form`, inputType: 'doctor', isForm: true,
icon: 'plus-circle-fill',
theme: { bg: 'linear-gradient(135deg, #FFF7ED, #FFEDD5)', color: '#F97316' } // 橙金
},
],
},
]
},
},
onShow() {
const user = uni.getStorageSync('platform_admin_user') || {}
this.displayName = user.nick_name || '平台管理员'
// 加载仓库数据
platformAdminApi.getWarehouseProductTypeOptions().then(w => {
const options = Array.isArray(w.data) ? w.data : []
if (!options.length) return
this.warehouseMenus = options.map((opt, index) => {
const value = opt.value != null ? opt.value : opt.id
const label = opt.label || opt.name || '仓库'
// 为动态仓库分配不同的主题色
const theme = this.globalThemes[index % this.globalThemes.length]
return {
key: 'warehouse-' + value,
label,
desc: `${label}库存管理`, // 增强描述
icon: 'car-fill', // 仓库类目统一使用 uView 的车/物流图标
theme: theme,
path: `/subPackages/sub_business_shared/warehouse/index?type=${encodeURIComponent(value)}&label=${encodeURIComponent(label)}`,
}
})
}).catch(() => {})
},
methods: {
go(item) {
if (item.isForm && item.inputType) {
navigateToInputForm(item.path, item.inputType)
return
}
uni.navigateTo({ url: item.path })
},
},
}
</script>
<style lang="scss" scoped>
/* 全局容器背景:更干净的高级浅灰底色 */
.workspace-container {
padding-bottom: 80rpx;
background-color: #F4F6F8;
min-height: 100vh;
}
/* ================= 极简顶部英雄区 ================= */
.hero-section {
background: linear-gradient(135deg, #6acdbb 0%, #4db6a8 100%);
/* 调整内边距,移除原先负边距需要的大底部空间,因为这里不需要悬浮核心资产卡片 */
padding: 40rpx 40rpx 60rpx;
border-bottom-left-radius: 48rpx;
border-bottom-right-radius: 48rpx;
box-shadow: 0 4rpx 20rpx rgba(77, 182, 168, 0.2);
}
.brand-info-wrap {
display: flex;
justify-content: space-between;
align-items: center;
}
.brand-text {
flex: 1;
}
.badge {
display: inline-flex;
background: rgba(255, 255, 255, 0.15);
backdrop-filter: blur(8px);
padding: 6rpx 20rpx;
border-radius: 30rpx;
margin-bottom: 20rpx;
border: 1px solid rgba(255, 255, 255, 0.2);
}
.badge-text {
font-size: 22rpx;
color: #fff;
font-weight: 500;
letter-spacing: 2rpx;
}
.store-name {
font-size: 42rpx;
font-weight: 600;
color: #fff;
display: block;
margin-bottom: 6rpx;
}
.store-sub {
font-size: 26rpx;
color: rgba(255, 255, 255, 0.85);
display: block;
}
/* ================= 主体内容区:快捷服务 ================= */
.content-wrapper {
margin-top: 30rpx; /* 轻微向上偏移,与顶部区域产生连接感 */
position: relative;
z-index: 10;
}
.section-panel {
margin: 0 30rpx 30rpx; /* 增加底部间距 */
background: transparent;
}
.panel-header {
margin-bottom: 24rpx;
padding: 0 10rpx;
}
.panel-title {
font-size: 34rpx;
font-weight: 700;
color: #1E293B; /* 深石板灰 */
}
/* 采用与之前页面一致的宫格卡片布局 */
.service-grid {
display: grid;
grid-template-columns: repeat(2, 1fr);
gap: 20rpx;
}
.service-card {
background: #FFFFFF;
border-radius: 28rpx;
padding: 30rpx 24rpx;
display: flex;
align-items: center;
box-shadow: 0 4rpx 20rpx rgba(0, 0, 0, 0.02);
transition: all 0.2s ease;
border: 1px solid rgba(0, 0, 0, 0.01);
}
.service-card-hover {
transform: translateY(-2rpx);
box-shadow: 0 8rpx 24rpx rgba(0, 0, 0, 0.06);
}
.service-icon-box {
width: 76rpx;
height: 76rpx;
border-radius: 22rpx;
display: flex;
align-items: center;
justify-content: center;
margin-right: 20rpx;
flex-shrink: 0;
box-shadow: inset 0 2rpx 4rpx rgba(255, 255, 255, 0.5); /* 顶部微高光,增加拟物质感 */
}
.service-info {
display: flex;
flex-direction: column;
}
.service-name {
font-size: 28rpx;
font-weight: 600;
color: #1E293B;
margin-bottom: 6rpx;
}
.service-desc {
font-size: 20rpx;
color: #94A3B8; /* 银灰色 */
}
</style>