This commit is contained in:
X1627315083
2024-06-24 09:47:59 +08:00
parent 8b0af784de
commit a5ac4a341f
20 changed files with 160 additions and 761 deletions

View File

@@ -23,15 +23,40 @@
</div>
<div class="productImg_content_bottom">
<div class="productImg_left">
<div class="productImg_content_item_title productImg_content_item_title_menu">
<span>{{$t('ProductImg.MagicTools')}}</span>
<generalMenu class="productImg_content_item_title_menubtn" :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"
@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"
></textarea>
</div>
</div>
<div class="productImg_content_item_title">{{$t('ProductImg.SelectCollection')}}</div>
<div class="productImg_content_item_imgBox generalScroll" v-mousewheel>
<div class="content_item_imgBox_itemImg" v-for="item in likeDesignCollectionList" :key="item.id" >
<div class="content_item_imgBox_itemImg" v-for="item in selectList[productimgMenu.value]" :key="item.id" >
<img @click="setGenerate(item)" v-lazy="item.designOutfitUrl" alt="" :class="{active:item.isChecked}">
</div>
</div>
<div class="productImg_content_item_title">{{$t('ProductImg.Upload')}}</div>
<div class="productImg_content_item_imgBox generalScroll upload_item" v-mousewheel>
<div class="upload_file_item" v-for="(file, index) in fileList" :key="file">
<div class="upload_file_item" v-for="(file, index) in fileList[productimgMenu.value]" :key="file">
<div class="upload_file_item_content" v-show="file?.status === 'uploading'" >
<a-spin
:indicator="indicator"
@@ -60,7 +85,7 @@
}"
:headers="{ Authorization: token }"
:before-upload="beforeUpload"
v-model:file-list="fileList"
v-model:file-list="fileList[productimgMenu.value]"
:multiple="true"
:maxCount="8"
accept=".jpg,.png,.jpeg,.bmp"
@@ -76,28 +101,8 @@
</a-upload>
</div>
</div>
<div class="productImg_content_item_title productImg_content_item_title_menu">
<span>{{$t('ProductImg.MagicTools')}}</span>
<generalMenu class="productImg_content_item_title_menubtn" :dataList="productimgMenuList" @setprintModel="setproduct" :item="productimgMenu"></generalMenu>
</div>
<div class="input_border productImg_content_item_generate">
<div class="productImg_content_item_generate_btn input_border">
<div class="input_box">
<div class="input_box_btnBox">
<input
class="search_input"
:placeholder="$t('Generate.inputContent1')"
v-model="searchName"
@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"
></textarea>
<div v-show="!isProductimg" class="generage_btn started_btn" @click.stop="getPrductimg">
{{ $t('Generate.Generate') }}
</div>
@@ -108,6 +113,7 @@
{{$t('Generate.Close')}}
</div>
</div>
<div class="input_clear started_btn">清空</div>
</div>
</div>
<div class="productImg_right">
@@ -181,7 +187,7 @@ export default defineComponent({
let productImgData:any = reactive({
isShowMark:false,
beenPublished:0,
fileList:[],
fileList:{},
searchName:'',
isTextarea:false,//是否展开
remProductimg:false,//是否出现取消按钮
@@ -198,10 +204,14 @@ export default defineComponent({
{
value:'ProductImage',
label:useI18n().t('ProductImg.ProductImage')
},{
value:'ProductImage1',
label:'123123'
}
])
let productimgMenu = ref(productimgMenuList.value[0])
let productimgMenu:any = ref(productimgMenuList.value[0])
let ExportModel = ref()
let selectList:any = ref({})
let likeDesignCollectionList: any = computed(() => {
return store.state.HomeStoreModule.likeDesignCollectionList;
});
@@ -209,6 +219,7 @@ export default defineComponent({
let init = (userGroupId:any,beenPublished:any)=>{
productImg.value = true
productImgData.beenPublished = beenPublished
selectList.value['ProductImage'] = JSON.parse(JSON.stringify(likeDesignCollectionList.value))
upload.value = {
userlikeGroupId:userGroupId
}
@@ -261,7 +272,7 @@ export default defineComponent({
file.id = res.data.id
file.isChecked = true
file.type = 'ProductElement'
productImgData.fileList.filter((v: any) => v.status === "done");
productImgData.fileList[productimgMenu.value.value].filter((v: any) => v.status === "done");
}else{
bor = false
}
@@ -286,7 +297,7 @@ export default defineComponent({
return (isJpgOrPng && isLt2M) || Upload.LIST_IGNORE;
}
let deleteFile = (index:any)=>{
productImgData.fileList.splice(index,1)
productImgData.fileList[productimgMenu.value.value].splice(index,1)
}
let setGenerate = (item:any)=>{
item.isChecked = !item.isChecked
@@ -342,14 +353,14 @@ export default defineComponent({
"toProductImageRecordId": 0,
"url": ""
}
productImgData.fileList.forEach((item:any)=>{
productImgData.fileList[productimgMenu.value.value].forEach((item:any)=>{
if(item.isChecked){
obj.elementId = item.id
obj.elementType = item.type
selectArr.push(JSON.parse(JSON.stringify(obj)))
}
})
likeDesignCollectionList.value.forEach((item:any)=>{
selectList.value[productimgMenu.value.value].forEach((item:any)=>{
if(item.isChecked){
obj.elementId = item.designOutfitId
obj.elementType = 'DesignOutfit'
@@ -460,6 +471,7 @@ export default defineComponent({
...toRefs(productImgData),
productimgMenuList,
productimgMenu,
selectList,
likeDesignCollectionList,
ExportModel,
init,
@@ -633,6 +645,7 @@ export default defineComponent({
}
.productImg_left{
width: 25%;
position: relative;
.upload_file_item{
display: flex;
margin-right: 1rem;
@@ -651,7 +664,20 @@ export default defineComponent({
}
}
.productImg_content_item_generate{
--width:60%;
--width:100%;
}
.productImg_content_item_generate_btn{
position: absolute;
bottom: 0;
top: auto;
width: 100%;
justify-content: space-around;
.input_box{
flex: 0;
.generage_btn{
margin: 0;
}
}
}
}
.productImg_right{