chore: i18n资源

Reviewed-on: #1

.gitea/workflows/develop_build.yaml

@@ -1,56 +0,0 @@
-name: AiDA WEB-Node.js Develop 分支构建部署123
-on:
-  workflow_dispatch:
-
-  push:
-    branches:
-      - dev_vite
-
-jobs:
-  build:
-    runs-on: ubuntu-latest
-    if: "contains(github.event.head_commit.message, '[run build]')"
-
-    strategy:
-      matrix:
-        node-version: [ 18.18.0 ]
-
-    env:
-      REMOTE_DEPLOY_PATH: /workspace/workspace_aida/DevelopVersion/develop-aida-web-front
-
-    steps:
-      - name: 1.检出代码
-        uses: actions/checkout@v4
-
-      - name: 2.设置 Node.js 环境
-        uses: actions/setup-node@v6
-        with:
-          node-version: ${{ matrix.node-version }}
-      - run: npm install
-      - run: npm run build:dev
-      - run: ls -l
-
-      - name: 3.同步文件到远程服务器
-        uses: appleboy/scp-action@v0.1.7
-        with:
-          host: ${{ secrets.SERVER_HOST }}
-          username: ${{ secrets.SERVER_USER }}
-          key: ${{ secrets.SSH_KEY }}
-          source: "./dist/*"
-          target: ${{ env.REMOTE_DEPLOY_PATH }}
-          ssh_options: "-o StrictHostKeyChecking=no -o UserKnownHostsFile=/dev/null"
-          strip_components: 0
-
-      - name: 4. 远程重载 Nginx 配置
-        uses: appleboy/ssh-action@v1.0.3
-        with:
-          host: ${{ secrets.SERVER_HOST }}
-          username: ${{ secrets.SERVER_USER }}
-          key: ${{ secrets.SSH_KEY }}
-          # 核心：执行 Nginx 重载命令
-          script: |
-            echo "尝试重载 Nginx 服务..."
-            # 💡 注意：执行此命令需要服务器用户具有 sudo 权限，并且配置了 NOPASSWD。
-            # 否则工作流可能会因为权限不足而失败。
-            sudo systemctl reload nginx
-            echo "Nginx 重载命令已发送。"

.gitea/workflows/develop_build_manual.yaml

@@ -1,50 +0,0 @@
-name: 手动触发 AiDA WEB-Node.js Develop 分支构建部署
-on:
-  workflow_dispatch:
-
-jobs:
-  build:
-    runs-on: ubuntu-latest
-
-    strategy:
-      matrix:
-        node-version: [ 18.18.0 ]
-    env:
-      REMOTE_DEPLOY_PATH: /workspace/workspace_aida/DevelopVersion/develop-aida-web-front
-
-    steps:
-      - name: 1.检出代码
-        uses: actions/checkout@v4
-
-      - name: 2.设置 Node.js 环境
-        uses: actions/setup-node@v6
-        with:
-          node-version: ${{ matrix.node-version }}
-      - run: npm install
-      - run: npm run build:dev
-      - run: ls -l
-
-      - name: 3.同步文件到远程服务器
-        uses: appleboy/scp-action@v0.1.7
-        with:
-          host: ${{ secrets.SERVER_HOST }}
-          username: ${{ secrets.SERVER_USER }}
-          key: ${{ secrets.SSH_KEY }}
-          source: "./dist/*"
-          target: ${{ env.REMOTE_DEPLOY_PATH }}
-          ssh_options: "-o StrictHostKeyChecking=no -o UserKnownHostsFile=/dev/null"
-          strip_components: 0
-
-      - name: 4. 远程重载 Nginx 配置
-        uses: appleboy/ssh-action@v1.0.3
-        with:
-          host: ${{ secrets.SERVER_HOST }}
-          username: ${{ secrets.SERVER_USER }}
-          key: ${{ secrets.SSH_KEY }}
-          # 核心：执行 Nginx 重载命令
-          script: |
-            echo "尝试重载 Nginx 服务..."
-            # 💡 注意：执行此命令需要服务器用户具有 sudo 权限，并且配置了 NOPASSWD。
-            # 否则工作流可能会因为权限不足而失败。
-            sudo systemctl reload nginx
-            echo "Nginx 重载命令已发送。"

.gitea/workflows/prod_build_manual.yaml

