Land Token-based SCSS modules, menu/biz mocks, reusable shell components, and home plus list/detail/form/comps template pages aligned with the Vant Weapp UI demo. Co-authored-by: Cursor <cursoragent@cursor.com>
62 lines
2.1 KiB
Vue
62 lines
2.1 KiB
Vue
<template>
|
||
<view class="todo-panel panel" style="padding: 0; overflow: hidden">
|
||
<view class="panel-hd" style="padding: 28rpx 24rpx 0">
|
||
<text class="panel-title">待办摘要</text>
|
||
<view class="hint" @click="$emit('more')">查看全部 ›</view>
|
||
</view>
|
||
<view style="padding: 24rpx">
|
||
<view class="todo-stats">
|
||
<view class="todo-stat tone-warn" @click="$emit('stat-click', 'approve')">
|
||
<view class="stat-icon"><van-icon name="passed" /></view>
|
||
<text class="num">{{ stats.approve }}</text>
|
||
<text class="label">待审批</text>
|
||
</view>
|
||
<view class="todo-stat tone-pay" @click="$emit('stat-click', 'pay')">
|
||
<view class="stat-icon"><van-icon name="balance-list-o" /></view>
|
||
<text class="num">{{ stats.pay }}</text>
|
||
<text class="label">待确认缴费</text>
|
||
</view>
|
||
<view class="todo-stat tone-danger" @click="$emit('stat-click', 'alert')">
|
||
<view class="stat-icon"><van-icon name="warning-o" /></view>
|
||
<text class="num">{{ stats.alert }}</text>
|
||
<text class="label">异常提醒</text>
|
||
</view>
|
||
</view>
|
||
<view class="todo-list">
|
||
<view
|
||
v-for="t in items"
|
||
:key="t.id"
|
||
class="todo-item"
|
||
@click="$emit('item-click', t)"
|
||
>
|
||
<view class="ti-icon" :class="t.iconClass">
|
||
<van-icon :name="t.icon" />
|
||
</view>
|
||
<view class="ti-body">
|
||
<view class="ti-title">{{ t.title }}</view>
|
||
<view class="ti-desc">{{ t.desc }}</view>
|
||
</view>
|
||
<view class="ti-right">
|
||
<van-tag :type="t.tagType" plain>{{ t.tag }}</van-tag>
|
||
<text class="ti-time">{{ t.time }}</text>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</template>
|
||
|
||
<script>
|
||
export default {
|
||
name: 'TodoPanel',
|
||
props: {
|
||
stats: {
|
||
type: Object,
|
||
default: () => ({ approve: 0, pay: 0, alert: 0 })
|
||
},
|
||
items: { type: Array, default: () => [] }
|
||
},
|
||
emits: ['stat-click', 'item-click', 'more']
|
||
}
|
||
</script>
|