修复用户指引bug

src/component/Detail/DesignDetail.vue

@@ -92,7 +92,7 @@
 								<i class="fi fi-rr-edit" @click.stop="openCurrent(2)"></i>
 							</div>
 							<div class="Guide_1_20" :class="[driver__.driver?'showEvents':'']">
-								<div class="centent_div" v-if="current?.printObject?.prints[0]?.path" @click="openCurrent(2)">
+								<div class="centent_div" v-if="current?.printObject?.prints?.[0]?.path" @click="openCurrent(2)">
 									<img :src="current?.printObject?.prints[0]?.path" alt="">
 								</div>
 								<i v-else class="fi fi-rr-picture centent" @click="openCurrent(2)"></i>
@@ -188,6 +188,8 @@ export default defineComponent({
 		let currentIndex:any = ref(0)
 		let current:any = ref({})//点击上衣或者下衣
 		provide('current',current)
+		provide('designItemDetail',designItemDetail)
+		provide('currentIndex',currentIndex)
 		let frontBack:any = ref({})
 		let body = ref(false)
 		let designItemId = ref()
@@ -202,6 +204,7 @@ export default defineComponent({
 			return store.state.Guide.guide
 		})
 		provide('driver__',driver__)
+		provide('body',body)
 		let moible:any = isMoible()
 		provide('moible',moible)
 		let {t} = useI18n()
@@ -1064,6 +1067,7 @@ export default defineComponent({
 					}
 					&.active{
 						width: 100%;
+						max-height: 100%;
 					}
 					.detail_modal_item_front,.detail_modal_item_back{
 						cursor: pointer;
@@ -1071,15 +1075,20 @@ export default defineComponent({
 						img{
 							// width: 100%;
 							max-height: 100%;
-							width: auto;
+							
 						}
 						&.active{
 							top: 50%;
 							left: 50%;
-							width: 100%;
+							max-width: 100%;
+							max-height: 100%;
+							
 							transform: translate(-50%,-50%);
 							img{
-								width: 100%;
+								max-width: 100%;
+								width: auto;
+								margin: 0 auto;
+								display: flex;
 							}
 						}
 					}

src/component/Detail/DesignDetailAlter.vue

@@ -55,6 +55,7 @@
 											>
 												{{ file.level2Type }}
 												<div
+												v-if="!body"
 													:class="[
 														'icon',
 														'iconfont',
@@ -67,6 +68,7 @@
 												</div>
 											</div>
 											<div
+												v-if="!body"
 												class="category_list"
 												v-show="file.categoryShow"
 											>
@@ -140,6 +142,7 @@
 									>
 										{{ file.level2Type }}
 										<div
+											v-if="!body"
 											:class="[
 												'icon',
 												'iconfont',
@@ -151,6 +154,7 @@
 										></div>
 									</div>
 									<div
+										v-if="!body"
 										class="category_list"
 										v-show="file.categoryShow"
 									>
@@ -311,6 +315,7 @@ export default defineComponent({
 		let select = ref(false);
         let current = inject('current')//父组件传过来的数据
         let driver__ = inject('driver__')//父组件传过来的数据
+        let body = inject('body')//父组件传过来的数据
 		let openClick = ref(1);
 		let searchPictureName = ref('')
 		//模型印花
@@ -358,6 +363,7 @@ export default defineComponent({
 			selectColorList,
 			workspace,
 			driver__,
+			body,
 			t,
         }
     },
@@ -575,7 +581,8 @@ export default defineComponent({
 					file.url = res.data.url;
 					file.resData = res.data;
 					file.designType = res.data.designType
-					file.level2Type = res.data.level2Type;
+					let type = this.body?this.current.type:res.data.level2Type
+					file.level2Type = type;
 					file.minIOPath = file.resData.minIOPath
 					let fileList = this.uploadList.filter(
 						(v) => v.status === "done"
@@ -633,7 +640,8 @@ export default defineComponent({
 			this.uploadList = []
 			this.apparelList = []
 			this.printList = []
-			DesignDetailEnd.colorList = [{},{},{},{},{},{},{},{}]
+			DesignDetailEnd.colorList = [{},{},{},{},{},{},{},{},{}]
+			// DesignDetailEnd.colorList = [{}]
 			DesignDetailEnd.sketchImg={}
 			this.terminate()
 		},
@@ -698,10 +706,11 @@ export default defineComponent({
         },
 		//请求我的印花&&模型
 		getLibraryList(){
+			let type = this.body?this.current.type:''
 			let workspace = this.store.state.Workspace.workspace
             let data = {
                 level1Type:this.selectCode,
-                // level2Type:this.designType,
+                level2Type:this.selectCode == 'Sketchboard'?type:'',
 				modelSex:workspace?.sex,
                 page:this.currentPage,
                 pictureName:this.searchPictureName,
@@ -841,7 +850,7 @@ export default defineComponent({
         },
 			//查询颜色的潘通值和txc
 		getPantongName(v) {
-			if(!v.r){
+			if(v?.r == undefined){
 				return
 			}
 			let color = [v.r, v.g, v.b];

src/component/Detail/DesignDetailEnd.vue

@@ -73,7 +73,6 @@
 			<div class="modal_img">
 				<div class="modal_img_item" v-for="color,index in colorList" :key="color" >
 					<div :title="color?.name?color?.name:''" @click="selectColorItem(index,color)" @dblclick="setSelectColorItem(color)" :class="['upload_color',selectIndex === index ? 'select_upload_color' : '',]" :style="{background:`rgba(${color?.r},${color?.g},${color?.b},${color?.a})`}">
-						<!-- <div class="color_content" :style="{background:`#6c6cac`}"></div> -->
 						<div class="color_content" :style="{'background-color':`rgba(${color.rgba?.r},${color.rgba?.g},${color.rgba?.b},${color.rgba?.a})`}">
 						</div>
 						<div class="color_content_body">
@@ -86,8 +85,7 @@
 		</div>
 		<div v-show="type_ == 1 || type_ == 3" @click.stop="setPreview" class="subitOkPreviewBtn">{{ $t('DesignDetailEnd.preview') }}</div>
 		<div v-if="type_ == 2 && current?.printObject?.prints?.[0]?.path != null" @click.stop="setPrint" class="subitOkPreviewBtn Guide_1_23">{{ $t('DesignDetailEnd.Layout') }}</div>
-		<div v-else-if="type_ == 2 && current?.printObject?.prints?.[0]?.path == null" @click.stop="setPreview" class="subitOkPreviewBtn">{{ $t('DesignDetailEnd.preview') }}</div>
+		<div v-else-if="type_ == 2 && designItemDetail?.clothes?.[currentIndex]?.printObject?.prints?.[0]?.path != null && current?.printObject?.prints?.[0]?.path == null" @click.stop="setPreview" class="subitOkPreviewBtn">{{ $t('DesignDetailEnd.preview') }}</div>
-		
 	<DesignPrintOperation v-if="!moible" ref="DesignPrintOperation"></DesignPrintOperation>
 	<DesignPrintOperationMobile v-else ref="DesignPrintOperationMobile"></DesignPrintOperationMobile>
 	</div>
@@ -121,13 +119,16 @@ export default defineComponent({
 		let sketchImg = ref({})
         let driver__ = inject('driver__')//父组件传过来的数据
         let moible = inject('moible')//父组件传过来的数据
-
+        let designItemDetail = inject('designItemDetail')//父组件传过来的数据
+        let currentIndex = inject('currentIndex')//父组件传过来的数据
+		let previewShow = ref(false)
 		//印花
 		let overallSingle = ref(false)
 		let systemDesignerPercentage = ref(30)
 
 		//颜色
-		let colorList = ref([{},{},{},{},{},{},{},{}])
+		// let colorList = ref([{}])
+		let colorList = ref([{},{},{},{},{},{},{},{},{}])
 
 		//加载中
 		let loadingShow = ref(false)
@@ -140,6 +141,9 @@ export default defineComponent({
 			sketchImg,
 			driver__,
 			moible,
+			designItemDetail,
+			currentIndex,
+			previewShow,
 			type_,
 			overallSingle,
 			systemDesignerPercentage,
@@ -208,21 +212,24 @@ export default defineComponent({
 			let parent = this.$parent
 			this.selectIndex = index
             this.$parent.selectIndex = index
-			if(this.$parent.selectColor.rgba.r == color?.rgba?.r && this.$parent.selectColor.rgba.g == color?.rgba?.g && this.$parent.selectColor.rgba.b == color?.rgba?.b){
+			if(color.rgba?.r){
+				hex = parent.rgbaToHex([color.rgba.r,color.rgba.g,color.rgba.b])
+			}else{
+				this.$parent.selectColor = {}
 				return
 			}
-			if(color.rgba?.r){
+			//判断是否对一个颜色重复点击
-				hex = parent.rgbaToHex([color.rgba.r,color.rgba.g,color.rgba.b,color.rgba.a])
+			if(this.$parent.selectColor?.rgba?.r == color?.rgba?.r && this.$parent.selectColor.rgba.g == color?.rgba?.g && this.$parent.selectColor.rgba.b == color?.rgba?.b){
-			}else{
+				return
-				hex = '#FFFFFF'
 			}
-            this.$parent.selectColor = color?.rgba?.r ? {rgba:{r:color.rgba?.r,g:color.rgba?.g,b:color.rgba?.b,a:color.rgba?.a},hex:hex} : {rgba:{r:255,g:255,b:255,a:1},hex:hex}
+			
+            this.$parent.selectColor =  {rgba:{r:color.rgba?.r,g:color.rgba?.g,b:color.rgba?.b,a:color.rgba?.a},hex:hex}
             this.$parent.tcxColor = ''
 			this.$parent.pantongName = ''
         },
 		setSelectColorItem(color){
 			let designItemDetail = this.store.state.DesignDetailModule.designItemDetail
-			let string = `${color.rgba.r},${color.rgba.g},${color.rgba.b},${color.rgba.a}`
+			let string = `${color.rgba.r},${color.rgba.g},${color.rgba.b}`
 			this.current.color = string
 			designItemDetail.clothes.forEach((element,index) => {
 				if(element.id == this.current.id){
@@ -265,6 +272,10 @@ export default defineComponent({
 				data.designSingleItemDTOList[index].printObject.ifSingle = false
 				data.designSingleItemDTOList[index].printObject.prints = []
 			}else if(this.type_ == 3){
+				if(this.$parent.selectColor?.rgba?.r == undefined){
+					message.info(this.t('DesignDetailEnd.jsContent2'))
+					return
+				}
 				let color = `${this.$parent.selectColor.rgba.r} ${this.$parent.selectColor.rgba.g} ${this.$parent.selectColor.rgba.b}`
 				data.designSingleItemDTOList[index].color = color
 			}
@@ -474,10 +485,13 @@ export default defineComponent({
 		.modal_img_item{
 			margin: 0 1rem 1rem 0;
 			position: relative;
-			cursor: pointer;
+			// cursor: pointer;
 			border: 0.1rem solid #DCDCEC;
+			//放8个
 			height: 8.5rem;
 			width: 7rem;
+			// height: 32rem;
+			// width: 25rem;
 			overflow: hidden;
 			@media screen and (max-width: 1440px) { 
 				&.modal_img_item {
@@ -487,11 +501,13 @@ export default defineComponent({
 			box-sizing: border-box;
 			.color_content{
 				width: 100%;
+				//放8个
 				height: 4rem;
+				// height: 25rem;
 			}
 			.color_content_body{
 				.color_des{
-					font-size: 1.2rem;
+					// font-size: 1.8rem;
 					font-weight: 600;
 					white-space: nowrap; 
 					width: 100%; 

src/component/Detail/DesignPrintOperation.vue

@@ -61,7 +61,7 @@
 								</div>
 							</div>
 							<div class="subitOkPreviewBtn" @click.stop="setPreview">{{ $t('DesignPrintOperation.preview') }}</div>
-							<div class="subitOkPreviewBtn  Guide_1_25_1" @click.stop="setOK">OK</div>
+							<div class="subitOkPreviewBtn  Guide_1_25_1" :class="[driver__.driver?'hideEvents':'']"  @click.stop="setOK">OK</div>
 						</div>
 						
 					</div>
@@ -662,16 +662,13 @@ export default defineComponent({
 					designItemDetail.clothes[index].layersObject = rv.clothes[index].layersObject
 					designItemDetail.clothes[index].printObject.prints = this.computeZindex()
 					designItemDetail.ifSubmit = true
-					console.log(rv,index);
 					designItemDetail.clothes.forEach((item,i)=>{
 						let a
-					console.log(1);
 						if(item.layersObject[0].imageCategory.indexOf("back") == -1){
 							a = item.layersObject[0]
 							item.layersObject[0] = item.layersObject[1]
 							item.layersObject[1] = a
 						}
-					console.log(2);
 						item.layersObject[0].id = this.store.state.DesignDetailModule.designItemDetail.clothes[i].layersObject[0].id
 						item.layersObject[1].id = this.store.state.DesignDetailModule.designItemDetail.clothes[i].layersObject[1].id
 					})
@@ -693,6 +690,9 @@ export default defineComponent({
 		},
 		setOK(){
 			this.designOpenrtion = false
+			if(this.driver__.driver){
+				driverObj__.moveNext();
+			}
 		},
 		clearModal(){
 			this.printAmount = 1//显示数量
@@ -795,10 +795,13 @@ export default defineComponent({
 			.designOpenrtion_entirety_img{
 				height: 100%;
 				img{
-					height: 100%;
 					max-width: 100%;
 					max-height: 100%;
 					object-fit: contain;
+					position: relative;
+					top: 50%;
+					left: 50%;
+					transform: translate(-50%,-50%);
 				}
 			}
 		}

src/component/Detail/DesignPrintOperationMobile.vue

@@ -784,10 +784,13 @@ export default defineComponent({
 			.designOpenrtion_entirety_img{
 				height: 100%;
 				img{
-					height: 100%;
 					max-width: 100%;
 					max-height: 100%;
 					object-fit: contain;
+					position: relative;
+					top: 50%;
+					left: 50%;
+					transform: translate(-50%,-50%);
 				}
 			}
 		}

src/component/HomePage/Material.vue

@@ -270,8 +270,14 @@ export default defineComponent({
 			this.store.commit("addGenerateMaterialFils", imgData);
         },
         //选择所有的图片
-        getLibraryList(str:any){
+        async getLibraryList(str:any){
-			let workspace = this.store.state.Workspace.workspace
+			let workspace = JSON.parse(JSON.stringify(this.store.state.Workspace.workspace))
+			if(this.searchPictureName != this.isOldSearchPictureName || this.workspace?.sex != workspace.sex){
+				this.imgList = []
+				this.currentPage = 1
+			}else{
+			}
+			
 			if(str == 'di'){
 				this.currentPage = this.imgList?.[0]?.id != undefined?this.imgList?.length / this.pageSize+1:1
 			}
@@ -287,7 +293,7 @@ export default defineComponent({
 				
             }
             this.isShowLoading = true
-            Https.axiosPost(Https.httpUrls.queryLibraryPage,data).then(
+            await Https.axiosPost(Https.httpUrls.queryLibraryPage,data).then(
                 (rv: any) => {
                     this.total = rv.total
 					let aa:any = []
@@ -318,15 +324,13 @@ export default defineComponent({
 						}
 						aa.push(item)
 					});
-					if(this.searchPictureName != this.isOldSearchPictureName){
+					
-						this.imgList = []
-					}else{
-					}
 					this.isOldSearchPictureName = this.searchPictureName
 					if((aa[aa.length-1].id == this.imgList[this.imgList.length-1]?.id) && aa?.[aa.length-1]?.id){
 					}else{
 						this.imgList.push(...aa)
 					}
+					this.workspace = workspace
 					// this.imgList = aa
                     this.isShowLoading = false
                 }

src/component/HomePage/MoodboardUpload.vue

@@ -662,6 +662,7 @@ export default defineComponent({
 			}
 			.modal_img_max{
 				// flex: 1;
+				width: 57rem;
 				height: 35rem;
 				position: relative;
 				.mark_loading{
@@ -681,6 +682,8 @@ export default defineComponent({
 				>img{
 					// height: 100%;
 					width: 100%;
+					max-height: 100%;
+					object-fit: contain;
 				}
 				&.active{
 					flex-direction: row;

src/component/HomePage/layout.vue

@@ -725,7 +725,6 @@ export default defineComponent({
 			flex-direction: column;
 			flex-wrap: wrap;
 			align-content: space-around;
-			width: 50%;
 			margin: 3rem auto;
 			overflow: hidden;
 			// padding: 3rem 0;

src/lang/cn.ts

@@ -64,6 +64,7 @@ export default {
 		Point:'点',
 		inputContent1:'输入名字进行搜索',
 		intersection:'交集',
+		Tag:'标签:',
 		Select:'选择',
 		NoLabel:'空标签',
 		unionSet:'并集',
@@ -76,6 +77,7 @@ export default {
 		Model1:'模型1',
 		Model2:'模型2',
 		Model3:'模型3',
+		Name:'名字:',
 		inputContent3:'输入生成图片的标题',
 		Cancel:'取消',
 		Sure:'确定',
@@ -311,6 +313,7 @@ export default {
 		preview:'预览',
 		Layout:'布局',
 		jsContent1:'请选择印个印花',
+		jsContent2:'请选择颜色',
 	},
 	DesignPrintOperation:{
 		Placement:'调整位置',

src/lang/en.ts

@@ -62,21 +62,23 @@ export default {
 		Delete:'Delete',
 		Rename:'Edit',
 		Point:'Point',
-		inputContent1:'Search by your style code',
+		inputContent1:'Search by name',
 		intersection:'intersection',
-		Select:'Select',
+		Tag:'Tag:',
+		Select:'Search by tag',
 		NoLabel:'No Label',
 		unionSet:'union set',
 		all:'all',
 		ImageOnly:'Image Only',
 		TextOnly:'Text Only',
 		TextImage:'Text-Image',
-		inputContent2:'Input name',
+		inputContent2:'Input prompt',
 		maximumLength:'The entered content exceeds the maximum length.',
 		Model1:'Model1',
 		Model2:'Model2',
 		Model3:'Model3',
-		inputContent3:'Input name',
+		Name:'Name:',
+		inputContent3:'Enter a new name',
 		Cancel:'Cancel',
 		Sure:'Sure',
 		Moodboard:'Moodboard',
@@ -165,7 +167,7 @@ export default {
 		PIN:'PIN',
 		Maximum:'Maximum {maxImg} images can be uploaded, Maximum 2M per image',
 		Thumbnail:'Thumbnail preview of selected sketchboard',
-		inputContent1:'Caption generation',
+		inputContent1:'Input prompt',
 		maximumLength:'The entered content exceeds the maximum length.',
 		jsContent1:"upload failed",
 		jsContent2:"You can only upload Image file!",
@@ -182,7 +184,7 @@ export default {
 		PIN:'PIN',
 		Maximum:'Maximum 8 images can be uploaded, Maximum 2M per image',
 		Thumbnail:'Thumbnail preview of selected printboard',
-		inputContent1:'Caption generation',
+		inputContent1:'Input prompt',
 		maximumLength:'The entered content exceeds the maximum length.',
 		jsContent1:"You can only upload Image file!",
 		jsContent2:'Image must smaller than 2MB!',
@@ -251,7 +253,7 @@ export default {
 		Model1:'Model1',
 		Model2:'Model2',
 		Model3:'Model3',
-		inputContent1:'Prompt input',
+		inputContent1:'Input prompt',
 		Generate:'Generate',
 		maximumLength:'The entered content exceeds the maximum length.',
 		Model:'Model',
@@ -312,6 +314,7 @@ export default {
 		preview:'Preview',
 		Layout:'Layout',
 		jsContent1:'Please select print',
+		jsContent2:'Please choose a color',
 	},
 	DesignPrintOperation:{
 		Placement:'Placement',

src/lang/fr.ts

@@ -65,6 +65,7 @@ export default {
 		Point:'point',
 		inputContent1:'Recherchez par votre code de style',
 		intersection:'intersection',
+		Tag:'Balise:',
 		Select:'Sélectionner',
 		NoLabel:'Aucune étiquette',
 		unionSet:"ensemble d'unions",
@@ -77,6 +78,7 @@ export default {
 		Model1:'Modèle1',
 		Model2:'Modèle2',
 		Model3:'Modèle3',
+		Name:'Nom:',
 		inputContent3:'Saisie rapide',
 		Cancel:'Annuler',
 		Sure:'Bien sûr',
@@ -312,6 +314,7 @@ export default {
 		preview:'Aperçu',
 		Layout:'Mise en page',
 		jsContent1:'Veuillez sélectionner imprimer',
+		jsContent2:'Choisissez un couleur',
 	},
 	DesignPrintOperation:{
 		Placement:'Placement',

src/lang/it.ts

@@ -64,6 +64,7 @@ export default {
 		Point:'Punto',
 		inputContent1:'Search by your style code',
 		intersection:'intersezione',
+		Tag:'Etichetta:',
 		Select:'Seleziona',
 		NoLabel:'Nessuna etichetta',
 		unionSet:'insieme di unione',
@@ -76,6 +77,7 @@ export default {
 		Model1:'Modello1',
 		Model2:'Modello2',
 		Model3:'Modello3',
+		Name:'Nome:',
 		inputContent3:'Immissione rapida',
 		Cancel:'Annulla',
 		Sure:'Sicuro',
@@ -311,6 +313,7 @@ export default {
 		preview:'anteprima',
 		Layout:'Disposizione',
 		jsContent1:'Seleziona stampa',
+		jsContent2:'Vuoi scegliere una tonalità di colore',
 	},
 	DesignPrintOperation:{
 		Placement:'Posizionamento',

src/lang/ja.ts

@@ -64,6 +64,7 @@ export default {
 		Point:'ポイント',
 		inputContent1:'スタイルコードで検索',
 		intersection:'交差点',
+		Tag:'タグ:',
 		Select:'選択',
 		NoLabel:'ラベルなし',
 		unionSet:'ユニオンセット',
@@ -76,6 +77,7 @@ export default {
 		Model1:'モデル1',
 		Model2:'モデル2',
 		Model3:'モデル3',
+		Name:'名前:',
 		inputContent3:'プロンプト入力',
 		Cancel:'キャンセル',
 		Sure:'もちろん',
@@ -311,6 +313,7 @@ export default {
 		preview:'プレビュー',
 		Layout:'レイアウト',
 		jsContent1:'印刷を選択してください',
+		jsContent2:'色をお選びください',
 	},
 	DesignPrintOperation:{
 		Placement:'配置',

src/lang/kr.ts

@@ -64,6 +64,7 @@ export default {
 		Point:'점',
 		inputContent1:'스타일 코드로 검색',
 		intersection:'교차로',
+		Tag:'태그:',
 		Select:'선택',
 		NoLabel:'라벨 없음',
 		unionSet:'결합 세트',
@@ -76,6 +77,7 @@ export default {
 		Model1:'모델1',
 		Model2:'모델2',
 		Model3:'모델3',
+		Name:'이름:',
 		inputContent3:'프롬프트 입력',
 		Cancel:'취소',
 		Sure:'확신하는',
@@ -311,6 +313,7 @@ export default {
 		preview:'시사',
 		Layout:'정렬하려면',
 		jsContent1:'인쇄를 선택해주세요',
+		jsContent2:'색감을 선택해주세요',
 	},
 	DesignPrintOperation:{
 		Placement:'놓기',

src/lang/ru.ts

@@ -64,6 +64,7 @@ export default {
 		Point:'точка',
 		inputContent1:'Поиск по коду вашего стиля', 
 		intersection:'пересечение',
+		Tag:'Тег:',
 		Select:'Выбрать',
 		NoLabel:'Нет метки',
 		unionSet:'набор объединений',
@@ -76,6 +77,7 @@ export default {
 		Model1:'Модель1',
 		Model2:'Модель2',
 		Model3:'Модель3',
+		Name:'Имя:',
 		inputContent3:'Быстрый ввод',
 		Cancel:'Отмена',
 		Sure:'Конечно',
@@ -311,6 +313,7 @@ export default {
 		preview:'просмотр',
 		Layout:'Макет',
 		jsContent1:'Пожалуйста, выберите печать',
+		jsContent2:'Пожалуйста выбирай цвет',
 	},
 	DesignPrintOperation:{
 		Placement:'Размещение',

src/lang/th.ts

@@ -64,6 +64,7 @@ export default {
 		Point:'จุด',
 		inputContent1:'ค้นหาตามรหัสสไตล์ของคุณ',
 		intersection:'แยก',
+		Tag:'แท็ก:',
 		Select:'เลือก',
 		NoLabel:'ไม่มีป้ายกำกับ',
 		unionSet:'ชุดยูเนี่ยน',
@@ -76,6 +77,7 @@ export default {
 		Model1:'แบบอย่าง1',
 		Model2:'แบบอย่าง2',
 		Model3:'แบบอย่าง3',
+		Name:'ชื่อ:',
 		inputContent3:'ป้อนข้อมูลทันที',
 		Cancel:'ยกเลิก',
 		Sure:'ได้เลย',
@@ -311,6 +313,7 @@ export default {
 		preview:'ดูตัวอย่าง',
 		Layout:'เลย์เอาต์',
 		jsContent1:'กรุณาเลือกพิมพ์',
+		jsContent2:'คุณชอบเลือกสีไหนคะ',
 	},
 	DesignPrintOperation:{
 		Placement:'ตำแหน่ง',

src/lang/vn.ts

@@ -64,6 +64,7 @@ export default {
 		Point:'điểm',
 		inputContent1:'Tìm kiếm theo mã kiểu của bạn',
 		intersection:'ngã tư',
+		Tag:'Thẻ:',
 		Select:'Chọn',
 		NoLabel:'Không có nhãn',
 		unionSet:'bộ đoàn',
@@ -76,6 +77,7 @@ export default {
 		Model1:'Người mẫu1',
 		Model2:'Người mẫu2',
 		Model3:'Người mẫu3',
+		Name:'Tên:',
 		inputContent3:'Nhập liệu nhanh chóng',
 		Cancel:'Hủy bỏ',
 		Sure:'Chắc chắn',
@@ -311,6 +313,7 @@ export default {
 		preview:'xem trước',
 		Layout:'Cách trình bày',
 		jsContent1:'Vui lòng chọn in',
+		jsContent2:'Choose a color',
 	},
 	DesignPrintOperation:{
 		Placement:'Vị trí',

src/views/LibraryPage.vue

@@ -324,9 +324,11 @@
             @onCancel="closeRenameModal"
         >
             <div class="collection_rename_content">
+				<div class="collection_rename_title">{{$t('LibraryPage.Name')}}</div>
                 <div class="rename_form_content">
                     <input class="rename_form_input" :placeholder="$t('LibraryPage.inputContent3')" v-model="newPicName" @keydown.enter="confrimRename()">
                 </div>
+				<div class="collection_rename_title">{{$t('LibraryPage.Tag')}}</div>
 				<el-cascader 
 					:options="options" 
 					:filterable="true" 
@@ -1817,21 +1819,24 @@ export default defineComponent({
     .collection_rename_content{
         padding:0 6.8rem 1.8rem;
 
-
+		.collection_rename_title{
+			margin: 2rem 0rem 1rem 0;
+			font-size: var(--aida-fsize1-8);
+		}
         .rename_form_content{
 
             .rename_form_input{
                 width: 100%;
                 height: 4.6rem;
-                margin-top: 1rem;
+                border: 0.1rem solid #d9d9d9;
-                border: 0.1rem solid #B4BED7;
                 padding-left: 2.1rem;
                 line-height: 4.6rem;
                 font-size: 1.8rem;
                 box-sizing: border-box;
+				border-radius: 4px;
 
                 &::placeholder {
-                    color:#A5B0C2,
+                    color:#adabb9
                 }
             }
         }
@@ -1863,10 +1868,28 @@ export default defineComponent({
             }
         }
 		.el-cascader{
+			.el-input--suffix{
+			--el-input-hover-border-color: #d9d9d9;
+				// border: .1rem solid #d9d9d9;
+			}
 			height: 4.6rem;
-			margin-top: 2rem;
 			.el-tag__content{
 				line-height: 2.5;
+				.el-cascader__tags{
+					
+				}
+			}
+			.el-input__wrapper{
+				padding-left: 0;
+			}
+			.el-cascader__search-input,.el-input__inner{
+				margin: 0;
+				width: 100%;
+				height: 4.6rem;
+				padding-left: 2.1rem;
+				line-height: 4.6rem;
+				font-size: 1.8rem;
+				box-sizing: border-box;
 			}
 		}