@@ -1,53 +0,0 @@
-name: AiDA WEB-Node.js StableVersion 分支构建部署
-on:
-  workflow_dispatch:
-
-jobs:
-  build:
-    runs-on: ubuntu-latest
-
-    strategy:
-      matrix:
-        node-version: [ 18.18.0 ]
-
-    steps:
-      - name: 1.检出代码
-        uses: actions/checkout@v4
-        with:
-          ref: StableVersion
-
-      - name: 2.打印当前分支信息
-        run: |
-          echo "Current branch being deployed is: $(git rev-parse --abbrev-ref HEAD)"
-          echo "The code is from the 'main' branch, as specified in 'actions/checkout'."
-
-      - name: 3.设置 Node.js 环境 ${{ matrix.node-version }}
-        uses: actions/setup-node@v6
-        with:
-          node-version: ${{ matrix.node-version }}
-      - run: npm install
-      - run: npm run build
-      - run: ls -l
-
-      - name: 3.5. 手动安装 AWS CLI v2 # 新增步骤：确保 aws 命令可用
-        run: |
-          echo "安装 AWS CLI V2..."
-          curl "https://awscli.amazonaws.com/awscli-exe-linux-x86_64.zip" -o "awscliv2.zip"
-          unzip awscliv2.zip
-          sudo ./aws/install --update
-          aws --version
-          echo "AWS CLI V2 安装完成。"
-
-      - name: 4.配置 AWS 凭证
-        uses: aws-actions/configure-aws-credentials@main
-        with:
-          aws-access-key-id: ${{ secrets.AWS_ACCESS_KEY_ID }}
-          aws-secret-access-key: ${{ secrets.AWS_SECRET_ACCESS_KEY }}
-          aws-region: 'ap-east-1'
-
-      - name: 5.同步 dist 目录到 S3
-        run: |
-          aws s3 sync dist/* s3://${{ secrets.S3_BUCKET_NAME }}/ --acl public-read
-
-      - name: 6.部署完成
-        run: echo "构建和部署到 S3 任务完成。"

.gitea/workflows/prod_build_schedule.yaml

@@ -1,56 +0,0 @@
-name: AiDA WEB-Node.js StableVersion 分支构建部署
-on:
-  schedule:
-    #       cron为UTC时区，构建时间=部署时间-8小时 {*分 (-8)时 *日 *月  *周}  ---
-    #      示例： 1月1日22点22分触发构建 cron写作 - '22 14 1 1 *'
-    - cron: '22 14 1 1 *'
-
-jobs:
-  build:
-    runs-on: ubuntu-latest
-
-    strategy:
-      matrix:
-        node-version: [ 18.18.0 ]
-
-    steps:
-      - name: 1.检出代码
-        uses: actions/checkout@v4
-        with:
-          ref: StableVersion
-
-      - name: 2.打印当前分支信息
-        run: |
-          echo "Current branch being deployed is: $(git rev-parse --abbrev-ref HEAD)"
-          echo "The code is from the 'main' branch, as specified in 'actions/checkout'."
-
-      - name: 3.设置 Node.js 环境 ${{ matrix.node-version }}
-        uses: actions/setup-node@v6
-        with:
-          node-version: ${{ matrix.node-version }}
-      - run: npm install
-      - run: npm run build
-      - run: ls -l
-
-      - name: 3.5. 手动安装 AWS CLI v2 # 新增步骤：确保 aws 命令可用
-        run: |
-          echo "安装 AWS CLI V2..."
-          curl "https://awscli.amazonaws.com/awscli-exe-linux-x86_64.zip" -o "awscliv2.zip"
-          unzip awscliv2.zip
-          sudo ./aws/install --update
-          aws --version
-          echo "AWS CLI V2 安装完成。"
-
-      - name: 4.配置 AWS 凭证
-        uses: aws-actions/configure-aws-credentials@main
-        with:
-          aws-access-key-id: ${{ secrets.AWS_ACCESS_KEY_ID }}
-          aws-secret-access-key: ${{ secrets.AWS_SECRET_ACCESS_KEY }}
-          aws-region: 'ap-east-1'
-
-      - name: 5.同步 dist 目录到 S3
-        run: |
-          aws s3 sync dist/* s3://${{ secrets.S3_BUCKET_NAME }}/ --acl public-read
-
-      - name: 6.部署完成
-        run: echo "构建和部署到 S3 任务完成。"

src/assets/style/style.css

@@ -1250,10 +1250,14 @@ tr > .ant-picker-cell-in-view.ant-picker-cell-range-hover-start:last-child::afte
   background: #000 !important;
   border-color: #000 !important;
 }
+.ant-spin .ant-spin-dot {
+  width: 1.5em;
+  height: 1.5em;
+}
 .ant-spin-dot-item {
   background-color: #000000 !important;
-  width: 9px !important;
+  width: 0.9em !important;
-  height: 9px !important;
+  height: 0.9em !important;
 }
 .ant-spin {
   color: #000;

src/assets/style/style.less

@@ -1378,10 +1378,14 @@ tr > .ant-picker-cell-in-view.ant-picker-cell-range-hover-start:last-child::afte
 	}
 }
 //loding样式
+.ant-spin .ant-spin-dot{
+	width: 1.5em;
+	height: 1.5em;
+}
 .ant-spin-dot-item{
     background-color: #000000 !important;
-	width: 9px !important;
+	width: .9em !important;
-    height: 9px !important;
+    height: .9em !important;
 }
 .ant-spin{
 	color: #000;

src/component/HomePage/layout.vue

@@ -34,8 +34,8 @@
 					</div>
 				</div>
 				<div class="layout_centent" :class="{active:flex_direction}" id="layoutCentent">
-					<div v-for="item,index in layoutList" :key="item" :class="moodbClassName[index]" class="modal_imgItem" v-layout="item" @mousedown="setpitch(item,index)"  @touchstart="setpitch(item,index)" ref="content" >
+					<div v-for="item,index in layoutList" :key="item" :class="moodbClassName[index]" class="modal_imgItem" v-layout="item" @mousedown="setpitch(item,index)"  @touchstart="setpitch(item,index)" ref="content"  :style="{'background-image':`url(${item.imgUrl})`,'transform':`scale(${item.zoom?item.zoom:1}) rotateZ(${item.angle?item.angle:0}deg)`}">
-						<img crossOrigin="anonymous" :src="item.imgUrl" :style="{'transform':`translate(-50%, -50%) scale(${item.zoom?item.zoom:1}) rotateZ(${item.angle?item.angle:0}deg)`}"  draggable="false" :class="moodbClassName[index]" v-modelImg> 
+						<!-- <img crossOrigin="anonymous" :src="item.imgUrl" :style="{'transform':`translate(-50%, -50%) scale(${item.zoom?item.zoom:1}) rotateZ(${item.angle?item.angle:0}deg)`}"  draggable="false" :class="moodbClassName[index]" v-modelImg>  -->
 						<ul v-show="item.setPitch" class="layout_btn" >
 							<li class="layout_btn_top" v-compile.stop="'top'"></li>
 							<li class="layout_btn_bottom" v-compile.stop="'bottom'"></li>
@@ -736,6 +736,7 @@ export default defineComponent({
 		setmoodb(item:any){
 			this.moodbClassName = item
 			this.$emit('setmoodbClass',this.moodbClassName)
+			this.styleObj.class = this.moodbClassName
 			if(this.content){
 				for (item of (this.content as any)) {
 					item.classList.remove('active')
@@ -772,7 +773,7 @@ export default defineComponent({
 		initDomStyle(){
 			nextTick(()=>{
 				this.content.forEach((item:any,index:any) => {
-					if(this.styleObj.domStyle[index]){
+					if(this.styleObj.domStyle[index]?.left){
 						item.classList.add('active')
 						this.initStyle(item,this.styleObj.domStyle[index])
 					}
@@ -794,7 +795,7 @@ export default defineComponent({
 			})
 		},
 		initStyle(dom:any,style:any){
-			if(!style)return
+			if(!style || !dom)return
 			for (const [property, value] of Object.entries(style)) {
 				
 				dom.style.setProperty(property, value);
@@ -806,7 +807,7 @@ export default defineComponent({
 				this.styleObj.domStyle.push(this.setStyle(item.style))
 				this.domObj.dom.forEach((domName:any,index:any) => {
 					let style = this.domObj.domStyle[index]
-					let dom = item.querySelector(domName)
+					let dom = item.querySelector(domName) || item
 					this.styleObj[style].push(this.setStyle(dom.style))
 				})
 			});
@@ -840,7 +841,6 @@ export default defineComponent({
 					let config:any = {headers:{'Content-Type':'multipart/form-data','Accept':'*/*'  }}
 					Https.axiosPost(Https.httpUrls.elementUpload,param,config)
 					.then((rv: any) => {
-							// console.log(rv);
 							rv.imgUrl = rv.url
 							this.layout = false
 							this.loadingShow = false
@@ -1062,27 +1062,12 @@ export default defineComponent({
 				// 	height: 100%;
 				// }
 				overflow: hidden;
+				background-repeat: no-repeat;
+				background-position: center;
+				background-size: cover;
 				&.active{
 					position: absolute;
 				}
-				img{
-					// object-fit: cover;
-					// width: 100%;
-					// height: 100%;
-					pointer-events: none;
-					float: left;
-					user-select:none;
-					-webkit-user-drag: none;
-					position: absolute;
-					top: 50%;
-					left: 50%;
-					transform: translate(-50%,-50%) scale(1);
-				}
-				::selection {
-						// background: rgba(0,0,0,0);
-						// background: yellow;
-					}
-			
 			}
 		}
 		.wh1{

src/component/HomePage/renew.vue

@@ -19,7 +19,8 @@
       <div class="generalModel_closeIcon" @click.stop="cancelDsign()">
         <!-- <i class="fi fi-rr-cross-small"></i> -->
         <svg
-			width="100%" height="100%"
+          width="100%"
+          height="100%"
           viewBox="0 0 46 46"
           fill="none"
           xmlns="http://www.w3.org/2000/svg"
@@ -49,20 +50,32 @@
     <div class="renewContent">
       <div class="left">
         <div class="video">
-			  <video autoplay loop muted playsinline src="@/assets/images/icon/paymentVideo.mp4"></video>
+          <video
+            autoplay
+            loop
+            muted
+            playsinline
+            src="@/assets/images/icon/paymentVideo.mp4"
+          ></video>
           <div class="mask"></div>
         </div>
-		  <div class="title">{{ $t("Renew.Strengths") }}</div>
+        <div class="title">{{ $t('Renew.Strengths') }}</div>
         <div class="content">
           <div class="benefitsItem">
             <div class="describe">
               <div class="icon">
-				  <img src="@/assets/images/icon/paymentIntroduce1.png" alt="">
+                <img src="@/assets/images/icon/paymentIntroduce1.png" alt="" />
               </div>
               <div class="text">
-				  <p class="title">{{ $t("Renew.StrengthsTitle1") }}<br>{{ $t("Renew.StrengthsTitle1_1") }}</p>
+                <p class="title">
+                  {{ $t('Renew.StrengthsTitle1') }}
+                  <br />
+                  {{ $t('Renew.StrengthsTitle1_1') }}
+                </p>
                 <p class="info">
-					  {{ $t("Renew.StrengthsInfo1") }}<br>{{ $t("Renew.StrengthsInfo1_1") }}
+                  {{ $t('Renew.StrengthsInfo1') }}
+                  <br />
+                  {{ $t('Renew.StrengthsInfo1_1') }}
                 </p>
               </div>
             </div>
@@ -70,12 +83,18 @@
           <div class="benefitsItem">
             <div class="describe">
               <div class="icon">
-				  <img src="@/assets/images/icon/paymentIntroduce2.png" alt="">
+                <img src="@/assets/images/icon/paymentIntroduce2.png" alt="" />
               </div>
               <div class="text">
-				  <p class="title">{{ $t("Renew.StrengthsTitle2") }}<br>{{ $t("Renew.StrengthsTitle2_1") }}</p>
+                <p class="title">
+                  {{ $t('Renew.StrengthsTitle2') }}
+                  <br />
+                  {{ $t('Renew.StrengthsTitle2_1') }}
+                </p>
                 <p class="info">
-					  {{ $t("Renew.StrengthsInfo2") }}<br>{{ $t("Renew.StrengthsInfo2_1") }}
+                  {{ $t('Renew.StrengthsInfo2') }}
+                  <br />
+                  {{ $t('Renew.StrengthsInfo2_1') }}
                 </p>
               </div>
             </div>
@@ -83,13 +102,21 @@
           <div class="benefitsItem">
             <div class="describe">
               <div class="icon">
-				  <img src="@/assets/images/icon/paymentIntroduce3.png" alt="">
+                <img src="@/assets/images/icon/paymentIntroduce3.png" alt="" />
               </div>
               <div class="text">
                 <p class="title"></p>
-				  <p class="title">{{ $t("Renew.StrengthsTitle3") }}<br>{{ $t("Renew.StrengthsTitle3_1") }}</p>
+                <p class="title">
+                  {{ $t('Renew.StrengthsTitle3') }}
+                  <br />
+                  {{ $t('Renew.StrengthsTitle3_1') }}
+                </p>
                 <p class="info">
-					  {{ $t("Renew.StrengthsInfo3") }}<br>{{ $t("Renew.StrengthsInfo3_1") }}<br>{{ $t("Renew.StrengthsInfo3_2") }}
+                  {{ $t('Renew.StrengthsInfo3') }}
+                  <br />
+                  {{ $t('Renew.StrengthsInfo3_1') }}
+                  <br />
+                  {{ $t('Renew.StrengthsInfo3_2') }}
                 </p>
               </div>
             </div>
@@ -97,12 +124,18 @@
           <div class="benefitsItem">
             <div class="describe">
               <div class="icon">
-				  <img src="@/assets/images/icon/paymentIntroduce4.png" alt="">
+                <img src="@/assets/images/icon/paymentIntroduce4.png" alt="" />
               </div>
               <div class="text">
-				  <p class="title">{{ $t("Renew.StrengthsTitle4") }}<br>{{ $t("Renew.StrengthsTitle4_1") }}</p>
+                <p class="title">
+                  {{ $t('Renew.StrengthsTitle4') }}
+                  <br />
+                  {{ $t('Renew.StrengthsTitle4_1') }}
+                </p>
                 <p class="info">
-					  {{ $t("Renew.StrengthsInfo4") }}<br>{{ $t("Renew.StrengthsInfo4_1") }}
+                  {{ $t('Renew.StrengthsInfo4') }}
+                  <br />
+                  {{ $t('Renew.StrengthsInfo4_1') }}
                 </p>
               </div>
             </div>
@@ -111,7 +144,7 @@
       </div>
       <div class="right">
         <div class="title">
-			{{ $t("Renew.title") }}
+          {{ $t('Renew.title') }}
         </div>
         <!-- <div class="info">{{ $t("Renew.unlimited") }}</div> -->
         <div class="content">
@@ -119,36 +152,31 @@
             class="productItem"
             :class="{
               active: item.price == current.price,
-				sellWell: item.sellWell,
+              sellWell: item.sellWell
             }"
             v-for="item in personage"
             :key="item.price"
             @click="setPromotionData(item)"
           >
-			  <div class="popular" v-show="item.sellWell">{{ $t("Renew.MOSTPOPULAR") }}</div>
+            <div class="popular" v-show="item.sellWell">
+              {{ $t('Renew.MOSTPOPULAR') }}
+            </div>
             <div class="priceBox">
               <div class="left">
                 <p class="productType">1 {{ item.type.label }}</p>
-				  <p class="price">${{ item.price }}</p>
+                <p class="price">HK $  {{ item.price }}</p>
               </div>
               <div class="right">
                 <div class="promotion">
-					<div
+                  <div class="succeed" v-show="item.promotionData.error == 'true'">
-					  class="succeed"
-					  v-show="item.promotionData.error == 'true'"
-					>
                     {{ item.promotionData.code }}
-					  <i
+                    <i class="fi fi-sr-times-hexagon" @click="clearPromotionCode"></i>
-						class="fi fi-sr-times-hexagon"
-						@click="clearPromotionCode"
-					  ></i>
                   </div>
                   <div
                     class="input"
                     @click.stop
                     v-show="
-						!item.promotionData.error ||
+                      !item.promotionData.error || item.promotionData.error == 'false'
-						item.promotionData.error == 'false'
                     "
                   >
                     <input
@@ -156,14 +184,11 @@
                       :placeholder="$t('Renew.promotionCode')"
                       v-model="item.promotionData.code"
                     />
-					  <div style="cursor: pointer; background-color: #000; font-size: 1.2rem; color: #fff; padding: 0 .5rem;" @click="examine(item)">
+                    <div class="apply-btn" @click="examine(item)">
-						{{ $t("Renew.use") }}
+                      {{ $t('Renew.use') }}
                     </div>
                   </div>
-					<div
+                  <div class="error" v-show="item.promotionData.error == 'false'">
-					  class="error"
-					  v-show="item.promotionData.error == 'false'"
-					>
                     {{ item.promotionData.str }}
                   </div>
                 </div>
@@ -181,7 +206,7 @@
         <div class="payment">
           <div class="allocation">
             <div class="selectType">
-				<div class="text">{{ $t("Renew.Payment") }}:</div>
+              <div class="text">{{ $t('Renew.Payment') }}:</div>
               <label>
                 <input
                   name="payment"
@@ -190,7 +215,7 @@
                   v-model="PaymentType"
                   @change="setPaymentType('CreditCard')"
                 />
-				  {{ $t("Renew.CreditCard") }}
+                {{ $t('Renew.CreditCard') }}
               </label>
               <label>
                 <input
@@ -200,43 +225,47 @@
                   v-model="PaymentType"
                   @change="setPaymentType('Alipay')"
                 />
-				  {{ $t("Renew.Alipay") }}
+                {{ $t('Renew.Alipay') }}
               </label>
             </div>
           </div>
           <div class="gallery_btn gallery_btn_radius" @click="payment">
-				  {{ $t("upgradePlan.Continue") }}
+            {{ $t('upgradePlan.Continue') }}
           </div>
           <div class="payMethod_payAffirm_clause" ref="labelDisclaimer">
             <label>
               <!-- <input type="checkbox" v-model="clause" /> -->
-				<span class="generalModelDescription"
+              <span class="generalModelDescription">
-				  >{{ $t("upgradePlan.policy")}}
+                {{ $t('upgradePlan.policy') }}
                 <a
                   href="https://code-create.com.hk/aida-terms-and-conditions/"
-					target="_blank">
+                  target="_blank"
-					{{ $t("upgradePlan.policy1") }}
+                >
+                  {{ $t('upgradePlan.policy1') }}
                 </a>
                 &
                 <a
                   href="https://code-create.com.hk/aida-subscription-agreement/"
-					target="_blank">
+                  target="_blank"
-					{{ $t("upgradePlan.policy2") }}
+                >
+                  {{ $t('upgradePlan.policy2') }}
                 </a>
                 <!-- . * -->
-				  </span
+              </span>
-				>
             </label>
             <label class="secure">
-				  <span><i class="fi fi-rr-shield-check"></i>Pay safe & secure</span>
+              <span>
+                <i class="fi fi-rr-shield-check"></i>
+                Pay safe & secure
+              </span>
             </label>
             <label class="payIcon">
-				  <img class="stripe" src="@/assets/images/icon/stripe.svg" alt="">
+              <img class="stripe" src="@/assets/images/icon/stripe.svg" alt="" />
-				  <img class="alipay" src="@/assets/images/icon/alipay.svg" alt="">
+              <img class="alipay" src="@/assets/images/icon/alipay.svg" alt="" />
-				  <img class="alipay" src="@/assets/images/icon/jcbPay.svg" alt="">
+              <img class="alipay" src="@/assets/images/icon/jcbPay.svg" alt="" />
-				  <img class="alipay" src="@/assets/images/icon/mastercardPay.svg" alt="">
+              <img class="alipay" src="@/assets/images/icon/mastercardPay.svg" alt="" />
-				  <img class="alipay" src="@/assets/images/icon/yinlianPay.svg" alt="">
+              <img class="alipay" src="@/assets/images/icon/yinlianPay.svg" alt="" />
-				  <img class="alipay" src="@/assets/images/icon/visaPay.svg" alt="">
+              <img class="alipay" src="@/assets/images/icon/visaPay.svg" alt="" />
             </label>
           </div>
           <!-- <div class="paySecure">
@@ -250,101 +279,104 @@
       <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_title">{{ $t('upgradePlan.completed') }}</div>
-		<div class="mark_loading_intro">{{ $t("upgradePlan.hint") }}</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") }}
+          {{ $t('upgradePlan.Back') }}
         </div>
         <div class="mark_loading_btn" @click="completePayment">OK</div>
       </div>
     </div>
   </a-modal>
-	<payMethod
+  <payMethod ref="payMethod" @completePayment="cancelDsign" type="renew"></payMethod>
-	  ref="payMethod"
-	  @completePayment="cancelDsign"
-	  type="renew"
-	></payMethod>
 </template>
 
 <script lang="ts">
-  import { defineComponent, computed, reactive, toRefs, onMounted, onBeforeUnmount } from "vue";
+import {
-  import { message } from "ant-design-vue";
+  defineComponent,
-  import payMethod from "@/component/Pay/payMethod.vue";
+  computed,
-  import { useStore } from "vuex";
+  reactive,
-  import { useI18n } from "vue-i18n";
+  toRefs,
-  import { Https } from "@/tool/https";
+  onMounted,
-  import md5 from "md5";
+  onBeforeUnmount
+} from 'vue'
+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'
+import md5 from 'md5'
 export default defineComponent({
   components: {
-	  payMethod,
+    payMethod
   },
   setup() {
-	  const store = useStore();
+    const store = useStore()
-	  const { t } = useI18n();
+    const { t } = useI18n()
     let renew = reactive({
       renewModel: false,
       renewModelMask: true,
-		pageWidth: "50%",
+      pageWidth: '50%'
-	  });
+    })
     let payMethodData = reactive({
       clause: false,
       labelDisclaimer: null as any,
       newWindow: null as any,
       isShowMark: false,
-		isShowMark_: false,
+      isShowMark_: false
-	  });
+    })
     let renewData = reactive({
       personage: [
         {
-			price: "100",
+          price: '100',
           sellWell: true,
           activity: false, //活动打折
           type: {
-			  value: "EcoMonth",
+            value: 'EcoMonth',
-			  label: computed(()=>t("Renew.Monthly")),
+            label: computed(() => t('Renew.Monthly'))
           },
           //   PaymentType: "CreditCard",
           promotionData: {
-			  code: "",
+            code: '',
-			  error: "",
+            error: '',
-			  str: "",
+            str: '',
-			  price: "",
+            price: ''
-			},
+          }
         },
         {
-			price: "500",
+          price: '500',
           sellWell: false,
           activity: false, //活动打折
           type: {
-			  value: "Month",
+            value: 'Month',
-			  label: computed(()=>t("Renew.Monthly")),
+            label: computed(() => t('Renew.Monthly'))
           },
           //   PaymentType: "CreditCard",
           promotionData: {
-			  code: "",
+            code: '',
-			  error: "",
+            error: '',
-			  str: "",
+            str: '',
-			  price: "",
+            price: ''
-			},
+          }
         },
         {
-			price: "5,000",
+          price: '5,000',
           sellWell: false,
           activity: false, //活动打折
-			typeValue: "year",
+          typeValue: 'year',
           type: {
-			  value: "Year",
+            value: 'Year',
-			  label: computed(()=>t("Renew.Yearly")),
+            label: computed(() => t('Renew.Yearly'))
           },
           //   PaymentType: "CreditCard",
           promotionData: {
-			  code: "",
+            code: '',
-			  error: "",
+            error: '',
-			  str: "",
+            str: '',
-			  price: "",
+            price: ''
-			},
+          }
-		  },
+        }
       ],
       // personage:computed(()=>{
       //     return {
