Browse Source

再次生成bug修改,提示文字修改

lzm_web
Linzm 8 months ago
parent
commit
5e0ce4b4b5
  1. 6
      src/views/badge/index.vue
  2. 77
      src/views/badge/preview.vue
  3. 6
      src/views/badge/record.vue

6
src/views/badge/index.vue

@ -82,8 +82,8 @@ function getBlobBg(data) {
} }
imgBgUrl.value = data; imgBgUrl.value = data;
} }
const getRandomNumber = (min: number, max: number) => { const getRandomNumber = () => {
return Math.floor(Math.random() * (max - min + 1) + min); return kindList.value.map(obj => obj.id)[Math.floor(Math.random() * kindList.value.length)];
} }
// Pid // Pid
@ -94,7 +94,7 @@ const getPid = async () => {
message: '上传中...', message: '上传中...',
forbidClick: true, forbidClick: true,
}) })
kindId.value = checkId.value == 0 ? getRandomNumber(kindList.value[0].id, kindList.value[kindList.value.length - 1].id) : checkId.value kindId.value = checkId.value == 0 ? getRandomNumber() : checkId.value
const params = { const params = {
extend_value: isBgShow.value ? -1 : 0, extend_value: isBgShow.value ? -1 : 0,
kind_id: kindId.value, kind_id: kindId.value,

77
src/views/badge/preview.vue

@ -24,7 +24,7 @@
<div class="progress-bar-bg"> <div class="progress-bar-bg">
<div class="progress-bar-fg" :style="{ width: progress + '%' }"></div> <div class="progress-bar-fg" :style="{ width: progress + '%' }"></div>
</div> </div>
<div class="progress-text">照片数据分析中 {{progress}}%</div> <div class="progress-text">{{progressText}} {{progress}}%</div>
<div class="progress-desc">总计大约需要60秒请耐心等待...</div> <div class="progress-desc">总计大约需要60秒请耐心等待...</div>
</div> </div>
<div v-else class="progress-section"> <div v-else class="progress-section">
@ -163,7 +163,7 @@
<script setup lang="ts"> <script setup lang="ts">
import { onMounted, ref } from 'vue'; import { onMounted, ref } from 'vue';
import { useRoutimporter } from 'vue-router'; import { useRoutimporter } from 'vue-router';
import { showSuccessToast, showToast, showNotify } from 'vant'; import { showSuccessToast, showToast, showNotify, showConfirmDialog } from 'vant';
import * as badgeApi from '@/api/badge' import * as badgeApi from '@/api/badge'
const router = useRouter(); const router = useRouter();
const value = ref(0); const value = ref(0);
@ -199,13 +199,17 @@ function reload() {
}) })
showReload.value = true showReload.value = true
} }
const getKindID = () => {
return kindList.value.map(obj => obj.id)[Math.floor(Math.random() * kindList.value.length)];
}
function sureReload() { function sureReload() {
console.log('sureReload') console.log('sureReload')
imageUrl.value = ''; imageUrl.value = '';
group.value = newGroup.value group.value = newGroup.value
const kindID = checkId.value == 0 ? getKindID() : checkId.value
const params = { const params = {
pid: pid.value, pid: pid.value,
kind_id: checkId.value, kind_id: kindID,
extend_value: extend_value.value, extend_value: extend_value.value,
group: group.value, group: group.value,
} }
@ -314,30 +318,41 @@ const confirm = () => {
return return
} }
loading.value = true loading.value = true
const parms = { showConfirmDialog({
pid: pid.value, title: '确认下单',
key: key.value, message:
pay_amount: payAmount.value, '请再次确认是否选择这个模型下单。',
products: sizeList.value })
} .then(() => {
badgeApi.creatOrder(parms).then((res: any) => { const parms = {
console.log('creatOrder', res) pid: pid.value,
showSuccessToast({ key: key.value,
message: '下单成功', pay_amount: payAmount.value,
duration: 2000, products: sizeList.value
}) }
router.push({ badgeApi.creatOrder(parms).then((res: any) => {
path: '/badge/myOrder' console.log('creatOrder', res)
}) showSuccessToast({
}).catch((err) => { message: '下单成功',
console.log('creatOrder', err) duration: 2000,
showToast({ })
message: err.message, router.push({
duration: 2000, path: '/badge/myOrder'
})
}).catch((err) => {
console.log('creatOrder', err)
showToast({
message: err.message,
duration: 2000,
})
}).finally(() => {
loading.value = false
}) })
}).finally(() => {
loading.value = false
}) })
.catch(() => {
// on cancel
});
} }
const imageUrl = ref('') const imageUrl = ref('')
@ -347,6 +362,7 @@ const flag = ref(1)
const timer = ref() const timer = ref()
const progress = ref(0) const progress = ref(0)
const progressTimer = ref() const progressTimer = ref()
const progressText = ref('')
const progressList = () => { const progressList = () => {
// //
progress.value = 0 progress.value = 0
@ -354,6 +370,15 @@ const progressList = () => {
progressTimer.value = setInterval(() => { progressTimer.value = setInterval(() => {
if (progress.value < 90) { if (progress.value < 90) {
progress.value += 1 progress.value += 1
if (progress.value < 25) {
progressText.value = '照片数据分析中'
} else if (progress.value < 50) {
progressText.value = '提炼图像关键词'
} else if (progress.value < 75) {
progressText.value = '图像生成中'
} else {
progressText.value = '图像后处理与优化'
}
} }
}, 300) }, 300)
} }
@ -381,6 +406,7 @@ const getImageList = () => {
imageUrl.value = data.list[0].origin_url imageUrl.value = data.list[0].origin_url
imageList.value = data.list imageList.value = data.list
key.value = data.list[0].key key.value = data.list[0].key
getCompareImage()
} }
}).catch((err) => { }).catch((err) => {
clearInterval(progressTimer.value) clearInterval(progressTimer.value)
@ -404,7 +430,6 @@ onMounted(() => {
getImageList() getImageList()
progressList() progressList()
getSizeList() getSizeList()
getCompareImage()
timer.value = setInterval(() => { timer.value = setInterval(() => {
getImageList() getImageList()
}, 10000) }, 10000)

6
src/views/badge/record.vue

@ -11,7 +11,10 @@
<img :src="item.path" :alt="item.name" style="width: 100%; height: 100%; object-fit: cover; border-radius: 50%;"> <img :src="item.path" :alt="item.name" style="width: 100%; height: 100%; object-fit: cover; border-radius: 50%;">
<div class="record-image-item-shadow"></div> <div class="record-image-item-shadow"></div>
</block> </block>
<div v-else class="record-image-item-loading"> <div v-else-if="item.status == 0" class="record-image-item-loading">
设计中
</div>
<div v-else-if="item.status == 2" class="record-image-item-loading">
设计失败 设计失败
</div> </div>
</div> </div>
@ -109,7 +112,6 @@ function goBack() {
position: relative; position: relative;
overflow: hidden; overflow: hidden;
cursor: pointer; cursor: pointer;
background: #f5f5f5;
border-radius: 12px; border-radius: 12px;
} }
.record-image-item img { .record-image-item img {

Loading…
Cancel
Save