From 4403ec53223b24477cb94190fe48f6b4ebf8e6a4 Mon Sep 17 00:00:00 2001 From: aixianling Date: Tue, 7 Jan 2025 15:19:00 +0800 Subject: [PATCH] =?UTF-8?q?feat(inject):=20=E5=AE=9E=E7=8E=B0=E5=BA=93?= =?UTF-8?q?=E5=AD=98=E6=95=B0=E9=87=8F=E5=B0=8F=E4=BA=8E=E7=AD=89=E4=BA=8E?= =?UTF-8?q?0=E6=97=B6=E7=BA=A2=E8=89=B2=E9=97=AA=E7=83=81=E6=8F=90?= =?UTF-8?q?=E9=86=92-=20=E5=9C=A8=20main.css=20=E4=B8=AD=E6=B7=BB=E5=8A=A0?= =?UTF-8?q?=E4=BA=86=20flashOpacity=20=E5=8A=A8=E7=94=BB=E6=A0=B7=E5=BC=8F?= =?UTF-8?q?=20-=20=E5=9C=A8=20inject.js=20=E4=B8=AD=E5=AE=9E=E7=8E=B0?= =?UTF-8?q?=E4=BA=86=20rowClassName=20=E6=96=B9=E6=B3=95=EF=BC=8C=E4=B8=BA?= =?UTF-8?q?=E7=AC=A6=E5=90=88=E6=9D=A1=E4=BB=B6=E7=9A=84=E8=A1=8C=E6=B7=BB?= =?UTF-8?q?=E5=8A=A0=20flash-opacity=20=E7=B1=BB=20-=20=E5=9C=A8=E5=A4=9A?= =?UTF-8?q?=E4=B8=AA=20Vue=20=E7=BB=84=E4=BB=B6=E4=B8=AD=E4=B8=BA=E5=BA=93?= =?UTF-8?q?=E5=AD=98=E6=95=B0=E9=87=8F=E5=88=97=E6=B7=BB=E5=8A=A0=E4=BA=86?= =?UTF-8?q?=20flash:=201=20=E5=B1=9E=E6=80=A7=EF=BC=8C=E4=BB=A5=E8=A7=A6?= =?UTF-8?q?=E5=8F=91=E9=97=AA=E7=83=81=E6=95=88=E6=9E=9C?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/assets/main.css | 17 +++++++++++++++++ src/utils/inject.js | 4 ++++ src/views/AppCarouselList.vue | 2 +- src/views/AppKeyGoods.vue | 2 +- src/views/AppStoreKeyGoods.vue | 2 +- src/views/AppStoresTable.vue | 2 +- 6 files changed, 25 insertions(+), 4 deletions(-) diff --git a/src/assets/main.css b/src/assets/main.css index da5dcb6..49c426f 100644 --- a/src/assets/main.css +++ b/src/assets/main.css @@ -249,3 +249,20 @@ a, .green { .AppSubTitle .el-select { width: 120px; } + +@keyframes flashOpacity { + 0%, 100% { + opacity: 1; /* 完全不透明 */ + } + 50% { + opacity: 0; /* 完全透明 */ + } +} + +/* 应用动画到元素 */ +.flash-opacity { + .cell > span { + animation: flashOpacity 1s infinite; /* 动画名称、持续时间、重复次数 */ + color: red + } +} diff --git a/src/utils/inject.js b/src/utils/inject.js index ed10730..0a41839 100644 --- a/src/utils/inject.js +++ b/src/utils/inject.js @@ -135,6 +135,10 @@ Vue.component("scrollTable", { return h('el-table', { props: { headerCellClassName: 'tableHeader', cellClassName: 'tableCell', stripe: !0, height: '100%', + rowClassName({row}) { + const item = columns.find(e => e.flash == 1) + return item?.prop && row[item.prop] <= 0 ? 'flash-opacity' : '' + }, ...config, data: tableData, }, class: 'scrollTable', on: { diff --git a/src/views/AppCarouselList.vue b/src/views/AppCarouselList.vue index a71d4a1..54abd55 100644 --- a/src/views/AppCarouselList.vue +++ b/src/views/AppCarouselList.vue @@ -23,7 +23,7 @@ export default { {label: "昨日销售数量", prop: "yesterdaySaleNum", width: 70}, {label: "上周同天销售数量", prop: "lastWeekSaleNum", width: 70}, {label: "今日销售数量", prop: "saleNum", width: 70}, - {label: "现在库存数量", prop: "stockNum", width: 70}, + {label: "现在库存数量", prop: "stockNum", width: 70, flash: 1}, {label: "剩余时间预计销售数量", prop: "preSaleNum"}, // {label: "提醒", custom: 1, width: 70, align: 'center', prop: "remind"}, ], diff --git a/src/views/AppKeyGoods.vue b/src/views/AppKeyGoods.vue index d7e6038..bca5566 100644 --- a/src/views/AppKeyGoods.vue +++ b/src/views/AppKeyGoods.vue @@ -8,7 +8,7 @@ export default { columns: [ {label: "重点单品", prop: "goodsName"}, {label: "销售数量", prop: "saleNum", width: 70}, - {label: "库存数量", prop: "stockNum", width: 70}, + {label: "库存数量", prop: "stockNum", width: 70, flash: 1}, {label: "销售目标", prop: "targetSaleNum", width: 70}, {label: "销售达成", prop: "saleAchieveRate"}, ], diff --git a/src/views/AppStoreKeyGoods.vue b/src/views/AppStoreKeyGoods.vue index 1c9486f..fb22309 100644 --- a/src/views/AppStoreKeyGoods.vue +++ b/src/views/AppStoreKeyGoods.vue @@ -9,7 +9,7 @@ export default { {label: "重点单品", prop: "goodsName"}, {label: "当日目标", prop: "targetNum", width: 70}, {label: "销售数量", prop: "saleNum", width: 70}, - {label: "库存数量", prop: "stockNum", width: 70}, + {label: "库存数量", prop: "stockNum", width: 70, flash: 1}, {label: "预计销售数量", prop: "preSaleNum", width: 70}, {label: "提醒", custom: 1, width: 70, align: 'center', prop: "remind"}, ] diff --git a/src/views/AppStoresTable.vue b/src/views/AppStoresTable.vue index cb6e69b..d07514d 100644 --- a/src/views/AppStoresTable.vue +++ b/src/views/AppStoresTable.vue @@ -36,7 +36,7 @@ export default { {label: "昨日销售数量", prop: "yesterdaySaleNum", width: 70}, {label: "上周同天销售数量", prop: "lastWeekSaleNum", width: 70}, {label: "今日销售数量", prop: "saleNum", width: 70}, - {label: "现在库存数量", prop: "stockNum", width: 70}, + {label: "现在库存数量", prop: "stockNum", width: 70, flash: 1}, {label: "剩余时间预计销售数量", prop: "preSaleNum"}, // {label: "提醒", custom: 1, width: 70, align: 'center', prop: "remind"}, ],