@@ -365,55 +397,55 @@
       // }),
       firm: computed(() => {
         return {
-			title: "Education Edition",
+          title: 'Education Edition',
           price: {
-			  year: "500",
+            year: '500'
           },
           unit: {
-			  year: "HKD / Year",
+            year: 'HKD / Year'
           },
-			type: "year",
+          type: 'year',
           autoRenewal: {
-			  text: t("Renew.automatically"),
+            text: t('Renew.automatically'),
-			  value: true,
+            value: true
           },
-			typeList: ["year"],
+          typeList: ['year'],
-			info: "Customised plan",
+          info: 'Customised plan'
-		  };
+        }
       }),
       education: computed(() => {
         return {
-			title: "Enterprise Edition",
+          title: 'Enterprise Edition',
           price: {
-			  year: "500",
+            year: '500'
           },
           unit: {
-			  year: "HKD / Year",
+            year: 'HKD / Year'
           },
-			type: "year",
+          type: 'year',
           autoRenewal: {
-			  text: t("Renew.automatically"),
+            text: t('Renew.automatically'),
-			  value: true,
+            value: true
           },
-			typeList: ["year"],
+          typeList: ['year'],
-			info: "Customised plan",
+          info: 'Customised plan'
-		  };
+        }
       }),
       current: {} as any,
       payMethod: null as any,
