选中颜色
Frontend CI/CD / build (web-office) (push) Failing after 10s Details

This commit is contained in:
hujiale 2024-10-23 19:55:22 +08:00
parent abbf400941
commit 4b8b04e1fc
1 changed files with 28 additions and 12 deletions

View File

@ -3,23 +3,22 @@
<div class="head-top-box flex justify-between mb-3 titlt-top">
<div class="flex items-center gap-10">
<Badge :count="9" :offset="[6, -3]">
<div class="flex items-center gap-1 cursor-pointer">
<div class="flex items-center gap-1 cursor-pointer" :class="{'active': selectTodo == 'db'}" @click="selectTodoClick('db')">
<CalendarOutlined />待办
</div>
</Badge>
<div class="flex items-center gap-1 cursor-pointer">
<div class="flex items-center gap-1 cursor-pointer" :class="{'active': selectTodo == 'yb'}" @click="selectTodoClick('yb')">
<CarryOutOutlined />已办
</div>
<Badge :count="9" :offset="[6, -3]">
<div class="flex items-center gap-1 cursor-pointer">
<div class="flex items-center gap-1 cursor-pointer" :class="{'active': selectTodo == 'dy'}" @click="selectTodoClick('dy')">
<ExceptionOutlined />待阅
</div>
</Badge>
<div class="flex items-center gap-1 cursor-pointer">
<div class="flex items-center gap-1 cursor-pointer" :class="{'active': selectTodo == 'yy'}" @click="selectTodoClick('yy')">
<FileDoneOutlined />已阅
</div>
<div class="flex items-center gap-1 cursor-pointer">
<div class="flex items-center gap-1 cursor-pointer" :class="{'active': selectTodo == 'gz'}" @click="selectTodoClick('gz')">
<StarOutlined />关注
</div>
</div>
@ -31,10 +30,10 @@
</div>
<ul class="f-btn-box">
<li>
<Button type="primary">全部</Button>
<Button :type="selectClass == '全部' ? 'primary' : 'default'" @click="selectedClick('全部')">全部</Button>
</li>
<li v-for="(item) in plainOptions" :key="item">
<Button >{{ item }}</Button>
<li v-for="(item) in plainOptions" :key="item" @click="selectedClick(item)">
<Button :type="selectClass == item ? 'primary' : 'default'">{{ item }}</Button>
</li>
</ul>
<div class="flex-1 overflow-hidden">
@ -165,6 +164,17 @@ watch(
state.checkAll = val.length === plainOptions.length;
},
);
let selectClass = ref('全部')
let selectedClick = (item: string) => {
selectClass.value = item
}
let selectTodo = ref('');
let selectTodoClick = (item: string) => {
selectTodo.value = item
}
</script>
<style lang="scss">
@import 'vxe-table/lib/style.css';
@ -176,6 +186,7 @@ watch(
overflow-x: auto; //
padding-bottom: 3px;
margin-bottom: 10px;
li {
display: inline-block;
margin-right: 10px;
@ -186,3 +197,8 @@ watch(
height: 5px !important;
}
</style>
<style lang="scss" scoped>
.active {
color: hsl(var(--primary));
}
</style>