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"}, ],