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

fix

Browse Source
This commit is contained in:
X1627315083
2025-04-09 14:09:19 +08:00
parent b6e5f05f06
commit 37f1b36e54
76 changed files with 1969 additions and 970 deletions
Download Patch File Download Diff File Expand all files Collapse all files

175
src/component/HomePage/index/model/toProduct/index.vue
View File

@@ -10,62 +10,8 @@
<!-- <div class="productImg_content_item_title productImg_content_item_title_menu">
<generalMenu class="productImg_content_item_title_menubtn" :class="{hideEvents:driver__.driver}" :dataList="productimgMenuList" @setprintModel="setproduct" :item="productimgMenu"></generalMenu>
</div> -->
<div class="input_border productImg_content_item_generate">
<div class="input_box">
<div class="input_box_btnBox">
<input
class="search_input"
:placeholder="$t('Generate.inputContent1')"
v-model="searchName[productimgMenu.value]"
@keydown.enter="getPrductimg()"
/>
<i v-show="!isTextarea" class="fi fi-br-expand" @click.stop="()=>isTextarea = !isTextarea"></i>
<i v-show="isTextarea" class="fi fi-bs-compress" @click.stop="()=>isTextarea = !isTextarea"></i>
</div>
<textarea
v-show="isTextarea"
class="search_textarea "
@keydown.enter="getPrductimg()"
v-model="searchName[productimgMenu.value]"
></textarea>
</div>
</div>
<div v-show="productimgMenu.value == 'ToProductImage'" class="productImg_content_item_title productImg_content_item_title_similarity">
<span>{{$t('ProductImg.Similarity')}}</span>
</div>
<div v-show="productimgMenu.value == 'ToProductImage'" class="productImg_content_item_similarity">
<a-slider class="system_silder"
v-model:value="similarity"
@afterChange="setSimilarity"
:tooltipVisible="false"
:step="5"
>
</a-slider>
<input type="number" readonly v-model="similarity">
</div>
<div v-show="productimgMenu.value == 'Relight'" class="productImg_content_item_title productImg_content_item_title_similarity">
<span>{{$t('ProductImg.RelightDirection')}}</span>
</div>
<div v-show="productimgMenu.value == 'Relight'" class="productImg_content_item_Direction">
<a-select style="width: 100%;" v-model:value="RelightDirection" :options="RelightDirectionList"></a-select>
</div>
<div v-show="productimgMenu.value == 'Relight'" class="productImg_content_item_title productImg_content_item_title_similarity">
<span>{{$t('ProductImg.Highlight')}}</span>
</div>
<div v-show="productimgMenu.value == 'Relight'" class="productImg_content_item_similarity">
<a-slider class="system_silder"
v-model:value="brightenValue"
:tooltipVisible="false"
:max="3"
:min="1"
:step="0.1"
>
</a-slider>
<input type="number" readonly v-model="brightenValue">
</div>
<div class="productImg_content_item_title">{{$t('ProductImg.SelectCollection')}}</div>
<div class="productImg_content_item_imgBox generalScroll upload_item">
<div class="productImg_content_item_imgBox generalScroll upload_item" v-mousewheel>
<div class="content_item_imgBox_itemImg" v-for="item,index in selectList[productimgMenu.value]" :key="item.id" >
<img @click="setGenerate(item)" v-lazy="item.designOutfitUrl?item.designOutfitUrl:item.url" alt="" :class="[item?.isChecked?'active':'']">
<a-checkbox v-model:checked="item.isChecked"></a-checkbox>
@@ -117,6 +63,59 @@
</div>
</div>
<div v-show="productimgMenu.value == 'ToProductImage'" class="productImg_content_item_title productImg_content_item_title_similarity">
<span>{{$t('ProductImg.Similarity')}}</span>
</div>
<div v-show="productimgMenu.value == 'ToProductImage'" class="productImg_content_item_similarity">
<a-slider class="system_silder"
v-model:value="similarity"
@afterChange="setSimilarity"
:tooltipVisible="false"
:step="5"
>
</a-slider>
<input type="number" readonly v-model="similarity">
</div>
<div v-show="productimgMenu.value == 'Relight'" class="productImg_content_item_title productImg_content_item_title_similarity">
<span>{{$t('ProductImg.RelightDirection')}}</span>
</div>
<div v-show="productimgMenu.value == 'Relight'" class="productImg_content_item_Direction">
<a-select style="width: 100%;" v-model:value="RelightDirection" :options="RelightDirectionList"></a-select>
</div>
<div v-show="productimgMenu.value == 'Relight'" class="productImg_content_item_title productImg_content_item_title_similarity">
<span>{{$t('ProductImg.Highlight')}}</span>
</div>
<div v-show="productimgMenu.value == 'Relight'" class="productImg_content_item_similarity">
<a-slider class="system_silder"
v-model:value="brightenValue"
:tooltipVisible="false"
:max="3"
:min="1"
:step="0.1"
>
</a-slider>
<input type="number" readonly v-model="brightenValue">
</div>
<div class="input_border productImg_content_item_generate">
<div class="input_box">
<div class="input_box_btnBox">
<!-- <input
class="search_input"
:placeholder="productimgMenu.value == 'Relight'?$t('ProductImg.relightInput'):$t('ProductImg.productInput')"
v-model="searchName[productimgMenu.value]"
@keydown.enter="getPrductimg()"
/> -->
<textarea
class="textarea"
@input="ifMaximumLength"
:placeholder="productimgMenu.value == 'Relight'?$t('ProductImg.relightInput'):$t('ProductImg.productInput')"
@keydown.enter.prevent="getPrductimg()"
v-model="searchName[productimgMenu.value]"
></textarea>
</div>
</div>
</div>
<!-- <div class="productImg_content_item_title">{{$t('ProductImg.Upload')}}</div>
<div class="productImg_content_item_imgBox generalScroll upload_item">
@@ -142,7 +141,7 @@
<div class="productImg_right_item_box generalScroll">
<div class="content_header_left">
<i class="fi fi-rs-comments"></i><span class="content_header_des">
{{ $t('HomeView.SelectedDesign') }}
{{ $t('ProductImg.SelectedDesign') }}
</span>
</div>
<!-- <div class="productImg_right_item" v-for="item,index in generateList" :key="item"> -->
@@ -173,12 +172,10 @@
<generalDrag ref="generalDragLeft" @setBtn="selectSetBtn" :list="likeList[productimgMenu.value]"></generalDrag>
</div>
<!-- </div> -->
<div class="mark_loading" v-show="isShowMark">
<a-spin size="large" />
</div>
<div class="btnLeft" @click="setSize('left')">
<!-- <div class="btnLeft" @click="setSize('left')">
<span class="icon iconfont icon-xiala" :class="{'active':button.left}"></span>
</div>
</div> -->
<div class="btnRight" @click="setSize('right')">
<span class="icon iconfont icon-xiala" :class="{'active':button.right}"></span>
</div>
@@ -188,12 +185,15 @@
<div class="productImg_right_item_box right generalScroll">
<div class="content_header_left">
<i class="fi fi-rs-comments"></i><span class="content_header_des">
{{ $t('HomeView.GeneratedDesign') }}
{{ $t('ProductImg.productImageDrafts') }}
</span>
</div>
<div class="content">
<generalDrag ref="generalDragRight" @setBtn="generateSetBtn" :list="generateList" :showMark="isShowMark"></generalDrag>
</div>
<!-- <div class="mark_loading" v-show="isShowMark">
<a-spin size="large" />
</div> -->
<!-- <div class="productImg_right_item" v-for="item,index in likeList[productimgMenu.value]" :key="item" >
<img :src="item.url" alt="">
<div class="productImg_right_item_iconRight">
@@ -272,7 +272,6 @@ export default defineComponent({
ToProductImage:'',
Relight:'',
},
isTextarea:false,//是否展开
remProductimg:false,//是否出现取消按钮
isProductimg:false,//开始生成
selectProductimgList:[],
@@ -329,7 +328,7 @@ export default defineComponent({
});
let userlikeGroupId = 0
const openSetData = ()=>{
cleardata()
// cleardata()
if(props.productimgMenu.value == 'ToProductImage'){
selectList.value['ToProductImage'] = JSON.parse(JSON.stringify(selectDesignList.value.design.likeData))
}else if(props.productimgMenu.value == 'Relight'){
@@ -340,6 +339,7 @@ export default defineComponent({
}
userlikeGroupId = selectDesignList.value.userlikeGroupId
// getLikeProductImage(selectDesignList.value.userlikeGroupId)
productImgDom.generalDragLeft.setItemPosition()
}
let setproduct = (value:any)=>{
// props.productimgMenu = value
@@ -719,6 +719,18 @@ export default defineComponent({
setItemPosition()
})
}
const ifMaximumLength = (event:any)=>{
let textarea = event.target as HTMLTextAreaElement;
const scrollTop = textarea.scrollTop;
// 2. 计算单行高度
const lineHeight = parseInt(getComputedStyle(textarea).lineHeight) || 20; // 默认20px
// 3. 重置高度为1行
textarea.style.height = lineHeight + 'px';
// 4. 计算实际需要的高度
const newHeight = Math.max(lineHeight, textarea.scrollHeight);
textarea.style.height = newHeight + 'px';
textarea.scrollTop = scrollTop;
}
return {
upload,
driver__,
@@ -749,10 +761,23 @@ export default defineComponent({
generateSetBtn,
setItemPosition,
setSize,
ifMaximumLength,
};
},
directives:{
mousewheel:{
mounted (el) {
el.addEventListener('wheel',(e:WheelEvent)=>{
let num = 0
if(e.deltaY > 0){
num = 25
}else{
num = -25
}
el.scrollBy(num, 0);
},{ passive: true })
}
},
},
data() {
return {
@@ -812,7 +837,7 @@ methods: {
}
}
.productImg_content_bottom{
height: calc(100% - 4rem - 2.4rem);
height: 100%;
--border-color: #c4c4c4;
display: flex;
justify-content: space-between;
@@ -858,7 +883,8 @@ methods: {
display: flex;
margin-right: 1rem;
position: relative;
height: 14rem;
height: 36rem;
max-height: 100%;
position: relative;
img{
height: 100%;
@@ -866,10 +892,8 @@ methods: {
cursor: pointer;
object-fit: contain;
opacity: .5;
transform: scale(.9);
&.active{
opacity: 1;
transform: scale(1);
}
}
.ant-checkbox-wrapper{
@@ -918,7 +942,7 @@ methods: {
height: 100%;
flex-direction: column;
padding-right: 3.8rem;
width: 31.8rem;
width: 39rem;
&.active{
width: 0;
padding: 0;
@@ -931,14 +955,17 @@ methods: {
width: 9rem;
border: none !important;
&.upload_file_item:last-child{
width: 9rem;
margin-right: 0rem;
}
}
// width: 45%;
.productImg_content_item_imgBox{
flex-shrink: 0;
margin-bottom: 3rem;
.content_item_imgBox_itemImg{
width: auto;
max-width: 9rem;
max-width: 20rem;
flex-shrink: 0;
img{
object-fit: contain;
@@ -946,16 +973,18 @@ methods: {
}
.upload_file_item{
flex-shrink: 0;
width: 9rem;
width: 36rem;
}
}
.productImg_content_item_generate{
--width:100%;
padding-bottom: 1rem;
// margin-top: auto;
}
.productImg_content_item_similarity{
display: flex;
align-items: center;
padding-bottom: 3rem;
.system_silder{
flex: 1;
}
@@ -965,6 +994,7 @@ methods: {
height: 5rem;
text-align: center;
font-size: 1.8rem;
margin-left: 2rem;
}
}
.productImg_content_item_Direction{
@@ -986,7 +1016,6 @@ methods: {
}
}
.productImg_content_item_generate_btn{
margin-top: auto;
width: 100%;
justify-content: space-around;
.input_box{