This commit is contained in:
WangXiaoDong
2023-08-23 17:50:09 +08:00
parent d41b331e38
commit 2fda4a8c36
20 changed files with 2587 additions and 332 deletions

View File

@@ -173,8 +173,56 @@
<div class="generage_btn started_btn" @click="getgenerate">Generate</div>
</div>
<div class="modal_img">
<div v-for="item,index in generateList" class="modal_imgItem" :class="{ active: item?.checked }" @click="generageAdd(item)">
<img :src="item.imgUrl">
<div v-for="item,index in generateList" class="modal_imgItem" :class="{ active: item?.checked }">
<img :src="item.imgUrl" @click="generageAdd(item)">
<div class="operate_file_block">
<div class="select_img_type">
<div
class="select_category"
@click.stop="showFileCategory(item)"
>
{{ getSketchLabel(item.category) }}
<div
:class="[
'icon',
'iconfont',
'icon-xiala',
item.categoryShow
? 'icon_rotate'
: '',
]"
></div>
</div>
<div
class="category_list"
v-show="item.categoryShow"
>
<div
:class="[
'category_item',
item.category == cate.value
? 'select_category_item'
: '',
]"
v-for="(
cate, index
) in sketchCatecoryList"
:key="index"
@click.stop="
selectFileCategory(
item,
cate
)
"
>
{{ cate.label }}
</div>
</div>
</div>
</div>
<div class="pin_block">
<a-checkbox v-model:checked="item.pin">PIN</a-checkbox>
</div>
</div>
</div>
</div>
@@ -314,7 +362,10 @@ export default defineComponent({
file.category = "Outwear";
file.categoryShow = false;
file.id_ = GO.id++
file.type_ = 'upload';
file.type_ = {
type1:'upload',
type2:'Moodboard'
};
let fileList = this.fileList.filter(
(v: any) => v.status === "done"
);
@@ -355,13 +406,32 @@ export default defineComponent({
},
selectFileCategory(file: any, cate: any) {
file.category = cate.value;
this.store.commit("setSketchboardFile", this.fileList);
if(this.openClick == 3){
for (let item of this.generateList) {
item.categoryShow = false;
}
file.category = cate.value;
// this.store.commit("sketchGenerateFiles", this.fileList);
}else{
for (let item of this.fileList) {
item.categoryShow = false;
}
file.category = cate.value;
this.store.commit("setSketchboardFile", this.fileList);
}
},
hiddenFileCategory() {
for (let item of this.fileList) {
item.categoryShow = false;
}
if(this.openClick == 3){
for (let item of this.generateList) {
item.categoryShow = false;
}
}else{
for (let item of this.fileList) {
item.categoryShow = false;
}
}
document.removeEventListener("click", this.hiddenFileCategory);
},
@@ -383,13 +453,30 @@ export default defineComponent({
},
recollection() {
this.fileList = JSON.parse(
let arr = JSON.parse(
JSON.stringify(
this.store.state.UploadFilesModule.allBoardData
.skecthboardFiles
.sketchboardFiles
)
);
this.store.commit("setSketchboardFile", this.fileList);
let setboard = {
generate:[] as any,
material:[] as any,
moodboard:[] as any,
}
arr.forEach((v:any)=>{
if(v.type_.type1 == 'generate'){
setboard.generate.push(v)
}else if(v.type_.type1 == 'material'){
setboard.material.push(v)
}else{
setboard.moodboard.push(v)
}
})
this.store.commit("setSketchboardGenerateFiles", setboard.generate);
this.store.commit("setSketchboardMaterialFiles", setboard.material);
this.store.commit("setSketchboardFile", setboard.moodboard);
this.fileList = setboard.moodboard
},
confirmSelect(event: any) {
for (let item of event) {
@@ -623,77 +710,9 @@ export default defineComponent({
display: block;
}
.operate_file_block{
width: 100%;
height: 3rem;
font-size: 1.6rem;
color: #FFFFFF;
position: absolute;
left: 0;
bottom: 0;
.select_img_type{
height: 100%;
line-height: 3rem;
text-align: center;
background: rgba(0,0,0,0.6);
position: relative;
.select_category{
display: flex;
align-items: center;
justify-content: center;
.icon-xiala{
margin-left: 0.8rem;
}
}
.icon_rotate{
-moz-transform:rotate(180deg);
-webkit-transform:rotate(180deg);
transform: rotate(180deg);
animation-direction: 0.5s;
}
.category_list{
position: absolute;
width: 100%;
cursor: pointer;
position: absolute;
// top: 3.1rem;
margin-top: .2rem;
left: 0;
background: rgba(0,0,0,0.4);
border: 1px solid #343579;
border-radius: 0.8rem;
// overflow: hidden;
z-index: 2;
height: 9rem;
overflow-x: hidden;
&.category_list::-webkit-scrollbar{display: none;}
.category_item{
text-align: left;
font-size: 1.4rem;
padding: 1rem 1.9rem;
line-height: 1.6rem;
&.select_category_item{
background: linear-gradient(160deg, #AC2A3B, #292161);
}
&:hover{
background: linear-gradient(160deg, #AC2A3B, #292161);
}
}
}
}
}
}
.pin_block{
}
}
}
@@ -702,6 +721,8 @@ export default defineComponent({
.modal_right{
flex: 1;
margin-left: 3rem;
display: flex;
flex-direction: column;
.modal_layout,.modal_accomplish{
.modal_text{
font-size: 1.2rem;
@@ -755,11 +776,17 @@ export default defineComponent({
height: 30rem;
display: flex;
flex-direction: column;
flex: 1;
overflow-x: hidden;
&.modal_accomplish::-webkit-scrollbar {
display: none;
}
.modal_text{
padding-top: 2rem;
padding-block: 2rem;
}
.input_box{
z-index: 1;
input{
&.forbidden{
cursor:not-allowed;
@@ -772,7 +799,7 @@ export default defineComponent({
flex-wrap: wrap;
justify-content: flex-start;
.modal_imgItem{
margin: 0 2rem 2rem 0;
margin: 0 2rem 4rem 0;
display: inline-block;
width: 10rem;
height: 10rem;
@@ -792,6 +819,7 @@ export default defineComponent({
transform: scale(0.9);
}
}
}
}
}