fix

src/component/Detail/DesignDetail.vue

@@ -32,7 +32,7 @@
 							<div v-for="item,index in designItemDetail?.clothes" :class="{active:item.clothesOpen}" @click="clothesOpen(index)">
 								<img :src="item?.path" alt="">
 							</div>
-							<div>
+							<div class="detail_modal_body_Set" @click="setClothesOpen()">
 								+
 							</div>
 						</div>
@@ -197,6 +197,8 @@ export default defineComponent({
 		let moible:any = isMoible()
 		provide('moible',moible)
 		let {t} = useI18n()
+		//创建单件衣服
+		let setClothes:any = ref()
         return{
             designItemDetail,
             store,
@@ -217,6 +219,7 @@ export default defineComponent({
 			driver__,
 			moible,
 			t,
+			setClothes,
         }
     },
     data(){
@@ -442,8 +445,6 @@ export default defineComponent({
 				
 				})()
 			}
-			// console.log(this.frontBack);
-			
 			this.frontBack = {
 				front:front,
 				back:back,
@@ -602,11 +603,14 @@ export default defineComponent({
 		//按比设置单件衣服宽高位置
 		async setPostition(url:any){
 			let img:any = await loadImage(url)
-			let modal_body = <HTMLImageElement>document.getElementsByClassName('detail_modal_model')[0]
+			let modal_body:any
+			await nextTick().then(()=>{
+				modal_body = document.getElementsByClassName('detail_modal_model')[0]
+			})
+			console.log(modal_body);
 			const num = modal_body?.offsetWidth / img.width;
 			function loadImage(url:any) {
 				return new Promise((resolve, reject) => {
-					
 					const img = new Image();
 					img.onload = () => {
 						resolve(img)
@@ -674,7 +678,7 @@ export default defineComponent({
 		},
 		clothesOpen(index:any){
 			this.clothesDetail('',index)
-			
+			this.clothesOpenActive(index)
 		},
 		clothesOpenActive(index:any){
 			this.designItemDetail.clothes.forEach((item:any)=>{
@@ -682,13 +686,47 @@ export default defineComponent({
 			})
 			this.designItemDetail.clothes[index].clothesOpen = true
 		},
+		setClothesOpen(){
+			this.designItemDetail.clothes.forEach((item:any)=>{
+				item.clothesOpen = false
+			})
+			// console.log(designItemDetail);
+			
+			// this.current = {
+			// 	"id": '',
+			// 	"type": "Bottoms",
+			// 	"level1Type": null,
+			// 	"path": "",
+			// 	"minIOPath": "",
+			// 	"color": {
+			// 		"id": 1921,
+			// 		"name": "",
+			// 		"tcx": "#FFFFFF",
+			// 		"r": 255,
+			// 		"g": 255,
+			// 		"b": 255,
+			// 		"h": '',
+			// 		"s": '',
+			// 		"v": ''
+			// 	},
+			// 	"printObject": {
+			// 		"ifSingle": null,
+			// 		"prints": [
+			// 			{}
+			// 		]
+			// 	},
+			// 	"layersObject": [
+			// 	]
+			// }
+			// this.currentIndex = 3
+		},
         //元素替换
         clothesDetail(clothes:any, index:number){
 			let designItemDetail = JSON.parse(JSON.stringify(this.store.state.DesignDetailModule.designItemDetail))
 			this.currentIndex = index
 			this.designOrder = true
 			this.current = designItemDetail.clothes[this.currentIndex]
-			this.clothesOpenActive(index)
+			console.log(this.current);
 			let data:any = this.setSubmitItem('preview')
 			data.designSingleItemDTOList[this.currentIndex] = {
 				color:`${this.current.color.r} ${this.current.color.g} ${this.current.color.b}`,
@@ -837,6 +875,12 @@ export default defineComponent({
 				// max-width: 245px;
 				width: 100%;
 				height: 100%;
+				.detail_modal_body_Set{
+					display: flex;
+					align-items: center;
+					justify-content: center;
+					font-size: 3.4rem;
+				}
 				.detail_modal_body_nav{
 					display: flex;
 					position: absolute;