-		PaymentType: "CreditCard",
+      PaymentType: 'CreditCard'
-	  });
+    })
     const init = () => {
-		renew.renewModel = true;
+      renew.renewModel = true
-		renewData.current = renewData.personage[1];
+      renewData.current = renewData.personage[1]
-	  };
+    }
     const cancelDsign = () => {
-		renew.renewModel = false;
+      renew.renewModel = false
       store.dispatch('getUserDetail')
-	  };
+    }
     const setPaymentType = (str: any) => {
-		renewData.PaymentType = str;
+      renewData.PaymentType = str
-	  };
+    }
     const payment = () => {
       //   if (!payMethodData.clause) {
       //     let labelDisclaimer: any = payMethodData.labelDisclaimer;
@@ -425,104 +457,92 @@
       //     }
       //     return;
       //   }
-		if (!renewData.PaymentType)
+      if (!renewData.PaymentType) return message.info(t('Renew.PleaseSelectPayment'))
-		  return message.info(t("Renew.PleaseSelectPayment"));
+      let url = window.location.origin + '/paySucceed'
-		let url = window.location.origin + "/paySucceed";
       let data = {
-		  autoRenewal: renewData.PaymentType != "Alipay", //false为不自动续费
+        autoRenewal: renewData.PaymentType != 'Alipay', //false为不自动续费
-		  productName: "Subscription",
+        productName: 'Subscription',
         quantity: 1,
         returnUrl: url,
         subscribeType: renewData.current.type.value, //yearly为年费，monthly为月费
-		  wallet: "ALIPAYHK",
+        wallet: 'ALIPAYHK',
-		  promotionCode: renewData.current.promotionData.code,
+        promotionCode: renewData.current.promotionData.code
-		};
+      }
-		let httpsUrl = Https.httpUrls.payStripe;
+      let httpsUrl = Https.httpUrls.payStripe
-		payMethodData.isShowMark_ = true;
+      payMethodData.isShowMark_ = true
       Https.axiosPost(httpsUrl, data)
         .then((rv: any) => {
-			var width = 800;
+          var width = 800
-			var height = 600;
+          var height = 600
-			var left = (screen.width - width) / 2;
+          var left = (screen.width - width) / 2
-			var top = (screen.height - height) / 2;
+          var top = (screen.height - height) / 2
           payMethodData.newWindow = window.open(
-			  "",
+            '',
-			  "_blank",
+            '_blank',
-			  "width=" +
+            'width=' + width + ', height=' + height + ', left=' + left + ', top=' + top
-				width +
+          )
-				", height=" +
+          let herf = rv
-				height +
-				", left=" +
-				left +
-				", top=" +
-				top
-			);
-			let herf = rv;
           if (payMethodData.newWindow) {
-			  payMethodData.newWindow.location.href = herf;
+            payMethodData.newWindow.location.href = herf
           } else {
             // window.open(herf, '_blank');
-			  window.location.href = herf;
+            window.location.href = herf
           }
-			payMethodData.newWindow = null;
+          payMethodData.newWindow = null
-			payMethodData.isShowMark = true;
+          payMethodData.isShowMark = true
-			payMethodData.isShowMark_ = false;
+          payMethodData.isShowMark_ = false
+        })
+        .catch(res => {
+          payMethodData.isShowMark_ = false
         })
