4403ec5322
- 在 inject.js 中实现了 rowClassName 方法，为符合条件的行添加 flash-opacity 类 - 在多个 Vue 组件中为库存数量列添加了 flash: 1 属性，以触发闪烁效果
83 lines
2.5 KiB
Vue
83 lines
2.5 KiB
Vue
<script>
|
|
export default {
|
|
name: "AppStoreKeyGoods",
|
|
label: "表格",
|
|
data() {
|
|
return {
|
|
tableData: [],
|
|
columns: [
|
|
{label: "重点单品", prop: "goodsName"},
|
|
{label: "当日目标", prop: "targetNum", width: 70},
|
|
{label: "销售数量", prop: "saleNum", width: 70},
|
|
{label: "库存数量", prop: "stockNum", width: 70, flash: 1},
|
|
{label: "预计销售数量", prop: "preSaleNum", width: 70},
|
|
{label: "提醒", custom: 1, width: 70, align: 'center', prop: "remind"},
|
|
]
|
|
}
|
|
},
|
|
computed: {
|
|
tableConfig: v => {
|
|
return {
|
|
headerBGC: 'rgba(13, 48, 99, 0.6)', rowNum: 9,
|
|
oddRowBGC: window.evenRowBGC(), evenRowBGC: "transparent",
|
|
header: v.columns.map(e => e.label),
|
|
columnWidth: v.columns.map(e => e.width || "0;flex:1;min-width:0;"),
|
|
align: v.columns.map(e => e.align || "left"),
|
|
data: v.tableData.map(e => v.columns.map(column => column.custom == 1 ? `<div class="pointer" style="color:${e.preSaleNum > e.stockNum ? 'red' : '#fff'}">周边库存</div>` :
|
|
column.format ? column.format(e) : e[column.prop])) || [],
|
|
}
|
|
},
|
|
},
|
|
watch: {
|
|
$storeBoard: {
|
|
deep: true, immediate: true, handler(v) {
|
|
this.tableData = v.storeKeyGoods || []
|
|
}
|
|
}
|
|
},
|
|
methods: {
|
|
openNearbyStores({thirdGoodsCode}) {
|
|
const {storeCode, longitude, latitude} = this.$storeBoard.store
|
|
return $http.post("/data-boot/la/screen/multipleStoreBoard/aroundStock", {
|
|
type: "1", ...this.search, storeCode, longitude, latitude, thirdGoodsCode,
|
|
}).then(res => {
|
|
if (res?.data) {
|
|
this.$storeBoard.aroundStock = res.data
|
|
this.$nextTick(() => this.$storeBoard.dialog = true)
|
|
}
|
|
})
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<template>
|
|
<section class="AppStoreKeyGoods">
|
|
<div class="subTitle" v-text="'重点单品情况'"/>
|
|
<scroll-table :table-data="tableData" :columns="columns" @click="openNearbyStores" @click.native.stop/>
|
|
<!--<dv-scroll-board :config="tableConfig" @click="openNearbyStores" @click.native.stop/>-->
|
|
</section>
|
|
</template>
|
|
|
|
<style>
|
|
.AppStoreKeyGoods {
|
|
color: #fff;
|
|
box-sizing: border-box;
|
|
height: 600px;
|
|
}
|
|
|
|
.AppStoreKeyGoods .subTitle {
|
|
line-height: 20px;
|
|
width: fit-content;
|
|
margin: 24px auto 12px;
|
|
background-image: url("http://10.0.97.209/img/kengee/kengee5.png");
|
|
background-repeat: no-repeat;
|
|
background-size: 100% 2px;
|
|
background-position: center bottom;
|
|
}
|
|
|
|
.AppStoreKeyGoods .scrollTable {
|
|
height: calc(100% - 70px) !important;
|
|
}
|
|
</style>
|