封装设置衣服类型的下拉菜单

This commit is contained in:
X1627315083
2024-04-25 14:39:28 +08:00
parent d66a07785a
commit 4cfd33bcc7
8 changed files with 284 additions and 556 deletions

View File

@@ -46,51 +46,7 @@
v-show="file?.status === 'done'"
>
<img :src="file?.imgUrl" class="upload_img" />
<div class="operate_file_block">
<div class="select_img_type">
<div
class="select_category"
@click.stop="showFileCategory(file)"
>
{{ file.categoryValue }}
<div
:class="[
'icon',
'iconfont',
'icon-xiala',
file.categoryShow
? 'icon_rotate'
: '',
]"
></div>
</div>
<div
class="category_list"
v-show="file.categoryShow"
>
<div
:class="[
'category_item',
file.category == cate.value
? 'select_category_item'
: '',
]"
v-for="(
cate, index
) in sketchCatecoryList"
:key="index"
@click="
selectFileCategory(
file,
cate
)
"
>
{{ cate.value }}
</div>
</div>
</div>
</div>
<sketchCategory :disignTypeList="sketchCatecoryList" :generateList="fileList" :item="file" :driver__="driver__.driver"></sketchCategory>
<div
class="delete_like_file_block"
@click.stop="deleteFile(file)"
@@ -196,53 +152,7 @@
<div v-for="item,index in generateList" class="modal_imgItem Guide_1_13_2" :class="[driver__.driver?'showEvents':'',item?.checked?'active':'']">
<img v-show="item.status != 'Success'" src="@/assets/images/homePage/loading.gif" alt="">
<img v-show="item.status == 'Success'" :src="item.imgUrl" @click.stop="generageAdd(item)">
<div class="operate_file_block" :class="[driver__.driver?'hideEvents':'']">
<div class="select_img_type">
<div
class="select_category Guide_1_13"
@click.stop="showFileCategory(item)"
>
{{ item.categoryValue }}
<div
:class="[
'icon',
'iconfont',
'icon-xiala',
item.categoryShow
? 'icon_rotate'
: '',
]"
></div>
</div>
<div
class="category_list Guide_1_13_1"
:class="[driver__.driver?'showEvents':'']"
v-show="item.categoryShow"
>
<div
:class="[
'category_item',
item.category == cate.name
? 'select_category_item'
: '',
]"
v-for="(
cate, index
) in sketchCatecoryList"
:key="index"
@click.stop="
selectFileCategory(
item,
cate
)
"
>
{{ cate.value }}
</div>
</div>
</div>
</div>
<sketchCategory :disignTypeList="sketchCatecoryList" :generateList="generateList" :item="item" :driver__="driver__.driver" ></sketchCategory>
<div
class="delete_like_file_block"
>
@@ -287,8 +197,10 @@ import scaleImage from "@/component/HomePage/scaleImage.vue";
import { Https } from "@/tool/https";
import { openGuide,driverObj__ } from "@/tool/guide";
import { useI18n } from "vue-i18n";
import sketchCategory from "@/component/HomePage/sketchCategory.vue";
export default defineComponent({
components: { Material, Generate,scaleImage },
components: { Material, Generate,scaleImage,sketchCategory },
setup() {
let fileList: any = ref([
]);
@@ -521,7 +433,7 @@ export default defineComponent({
name:'',
}
this.sketchCatecoryList.forEach((item:any) => {
if(item.name == res.data.level2Type){
if(item.value == res.data.level2Type){
category.value = item?.value
category.name = item?.name
}
@@ -530,8 +442,8 @@ export default defineComponent({
file.resData = res.data;
// file.pin = false;
//category用来数据处理
file.categoryValue = category?.value;
file.category = category?.name;
file.categoryValue = category?.name;
file.category = category?.value;
file.categoryShow = false;
file.id_ = GO.id++
file.id = res.data.id
@@ -580,58 +492,6 @@ export default defineComponent({
}
return (isJpgOrPng && isLt2M) || Upload.LIST_IGNORE;
},
showFileCategory(file: any) {
file.categoryShow = true;
nextTick().then(()=>{
if(this.driver__.driver){
driverObj__.moveNext()
}
})
document.addEventListener("click", this.hiddenFileCategory);
},
selectFileCategory(file: any, cate: any) {
if(this.openClick == 3){
for (let item of this.generateList) {
item.categoryShow = false;
}
file.categoryValue = cate.value;
file.category = cate.name;
if(this.driver__.driver){
driverObj__.moveNext()
}
// this.store.commit("sketchGenerateFiles", this.fileList);
}else{
for (let item of this.fileList) {
item.categoryShow = false;
}
file.categoryValue = cate.value;
file.category = cate.name;
this.store.commit("setSketchboardFile", this.fileList);
nextTick().then(()=>{
if(this.driver__.driver){
driverObj__.moveNext()
// driverObj__.moveTo(13)
}
})
}
},
hiddenFileCategory() {
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);
},
ifMaximumLength(){
clearTimeout(this.inputTime)
let inputBox = document.getElementsByClassName('sketchboard_upload_modal')[0].getElementsByClassName('input_box')[0]
@@ -882,9 +742,9 @@ export default defineComponent({
element.id_ = GO.id++
if(element.category){
this.sketchCatecoryList.forEach((itemCategory:any) => {
if(itemCategory.name == element.category){
element.categoryValue = itemCategory?.value
element.category = itemCategory?.name
if(itemCategory.value == element.category){
element.categoryValue = itemCategory?.name
element.category = itemCategory?.value
}
});
}