-		  .catch((res) => {
-			payMethodData.isShowMark_ = false;
-		  });
 
       // renewData.payMethod.init(data)
-	  };
+    }
     const setPaidBack = () => {
-		payMethod.payMethodModel = false;
+      payMethod.payMethodModel = false
-		payMethodData.isShowMark = false;
+      payMethodData.isShowMark = false
-		payMethodData.clause = false;
+      payMethodData.clause = false
-	  };
+    }
     const completePayment = () => {
-		renew.renewModel = false;
+      renew.renewModel = false
-		setPaidBack();
+      setPaidBack()
-	  };
+    }
     const examine = (item: any) => {
       // renewData.promotionData.error
-		let price = item?.price;
+      let price = item?.price
-		const normalNumber = Number(price.replace(/,/g, ""));
+      const normalNumber = Number(price.replace(/,/g, ''))
       if (!item.promotionData.code) {
-		  return;
+        return
       }
       let data = {
         promotionCode: item.promotionData.code,
-		  price: normalNumber,
+        price: normalNumber
-		};
+      }
-		Https.axiosGet(Https.httpUrls.checkCoupon, { params: data }).then(
+      Https.axiosGet(Https.httpUrls.checkCoupon, { params: data }).then((rv: any) => {
-		  (rv: any) => {
         if (rv) {
           renewData.personage.forEach((personageItem: any) => {
             if (personageItem.price == item.price) {
-				  if (rv.status == "valid") {
+              if (rv.status == 'valid') {
-					item.promotionData.error = "true";
+                item.promotionData.error = 'true'
-					item.promotionData.price = Number(
+                item.promotionData.price = Number(rv.discountedPrice).toLocaleString()
-					  rv.discountedPrice
-					).toLocaleString();
               } else {
-					item.promotionData.error = "false";
+                item.promotionData.error = 'false'
-					item.promotionData.str = rv.message;
+                item.promotionData.str = rv.message
               }
             }
-			  });
+          })
         } else {
         }
+      })
     }
