设置store

This commit is contained in:
李志鹏
2025-10-24 11:47:07 +08:00
parent c1d57f2347
commit 9fff109c77
5 changed files with 79 additions and 28 deletions

View File

@@ -24,6 +24,17 @@ const request = (config: any) => {
* @param data.isRegenerated 是否重新生成 0-否1-是
*/
export function generateTryOnEffect(data: Object) {
return new Promise(resolve => {
setTimeout(() => {
resolve({
tryOnId: 1,
tryOnUrl: "http://118.31.39.42:3000/falls/1.png",
styleUrl: "http://118.31.39.42:3000/falls/1.png",
isRegenerated: 0,
isFavorite: 0,
})
}, 1000)
})
return request({
url: '/api/try-on-effects/generate',
method: 'post',
@@ -38,6 +49,16 @@ export function generateTryOnEffect(data: Object) {
* @param data.file 顾客照片文件
*/
export function uploadCustomerPhoto(data: FormData) {
return new Promise(resolve => {
useOverallStore().setLoading(true)
setTimeout(() => {
resolve({
visitRecordId: "2",
defaultImageUrl: URL.createObjectURL(data.get('file')),
})
useOverallStore().setLoading(false)
}, 1000)
})
return request({
url: '/api/customer-photos/upload',
method: 'post',

View File

@@ -23,7 +23,18 @@ export const useGenerateStore = defineStore({
photoInfo: {
id: "",
url: "",
}
file: null,
},
/** AI魔改信息 */
customizeInfo: {
inputText:"",
tryOnId: "",
tryOnUrl: "",
styleUrl: "",
isRegenerated: "",
isFavorite: false,
},
}
},
getters: {
@@ -65,6 +76,16 @@ export const useGenerateStore = defineStore({
updatePhotoInfo(data: any) {
this.photoInfo.id = data.visitRecordId || ""
this.photoInfo.url = data.defaultImageUrl || ""
this.photoInfo.file = null
},
/** 更新AI魔改信息 */
clearCustomizeInfo(data: any) {
this.customizeInfo.inputText = data.inputText || ""
this.customizeInfo.tryOnId = data.tryOnId || ""
this.customizeInfo.tryOnUrl = data.tryOnUrl || ""
this.customizeInfo.styleUrl = data.styleUrl || ""
this.customizeInfo.isRegenerated = data.isRegenerated || ""
this.customizeInfo.isFavorite = data.isFavorite || ""
},
}
})
})

View File

@@ -13,20 +13,19 @@
import { useGenerateStore } from '@/stores'
const store = useGenerateStore()
const customizeInfo = store.customizeInfo
const router = useRouter()
const inputText = ref('')
const isFavorite = ref(false)
const tryOnUrl = ref('')
const loading = ref(false)
const onSend = () => {
if (inputText.value === '') return
if (customizeInfo.inputText === '') return
generate()
const text = inputText.value
inputText.value = ''
customizeInfo.inputText = ''
// const text = inputText.value
// inputText.value = ''
// console.log('发送消息:', text)
}
const onReload = () => {
inputText.value = ''
customizeInfo.inputText = ''
generate(true)
}
@@ -40,13 +39,16 @@
customerPhotoId: store.customerPhotoId,
originalTryOnId: store.originalTryOnId,
isRegenerated: isRegenerated ? 1 : 0,
prompt: inputText.value
prompt: customizeInfo.inputText
}
loading.value = true
generateTryOnEffect(data)
.then((res) => {
tryOnUrl.value = res.tryOnUrl
isFavorite.value = !!res.isFavorite
customizeInfo.tryOnId = res.tryOnId
customizeInfo.tryOnUrl = res.tryOnUrl
customizeInfo.styleUrl = res.styleUrl
customizeInfo.isRegenerated = res.isRegenerated
customizeInfo.isFavorite = !!res.isFavorite
loading.value = false
})
.catch((err) => {
@@ -54,15 +56,15 @@
loading.value = false
})
}
generate()
if (customizeInfo.tryOnId === '') generate()
// 喜欢
const isLoveLoading = ref(false)
const onLove = () => {
if (isLoveLoading.value) return
const http = isFavorite.value ? cancelTryOnEffectFavorite : setTryOnEffectFavorite
const http = customizeInfo.isFavorite ? cancelTryOnEffectFavorite : setTryOnEffectFavorite
customizeInfo.isFavorite = !customizeInfo.isFavorite
isLoveLoading.value = true
isFavorite.value = !isFavorite.value
http('tryOnId')
.then(() => {
isLoveLoading.value = false
@@ -94,21 +96,23 @@
<div class="help">?</div>
<input
type="text"
v-model="inputText"
v-model="customizeInfo.inputText"
@keyup.enter="onSend"
placeholder="Try: “Change background to Tokyo City”"
/>
<div class="send" @click="onSend"><SvgIcon name="send" size="48" /></div>
</div>
<div class="card">
<img :src="tryOnUrl" />
<img :src="customizeInfo.tryOnUrl" />
<!-- <div class="select-box">
<div class="icon"><SvgIcon name="history" size="35" /></div>
<div class="label">History</div>
<div class="icon"><SvgIcon name="xialajiantou" size="29" /></div>
</div> -->
<div class="icons">
<div @click="onLove"><SvgIcon :name="`love_${isFavorite ? 1 : 0}`" size="35" /></div>
<div @click="onLove">
<SvgIcon :name="`love_${customizeInfo.isFavorite ? 1 : 0}`" size="35" />
</div>
<div @click="onReload"><SvgIcon name="reload" size="35" /></div>
<!-- <div @click="onDownload"><SvgIcon name="download" size="35" /></div> -->
</div>

View File

@@ -3,6 +3,8 @@
import FooterNavigation from '@/components/FooterNavigation.vue'
import { ref, onMounted } from 'vue'
import { useRouter } from 'vue-router'
import { useGenerateStore } from '@/stores'
const generateStore = useGenerateStore()
const emit = defineEmits(['view-type'])
onMounted(() => {
emit('view-type', 1)
@@ -11,10 +13,13 @@
const faceUrl = ref('')
// 上传照片
const handleUploadFace = () => {
generateStore.updatePhotoInfo({})
router.push({ name: 'uploadFace2' })
}
// 完成上传
// 跳过上传
const handleFinish = () => {
generateStore.updatePhotoInfo({})
generateStore.clearCustomizeInfo({})
router.push({ name: 'customize' })
}
</script>
@@ -71,7 +76,7 @@
line-height: 132%;
}
}
>.btns {
> .btns {
width: 100%;
display: flex;
justify-content: center;

View File

@@ -12,10 +12,7 @@
emit('view-type', 1)
})
const router = useRouter()
const fileData = reactive({
url:"",
file: null,
});
const fileData = generateStore.photoInfo
// 上传照片
const handleUploadFace = () => {
const input = document.createElement('input')
@@ -27,6 +24,7 @@
const file = e.target.files[0]
if (!file) return
const url = URL.createObjectURL(file)
fileData.id = ''
fileData.url = url
fileData.file = file
// const reader = new FileReader()
@@ -38,13 +36,15 @@
}
// 生成照片
const handleGenerate = () => {
if (fileData.id) return router.push({ name: 'customize' })
if (!fileData.file) return
const formData = new FormData()
formData.append('customerId', "1")
formData.append('visitRecordId', "1")
formData.append('customerId', '1')
formData.append('visitRecordId', '1')
formData.append('file', fileData.file)
uploadCustomerPhoto(formData).then(res => {
generateStore.updatePhotoInfo(res);
uploadCustomerPhoto(formData).then((res) => {
generateStore.updatePhotoInfo(res)
generateStore.clearCustomizeInfo({})
router.push({ name: 'customize' })
})
}