262 lines
8.1 KiB
Vue
262 lines
8.1 KiB
Vue
<template>
|
||
<view class="skuName-cell">
|
||
<!-- skuName -->
|
||
<view class="skuName">
|
||
<!-- 图片 -->
|
||
<view class="skuName-img" @tap="previewImg(skuName)">
|
||
<view v-show="skuName.skuAllnoSale">不可售</view>
|
||
<image
|
||
class="imglabel"
|
||
mode="scaleToFill"
|
||
lazy-load
|
||
:src="skuName.img"
|
||
/>
|
||
</view>
|
||
<!-- 图片 -->
|
||
<!-- 其他信息 -->
|
||
<view class="skuName-info">
|
||
<!-- 名称 -->
|
||
<view class="skuName-name">
|
||
{{ skuName.prefix ? '[' + skuName.prefix + ']' : ''
|
||
}}{{ skuName.name }}
|
||
</view>
|
||
<view @tap.stop="copyInfo(''+ skuName.id, '复制nameID成功')" style="color:#818181;">
|
||
<text>{{ skuName.id }}</text>
|
||
<jx-icon icon="fuzhi" color="#818181" style="margin-left: 10rpx;"></jx-icon>
|
||
</view>
|
||
<!-- 价格 改价 -->
|
||
<view class="skuName-price" @tap="openPriceDialog(skuName)">
|
||
<jx-price
|
||
:price="skuName.unitPrice"
|
||
color="#F60D58"
|
||
sizeM="22rpx"
|
||
sizeN="38rpx"
|
||
/>
|
||
|
||
<view class="icon-modify" v-if="!isAudit">
|
||
<jx-icon icon="shuxie" color="#999" :size="38" />
|
||
</view>
|
||
</view>
|
||
<!-- 提示信息 -->
|
||
<view>
|
||
<view class="skuName-tips" v-if="skuName.unit === '份'">
|
||
该价格为每斤价格
|
||
</view>
|
||
<view class="skuName-tips green" v-if="skuName.unit !== '份'">
|
||
该价格为每{{ skuName.unit }}价格
|
||
</view>
|
||
<!-- 审核状态 -->
|
||
<view class="check-display" v-show="skuName.auditUnitPrice">
|
||
审核中价格：<jx-price
|
||
:price="skuName.auditUnitPrice"
|
||
color="#f44"
|
||
size="24rpx"
|
||
/>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<!-- 其他信息 -->
|
||
</view>
|
||
<!-- skuName -->
|
||
<!-- sku2 -->
|
||
<view class="skus-wrapper-new" v-if="!isAudit">
|
||
<view v-for="(sku, j) in skuName.skus" :key="j" class="sku-cell2">
|
||
<!-- 异常商品 -->
|
||
<view
|
||
class="error mt"
|
||
v-if="
|
||
sku.mtwmID !== '' &&
|
||
(sku.mtwmSyncStatus & 16) === 16 &&
|
||
(sku.mtwmSyncStatus & 2) !== 2 &&
|
||
(sku.mtwmSyncStatus & 4) !== 4
|
||
"
|
||
>美团:该商品无法修改价格,请联系运营修改</view>
|
||
<view
|
||
class="error eb"
|
||
v-if="
|
||
sku.ebaiID !== '' &&
|
||
(sku.ebaiSyncStatus & 16) === 16 &&
|
||
(sku.ebaiSyncStatus & 2) !== 2 &&
|
||
(sku.ebaiSyncStatus & 4) !== 4
|
||
"
|
||
>饿佰:该商品无法修改价格,请联系运营修改</view
|
||
>
|
||
<view class="cell-top">
|
||
<view class="price">
|
||
<view class="sku-spec">
|
||
{{ sku.specQuality }}{{ sku.specUnit }}
|
||
</view>
|
||
<view
|
||
class="sku-price"
|
||
:class="{ 'promotion-price': !isNewPriceDisplay && sku.actPrice }"
|
||
>
|
||
<jx-price
|
||
:price="sku.comparePrice"
|
||
sizeM="22rpx"
|
||
sizeN="28rpx"
|
||
color="#000"
|
||
/>
|
||
</view>
|
||
</view>
|
||
<view class="btn-group">
|
||
<view
|
||
class="btn"
|
||
:class="{ onActive: sku.storeSkuStatus }"
|
||
@tap="updateSaleStatus(sku, skuName, 1)"
|
||
>
|
||
可售
|
||
</view>
|
||
<view
|
||
class="btn"
|
||
:class="{ onActive: !sku.storeSkuStatus && !sku.autoSaleAt }"
|
||
@tap="updateSaleStatus(sku, skuName, 0)"
|
||
>
|
||
不可售
|
||
</view>
|
||
<view
|
||
v-if="!isHot"
|
||
class="btn tmpSaleNo"
|
||
:class="{ onActive: !sku.storeSkuStatus && sku.autoSaleAt }"
|
||
@tap="tmpSaleNo(sku, skuName)"
|
||
>
|
||
<text>临时</text>
|
||
<text>不可售</text>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<!-- 库存以及位置码 -->
|
||
<view style="display: flex;color:#666;margin-top:20rpx;justify-content: center">
|
||
<view @tap="openDialog(skuName,sku,'stock')">
|
||
库存：{{sku.stock}}
|
||
<jx-icon icon="shuxie" color="#999" :size="24" />
|
||
</view>
|
||
<view style="margin-left: 20rpx;" @tap="openDialog(skuName,sku,'locationCode')">
|
||
货架码：{{sku.locationCode && sku.locationCode !== 'EMPTY_VALUE' ? sku.locationCode : ''}}
|
||
<jx-icon icon="shuxie" color="#999" :size="24" />
|
||
</view>
|
||
</view>
|
||
<view class="cell-bottom">{{ sku.comment ? sku.comment : '' }}</view>
|
||
<view class="sku-autoSaleAt" v-if="sku.autoSaleAt">
|
||
该规格将在 <text>{{ sku.autoSaleAt }}</text> 可售
|
||
</view>
|
||
</view>
|
||
<view v-if="showMountTab" class="checkBoxWrap">
|
||
<label @tap="handleSale(skuName)">
|
||
<checkbox color="#4eb331" style="transform: scale(0.8)" />选中商品
|
||
</label>
|
||
</view>
|
||
</view>
|
||
|
||
<!-- 待审核商品操作面板 -->
|
||
<view class="aduit-wall" v-else>
|
||
<view class="aduit-type">{{
|
||
skuName.type === 1 ? '【价格】正在审核中' : '【新建】正在审核中'
|
||
}}</view>
|
||
<!-- ((userType & 4) === 4) 运营 -->
|
||
<view class="aduit-btn-group" v-if="(+getStorage('userType') & 4) === 4">
|
||
<view class="btn refuse" @tap="toExamine(skuName, -1)">拒绝</view>
|
||
<view class="btn" @tap="toExamine(skuName, 1)">批准</view>
|
||
</view>
|
||
<view class="aduit-btn-group" v-else>
|
||
<view class="btn" @tap="phoneCall(storeInfo.marketManName)"
|
||
>联系运营加快审核</view
|
||
>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</template>
|
||
|
||
<script lang="ts" setup >
|
||
import useGlobalFunc from '@/composables/useGlobalFunc'
|
||
import { store } from '@/store'
|
||
import { getStorage } from '@/utils/storage'
|
||
import { computed } from 'vue'
|
||
import goodsListFn from './right-main'
|
||
import useOrderInfo from '@/composables/useOrderInfo'
|
||
const { copyInfo } = useOrderInfo()
|
||
const { phoneCall } = useGlobalFunc()
|
||
|
||
/*************************************************
|
||
* 接收数据
|
||
*/
|
||
interface propType {
|
||
skuName: AnyObject
|
||
isAudit: boolean
|
||
isHot: boolean
|
||
showMountTab: boolean
|
||
}
|
||
|
||
const prop = defineProps<propType>()
|
||
|
||
const {
|
||
isNewPriceDisplay, // 列表判断条件
|
||
updateSaleStatus, // 修改商品售卖状态
|
||
tmpSaleNo, // 临时不可售
|
||
} = goodsListFn(prop)
|
||
const {
|
||
previewImage, // 预览图片
|
||
} = useGlobalFunc()
|
||
|
||
const emit = defineEmits<{
|
||
(e: 'handleSale', data: AnyObject): void
|
||
(e: 'openPriceDialog', data: AnyObject): void
|
||
(e: 'openDialog', data: AnyObject): void
|
||
(e: 'toExamine', data: AnyObject): void
|
||
}>()
|
||
function handleSale(skuName: AnyObject) {
|
||
emit('handleSale', skuName)
|
||
}
|
||
|
||
/*************************************************
|
||
* 预览图片
|
||
*/
|
||
function previewImg(skuName:AnyObject) {
|
||
let arr = [skuName.img,skuName.img2,skuName.img3,skuName.img4,skuName.img5].filter(item => { return item && item.length > 0 })
|
||
previewImage(arr)
|
||
}
|
||
|
||
/*************************************************
|
||
* 修改操作
|
||
*/
|
||
function openPriceDialog(skuName: AnyObject) {
|
||
if (prop.isAudit) return
|
||
emit('openPriceDialog', skuName)
|
||
}
|
||
|
||
|
||
function openDialog(skuName: AnyObject,sku:AnyObject,type:String) {
|
||
let payload = {
|
||
nameID:skuName.id,
|
||
Skus:[{
|
||
skuID:sku.id,
|
||
stock:sku.stock,
|
||
locationCode:sku.locationCode && sku.locationCode !== 'EMPTY_VALUE' ? sku.locationCode : ''
|
||
}]
|
||
}
|
||
emit('openDialog', {payload,type,name:skuName.name})
|
||
}
|
||
|
||
/*************************************************
|
||
* 拒绝改价
|
||
*/
|
||
function toExamine(skuName: AnyObject, type: any) {
|
||
let data = {
|
||
status: type,
|
||
nameID: skuName.nameID,
|
||
storeID: getStorage('storeID'),
|
||
auditPrice: skuName.auditUnitPrice,
|
||
}
|
||
emit('toExamine', data)
|
||
}
|
||
|
||
/***************************************************************
|
||
* 获取门店信息
|
||
*/
|
||
const storeInfo = computed(() => {
|
||
return store.state.storeInfo.allStoreInfo
|
||
})
|
||
</script>
|
||
|
||
<style lang="scss" scoped>
|
||
@import './right-main.scss';
|
||
</style> |