调整library布局

src/assets/images/homePage/bankCard.svg

@@ -1,3 +0,0 @@
-<svg fill="none" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16">
-  <path fill-rule="evenodd" clip-rule="evenodd" d="M16 4H0v-.75C0 2.56.448 2 1 2h14c.552 0 1 .56 1 1.25V4zm0 2.5V13a1 1 0 01-1 1H1a1 1 0 01-1-1V6.5h16zM4 10a1 1 0 100 2h1a1 1 0 100-2H4z" fill="#000"/>
-</svg>

src/assets/images/homePage/stripe.svg

@@ -0,0 +1 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1735265169559" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="1495" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><path d="M802.158921 871.935232h-580.317842c-63.174813 0-114.374813-51.2-114.374812-114.374812V177.31934c0-63.174813 51.2-114.374813 114.374812-114.374812h580.317842c63.174813 0 114.374813 51.2 114.374812 114.374812v580.317841c0 63.098051-51.2 114.298051-114.374812 114.298051z" fill="#009BF1" p-id="1496"></path><path d="M469.627586 350.647076c0-25.638381 21.416492-35.54063 55.728936-35.540629 49.971814 0 113.376912 15.275562 163.271964 42.21889V202.804198c-54.423988-21.723538-108.771214-30.013793-163.195203-30.013793-133.181409 0-221.917841 69.546027-221.917841 185.763118 0 181.694753 249.552024 152.295052 249.552024 230.668666 0 30.397601-26.329235 40.146327-62.944527 40.146327-54.347226 0-124.507346-22.414393-179.622189-52.351425v147.919641c61.025487 26.252474 122.895352 37.306147 179.545427 37.306147 136.482159 0 230.515142-58.722639 230.515142-176.782009-0.076762-195.972414-250.933733-160.892354-250.933733-234.813794" fill="#FFFFFF" p-id="1497"></path></svg>

src/assets/style/style.css

@@ -7,7 +7,7 @@ body,
   font-family: 'Roboto', sans-serif;
   overflow: hidden;
   --aida-fsize2: calc(2.6rem);
-  --aida-fsize1-8: calc(1.8rem*1.2);
+  --aida-fsize1-8: calc(1.8rem);
   --aida-fsize1-6: calc(1.6rem);
   --aida-fsize1-4: calc(1.4rem*1.2);
   --antd-wave-shadow-color: #39215b;
@@ -261,58 +261,9 @@ li {
     transform: rotate(360deg);
   }
 }
-.el-cascader {
-  font-size: 1.2rem;
-  width: 100%;
-  height: 3rem;
-  --el-color-primary: #d9d9d9;
-  --el-cascader-tag-background: #e1d9ec;
-}
-.el-cascader .el-input {
-  height: 100%;
-}
-.el-cascader .el-input .el-input__wrapper .el-input__inner {
-  height: 80% !important;
-  font-size: 1.2rem;
-}
 .el-popper {
   padding: 0.5rem 1.1rem;
 }
-.el-cascader__tags,
-.el-cascader__collapse-tag {
-  --el-color-primary: #d9d9d9;
-  --el-cascader-tag-background: #e1d9ec;
-  --el-fill-color: #e1d9ec;
-  height: 100%;
-  width: 90% !important;
-  flex-wrap: nowrap;
-  overflow: hidden;
-  align-items: center;
-}
-.el-cascader__tags .el-tag--light,
-.el-cascader__collapse-tag .el-tag--light {
-  margin: 0 0 0 0.6rem;
-  padding-right: 0.5rem;
-  height: 80%;
-  --el-icon-size: 1.4rem;
-  display: flex;
-}
-.el-cascader__tags .el-tag--light .el-tag__content,
-.el-cascader__collapse-tag .el-tag--light .el-tag__content {
-  font-size: 1.4rem;
-  color: #000;
-}
-.el-cascader__tags .el-cascader__search-input,
-.el-cascader__collapse-tag .el-cascader__search-input {
-  height: 100%;
-  margin: 0 0 0 1.1rem;
-}
-.el-cascader__collapse-tag {
-  margin-bottom: 0.5rem;
-}
-.el-cascader__collapse-tag .el-cascader__collapse-tag .el-tag--light {
-  display: flex !important;
-}
 .hideEvents {
   pointer-events: none !important;
 }
@@ -729,6 +680,17 @@ tr > .ant-picker-cell-in-view.ant-picker-cell-range-hover-start:last-child::afte
   align-items: center;
   margin-right: 5rem;
 }
+.generalModel_state .generalModel_state_item.smail > input {
+  padding: 1rem 2rem !important;
+}
+.generalModel_state .generalModel_state_item.smail .ant-picker-range,
+.generalModel_state .generalModel_state_item.smail .ant-select-selector,
+.generalModel_state .generalModel_state_item.smail .range_picker {
+  padding: 1rem 2rem !important;
+}
+.generalModel_state .generalModel_state_item.smail .el-cascader {
+  padding: 1rem 2rem;
+}
 .generalModel_state .generalModel_state_item > input {
   height: 2.5rem !important;
   border-radius: 4rem;
@@ -761,6 +723,7 @@ tr > .ant-picker-cell-in-view.ant-picker-cell-range-hover-start:last-child::afte
   box-sizing: content-box;
   background-color: #f3f3f3;
   width: calc(100% - 4rem);
+  border: 1px solid #000;
 }
 .generalModel_state .generalModel_state_item .ant-picker-input > input {
   font-size: 1.8rem;
@@ -773,6 +736,79 @@ tr > .ant-picker-cell-in-view.ant-picker-cell-range-hover-start:last-child::afte
   display: flex;
   align-items: center;
 }
