调整library的generate生成交互

This commit is contained in:
X1627315083
2024-04-25 17:16:16 +08:00
parent 9f02f1245e
commit 2c08adbfbe
2 changed files with 44 additions and 32 deletions

View File

@@ -213,7 +213,12 @@
@keydown.enter="getgenerate" :readonly="checkbox[0].type && selectCode != 'Moodboard'"
:placeholder="$t('LibraryPage.inputContent2')"
v-model="captionGeneration">
<div class="generage_btn started_btn" @click.stop="getgenerate">{{ $t('LibraryPage.Generate') }}</div>
<div class="generage_btn started_btn" @click.stop="getgenerate">
<!-- <div v-show="!isGenerate">{{ $t('LibraryPage.Generate') }}</div> -->
<i class="fi fi-br-loading"></i>
<!-- <div v-show="isGenerate"><a-spin size="large" /></div> -->
</div>
<span ref="inputShowText"></span>
</div>
</div>
@@ -278,12 +283,12 @@
</div>
<div class="content_body_table scroll_style">
<div class="content_img_item" v-for="(img,index) in generateList" :key="img.id">
<div class="content_img_item" v-for="(img,index) in generateList[selectCode]" :key="img.id">
<div :class="['content_img_item_block', selectImgList.indexOf(img.id) > -1 ? 'select_item_img' :'']">
<img v-show="img.status != 'Success'" :class="['content_img', ['Moodboard','Printboard'].indexOf(selectCode) > -1 ? 'board_content_img' :'']" src="@/assets/images/homePage/loading.gif" alt="">
<img v-show="img.status == 'Success'" :class="['content_img', ['Moodboard','Printboard'].indexOf(selectCode) > -1 ? 'board_content_img' :'']" :src="img.imgUrl">
<div class="img_item_hover">
<div v-show="img.status == 'Success'" class="img_item_hover">
<div class="img_operate_content">
<div class="img_operate_block">
<i v-if="!img.like" class="fi fi-rr-heart operate_icon" @click.stop="likeFile(img,'like')"></i>
@@ -296,17 +301,13 @@
</div>
</div>
</div>
<sketchCategory v-show="selectCode == 'Sketchboard'" :disignTypeList="disignTypeList" :generateList="generateList" :item="img"></sketchCategory>
<sketchCategory v-show="selectCode == 'Sketchboard'" :disignTypeList="disignTypeList" :generateList="generateList['Sketchboard']" :item="img"></sketchCategory>
</div>
<div class="content_img_name"></div>
</div>
<div class="no_data_block" v-show="!generateList.length && !isShowMark">
<div class="no_data_block" v-show="!generateList[selectCode].length && !isShowMark">
<img src="@/assets/images/homePage/null_img.png">
</div>
</div>
<div class="table_pagination" v-show="generateList.length">
</div>
</div>
</div>
@@ -415,8 +416,12 @@ export default defineComponent({
let generateCheckbox:any = ref()
let captionGeneration:any = ref()
let inputTime = ref()
let generateList:any = ref([
])
let generateList:any = ref({
Sketchboard:[],
Moodboard:[],
Printboard:[]
})
let selectGenerateList:any = ref([])
let printModel = ref({
num:1,
@@ -628,7 +633,11 @@ export default defineComponent({
this.uploadGenerate = 'Upload'
this.captionGeneration = ''
this.selectGenerateList = []
this.generateList = []
// this.generateList = {
// 'Sketchboard':[],
// 'Moodboard':[],
// 'Printboard':[]
// }
this.inputShow = false
}
this.upload.level1Type = menu.code
@@ -1054,7 +1063,7 @@ export default defineComponent({
// );
// return
// }
if(this.isShowMark){
if(this.isGenerate){
return
}
let arr = ["Painting Style","Illustration Style","Real Style"]
@@ -1078,7 +1087,7 @@ export default defineComponent({
}
if(generateType == 'image'){
if(generageImg?.id){
data.text = ''
data.text = arr[this.printModel.num-1]
}else{
message.info(
this.t('LibraryPage.jsContent9')
@@ -1129,7 +1138,7 @@ export default defineComponent({
return
}
}
this.isShowMark = true
// this.isShowMark = true
this.isGenerate = true
Https.axiosPost(Https.httpUrls.generatePrepare, data).then(
(rv) => {
@@ -1147,7 +1156,7 @@ export default defineComponent({
}else if(rv.leftUsageCount == 0){
message.warning(this.t('Generate.jsContent9',{str:str}));
this.isGenerate = false
this.isShowMark = false
// this.isShowMark = false
return
}
}
@@ -1155,7 +1164,7 @@ export default defineComponent({
let arr:any = {}
arr.taskId = item
arr.status = 'execution'
this.generateList.unshift(arr)
this.generateList[this.selectCode].unshift(arr)
});
this.setGenerate()
this.remGenerateTime = setTimeout(()=>{
@@ -1163,23 +1172,23 @@ export default defineComponent({
},10000)
}
).catch(res=>{
this.isShowMark = false
// this.isShowMark = false
this.isGenerate = false
});
},
setGenerate(){
this.generateTime = setInterval(()=>{
let data = this.generateList.filter((item:any)=>item.status != 'Success').map((obj:any) => obj.taskId);
let data = this.generateList[this.selectCode].filter((item:any)=>item.status != 'Success').map((obj:any) => obj.taskId);
Https.axiosPost(Https.httpUrls.generateResult, data).then(
(rv) => {
if(this.isShowMark){//防止取消后有正在执行的获取状态
if(this.isGenerate){//防止取消后有正在执行的获取状态
let arr:any = []
arr = rv.filter((item:any)=>item.status != 'Success' && item.status != 'Fail' && item.status != 'Invalid')
rv.forEach((element:any) => {
this.generateList.forEach((item:any,index:any) => {
this.generateList[this.selectCode].forEach((item:any,index:any) => {
if(item.taskId == element.taskId && element.status == 'Success'){
element.imgUrl = element.url
this.generateList[index] = element
this.generateList[this.selectCode][index] = element
if(element.category){
this.disignTypeList.forEach((itemCategory:any) => {
if(itemCategory.value == element.category){
@@ -1196,28 +1205,28 @@ export default defineComponent({
message.info(this.t('Generate.effectPoor'));
}
if(arr.length == 0){
this.generateList = this.generateList.filter((item:any)=>item.status == 'Success')
this.generateList[this.selectCode] = this.generateList[this.selectCode].filter((item:any)=>item.status == 'Success')
clearInterval(this.generateTime)
clearInterval(this.remGenerateTime)
this.isShowMark = false
// this.isShowMark = false
this.remGenerate = false
this.isGenerate = false
}
}
}
).catch(res=>{
this.generateList = this.generateList.filter((item:any)=>item.status == 'Success')
this.generateList[this.selectCode] = this.generateList[this.selectCode].filter((item:any)=>item.status == 'Success')
clearInterval(this.generateTime)
clearInterval(this.remGenerateTime)
this.isShowMark = false
// this.isShowMark = false
this.isGenerate = false
});
},1000)
},
removeGenerate(){
let arr = this.generateList.filter((item:any)=>item.status != 'Success')
this.generateList = this.generateList.filter((item:any)=>item.status == 'Success')
this.isShowMark = false
let arr = this.generateList[this.selectCode].filter((item:any)=>item.status != 'Success')
this.generateList[this.selectCode] = this.generateList[this.selectCode].filter((item:any)=>item.status == 'Success')
// this.isShowMark = false
this.isGenerate = false
this.remGenerate = false
clearInterval(this.generateTime)
@@ -1315,7 +1324,7 @@ export default defineComponent({
scaleImage(index:any){
let scaleImage:any = this.$refs.scaleImage
scaleImage.scaleImageMask = true
scaleImage.init(this.generateList,index)
scaleImage.init(this.generateList[this.selectCode],index)
},
}
})
@@ -1635,7 +1644,10 @@ export default defineComponent({
cursor: no-drop;
}
}
.fi-br-loading{
animation: whirl 1s infinite linear;
}
.generage_btn{
margin: 0 3rem;
}