付款页面新增按钮

src/component/HomePage/Generate.vue

@@ -923,7 +923,7 @@ export default defineComponent({
             this.searchPictureName = "";
         },
 		onPaste(e:any){
-			if(e.clipboardData.items[0] && !this.isTextarea && this.upload.level1Type !== 'Moodboard' && this.scene?.value != 'Slogan' && this.scene?.value != 'Logo'){
+			if(e.clipboardData.files[0] && !this.isTextarea && this.upload.level1Type !== 'Moodboard' && this.scene?.value != 'Slogan' && this.scene?.value != 'Logo'){
 				let param = new FormData(); 
 				param.append('inPin','0')
 				param.append('gender',this.upload.gender)

src/component/HomePage/bindEmail.vue

@@ -1,12 +1,12 @@
 <template>
-	<div ref="register"></div>
+	<div ref="register" class="bindEmail"></div>
 	<a-modal
 		class="register generalModel"
 		:get-container="() => $refs.register"
 		v-model:visible="registerModel"
 		:footer="null"
 		:width="pageWidth"
-		:height="bindType == 'Modify'?'60rem':'70rem'"
+		:height="bindType == 'Modify'?'60rem':'80rem'"
 		:maskClosable="false"
 		:centered="true"
 		:closable="false"
@@ -26,7 +26,7 @@
 		<div class="generalModel_btn back" v-if="bindType != 'Modify'">
 			<div class="generalModel_closeIcon" @click.stop="setBack()">
 				<span>←</span>
-				<span class="back_text">Back</span>
+				<span class="back_text">{{ $t('account.back') }}</span>
 			</div>
 		</div>
 		<div class="login_page">
@@ -41,25 +41,43 @@
 									'login_active',
 								]"
 							>
-								<span v-if="bindType == 'Modify'">Modify Email</span>
-								<span v-else>Bind personal information</span>
+								<span v-if="bindType == 'Modify'">{{ $t('account.ModifyEmail') }}</span>
+								<span v-else>{{ $t('account.information') }}</span>
 							</div>
 						</div>
 						<!-- 账号密码登录 start -->
 						<!-- v-show="login$props.Type == 'username'" -->
 						<div >
 							<div class="login_form_content" :state="emailStap">
-								<div class="login_form_title marign_top30">Email</div>
+								<div class="login_form_title marign_top30">{{ $t('account.Email') }} <span class="must">*</span></div>
 								<input
 									class="login_form_input"
 									:class="{active:(userDetail.email !== '-------------') && bindType != 'Modify'}"
-									placeholder="Enter your email address"
+									:placeholder="$t('account.plaseEmail')"
 									v-model="email"
 									:disabled="(userDetail.email !== '-------------') && bindType != 'Modify'"								
 									@keydown.enter="submitPerLogin()"
 								/>
+								
 								<div v-if="bindType != 'Modify'">
-									<div class="login_form_title marign_top30">{{$t('account.Country')}}:</div>
+									<div class="login_form_title marign_top30">{{ $t('account.Name') }}<span class="must">*</span></div>
+									<div style="display: flex;justify-content: space-between;">
+										<a-select
+											class="gallerySelect"
+											v-model:value="selectSex"
+											:disabled="!!userDetail.title"
+											size="large"
+											optionFilterProp="label"
+											style="width: 30%;"
+											:options="sexList"
+											:placeholder="$t('account.plaseSelectSex')"
+											allowClear
+											show-search
+										></a-select>
+										<input class="login_form_input" style="width: 30%;" :class="{active:!!userDetail.surname}" :disabled="!!userDetail.surname" type="text" :placeholder="$t('account.plaseFirst')" v-model="surname">
+										<input class="login_form_input" style="width: 30%;" :class="{active:!!userDetail.givenName}" :disabled="!!userDetail.givenName" type="text" :placeholder="$t('account.plaseLast')" v-model="givenName">
+									</div>
+									<div class="login_form_title marign_top30">{{$t('account.Country')}}:<span class="must">*</span></div>
 									<div class="login_form_select">
 										<a-select
 											class="gallerySelect"
@@ -69,14 +87,14 @@
 											optionFilterProp="label"
 											style="width: 100%;"
 											:options="countryList"
-											placeholder="Please select"
+											:placeholder="$t('account.plaseCountry')"
 											allowClear
 											show-search
 										></a-select>
 									</div>
 									
-									<div class="login_form_title marign_top30">{{$t('account.CompanyName')}}:</div>
-									<input class="login_form_input" :class="{active:!!userDetail.occupation}" :disabled="!!userDetail.occupation" type="text" placeholder="Please enter occupation" v-model="CompanyName">
+									<div class="login_form_title marign_top30">{{$t('account.CompanyName')}}:<span class="must">*</span></div>
+									<input class="login_form_input" :class="{active:!!userDetail.occupation}" :disabled="!!userDetail.occupation" type="text" :placeholder="$t('account.plaseCompanyName')" v-model="CompanyName">
 								</div>
 						
 							<!-- 邮箱登录 start -->
@@ -157,7 +175,7 @@ export default defineComponent({
 		const bindType = ''
 		const router = useRouter()
         let timer:any =  0;
-		const {locale} = useI18n()
+		const {locale,t} = useI18n()
 		const store = useStore();
 		let userDetail:any= computed(()=>{
 			return store.state.UserHabit.userDetail
@@ -171,6 +189,15 @@ export default defineComponent({
 		let userEmail = computed(()=>{
 			return store.state.UserHabit.userDetail.email
 		})
+		let userSex = computed(()=>{
+			return store.state.UserHabit.userDetail.title
+		})
+		let userSurname = computed(()=>{
+			return store.state.UserHabit.userDetail.surname
+		})
+		let userGivenName = computed(()=>{
+			return store.state.UserHabit.userDetail.givenName
+		})
 		let register = reactive({
 			registerModel:computed(()=>{
 				return store.state.UserHabit.bindEmail.isBindEmail
@@ -180,10 +207,20 @@ export default defineComponent({
 			}),
 			registerModelMask:true,
 			pageWidth:'45%',
-			Country:'',
+			Country:null,
 			CompanyName:'',
 			countryList:country,
 			email:'',
+			sexList:computed(()=> {
+				return [
+					{label:t('account.Mr'),value:'Mr'},
+					{label:t('account.Ms'),value:'Ms'},
+					{label:t('account.Miss'),value:'Miss'},
+				]
+			}),
+			selectSex:null,
+			surname:'',
+			givenName:'',
 		})
 		watch(userCountry,(newValue,oldValue)=>{
 			register.Country = newValue
@@ -194,6 +231,15 @@ export default defineComponent({
 		watch(userEmail,(newValue:any,oldValue)=>{
 			register.email = newValue == '-------------'?'':newValue
 		})
+		watch(userSex,(newValue,oldValue)=>{
+			register.selectSex = newValue
+		})
+		watch(userSurname,(newValue,oldValue)=>{
+			register.surname = newValue
+		})
+		watch(userGivenName,(newValue,oldValue)=>{
+			register.givenName = newValue
+		})
         return{
 			router,
 			store,
@@ -294,6 +340,18 @@ export default defineComponent({
 					message.info("Please select a country");
 					return;
 				}
+				if (!this.selectSex && this.bindType != 'Modify') {
+					message.info("Please select a title");
+					return;
+				}
+				if (!this.surname && this.bindType != 'Modify') {
+					message.info("Please select a surname");
+					return;
+				}
+				if (!this.givenName && this.bindType != 'Modify') {
+					message.info("Please select a givenName");
+					return;
+				}
 				let type = 'BIND_MAILBOX'
 				if(this.email == this.userDetail.email && this.bindType != 'Modify')type = 'UPDATE_USERINFO'
 				let data = {
@@ -301,7 +359,10 @@ export default defineComponent({
 					"ip": "",
 					"operationType": type,
 					occupation:this.CompanyName,
-					country:this.Country
+					country:this.Country,
+					title:this.selectSex,
+					surname:this.surname,
+					givenName:this.givenName,
 				};
 				if(this.loginTime){
 					this.loginTime = false
@@ -402,6 +463,11 @@ export default defineComponent({
 }
 </style>
 <style lang="less" scoped>
+.bindEmail{
+	:deep(.ant-modal-mask){
+		background: #666666db;
+	}
+}
 .generalModel_btn{
 	&.back{
 		.generalModel_closeIcon{
@@ -414,6 +480,7 @@ export default defineComponent({
 			transform: translate(100%, 100%);
 			.back_text{
 				text-decoration: underline;
+				white-space: nowrap;
 			}
 			span{
 				margin-right: .5rem;
@@ -497,6 +564,12 @@ export default defineComponent({
                     display: flex;
                     justify-content: space-between;
                     box-sizing: border-box;
+					> .must{
+						color: red;
+						margin-right: auto;
+						margin-left: 2px;
+						margin-top: -1%;
+					}
 					label{
 						display: flex;
 						span{
@@ -542,6 +615,7 @@ export default defineComponent({
 						height: 5rem;
 						border: 0.1rem solid #dfdfdf;
 						border-radius: 2.5rem;
+						align-items: center;
 					}
 					:deep(.ant-select-selector):hover{
 						border: 0.1rem solid #000;

src/component/HomePage/generalMenu.vue

@@ -201,6 +201,7 @@ import { message, Upload, Modal } from "ant-design-vue";
  //衣服类型下拉菜单
  .generalMenu_printModel{
 		margin-right: 2rem;
+		height: 6rem;
 		.icon-xiala{
 			margin-left: auto;
 			transition: all .3s;
@@ -221,6 +222,9 @@ import { message, Upload, Modal } from "ant-design-vue";
 			display: flex;
 			font-size: 1.8rem;
 			justify-content: space-around;
+			height: 100%;
+			box-sizing: border-box;
+			align-items: center;
 			> span{
 				white-space: nowrap; 
 				overflow: hidden;

src/component/HomePage/renew.vue

@@ -31,11 +31,11 @@
 				{{ $t('Renew.title') }}
 			</div>
 			<div class="renew_detail">
-				<div class="name generalModelTitle">{{ current.title }}</div>
+				<div class="name generalModelTitle">{{ current?.title }}</div>
 				<div class="price_box">
 					<div class="price">
 						<sub>$</sub>
-						{{ current.price[current.type] }} <span>{{ current.unit[current.type] }}</span>
+						{{ current?.price[current?.type] }} <span>{{ current?.unit[current?.type] }}</span>
 					</div>
 					<div class="type" v-if="current.typeList.length > 1">
 						<label>
@@ -47,7 +47,13 @@
 							{{ $t('Renew.Yearly') }}
 						</label>
 					</div>
-					<div class="info">{{ current.info }}</div>
+					<div class="autoRenewal">
+						<label>
+							{{ current.autoRenewal.text }} : 
+							<a-switch v-model:checked="current.autoRenewal.value" />
+						</label>
+					</div>
+					<div class="info">{{ current?.info }}</div>
 				</div>
 				<div class="gallery_btn gallery_btn_radius" @click="payment">{{ $t('Renew.SubscribeNow') }}</div>
 			</div>
@@ -73,7 +79,7 @@
 </template>
 
 <script lang="ts">
-import { defineComponent,ref,reactive,toRefs ,onMounted} from "vue";
+import { defineComponent,computed,reactive,toRefs ,onMounted} from "vue";
 import { message } from "ant-design-vue";
 import payMethod from "@/component/Pay/payMethod.vue";
 import { useStore } from "vuex";
@@ -92,22 +98,47 @@ export default defineComponent({
 			pageWidth:'50%'
 		})
 		let renewData = reactive({
-			personage:{
-				title:t('Renew.PersonalVersion'),
-				price:{
-					monthly:'500',
-					year:'5,000',
-				},
-				unit:{
-					monthly:t('Renew.HKDMonth'),
-					year:t('Renew.HKDYear'),
-				},
-				type:'monthly',
-				typeList:['monthly','year'],
-				info:'Tax, VAT not included.',
-			},
-			firm:{
-				title:'Education Edition',
+			personage:computed(()=>{
+			    return {
+					title:t('Renew.PersonalVersion'),
+					price:{
+						monthly:'500',
+						year:'5,000',
+					},
+					unit:{
+						monthly:t('Renew.HKDMonth'),
+						year:t('Renew.HKDYear'),
+					},
+					type:'monthly',
+					autoRenewal:{
+						text:t('Renew.automatically'),
+						value:true,
+					},
+					typeList:['monthly','year'],
+					info:'Tax, VAT not included.',
+				}
+			}),
+			firm:computed(()=>{
+			    return {
+					title:'Education Edition',
+					price:{
+						year:'500',
+					},
+					unit:{
+						year:'HKD / Year',
+					},
+					type:'year',
+					autoRenewal:{
+						text:t('Renew.automatically'),
+						value:true,
+					},
+					typeList:['year'],
+					info:'Customised plan',
+				}
+			}),
+			education:computed(()=>{
+			    return {
+					title:'Enterprise Edition',
 				price:{
 					year:'500',
 				},
@@ -115,21 +146,14 @@ export default defineComponent({
 					year:'HKD / Year',
 				},
 				type:'year',
+				autoRenewal:{
+					text:t('Renew.automatically'),
+					value:true,
+				},
 				typeList:['year'],
 				info:'Customised plan',
-			},
-			education:{
-				title:'Enterprise Edition',
-				price:{
-					year:'500',
-				},
-				unit:{
-					year:'HKD / Year',
-				},
-				type:'year',
-				typeList:['year'],
-				info:'Customised plan',
-			},
+				}
+			}),
 			current:{
 
 			} as any,	
@@ -149,10 +173,12 @@ export default defineComponent({
 			let subscribeType = 'Year'
 			if(renewData.current.type == 'monthly')subscribeType= 'Month'
 			let data = {
-				autoRenewal:true,//one_time为不自动续费
+				autoRenewal:renewData.current.autoRenewal.value,//one_time为不自动续费
+				// autoRenewal:true,//one_time为不自动续费
 				productName:'Subscription',
 				subscribeType,//yearly为年费，monthly为月费
 			}
+			
 			renewData.payMethod.init(data)
 		}
         return{

src/component/HomePage/scaleImage.vue

@@ -9,7 +9,7 @@
             :maskClosable="false"
             :centered="true"
             :closable="false"
-            :mask="scaleImageMask"
+            :mask="true"
 			:keyboard="false"
 			:destroyOnClose="true"
         >
@@ -110,7 +110,7 @@
 			</div>
 			<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>
+				<generalMiniCanvas v-if="isCanvas" :imgUrl="scaleImageList[scaleImageIndex]?.imgUrl || scaleImageList[scaleImageIndex]?.url" @submitBase64Data="submitBase64Data"></generalMiniCanvas>
 				<img v-else :src="scaleImageList[scaleImageIndex]?.imgUrl || scaleImageList[scaleImageIndex]?.url">
 				
 				<div class="img_operate_block" v-if="isLike">
@@ -169,8 +169,7 @@ export default defineComponent({
 		},
 		workspace:{
 			type:Object,
-			default:{
-			}
+			default:{}
 		},
 	},
     setup(props:any,{emit}) {
@@ -360,7 +359,7 @@ export default defineComponent({
 			})
 			let data = {
 				"base64": rv,
-				"category": scaleImageList.value[scaleImageIndex.value]?.categoryValue,
+				"category": scaleImageList.value[scaleImageIndex.value]?.categoryValue || scaleImageList.value[scaleImageIndex.value]?.level2Type,
 				"gender": props.workspace.sexEnum.value,
 				"originalId":scaleImageList.value[scaleImageIndex.value]?.id,
 				"isOverride":isOverlay,