Browse Source

代码提交

main
Linzm 3 weeks ago
parent
commit
9f472390d9
  1. 8
      src/api/badge.ts
  2. 2
      src/config/cartoon.ts
  3. 61
      src/views/cartoon/index.vue
  4. 2
      src/views/cartoon/myOrder.vue
  5. 38
      src/views/cartoon/orderDetail.vue
  6. 98
      src/views/cartoon/previewOrder.vue

8
src/api/badge.ts

@ -159,3 +159,11 @@ export const getMultiUrl = (params: any) => {
params, params,
}) })
} }
// 获取坐骑列表
export const getMountsList = (params: any) => {
return request('products/mountsList', {
method: 'GET',
params,
})
}

2
src/config/cartoon.ts

@ -175,7 +175,7 @@ export const cartoonConfig = {
}, },
// 图片缩放比例 // 图片缩放比例
imageScale: 0.6, imageScale: 1,
// 默认值配置 // 默认值配置
defaults: { defaults: {

61
src/views/cartoon/index.vue

@ -14,8 +14,16 @@
<div class="order-type-item-title"> <div class="order-type-item-title">
{{ toValueWithout("产品类型") }} {{ toValueWithout("产品类型") }}
</div> </div>
<div class="order-type-item-title" v-if="productTypeConfig"> <div class="order-type-item-title" v-if="typeName">
{{ toValueWithout(productTypeConfig.name) }} {{ toValueWithout(typeName) }}
</div>
</div>
<div class="order-type-item" v-if="prodId">
<div class="order-type-item-title">
{{ toValueWithout("主体类型") }}
</div>
<div class="order-type-item-title" v-if="subjectName">
{{ toValueWithout(subjectName) }}
</div> </div>
</div> </div>
</div> </div>
@ -322,39 +330,30 @@ const prodId = ref(0)
const prop = ref('') const prop = ref('')
const typeId = ref(0) const typeId = ref(0)
const subjectId = ref(0) const subjectId = ref(0)
const typeName = ref('')
const subjectName = ref('')
const getOrderStat = () => { const getOrderStat = () => {
badgeApi.getOrderStat({}).then((res: any) => { badgeApi.getOrderStat({}).then((res: any) => {
orderStat.value = res orderStat.value = res
const oldProdId = prodId.value
const oldTypeId = typeId.value
prodId.value = res.prod_id prodId.value = res.prod_id
prop.value = res.prop prop.value = res.prop
typeId.value = res.type_id typeId.value = res.type_id
typeName.value = res.type_name
subjectId.value = res.subject_id subjectId.value = res.subject_id
subjectName.value = res.subject_name
if (res.type_id === 4) { if (res.type_id === 4) {
getKindList() getKindList()
} else { } else if (res.type_id === 8) {
// 4
// IDID
if (oldProdId !== res.prod_id || oldTypeId !== res.type_id) {
mountsId.value = 0 mountsId.value = 0
}
getmountsList() getmountsList()
} else if (res.type_id === 9) {
method.value = 1
scenePropsInputs.value = ['']
scene_prop.value = ''
} }
}) })
} }
//
const productTypeConfig = computed(() => {
return config.productTypes[typeId.value]
})
//
const isPetSubject = computed(() => {
return config.subjectTypes.pet.prodIds.includes(prodId.value)
})
// //
const shouldShowPhotoExample = computed(() => { const shouldShowPhotoExample = computed(() => {
return config.productLimits.photoExampleTypes.includes(prop.value) return config.productLimits.photoExampleTypes.includes(prop.value)
@ -373,19 +372,14 @@ const shouldShowMultiView = computed(() => {
const kindList = ref([]) const kindList = ref([])
const getKindList = () => { const getKindList = () => {
badgeApi.getKindList({ badgeApi.getKindList({
support_subject: getSupportSubject(), prod_id: prodId.value
type_id: 4
}).then((res: any) => { }).then((res: any) => {
kindList.value = res.list kindList.value = res.list
kindId.value = res.list && res.list[0]?.id kindId.value = res.list && res.list[0]?.id
}) })
} }
const getSupportSubject = (): number => {
return isPetSubject.value
? config.subjectTypes.pet.supportSubject
: config.subjectTypes.person.supportSubject
}
const kindId = ref(0) const kindId = ref(0)
const kindChange = (id: number) => { const kindChange = (id: number) => {
@ -407,7 +401,7 @@ const getmountsList = () => {
if (!prodId.value || !typeId.value) { if (!prodId.value || !typeId.value) {
return return
} }
badgeApi.getShapeList({ badgeApi.getMountsList({
prod_id: prodId.value, prod_id: prodId.value,
type_id: typeId.value type_id: typeId.value
}).then((res: any) => { }).then((res: any) => {
@ -639,7 +633,6 @@ const getPid = async () => {
}) })
const params = { const params = {
prod_id: prodId.value, prod_id: prodId.value,
extend_value: -1,
type_id: typeId.value, type_id: typeId.value,
subject_id: subjectId.value subject_id: subjectId.value
} }
@ -740,7 +733,10 @@ const createLog = () => {
prod_id: prodId.value, prod_id: prodId.value,
type_id: typeId.value, type_id: typeId.value,
kind_id: kindId.value, kind_id: kindId.value,
subject_id: subjectId.value subject_id: subjectId.value,
scene_prop: typeId.value === 9 && method.value === 2 && scene_prop.value ? scene_prop.value : undefined,
mounts_id: mountsId.value || undefined,
method: method.value
} }
badgeApi.createLog(params).then(() => { badgeApi.createLog(params).then(() => {
closeToast() closeToast()
@ -758,9 +754,7 @@ const createLog = () => {
prod_id: prodId.value, prod_id: prodId.value,
type_id: typeId.value, type_id: typeId.value,
kind_id: kindId.value, kind_id: kindId.value,
mounts_id: mountsId.value || undefined, subject_id: subjectId.value
subject_id: subjectId.value,
scene_prop: typeId.value === 9 && method.value === 2 && scene_prop.value ? scene_prop.value : undefined
}, },
}) })
}, 1000); }, 1000);
@ -1074,6 +1068,7 @@ onMounted(() => {
} }
.kind-box-item { .kind-box-item {
margin-right: 10px; margin-right: 10px;
margin-bottom: 10px;
padding: 6px 10px; padding: 6px 10px;
background: #f5f5f5; background: #f5f5f5;
border-radius: 8px; border-radius: 8px;

2
src/views/cartoon/myOrder.vue

@ -40,7 +40,7 @@ function getOrder() {
page: page.value, page: page.value,
size: config.myOrder.pagination.pageSize, size: config.myOrder.pagination.pageSize,
status: config.myOrder.pagination.defaultStatus, status: config.myOrder.pagination.defaultStatus,
}).then(res => { }).then((res: any) => {
if(page.value === config.myOrder.pagination.initialPage) { if(page.value === config.myOrder.pagination.initialPage) {
orders.value = res.list orders.value = res.list
} else { } else {

38
src/views/cartoon/orderDetail.vue

@ -44,8 +44,8 @@
<div class="product-details"> <div class="product-details">
<div class="product-row"> <div class="product-row">
<span class="product-label">{{ toValueWithout(config.orderDetail.messages.productName) }}</span> <span class="product-label">{{ toValueWithout(config.orderDetail.messages.productName) }}</span>
<span class="product-value" v-if="order.type_id && config.preview.productNames[order.type_id]"> <span class="product-value">
{{ toValueWithout(config.preview.productNames[order.type_id][order.prod_id] || '') }} {{ toValueWithout(order.prod_name) }}
</span> </span>
</div> </div>
<div class="product-row"> <div class="product-row">
@ -70,11 +70,11 @@
<div class="product-details"> <div class="product-details">
<div class="product-row"> <div class="product-row">
<span class="product-label">{{ toValueWithout(config.orderDetail.messages.orderId) }}</span> <span class="product-label">{{ toValueWithout(config.orderDetail.messages.orderId) }}</span>
<span class="product-value">{{order.sw_oid}}</span> <span class="product-value">{{order.id}}</span>
</div> </div>
<div class="product-row"> <div class="product-row">
<span class="product-label">{{ toValueWithout(config.orderDetail.messages.orderTime) }}</span> <span class="product-label">{{ toValueWithout(config.orderDetail.messages.orderTime) }}</span>
<span class="product-value">{{order.pay_at}}</span> <span class="product-value">{{order.created_at}}</span>
</div> </div>
</div> </div>
</div> </div>
@ -109,35 +109,19 @@ const imageList = ref([])
function getOrderDetail() { function getOrderDetail() {
badgeApi.getOrderDetail({ badgeApi.getOrderDetail({
id: id.value, id: id.value,
}).then(res => { }).then((res: any) => {
order.value = res; order.value = res;
imageUrl.value = res.path; imageUrl.value = res?.path;
backImageUrl.value = res.back_path; backImageUrl.value = res?.back_path;
shapeImage.value = res.shape_details?.frame_path || ''; shapeImage.value = res?.shape_details?.frame_path || '';
shape_name.value = res.shape_details?.name || ''; shape_name.value = res?.shape_details?.name || '';
imageList.value = [ imageList.value = [
res.path, res?.path,
res.back_path, res?.back_path,
]; ];
}) })
} }
const ImageShow = (item: any) => {
const scale = config.orderDetail.imageScale
const img = new Image()
img.src = item.frame_path
img.onload = () => {
console.log('img', img)
const ratioWidth = config.orderDetail.imageSize.width / img.width;
const ratioHeight = config.orderDetail.imageSize.height / img.height;
const x = item.axisx * ratioWidth * scale;
const y = item.axisy * ratioHeight * scale;
const path_width = item.width * ratioWidth * scale;
const path_height = item.height * ratioHeight * scale;
getStyle.value = `left: ${x}px;top: ${y}px;width: ${path_width}px;height: ${path_height}px;transform: rotate3D(1, 1, 0, 0deg)`
}
}
function goBack() { function goBack() {
router.back() router.back()
} }

98
src/views/cartoon/previewOrder.vue

@ -61,8 +61,8 @@
</div> </div>
<div class="info-section"> <div class="info-section">
<div class="info-item"> <div class="info-item">
<div class="info-title" v-if="productName">{{ toValueWithout(productName) }}</div> <div class="info-title">{{ toValueWithout('产品类型') }}</div>
<div class="info-content">{{ toValueWithout(config.preview.messages.productType) }}</div> <div class="info-content" v-if="typeName">{{ toValueWithout(typeName) }}</div>
</div> </div>
<div class="info-item"> <div class="info-item">
<div class="info-title">{{ toValueWithout("3D全彩打印") }}</div> <div class="info-title">{{ toValueWithout("3D全彩打印") }}</div>
@ -101,6 +101,10 @@
<input class="shape-box-input-text" v-if="axisz == 1" type="text" :placeholder="toValueWithout('请输入正面文字')" v-model="frontText" @change="changeFrontText" @input="changeFrontText" @onBlur="changeFrontText" /> <input class="shape-box-input-text" v-if="axisz == 1" type="text" :placeholder="toValueWithout('请输入正面文字')" v-model="frontText" @change="changeFrontText" @input="changeFrontText" @onBlur="changeFrontText" />
<input class="shape-box-input-text" v-if="axisz == -1" type="text" :placeholder="toValueWithout('请输入背面文字')" v-model="backText" @change="changeBackText" @input="changeBackText" @onBlur="changeBackText" /> <input class="shape-box-input-text" v-if="axisz == -1" type="text" :placeholder="toValueWithout('请输入背面文字')" v-model="backText" @change="changeBackText" @input="changeBackText" @onBlur="changeBackText" />
</div> </div>
</div>
<!-- 后视图 -->
<div>
</div> </div>
<div style="padding: 0 16px;"> <div style="padding: 0 16px;">
<van-divider /> <van-divider />
@ -139,7 +143,6 @@
<div style="height: 130px;"></div> <div style="height: 130px;"></div>
<div class="confirm-box"> <div class="confirm-box">
<div class="action-section"> <div class="action-section">
<!-- <button @click="sureReload" :disabled="flag < 1" class="action-btn"><img class="action-img" :src="reloadImage" alt=""> {{ toValueWithout(config.preview.messages.regenerate) }}</button> -->
<button @click="compare" :disabled="flag < 1" class="action-btn"><img class="action-img" :src="compareImage" alt=""> {{ toValueWithout(config.preview.messages.compare) }}</button> <button @click="compare" :disabled="flag < 1" class="action-btn"><img class="action-img" :src="compareImage" alt=""> {{ toValueWithout(config.preview.messages.compare) }}</button>
<button @click="save" :disabled="flag < 1" class="action-btn"><img class="action-img" :src="downloadImage" alt=""> {{ toValueWithout(config.preview.messages.saveImage) }}</button> <button @click="save" :disabled="flag < 1" class="action-btn"><img class="action-img" :src="downloadImage" alt=""> {{ toValueWithout(config.preview.messages.saveImage) }}</button>
</div> </div>
@ -153,13 +156,13 @@
<div style="padding: 16px;"> <div style="padding: 16px;">
<div style="display: flex; align-items: center; justify-content: center; gap: 20px;"> <div style="display: flex; align-items: center; justify-content: center; gap: 20px;">
<div style="text-align: center;"> <div style="text-align: center;">
<img :src="compareList.origin_path" :alt="toValueWithout(config.preview.messages.originalImage)" :style="`max-width: ${config.preview.imageSize.compareImageSize}px; max-height: ${config.preview.imageSize.compareImageSize}px; border-radius: 8px;`"> <img :src="compareList.origin_path" :alt="toValueWithout(config.preview.messages.originalImage)" :style="`max-width: ${config.preview.imageSize.compareImageSize}px; max-height: ${config.preview.imageSize.compareImageSize}px; border-radius: 8px;object-fit: contain;`">
</div> </div>
<div style="font-size: 24px; color: #333;"> <div style="font-size: 24px; color: #333;">
<van-icon name="arrow" size="20px" /> <van-icon name="arrow" size="20px" />
</div> </div>
<div style="text-align: center;"> <div style="text-align: center;">
<img :src="imageUrl" :alt="toValueWithout(config.preview.messages.previewImage)" :style="`width: ${config.preview.imageSize.compareImageSize}px; height: ${config.preview.imageSize.compareImageSize}px; border-radius: 8px;`"> <img :src="imageUrl" :alt="toValueWithout(config.preview.messages.previewImage)" :style="`width: ${config.preview.imageSize.compareImageSize}px; height: ${config.preview.imageSize.compareImageSize}px; border-radius: 8px;object-fit: contain;`">
</div> </div>
</div> </div>
<div style="text-align: center; margin-top: 16px; color: #999; font-size: 12px;"> <div style="text-align: center; margin-top: 16px; color: #999; font-size: 12px;">
@ -176,7 +179,7 @@
</div> </div>
</template> </template>
<script setup lang="ts"> <script setup lang="ts">
import { onMounted, ref, onUnmounted, nextTick, computed } from 'vue'; import { onMounted, ref, onUnmounted, nextTick } from 'vue';
import { useRouter, useRoute } from 'vue-router'; import { useRouter, useRoute } from 'vue-router';
import { showSuccessToast, showToast, showConfirmDialog } from 'vant'; import { showSuccessToast, showToast, showConfirmDialog } from 'vant';
import { localStorage } from '@/utils/local-storage' import { localStorage } from '@/utils/local-storage'
@ -187,11 +190,9 @@ import { createTextPosition } from '@/utils/textHelper'
import { cartoonConfig as config } from '@/config/cartoon' import { cartoonConfig as config } from '@/config/cartoon'
// //
import reloadImageSrc from '@/assets/badge/reload.png'
import compareImageSrc from '@/assets/badge/duibi.png' import compareImageSrc from '@/assets/badge/duibi.png'
import downloadImageSrc from '@/assets/badge/down.png' import downloadImageSrc from '@/assets/badge/down.png'
const reloadImage = reloadImageSrc
const compareImage = compareImageSrc const compareImage = compareImageSrc
const downloadImage = downloadImageSrc const downloadImage = downloadImageSrc
@ -229,59 +230,10 @@ const textHelper = createTextPosition({
} }
}) })
//
const productName = computed(() => {
if (!typeId.value || !prodId.value) return ''
const typeConfig = config.preview.productNames[typeId.value]
if (typeConfig && typeConfig[prodId.value]) {
return typeConfig[prodId.value]
}
return ''
})
function compare() { function compare() {
showCompare.value = true showCompare.value = true
} }
function sureReload() {
console.log('orderStat', orderStat.value)
if (orderStat.value.remain_count <= 0) {
showToast(toValueWithout(config.preview.messages.noRemainingCount))
return
}
isPreview.value = false
showConfirmDialog({
title: toValueWithout(config.preview.messages.regenerate),
message: toValueWithout(config.preview.messages.confirmRegenerate),
})
.then(() => {
group.value = newGroup.value
const params = {
pid: pid.value,
group: config.preview.defaults.group,
prod_id: prodId.value,
type_id: typeId.value,
kind_id: kindId.value
}
badgeApi.putModeling(params).then((res: any) => {
console.log('putModeling', res)
imageUrl.value = '';
imageList.value = []
imgKey.value = '';
createLog()
}).catch((err) => {
console.log('putModeling', err)
showToast({
message: err.message,
duration: 2000,
})
})
})
.catch(() => {
// on cancel
});
}
const imgKey = ref(config.preview.defaults.imgKey) const imgKey = ref(config.preview.defaults.imgKey)
const frameUrl = ref('') const frameUrl = ref('')
const changeImage = (item: any) => { const changeImage = (item: any) => {
@ -292,31 +244,6 @@ const changeImage = (item: any) => {
imageWater.value = item.image_url imageWater.value = item.image_url
} }
const createLog = () => {
badgeApi.createLog({
pid: pid.value,
group: config.preview.defaults.group,
prod_id: prodId.value,
type_id: typeId.value,
kind_id: kindId.value
}).then((res: any) => {
console.log('createLog', res)
progressTimer.value = null
getImageList()
progressList()
getCompareImage()
timer.value = setInterval(() => {
getImageList()
}, config.preview.polling.interval)
}).catch((err) => {
console.log('createLog', err)
showToast({
message: err.message,
duration: 2000,
})
})
}
const showPreview = ref(false) const showPreview = ref(false)
function save() { function save() {
showPreview.value = true; showPreview.value = true;
@ -426,7 +353,7 @@ const confirm = () => {
message: toValueWithout(config.preview.messages.confirmOrder), message: toValueWithout(config.preview.messages.confirmOrder),
}) })
.then(() => { .then(() => {
const parms = { const parms: any = {
pid: pid.value, pid: pid.value,
key: imgKey.value, key: imgKey.value,
pay_amount: payAmount.value, pay_amount: payAmount.value,
@ -633,7 +560,8 @@ const limitCount = ref(0)
const getShapeList = () => { const getShapeList = () => {
badgeApi.getShapeList({ badgeApi.getShapeList({
prod_id: prodId.value, prod_id: prodId.value,
type_id: typeId.value type_id: typeId.value,
subject_id: subjectId.value
}).then((res: any) => { }).then((res: any) => {
console.log('getShapeList', res) console.log('getShapeList', res)
shapeList.value = res.list shapeList.value = res.list
@ -1037,12 +965,14 @@ const shapeChange = (item: any) => {
const orderStat = ref({}) const orderStat = ref({})
const typeId = ref(0) const typeId = ref(0)
const subjectId = ref(0) const subjectId = ref(0)
const typeName = ref('')
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 typeId.value = res.type_id
subjectId.value = res.subject_id subjectId.value = res.subject_id
typeName.value = res.type_name
badgeTypeId.value = res.type_id badgeTypeId.value = res.type_id
getSizeList() getSizeList()
}) })

Loading…
Cancel
Save