fix

src/component/Account/account.vue

@@ -41,8 +41,8 @@
 									<i v-if="!isEditUserName" class="fi fi-rr-edit" @click="openEdit('userName')"></i>
 									<i v-else class="fi fi-br-check" @click="editChek('userName')"></i>
 								</div>
-								<span class="Modifiable" v-if="userDetail.usernameModify > 0 && isEditUserName">{{ $t('account.remainingModifications') }}{{ userDetail.usernameModify }}</span>
-								<span class="Modifiable notModifiable" v-else-if="isEditUserName">{{ $t('account.notModifiable') }}</span>
+								<span class="Modifiable" v-if="userDetail.usernameModify > 0 && isEditUserName">{{ $t('account.remainingModifications') }}{{ userDetail.usernameModify }}/5</span>
+								<span class="Modifiable notModifiable" v-else-if="isEditUserName">{{ $t('account.notModifiable') }} {{ userDetail.usernameModify }}/5</span>
 							</div>
 							<div class="label">
 								<span>{{$t('account.email')}}: </span>

src/component/Account/frontPage/bindPage.vue

@@ -212,6 +212,7 @@ export default defineComponent({
 .bindPage_page{
 	height: 100%;
 	overflow-y: auto;
+	padding-bottom: 2rem;
 	.bindPage_page_body{
 		.bind_item{
 			margin-bottom: 4rem;

src/component/Account/frontPage/cancelRenewal.vue

@@ -5,7 +5,13 @@
 				<div class="modal_title_text">
 					<div>{{ $t('cancelRenewal.cancelling') }}</div>
 				</div>
-				<textarea v-model="textareaValue" placeholder="Share your feedback here..."></textarea>
+				<div class="cause_list">
+					<label class="cause_item" v-for="item in causeList" :key="item.vlaue">
+						<input type="checkbox" name="cause" v-model="selectedOptions" :value="item.value">
+						<div>{{ item.str }}</div>
+					</label>
+					<textarea v-model="textareaValue" placeholder="Share your feedback here..."></textarea>
+				</div>
 			</div>
 			<div class="cancel_box_item cancel_box_item2">
 				<div class="modal_title_text">
@@ -51,21 +57,49 @@ export default defineComponent({
     },
     setup() {
         const store = useStore();
+		const {t} = useI18n()
 		let userDetail:any= computed(()=>{
 			return store.state.UserHabit.userDetail
 		})
 		let accountHomeData:any = reactive({
 			textareaValue:'',
 			isShowMark:false,
+			causeList:[
+				{
+					vlaue:'Too expensive',
+					str:t('account.jsContent1'),
+				},{
+					value:'Sytem not user friendly',
+					str:t('account.jsContent2'),
+				},{
+					value:'Too Slowy',
+					str:t('account.jsContent3'),
+				},{
+					value:'Difficult to edit',
+					str:t('account.jsContent4'),
+				},{
+					value:'Insufficlent Tutorial/Support',
+					str:t('account.jsContent5'),
+				},{
+					value:'Unable to generate what you need',
+					str:t('account.jsContent6'),
+				}
+			],
+			selectedOptions:[]
 		})
 		let renew = ref()
 		const subscribe = ()=>{
 			renew.value.init()
 		}
 		const cancelSubscription = ()=>{
+			let str = ''
+			accountHomeData.selectedOptions.forEach((item:any)=>{
+				str += ' #' + item
+			})
+
 			let data = {
 				subscriptionId:userDetail.value.subscriptionId,
-				reason:'',
+				reason:accountHomeData.textareaValue + str,
 			}
 			accountHomeData.isShowMark = true
 			Https.axiosGet(Https.httpUrls.cancelSubscription, {params:data})
@@ -100,6 +134,7 @@ export default defineComponent({
 .cancelRenewal_page{
 	height: 100%;
 	overflow-y: auto;
+	padding-bottom: 2rem;
 	>div{
 		display: flex;
 		flex-direction: column;
@@ -128,19 +163,28 @@ export default defineComponent({
 				border-radius: 1.4rem;
 			}
 		}	
-		>textarea{
-			margin-top: 1.5rem;
-			width: 100%;
-			border-radius: 1.4rem;
-			border: 1px solid #D0D0D0;
-			height: 11rem !important;
-			font-size: 1.6rem;
-			transition: border .3s;
-			padding: 1.5rem;
-		}
-		>textarea:hover{
-			border: 1px solid #000;
+		>.cause_list{
+			> .cause_item{
+				display: flex;
+				input{
+					margin-right: 1rem;
+				}
+			}
+			>textarea{
+				margin-top: 1.5rem;
+				width: 100%;
+				border-radius: 1.4rem;
+				border: 1px solid #D0D0D0;
+				height: 11rem !important;
+				font-size: 1.6rem;
+				transition: border .3s;
+				padding: 1.5rem;
+			}
+			>textarea:hover{
+				border: 1px solid #000;
+			}
 		}
+		
 		>.button_box{
 			display: flex;
 			margin-top: 2.5rem;

src/component/Account/frontPage/mylnformation.vue

@@ -95,6 +95,7 @@ export default defineComponent({
 .accountEdit_page{
 	height: 100%;
 	overflow-y: auto;
+	padding-bottom: 2rem;
 	.accountEdit_page_body{
 		width: 100%;
 		// width: 85rem;