aidlab/aida_front
7
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

对印花添加马赛克背景

Browse Source
This commit is contained in:
X1627315083
2025-12-31 11:11:40 +08:00
parent e09c01cb7d
commit bb53b6e486
2 changed files with 18 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
src/component/HomePage/Generate.vue
View File

@@ -286,7 +286,8 @@
@click="generageAdd(item)" @click="generageAdd(item)"
:class="[ :class="[
item.status != 'Success' ? 'hideEvents' : '', item.status != 'Success' ? 'hideEvents' : '',
item?.checked ? 'active' : '' item?.checked ? 'active' : '',
(type_.type2 == 'Printboard' && item?.imgUrl)? 'maskBg' : ''
]" ]"
> >
<img v-if="item?.imgUrl" v-lazy="item.imgUrl" @click.stop="generageAdd(item)" /> <img v-if="item?.imgUrl" v-lazy="item.imgUrl" @click.stop="generageAdd(item)" />
@@ -1359,6 +1360,10 @@ export default defineComponent({
width: calc(25% - 2rem); width: calc(25% - 2rem);
aspect-ratio: 1 / 1; aspect-ratio: 1 / 1;
position: relative; position: relative;
&.maskBg{
background-image: url("data:image/svg+xml,%3Csvg width='40' height='40' viewBox='0 0 40 40' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='%23666' fill-opacity='0.4'%3E%3Crect x='20' width='20' height='20'/%3E%3Crect y='20' width='20' height='20'/%3E%3C/g%3E%3C/svg%3E");
background-size: 2rem 2rem; /* 调整图案密度 */
}
&.active { &.active {
opacity: 0.5; opacity: 0.5;
// border: 2px solid; // border: 2px solid;
@@ -1387,6 +1392,7 @@ export default defineComponent({
width: 100%; width: 100%;
height: 100%; height: 100%;
object-fit: contain; object-fit: contain;
} }
&:hover .delete_like_file_block { &:hover .delete_like_file_block {
// display: block; // display: block;

16
src/views/HomeView/library.vue
View File

@@ -466,7 +466,7 @@
<div class="content_body_table scroll_style"> <div class="content_body_table scroll_style">
<div class="content_img_item" v-for="(img,index) in generateList[selectCode]" :key="img.id" :class="[img.status != 'Success'?'hideEvents':'']" <div class="content_img_item" v-for="(img,index) in generateList[selectCode]" :key="img.id" :class="[img.status != 'Success'?'hideEvents':'']"
:draggable="!isGenerate[selectCode]" @dragstart="startDrag($event,index)" @dragover.prevent @drop="drop($event,index)"> :draggable="!isGenerate[selectCode]" @dragstart="startDrag($event,index)" @dragover.prevent @drop="drop($event,index)">
<div :class="['content_img_item_block', selectImgList.indexOf(img.id) > -1 ? 'select_item_img' :'']"> <div :class="['content_img_item_block', selectImgList.indexOf(img.id) > -1 ? 'select_item_img' :'',(selectCode == 'Printboard' && img?.imgUrl)?'maskBg':'']">
<!-- <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="@/assets/images/homePage/loading.gif" alt=""> -->
<img v-if="img?.imgUrl" :class="['content_img', ['Moodboard','Printboard'].indexOf(selectCode) > -1 ? 'board_content_img' :'']" v-lazy="img.imgUrl"> <img v-if="img?.imgUrl" :class="['content_img', ['Moodboard','Printboard'].indexOf(selectCode) > -1 ? 'board_content_img' :'']" v-lazy="img.imgUrl">
@@ -1707,10 +1707,12 @@ export default defineComponent({
base64 = this.selectGenerateList[0].imgUrl base64 = this.selectGenerateList[0].imgUrl
} }
}else{ }else{
if (this.selectGenerateList?.[0]?.imgUrl) { if (!this.captionGeneration) {
} else { if (this.selectGenerateList?.[0]?.imgUrl) {
message.info(this.t('Generate.jsContent5')) } else {
return message.info(this.t('Generate.jsContent5'))
return
}
} }
} }
@@ -2392,6 +2394,10 @@ export default defineComponent({
position: relative; position: relative;
cursor: pointer; cursor: pointer;
background: #fff; background: #fff;
&.maskBg{
background-image: url("data:image/svg+xml,%3Csvg width='40' height='40' viewBox='0 0 40 40' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='%23666' fill-opacity='0.4'%3E%3Crect x='20' width='20' height='20'/%3E%3Crect y='20' width='20' height='20'/%3E%3C/g%3E%3C/svg%3E");
background-size: 2rem 2rem; /* 调整图案密度 */
}
&.select_item_img{ &.select_item_img{
// border-color: #000; // border-color: #000;
opacity: 0.5; opacity: 0.5;