From 7f61b1328994273b63e95ad4ad4c014fc3baeac9 Mon Sep 17 00:00:00 2001 From: ZhangXianQiang <1135831638@qq.com> Date: 星期一, 04 三月 2024 17:22:01 +0800 Subject: [PATCH] fix:修改图标细节 --- src/views/daoAnOffice/right/danger/index.vue | 24 +++++++++++++++--------- 1 files changed, 15 insertions(+), 9 deletions(-) diff --git a/src/views/daoAnOffice/right/danger/index.vue b/src/views/daoAnOffice/right/danger/index.vue index 55bb4fa..ef6ec52 100644 --- a/src/views/daoAnOffice/right/danger/index.vue +++ b/src/views/daoAnOffice/right/danger/index.vue @@ -4,8 +4,8 @@ <RightTitle title="瀹夊叏闅愭偅鎯呭喌"> <template #top> <div class="select-container flex"> - <div class="item whitespace-no-wrap cursor-pointer" :class="{'select-active': item.isActive}" v-for="item in selectItems" :key="item.itemIndex" - @click="changeSelect(item)"> + <div class="item whitespace-no-wrap cursor-pointer" :class="{ 'select-active': item.isActive }" + v-for="item in selectItems" :key="item.itemIndex" @click="changeSelect(item)"> {{ item.name }} </div> </div> @@ -27,18 +27,24 @@ import RightTitle from "@/components/right-title"; import DataView from './dataView.vue'; import InfoView from './infoView.vue'; -import { ref } from 'vue'; +import { ref, provide } from 'vue'; - +const tableState = ref(false); const selectItems = ref([ - { itemIndex: 1, name: '瀹夊叏闅愭偅', isActive: false }, - { itemIndex: 2, name: '鏁版嵁缁熻', isActive: true }, + { itemIndex: 1, name: '瀹夊叏闅愭偅', isActive: true }, + { itemIndex: 2, name: '鏁版嵁缁熻', isActive: false }, ]); - +// 渚濊禆 +provide('tableState',tableState); const changeSelect = (selectItem) => { selectItems.value.map(item => item.isActive = false); selectItem.isActive = true; + if (selectItem.itemIndex === 2) { + tableState.value = true; + } else { + tableState.value = false; + } } </script> @@ -51,7 +57,7 @@ .item { margin: 0 8px; padding: 10px 14px; - font-size: 12px; + font-size: 14px; background: rgba(67, 102, 155, 0.4); border: 1px solid rgba(47, 91, 157, 0.8); flex-shrink: 0; @@ -59,7 +65,7 @@ } .select-active { - color: #fff; + color: #fff; } .item:last-child { -- Gitblit v1.8.0