feat:增加物品过期时间显示

This commit is contained in:
2026-05-21 22:05:15 +08:00
parent 6aed1854ca
commit 3201a1c32b
4 changed files with 16 additions and 15 deletions

View File

@@ -27,10 +27,6 @@ onMounted(async () => {
const initCategoryList = () => {
queryCategoryList.value = []
if (ledgerStore.ledgerBookList.length > 0) {
ledgerStore.queryInfo.book = ledgerStore.ledgerBookList[0]
}
ledgerStore.ledgerBookList.forEach((item) => {
queryCategoryList.value.push({
label: item,

View File

@@ -22,18 +22,22 @@
{{ props.productItem.price }}
</div>
</div>
<el-tag v-if="props.productItem.expiryDate" type="danger" effect="dark">
{{ props.productItem.expiryDate }}
</el-tag>
</div>
<div class="bottom-container">
<div class="info-list">
<div class="info-item">
<i class="fa-solid fa-clock" style="color: #6A5ACD"></i>
{{ props.productItem.totalDay }}
{{ getTotalDay(props.productItem) }}
</div>
<div class="info-item">
<i class="fa-solid fa-chart-line" style="color: #FFA500"></i>
{{ props.productItem.averagePrice }}/
{{ (props.productItem.price / getTotalDay(props.productItem)).toFixed(2) }}/
</div>
</div>
<div class="info-list">
@@ -67,6 +71,7 @@ import { IProduct } from '@/types/product.ts'
import { useRouter } from 'vue-router'
import { ThumbImageQuery } from '@/utils'
import { showImagePreview } from 'vant'
import { formatDate, getDateDifference } from 'vue3-common/utils/dateUtil'
const productStore = useProductStore()
const router = useRouter()
@@ -96,6 +101,14 @@ const deleteClick = () => {
productStore.handleProductApi(props.productItem as IProduct)
})
}
const getTotalDay = (product: IProduct) => {
if (product.expiryDate) {
return getDateDifference(product.purchaseDate, product.expiryDate, 'days')
} else {
return getDateDifference(product.purchaseDate, formatDate(new Date()), 'days')
}
}
</script>
<style lang="scss">

View File

@@ -35,7 +35,7 @@ const queryOrderList = [
label: '购买日期',
value: 'date'
}, {
label: '日均价格',
label: '价格',
value: 'price'
}
]

View File

@@ -15,18 +15,10 @@ export interface IProduct {
* 到期日期
*/
expiryDate: string;
/**
* 总天数
*/
totalDay?: number;
/**
* 金额
*/
price: number;
/**
* 日平均价格
*/
averagePrice?: number;
/**
* 分类
*/