+.generalModel_state .generalModel_state_item .el-cascader {
+  font-size: 1.8rem;
+  width: 100%;
+  border: 1px solid #dcdfe6;
+  border-radius: 4rem;
+  background-color: #fff;
+  height: 2.5rem;
+  padding: 2rem;
+  transition: all 0.3s;
+  box-sizing: content-box;
+}
+.generalModel_state .generalModel_state_item .el-cascader .el-cascader__tags,
+.generalModel_state .generalModel_state_item .el-cascader .el-input {
+  height: 100%;
+}
+.generalModel_state .generalModel_state_item .el-cascader .el-input .el-input__wrapper {
+  box-shadow: none;
+  padding: 0;
+  width: 100%;
+}
+.generalModel_state .generalModel_state_item .el-cascader .el-input .el-input__wrapper .el-input__inner {
+  font-size: 1.8rem;
+}
+.generalModel_state .generalModel_state_item .el-cascader:hover {
+  border: 1px solid;
+}
+.generalModel_state .generalModel_state_item .el-cascader__tags {
+  padding-left: 1rem;
+}
+.generalModel_state .generalModel_state_item .el-cascader__tags,
+.generalModel_state .generalModel_state_item .el-cascader__collapse-tag {
+  --el-color-primary: #d9d9d9;
+  --el-cascader-tag-background: #000;
+  --el-fill-color: #e1d9ec;
+  box-sizing: content-box;
+  width: 90% !important;
+  flex-wrap: nowrap;
+  overflow: hidden;
+  align-items: center;
+}
+.generalModel_state .generalModel_state_item .el-cascader__tags .el-tag--light,
+.generalModel_state .generalModel_state_item .el-cascader__collapse-tag .el-tag--light {
+  margin: 0 0 0 0.6rem;
+  padding-right: 0.5rem;
+  height: 70%;
+  --el-icon-size: 1.4rem;
+  display: flex;
+}
+.generalModel_state .generalModel_state_item .el-cascader__tags .el-tag--light .el-tag__content,
+.generalModel_state .generalModel_state_item .el-cascader__collapse-tag .el-tag--light .el-tag__content {
+  font-size: 1.4rem;
+  color: #fff;
+}
+.generalModel_state .generalModel_state_item .el-cascader__tags .el-cascader__search-input,
+.generalModel_state .generalModel_state_item .el-cascader__collapse-tag .el-cascader__search-input {
+  height: 100%;
+}
+.generalModel_state .generalModel_state_item .el-cascader__search-input,
+.generalModel_state .generalModel_state_item .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;
+}
+.generalModel_state .generalModel_state_item .el-cascader__collapse-tag {
+  margin-bottom: 0.5rem;
+}
+.generalModel_state .generalModel_state_item .el-cascader__collapse-tag .el-cascader__collapse-tag .el-tag--light {
+  display: flex !important;
+}
 .generalModel_state .generalModel_current {
   background: #fff;
   width: 100%;
@@ -801,6 +837,13 @@ tr > .ant-picker-cell-in-view.ant-picker-cell-range-hover-start:last-child::afte
 .generalModel_state .header_user_content.active {
   display: block;
 }
+.ant-select-dropdown {
+  border: 1px solid #000;
+  border-radius: 1rem;
+}
+.ant-select-dropdown .ant-select-item-option-selected:not(.ant-select-item-option-disabled) {
+  background-color: #f3f3f6;
+}
 .generalModel {
   -moz-user-select: none;
   -webkit-user-select: none;
@@ -1088,7 +1131,7 @@ tr > .ant-picker-cell-in-view.ant-picker-cell-range-hover-start:last-child::afte
   background: #543087 !important;
 }
 .ant-spin-dot-item {
-  background-color: #543087;
+  background-color: #000000;
 }
 .ant-spin {
   color: #000;
@@ -1169,6 +1212,16 @@ tr > .ant-picker-cell-in-view.ant-picker-cell-range-hover-start:last-child::afte
 .ant-pagination-prev:hover .ant-pagination-item-link,
 .ant-pagination-next:hover .ant-pagination-item-link {
   color: #000;
+  background-color: #fff;
+  border: 1px solid #000;
+}
+.ant-pagination-item:hover {
+  border: 1px solid #000;
+}
+.ant-pagination-prev .ant-pagination-item-link,
+.ant-pagination-next .ant-pagination-item-link {
+  background-color: #000;
+  color: #fff;
 }
 .ant-pagination-item:hover a {
   color: #000;

src/assets/style/style.less

@@ -7,7 +7,7 @@ html,body,#app{
 	overflow: hidden;
 	// --antd-wave-shadow-color: #341e57;
 	--aida-fsize2: calc(2.6rem);
-	--aida-fsize1-8: calc(1.8rem*1.2);
+	--aida-fsize1-8: calc(1.8rem);
 	--aida-fsize1-6: calc(1.6rem);
 	--aida-fsize1-4: calc(1.4rem*1.2);
 	--antd-wave-shadow-color:#39215b;
@@ -272,59 +272,11 @@ input:focus{
 
 
 
-.el-cascader{
+
-	font-size: 1.2rem;
-	width: 100%;
-	height: 3rem;
-	--el-color-primary: #d9d9d9;
-	--el-cascader-tag-background:#e1d9ec;
-	.el-input{
-		height: 100%;
-		.el-input__wrapper{
-			.el-input__inner{
-				height: 80% !important;
-				font-size: 1.2rem;
-			}
-		}
-	}
-}
 .el-popper{
 	padding: .5rem 1.1rem;
 }
-.el-cascader__tags,.el-cascader__collapse-tag{
-	--el-color-primary: #d9d9d9;
-	--el-cascader-tag-background:#e1d9ec;
-	--el-fill-color:#e1d9ec;
-	height: 100%;
-	width: 90% !important;
-	flex-wrap: nowrap;
-	overflow: hidden;
-	align-items: center;
-	.el-tag--light{
-		margin: 0 0 0 .6rem;
-		padding-right: .5rem;
-		height: 80%;
-		--el-icon-size: 1.4rem;
-		display: flex;
-		.el-tag__content{
-			font-size: 1.4rem;
-			color: #000;
 
-		}
-	}
-	.el-cascader__search-input{
-		height: 100%;
-		margin: 0 0 0 1.1rem;
-	}
-}
-.el-cascader__collapse-tag{
-	margin-bottom: .5rem;
-	.el-cascader__collapse-tag{
-		.el-tag--light{
-			display: flex !important;
-		}
-	}
-}
 .hideEvents{
 	pointer-events:none !important;
 	*{
@@ -794,6 +746,18 @@ tr > .ant-picker-cell-in-view.ant-picker-cell-range-hover-start:last-child::afte
 		display: flex;
 		align-items: center;
 		margin-right: 5rem;
+		&.smail{
+			>input{
+				padding: 1rem 2rem !important;
+			}
+			.ant-picker-range,.ant-select-selector,.range_picker{
+				padding: 1rem 2rem !important;
+			}
+			.el-cascader{
+				padding: 1rem 2rem;
+			}
+
+		}
 		>input{
 			height: 2.5rem !important;
 			border-radius: 4rem;
@@ -824,6 +788,7 @@ tr > .ant-picker-cell-in-view.ant-picker-cell-range-hover-start:last-child::afte
 			box-sizing: content-box;
 			background-color: #f3f3f3;
 			width: calc(100% - 4rem);
+			border: 1px solid #000;
 		}
 		.ant-picker-input > input{
 			font-size: 1.8rem;
@@ -838,6 +803,78 @@ tr > .ant-picker-cell-in-view.ant-picker-cell-range-hover-start:last-child::afte
 				}
 			}
 		}
+
+		.el-cascader{
+			font-size: 1.8rem;
+			width: 100%;
+			border: 1px solid #dcdfe6;
+			border-radius: 4rem;
+			background-color: #fff;
+			height: 2.5rem;
+			padding: 2rem;
+			transition: all .3s;
+			box-sizing: content-box;
+			.el-cascader__tags,.el-input{
+				height: 100%;
+			}
+			.el-input{
+				.el-input__wrapper{
+					box-shadow: none;
+					padding: 0;
+					width: 100%;
+					.el-input__inner{
+						font-size: 1.8rem;
+					}
+				}
+			}
+		}
+		.el-cascader:hover{
+			border: 1px solid;
+		}
+		.el-cascader__tags{
+			padding-left: 1rem;
+		}
+		.el-cascader__tags,.el-cascader__collapse-tag{
+			--el-color-primary: #d9d9d9;
+			--el-cascader-tag-background:#000;
+			--el-fill-color:#e1d9ec;
+			box-sizing: content-box;
+			width: 90% !important;
+			flex-wrap: nowrap;
+			overflow: hidden;
+			align-items: center;
+			.el-tag--light{
+				margin: 0 0 0 .6rem;
+				padding-right: .5rem;
+				height: 70%;
+				--el-icon-size: 1.4rem;
+				display: flex;
+				.el-tag__content{
+					font-size: 1.4rem;
+					color: #fff;
+				}
+			}
+			.el-cascader__search-input{
+				height: 100%;
+			}
+		}
+		.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;
+		}
+		.el-cascader__collapse-tag{
+			margin-bottom: .5rem;
+			.el-cascader__collapse-tag{
+				.el-tag--light{
+					display: flex !important;
+				}
+			}
+		}
 	}
 	.generalModel_current{
 		background: #fff;
@@ -869,6 +906,14 @@ tr > .ant-picker-cell-in-view.ant-picker-cell-range-hover-start:last-child::afte
 	}
 }	
 
+//下拉的内容
+.ant-select-dropdown{
+	border: 1px solid #000;
+	border-radius: 1rem;
+	.ant-select-item-option-selected:not(.ant-select-item-option-disabled){
+		background-color: #f3f3f6;
+	}
+}
 
 .generalModel{//自带关闭的页面
 	-moz-user-select: none;
@@ -1192,7 +1237,7 @@ tr > .ant-picker-cell-in-view.ant-picker-cell-range-hover-start:last-child::afte
 }
 //loding样式
 .ant-spin-dot-item{
-    background-color: #543087;
+    background-color: #000000;
 }
 .ant-spin{
 	color: #000;
@@ -1272,8 +1317,20 @@ tr > .ant-picker-cell-in-view.ant-picker-cell-range-hover-start:last-child::afte
 	box-shadow: none;
 }
 .ant-pagination-prev:hover .ant-pagination-item-link,
-.ant-pagination-next:hover .ant-pagination-item-link{
+.ant-pagination-next:hover .ant-pagination-item-link {
-	color: #000;	
+  color: #000;		
+  background-color: #fff;
+  border: 1px solid #000;
+}
+.ant-pagination-item:hover{
+	border: 1px solid #000;
+}
+.ant-pagination-prev,
+.ant-pagination-next{
+	.ant-pagination-item-link{
+		background-color: #000;
+		color: #fff;
+	}
 }
 .ant-pagination-item:hover a{
 	color: #000;	

src/component/Account/frontPage/bindPage.vue

@@ -23,7 +23,7 @@
 					</div>
 					<div class="gmail_btn">
 						<div v-if="!userDetail.accountExtendList?.Google && googleLoad" class="gallery_btn">{{ $t('frontPage.BindNow') }}</div>
-						<div v-else class="gallery_btn loading"><i class="fi fi-br-loading"></i></div>
+						<div v-else-if="!userDetail.accountExtendList?.Google" class="gallery_btn loading"><i class="fi fi-br-loading"></i></div>
 						<div v-show="!userDetail.accountExtendList?.Google" id="g_id_bind"></div>
 						<div v-if="userDetail.accountExtendList?.Google" class="gallery_btn" @click="ungroupGoogleModel">{{ $t('frontPage.Unbind') }}</div>
 					</div>

src/component/HomePage/ExportModel.vue

@@ -169,9 +169,8 @@
 						<div class="shortcutKeys_list_item" v-for="item in keysList" :key="item.name">
 							<div class="name">{{ item.name }}</div>
 							<div class="key">
-								<div>{{ item.winDowKey }}</div>
+								<div v-if="!isWindow">{{ item.macKey }}</div>
-								<span style="margin: 0 1rem">/</span>
+								<div v-else>{{ item.winDowKey }}</div>
-								<div>{{ item.macKey }}</div>
 							</div>
 						</div>
 					</div>
@@ -186,14 +185,14 @@
 			<div class="exportCanvasBox_center_box exportCanvasBox_left">
 				<div class="exportCanvasBox_left_tool exportCanvasBox_title">
 					<div class="exportCanvasBox_left_tool_item">
-						<i class="icon iconfont icon-chehui" @click="historyState('')"></i>
+						<i class="icon iconfont icon-chehui" @click="historyState('')" :title="isWindow?'Ctrl+Z':'Command+Z'"></i>
-						<i class="icon iconfont icon-fanchehui" @click="historyState('reverse')"></i>
+						<i class="icon iconfont icon-fanchehui" @click="historyState('reverse')" :title="isWindow?'Ctrl+Shift+Z':'Command+Ctrl+Z'"></i>
-						<i class="icon iconfont icon-bianji" @click="setOperation('pencil')" :class="{active:operation == 'pencil'}"></i>
+						<i class="icon iconfont icon-bianji" @click="setOperation('pencil')" :class="{active:operation == 'pencil'}" :title="isWindow?'~':'~'"></i>
 						<i class="icon iconfont icon-caizhi" @click="setOperation('texture')" :class="{active:operation == 'texture'}"></i>
-						<i class="icon iconfont icon-move" @click="setOperation('move')" :class="{active:operation == 'move'}"></i>
+						<i class="icon iconfont icon-move" @click="setOperation('move')" :class="{active:operation == 'move'}" :title="isWindow?'M':'M'"></i>
-						<i class="icon iconfont icon-xiangpi_huaban1" @click="setOperation('eraser')" :class="{active:operation == 'eraser'}"></i>
+						<i class="icon iconfont icon-xiangpi_huaban1" @click="setOperation('eraser')" :class="{active:operation == 'eraser'}" :title="isWindow?'~':'~'"></i>
 						
-						<label class="uploadImage">
+						<label class="uploadImage" :title="isWindow?'Ctrl+O':'Command+O'">
 							<i class="fi fi-br-upload" ></i>
 							<input type="file" @change="uploadImage" accept="image/*">
 						</label>
@@ -353,7 +352,7 @@ export default defineComponent({
 		let driver__ = computed(()=>{
 			return store.state.Guide.guide
 		})
-
+		let isWindow = true
         let showUpgradePlan = ref(false);
         let canvas = ref({});
         // let canvasDom = ref()
@@ -414,6 +413,12 @@ export default defineComponent({
 				"likeDesignCollectionList",
 				productData.key,
 			];
+			const userAgent = navigator.userAgent.toLowerCase();
+			if (userAgent.indexOf('windows') !== -1) {
+				isWindow = true
+			}else if(userAgent.indexOf('macintosh') !== -1 || userAgent.indexOf('mac os') !== -1) {
+				isWindow = false
+			}
 			createCanvas()
 		}
 		let setCanvasData = async (oldExportCanvas)=>{
@@ -1290,16 +1295,20 @@ export default defineComponent({
 					setPencilWidth()
 				}else if(keyDown.indexOf('KeyI') > -1){
 					getColor()//吸色
+				}else if(keyDown.indexOf('KeyM') > -1){
+					setOperation('move')
 				}else if(keyDown.indexOf('ControlLeft') > -1 && keyDown.indexOf('KeyD') > -1){
 					canvas.discardActiveObject().renderAll();
 				}else if(keyDown.indexOf('ControlLeft') > -1 && keyDown.indexOf('KeyO') > -1){
 					let input = document.querySelector('.uploadImage input')
 					input.click()
 				}else if(keyDown.indexOf('Backquote') > -1){
-					if(operation.value == 'pencil' || operation.value == 'texture'){
+					// if(operation.value == 'pencil' || operation.value == 'texture'){
-						oldOperation = operation.value
+					let str = 'pencil'
-						setOperation('eraser')
+					if(operation.value == 'pencil')str = 'eraser'
-					}
+					oldOperation = operation.value
+					setOperation(str)
+					// }
 				}
 			}
 		}
@@ -1323,7 +1332,7 @@ export default defineComponent({
 					return event.code !== item;
 				})
 				if(event.code == 'Backquote' && oldOperation){
-					setOperation(oldOperation)
+					// setOperation(oldOperation)
 					oldOperation  = ''
 				}
 			}
@@ -2183,6 +2192,7 @@ export default defineComponent({
 			toSvg,
 			t,
 			toSvg,
+			isWindow,//判断是window还是mac
             showUpgradePlan,//当前弹窗是否打开
             canvasWH,//画布初始宽高
 			pencilbtnStyle,//笔触按钮
@@ -2419,7 +2429,7 @@ export default defineComponent({
 					display: none;
 					position: absolute;
 					z-index: 2;
-					width: 45rem;
+					width: 30rem;
 					max-height: 45rem;
 					background: #f7f8fa;
 					border-radius: 2rem;

src/component/HomePage/Generate.vue

@@ -602,21 +602,15 @@ export default defineComponent({
 			},10000)
 			Https.axiosPost(Https.httpUrls.generatePrepare, data).then(
                 (rv) => {
-					if(data.isTestUser){
+					// if(data.isTestUser){
-						if(rv.leftUsageCount >= 1){
+					// 	if(rv.leftUsageCount >= 1){
-							message.warning(this.t('Generate.jsContent8',{num:rv.leftUsageCount,str:this.t('collectionModal.Moodboard')}));
+					// 		message.warning(this.t('Generate.jsContent8',{num:rv.leftUsageCount,str:this.t('collectionModal.Moodboard')}));
-						}else if(rv.leftUsageCount == 0){
+					// 	}else if(rv.leftUsageCount == 0){
-							message.warning(this.t('Generate.jsContent9',{str:this.t('collectionModal.Moodboard')}));
+					// 		message.warning(this.t('Generate.jsContent9',{str:this.t('collectionModal.Moodboard')}));
-							this.isGenerate = false
+					// 		this.isGenerate = false
-							return
+					// 		return
-						}
+					// 	}
-					}
+					// }
-					// rv.uniqueId.forEach((item:any) => {
-					// 	let arr:any = {}
-					// 	arr.taskId = item
-					// 	arr.status = 'execution'
-					// 	this.fileList.unshift(arr)
-					// });
 					this.setGenerate(rv.uniqueId)
 					
                 }

src/component/HomePage/UpgradePlan.vue

@@ -44,7 +44,7 @@
 				</div>
 			</div>
 		</div>
-		<payMethod ref="payMethod" @completePayment="cancelDsign"></payMethod>
+		<payMethod ref="payMethod" @completePayment="cancelDsign" type="credits"></payMethod>
 
 		<!-- <div v-show="stepNum == 1" class="UpgradePlan_payAffirm">
 			<div class="UpgradePlan_payAffirm_title">{{ $t('upgradePlan.payment') }}</div>
@@ -207,7 +207,8 @@ export default defineComponent({
 			}
 		},
 		payment(){//付款
-			let url = window.location.href 
+			// let url = window.location.href 
+			let url = window.location.origin+'/paySucceed' 
 			// url = url.replace(/\/[^/]+$/, '') + '/home';
 			// console.log(url);
 			let parsedUrl = new URL(url);

src/component/HomePage/renew.vue

@@ -68,7 +68,7 @@
 			</div>
 		</div>
 	</a-modal>
-	<payMethod ref="payMethod" @completePayment="cancelDsign"></payMethod>
+	<payMethod ref="payMethod" @completePayment="cancelDsign" type="renew"></payMethod>
 </template>
 
 <script lang="ts">

src/component/HomePage/scaleImage.vue

@@ -109,7 +109,7 @@
 			<div class="scaleImage_content_imgBox" :class="{active:isComparison}">
 				<img v-if="isComparison" :src="scaleImageList[scaleImageIndex]?.sourceUrl">
 				<generalMiniCanvas v-if="isCanvas" :imgUrl="scaleImageList[scaleImageIndex]?.imgUrl" @submitBase64Data="submitBase64Data"></generalMiniCanvas>
-				<img v-else :src="scaleImageList[scaleImageIndex]?.imgUrl">
+				<img v-else :src="scaleImageList[scaleImageIndex]?.imgUrl || scaleImageList[scaleImageIndex]?.url">
 				
 				<div class="img_operate_block" v-if="isLike">
 					<i v-if="!scaleImageList[scaleImageIndex]?.like" class="fi fi-rr-heart operate_icon" @click.stop="LikeFile(scaleImageList[scaleImageIndex],'like')"></i>
@@ -123,7 +123,7 @@
 			</div>
 			<div class="nav_list" v-mousewheel>
 				<div class="nav_centent">
-					<img  v-for="item,index in scaleImageList" @click="setScaleImageIndex(index)" :class="{active:index == scaleImageIndex}" :src="item?.imgUrl" :key="item.id">
+					<img  v-for="item,index in scaleImageList" @click="setScaleImageIndex(index)" :class="{active:index == scaleImageIndex}" :src="item?.imgUrl || item?.url" :key="item.id">
 				</div>
 			</div>
 			<div class="nav_right">

src/component/Pay/payMethod.vue

@@ -27,23 +27,21 @@
 		</div>
 		<div class="payMethodContent">
 			<div class="generalModelTitle">
-				{{ $t('upgradePlan.PurchasePoints') }}
-			</div>
-			<div class="generalModelInfo">
 				{{ $t('upgradePlan.paymentmethod') }}
 			</div>
 			<div class="payMethod_list">
-				<label class="payMethod_item">
+				<label class="payMethod_item" v-show="$props.type == 'credits'">
 					<input name="payAffirm" type="radio" value="paypal" v-model="modeOfPayment">
 					<img src="../../assets/images/homePage/paypal.svg" alt="">
 					<span>PayPal</span>
 				</label>
 				<label class="payMethod_item">
 					<input name="Stripe" type="radio" value="stripe" v-model="modeOfPayment">
-					<img src="../../assets/images/homePage/bankCard.svg" alt="">
+					<img src="../../assets/images/homePage/stripe.svg" alt="">
-					<span>{{ $t('upgradePlan.CreditCard') }}</span>
+					<!-- <span>{{ $t('upgradePlan.CreditCard') }}</span> -->
+					 <span>Stripe</span>
 				</label>
-				<label class="payMethod_item">
+				<label class="payMethod_item" v-show="$props.type == 'credits'">
 					<input name="payAffirm" type="radio" value="alipay" v-model="modeOfPayment">
 					<img src="../../assets/images/homePage/alipay.svg" alt="">
 					<span>{{ $t('upgradePlan.Alipay') }}</span>
@@ -71,6 +69,9 @@
 			</div>
 			
 		</div>
+		<div class="mark_loading" v-show="isShowMark_">
+			<a-spin size="large" />
+		</div>
 		<div class="mark_loading" v-show="isShowMark" state="true">
 			<div class="mark_loading_title">{{ $t('upgradePlan.completed') }}</div>
 			<div class="mark_loading_intro">{{ $t('upgradePlan.hint') }}</div>
@@ -98,6 +99,12 @@ export default defineComponent({
     components: {
         VerificationCodeInput,
     },
+	props:{
+		type:{
+			type:String,
+			default:''
+		}
+	},
 	emits: ['completePayment'],
     setup(prop,{emit}){
 		const store = useStore();
@@ -114,6 +121,7 @@ export default defineComponent({
 			clause:false,
 			newWindow:null as any,
 			isShowMark:false,
+			isShowMark_:false,
 		})
 		const init = (data:any)=>{
 			payMethod.payMethodModel = true
@@ -123,6 +131,7 @@ export default defineComponent({
 			payMethod.payMethodModel = false
 		}
 		const payAffirm = () => {
+			payMethodData.isShowMark_ = true
 		    if(!payMethodData.clause){
 				let labelDisclaimer:any = payMethodData.labelDisclaimer
 				if(!labelDisclaimer.classList.contains('animation')){
@@ -134,7 +143,7 @@ export default defineComponent({
 				return
 			}
 			let httpsUrl
-			let url = window.location.href 
+			let url = window.location.origin+'/paySucceed' 
 			let payAffirmData = payMethodData.payAffirmData
 			let data = {
 				autoRenewal:true,//false为不自动续费
@@ -177,8 +186,10 @@ export default defineComponent({
 						window.location.href=herf;  
 					}
 					payMethodData.isShowMark = true
+					payMethodData.isShowMark_ = false
 				}
 			).catch(res=>{
+				payMethodData.isShowMark_ = false
 			});
 		}
 		const setPaidBack = ()=>{

src/views/HomeView/HomeView.vue

@@ -101,7 +101,7 @@
 
 							<div class="right_content_body">
 								<div class="right_content_img_block scroll_style Guide_1_17 active" :class="[driver__.driver?'showEvents':'']">
-									<div class="right_content_img_item">
+									<div class="right_content_img_item" ref="designImg">
 										<!-- <draggable 
 											group="people" > -->
 										
@@ -127,10 +127,8 @@
 												)">
 											</div>
 										</div>
-										<div class="content_img_block" v-show="showDesignMark">
+										<div class="content_img_block" v-show="showDesignMark" :style="collStyle">
-											<div class="content_img_flex" >
+											<a-spin size="large"></a-spin>
-												<img class="content_img" src="@/assets/images/homePage/loading.gif" />
-											</div> 
 										</div>
 										<!-- </draggable> -->
 										<div class="content_img_block" :style="collStyle" draggable v-for="(
@@ -376,16 +374,30 @@ export default defineComponent({
 			},
 			collTime:null as any,
 		})
+		let designImg = ref()
 		const setSystemDesigner = (time:any)=>{
 			clearTimeout(collItemSize.collTime)
 			collItemSize.collTime = setTimeout(()=>{
 				let wScale = 60,hScale = 92.5
 				let num = collItemSize.collValue
-				let {width,height} = collItemSize.collStyle
+				let width = wScale * ((num<20?20:num) / 100)
-				collItemSize.collStyle.width = wScale * ((num<20?20:num) / 100) + 'rem'
+				let height =hScale * ((num<20?20:num) / 100)
-				collItemSize.collStyle.height = hScale * ((num<20?20:num) / 100) + 'rem'
+				collItemSize.collStyle.width = width + 'rem'
+				collItemSize.collStyle.height = height + 'rem'
+				setDesignImgWidth()
 			},time)
 		}
+		const setDesignImgWidth = ()=>{
+			nextTick(()=>{
+				let width = designImg.value.parentElement.offsetWidth
+				let sonDom = designImg.value.querySelectorAll('div')[0]
+				if(Math.floor(width / (sonDom.offsetWidth+10 + 1)) > (likeDesignCollectionList.value.length + designCollectionList.value.length)){
+					designImg.value.style.width = 100+'%'
+				}else{
+					designImg.value.style.width = Math.floor(width / (sonDom.offsetWidth+10 + 1)) * (sonDom.offsetWidth + 10 + 1) + 'px'
+				}
+			})
+		}
 		setSystemDesigner(0)
 		return {
 			store,
@@ -410,6 +422,8 @@ export default defineComponent({
 			portfolio,
 			setSystemDesigner,
 			...toRefs(collItemSize),
+			designImg,
+			setDesignImgWidth,
 		};
 	},
 	data() {
@@ -744,6 +758,7 @@ export default defineComponent({
 						await new Promise((resolve, reject) => {
 							setTimeout(() => {
 								this.designCollectionList.unshift(item)
+								this.setDesignImgWidth()
 								resolve('')
 							}, 200);
 						})
@@ -1131,6 +1146,7 @@ export default defineComponent({
 					likeDesignCollectionList
 				);
 			}
+			this.setDesignImgWidth()
 		},
 
 		//统一处理选择组的渲染数据
@@ -1544,6 +1560,7 @@ export default defineComponent({
 								align-items: center;
 								// padding-bottom: 1rem;
 								overflow-x: auto;
+								justify-content: center;
 								&.active::-webkit-scrollbar-button:single-button{
 									display: none;
 								}
@@ -1586,8 +1603,8 @@ export default defineComponent({
 									width: 24rem;
 									height: 37rem;
 									// height: 29.5rem;
-									margin-right: 1rem;
+									box-sizing: border-box;
-									margin-bottom: 1rem;
+									margin: 5px;
 									// min-height: 271px;
 									max-height: 100%;
 
@@ -1596,6 +1613,9 @@ export default defineComponent({
 									vertical-align: top;
 									flex-shrink: 0;
 									max-height: 100%;
+									display: flex;
+									align-items: center;
+									justify-content: center;
 									&:hover .icon_like,&:hover .icon_delete {
 										display: block;
 									}

src/views/HomeView/library.vue

@@ -36,68 +36,80 @@
 							   <div v-show="selectCode != 'Models' &&  selectCode != 'DesignElements'" class='header_operate_item pointer'  :class="{operate_select:uploadGenerate == 'Generate'}" @click="uploadGenerateOpen('Generate')">{{ $t('LibraryPage.Generate') }}</div>
                             </div>
 
-                            <div class="librart_headr_right">
+                            <div class="librart_headr_right ">
-                                <div class="select_block" v-show="selectCode == 'Sketchboard' || selectCode == 'Models'|| selectCode == 'DesignElements'|| selectCode == 'Printboard'" >
+                                <div class="generalModel_state " v-show="selectCode == 'Sketchboard' || selectCode == 'Models'|| selectCode == 'DesignElements'|| selectCode == 'Printboard'" >
-									<a-select
+									<div class="generalModel_state_item smail" v-if="selectCode != 'DesignElements' && selectCode != 'Printboard'">
-                                        ref="select"
+										<a-select
-										v-show="selectCode != 'DesignElements' && selectCode != 'Printboard'"
+											ref="select"
-                                        v-model:value="sex"
+											v-model:value="sex"
-                                        :options="sexList"
+											:options="sexList"
-										:fieldNames="{ label: 'name', value: 'value' }"
+											size="large"
-                                        @change="sexChange"
+											:fieldNames="{ label: 'name', value: 'value' }"
-                                    >
+											style="width:20rem"
-                                        <template #suffixIcon
+											@change="sexChange"
-                                            ><span
+										>
-                                                class="icon iconfont icon-xiala"
+											<template #suffixIcon
-                                                style="color: #343579"
+												><span
-                                            ></span
+													class="icon iconfont icon-xiala"
-                                        ></template>
+													style="color: #343579"
-                                    </a-select>
+												></span
-                                    <a-select
+											></template>
-                                        ref="select"
+										</a-select>
-										v-show="designTypeList[selectCode]?.[0]?.value && selectCode != 'Sketchboard'"
+									</div>
-                                        v-model:value="designType"
+									<div class="generalModel_state_item smail" v-if="designTypeList[selectCode]?.[0]?.value && selectCode != 'Sketchboard'">
-                                        :options="designTypeList[selectCode]"
+										<a-select
-                                        @change="handleChange"
+											ref="select"
-										:fieldNames="{ label: 'name', value: 'value' }"
+											v-model:value="designType"
-                                    >
+											:options="designTypeList[selectCode]"
-                                        <template #suffixIcon
+											@change="handleChange"
-                                            ><span
+											style="width:20rem"
-                                                class="icon iconfont icon-xiala"
+											size="large"
-                                                style="color: #343579"
+											:fieldNames="{ label: 'name', value: 'value' }"
-                                            ></span
+										>
-                                        ></template>
+											<template #suffixIcon
-                                    </a-select>
+												><span
-									<a-select
+													class="icon iconfont icon-xiala"
-                                        ref="select"
+													style="color: #343579"
-										v-show="designTypeList[selectCode]?.[0]?.value && selectCode == 'Sketchboard' && uploadGenerate != 'Generate'"
+												></span
-                                        v-model:value="designType"
+											></template>
-                                        :options="designTypeList[selectCode]"
+										</a-select>
-                                        @change="handleChange"
+									</div>
-										:fieldNames="{ label: 'name', value: 'value' }"
+									<div class="generalModel_state_item smail" v-if="designTypeList[selectCode]?.[0]?.value && selectCode == 'Sketchboard' && uploadGenerate != 'Generate'">
-                                    >
+										<a-select
-                                        <template #suffixIcon
+											ref="select"
-                                            ><span
+											v-model:value="designType"
-                                                class="icon iconfont icon-xiala"
+											:options="designTypeList[selectCode]"
-                                                style="color: #343579"
+											@change="handleChange"
-                                            ></span
+											style="width:20rem"
-                                        ></template>
+											size="large"
-                                    </a-select>
+											:fieldNames="{ label: 'name', value: 'value' }"
-									<a-select
+										>
-                                        ref="select"
+											<template #suffixIcon
-										v-show="SketchGenerateTypeList?.[0]?.value && selectCode == 'Sketchboard' && uploadGenerate == 'Generate'"
+												><span
-                                        v-model:value="SketchGenerateType"
+													class="icon iconfont icon-xiala"
-                                        :options="SketchGenerateTypeList"
+													style="color: #343579"
-                                        @change="setSketchGenerateType"
+												></span
-										:fieldNames="{ label: 'name', value: 'value' }"
+											></template>
-                                    >
+										</a-select>
-                                        <template #suffixIcon
+									</div>
-                                            ><span
+									<div class="generalModel_state_item smail" v-if="SketchGenerateTypeList?.[0]?.value && selectCode == 'Sketchboard' && uploadGenerate == 'Generate'">
-                                                class="icon iconfont icon-xiala"
+										<a-select
-                                                style="color: #343579"
+											ref="select"
-                                            ></span
+											v-model:value="SketchGenerateType"
-                                        ></template>
+											:options="SketchGenerateTypeList"
-                                    </a-select>
+											@change="setSketchGenerateType"
+											style="width:20rem"
+											size="large"
+											:fieldNames="{ label: 'name', value: 'value' }"
+										>
+											<template #suffixIcon
+												><span
+													class="icon iconfont icon-xiala"
+													style="color: #343579"
+												></span
+											></template>
+										</a-select>
+									</div>
                                 </div>
                             </div>
                         </div>
@@ -128,13 +140,16 @@
 											<div :class="['header_operate_item' , 'fontSize',selectImgList.length>0?'active':'']" @click="deleteBatchPic()">{{ $t('LibraryPage.Delete') }}</div>
 											<div :class="['header_operate_item' , 'fontSize',selectImgList.length>0?'active':'']" @click="showRenameModal(selectImgList,'batch')">{{ $t('LibraryPage.Rename') }}</div>
 										</div>
-										<div class="content_search_block">
+										<div class="content_search_block generalModel_state">
-											<input 
+											<div class="generalModel_state_item smail">
-											class="search_input" 
+												<input 
-											:placeholder="$t('LibraryPage.inputContent1')" 
+												class="search_input" 
-											v-model="searchPictureName"  
+												style="background-color: #fff;"
-											@keydown.enter="getLibraryList('')">
+												:placeholder="$t('LibraryPage.inputContent1')" 
-											<div class="search_cascader">
+												v-model="searchPictureName"  
+												@keydown.enter="getLibraryList('')">
+											</div>
+											<div class="generalModel_state_item search_cascader smail">
 												<el-cascader 
 													:options="options" 
 													filterable
@@ -162,13 +177,14 @@
 												<div :title="$t('LibraryPage.intersection')" @click="()=>intersection = 0" v-show="intersection == 1" :class="['icon', 'iconfont','icon-bingji1',]"></div>
 											</div>
 											<!-- <div class="search_icon_block" @click="getLibraryList('')"><span class="icon iconfont icon-sousuo"></span></div> -->
-											<div class="generage_btn search_icon_block" @click="getLibraryList('')"><span class="icon iconfont icon-sousuo"></span></div>
+											<div class="gallery_btn" style="padding: 1rem; line-height: 1;" @click="getLibraryList('')"><span class="icon iconfont icon-sousuo"></span></div>
+										</div>
+										<div v-show="imgList.length" :class="['check_all_block',selectImgList.length == imgList.length ? 'check_all' : '']" @click="selectAllImg()">
+											<div class="check_block"><div class="check_block_body" v-show="selectImgList.length == imgList.length && imgList.length"></div></div>
+											<div>{{ $t('LibraryPage.all') }}</div>
 										</div>
 									</div>
-                                    <div v-show="imgList.length" :class="['check_all_block',selectImgList.length == imgList.length ? 'check_all' : '']" @click="selectAllImg()">
+                                    
-                                        <div class="check_block"><div class="check_block_body" v-show="selectImgList.length == imgList.length && imgList.length"></div></div>
-                                        <div>{{ $t('LibraryPage.all') }}</div>
-                                    </div>
                                 </div>
 
                                 <div class="content_body_table scroll_style">
@@ -185,6 +201,9 @@
                                                     </div>
                                                     <div class="img_operate_block" :title="t('LibraryPage.Delete')" @click.stop="deleteSinglePic(img,index)">
                                                         <span class="icon iconfont icon-shanchu operate_icon"></span>
+                                                    </div>
+													<div class="img_operate_block">
+														<i class="fi fi-bs-expand-arrows-alt" @click.stop="scaleImage(index,imgList,'library')"></i>
                                                     </div>
                                                 </div>
                                             </div>
@@ -391,16 +410,14 @@
 													<div class="img_operate_block" :title="t('LibraryPage.Delete')" @click.stop="deleteGenerate(index)">
                                                         <span class="icon iconfont icon-shanchu operate_icon"></span>
                                                     </div>
-                                                </div>
-												<div class="img_operate_content left"  :class="[driver__.driver?'hideEvents':'']">
 													<div class="img_operate_block">
-														<i class="fi fi-bs-expand-arrows-alt" @click.stop="scaleImage(index)"></i>
+														<i class="fi fi-bs-expand-arrows-alt" @click.stop="scaleImage(index,generateList[selectCode],'generate')"></i>
                                                     </div>
 													<div class="img_operate_block">
 														<i v-if="!img.like" class="fi fi-rr-heart operate_icon" @click.stop="likeFile(img,'like')"></i>
 														<i v-else class="fi fi-sr-heart operate_icon" :adminLike="!!img.like" @click.stop="likeFile(img,'noLike')"></i>
                                                     </div>
-												</div>
+                                                </div>
                                             </div>
 											<sketchCategory  v-show="selectCode == 'Sketchboard'" :disignTypeList="designTypeList[selectCode]" :generateList="generateList['Sketchboard']" :item="img"></sketchCategory>
                                         </div>
@@ -441,6 +458,7 @@ import ModelPlacement from '@/component/LibraryPage/ModelPlacement.vue';
 import setLabel from '@/component/LibraryPage/setLabel.vue';
 import ModelPlacementMobile from '@/component/LibraryPage/ModelPlacementMobile.vue';
 import searchLabel from '@/component/LibraryPage/searchLabel.vue';
+
 // import RobotAssist from "@/component/HomePage/RobotAssist.vue";
 import { Modal,message,Upload,CascaderProps } from 'ant-design-vue';
 import { ExclamationCircleOutlined } from '@ant-design/icons-vue';
@@ -1293,7 +1311,6 @@ export default defineComponent({
             placementModal.showPlacementModal(data,this.sex)
         },
 		setTextareaShow(){
-			this.isTextarea = !this.isTextarea
 			this.isTextarea = !this.isTextarea
 			if(this.isTextarea){
 				document.addEventListener('click',this.setTextareaShow)
@@ -1522,14 +1539,14 @@ export default defineComponent({
 						}else if(selectCodeStr == 'Sketchboard'){
 							str = this.t('collectionModal.Sketchboard')
 						}
-						if(rv.leftUsageCount >= 1){
+						// if(rv.leftUsageCount >= 1){
-							message.warning(this.t('Generate.jsContent8',{num:rv.leftUsageCount,str:str}));
+						// 	message.warning(this.t('Generate.jsContent8',{num:rv.leftUsageCount,str:str}));
-						}else if(rv.leftUsageCount == 0){
+						// }else if(rv.leftUsageCount == 0){
-							message.warning(this.t('Generate.jsContent9',{str:str}));
+						// 	message.warning(this.t('Generate.jsContent9',{str:str}));
-							this.isGenerate[selectCodeStr] = false
+						// 	this.isGenerate[selectCodeStr] = false
-							// this.isShowMark = false
+						// 	// this.isShowMark = false
-							return
+						// 	return
-						}
+						// }
 					}
 					this.setGenerate(selectCodeStr,rv.uniqueId)
 					
@@ -1671,10 +1688,11 @@ export default defineComponent({
 			
 
 		},
-		scaleImage(index:any){
+		scaleImage(index:any,list:any,str:any){
 			let scaleImage:any = this.$refs.scaleImage
 			scaleImage.scaleImageMask = true
-			scaleImage.init(this.generateList[this.selectCode],index)
+			str == 'library'?scaleImage.isLike = false:scaleImage.isLike = true
+			scaleImage.init(list,index)
 		},
 		onPaste(e:any){
 			if(e.clipboardData.items[0] && !this.isTextarea && this.selectCode !== 'Moodboard' && this.scene?.value != 'Slogan' && this.scene?.value != 'Logo'){
@@ -1748,29 +1766,27 @@ export default defineComponent({
 				}
                 .library_body_left{
                     // width: 27.5rem;
-					width: 36.5rem;
+					// width: 36.5rem;
+					width: 23rem;
                     height: 100%;
-                    background: rgba(255,255,255,0.4);
+					margin-right: 3rem;
-					margin-right: 5rem;
+					background: #f7f8fa;
 					>div{
-						background: #f7f8fa;
 						border-radius: 2rem;
 						overflow: hidden;
 						padding: 2rem 0;
 					}
                     .library_menu_list{
-						padding-left: 2rem;
                         .menu_item{
                             width: 100%;
-                            height: 6.8rem;
                             display: flex;
 							font-weight: 900;
                             align-items: center;
                             justify-content: space-between;
-                            padding: 0 1rem 0 2.5rem;
+                            padding: 1rem 3rem;
                             border-left: 0.5rem solid transparent;
                             // font-size: 1.6rem;
-							font-size: var(--aida-fsize2);
+							font-size: var(--aida-fsize1-8);
                             color: #030303;
                             cursor: pointer;
 							transition: all .3s;
@@ -1780,11 +1796,8 @@ export default defineComponent({
                             }
 
                             &.select_menu_item{
-                                background: #fff;
+                                background: #000;
-								border-radius: 2rem;
+								color: #fff;
-								transform: translateX(2rem);
-                                // background: #E6E6F6;
-                                // border-color: #343579;;
                             }
 
                             .menu_item_left{
@@ -1795,7 +1808,6 @@ export default defineComponent({
                                 .fi{
                                     font-size: 2.2rem;
 									display: flex;
-                                    color: #030303;
                                     margin-right: 1.8rem;
                                 }
                             }
@@ -1842,55 +1854,25 @@ export default defineComponent({
 							cursor: pointer;
 						}
 						&:last-child{
-							margin-right: 11rem;
+							margin-right: 7rem;
 						}
 					}
 
 					.content_search_block{
-						display: flex;
+						// width: 85rem; 
-						align-items: center;
+						margin-left: auto;
-						width: 75rem; 
-						.search_input{
-							height: 3rem;
-							border-radius: 0.5rem;
-							width: 20rem;
-							border: 1px solid rgba(0, 0, 0, 0.15);
-							padding-left: 1.5rem;
-							border: 0.1rem solid #F1F1F1;
-							font-size: 1.2rem;
-							font-weight: 400;
-							margin-right: 2rem;
-							&::placeholder {
-								color: #C2C2C2;
-							}
-						}
 
+						.generalModel_state_item,.gallery_btn{
+							margin-right: 3rem;
+						}
 						.search_cascader{
 							// width: 53%;
-							width: 38rem;
+							width: 37rem;
-							display: flex;
-							position: relative;
-							
-							
-						}
-						.search_icon_block{
-							width: 5.2rem;
-							height: 2.8rem;
-							line-height: 2.8rem;
-							text-align: center;
-							background: #343579;
-							background-color: #39215b;
-							cursor: pointer;
-							border-radius: 2rem;
-							margin-left: 3rem;
-							.icon-sousuo{
-								font-size: 1.6rem;
-								color: #FFFFFF;
-							}
 						}
 						.intersection{
-							margin-left: 3rem;
 							cursor: pointer;
+							margin-right: 3rem;
+							font-size: 3rem;
 						}
 						
 					}
@@ -1899,10 +1881,9 @@ export default defineComponent({
                         display: flex;
                         padding: 0 3.5rem 0 2.8rem;
                         align-items: center;
-                        justify-content: space-between;
                         background: rgba(255,255,255,0.4);
                         box-shadow: 0 0.2rem 0.8rem 0 rgba(238,238,244,0.25);
-
+						margin-bottom: 3rem;
                         .library_header_left{
                             height: 4rem;
                             display: flex;
@@ -1910,30 +1891,15 @@ export default defineComponent({
 
                            
                         }
-
-						 
-
                         .librart_headr_right{
                             display: flex;
                             align-items: center;
-                            .select_block{
+							.generalModel_state_item{
-                                // background: #FFFFFF;
+								margin-right: 2rem;
-                                color: #1A1A1A !important;
 								.ant-select-selector{
-									border: 2px solid !important;
+									background: #fff;
 								}
-								.ant-select{
+							}
-									.ant-select-arrow{
-										.icon-xiala{
-											margin-left: -2rem;
-											zoom: .7;
-										}
-									}
-								}
-                                .icon-xiala{
-                                    color: #1A1A1A !important;
-                                }
-                            }
                         }
                     }
 
@@ -1947,23 +1913,24 @@ export default defineComponent({
                             width: 100%;
                             height: 100%;
                             background: #f6f5fa;
-                            padding: 0 2rem 5rem 1rem;
+							padding: 2rem 4rem;
 							border-radius: 2rem;
 							overflow: hidden;
 							display: flex;
 							flex-direction: column;
                             .content_body_header{
-                                height: 10rem;
+                                // height: 10rem;
+								margin-bottom: 1rem;
                                 display: flex;
                                 justify-content: flex-end;
                                 align-items: center;
 								// padding: 2rem 0 2rem 3rem;
-								padding-left: 3rem;
 								box-sizing: content-box;
 								justify-content: space-between;
 								.content_body_header_left{
 									display: flex;
 									align-items: center;
+									width: 100%;
 								}
 								.content_body_header_right{
 									display: flex;
@@ -2017,10 +1984,10 @@ export default defineComponent({
 										padding-bottom: 0;
 										background: rgba(0, 0, 0, 0);
 										width: 55rem;
+										--width:65%;
 										.input_box_btnBox{
 											background: #fff;
 											align-items: center;
-											width:65%;
 											.search_input{
 												height: 3rem;
 											}
@@ -2099,12 +2066,15 @@ export default defineComponent({
 
                                             .img_operate_content{
                                                 position: absolute;
-                                                right: 0.6rem;
+												top: 50%;
-                                                top: 0.6rem;
+												left: 50%;
-												&.left{
+												transform: translate(-50%,-50%);
-													left: 0.6rem;
+												max-width: 90%;
-													right: auto;
+												display: flex;
-													
+												flex-wrap: wrap;
+												>div{
+													margin-bottom: .5rem;
+													margin-right: .5rem;
 												}
                                             }
                                             .img_operate_block{
@@ -2202,37 +2172,6 @@ export default defineComponent({
                     color:#adabb9
                 }
             }
-			.select_block{
-				display: flex;
-				justify-content: space-between;
-                font-size: 1.8rem;
-				color:#adabb9;
-				font-weight: 300;
-				.ant-select{
-					border-radius: 4px;
-					width: 48%;
-					border: 0.1rem solid #d9d9d9 !important;
-					.ant-select-arrow{
-						.icon-xiala{
-							margin-left: -0rem;
-						}
-					}
-				}
-				.ant-select-selection-item{
-					color:#262626;
-					font-weight: 300;
-				}
-				.ant-select-selector{
-					margin-left: 0rem;
-					color:#adabb9;
-					width: 100%;
-					padding-left: 2.1rem;
-				}
-				.icon-xiala{
-					color: #adabb9 !important;
-					font-weight: 400;
-				}
-			}
         }
 
         .rename_button_list{
@@ -2261,31 +2200,7 @@ export default defineComponent({
                 color: #FFFFFF;
             }
         }
-		.el-cascader{
-			.el-input--suffix{
-			--el-input-hover-border-color: #d9d9d9;
-				// border: .1rem solid #d9d9d9;
-			}
-			height: 4.6rem;
-			.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;
-			}
-		}
 
         
     }

src/views/LoginPage.vue

@@ -564,7 +564,6 @@ export default defineComponent({
 				}
 				if(rv.email)userid.email = rv.email
 				this.store.commit("upUserDetail", userid);
-				this.store.commit("setSystemUser", rv.systemUser);
 				
 				if (window.innerWidth < 768) {
 					message.info(