-		);
-	  };
     const clearPromotionCode = () => {
-		renewData.current.promotionData.error = "";
+      renewData.current.promotionData.error = ''
-		renewData.current.promotionData.code = "";
+      renewData.current.promotionData.code = ''
-		renewData.current.promotionData.price = "";
+      renewData.current.promotionData.price = ''
-	  };
+    }
     const setPromotionData = (item: any) => {
-		renewData.current = item;
+      renewData.current = item
-	  };
+    }
     return {
       store,
       ...toRefs(renew),
@@ -536,18 +556,18 @@
       completePayment,
       examine,
       clearPromotionCode,
-		setPromotionData,
+      setPromotionData
-	  };
+    }
   },
   data() {
-	  return {};
+    return {}
   },
   methods: {
     turnToWindow(url: any) {
-		window.open(url);
+      window.open(url)
-	  },
+    }
-	},
+  }
-  });
+})
 </script>
 <style lang="less" scoped>
 .renew {
@@ -560,6 +580,18 @@
     overflow: hidden;
     > .left,
     > .right {
+      .apply-btn {
+        cursor: pointer;
+        background-color: rgb(27, 34, 60);
+        font-size: 0.8rem;
+        color: #fff;
+        padding: 0 0.5rem;
+				width: 3.3rem;
+				height: 1.4rem;
+				display: flex;
+				align-items: center;
+				justify-content: center;
+      }
       > .title {
         text-align: center;
         font-size: 3.2rem;
@@ -607,7 +639,7 @@
           height: 100%;
           left: 0;
           top: 0;
-			  background: rgba(0,0,0,.5);
+          background: rgba(0, 0, 0, 0.5);
         }
       }
 
@@ -679,11 +711,11 @@
           margin-bottom: 1rem;
           border-radius: 1rem;
           overflow: hidden;
-			border: 1.5px solid #E7EBFF;
+          border: 1.5px solid #e7ebff;
           cursor: pointer;
 
           > .popular {
-			  background: #1B223C;
+            background: #1b223c;
             font-weight: 600;
             display: flex;
             justify-content: center;
@@ -745,7 +777,7 @@
                   display: flex;
                   align-items: center;
                   border-radius: 2rem;
-					border: 2px solid #000;
+                  border: 1.5px solid rgb(216, 218, 220);
                   overflow: hidden;
                   padding: 0 1rem;
                   input {
@@ -768,11 +800,11 @@
               }
             }
           }
-			&.active,&:hover {
+          &.active,
+          &:hover {
             // 40% opacity
             background: rgba(231, 235, 255, 0.4);
             // border: 2px solid #0ea982;
-			 
           }
           &.sellWell {
             // border: 2px solid #0ea982;
@@ -810,9 +842,9 @@
         > .gallery_btn {
           width: 100%;
           margin: 2rem 0;
-			margin-bottom: .5rem;
+          margin-bottom: 0.5rem;
           margin-top: 1rem;
-			background: #1B223C;
+          background: #1b223c;
           color: #fff;
         }
         > .payMethod_payAffirm_clause {
@@ -839,8 +871,8 @@
             border: 1px solid #ededed;
             background: #f1fbf9;
             color: #1cb36c;
-			  padding: .4rem .8rem;
+            padding: 0.4rem 0.8rem;
-			  border-radius: .5rem;
+            border-radius: 0.5rem;
             margin-top: 4rem;
             > span {
               display: flex;
@@ -848,14 +880,14 @@
             }
             i {
               display: flex;
-				  margin-right: .5rem;
+              margin-right: 0.5rem;
             }
           }
           > .payIcon {
             height: 2rem;
             margin-top: 1rem;
             img {
-				  margin: 0 .3rem;
+              margin: 0 0.3rem;
               height: 100%;
             }
           }
@@ -953,4 +985,3 @@
   }
 }
 </style>
