Browse Source

冰箱贴功能

lzm_web
Linzm 6 months ago
parent
commit
1115abecce
  1. 2
      .env.development
  2. 36
      src/views/badge/index.vue
  3. 4
      src/views/badge/orderDetail.vue
  4. 53
      src/views/badge/preview.vue

2
.env.development

@ -1,5 +1,5 @@
VITE_APP_PREVIEW=true VITE_APP_PREVIEW=true
# VITE_APP_API_BASE_URL=http://172.16.0.47:8166/web/ # VITE_APP_API_BASE_URL=http://172.16.20.21:8166/web/
# VITE_APP_API_BASE_URL=https://wechat-test.api.puabadge.com/web/ # VITE_APP_API_BASE_URL=https://wechat-test.api.puabadge.com/web/
VITE_APP_API_BASE_URL=https://wechat.api.puabadge.com/web/ VITE_APP_API_BASE_URL=https://wechat.api.puabadge.com/web/
# VITE_APP_API_WX_URL=https://wechat.api.puabadge.com/web/ # VITE_APP_API_WX_URL=https://wechat.api.puabadge.com/web/

36
src/views/badge/index.vue

@ -15,12 +15,15 @@
<div class="order-type-item-title"> <div class="order-type-item-title">
产品类型 产品类型
</div> </div>
<div class="order-type-item-title" v-if="orderStat.type_id == 1"> <div class="order-type-item-title" v-if="typeId == 1">
{{ prodId == 7 ? '人物立体徽章' : '宠物立体徽章'}} {{ prodId == 7 ? '人物立体徽章' : '宠物立体徽章'}}
</div> </div>
<div class="order-type-item-title" v-if="orderStat.type_id == 2"> <div class="order-type-item-title" v-if="typeId == 2">
{{ prodId == 7 ? '人物浮雕相框' : '宠物浮雕相框'}} {{ prodId == 7 ? '人物浮雕相框' : '宠物浮雕相框'}}
</div> </div>
<div class="order-type-item-title" v-if="typeId == 3">
{{ prodId == 7 ? '人物冰箱贴' : '宠物冰箱贴'}}
</div>
</div> </div>
</div> </div>
<div class="size-title"> <div class="size-title">
@ -108,12 +111,12 @@
</div> </div>
</div> </div>
</div> </div>
<div class="tag-change-box" v-if="orderStat.use_type == 2"> <div class="tag-change-box" v-if="trialCode == false">
<div class="tag-change-item"> <div class="tag-change-item">
<div class="tag-change-item-title" :class="{ tagActive: prodId == 7 }" @click="prodId = 7;picture = null"> <div class="tag-change-item-title" :class="{ tagActive: prodId == 7 }" @click="prodChange(7)">
人物主体 人物主体
</div> </div>
<div class="tag-change-item-title" :class="{ tagActive: prodId == 8 }" @click="prodId = 8;picture = null"> <div class="tag-change-item-title" :class="{ tagActive: prodId == 8 }" @click="prodChange(8)">
宠物主体 宠物主体
</div> </div>
</div> </div>
@ -324,15 +327,26 @@ const getSizeList = () => {
const orderStat = ref({}) const orderStat = ref({})
const prodId = ref(7) const prodId = ref(7)
const prop = ref('') const prop = ref('')
const typeId = ref(0)
const getOrderStat = () => { const getOrderStat = () => {
badgeApi.getOrderStat({}).then((res: any) => { badgeApi.getOrderStat({}).then((res: any) => {
orderStat.value = res orderStat.value = res
prodId.value = res.prod_id prodId.value = res.type_id == 3 ? 8 : res.prod_id
prop.value = res.prop prop.value = res.prop
typeId.value = res.type_id
getSundryList() getSundryList()
}) })
} }
const prodChange = (id: number) => {
if (typeId.value == 3) {
showToast('人物3D冰箱贴暂未开放')
return
}
prodId.value = id
picture.value = null
}
const isLoading = ref(false) const isLoading = ref(false)
// //
@ -530,6 +544,7 @@ const getPid = async () => {
const params = { const params = {
prod_id: prodId.value, prod_id: prodId.value,
extend_value: -1, extend_value: -1,
type_id: typeId.value
} }
try { try {
const res = await badgeApi.getPid(params) as any const res = await badgeApi.getPid(params) as any
@ -590,7 +605,8 @@ const sendToOss = async (src: string, url: string) => {
pid: pid.value, pid: pid.value,
group: 1, group: 1,
prod_id: prodId.value, prod_id: prodId.value,
extend_value: -1 extend_value: -1,
type_id: typeId.value
} }
badgeApi.putModeling(params).then((res: any) => { badgeApi.putModeling(params).then((res: any) => {
console.log('putModeling', res) console.log('putModeling', res)
@ -617,7 +633,8 @@ const createLog = () => {
const params = { const params = {
pid: pid.value, pid: pid.value,
group: 1, group: 1,
prod_id: prodId.value prod_id: prodId.value,
type_id: typeId.value
} }
badgeApi.createLog(params).then((res: any) => { badgeApi.createLog(params).then((res: any) => {
console.log('createLog', res) console.log('createLog', res)
@ -633,7 +650,8 @@ const createLog = () => {
query: { query: {
pid: pid.value, pid: pid.value,
group: 1, group: 1,
prod_id: prodId.value prod_id: prodId.value,
type_id: typeId.value
}, },
}) })
}, 1000); }, 1000);

4
src/views/badge/orderDetail.vue

@ -41,7 +41,9 @@
<div class="product-details"> <div class="product-details">
<div class="product-row"> <div class="product-row">
<span class="product-label">产品名称</span> <span class="product-label">产品名称</span>
<span class="product-value">立体徽章</span> <span class="product-value" v-if="order.type_id == 1">{{ order.prod_id == 7 ? '人物立体徽章' : '宠物立体徽章' }}</span>
<span class="product-value" v-if="order.type_id == 2">{{ order.prod_id == 7 ? '人物浮雕相框' : '宠物浮雕相框' }}</span>
<span class="product-value" v-if="order.type_id == 3">{{ order.prod_id == 7 ? '人物冰箱贴' : '宠物冰箱贴' }}</span>
</div> </div>
<div class="product-row"> <div class="product-row">
<span class="product-label">尺寸</span> <span class="product-label">尺寸</span>

53
src/views/badge/preview.vue

@ -50,8 +50,9 @@
</div> </div>
<div class="info-section"> <div class="info-section">
<div class="info-item"> <div class="info-item">
<div class="info-title" v-if="orderStat.type_id == 1">{{ prodId == 7 ? '人物立体徽章' : '宠物立体徽章' }}</div> <div class="info-title" v-if="typeId == 1">{{ prodId == 7 ? '人物立体徽章' : '宠物立体徽章' }}</div>
<div class="info-title" v-if="orderStat.type_id == 2">{{ prodId == 7 ? '人物浮雕相框' : '宠物浮雕相框' }}</div> <div class="info-title" v-if="typeId == 2">{{ prodId == 7 ? '人物浮雕相框' : '宠物浮雕相框' }}</div>
<div class="info-title" v-if="typeId == 3">{{ prodId == 7 ? '人物3D冰箱贴' : '宠物3D冰箱贴' }}</div>
<div class="info-content">产品类型</div> <div class="info-content">产品类型</div>
</div> </div>
<div class="info-item"> <div class="info-item">
@ -64,10 +65,10 @@
</div> </div>
</div> </div>
<div class="shape-body"> <div class="shape-body">
<!-- <div class="shape-type"> <div class="shape-type" v-if="imageUrl && typeId == 3">
<div class="shape-type-item" :class="{ 'shape-active': item.id == typeId }" v-for="item in typesList" :key="item.id" @click="typeChange(item.id)">{{item.name}}</div> <div class="shape-type-item" :class="{ 'shape-active': item.id == shapeId }" v-for="item in shapeList" :key="item.id" @click="shapeChange(item)">{{item.name}}</div>
</div> --> </div>
<div class="shape-box" v-if="imageUrl"> <div class="shape-box" v-if="imageUrl && typeId != 3">
<block v-for="item in shapeList" :key="item.id"> <block v-for="item in shapeList" :key="item.id">
<div class="shape-item" @click="shapeChange(item)"> <div class="shape-item" @click="shapeChange(item)">
<div class="shape-item-list"> <div class="shape-item-list">
@ -204,7 +205,8 @@ function sureReload() {
const params = { const params = {
pid: pid.value, pid: pid.value,
group: group.value, group: group.value,
prod_id: prodId.value prod_id: prodId.value,
type_id: typeId.value
} }
badgeApi.putModeling(params).then((res: any) => { badgeApi.putModeling(params).then((res: any) => {
console.log('putModeling', res) console.log('putModeling', res)
@ -230,9 +232,11 @@ function sureReload() {
} }
const imgKey = ref(101) const imgKey = ref(101)
const frameUrl = ref('')
const changeImage = (item: any) => { const changeImage = (item: any) => {
imgKey.value = item.key imgKey.value = item.key
imageUrl.value = item.origin_url imageUrl.value = item.origin_url
frameUrl.value = item.frame_url
imageWater.value = item.url imageWater.value = item.url
} }
@ -272,7 +276,8 @@ function getCompareImage() {
badgeApi.getCompareImage({ badgeApi.getCompareImage({
pid: pid.value, pid: pid.value,
group: group.value, group: group.value,
prod_id: prodId.value prod_id: prodId.value,
type_id: typeId.value
}).then((res: any) => { }).then((res: any) => {
console.log('getCompareImage', res) console.log('getCompareImage', res)
compareList.value = res compareList.value = res
@ -361,10 +366,14 @@ const loading = ref(false)
const confirm = () => { const confirm = () => {
if (loading.value) return if (loading.value) return
console.log('confirm') console.log('confirm')
// if (payAmount.value <= 0) { if (payAmount.value <= 0) {
// showToast('') showToast('请先选择下单数量')
// return return
// } }
if (typeId.value == 2 && (shapeText.value == '' || !shapeText.value.trim())) {
showToast('请输入自定义文本')
return
}
if (orderStat.value.use_type == 2 && !contact_name.value) { if (orderStat.value.use_type == 2 && !contact_name.value) {
showToast('请先填写收货人信息') showToast('请先填写收货人信息')
return return
@ -455,6 +464,7 @@ const getPosition = () => {
} }
const imageUrl = ref('') const imageUrl = ref('')
const originUrl = ref('')
const group = ref(1); const group = ref(1);
// //
const flag = ref(1) const flag = ref(1)
@ -510,7 +520,9 @@ const getImageList = () => {
// , // ,
if (firstGeneratedImage && !isPreview.value) { if (firstGeneratedImage && !isPreview.value) {
originUrl.value = firstGeneratedImage.origin_url
imageUrl.value = firstGeneratedImage.origin_url imageUrl.value = firstGeneratedImage.origin_url
frameUrl.value = firstGeneratedImage.frame_url
imageWater.value = firstGeneratedImage.url imageWater.value = firstGeneratedImage.url
imgKey.value = firstGeneratedImage.key imgKey.value = firstGeneratedImage.key
isPreview.value = true isPreview.value = true
@ -538,11 +550,15 @@ const getImageList = () => {
const currentImage = mergedList.filter((item: any) => item.key === imgKey.value)[0] const currentImage = mergedList.filter((item: any) => item.key === imgKey.value)[0]
console.log('currentImage', currentImage) console.log('currentImage', currentImage)
if (currentImage && currentImage.status === 1) { if (currentImage && currentImage.status === 1) {
originUrl.value = currentImage.origin_url
imageUrl.value = currentImage.origin_url imageUrl.value = currentImage.origin_url
frameUrl.value = currentImage.frame_url
imageWater.value = currentImage.url imageWater.value = currentImage.url
isPreview.value = true isPreview.value = true
} else { } else {
originUrl.value = currentImage.origin_url
imageUrl.value = currentImage.origin_url imageUrl.value = currentImage.origin_url
frameUrl.value = currentImage.frame_url
imageWater.value = currentImage.url imageWater.value = currentImage.url
isPreview.value = true isPreview.value = true
} }
@ -561,10 +577,14 @@ const getImageList = () => {
// //
imageList.value = data.list imageList.value = data.list
if (imgKey.value) { if (imgKey.value) {
originUrl.value = data.list.filter((item: any) => item.key == imgKey.value)[0].origin_url
imageUrl.value = data.list.filter((item: any) => item.key == imgKey.value)[0].origin_url imageUrl.value = data.list.filter((item: any) => item.key == imgKey.value)[0].origin_url
frameUrl.value = data.list.filter((item: any) => item.key == imgKey.value)[0].frame_url
imageWater.value = data.list.filter((item: any) => item.key == imgKey.value)[0].url imageWater.value = data.list.filter((item: any) => item.key == imgKey.value)[0].url
} else { } else {
originUrl.value = data.list[0].origin_url
imageUrl.value = data.list[0].origin_url imageUrl.value = data.list[0].origin_url
frameUrl.value = data.list[0].frame_url
imageWater.value = data.list[0].url imageWater.value = data.list[0].url
imgKey.value = data.list[0].key imgKey.value = data.list[0].key
} }
@ -598,12 +618,12 @@ const getImageList = () => {
// }) // })
// } // }
const shapeId = ref(1) const shapeId = ref(0)
const shapeImage = ref('') const shapeImage = ref('')
const shapeList = ref([]) const shapeList = ref([])
const custom_switch = ref(0) const custom_switch = ref(0)
const limitCount = ref(10) const limitCount = ref(0)
const getShapeList = () => { const getShapeList = () => {
badgeApi.getShapeList({ badgeApi.getShapeList({
prod_id: prodId.value, prod_id: prodId.value,
@ -722,6 +742,9 @@ const shapeChange = (item: any) => {
shapeImage.value = item.frame_path shapeImage.value = item.frame_path
custom_switch.value = item.custom_switch custom_switch.value = item.custom_switch
limitCount.value = item.text_limit_max limitCount.value = item.text_limit_max
if (typeId.value == 3) {
imageUrl.value = item.name == '无边框' ? originUrl.value : frameUrl.value
}
ImageShow(item) ImageShow(item)
if (custom_switch.value == 1) { if (custom_switch.value == 1) {
textShow(item) textShow(item)
@ -739,10 +762,12 @@ const getTrialCode = () => {
} }
const orderStat = ref({}) const orderStat = ref({})
const typeId = ref(0)
const getOrderStat = () => { const getOrderStat = () => {
badgeApi.getOrderStat({}).then((res: any) => { badgeApi.getOrderStat({}).then((res: any) => {
console.log('getOrderStat', res) console.log('getOrderStat', res)
orderStat.value = res orderStat.value = res
typeId.value = res.type_id
getSizeList() getSizeList()
}) })
} }

Loading…
Cancel
Save