Merge branch 'master' of https://gitee.com/lvYeJu/lane-crawford-3
This commit is contained in:
@@ -6,7 +6,7 @@ const request = (config: any) => {
|
|||||||
if (config.loading) useOverallStore().setLoading(true)
|
if (config.loading) useOverallStore().setLoading(true)
|
||||||
setTimeout(() => {
|
setTimeout(() => {
|
||||||
res({})
|
res({})
|
||||||
if (!config.loading) useOverallStore().setLoading(false)
|
if (config.loading) useOverallStore().setLoading(false)
|
||||||
}, 1000)
|
}, 1000)
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
@@ -24,6 +24,17 @@ const request = (config: any) => {
|
|||||||
* @param data.isRegenerated 是否重新生成 0-否,1-是
|
* @param data.isRegenerated 是否重新生成 0-否,1-是
|
||||||
*/
|
*/
|
||||||
export function generateTryOnEffect(data: Object) {
|
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({
|
return request({
|
||||||
url: '/api/try-on-effects/generate',
|
url: '/api/try-on-effects/generate',
|
||||||
method: 'post',
|
method: 'post',
|
||||||
@@ -38,10 +49,21 @@ export function generateTryOnEffect(data: Object) {
|
|||||||
* @param data.file 顾客照片文件
|
* @param data.file 顾客照片文件
|
||||||
*/
|
*/
|
||||||
export function uploadCustomerPhoto(data: FormData) {
|
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({
|
return request({
|
||||||
url: '/api/customer-photos/upload',
|
url: '/api/customer-photos/upload',
|
||||||
method: 'post',
|
method: 'post',
|
||||||
data,
|
data,
|
||||||
|
loading: true,
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
/**
|
/**
|
||||||
|
|||||||
@@ -16,14 +16,37 @@ export const useGenerateStore = defineStore({
|
|||||||
isLike: false,//是否喜欢
|
isLike: false,//是否喜欢
|
||||||
},
|
},
|
||||||
isGenerate: false,//点击继续按钮后是否需要生成
|
isGenerate: false,//点击继续按钮后是否需要生成
|
||||||
|
/** 顾客照片信息 */
|
||||||
|
photoInfo: {
|
||||||
|
id: "",
|
||||||
|
url: "",
|
||||||
|
file: null,
|
||||||
|
},
|
||||||
|
/** AI魔改信息 */
|
||||||
|
customizeInfo: {
|
||||||
|
inputText:"",
|
||||||
|
|
||||||
|
tryOnId: "",
|
||||||
|
tryOnUrl: "",
|
||||||
|
styleUrl: "",
|
||||||
|
isRegenerated: "",
|
||||||
|
isFavorite: false,
|
||||||
|
},
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
getters: {
|
getters: {
|
||||||
customerId: (state) => state.style.id,//顾客id
|
/** 顾客id */
|
||||||
visitRecordId: (state) => state.style.id,//进店记录id
|
customerId: (state) => state.style.id,
|
||||||
styleId: (state) => state.style.id,//服装id
|
/** 进店记录id */
|
||||||
modelPhotoId: (state) => state.model.id,//模特照片id
|
visitRecordId: (state) => state.style.id,
|
||||||
originalTryOnId: (state) => state.style.id,//原始试穿id
|
/** 服装id */
|
||||||
|
styleId: (state) => state.style.id,
|
||||||
|
/** 模特照片id */
|
||||||
|
modelPhotoId: (state) => state.model.id,
|
||||||
|
/** 原始试穿id */
|
||||||
|
originalTryOnId: (state) => state.style.id,
|
||||||
|
/** 顾客照片id */
|
||||||
|
customerPhotoId: (state) => state.photoInfo.id,
|
||||||
},
|
},
|
||||||
actions: {
|
actions: {
|
||||||
selectStyle(data: any) {
|
selectStyle(data: any) {
|
||||||
@@ -48,6 +71,21 @@ export const useGenerateStore = defineStore({
|
|||||||
},
|
},
|
||||||
setIsGenerate(isGenerate: boolean) {
|
setIsGenerate(isGenerate: boolean) {
|
||||||
this.isGenerate = isGenerate
|
this.isGenerate = isGenerate
|
||||||
}
|
},
|
||||||
|
/** 更新顾客照片信息 */
|
||||||
|
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 || ""
|
||||||
|
},
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
@@ -3,26 +3,30 @@
|
|||||||
import FooterNavigation from '@/components/FooterNavigation.vue'
|
import FooterNavigation from '@/components/FooterNavigation.vue'
|
||||||
import GenerateLoading from '@/views/asistant/components/GenerateLoading.vue'
|
import GenerateLoading from '@/views/asistant/components/GenerateLoading.vue'
|
||||||
import { ref, onMounted } from 'vue'
|
import { ref, onMounted } from 'vue'
|
||||||
import { generateTryOnEffect, setTryOnEffectFavorite, cancelTryOnEffectFavorite } from '@/api/workshop'
|
import {
|
||||||
|
generateTryOnEffect,
|
||||||
|
setTryOnEffectFavorite,
|
||||||
|
cancelTryOnEffectFavorite
|
||||||
|
} from '@/api/workshop'
|
||||||
const emit = defineEmits(['viewType'])
|
const emit = defineEmits(['viewType'])
|
||||||
import { useRouter } from 'vue-router'
|
import { useRouter } from 'vue-router'
|
||||||
import { useGenerateStore } from '@/stores'
|
import { useGenerateStore } from '@/stores'
|
||||||
const store = useGenerateStore()
|
const store = useGenerateStore()
|
||||||
|
|
||||||
|
const customizeInfo = store.customizeInfo
|
||||||
const router = useRouter()
|
const router = useRouter()
|
||||||
const inputText = ref('')
|
|
||||||
const isLoved = ref(false)
|
|
||||||
const loading = ref(false)
|
const loading = ref(false)
|
||||||
const onSend = () => {
|
const onSend = () => {
|
||||||
if (inputText.value === '') return
|
if (customizeInfo.inputText === '') return
|
||||||
generate();
|
generate()
|
||||||
const text = inputText.value
|
customizeInfo.inputText = ''
|
||||||
inputText.value = ''
|
// const text = inputText.value
|
||||||
console.log('发送消息:', text)
|
// inputText.value = ''
|
||||||
|
// console.log('发送消息:', text)
|
||||||
}
|
}
|
||||||
const onReload = () => {
|
const onReload = () => {
|
||||||
inputText.value = ''
|
customizeInfo.inputText = ''
|
||||||
generate(true);
|
generate(true)
|
||||||
}
|
}
|
||||||
|
|
||||||
// 生成结果
|
// 生成结果
|
||||||
@@ -32,33 +36,36 @@
|
|||||||
visitRecordId: store.visitRecordId,
|
visitRecordId: store.visitRecordId,
|
||||||
styleId: store.styleId,
|
styleId: store.styleId,
|
||||||
modelPhotoId: store.modelPhotoId,
|
modelPhotoId: store.modelPhotoId,
|
||||||
customerPhotoId: store.id,
|
customerPhotoId: store.customerPhotoId,
|
||||||
originalTryOnId: store.originalTryOnId,
|
originalTryOnId: store.originalTryOnId,
|
||||||
isRegenerated: isRegenerated ? 1 : 0,
|
isRegenerated: isRegenerated ? 1 : 0,
|
||||||
prompt: inputText.value,
|
prompt: customizeInfo.inputText
|
||||||
|
}
|
||||||
};
|
|
||||||
loading.value = true
|
loading.value = true
|
||||||
generateTryOnEffect(data)
|
generateTryOnEffect(data)
|
||||||
.then(res => {
|
.then((res) => {
|
||||||
console.log(res)
|
customizeInfo.tryOnId = res.tryOnId
|
||||||
|
customizeInfo.tryOnUrl = res.tryOnUrl
|
||||||
|
customizeInfo.styleUrl = res.styleUrl
|
||||||
|
customizeInfo.isRegenerated = res.isRegenerated
|
||||||
|
customizeInfo.isFavorite = !!res.isFavorite
|
||||||
loading.value = false
|
loading.value = false
|
||||||
})
|
})
|
||||||
.catch(err => {
|
.catch((err) => {
|
||||||
console.error(err)
|
console.error(err)
|
||||||
loading.value = false
|
loading.value = false
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
generate();
|
if (customizeInfo.tryOnId === '') generate()
|
||||||
|
|
||||||
// 喜欢
|
// 喜欢
|
||||||
const isLoveLoading = ref(false)
|
const isLoveLoading = ref(false)
|
||||||
const onLove = () => {
|
const onLove = () => {
|
||||||
if (isLoveLoading.value) return
|
if (isLoveLoading.value) return
|
||||||
const http = isLoved.value ? cancelTryOnEffectFavorite : setTryOnEffectFavorite
|
const http = customizeInfo.isFavorite ? cancelTryOnEffectFavorite : setTryOnEffectFavorite
|
||||||
|
customizeInfo.isFavorite = !customizeInfo.isFavorite
|
||||||
isLoveLoading.value = true
|
isLoveLoading.value = true
|
||||||
isLoved.value = !isLoved.value
|
http('tryOnId')
|
||||||
http("tryOnId")
|
|
||||||
.then(() => {
|
.then(() => {
|
||||||
isLoveLoading.value = false
|
isLoveLoading.value = false
|
||||||
})
|
})
|
||||||
@@ -89,21 +96,23 @@
|
|||||||
<div class="help">?</div>
|
<div class="help">?</div>
|
||||||
<input
|
<input
|
||||||
type="text"
|
type="text"
|
||||||
v-model="inputText"
|
v-model="customizeInfo.inputText"
|
||||||
@keyup.enter="onSend"
|
@keyup.enter="onSend"
|
||||||
placeholder="Try: “Change background to Tokyo City”"
|
placeholder="Try: “Change background to Tokyo City”"
|
||||||
/>
|
/>
|
||||||
<div class="send" @click="onSend"><SvgIcon name="send" size="48" /></div>
|
<div class="send" @click="onSend"><SvgIcon name="send" size="48" /></div>
|
||||||
</div>
|
</div>
|
||||||
<div class="card">
|
<div class="card">
|
||||||
<img src="@/assets/images/workshop/posture/posture_1.png" />
|
<img :src="customizeInfo.tryOnUrl" />
|
||||||
<!-- <div class="select-box">
|
<!-- <div class="select-box">
|
||||||
<div class="icon"><SvgIcon name="history" size="35" /></div>
|
<div class="icon"><SvgIcon name="history" size="35" /></div>
|
||||||
<div class="label">History</div>
|
<div class="label">History</div>
|
||||||
<div class="icon"><SvgIcon name="xialajiantou" size="29" /></div>
|
<div class="icon"><SvgIcon name="xialajiantou" size="29" /></div>
|
||||||
</div> -->
|
</div> -->
|
||||||
<div class="icons">
|
<div class="icons">
|
||||||
<div @click="onLove"><SvgIcon :name="`love_${isLoved ? 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="onReload"><SvgIcon name="reload" size="35" /></div>
|
||||||
<!-- <div @click="onDownload"><SvgIcon name="download" size="35" /></div> -->
|
<!-- <div @click="onDownload"><SvgIcon name="download" size="35" /></div> -->
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
@@ -3,6 +3,8 @@
|
|||||||
import FooterNavigation from '@/components/FooterNavigation.vue'
|
import FooterNavigation from '@/components/FooterNavigation.vue'
|
||||||
import { ref, onMounted } from 'vue'
|
import { ref, onMounted } from 'vue'
|
||||||
import { useRouter } from 'vue-router'
|
import { useRouter } from 'vue-router'
|
||||||
|
import { useGenerateStore } from '@/stores'
|
||||||
|
const generateStore = useGenerateStore()
|
||||||
const emit = defineEmits(['view-type'])
|
const emit = defineEmits(['view-type'])
|
||||||
onMounted(() => {
|
onMounted(() => {
|
||||||
emit('view-type', 1)
|
emit('view-type', 1)
|
||||||
@@ -11,10 +13,13 @@
|
|||||||
const faceUrl = ref('')
|
const faceUrl = ref('')
|
||||||
// 上传照片
|
// 上传照片
|
||||||
const handleUploadFace = () => {
|
const handleUploadFace = () => {
|
||||||
|
generateStore.updatePhotoInfo({})
|
||||||
router.push({ name: 'uploadFace2' })
|
router.push({ name: 'uploadFace2' })
|
||||||
}
|
}
|
||||||
// 完成上传
|
// 跳过上传
|
||||||
const handleFinish = () => {
|
const handleFinish = () => {
|
||||||
|
generateStore.updatePhotoInfo({})
|
||||||
|
generateStore.clearCustomizeInfo({})
|
||||||
router.push({ name: 'customize' })
|
router.push({ name: 'customize' })
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
@@ -71,7 +76,7 @@
|
|||||||
line-height: 132%;
|
line-height: 132%;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
>.btns {
|
> .btns {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
display: flex;
|
display: flex;
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
|
|||||||
@@ -4,27 +4,27 @@
|
|||||||
import { ref, reactive, onMounted } from 'vue'
|
import { ref, reactive, onMounted } from 'vue'
|
||||||
import { useRouter } from 'vue-router'
|
import { useRouter } from 'vue-router'
|
||||||
import { uploadCustomerPhoto } from '@/api/workshop'
|
import { uploadCustomerPhoto } from '@/api/workshop'
|
||||||
|
import { useGenerateStore } from '@/stores'
|
||||||
|
const generateStore = useGenerateStore()
|
||||||
|
|
||||||
const emit = defineEmits(['view-type'])
|
const emit = defineEmits(['view-type'])
|
||||||
onMounted(() => {
|
onMounted(() => {
|
||||||
emit('view-type', 1)
|
emit('view-type', 1)
|
||||||
})
|
})
|
||||||
const router = useRouter()
|
const router = useRouter()
|
||||||
const fileData = reactive({
|
const fileData = generateStore.photoInfo
|
||||||
url:"",
|
|
||||||
file: null,
|
|
||||||
});
|
|
||||||
console.log(fileData)
|
|
||||||
// 上传照片
|
// 上传照片
|
||||||
const handleUploadFace = () => {
|
const handleUploadFace = () => {
|
||||||
const input = document.createElement('input')
|
const input = document.createElement('input')
|
||||||
input.type = 'file'
|
input.type = 'file'
|
||||||
input.accept = 'image/*'
|
input.accept = 'image/*'
|
||||||
input.capture = 'camera'
|
// input.capture = 'camera'
|
||||||
input.click()
|
input.click()
|
||||||
input.onchange = (e: any) => {
|
input.onchange = (e: any) => {
|
||||||
const file = e.target.files[0]
|
const file = e.target.files[0]
|
||||||
if (!file) return
|
if (!file) return
|
||||||
const url = URL.createObjectURL(file)
|
const url = URL.createObjectURL(file)
|
||||||
|
fileData.id = ''
|
||||||
fileData.url = url
|
fileData.url = url
|
||||||
fileData.file = file
|
fileData.file = file
|
||||||
// const reader = new FileReader()
|
// const reader = new FileReader()
|
||||||
@@ -36,14 +36,15 @@
|
|||||||
}
|
}
|
||||||
// 生成照片
|
// 生成照片
|
||||||
const handleGenerate = () => {
|
const handleGenerate = () => {
|
||||||
|
if (fileData.id) return router.push({ name: 'customize' })
|
||||||
if (!fileData.file) return
|
if (!fileData.file) return
|
||||||
const formData = new FormData()
|
const formData = new FormData()
|
||||||
formData.append('customerId', "1")
|
formData.append('customerId', '1')
|
||||||
formData.append('visitRecordId', "1")
|
formData.append('visitRecordId', '1')
|
||||||
formData.append('file', fileData.file)
|
formData.append('file', fileData.file)
|
||||||
uploadCustomerPhoto(formData).then(res => {
|
uploadCustomerPhoto(formData).then((res) => {
|
||||||
console.log(res, res.photoUrl)
|
generateStore.updatePhotoInfo(res)
|
||||||
|
generateStore.clearCustomizeInfo({})
|
||||||
router.push({ name: 'customize' })
|
router.push({ name: 'customize' })
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
|||||||
Reference in New Issue
Block a user