Merge remote-tracking branch 'origin/StableVersion' into develop

2025-04-01 15:25:06 +08:00
parent a83346438e 1c3ad7ca62
commit 70ed89049a
11 changed files with 318 additions and 93 deletions
--- a/src/component/HomePage/Generate.vue
+++ b/src/component/HomePage/Generate.vue
@@ -652,6 +652,7 @@ export default defineComponent({
 			let dataNum = dataList.length
 			let state = true
 			this.generateTime = setInterval(()=>{
+				if(!this.isGenerate || !this.remGenerate)return
 				if(!state)return
 				state = false
 				Https.axiosPost(Https.httpUrls.generateResult, data).then(
--- a/src/component/HomePage/renew.vue
+++ b/src/component/HomePage/renew.vue
@@ -47,13 +47,30 @@
 							{{ $t('Renew.Yearly') }}
 						</label>
 					</div>
-					<div class="autoRenewal">
+					<div class="type payment">
+						<div class="text">{{ $t('Renew.Payment') }}:</div>
+						<label>
+							<input name="payment" type="radio" value="CreditCard" v-model="current.PaymentType" @change="setPaymentType('CreditCard')">
+							{{ $t('Renew.CreditCard') }}
+						</label>
+						<label>
+							<input name="payment" type="radio" value="Alipay" v-model="current.PaymentType" @change="setPaymentType('Alipay')">
+							{{ $t('Renew.Alipay') }}
+						</label>
+					</div>
+					<!-- <div class="autoRenewal">
 						<label>
 							{{ current.autoRenewal.text }} : 
 							<a-switch v-model:checked="current.autoRenewal.value" />
 						</label>
-					</div>
+					</div> -->
 					<div class="info">{{ current?.info }}</div>
+					<div class="payMethod_payAffirm_clause" ref="labelDisclaimer">
+						<label>
+							<input type="checkbox" v-model="clause">
+							<span class="generalModelDescription">{{ $t('upgradePlan.policy1') }}<a href="https://code-create.com.hk/aida-terms-and-conditions/" target="_blank">{{ $t('upgradePlan.policy2') }}</a>{{ $t('upgradePlan.policy3') }}<a href="https://code-create.com.hk/aida-subscription-agreement/" target="_blank">{{ $t('upgradePlan.policy4') }}</a>. *</span>
+						</label>
+					</div>
 				</div>
 				<div class="gallery_btn gallery_btn_radius" @click="payment">{{ $t('Renew.SubscribeNow') }}</div>
 			</div>
@@ -74,6 +91,17 @@
 				Privacy Policy
 			</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>
+			<div class="mark_loading_title_box">
+				<div class="mark_loading_btn mark_loading_btn2" @click="setPaidBack">{{ $t('upgradePlan.Back') }}</div>
+				<div class="mark_loading_btn" @click="completePayment">OK</div>
+			</div>
+		</div>
 	</a-modal>
 	<payMethod ref="payMethod" @completePayment="cancelDsign" type="renew"></payMethod>
 </template>
@@ -84,6 +112,7 @@ import { message } from "ant-design-vue";
 import payMethod from "@/component/Pay/payMethod.vue";
 import { useStore } from "vuex";
 import { useI18n } from "vue-i18n";
+import { Https } from "@/tool/https";
 const md5 = require("md5");
 export default defineComponent({
    components: {
@@ -97,6 +126,13 @@ export default defineComponent({
 			renewModelMask:true,
 			pageWidth:'50%'
 		})
+		let payMethodData = reactive({
+			clause:false,
+			labelDisclaimer:null,
+			newWindow:null as any,
+			isShowMark:false,
+			isShowMark_:false,
+		})
 		let renewData = reactive({
 			personage:computed(()=>{
 			    return {
@@ -110,10 +146,7 @@ export default defineComponent({
 						year:t('Renew.HKDYear'),
 					},
 					type:'monthly',
-					autoRenewal:{
-						text:t('Renew.automatically'),
-						value:true,
-					},
+					PaymentType:'',
 					typeList:['monthly','year'],
 					info:'Tax, VAT not included.',
 				}
@@ -169,26 +202,85 @@ export default defineComponent({
 		const setPricType=(str:any)=>{
 			renewData.current.type = str
 		}
+		const setPaymentType = (str:any)=>{
+			renewData.current.PaymentType = str
+		}
 		const payment = ()=>{
-			let subscribeType = 'Year'
-			if(renewData.current.type == 'monthly')subscribeType= 'Month'
-			let data = {
-				autoRenewal:renewData.current.autoRenewal.value,//one_time为不自动续费
-				// autoRenewal:true,//one_time为不自动续费
-				productName:'Subscription',
-				subscribeType,//yearly为年费，monthly为月费
+			if(!payMethodData.clause){
+				let labelDisclaimer:any = payMethodData.labelDisclaimer
+				if(!labelDisclaimer.classList.contains('animation')){
+					labelDisclaimer.classList.add('animation')
+					setTimeout(() => {
+						labelDisclaimer.classList.remove('animation')
+					}, 1000);
+				}
+				return
 			}
-			
-			renewData.payMethod.init(data)
+
+			let subscribeType = 'Year'
+			if(!renewData.current.PaymentType)return message.info(t('Renew.PleaseSelectPayment'))
+			if(renewData.current.type == 'monthly')subscribeType= 'Month'
+			// let data = {
+			// 	autoRenewal:renewData.current.PaymentType != 'Alipay',//one_time为不自动续费
+			// 	productName:'Subscription',
+			// 	subscribeType,//yearly为年费，monthly为月费
+			// }
+			let url = window.location.origin+'/paySucceed' 
+			let data = {
+				autoRenewal:renewData.current.PaymentType != 'Alipay',//false为不自动续费
+				productName:'Subscription',
+				quantity:1,
+				returnUrl:url,
+				subscribeType:subscribeType,//yearly为年费，monthly为月费
+				wallet:'ALIPAYHK',
+			}
+			let httpsUrl = Https.httpUrls.payStripe
+			payMethodData.isShowMark_ = true
+			Https.axiosPost(httpsUrl,data).then(
+				(rv: any) => {
+					var width = 800;
+					var height = 600;
+					var left = (screen.width - width) / 2;
+					var top = (screen.height - height) / 2;
+					payMethodData.newWindow = window.open("", "_blank", "width=" + width + ", height=" + height + ", left=" + left + ", top=" + top);
+					let herf = rv
+					if(payMethodData.newWindow){
+						payMethodData.newWindow.location.href = herf
+					}else{
+						// window.open(herf, '_blank');
+						window.location.href=herf;  
+					}
+					payMethodData.newWindow = null
+					payMethodData.isShowMark = true
+					payMethodData.isShowMark_ = false
+				}
+			).catch(res=>{
+				payMethodData.isShowMark_ = false
+			});
+
+			// renewData.payMethod.init(data)
+		}
+		const setPaidBack = ()=>{
+			payMethod.payMethodModel = false
+			payMethodData.isShowMark = false
+			payMethodData.clause = false
+		}
+		const completePayment = ()=>{
+			renew.renewModel = false
+			setPaidBack()
 		}
        return{
 			store,
 			...toRefs(renew),
 			...toRefs(renewData),
+			...toRefs(payMethodData),
 			init,
 			cancelDsign,
 			setPricType,
+			setPaymentType,
 			payment,
+			setPaidBack,
+			completePayment,
        }
    },
    data() {
@@ -214,7 +306,8 @@ export default defineComponent({
 		}
 		.renew_detail{
 			width: 58rem;
-			height: 53rem;
+			height: 60rem;
+			// height: 53rem;
 			border-radius: 3rem;
 			margin-bottom: 5rem;
 			border: 2px solid #000;
@@ -241,6 +334,11 @@ export default defineComponent({
 			}
 			.type{
 				display: flex;
+				> .text{
+					margin-right: 2rem;
+					// font-weight: 600;
+				}
+				
 				label{
 					display: flex;
 					align-items: center;
@@ -249,6 +347,14 @@ export default defineComponent({
 						margin-right: 1rem;
 					}
 				}
+				&.payment{
+					label{
+						margin-right: 1rem;
+						input{
+							margin-right: .5rem;
+						}
+					}
+				}
 				label:last-child{
 				    margin-right: 0rem;
 				}
@@ -262,8 +368,89 @@ export default defineComponent({
 		.login_footer_item_text:last-child{
 			margin-bottom: 0rem;
 		}
+		.payMethod_payAffirm_clause{
+			label{
+				cursor: pointer;
+				input{
+					margin-right: 1rem;
+					cursor: pointer;
+					vertical-align: middle;
+				}
+				span{
+					vertical-align: top;
+					a{
+						color: #000;
+						text-decoration: underline;
+					}
+				}
+			}
+			&.animation{
+				animation: shake .3s linear;
+				@keyframes shake {
+					0%{
+						transform: translateX(0px);
+					}
+					25%{
+						transform: translateX(-10px);
+					}
+					50%{
+						transform: translateX(10px);
+					}
+					75%{
+						transform: translateX(-10px);
+					}
+					100%{
+						transform: translateX(0px);
+					}
+				}
+			}
+		}
   }
-       
+   .mark_loading{
+		position: absolute;
+		z-index: 2;
+		background: #fff;
+		.mark_loading_title{
+		font-size: 3rem;
+		// text-decoration: underline;
+		font-weight: 600;
+		margin-bottom: 2rem;
+		// color: #fff;
+	}
+	.mark_loading_intro{
+		color: rgba(0, 0, 0, 0.6);
+		font-size: 1.4rem;
+		margin-bottom: 2rem;
+		text-align: center;
+		width: 80%;
+	}
+	.mark_loading_title_box{
+		display: flex;
+	}
+
+	.mark_loading_btn,.mark_loading_btn2{
+		// border: #000;
+		// color: #fff;
+		display: flex;
+		margin-top: 10px;
+		text-align: center;
+		border: 2px solid;
+		padding: 0 20px;
+		border-radius: 10px;
+		cursor: pointer;
+		padding: .3rem 4rem;
+		background: #39215b;
+		color: #fff;
+		border: none;
+		margin: 0 2rem;
+		align-items: center;
+	}
+	.mark_loading_btn2{
+		border: 2px solid #000;
+		color: #000;
+		background: rgba(0,0,0,0);
+	}
+	} 
 }

 </style>
--- a/src/component/Pay/payMethod.vue
+++ b/src/component/Pay/payMethod.vue
@@ -39,7 +39,7 @@
 				<label class="payMethod_item">
 					<input name="Stripe" type="radio" value="stripe" v-model="modeOfPayment">
 					<img src="../../assets/images/homePage/stripe.svg" alt="">
-					 <span>Stripe (Credit Card)</span>
+					 <span>Stripe ({{ $t('Renew.CreditCard') }}、{{ $t('Renew.Alipay') }})</span>
 				</label>
 				<label class="payMethod_item" v-show="$props.type == 'credits'">
 					<input name="payAffirm" type="radio" value="alipay" v-model="modeOfPayment">
@@ -79,7 +79,6 @@
 				<div class="mark_loading_btn mark_loading_btn2" @click="setPaidBack">{{ $t('upgradePlan.Back') }}</div>
 				<div class="mark_loading_btn" @click="completePayment">OK</div>
 			</div>
-			
 		</div>
 	</a-modal>

@@ -114,7 +113,7 @@ export default defineComponent({
 			pageWidth:'50%'
 		})
 		let payMethodData = reactive({
-			modeOfPayment:'paypal',
+			modeOfPayment:prop.type == 'credits'?'paypal':'stripe',
 			modeOfPaymentDetail:'ALIPAYHK',
 			labelDisclaimer:null,//dom
 			payAffirmData:{} as any,
@@ -186,6 +185,7 @@ export default defineComponent({
 						// window.open(herf, '_blank');
 						window.location.href=herf;  
 					}
+					payMethodData.newWindow = null
 					payMethodData.isShowMark = true
 					payMethodData.isShowMark_ = false
 				}
@@ -197,7 +197,7 @@ export default defineComponent({
 			payMethod.payMethodModel = false
 			payMethodData.isShowMark = false
 			payMethodData.clause = false
-			payMethodData.modeOfPayment = 'paypal'
+			payMethodData.modeOfPayment = prop.type == 'credits'?'paypal':'stripe'
 			payMethodData.modeOfPaymentDetail = 'ALIPAYHK'
 		}
 		const completePayment = ()=>{
--- a/src/component/WorksPage/newScaleImage.vue
+++ b/src/component/WorksPage/newScaleImage.vue
@@ -61,7 +61,7 @@

 								</div>
 								<div class="detail_right_user_content">
-									<div style="text-align: center;">
+									<div style="text-align: left;">
 										<div class="scaleImage_chunk_title_intro">@{{scaleImageData.userName}}</div>
 										<div v-if="scaleImageData.isFollow == 0 && userDetail?.userId != scaleImageData?.accountId" style="margin-bottom: 0;" class="started_btn" @click="setFollow()" >{{$t('newScaleImage.Follow')}}</div>
 										<div v-else-if="userDetail?.userId != scaleImageData?.accountId" class="started_btn" style="margin-bottom: 0;" @click="setFollow()" >{{$t('newScaleImage.Unfollow')}}</div>
--- a/src/component/mainPage/signUp/index.vue
+++ b/src/component/mainPage/signUp/index.vue
@@ -1,20 +1,20 @@
 <template>
 	<div class="signUp">
 		<div class="selectSignUp" v-show="!isSelectSignUp">
-			<div class="title">Our Advantages</div>
+			<div class="title">{{ productList[0].Advantages }}</div>
 			<!-- <div class="introduce"><span @click="()=>isSelectSignUp=true">LEARN MORE ALL OUR PRODUCT FEATURES</span></div> -->
 			<div class="gallery_list product_list">
 				<div class="gallery_item" v-for="item in productList" :key="item">
 					<div class="product_signUp_box">
-						<div class="title">{{ item.title }}</div>
-						<div class="info">{{ item.info }}</div>
-						<div class="detail">{{ item.detail }}</div>
-						<div class="highlight" v-if="item.highlight">{{ item.highlight }}</div>
-						<div class="gallery_btn gallery_btn_radius" v-if="item.info != '/'" @click="createAccount">Create account</div>
+						<div class="title">{{ item?.title }}</div>
+						<div class="info">{{ item?.info }}</div>
+						<div class="detail">{{ item?.detail }}</div>
+						<div class="highlight" v-if="item?.highlight">{{ item?.highlight }}</div>
+						<div class="gallery_btn gallery_btn_radius" v-if="item?.info != '/'" @click="createAccount">{{ item?.btn }}</div>
 						<a class="gallery_btn gallery_btn_radius" v-else href="mailto:info@code-create.com.hk">Contact us</a>
 					</div>
 					<ul class="product_detail">
-						<li v-for="detailItem in item.detailList">{{ detailItem }}</li>
+						<li v-for="detailItem in item?.detailList">{{ detailItem }}</li>
 					</ul>
 				</div>
 			</div>
@@ -45,27 +45,49 @@
 		    registerModel,
 		},
        name: "login",
-		emits: ['close'],
+		props: ['isSelectSuccessively'],
+		// emits: ['close'],
 		setup(props, { emit }) {
 			let dom = reactive({
 				registerModel:null
 			})
 			let data = reactive({
 				isSelectSignUp:false,
-				productList:[
+				productList:[],
+				productListCn:[
 					{
+						Advantages:'我们的优势',
+						title:"个人版",
+						info:"试用五天(注册后开始免费试用)",
+						detail:"时尚设计助理",
+						highlight:"免费试用五天",
+						detailList:[
+							'时尚设计助理',
+							// 'Basic 3D service functions',
+							'个人信用额度供独立使用',
+							'作品可以在作品广场中共享',
+							'支持按 月/年 支付方式',
+							'适合个人创作者和自由设计师试用'
+						],
+						btn:'创建账号',
+					},
+				],
+				productListEn:[
+					{
+						Advantages:'Our Advantages',
 						title:"Personal version",
-						info:"Try for 5 days",
+						info:"Try for 5 days(Free trail starts upon registration)",
 						detail:"AI Fashion Design Assistant",
 						highlight:"Free 5-day trial",
 						detailList:[
 							'AI Fashion Design Assistant',
-							'Basic 3D service functions',
+							// 'Basic 3D service functions',
 							'Individual Credit Limit for Independent Use',
 							'Works can be shared in public galleries',
 							'Support monthly/annual payment options',
 							'Suitable for individual creators and freelance designers to use'
-						]
+						],
+						btn:'Create account',
 					},
 					// {
 					// 	title:"Education Edition",
@@ -123,6 +145,13 @@
 					},
 				]
 			})
+			watch(()=>props.isSelectSuccessively,(newVal)=>{
+				if(newVal){
+				    data.productList = data.productListCn
+				}else{
+				    data.productList = data.productListEn
+				}
+			},{immediate: true})
 			const close = ()=>{
 			}
 			const createAccount = ()=>{
--- a/src/component/modules/generalMiniCanvas.vue
+++ b/src/component/modules/generalMiniCanvas.vue
@@ -36,8 +36,8 @@
 					<!-- <div @click="setOperation('')" class="generalMiniCanvas_btn_item">
 						<div>新增</div>
 					</div> -->
-					<i class="icon iconfont icon-chehui" @click="historyState('')"></i>
-					<i class="icon iconfont icon-fanchehui" @click="historyState('reverse')"></i>
+					<i class="icon iconfont icon-chehui" @click="canvasGeneral.historyState('')"></i>
+					<i class="icon iconfont icon-fanchehui" @click="canvasGeneral.historyState('reverse')"></i>
 					<i class="icon iconfont icon-move" @click="setOperation('movePosition')" :class="{active:canvasState == 'movePosition'}"></i>
 					<!-- <i class="icon iconfont icon-move" @click="setOperation('move')" :class="{active:canvasState == 'move'}"></i> -->
 					<i class="icon iconfont icon-bianji" @click="setOperation('pencil')" :class="{active:canvasState == 'pencil'}"></i>
@@ -167,7 +167,7 @@ export default defineComponent({
 				document.removeEventListener('touchmove', touchmove);

 				let img = new Image();
-				img.onload = function(){
+				img.onload = async function(){
 					loadingShow.value = true
 					let height = canvasBox.offsetHeight;
 					canvasWH.value = height
@@ -195,7 +195,7 @@ export default defineComponent({
 					
 					fabric.Object.prototype.cornerSize = 10
 					fabric.Object.prototype.transparentCorners = false 
-					fabric.Image.fromURL(props.imgUrl, function(img) {
+					await fabric.Image.fromURL(props.imgUrl, async function(img) {
 						// 设置背景图对象的宽度和高度与 canvas 相同
 						img.scaleToWidth(canvas.width);
 						img.scaleToHeight(canvas.height);
@@ -204,19 +204,19 @@ export default defineComponent({
 							scaleY: canvas.height / img.height
 						});
 						// 将背景图添加到 canvas 的底层
-						canvas.setBackgroundImage(img, canvas.renderAll.bind(canvas));
+						await canvas.setBackgroundImage(img, canvas.renderAll.bind(canvas));
 						if(!fabric.Object.prototype.controls.deleteControl){
 							JSSetRemoveImage(deleteObj)
 						}else{
 							fabric.Object.prototype.controls.deleteControl.mouseUpHandler = deleteObj
 						}
 						setPencilWidth()
-						updateCanvasState()
+						canvasGeneral.updateCanvasState()
 					},{ crossOrigin: "Anonymous" });
 					// 鼠标抬起事件
 					canvas.on('mouse:up', function(event) {
 						if(isMovePostion)isMovePostion = false
-						if(canvasBtn.canvasState != 'move')updateCanvasState('mouseUp')
+						// if(canvasBtn.canvasState != 'move')canvasGeneral.updateCanvasState('mouseUp')
 					});
 					canvas.on("mouse:down", event=>setCanvasDown(event));
 					canvas.on('mouse:wheel', opt => {
@@ -248,28 +248,10 @@ export default defineComponent({
 				
 			})
        }
-		let canvasKeyDown = (event) => {
-			if(keyDown.indexOf(event.key)>-1){
-			}else{
-				keyDown.push(event.code)
-				if(keyDown.indexOf('ControlLeft') > -1 && keyDown.indexOf('KeyZ') > -1 && keyDown.indexOf('ShiftLeft') > -1){
-					historyState('reverse')
-				}else if(keyDown.indexOf('ControlLeft') > -1 && keyDown.indexOf('KeyZ') > -1){
-					historyState('')
-				}
-			}
-		}
-		let canvasKeyUp = (event) =>{
-				keyDown = keyDown.filter(function(item) {
-					return event.code !== item;
-				})
-				
-			}
 		let clearCanvas = ()=>{
 		    canvasBtn.canvasState = 'move'
 		    canvasBtn.spreadState = false
-			document.removeEventListener("keydown", canvasKeyDown);
-			document.removeEventListener("keyup", canvasKeyUp);
+			canvasGeneral.canvasClear()
 		}
 		let mouseMove = (event)=>{
 			let e = getMousePosition(event,false)
@@ -526,28 +508,6 @@ export default defineComponent({
 				canvasBtn.canvasPencilWidth[str] = 100; // 设置为最大值
 			}
 		}
-		let updateCanvasState = (str) =>{
-			if(str != 'mouseUp'){
-			}
-			const canvasAsJson = JSON.stringify(canvas.toJSON());
-			normalCanvasState.value.push(canvasAsJson);
-		}
-		//撤回
-		let historyState = (str)=> {
-			if(str == 'reverse' && reverseCanvasState.value.length > 0){//反撤回
-				let obj = reverseCanvasState.value.pop()
-				// canvasState.value = reverseCanvasState.value[reverseCanvasState.value.length-1]
-				canvasState.value = obj 
-				normalCanvasState.value.push(obj);
-			}else if(str == '' && normalCanvasState.value.length > 1){
-				let obj = normalCanvasState.value.pop()
-				canvasState.value = normalCanvasState.value[normalCanvasState.value.length-1]
-				reverseCanvasState.value.push(obj);
-			}else{
-				return
-			}
-			canvas.loadFromJSON(canvasState.value, () => {});
-		}
 		let setSubmit = (liquefation)=>{
 			return new Promise((resolve,reject)=>{
 				var allObjects = canvas.getObjects();
@@ -625,8 +585,6 @@ export default defineComponent({
 			
 		}
 		let cancelDsign = ()=>{
-			document.removeEventListener('keydown',canvasKeyDown);
-			document.removeEventListener('keyup', canvasKeyUp);
 			showPayOrder.value = false
 		}
 		let liquefactionData = ref(null)
@@ -651,7 +609,7 @@ export default defineComponent({
 					fabric.Object.prototype.controls.deleteControl.mouseUpHandler = deleteObj
 				}
 				setPencilWidth()
-				updateCanvasState()
+				canvasGeneral.updateCanvasState()
 			},{ crossOrigin: "Anonymous" });
 		}
 		let setLiquefaction =async ()=>{
@@ -681,7 +639,6 @@ export default defineComponent({
 			setOperation,
 			setPencilWidth,
 			setPencilColor,
-			historyState,
 			setSubmit,
 			cancelDsign,
 			submitLiquefaction,
@@ -690,6 +647,7 @@ export default defineComponent({
 			brushList,
 			brushworkValue,
 			brushworkChange,
+			canvasGeneral,
        };
    },
    data() {