fix: moodboard generate不显示上传图片

This commit is contained in:
zhangyh
2025-10-02 11:45:00 +08:00
parent 627c535774
commit ee8c0fb355

View File

@@ -1,23 +1,32 @@
<template> <template>
<div class="generate"> <div class="generate">
<div class="generate_checkbox" > <div class="generate_checkbox">
<generalMenu v-if="type_.type2 == 'Printboard' || type_.type2 == 'Sketchboard'" :dataList="printCatecoryList" @setprintModel="setCatecorySceneList" :item="scene" width="14rem" style="padding: 0;"></generalMenu> <generalMenu
<generalMenu v-if="(type_.type2 == 'Printboard' && scene.value == 'Pattern')" :dataList="printModelList" @setprintModel="setprintModel" :item="printModel"></generalMenu> v-if="type_.type2 == 'Printboard' || type_.type2 == 'Sketchboard'"
:dataList="printCatecoryList"
@setprintModel="setCatecorySceneList"
:item="scene"
width="14rem"
style="padding: 0"
></generalMenu>
<generalMenu
v-if="type_.type2 == 'Printboard' && scene.value == 'Pattern'"
:dataList="printModelList"
@setprintModel="setprintModel"
:item="printModel"
></generalMenu>
</div> </div>
<div class="input_border" > <div class="input_border">
<div class="input_box Guide_1_5" :class="[inputShow?'active':'',]"> <div class="input_box Guide_1_5" :class="[inputShow ? 'active' : '']">
<div class="input_box_btnBox" v-if="scene?.value != 'extract'"> <div class="input_box_btnBox" v-if="scene?.value != 'extract'">
<div class="upload_item" v-show="sketchboardList?.length != 0"> <div class="upload_item" v-show="sketchboardList?.length != 0">
<div <div
class="upload_file_item Guide_1_2_7" class="upload_file_item Guide_1_2_7"
v-for="(file, index) in sketchboardList" v-for="(file, index) in sketchboardList"
:key="file" :key="file"
:class="[driver__.driver?'showEvents':'']" :class="[driver__.driver ? 'showEvents' : '']"
>
<div
class="upload_file_item_content"
v-show="file?.status === 'uploading'"
> >
<div class="upload_file_item_content" v-show="file?.status === 'uploading'">
<a-spin size="small" :indicator="indicator" tip="Uploading..." /> <a-spin size="small" :indicator="indicator" tip="Uploading..." />
</div> </div>
<div <div
@@ -25,14 +34,29 @@
v-show="file?.status === 'done' || file?.base64" v-show="file?.status === 'done' || file?.base64"
> >
<img :src="file?.imgUrl" class="upload_img" /> <img :src="file?.imgUrl" class="upload_img" />
<div class="delete_like_file_block" :class="[driver__.driver?'hideEvents':'']"> <div
<span class="icon iconfont icon-shanchu operate_icon" @click.stop="deleteFile(index)"></span> class="delete_like_file_block"
:class="[driver__.driver ? 'hideEvents' : '']"
>
<span
class="icon iconfont icon-shanchu operate_icon"
@click.stop="deleteFile(index)"
></span>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
<a-dropdown> <a-dropdown>
<i class="fi fi-br-upload" :class="{ Guide_1_2_6:type_.type2 == 'Printboard'}"></i> <i
class="fi fi-br-upload"
:class="{ Guide_1_2_6: type_.type2 == 'Printboard' }"
v-show="
!isTextarea &&
upload.level1Type !== 'Moodboard' &&
scene?.value != 'Slogan' &&
scene?.value != 'Logo'
"
></i>
<template #overlay> <template #overlay>
<a-menu> <a-menu>
<a-menu-item> <a-menu-item>
@@ -58,7 +82,9 @@
class="upload-icon icon" class="upload-icon icon"
style="font-size: 2rem" style="font-size: 2rem"
/> />
<div style="font-size: 1.2rem;">{{ $t('PrintboardUpload.Upload') }}</div> <div style="font-size: 1.2rem">
{{ $t('PrintboardUpload.Upload') }}
</div>
</div> </div>
</a-upload> </a-upload>
</a-menu-item> </a-menu-item>
@@ -66,7 +92,9 @@
<div class="drop-container" @click.stop="handleOpenLibrarySelect"> <div class="drop-container" @click.stop="handleOpenLibrarySelect">
<i class="fi fi-rr-followcollection library-icon icon"></i> <i class="fi fi-rr-followcollection library-icon icon"></i>
<div style="font-size: 1.2rem;">{{ $t('PrintboardUpload.Library') }}</div> <div style="font-size: 1.2rem">
{{ $t('PrintboardUpload.Library') }}
</div>
</div> </div>
</a-menu-item> </a-menu-item>
</a-menu> </a-menu>
@@ -75,8 +103,12 @@
<textarea <textarea
class="textarea" class="textarea"
@input="ifMaximumLength" @input="ifMaximumLength"
:placeholder="(scene?.value == 'Slogan' && type_.type2 == 'Printboard')?isSloganHint:$t('Generate.inputContent1')" :placeholder="
:maxlength='inputShow?0:9999' scene?.value == 'Slogan' && type_.type2 == 'Printboard'
? isSloganHint
: $t('Generate.inputContent1')
"
:maxlength="inputShow ? 0 : 9999"
@keydown.enter.prevent="getgenerate()" @keydown.enter.prevent="getgenerate()"
@click="inputFocus()" @click="inputFocus()"
v-model="searchPictureName" v-model="searchPictureName"
@@ -356,46 +388,41 @@ export default defineComponent({
sketchCategory, sketchCategory,
SelectImages SelectImages
}, },
props: ["msg",'sketchCatecoryList','gender'], props: ['msg', 'sketchCatecoryList', 'gender'],
emits:['setLibrary'], emits: ['setLibrary'],
setup(props) { setup(props) {
// console.log(prop.msg); // console.log(prop.msg);
let userDetail:any= computed(()=>{ let userDetail: any = computed(() => {
return store.state.UserHabit.userDetail return store.state.UserHabit.userDetail
}) })
const instance = getCurrentInstance() const instance = getCurrentInstance()
let printModelList:any = ref([]) let printModelList: any = ref([])
let sketchStyleList:any = ref([]) let sketchStyleList: any = ref([])
let printModel:any = ref({ let printModel: any = ref({
num:'', num: '',
id:'', id: '',
optype:false, optype: false,
value:'Painting Style', value: 'Painting Style',
label:useI18n().t('Generate.Model1') label: useI18n().t('Generate.Model1')
}) })
let printCatecoryList: any = computed(() => {
let printCatecoryList:any = computed(()=>{ if (props.msg == 'Sketchboard') {
if(props.msg == 'Sketchboard'){
return store.state.UserHabit.SketchGenerateType return store.state.UserHabit.SketchGenerateType
}else if(props.msg == 'Printboard'){ } else if (props.msg == 'Printboard') {
return store.state.UserHabit.printType return store.state.UserHabit.printType
} }
}) })
let searchPictureName = ref('')
let searchPictureName = ref(""); let searchPictureSeed: any = ref(0)
let searchPictureSeed:any = ref(0); let store = useStore()
let store = useStore(); let fileList: any = ref([])
let fileList: any = ref([ let scene = ref({})
let sketchboardList: any = ref([])
]); const setCatecorySceneList = (data: any) => {
let scene = ref({ if (scene.value.value === data.value) return
})
let sketchboardList:any = ref([])
const setCatecorySceneList = (data:any)=>{
if(scene.value.value === data.value) return
scene.value = data scene.value = data
sketchboardList.value = [] sketchboardList.value = []
searchPictureName.value = '' searchPictureName.value = ''
@@ -404,85 +431,88 @@ export default defineComponent({
// let printBoards:any = computed(()=>{return store.state.UploadFilesModule.printboard}) // let printBoards:any = computed(()=>{return store.state.UploadFilesModule.printboard})
// let moodboarList:any = computed(()=>{return store.state.UploadFilesModule.moodboard}) // let moodboarList:any = computed(()=>{return store.state.UploadFilesModule.moodboard})
// let sketchCatecoryList:any = ref([]) // let sketchCatecoryList:any = ref([])
let workspace:any = computed(()=>{ let workspace: any = computed(() => {
return store.state.Workspace.probjects return store.state.Workspace.probjects
}) })
let upload = ref({ let upload = ref({
isPin: 0, isPin: 0,
level1Type: props.msg, level1Type: props.msg,
ageGroup:workspace.ageGroup, ageGroup: workspace.ageGroup,
gender: props.gender, gender: props.gender,
timeZone: Intl.DateTimeFormat().resolvedOptions().timeZone, timeZone: Intl.DateTimeFormat().resolvedOptions().timeZone
}) })
let isGenerate = ref(false)//判断是否正在进行generate let isGenerate = ref(false) //判断是否正在进行generate
let inputShow = ref(false)//表示是否出现红框 let inputShow = ref(false) //表示是否出现红框
let inputTime = ref() let inputTime = ref()
let driver__:any = inject('driver__') let driver__: any = inject('driver__')
let {t} = useI18n() let { t } = useI18n()
let isTest = ref() let isTest = ref()
let generateTime:any = ref() let generateTime: any = ref()
let generateProceedList:any = ref([]) let generateProceedList: any = ref([])
let remGenerate:any = ref(false) let remGenerate: any = ref(false)
let remGenerateTime:any = ref() let remGenerateTime: any = ref()
let styleRecommend:any = [] let styleRecommend: any = []
// let styleRecommend:any = inject('styleRecommend') // let styleRecommend:any = inject('styleRecommend')
let generateLevel2Type = '' let generateLevel2Type = ''
let isSloganHint:any = ref(' ') let isSloganHint: any = ref(' ')
let loadingShow =ref(false) let loadingShow = ref(false)
let speed = reactive({ let speed = reactive({
speedList:[ speedList: [
{ {
title:'', title: '',
label:t('speedList.generateWx'), label: t('speedList.generateWx'),
value:'advanced', value: 'advanced'
},{
title:'',
label:t('speedList.toproductFlus'),
value:'high',
},{
title:'',
label:t('speedList.generateNormal'),
value:'normal',
}, },
{
title: '',
label: t('speedList.toproductFlus'),
value: 'high'
},
{
title: '',
label: t('speedList.generateNormal'),
value: 'normal'
}
// { // {
// title:'', // title:'',
// label:t('speedList.generateFlux'), // label:t('speedList.generateFlux'),
// value:'flux', // value:'flux',
// }, // },
], ],
extractList:[ extractList: [
{ {
title:'', title: '',
label:t('speedList.generateFlux'), label: t('speedList.generateFlux'),
value:'flux', value: 'flux'
}, }
], ],
speedState:false, speedState: false,
speedData:{ speedData: {
title:'', title: '',
label:t('speedList.generateWx'), label: t('speedList.generateWx'),
value:'advanced', value: 'advanced'
}, }
}) })
const openSpeed = ()=>{ const openSpeed = () => {
if(speed.speedState){ if (speed.speedState) {
removeOpenSpeed() removeOpenSpeed()
}else{ } else {
instance.appContext.config.globalProperties.$dropdownEvents.closeAll() instance.appContext.config.globalProperties.$dropdownEvents.closeAll()
speed.speedState = true speed.speedState = true
} }
} }
const removeOpenSpeed = ()=>{ const removeOpenSpeed = () => {
speed.speedState = false speed.speedState = false
} }
watch(()=>scene.value,(newVal,oldVal)=>{ watch(
if(newVal.value == 'extract'){ () => scene.value,
(newVal, oldVal) => {
if (newVal.value == 'extract') {
speed.speedData = speed.extractList[0] speed.speedData = speed.extractList[0]
}else if(newVal.value == 'Logo' || newVal.value == 'Slogan'){ } else if (newVal.value == 'Logo' || newVal.value == 'Slogan') {
speed.speedData.value = '' speed.speedData.value = ''
speed.speedData.label = '' speed.speedData.label = ''
}else{ } else {
// if(newVal.value == "Pattern" || props.msg == 'Sketchboard'){ // if(newVal.value == "Pattern" || props.msg == 'Sketchboard'){
// speed.speedData = speed.speedList[1] // speed.speedData = speed.speedList[1]
// }else{ // }else{
@@ -490,20 +520,21 @@ export default defineComponent({
// } // }
speed.speedData = speed.speedList[0] speed.speedData = speed.speedList[0]
} }
}) }
const setSpeed = (item:any)=>{ )
const setSpeed = (item: any) => {
speed.speedData = item speed.speedData = item
} }
onMounted(() => { onMounted(() => {
if(props.msg == 'Sketchboard'){ if (props.msg == 'Sketchboard') {
scene.value = { scene.value = {
name: t('SketchboardUpload.GenerateSketch'), name: t('SketchboardUpload.GenerateSketch'),
value:'generate' value: 'generate'
} }
}else if(props.msg == 'Printboard'){ } else if (props.msg == 'Printboard') {
scene.value = { scene.value = {
name: t('SketchboardUpload.GenerateSketch'), name: t('SketchboardUpload.GenerateSketch'),
value:'Pattern' value: 'Pattern'
} }
} }
instance.appContext.config.globalProperties.$dropdownEvents.onClose(removeOpenSpeed) instance.appContext.config.globalProperties.$dropdownEvents.onClose(removeOpenSpeed)
@@ -513,7 +544,9 @@ export default defineComponent({
}) })
onUnmounted(() => { onUnmounted(() => {
instance.appContext.config.globalProperties.$dropdownEvents.offClose(removeOpenSpeed) instance.appContext.config.globalProperties.$dropdownEvents.offClose(
removeOpenSpeed
)
}) })
return { return {
userDetail, userDetail,
@@ -552,28 +585,28 @@ export default defineComponent({
setSpeed, setSpeed,
upload, upload,
Https, Https,
setCatecorySceneList, setCatecorySceneList
}; }
}, },
data(prop) { data(prop) {
return { return {
indicator: h(LoadingOutlined, { indicator: h(LoadingOutlined, {
style: { style: {
fontSize: "2.4rem", fontSize: '2.4rem'
}, },
spin: true, spin: true
}), }),
token: "", token: '',
uploadUrl: "", uploadUrl: '',
type_: { type_: {
type1: "generate", type1: 'generate',
type2: prop.msg, type2: prop.msg
}, },
isTextarea:false, isTextarea: false,
isInputFocus:false, isInputFocus: false
}; }
}, },
mounted() { mounted() {
@@ -583,63 +616,76 @@ export default defineComponent({
// item.id_ = GO.id++ // item.id_ = GO.id++
// }) // })
// this.store.commit("addGenerateFils", this.fileList); // this.store.commit("addGenerateFils", this.fileList);
this.token = getCookie("token") || ""; this.token = getCookie('token') || ''
let isTest:any = getCookie('isTest') let isTest: any = getCookie('isTest')
this.isTest =JSON.parse(isTest) this.isTest = JSON.parse(isTest)
this.uploadUrl = getUploadUrl(); this.uploadUrl = getUploadUrl()
// if() // if()
if(this.type_.type2 == 'Printboard'){ if (this.type_.type2 == 'Printboard') {
this.printModelList = [ this.printModelList = [
{ {
num:1, num: 1,
optype:false, optype: false,
value:'Painting Style', value: 'Painting Style',
label:useI18n().t('Generate.Model1') label: useI18n().t('Generate.Model1')
},{
num:2,
optype:false,
value:'Illustration Style',
label:useI18n().t('Generate.Model2')
},{
num:3,
optype:false,
value:'Real Style',
label:useI18n().t('Generate.Model3')
}, },
{
num: 2,
optype: false,
value: 'Illustration Style',
label: useI18n().t('Generate.Model2')
},
{
num: 3,
optype: false,
value: 'Real Style',
label: useI18n().t('Generate.Model3')
}
] ]
}else if(this.type_.type2 == 'Sketchboard'){ } else if (this.type_.type2 == 'Sketchboard') {
this.printModelList = JSON.parse(JSON.stringify(this.store.state.UserHabit.SketchStyle)) this.printModelList = JSON.parse(
let imgList = ['/image/sketch/sketch-thick.jpg','/image/sketch/sketch-medium.jpg','/image/sketch/sketch-fine.jpg'] JSON.stringify(this.store.state.UserHabit.SketchStyle)
this.printModelList.forEach((item:any,index:number)=>{ )
let imgList = [
'/image/sketch/sketch-thick.jpg',
'/image/sketch/sketch-medium.jpg',
'/image/sketch/sketch-fine.jpg'
]
this.printModelList.forEach((item: any, index: number) => {
item.img = imgList[index] item.img = imgList[index]
}) })
if(this.printModelList[3])this.printModelList[3].img = -1 if (this.printModelList[3]) this.printModelList[3].img = -1
} }
this.printModel = this.printModelList[0] this.printModel = this.printModelList[0]
}, },
watch:{ watch: {
driver__:{ driver__: {
handler(newVal,oldVal){ handler(newVal, oldVal) {
if(this.type_.type2 == 'Printboard'){ if (this.type_.type2 == 'Printboard') {
if(newVal.index >= 14 && newVal.index < 15){ if (newVal.index >= 14 && newVal.index < 15) {
}else{ } else {
} }
}else if(this.type_.type2 == 'Sketchboard'){ } else if (this.type_.type2 == 'Sketchboard') {
} }
} }
}, },
scene:{ scene: {
handler(newVal,oldVal){ handler(newVal, oldVal) {
if(this.type_.type2 == 'Printboard' && newVal.value == 'Slogan'){ if (this.type_.type2 == 'Printboard' && newVal.value == 'Slogan') {
let sloganType = [this.t('Generate.BlueYelStarryNight'),this.t('Generate.GreenCthulhu'),this.t('Generate.RedYelFireStyle'),this.t('Generate.CyberpunkStyle'),this.t('Generate.CitySkyline'),this.t('Generate.RedMaple'),this.t('Generate.GoldSunflower'),this.t('Generate.EmrldJungle'),this.t('Generate.PinkSakura')] let sloganType = [
var randomNumber = Math.floor(Math.random() * sloganType.length); this.t('Generate.BlueYelStarryNight'),
this.t('Generate.GreenCthulhu'),
this.t('Generate.RedYelFireStyle'),
this.t('Generate.CyberpunkStyle'),
this.t('Generate.CitySkyline'),
this.t('Generate.RedMaple'),
this.t('Generate.GoldSunflower'),
this.t('Generate.EmrldJungle'),
this.t('Generate.PinkSakura')
]
var randomNumber = Math.floor(Math.random() * sloganType.length)
this.isSloganHint = sloganType[randomNumber] this.isSloganHint = sloganType[randomNumber]
}else{ } else {
this.isSloganHint = '' this.isSloganHint = ''
} }
} }
@@ -659,15 +705,15 @@ export default defineComponent({
computed: { computed: {
getSketchLabel(value: any) { getSketchLabel(value: any) {
return (value: any) => { return (value: any) => {
let lable = ""; let lable = ''
for (let item of this.sketchCatecoryList) { for (let item of this.sketchCatecoryList) {
if (item.value === value) { if (item.value === value) {
lable = item.label; lable = item.label
break; break
} }
} }
return lable; return lable
}; }
} }
}, },
methods: { methods: {