YG-Soft/X-Financial
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat(web): 更新个人工作台组件和应用外壳组合式函数，新增请求数据组合式函数

Browse Source
This commit is contained in:
caoxiaozhu
2026-05-15 06:56:51 +00:00
parent d8d0415bf4
commit 344ac126b3
3 changed files with 6 additions and 152 deletions
Download Patch File Download Diff File Expand all files Collapse all files

152
web/src/components/business/PersonalWorkbench.vue
View File

@@ -59,7 +59,7 @@
</div>
</article>
<div class="workbench-grid" :class="{ 'finance-grid': isFinanceUser }">
<div class="workbench-grid">
<article class="panel list-panel">
<div class="section-head">
<div class="title-with-badge">
@@ -113,58 +113,6 @@
</div>
</div>
</article>
<article v-if="isFinanceUser" class="panel list-panel">
<div class="section-head">
<div class="title-with-badge">
<h3>应收管理</h3>
<span class="alert-badge">{{ receivableAlertCount }}</span>
</div>
<button type="button" class="link-action">查看全部 <i class="mdi mdi-chevron-right"></i></button>
</div>
<div class="list-body">
<div v-for="item in receivableItems" :key="item.id" class="progress-row">
<div class="todo-icon" :style="{ '--icon-color': item.color }">
<i :class="item.icon"></i>
</div>
<div class="todo-copy progress-copy">
<strong>{{ item.title }}</strong>
<p>{{ item.date }}</p>
</div>
<strong class="progress-amount">{{ item.amount }}</strong>
<span class="progress-status" :class="item.tone">{{ item.status }}</span>
</div>
</div>
</article>
<article v-if="isFinanceUser" class="panel list-panel">
<div class="section-head">
<div class="title-with-badge">
<h3>应付管理</h3>
<span class="alert-badge">{{ payableAlertCount }}</span>
</div>
<button type="button" class="link-action">查看全部 <i class="mdi mdi-chevron-right"></i></button>
</div>
<div class="list-body">
<div v-for="item in payableItems" :key="item.id" class="progress-row">
<div class="todo-icon" :style="{ '--icon-color': item.color }">
<i :class="item.icon"></i>
</div>
<div class="todo-copy progress-copy">
<strong>{{ item.title }}</strong>
<p>{{ item.date }}</p>
</div>
<strong class="progress-amount">{{ item.amount }}</strong>
<span class="progress-status" :class="item.tone">{{ item.status }}</span>
</div>
</div>
</article>
</div>
<article class="panel policy-panel">
@@ -206,13 +154,6 @@ const props = defineProps({
const emit = defineEmits(['openAssistant'])
const { currentUser } = useSystemState()
// 判断是否为财务人员
const isFinanceUser = computed(() => {
const user = currentUser.value || {}
const roleCodes = Array.isArray(user.roleCodes) ? user.roleCodes : []
return roleCodes.includes('finance') || roleCodes.includes('accountant') || user.isAdmin
})
const { toast } = useToast()
const assistantDraft = ref('')
const fileInputRef = ref(null)
@@ -422,76 +363,6 @@ const progressItems = [
const progressAlertCount = progressItems.filter((item) => item.status !== '已到账').length
const receivableItems = [
{
id: 'receivable-1',
title: '客户服务费收入',
amount: '¥15,800',
date: '2026-05-10',
status: '待收款',
tone: 'info',
icon: 'mdi mdi-account-cash-outline',
color: '#f59e0b'
},
{
id: 'receivable-2',
title: '项目进度款',
amount: '¥42,600',
date: '2026-05-08',
status: '部分收款',
tone: 'success',
icon: 'mdi mdi-cash-multiple',
color: '#10b981'
},
{
id: 'receivable-3',
title: '咨询服务费',
amount: '¥8,900',
date: '2026-05-05',
status: '逾期提醒',
tone: 'info',
icon: 'mdi mdi-bell-alert',
color: '#ef4444'
}
]
const receivableAlertCount = receivableItems.filter((item) => item.status === '逾期提醒' || item.status === '待收款').length
const payableItems = [
{
id: 'payable-1',
title: '供应商采购款',
amount: '¥28,500',
date: '2026-05-12',
status: '待付款',
tone: 'info',
icon: 'mdi mdi-truck-outline',
color: '#3b82f6'
},
{
id: 'payable-2',
title: '房租物业费',
amount: '¥12,800',
date: '2026-05-15',
status: '待审批',
tone: 'success',
icon: 'mdi mdi-office-building',
color: '#6366f1'
},
{
id: 'payable-3',
title: '软件服务费',
amount: '¥3,600',
date: '2026-05-01',
status: '已付款',
tone: 'mint',
icon: 'mdi mdi-server',
color: '#10b981'
}
]
const payableAlertCount = payableItems.filter((item) => item.status === '待付款' || item.status === '待审批').length
const policyItems = [
{
name: '差旅报销管理办法（2026版）',
@@ -856,11 +727,6 @@ watch(
gap: 20px;
}
.workbench-grid.finance-grid {
grid-template-columns: repeat(4, 1fr);
gap: 16px;
}
.list-panel,
.policy-panel {
padding: 20px 22px;
@@ -1110,11 +976,6 @@ watch(
.policy-row {
grid-template-columns: 1.8fr 1.8fr 1fr;
}
.workbench-grid.finance-grid {
grid-template-columns: repeat(2, 1fr);
gap: 16px;
}
}
@media (max-width: 1440px) {
@@ -1181,8 +1042,7 @@ watch(
width: 176px;
}
.workbench-grid,
.workbench-grid.finance-grid {
.workbench-grid {
grid-template-columns: 1fr;
}
}
@@ -1249,14 +1109,6 @@ watch(
justify-self: start;
}
.workbench-grid.finance-grid {
gap: 16px;
}
.workbench-grid.finance-grid .list-panel {
padding: 16px 18px;
}
.policy-table {
border: 0;
border-radius: 0;