|
|
@@ -64,27 +64,47 @@
|
|
|
<view class="goods-category-section" :id="category.scrollId" v-for="category in filteredGoods" :key="category.id">
|
|
|
<view class="category-title">{{ category.name }}</view>
|
|
|
<u-checkbox-group v-model="selectedGoods" placement="column">
|
|
|
- <view class="goods-card" v-for="goods in category.items" :key="goods.id">
|
|
|
- <!-- <image class="goods-image" :src="goods.image" mode="aspectFill"></image> -->
|
|
|
- <u-image width="120rpx" height="120rpx" border-radius="12rpx" :src="goods.image" mode="aspectFill"></u-image>
|
|
|
- <view class="goods-info">
|
|
|
- <view class="goods-name">{{ goods.name }}</view>
|
|
|
- <view class="goods-desc">{{ goods.dishName || goods.description }}</view>
|
|
|
- <view class="goods-sales">销量:{{ goods.sales }}</view>
|
|
|
- <view class="goods-price-line">
|
|
|
- <text class="price"><text class="unit">¥</text>{{ goods.price }}</text>
|
|
|
- <text class="original-price">¥{{ goods.sellingPrice }}</text>
|
|
|
+ <view class="goods-box" v-for="goods in category.items" :key="goods.id">
|
|
|
+ <view class="goods-card">
|
|
|
+ <!-- <image class="goods-image" :src="goods.image" mode="aspectFill"></image> -->
|
|
|
+ <u-image width="120rpx" height="120rpx" border-radius="12rpx" :src="goods.image" mode="aspectFill"></u-image>
|
|
|
+ <view class="goods-info">
|
|
|
+ <view class="goods-name">{{ goods.name }}</view>
|
|
|
+ <view class="goods-desc">{{ goods.dishName || goods.description }}</view>
|
|
|
+ <view class="goods-sales">销量:{{ goods.sales }}</view>
|
|
|
+ <view class="goods-price-line">
|
|
|
+ <text class="price"><text class="unit">¥</text>{{ goods.price }}</text>
|
|
|
+ <text class="original-price">¥{{ goods.sellingPrice }}</text>
|
|
|
+ </view>
|
|
|
+ <view class="status" v-if="currentStatusTab == 2">{{ getReviewStatus(goods.reviewStatus) }}</view>
|
|
|
+ </view>
|
|
|
+ <!-- 根据模式和状态显示不同操作 -->
|
|
|
+ <view class="goods-actions">
|
|
|
+ <u-button
|
|
|
+ v-if="!isManaging && currentStatusTab === 2"
|
|
|
+ type="primary" plain
|
|
|
+ @click="editGoods(goods)"
|
|
|
+ >编辑</u-button>
|
|
|
+ <u-checkbox v-if="isManaging" :name="goods.id" shape="circle" v-model="goods.checked" @change="onSelect"></u-checkbox>
|
|
|
</view>
|
|
|
- <view class="status" v-if="currentStatusTab == 2 && goods.reviewStatus !== 1">{{ getReviewStatus(goods.reviewStatus) }}</view>
|
|
|
</view>
|
|
|
- <!-- 根据模式和状态显示不同操作 -->
|
|
|
- <view class="goods-actions">
|
|
|
+ <!-- 其它操作 -->
|
|
|
+ <view class="other-actions">
|
|
|
<u-button
|
|
|
- v-if="!isManaging && currentStatusTab === 2"
|
|
|
+ v-if="!isManaging && currentStatusTab === 2 && goods.reviewStatus == 1"
|
|
|
+ type="primary" plain
|
|
|
+ @click="handleAction('publish', goods)"
|
|
|
+ >上架</u-button>
|
|
|
+ <u-button
|
|
|
+ v-if="!isManaging && [0,1].indexOf(currentStatusTab) !== -1"
|
|
|
type="primary" plain
|
|
|
- @click="editGoods(goods)"
|
|
|
- >编辑</u-button>
|
|
|
- <u-checkbox v-if="isManaging" :name="goods.id" shape="circle" v-model="goods.checked" @change="onSelect"></u-checkbox>
|
|
|
+ @click="handleAction('unpublish', goods)"
|
|
|
+ >下架</u-button>
|
|
|
+ <u-button
|
|
|
+ v-if="!isManaging && currentStatusTab === 2"
|
|
|
+ type="error" plain
|
|
|
+ @click="handleAction('delete', goods)"
|
|
|
+ >删除</u-button>
|
|
|
</view>
|
|
|
</view>
|
|
|
</u-checkbox-group>
|
|
|
@@ -253,7 +273,7 @@ export default {
|
|
|
this.allGoods = res.data.result.records.map(item => {
|
|
|
return {
|
|
|
...item,
|
|
|
- image: configService.apiUrl + '/' + item.productImage.split(',')[0]
|
|
|
+ image: item.productImage.split(',')[0]
|
|
|
}
|
|
|
});
|
|
|
}
|
|
|
@@ -340,6 +360,10 @@ export default {
|
|
|
item.checked = e.value;
|
|
|
}));
|
|
|
},
|
|
|
+ handleAction(action, item) {
|
|
|
+ this.selectedGoods = [item.id];
|
|
|
+ this.handleBatchAction(action);
|
|
|
+ },
|
|
|
// 操作提交事件
|
|
|
handleBatchAction(action) {
|
|
|
if (this.selectedGoods.length === 0) {
|
|
|
@@ -540,10 +564,34 @@ export default {
|
|
|
width: 100%;
|
|
|
}
|
|
|
}
|
|
|
- .goods-card {
|
|
|
+ .goods-box {
|
|
|
width: 100%;
|
|
|
padding: 20rpx 0;
|
|
|
border-bottom: 1rpx solid #f0f0f0;
|
|
|
+ .other-actions {
|
|
|
+ margin-top: 18rpx;
|
|
|
+ gap: 14rpx;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: flex-end;
|
|
|
+
|
|
|
+ ::v-deep .u-btn {
|
|
|
+ height: 46rpx;
|
|
|
+ font-weight: 400;
|
|
|
+ font-size: 26rpx;
|
|
|
+ color: #2D88F4;
|
|
|
+ padding: 0 24rpx;
|
|
|
+ margin: 0;
|
|
|
+ // background: rgba(45,136,244,0.05);
|
|
|
+ border-radius: 61rpx;
|
|
|
+ border: 1rpx solid #2D88F4;
|
|
|
+ &::after {
|
|
|
+ display: none;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .goods-card {
|
|
|
display: flex;
|
|
|
align-items: flex-start;
|
|
|
position: relative;
|
|
|
@@ -602,14 +650,14 @@ export default {
|
|
|
border-radius: 12rpx 0 12rpx;
|
|
|
background: #449AFF;
|
|
|
position: absolute;
|
|
|
- top: 20rpx;
|
|
|
+ top: 0;
|
|
|
left: 0;
|
|
|
}
|
|
|
}
|
|
|
.goods-actions {
|
|
|
position: absolute;
|
|
|
right: 0;
|
|
|
- bottom: 20rpx;
|
|
|
+ bottom: 0;
|
|
|
::v-deep .u-btn {
|
|
|
height: 46rpx;
|
|
|
font-weight: 400;
|