对印花添加马赛克背景

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

View File

@@ -286,7 +286,8 @@
@click="generageAdd(item)"
:class="[
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)" />
@@ -1359,6 +1360,10 @@ export default defineComponent({
width: calc(25% - 2rem);
aspect-ratio: 1 / 1;
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 {
opacity: 0.5;
// border: 2px solid;
@@ -1387,6 +1392,7 @@ export default defineComponent({
width: 100%;
height: 100%;
object-fit: contain;
}
&:hover .delete_like_file_block {
// display: block;

View File

@@ -466,7 +466,7 @@
<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':'']"
: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-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
}
}else{
if (this.selectGenerateList?.[0]?.imgUrl) {
} else {
message.info(this.t('Generate.jsContent5'))
return
if (!this.captionGeneration) {
if (this.selectGenerateList?.[0]?.imgUrl) {
} else {
message.info(this.t('Generate.jsContent5'))
return
}
}
}
@@ -2392,6 +2394,10 @@ export default defineComponent({
position: relative;
cursor: pointer;
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{
// border-color: #000;
opacity: 0.5;