czg_team/cashier-web
7
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

优化更新

Browse Source
This commit is contained in:
gyq
2025-11-11 11:04:26 +08:00
parent 2432c53a73
commit 636fa4e033
32 changed files with 2280 additions and 704 deletions
Download Patch File Download Diff File Expand all files Collapse all files

81
src/views/tool/Instead/components/goods-item.vue
View File

@@ -1,58 +1,34 @@
<template>
<div class="goods-item">
<el-image
v-if="item.coverImg"
class="goods-image"
:src="item.coverImg + '?x-oss-process=image/resize,m_lfit,w_100,h_100'"
fit="cover"
></el-image>
<el-image v-if="item.coverImg" class="goods-image"
:src="item.coverImg + '?x-oss-process=image/resize,m_lfit,w_100,h_100'" fit="cover"></el-image>
<div class="info" @click="itemClick">
<div class="name u-flex u-flex-wrap">
<span class="weight" v-if="item.type == 'weight'">称重</span>
<span class="u-line-3">{{ item.name }}</span>
</div>
<div class="">￥{{ item.lowPrice }}</div>
<div class="" v-if="item.isLimitDiscount">
<span class="o_price">￥{{ item.lowPrice }}</span>
<span>￥{{ item.limitDiscountPrice }}</span>
</div>
<div v-else>￥{{ item.lowPrice }}</div>
</div>
<div
class="status"
v-if="
item.isSoldStock ||
!item.isSale ||
!item.isSaleTime ||
(item.isStock && item.stockNumber * 1 <= 0)
"
>
<svg-icon
@click="ElMessage.error('该商品已下架')"
v-if="!item.isSale"
iconClass="yi-xiajia"
color="#fff"
size="60"
></svg-icon>
<svg-icon
@click="
ElMessage.error('该商品不在可售时间内') ||
isProductAvailable(item.days, item.startTime, item.endTime)
"
v-else-if="!item.isSaleTime"
iconClass="no-sale"
color="#fff"
size="60"
></svg-icon>
<svg-icon
@click="ElMessage.error('该商品已售罄')"
v-else-if="item.isSoldStock"
iconClass="shouqing"
color="#fff"
size="60"
></svg-icon>
<svg-icon
@click="ElMessage.error('库存不足')"
v-else-if="item.isStock && item.stockNumber * 1 <= 0"
iconClass="stock_null"
color="#fff"
size="60"
></svg-icon>
<div class="status" v-if="
item.isSoldStock ||
!item.isSale ||
!item.isSaleTime ||
(item.isStock && item.stockNumber * 1 <= 0)
">
<svg-icon @click="ElMessage.error('该商品已下架')" v-if="!item.isSale" iconClass="yi-xiajia" color="#fff"
size="60"></svg-icon>
<svg-icon @click="
ElMessage.error('该商品不在可售时间内') ||
isProductAvailable(item.days, item.startTime, item.endTime)
" v-else-if="!item.isSaleTime" iconClass="no-sale" color="#fff" size="60"></svg-icon>
<svg-icon @click="ElMessage.error('该商品已售罄')" v-else-if="item.isSoldStock" iconClass="shouqing" color="#fff"
size="60"></svg-icon>
<svg-icon @click="ElMessage.error('库存不足')" v-else-if="item.isStock && item.stockNumber * 1 <= 0"
iconClass="stock_null" color="#fff" size="60"></svg-icon>
</div>
</div>
</template>
@@ -105,10 +81,12 @@ function isProductAvailable(sellDaysStr, startTimeStr, endTimeStr) {
position: relative;
overflow: hidden;
cursor: pointer;
.goods-image {
width: 100%;
height: 100%;
}
.info {
position: absolute;
box-sizing: border-box;
@@ -122,6 +100,7 @@ function isProductAvailable(sellDaysStr, startTimeStr, endTimeStr) {
background-color: rgba(46, 46, 46, 0.38);
z-index: 1;
}
.status {
position: absolute;
box-sizing: border-box;
@@ -134,9 +113,11 @@ function isProductAvailable(sellDaysStr, startTimeStr, endTimeStr) {
background-color: rgba($color: #000000, $alpha: 0.5);
}
}
:deep(.svg-icon) {
margin-right: 0;
}
.weight {
height: 15px;
background: linear-gradient(124deg, rgb(115, 201, 105) 6%, rgb(39, 146, 27) 93%);
@@ -147,4 +128,10 @@ function isProductAvailable(sellDaysStr, startTimeStr, endTimeStr) {
padding: 0px 2px;
margin-right: 2px;
}
.o_price {
font-size: 10px;
text-decoration: line-through;
opacity: .8;
}
</style>