-  

src/component/WorksPage/newScaleImage.vue

@@ -458,6 +458,7 @@ export default defineComponent({
 					message.info(t('newScaleImage.jsContent2'))
 					return
 				}
+				store.state.Workspace.cachedRoutes = [];
 				let id = await getWorks(imgData.scaleImageData.id)
 				await router.push(`/home/history/${id}`)
 				store.commit('setChooseIsDesign',false)

src/component/home/design/collection/MoodboardUpload.vue

@@ -132,8 +132,8 @@
 				</div>
 				<div class="modal_img_max">
 					<div v-if="!modalImg[0]?.id" class="modal_img" id="modal_img" :class="{active:flex_direction}">
-						<div v-for="item,index in layoutList" :class="[moodb_className[index]]"  class="modal_imgItem">
+					<!-- <div class="modal_img" id="modal_img" :class="{active:flex_direction}"> -->
-							<img :src="item.imgUrl" v-modelImg>
+						<div v-for="item,index in layoutList" :class="[moodb_className[index]]" :style="{'background-image':`url(${item.imgUrl})`}" class="modal_imgItem">
 						</div>
 					</div>
 					<div v-else class="modal_img">
@@ -244,30 +244,6 @@ export default defineComponent({
         this.token = getCookie("token") || "";
         this.uploadUrl = getUploadUrl();
     },
-	directives:{
-		modelImg:{
-			mounted(el) {
-				let parentNode = el.parentNode
-				if(parentNode.offsetHeight >= parentNode.offsetWidth){
-					el.style.height = 100+'%'
-					el.style.width = 'auto'
-				}else{
-					el.style.width = 100+'%'
-					el.style.height = 'auto'
-				}
-			},
-			updated (el) {
-				let parentNode = el.parentNode
-				if(parentNode.offsetHeight >= parentNode.offsetWidth){
-					el.style.height = 100+'%'
-					el.style.width = 'auto'
-				}else{
-					el.style.width = 100+'%'
-					el.style.height = 'auto'
-				}
-			}
-		}
-	},
     methods: {
         open(num: Number) {
             this.openClick = num;
@@ -445,7 +421,7 @@ export default defineComponent({
 					}
 				}
 				this.edieShow = true
-				if(this.moodb_[arr.length-1].length == 2){
+				if(this.moodb_[arr.length-1].length == 1){
 					this.moodb_className = this.moodb_[arr.length-1][0]
 				}else{
 					this.moodb_className = this.moodb_[arr.length-1][random]
@@ -628,6 +604,7 @@ export default defineComponent({
 				height: calc(5rem*1.2);
 				overflow-x: hidden;
 				display: flex;
+				
 				&.modal_img::-webkit-scrollbar {
 					display: none;
 				}
@@ -706,15 +683,9 @@ export default defineComponent({
 					position: relative;
 					overflow: hidden;
 					text-align: center;
-					img{
+					background-repeat: no-repeat;
-						position: absolute;
+					background-position: center;
-						top: 50%;
+					background-size: cover;
-						left: 50%;
-						transform: translate(-50%,-50%);
-						// float: left;
-						// user-select:none;
-						// -webkit-user-drag: none;
-					}
 				}
 				.wh1{
 					width: 23%;

src/component/home/design/editDesignType/index.vue

@@ -242,7 +242,16 @@
               </div>
             </div>
             <div class="prompt-input-container" v-show="!showMotion">
-              <div class="title">{{ $t('ProductImg.Prompt') }}</div>
+              <div class="title">
+				<span>{{ $t('ProductImg.Prompt') }}</span>
+				<SvgIcon
+					class="cursor-icon"
+					@click="handleNavigateHelp"
+					name="CHelpFlip"
+					size="18"
+					color="#000"
+				/>
+			  </div>
               <promptInput :content="prompt" ref="promptInputRef" />
             </div>
             <div class="transferPose" v-show="showMotion">
@@ -380,7 +389,7 @@
       <a-spin size="large" />
     </div>
     <template>
-      <Prompt v-if="scaleImageList[scaleImageIndex]?.resultType === 'ToProductImage'" v-model:showModal="showPromptAssist" isDesignPage />
+      <Prompt v-if="scaleImageList[scaleImageIndex]?.resultType === 'ToProductImage'" v-model:showModal="showPromptAssist" />
       <PromptEditProduct v-if="scaleImageList[scaleImageIndex]?.resultType === 'Relight'" v-model:showModal="showPromptAssist" />
     </template>
     <Product
@@ -450,7 +459,7 @@ export default defineComponent({
     let userDetail: any = computed(() => {
       return store.state.UserHabit.userDetail
     })
-    let { t } = useI18n()
+    let { t, locale } = useI18n()
     const textareaRef = useTemplateRef<HTMLTextAreaElement>('textareaRef')
     const videoType = ref(2)
     const showMotion = computed(() => videoType.value === 1)
@@ -599,13 +608,13 @@ export default defineComponent({
     })
     const showPromptAssist = ref(false)
     const handleClickAssistBtn = () => {
-      const { httpType } = store.state.Workspace.probjects
+    //   const { httpType } = store.state.Workspace.probjects
-      const isSingleDesign = httpType === 'SINGLE_DESIGN'
+    //   const isSingleDesign = httpType === 'SINGLE_DESIGN'
-      if (!isSingleDesign) {
+    //   if (!isSingleDesign) {
-        const promptText = t('ProductImg.Series')
+    //     const promptText = t('ProductImg.Series')
-        productimg.productimgSearchName = promptText
+    //     productimg.productimgSearchName = promptText
-        return
+    //     return
-      }
+    //   }
       showPromptAssist.value = true
     }
 
@@ -1310,7 +1319,13 @@ export default defineComponent({
         return videoType.value === 3 ? false : true
       }
     })
-
+	const handleNavigateHelp = () => {
+      const url =
+        locale === 'CHINESE_SIMPLIFIED'
+          ? 'https://aida-user-manual-chinese.super.site/2b08f755cedd80a985cffdf2af80c538'
+          : 'https://aida-user-manual.super.site/advanced-tool/animated-product-image/to-product-video-prompt-assist '
+      window.open(url,'_blank')
+    }
     onBeforeUnmount(() => {
       clearInterval(prductimgTime)
       clearInterval(remPrductimgTime)
@@ -1374,7 +1389,8 @@ export default defineComponent({
       handlePlayNewVideo,
       isNewVideoPlaying,
       showDropdown,
-      inputPlaceholder
+      inputPlaceholder,
+	  handleNavigateHelp
     }
   },
   data() {
@@ -1787,10 +1803,14 @@ export default defineComponent({
             box-sizing: border-box;
           }
 		  .title {
-            font-weight: 500;
+			display: flex;
-            color: #000;
+			align-items: center;
-            font-size: 1.7rem;
+			column-gap: 1rem;
-            margin-bottom: 1.4rem;
+			.cursor-icon {
+				display: flex;
+				width: auto;
+				cursor: pointer;
+			}
 		  }
         }
         .prompt-container {

src/component/home/index.vue

@@ -55,13 +55,16 @@ export default defineComponent({
 		const data = reactive({
 			openType:'', 
 			componentKey:null,
-			isShowMark:false,
+			isShowMark:true,
 			routeQuery:{} as any,
 			selectObject:computed(()=>store.state.Workspace.probjects) as any,//选择的项目
 			chatData:null as any,
 			dataLoad:true as any,
 			cachedRoutes:computed(()=>store.state.Workspace.cachedRoutes),//
 		})
+		onMounted(()=>{
+			data.isShowMark = false
+		})
 		let settingGetHistory:any = inject('settingGetHistory')
 		const setIsShowMark = (boolean:boolean)=>{
 			data.isShowMark = boolean

src/component/home/tools/toProduct/Prompt.vue

@@ -121,7 +121,7 @@ const promptList = computed(() => {
     return [t('ProductImg.UploadWithoutModel'), t('ProductImg.UploadWithModel')]
   } else {
     // 如果是从design来的
-    if (isSingleDesign) {
+    if (props.isDesignPage) {
       // SINGLE_DESIGN: 两个提示词
       // 根据年龄和性别选择对应的提示词
       let firstPrompt: string // 不带模特的提示词
@@ -255,8 +255,8 @@ const exampleList = computed(() => {
     }
   } else {
     const { ageGroup, httpType, sex } = store.state.Workspace.probjects
-    const isSingleDesign = httpType === 'SINGLE_DESIGN'
+    // const isSingleDesign = httpType === 'SINGLE_DESIGN'
-    if (!isSingleDesign) return {}
+    // if (!isSingleDesign) return {}
     const isAdult = ageGroup === 'Adult'
     const isFemale = sex === 'Female'
     if (isAdult) {

src/component/home/tools/toProduct/index.vue

@@ -1101,13 +1101,13 @@ export default defineComponent({
 
     const showPromptAssist = ref(false)
     const handleClickAssistBtn = () => {
-      const { httpType } = store.state.Workspace.probjects
+    //   const { httpType } = store.state.Workspace.probjects
-      const isSingleDesign = httpType === 'SINGLE_DESIGN'
+    //   const isSingleDesign = httpType === 'SINGLE_DESIGN'
-      if (props.isDesignPage && !isSingleDesign) {
+    //   if (props.isDesignPage && !isSingleDesign) {
-        const promptText = t('ProductImg.Series')
+    //     const promptText = t('ProductImg.Series')
-        productImgData.searchName[props.productimgMenu.value] = promptText
+    //     productImgData.searchName[props.productimgMenu.value] = promptText
-        return
+    //     return
-      }
+    //   }
       showPromptAssist.value = true
     }
 

src/component/mainPage/signUp/index.vue

@@ -51,7 +51,7 @@
             <ul
               class="product_detail"
               :class="[
-                { academic: item.type == 'academic' && !isSelectSuccessively },
+                { academic: item.type == 'academic' },
                 { chinese: isSelectSuccessively }
               ]"
             >
@@ -106,12 +106,12 @@ export default defineComponent({
         Yearly: '年度',
         monthly: [
           {
-            title: '免费版',
+            title: '使用版',
             img: CChargeIcon,
             type: 'personal',
             info: '您的AI时尚设计助手',
             price: 'HK$0',
-            detail: '5天·50积分',
+            detail: '自注册之日起 5 天内 · 50 个积分',
             highlight: '',
             discounts: '9折优惠',
             detailList: [
@@ -185,12 +185,12 @@ export default defineComponent({
         ],
         yearl: [
           {
-            title: '免费版',
+            title: '试用版',
             img: CChargeIcon,
             type: 'personal',
             info: '您的AI时尚设计助手',
             price: 'HK$0',
-            detail: '5天·50积分',
+            detail: '自注册之日起 5 天内 · 50 个积分',
             highlight: '',
             discounts: '9折优惠',
             detailList: [
@@ -250,12 +250,12 @@ export default defineComponent({
         Yearly: 'Yearly',
         monthly: [
           {
-            title: 'Free',
+            title: 'Trial',
             img: CChargeIcon,
             type: 'personal',
             info: 'Your AI Fashion Design Assistant',
             price: 'HK$0',
-            detail: '5 days · 50 credits',
+            detail: '5 days from sign-up · 50 credits',
             highlight: '',
             discounts: '10% off',
             detailList: [
@@ -329,12 +329,12 @@ export default defineComponent({
         ],
         yearl: [
           {
-            title: 'Free',
+            title: 'Trial',
             img: CChargeIcon,
-            type: 'free',
+            type: 'personal',
             info: 'Your AI Fashion Design Assistant',
             price: 'HK$0',
-            detail: '5 days · 50 credits',
+            detail: '5 days from sign-up · 50 credits',
             highlight: '',
             discounts: '10% off',
             detailList: [

src/lang/en.ts

@@ -959,7 +959,7 @@ export default {
     MOSTPOPULAR: 'MOST POPULAR',
     Monthly: 'Monthly',
     Yearly: 'Yearly',
-    promotionCode: 'Coupon',
+    promotionCode: 'Coupon Code',
     use: 'Apply',
     PromoCodeError:
       'Please check if the promo code is correct or if the date has expired',