zhaichao/oa_app
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

基本样式变更

Browse Source
This commit is contained in:
zhaichao
2026-09-23 17:38:24 +08:00
parent e464c2ad13
commit 9a22980071
35 changed files with 413 additions and 302 deletions
Download Patch File Download Diff File Expand all files Collapse all files
pages/todo/list.vue
+26 -12
View File
@@ -3,17 +3,24 @@
<fy-header title="待办审批" back />
<view v-if="!can" class="deny">当前账号没有审批或申请权限</view>
<view v-else>
<view class="tabs">
<scroll-view scroll-x class="tabs" :show-scrollbar="false">
<text v-for="t in tabs" :key="t.id" class="tab" :class="{ on: tab === t.id }" @click="switchTab(t.id)">{{ t.title }}</text>
</scroll-view>
<view v-if="loading" class="empty">
<view class="sk" /><view class="sk short" />
</view>
<view v-else-if="!rows.length" class="empty">
<text class="et">暂无事项</text>
<text class="es">当前分类下没有需要处理的记录</text>
</view>
<view v-if="loading" class="empty">加载中…</view>
<view v-else-if="!rows.length" class="empty">暂无记录</view>
<view v-for="r in rows" :key="r.no || r.id" class="card item" @click="open(r)">
<view>
<view class="main">
<text class="type">{{ r.typeLabel || r.type || '审批' }}</text>
<text class="t">{{ r.title || r.no }}</text>
<text class="s">{{ r.typeLabel || r.type }} · {{ r.submitter || r.assigneeName || '' }}</text>
<text class="s">{{ r.submitter || r.assigneeName || '' }}</text>
</view>
<text class="chip">{{ r.status || '待处理' }}</text>
<text class="arr">›</text>
</view>
</view>
</view>
@@ -83,11 +90,18 @@ export default {
</script>
<style scoped>
.tabs { display: flex; padding: 16rpx 16rpx 0; }
.tab { flex: 1; text-align: center; font-size: 24rpx; color: #737686; padding: 16rpx 0; }
.tab.on { color: #2563eb; font-weight: 700; border-bottom: 4rpx solid #2563eb; }
.item { margin: 16rpx 24rpx; padding: 24rpx; display: flex; justify-content: space-between; align-items: center; }
.t { display: block; font-size: 28rpx; font-weight: 600; }
.s { font-size: 22rpx; color: #737686; }
.empty, .deny { padding: 80rpx; text-align: center; color: #737686; }
.tabs { white-space: nowrap; padding: 8rpx 20rpx 0; }
.tab { display: inline-block; font-size: 28rpx; color: #6B7280; padding: 18rpx 24rpx; }
.tab.on { color: #1677FF; font-weight: 650; border-bottom: 4rpx solid #1677FF; }
.item { margin: 16rpx 28rpx; padding: 24rpx; display: flex; align-items: center; }
.main { flex: 1; min-width: 0; }
.type { display: inline-block; font-size: 22rpx; color: #1677FF; background: #E8F1FF; border-radius: 8rpx; padding: 2rpx 10rpx; margin-bottom: 8rpx; }
.t { display: block; font-size: 28rpx; font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.s { display: block; font-size: 24rpx; color: #6B7280; margin-top: 6rpx; }
.arr { color: #C4C9D4; font-size: 32rpx; margin-left: 8rpx; }
.empty, .deny { padding: 80rpx 40rpx; text-align: center; color: #6B7280; }
.et { display: block; font-size: 30rpx; font-weight: 600; color: #111827; }
.es { display: block; font-size: 24rpx; margin-top: 8rpx; }
.sk { height: 28rpx; background: #E8ECF2; border-radius: 8rpx; margin: 0 auto 16rpx; width: 60%; }
.sk.short { width: 36%; }
</style>