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