refactor(dashboard): 移除RecentRewardsPunishments组件的过滤筛选功能
- 移除filter-tabs过滤标签UI - 移除filterTabs、activeFilter、filteredList逻辑 - 直接显示所有数据,不再按类型过滤 - 简化组件功能 参考用户要求:不需要进行过滤筛选
This commit is contained in:
parent
3793d64d3c
commit
4e65bb4300
@ -2,18 +2,7 @@
|
|||||||
<div class="rewards-punishments-container">
|
<div class="rewards-punishments-container">
|
||||||
<!-- 标题栏 -->
|
<!-- 标题栏 -->
|
||||||
<div class="rewards-header">
|
<div class="rewards-header">
|
||||||
<span class="header-title">近期奖惩</span>
|
<span class="header-title">风险评估</span>
|
||||||
<div class="filter-tabs">
|
|
||||||
<div
|
|
||||||
v-for="tab in filterTabs"
|
|
||||||
:key="tab.value"
|
|
||||||
class="filter-tab"
|
|
||||||
:class="{ active: activeFilter === tab.value }"
|
|
||||||
@click="activeFilter = tab.value"
|
|
||||||
>
|
|
||||||
{{ tab.label }}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<!-- 时间线列表 -->
|
<!-- 时间线列表 -->
|
||||||
@ -21,7 +10,7 @@
|
|||||||
<div class="timeline-content">
|
<div class="timeline-content">
|
||||||
<div class="timeline-line"></div>
|
<div class="timeline-line"></div>
|
||||||
<div class="timeline-items">
|
<div class="timeline-items">
|
||||||
<div v-for="(item, index) in filteredList" :key="index" class="timeline-item">
|
<div v-for="(item, index) in listData" :key="index" class="timeline-item">
|
||||||
<div class="timeline-dot" :class="item.type"></div>
|
<div class="timeline-dot" :class="item.type"></div>
|
||||||
<div class="timeline-card">
|
<div class="timeline-card">
|
||||||
<div class="card-type" :class="item.type">{{ item.typeText }}</div>
|
<div class="card-type" :class="item.type">{{ item.typeText }}</div>
|
||||||
@ -35,7 +24,7 @@
|
|||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import { ref, computed, watch } from 'vue'
|
import { ref, watch } from 'vue'
|
||||||
|
|
||||||
defineOptions({ name: 'RecentRewardsPunishments' })
|
defineOptions({ name: 'RecentRewardsPunishments' })
|
||||||
|
|
||||||
@ -46,29 +35,9 @@ interface RewardPunishmentItem {
|
|||||||
content: string // 内容
|
content: string // 内容
|
||||||
}
|
}
|
||||||
|
|
||||||
// 过滤标签
|
|
||||||
const filterTabs = [
|
|
||||||
{ label: '全部', value: 'all' },
|
|
||||||
{ label: '奖励记录', value: 'reward' },
|
|
||||||
{ label: '惩罚记录', value: 'punishment' }
|
|
||||||
]
|
|
||||||
|
|
||||||
const activeFilter = ref<string>('all')
|
|
||||||
|
|
||||||
// 数据列表 - 使用 ref 存储
|
// 数据列表 - 使用 ref 存储
|
||||||
const listData = ref<RewardPunishmentItem[]>([])
|
const listData = ref<RewardPunishmentItem[]>([])
|
||||||
|
|
||||||
// 过滤后的列表
|
|
||||||
const filteredList = computed(() => {
|
|
||||||
if (activeFilter.value === 'all') {
|
|
||||||
return listData.value
|
|
||||||
} else if (activeFilter.value === 'reward') {
|
|
||||||
return listData.value.filter((item) => item.type === 'reward')
|
|
||||||
} else {
|
|
||||||
return listData.value.filter((item) => item.type === 'punishment')
|
|
||||||
}
|
|
||||||
})
|
|
||||||
|
|
||||||
// 可以通过 props 接收外部数据
|
// 可以通过 props 接收外部数据
|
||||||
const props = withDefaults(
|
const props = withDefaults(
|
||||||
defineProps<{
|
defineProps<{
|
||||||
@ -118,24 +87,6 @@ watch(
|
|||||||
color: #ffffff;
|
color: #ffffff;
|
||||||
}
|
}
|
||||||
|
|
||||||
.filter-tabs {
|
|
||||||
display: flex;
|
|
||||||
gap: 8px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.filter-tab {
|
|
||||||
padding: 6px 12px;
|
|
||||||
font-size: 12px;
|
|
||||||
color: rgba(255, 255, 255, 0.85);
|
|
||||||
background: rgba(56, 102, 141, 0.2);
|
|
||||||
border-radius: 4px;
|
|
||||||
|
|
||||||
&.active {
|
|
||||||
background: #37599d;
|
|
||||||
color: #ffffff;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
// 时间线容器
|
// 时间线容器
|
||||||
.timeline-container {
|
.timeline-container {
|
||||||
flex: 1 1 0;
|
flex: 1 1 0;
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user