refactor: Improve code formatting and structure in main.ts and Login.vue

- Standardized import statements in main.ts for better readability.
- Enhanced the structure of the Vue component in Login.vue for improved clarity.
- Updated event handling and state management in Login.vue.
- Adjusted CSS styles for consistency and better organization.

components.d.ts

@@ -8,6 +8,11 @@ export {}
 /* prettier-ignore */
 declare module 'vue' {
   export interface GlobalComponents {
+    AImage: typeof import('ant-design-vue/es')['Image']
+    AModal: typeof import('ant-design-vue/es')['Modal']
+    APopover: typeof import('ant-design-vue/es')['Popover']
+    ASelect: typeof import('ant-design-vue/es')['Select']
+    ASpin: typeof import('ant-design-vue/es')['Spin']
     RouterLink: typeof import('vue-router')['RouterLink']
     RouterView: typeof import('vue-router')['RouterView']
   }

src/component/Administrator/SE/allUser/addAllUser.vue

@@ -16,12 +16,33 @@
   >
     <div class="generalModel_btn">
       <div class="generalModel_closeIcon" @click.stop="cancelDsign()">
-				<svg width="46" height="46" viewBox="0 0 46 46" fill="none" xmlns="http://www.w3.org/2000/svg">
+        <svg
-						<circle cx="23" cy="23" r="23" fill="white" fill-opacity="0.3"/>
+          width="46"
-						<rect x="32.5063" y="12" width="3" height="29" rx="1.5" transform="rotate(45 32.5063 12)" fill="white"/>
+          height="46"
-						<rect x="34.6274" y="32.5059" width="3" height="29" rx="1.5" transform="rotate(135 34.6274 32.5059)" fill="white"/>
+          viewBox="0 0 46 46"
+          fill="none"
+          xmlns="http://www.w3.org/2000/svg"
+        >
+          <circle cx="23" cy="23" r="23" fill="white" fill-opacity="0.3" />
+          <rect
+            x="32.5063"
+            y="12"
+            width="3"
+            height="29"
+            rx="1.5"
+            transform="rotate(45 32.5063 12)"
+            fill="white"
+          />
+          <rect
+            x="34.6274"
+            y="32.5059"
+            width="3"
+            height="29"
+            rx="1.5"
+            transform="rotate(135 34.6274 32.5059)"
+            fill="white"
+          />
         </svg>
-
       </div>
     </div>
     <div class="modal_title_text">
@@ -66,17 +87,10 @@
           style="width: 250px"
         />
       </div>
-			
-			
     </div>
     <div class="allUserPoeration_btn admin_page">
-			<div class="admin_search_item" @click="cancelDsign">
+      <div class="admin_search_item" @click="cancelDsign">Close</div>
-				Close
+      <div class="admin_search_item" @click="setOk">OK</div>
-			</div>
-			<div class="admin_search_item" @click="setOk">
-				OK
-			</div>
-		
     </div>
   </a-modal>
   <div class="mark_loading" v-show="loadingShow">
@@ -84,142 +98,157 @@
   </div>
 </template>
 <script>
-import { defineComponent, ref, reactive, watch, onMounted, nextTick, toRefs } from "vue";
+import {
+  defineComponent,
+  ref,
+  reactive,
+  watch,
+  onMounted,
+  nextTick,
+  toRefs,
+} from "vue";
 import { Https } from "@/tool/https";
 import { Modal, message } from "ant-design-vue";
 import { ExclamationCircleOutlined } from "@ant-design/icons-vue";
-import { formatTime,isEmail } from "@/tool/util";
+import { formatTime, isEmail } from "@/tool/util";
-const md5 = require("md5");
+import md5 from "md5";
 export default defineComponent({
-    components: {
+  components: {},
-    },
+  emits: ["searchHistoryList"],
-	emits: ['searchHistoryList'],
+  setup(props, { emit }) {
-    setup(props,{emit}) {
     let operations = reactive({
-			operationsModal:false,
+      operationsModal: false,
-			operationsEdit:false,
+      operationsEdit: false,
-			loadingShow:false,
+      loadingShow: false,
-			title:''
+      title: "",
-		})
+    });
     let operationsData = reactive({
-			accountId:-1,
+      accountId: -1,
-			userName:'',
+      userName: "",
-			userEmail:'',
+      userEmail: "",
-			password:'',
+      password: "",
-			oldPassword:'',
+      oldPassword: "",
-			credits:'',
+      credits: "",
-		})
+    });
     let state = ref([
       {
-				label:'visitor',
+        label: "visitor",
-				value:'0',
+        value: "0",
       },
       {
-				label:'yearly',
+        label: "yearly",
-				value:'1',
+        value: "1",
       },
       {
-				label:'monthly',
+        label: "monthly",
-				value:'2',
+        value: "2",
       },
       {
-				label:'trial',
+        label: "trial",
-				value:'3',
+        value: "3",
       },
     ]);
-		let init = (funStr,data)=>{
+    let init = (funStr, data) => {
-			operations.operationsModal = true
+      operations.operationsModal = true;
-			operations.operationsEdit = true
+      operations.operationsEdit = true;
-			operations.title = funStr
+      operations.title = funStr;
-			if(funStr == 'Add') operations.operationsEdit = false 
+      if (funStr == "Add") operations.operationsEdit = false;
-			if(funStr == 'Edit'){
+      if (funStr == "Edit") {
-				operationsData.accountId=data.id
+        operationsData.accountId = data.id;
-				operationsData.userName=data.userName
+        operationsData.userName = data.userName;
-				operationsData.userEmail=data.userEmail 
+        operationsData.userEmail = data.userEmail;
-				operationsData.password=data.userPassword 
+        operationsData.password = data.userPassword;
-				operationsData.oldPassword=data.userPassword 
+        operationsData.oldPassword = data.userPassword;
         // operationsData.validStartTime='2024-08-05T00:00:06'
         // operationsData.validEndTime='2024-08-05T00:00:06'
-				operationsData.credits=data.creditsUsageLimit
+        operationsData.credits = data.creditsUsageLimit;
         // operationsData.accountId = data.accountId
         // operationsData.userName = data.userName
         // operationsData.userEmail = data.userEmail
         // operationsData.validStartTime = formatTime(data.validStartTime)
         // operationsData.validEndTime = formatTime(data.validEndTime)
       }
-
+    };
+    let focus = (event) => {
+      if (operationsData.password == operationsData.oldPassword) {
+        operationsData.password = "";
       }
-		let focus = (event) =>{
+    };
-			if(operationsData.password == operationsData.oldPassword){
+    let blur = (event) => {
-				operationsData.password = ''
+      console.log(operationsData.password == "" && operationsData.oldPassword);
+      if (operationsData.password == "" && operationsData.oldPassword) {
+        operationsData.password = operationsData.oldPassword;
       }
-		}
+    };
-		let blur = (event) =>{
+    let setAddData = () => {
-			console.log((operationsData.password == '' && operationsData.oldPassword))
-			if(operationsData.password == '' && operationsData.oldPassword){
-				operationsData.password = operationsData.oldPassword
-			}
-		}
-		let setAddData = ()=>{
       return {
-				"creditsUsageLimit": operationsData.credits,
+        creditsUsageLimit: operationsData.credits,
-				"userEmail": operationsData.userEmail,
+        userEmail: operationsData.userEmail,
-				"userPassword": md5(operationsData.password + 'abc'),
+        userPassword: md5(operationsData.password + "abc"),
-				"userName": operationsData.userName,
+        userName: operationsData.userName,
-			}
+      };
-		}
+    };
-		let setEditData = ()=>{
+    let setEditData = () => {
       return {
-				"id": operationsData.accountId,
+        id: operationsData.accountId,
-				"creditsUsageLimit": operationsData.credits,
+        creditsUsageLimit: operationsData.credits,
-				"userName": operationsData.userName,
+        userName: operationsData.userName,
-				"userEmail": operationsData.userEmail,
+        userEmail: operationsData.userEmail,
-				"userPassword": (operationsData.password == operationsData.oldPassword)?'':md5(operationsData.password + 'abc'),
+        userPassword:
-			}
+          operationsData.password == operationsData.oldPassword
-		}
+            ? ""
-		let cancelDsign = ()=>{
+            : md5(operationsData.password + "abc"),
-			operationsData.accountId=-1
+      };
-			operationsData.userName=''
+    };
-			operationsData.userEmail=''
+    let cancelDsign = () => {
-			operationsData.password=''
+      operationsData.accountId = -1;
-			operationsData.credits=''
+      operationsData.userName = "";
-			operations.operationsModal = false
+      operationsData.userEmail = "";
-		}
+      operationsData.password = "";
-		let setOk = ()=>{
+      operationsData.credits = "";
-			let data 
+      operations.operationsModal = false;
-			if(operations.title == 'Add'){
+    };
-				data = setAddData()
+    let setOk = () => {
+      let data;
+      if (operations.title == "Add") {
+        data = setAddData();
         if (!isEmail(data.userEmail)) {
           message.info("The email format is incorrect");
           return;
         }
-				if(!data.userName || !data.userEmail || !data.userPassword || !data.creditsUsageLimit)return message.warning('Please check the input box marked with *')
+        if (
+          !data.userName ||
+          !data.userEmail ||
+          !data.userPassword ||
+          !data.creditsUsageLimit
+        )
+          return message.warning("Please check the input box marked with *");
         Https.axiosPost(Https.httpUrls.addOrUpdateSubAccount, data).then(
           (rv) => {
             if (rv) {
-						cancelDsign()
+              cancelDsign();
-						emit('searchHistoryList')
+              emit("searchHistoryList");
             }
           }
         );
-			}else{
+      } else {
-				data = setEditData()
+        data = setEditData();
         if (!isEmail(data.userEmail)) {
           message.info("The email format is incorrect");
           return;
         }
-				if(!data.userName || !data.userEmail || !data.creditsUsageLimit)return message.warning('Please check the input box marked with *')
+        if (!data.userName || !data.userEmail || !data.creditsUsageLimit)
-				Https.axiosPost(Https.httpUrls.addOrUpdateSubAccount,data).then(
+          return message.warning("Please check the input box marked with *");
+        Https.axiosPost(Https.httpUrls.addOrUpdateSubAccount, data).then(
           (rv) => {
             if (rv) {
-						cancelDsign()
+              cancelDsign();
-						emit('searchHistoryList')
+              emit("searchHistoryList");
             }
           }
         );
       }
-			
+    };
-		}
     return {
       ...toRefs(operations),
       ...toRefs(operationsData),
@@ -232,41 +261,36 @@ export default defineComponent({
     };
   },
   data() {
-        return {
+    return {};
-        };
   },
   mounted() {},
-    methods: {
+  methods: {},
-       
-    },
 });
 </script>
 <style lang="less" scoped>
-:deep(.allUserPoeration_modal){
+:deep(.allUserPoeration_modal) {
-	.ant-modal-body{
+  .ant-modal-body {
     display: flex;
     flex-direction: column;
   }
 }
-
 </style>
 <style lang="less" scoped>
-
 .allUserPoeration_modal {
   .closeIcon {
     z-index: 2;
   }
-	.allUserPoeration_btn{
+  .allUserPoeration_btn {
     display: flex;
     flex-direction: row;
     height: auto;
     justify-content: flex-end;
     padding: 1rem 0;
-		.admin_search_item{
+    .admin_search_item {
       margin-bottom: 0;
     }
   }
-	.allUserPoeration_center{
+  .allUserPoeration_center {
     flex: 1;
     overflow-y: auto;
     flex-direction: row;

src/component/Administrator/coupons/addAllUser.vue

@@ -16,12 +16,33 @@
   >
     <div class="generalModel_btn">
       <div class="generalModel_closeIcon" @click.stop="cancelDsign()">
-				<svg width="46" height="46" viewBox="0 0 46 46" fill="none" xmlns="http://www.w3.org/2000/svg">
+        <svg
-						<circle cx="23" cy="23" r="23" fill="white" fill-opacity="0.3"/>
+          width="46"
-						<rect x="32.5063" y="12" width="3" height="29" rx="1.5" transform="rotate(45 32.5063 12)" fill="white"/>
+          height="46"
-						<rect x="34.6274" y="32.5059" width="3" height="29" rx="1.5" transform="rotate(135 34.6274 32.5059)" fill="white"/>
+          viewBox="0 0 46 46"
+          fill="none"
+          xmlns="http://www.w3.org/2000/svg"
+        >
+          <circle cx="23" cy="23" r="23" fill="white" fill-opacity="0.3" />
+          <rect
+            x="32.5063"
+            y="12"
+            width="3"
+            height="29"
+            rx="1.5"
+            transform="rotate(45 32.5063 12)"
+            fill="white"
+          />
+          <rect
+            x="34.6274"
+            y="32.5059"
+            width="3"
+            height="29"
+            rx="1.5"
+            transform="rotate(135 34.6274 32.5059)"
+            fill="white"
+          />
         </svg>
-
       </div>
     </div>
     <div class="modal_title_text">
@@ -37,10 +58,10 @@
           style="width: 220px"
         />
       </div>
-			<div class="admin_state_item" >
+      <div class="admin_state_item">
         <span>percentOff(%): <span>*</span></span>
         <input
-					:class="{active:title != 'Add'}"
+          :class="{ active: title != 'Add' }"
           :disabled="title != 'Add'"
           v-model="percentOff"
           placeholder="Please enter percentOff"
@@ -48,10 +69,10 @@
           style="width: 220px"
         />
       </div>
-			<div class="admin_state_item" >
+      <div class="admin_state_item">
         <span>Commission Rate: <span>*</span></span>
         <input
-					:class="{active:title != 'Add'}"
+          :class="{ active: title != 'Add' }"
           :disabled="title != 'Add'"
           v-model="commissionRate"
           placeholder="Please enter commission rate"
@@ -59,17 +80,21 @@
           style="width: 220px"
         />
       </div>
-			<div class="admin_state_item" >
+      <div class="admin_state_item">
         <!-- <div class="admin_state_item" > -->
         <span>End Time: <span>*</span></span>
-				<a-space direction="vertical" style="width:220px">
+        <a-space direction="vertical" style="width: 220px">
-					<a-date-picker v-model:value="rangePickerValue" :disabled="title != 'Add'" style="width:220px" />
+          <a-date-picker
+            v-model:value="rangePickerValue"
+            :disabled="title != 'Add'"
+            style="width: 220px"
+          />
         </a-space>
       </div>
-			<div class="admin_state_item" >
+      <div class="admin_state_item">
         <span>MaxRedemptions:</span>
         <input
-					:class="{active:title != 'Add'}"
+          :class="{ active: title != 'Add' }"
           :disabled="title != 'Add'"
           v-model="maxRedemptions"
           placeholder="Please enter maximum"
@@ -77,7 +102,7 @@
           style="width: 220px"
         />
       </div>
-			<div class="admin_state_item" >
+      <div class="admin_state_item">
         <span>PaidCommission:</span>
         <input
           v-model="paidCommission"
@@ -95,17 +120,10 @@
           style="width: 220px"
         />
       </div>
-			
-			
     </div>
     <div class="allUserPoeration_btn admin_page">
-			<div class="admin_search_item" @click="cancelDsign">
+      <div class="admin_search_item" @click="cancelDsign">Close</div>
-				Close
+      <div class="admin_search_item" @click="setOk">OK</div>
-			</div>
-			<div class="admin_search_item" @click="setOk">
-				OK
-			</div>
-		
     </div>
   </a-modal>
   <div class="mark_loading" v-show="loadingShow">
@@ -113,48 +131,58 @@
   </div>
 </template>
 <script>
-import { defineComponent, ref, reactive, watch, onMounted, nextTick, toRefs } from "vue";
+import {
+  defineComponent,
+  ref,
+  reactive,
+  watch,
+  onMounted,
+  nextTick,
+  toRefs,
+} from "vue";
 import { Https } from "@/tool/https";
 import { Modal, message } from "ant-design-vue";
 import { ExclamationCircleOutlined } from "@ant-design/icons-vue";
-import { formatTime,isEmail } from "@/tool/util";
+import { formatTime, isEmail } from "@/tool/util";
-import dayjs, { Dayjs } from 'dayjs';
+import dayjs, { Dayjs } from "dayjs";
-const md5 = require("md5");
+import md5 from "md5";
 export default defineComponent({
-    components: {
+  components: {},
-    },
+  emits: ["searchHistoryList"],
-	emits: ['searchHistoryList'],
+  setup(props, { emit }) {
-    setup(props,{emit}) {
     let operations = reactive({
-			operationsModal:false,
+      operationsModal: false,
-			operationsEdit:false,
+      operationsEdit: false,
-			loadingShow:false,
+      loadingShow: false,
-			title:''
+      title: "",
-		})
+    });
     let operationsData = reactive({
-        	rangePickerValue:'',
+      rangePickerValue: "",
-			percentOff:'',
+      percentOff: "",
-			commissionRate:'',
+      commissionRate: "",
-			maxRedemptions:'',
+      maxRedemptions: "",
-			cooperator:'',
+      cooperator: "",
-			paidCommission:'',
+      paidCommission: "",
-			remark:'',
+      remark: "",
-			id:''
+      id: "",
-		})
+    });
-		let init = (funStr,data)=>{
+    let init = (funStr, data) => {
-			operations.operationsModal = true
+      operations.operationsModal = true;
-			operations.operationsEdit = true
+      operations.operationsEdit = true;
-			operations.title = funStr
+      operations.title = funStr;
-			if(funStr == 'Add') operations.operationsEdit = false 
+      if (funStr == "Add") operations.operationsEdit = false;
-			if(funStr == 'Edit'){
+      if (funStr == "Edit") {
-				operationsData.id=data.id
+        operationsData.id = data.id;
-				operationsData.percentOff=data.percentOff
+        operationsData.percentOff = data.percentOff;
-				operationsData.commissionRate=data.commissionRate
+        operationsData.commissionRate = data.commissionRate;
-				operationsData.maxRedemptions=data.maxRedemptions 
+        operationsData.maxRedemptions = data.maxRedemptions;
-				operationsData.cooperator=data.cooperator 
+        operationsData.cooperator = data.cooperator;
-				operationsData.paidCommission=data.paidCommission 
+        operationsData.paidCommission = data.paidCommission;
-				operationsData.remark=data.remark 
+        operationsData.remark = data.remark;
-				operationsData.rangePickerValue = dayjs(new Date(data.redeemBy * 1000).toISOString().split('T')[0],'YYYY/MM/DD');
+        operationsData.rangePickerValue = dayjs(
+          new Date(data.redeemBy * 1000).toISOString().split("T")[0],
+          "YYYY/MM/DD"
+        );
 
         // operationsData.rangePickerValue='2024-08-05T00:00:06'
         // operationsData.validEndTime='2024-08-05T00:00:06'
@@ -163,65 +191,64 @@ export default defineComponent({
         // operationsData.validStartTime = formatTime(data.validStartTime)
         // operationsData.validEndTime = formatTime(data.validEndTime)
       }
-
+    };
-		}
+    let setAddData = () => {
-		let setAddData = ()=>{
+      const timestampMs =
-			const timestampMs = new Date(operationsData.rangePickerValue).getTime() / 1000; // 直接获取毫秒时间戳
+        new Date(operationsData.rangePickerValue).getTime() / 1000; // 直接获取毫秒时间戳
       return {
-				"percentOff": operationsData.percentOff,
+        percentOff: operationsData.percentOff,
-				"maxRedemptions": operationsData.maxRedemptions,
+        maxRedemptions: operationsData.maxRedemptions,
-				"commissionRate": operationsData.commissionRate,
+        commissionRate: operationsData.commissionRate,
-				"timestamp": timestampMs,
+        timestamp: timestampMs,
-				cooperator:operationsData.cooperator,
+        cooperator: operationsData.cooperator,
-				remark:operationsData.remark,
+        remark: operationsData.remark,
-			}
+      };
-		}
+    };
-		let setEditData = ()=>{
+    let setEditData = () => {
-			const timestampMs = new Date(operationsData.rangePickerValue).getTime() / 1000; // 直接获取毫秒时间戳
+      const timestampMs =
+        new Date(operationsData.rangePickerValue).getTime() / 1000; // 直接获取毫秒时间戳
       return {
         id: operationsData.id,
         paidCommission: operationsData.commissionRate,
-				cooperator:operationsData.cooperator,
+        cooperator: operationsData.cooperator,
-				remark:operationsData.remark,
+        remark: operationsData.remark,
-			}
+      };
-		}
+    };
-		let cancelDsign = ()=>{
+    let cancelDsign = () => {
-			operationsData.rangePickerValue=''
+      operationsData.rangePickerValue = "";
-			operationsData.percentOff=''
+      operationsData.percentOff = "";
-			operationsData.commissionRate=''
+      operationsData.commissionRate = "";
-			operationsData.maxRedemptions=''
+      operationsData.maxRedemptions = "";
-			operationsData.cooperator=''
+      operationsData.cooperator = "";
-			operationsData.paidCommission=''
+      operationsData.paidCommission = "";
-			operationsData.remark=''
+      operationsData.remark = "";
-			operationsData.id=''
+      operationsData.id = "";
-			operations.operationsModal = false
+      operations.operationsModal = false;
-		}
+    };
-		let setOk = ()=>{
+    let setOk = () => {
-			let data 
+      let data;
-			if(operations.title == 'Add'){
+      if (operations.title == "Add") {
-				data = setAddData()
+        data = setAddData();
-				if(!data.commissionRate || !data.timestamp || !data.percentOff)return message.warning('Please check the input box marked with *')
+        if (!data.commissionRate || !data.timestamp || !data.percentOff)
-				Https.axiosPost(Https.httpUrls.createCoupon, data).then(
+          return message.warning("Please check the input box marked with *");
-				(rv) => {
+        Https.axiosPost(Https.httpUrls.createCoupon, data).then((rv) => {
           if (rv) {
-						cancelDsign()
+            cancelDsign();
-						emit('searchHistoryList')
+            emit("searchHistoryList");
           }
-				}
+        });
-			);
+      } else {
-			}else{
+        data = setEditData();
-				data = setEditData()
+        Https.axiosGet(Https.httpUrls.updatePromCodeInfo, {
-				Https.axiosGet(Https.httpUrls.updatePromCodeInfo,{params:data}).then(
+          params: data,
-				(rv) => {
+        }).then((rv) => {
           if (rv) {
-						cancelDsign()
+            cancelDsign();
-						emit('searchHistoryList')
+            emit("searchHistoryList");
           }
+        });
       }
-			);
+    };
-			}
-			
-		}
     return {
       ...toRefs(operations),
       ...toRefs(operationsData),
@@ -233,41 +260,36 @@ export default defineComponent({
     };
   },
   data() {
-        return {
+    return {};
-        };
   },
   mounted() {},
-    methods: {
+  methods: {},
-       
-    },
 });
 </script>
 <style lang="less" scoped>
-:deep(.allUserPoeration_modal){
+:deep(.allUserPoeration_modal) {
-	.ant-modal-body{
+  .ant-modal-body {
     display: flex;
     flex-direction: column;
   }
 }
-
 </style>
 <style lang="less" scoped>
-
 .allUserPoeration_modal {
   .closeIcon {
     z-index: 2;
   }
-	.allUserPoeration_btn{
+  .allUserPoeration_btn {
     display: flex;
     flex-direction: row;
     height: auto;
     justify-content: flex-end;
     padding: 1rem 0;
-		.admin_search_item{
+    .admin_search_item {
       margin-bottom: 0;
     }
   }
-	.allUserPoeration_center{
+  .allUserPoeration_center {
     flex: 1;
     overflow-y: auto;
     flex-direction: row;

src/component/LoginPage/login/enterprise.vue

@@ -8,19 +8,19 @@
           <!-- v-show="loginType == 'username'" -->
           <div>
             <div class="login_form_content" :state="emailStap">
-							
               <div v-show="emailStap === 1">
-								<div class="login_form_title marign_top30">
+                <div class="login_form_title marign_top30">Enterprise</div>
-									Enterprise
-								</div>
                 <div class="generalModel_state">
-									<div class="generalModel_state_item" style="width: 100%; margin: 0;">
+                  <div
+                    class="generalModel_state_item"
+                    style="width: 100%; margin: 0"
+                  >
                     <a-select
                       placeholder="Select a school"
                       v-model:value="selectEnterprise"
                       :options="schoolList"
                       @change="schoolListChange"
-											style="width:100%"
+                      style="width: 100%"
                       show-search
                       size="large"
                       :fieldNames="{ label: 'name', value: 'value' }"
@@ -36,9 +36,7 @@
                     </a-select>
                   </div>
                 </div>
-								<div class="login_form_title marign_top30">
+                <div class="login_form_title marign_top30">Email</div>
-									Email
-								</div>
                 <input
                   class="login_form_input"
                   placeholder="Enter your email address"
@@ -63,21 +61,16 @@
                 </div>
               </div>
 
-
               <!-- 邮箱登录 start -->
               <div
                 v-show="emailStap === 2"
                 class="login_form_email"
                 :class="{ active: emailStap === 2 }"
               >
-                                <div
+                <div v-show="emailStap === 2" class="email_last_step">
-                                    v-show="emailStap === 2"
-                                    class="email_last_step"
-                                >
                   <div class="email_last_step_block">
                     <span class="email_last_step_content"
-                                            >Verify with one-time verification
+                      >Verify with one-time verification code</span
-                                            code</span
                     >
                     <i
                       class="fi fi-br-cross email_last_step_block_icon"
@@ -86,34 +79,23 @@
                   </div>
                   <div class="email_last_step_bottom">
                     <div class="email_last_step_des">
-                                            <div class="sent_email_content">
+                      <div class="sent_email_content">Sent to {{ email }}</div>
-                                                Sent to {{ email }}
-                                            </div>
                       <div class="tip_content">
-                                                <span v-show="time"
+                        <span v-show="time">{{ time }}s</span>
-                                                    >{{ time }}s</span
+                        <span v-show="!time" @click="emailNextStepFun()"
-                                                >
-                                                <span
-                                                    v-show="!time"
-                                                    @click="emailNextStepFun()"
                           >Resend</span
                         >
                       </div>
                     </div>
                     <VerificationCodeInput
                       :ct="emailCode"
-                                            @sendCaptcha="
+                      @sendCaptcha="submitEmailLogin($event)"
-                                                submitEmailLogin($event)
-                                            "
                     ></VerificationCodeInput>
 
                     <div class="email_last_step_des">
-                                            <div
+                      <div class="sent_email_content email_tip_content">
-                                                class="sent_email_content email_tip_content"
+                        Please check the junk box if you haven't received
-                                            >
+                        verification code
-                                                Please check the junk box if you
-                                                haven't received verification
-                                                code
                       </div>
                     </div>
                   </div>
@@ -123,15 +105,8 @@
 
             <div class="login_form_title marign_top30">
               <label :class="{ active: emailStap == 2 }">
-                                <input
+                <input :state="emailStap" type="checkbox" v-model="checked" />
-                                    :state="emailStap"
+                <span>I agree to all Term, Privacy Policy and Fees</span>
-                                    type="checkbox"
-                                    v-model="checked"
-                                />
-                                <span
-                                    >I agree to all Term, Privacy Policy and
-                                    Fees</span
-                                >
               </label>
             </div>
             <!-- <div class="thirdPartyLogin marign_top30">
@@ -165,7 +140,6 @@
         </div>
 
         <!-- 邮箱登录 end -->
-               
       </div>
 
       <!-- 忘记密码 start -->
@@ -175,9 +149,7 @@
           @click="forgetPasswordLastStepFun()"
         >
           <i class="fi fi-br-arrow-left"></i>
-                    <span class="forget_password_content_title"
+          <span class="forget_password_content_title">Retrieve password</span>
-                        >Retrieve password</span
-                    >
         </div>
         <div v-show="frogetPasswordStep === 1">
           <div class="forget_passored_form_content">
@@ -205,9 +177,7 @@
             </div>
             <div class="tip_content">
               <span v-show="time">{{ time }}s</span>
-                            <span
+              <span v-show="!time" @click="forgetPasswordNextStepFun()"
-                                v-show="!time"
-                                @click="forgetPasswordNextStepFun()"
                 >Resend</span
               >
             </div>
@@ -245,7 +215,7 @@
 </template>
 
 <script lang="ts">
-import { defineComponent, ref, onMounted, reactive,toRefs } from "vue";
+import { defineComponent, ref, onMounted, reactive, toRefs } from "vue";
 import { Https } from "@/tool/https";
 import { isEmail } from "@/tool/util";
 import { setCookie, WriteCookie } from "@/tool/cookie";
@@ -257,42 +227,47 @@ import phoneLogin from "@/component/LoginPage/phoneLogin.vue";
 import { useStore } from "vuex";
 import { useI18n } from "vue-i18n";
 import { setLang } from "@/tool/guide";
-const md5 = require("md5");
+import md5 from "md5";
 export default defineComponent({
   components: {
-        VerificationCodeInput,googleLogin,weiXinLogin,phoneLogin
+    VerificationCodeInput,
+    googleLogin,
+    weiXinLogin,
+    phoneLogin,
   },
   setup() {
     let timer: any = 0;
     const { locale } = useI18n();
     const store = useStore();
-		let loadingShow = ref(false)
+    let loadingShow = ref(false);
     const data = reactive({
-			selectEnterprise:'',
+      selectEnterprise: "",
-			schoolList:[] as any,
+      schoolList: [] as any,
-		})
+    });
-		const schoolListChange = (e:any)=>{
+    const schoolListChange = (e: any) => {};
-		}
+    const filterOption = (e: any) => {
-		const filterOption = (e:any)=>{
       let params = {
-				name:e,
+        name: e,
-				type:'Enterprise'
+        type: "Enterprise",
-			}
+      };
-			Https.axiosPost(Https.httpUrls.organizationNameSearch,{},{params:params}).then((rv:any)=>{
+      Https.axiosPost(
-				data.schoolList = rv.map((item:any)=>{
+        Https.httpUrls.organizationNameSearch,
+        {},
+        { params: params }
+      ).then((rv: any) => {
+        data.schoolList = rv.map((item: any) => {
           return {
-						label:item,
+            label: item,
-						value:item,
+            value: item,
-					}	
+          };
-				})
+        });
-			})
+      });
-			
+    };
-		}
+    const handleFocus = () => {
-		const handleFocus= ()=>{
+      if (data.schoolList.length == 0) {
-			if(data.schoolList.length == 0){
+        filterOption("");
-				filterOption('')
-			}
       }
+    };
     return {
       ...toRefs(data),
       store,
@@ -300,7 +275,8 @@ export default defineComponent({
       locale,
       loadingShow,
       schoolListChange,
-			filterOption,handleFocus
+      filterOption,
+      handleFocus,
     };
   },
   data() {
@@ -312,8 +288,8 @@ export default defineComponent({
       emailCode: ["", "", "", "", "", ""], //邮箱验证码
       emailNextStep: true,
       username: "",
-            password: localStorage.getItem("loginPassword") || '',
+      password: localStorage.getItem("loginPassword") || "",
-            email: localStorage.getItem("loginEmail") || '', //邮箱登录邮箱
+      email: localStorage.getItem("loginEmail") || "", //邮箱登录邮箱
       frogetPasswordStep: 1, //忘记密码的步骤
       forgetPasswordEmail: "",
       forgetEmailCode: ["", "", "", "", "", ""], //忘记密码的邮箱验证码
@@ -358,16 +334,14 @@ export default defineComponent({
         email: this.email,
         operationType: "LOGIN",
       };
-            Https.axiosPost(Https.httpUrls.accountSendEmail, data).then(
+      Https.axiosPost(Https.httpUrls.accountSendEmail, data).then((rv: any) => {
-                (rv: any) => {
         if (rv) {
           this.emailStap = 2;
           this.time = 60;
           this.emailCode = ["", "", "", "", "", ""];
           this.createTimer();
         }
-                }
+      });
-            );
     },
 
     //邮箱登录的上一步
@@ -390,15 +364,12 @@ export default defineComponent({
         email: this.forgetPasswordEmail,
         operationType: "FORGET_PWD",
       };
-            Https.axiosPost(Https.httpUrls.accountSendEmail, data).then(
+      Https.axiosPost(Https.httpUrls.accountSendEmail, data).then((rv: any) => {
-                (rv: any) => {
         if (rv) {
           this.frogetPasswordStep = 2;
-                        (this.forgetEmailCode = ["", "", "", "", "", ""]),
+          (this.forgetEmailCode = ["", "", "", "", "", ""]), this.createTimer();
-                            this.createTimer();
         }
-                }
+      });
-            );
     },
     //忘记密码的上一步
     forgetPasswordLastStepFun() {
@@ -407,8 +378,7 @@ export default defineComponent({
       } else {
         this.frogetPasswordStep = this.frogetPasswordStep - 1;
         this.forgetPasswordEmail = "";
-                (this.forgetEmailCode = ["", "", "", "", "", ""]),
+        (this.forgetEmailCode = ["", "", "", "", "", ""]), this.clearTimer();
-                    this.clearTimer();
       }
     },
 
@@ -421,15 +391,13 @@ export default defineComponent({
         password: "",
         verifyEmail: true,
       };
-            Https.axiosPost(Https.httpUrls.accountResetPwd, data).then(
+      Https.axiosPost(Https.httpUrls.accountResetPwd, data).then((rv: any) => {
-                (rv: any) => {
         if (rv) {
           this.forgetEmailValue = emailVerifyCode;
           this.frogetPasswordStep = 3;
           this.clearTimer();
         }
-                }
+      });
-            );
     },
 
     //改变勾选是否是机器人
@@ -444,9 +412,7 @@ export default defineComponent({
         return;
       } else {
         if (!this.password) {
-                    message.info(
+          message.info("Please enter your account number or password");
-                        "Please enter your account number or password"
-                    );
           return;
         }
         //输入邮箱
@@ -465,16 +431,14 @@ export default defineComponent({
         }
         //判断是否同意隐私政策
         if (!this.checked) {
-                    message.info(
+          message.info("Agree to all terms, privacy fees and policies");
-                        "Agree to all terms, privacy fees and policies"
-                    );
           return;
         }
         let data = {
           password: md5(this.password + "abc"),
-                    userName: 'a',
+          userName: "a",
           // userName: this.username,
-					organizationName:this.selectEnterprise,
+          organizationName: this.selectEnterprise,
           email: this.email,
           operationType: "LOGIN",
           ip: "",
@@ -484,7 +448,7 @@ export default defineComponent({
           Https.axiosPost(Https.httpUrls.enterpriseLogin, data)
             .then((rv: any) => {
               if (rv) {
-								this.clearTimer()
+                this.clearTimer();
                 this.time = 60;
                 this.emailStap = 2;
                 this.emailCode = ["", "", "", "", "", ""];
@@ -495,8 +459,7 @@ export default defineComponent({
                 localStorage.setItem("loginPassword", this.password);
               }
             })
-                        .catch((res) => {
+            .catch((res) => {});
-                        });
           setTimeout(() => {
             this.loginTime = true;
           }, 2000);
@@ -516,44 +479,44 @@ export default defineComponent({
         emailVerifyCode: emailVerifyCode,
         loginType: "EMAIL",
         userId: this.userId,
-				organizationName:this.selectEnterprise
+        organizationName: this.selectEnterprise,
       };
       Https.axiosPost(Https.httpUrls.accountLogin, data)
         .then((rv: any) => {
-					this.setSuccessLogin(rv)
+          this.setSuccessLogin(rv);
         })
         .catch((res) => {});
     },
-		isCheckAgreement(){
+    isCheckAgreement() {
-			message.info(
+      message.info("Agree to all terms, privacy fees and policies");
-					"Agree to all terms, privacy fees and policies"
-				);
     },
     //微信登录
-		wechatLogin(value:any) {
+    wechatLogin(value: any) {
       let data = {
-				code : value.code,
+        code: value.code,
-				type:2
+        type: 2,
-			}
+      };
-			this.loadingShow = true
+      this.loadingShow = true;
-		    Https.axiosGet(Https.httpUrls.parseWeChatCode, {params:data})
+      Https.axiosGet(Https.httpUrls.parseWeChatCode, { params: data })
         .then((rv: any) => {
-					this.loadingShow = false
+          this.loadingShow = false;
-					this.setSuccessLogin(rv)
+          this.setSuccessLogin(rv);
         })
-                .catch((res) => {this.loadingShow = false});
+        .catch((res) => {
+          this.loadingShow = false;
+        });
     },
     //谷歌登录
-		googelLogin(value:any) {
+    googelLogin(value: any) {
-			let data = {credential : value,type:2}
+      let data = { credential: value, type: 2 };
-		    Https.axiosGet(Https.httpUrls.parseGoogleCredential, {params:data})
+      Https.axiosGet(Https.httpUrls.parseGoogleCredential, { params: data })
         .then((rv: any) => {
-					this.setSuccessLogin(rv)
+          this.setSuccessLogin(rv);
         })
         .catch((res) => {});
     },
     //登陆成功设置参数
-		setSuccessLogin(rv:any){
+    setSuccessLogin(rv: any) {
       if (rv) {
         if (rv.systemUser == 4) {
           rv.systemUser = 1;
@@ -568,11 +531,11 @@ export default defineComponent({
         setCookie("isBeginner", isBeginner);
         setCookie("isBeginnerNum", 0); //从第一步开始，机器人开始的话就是从第二部开始
         setCookie("userInfo", JSON.stringify(rv));
-				let userid:any = {
+        let userid: any = {
-					ueserId:rv.userId,
+          ueserId: rv.userId,
-					systemUser:rv.systemUser,
+          systemUser: rv.systemUser,
-				}
+        };
-				if(rv.email)userid.email = rv.email
+        if (rv.email) userid.email = rv.email;
         this.store.commit("upUserDetail", userid);
 
         if (window.innerWidth < 768) {
@@ -583,13 +546,9 @@ export default defineComponent({
         } else {
           this.turnToHomePage("/home");
         }
-				sessionStorage.setItem(
+        sessionStorage.setItem("isTimeOne", JSON.stringify(false)); //是否需要公告 提示 弹窗
-					"isTimeOne",
-					JSON.stringify(false)
-				); //是否需要公告 提示 弹窗
         let randomNum: any =
-					Math.floor(Math.random() * 9000000000000000) +
+          Math.floor(Math.random() * 9000000000000000) + 1000000000000000;
-					1000000000000000;
         sessionStorage.setItem("sessionId", randomNum);
         sessionStorage.setItem("record", JSON.stringify([]));
       }
@@ -602,14 +561,12 @@ export default defineComponent({
         password: md5(this.newPassword + "abc"),
         verifyEmail: false,
       };
-            Https.axiosPost(Https.httpUrls.accountResetPwd, data).then(
+      Https.axiosPost(Https.httpUrls.accountResetPwd, data).then((rv: any) => {
-                (rv: any) => {
         if (rv) {
           message.success("Changing the password successfully");
           this.changeIsLogin(1);
         }
-                }
+      });
-            );
     },
 
     //创建定时器
@@ -655,9 +612,9 @@ export default defineComponent({
     // },
   },
   mounted() {
-		const data = this.$route.query
+    const data = this.$route.query;
-		if(data?.state == 'weiXin'){
+    if (data?.state == "weiXin") {
-			this.wechatLogin(data)
+      this.wechatLogin(data);
     }
   },
 });
@@ -729,15 +686,15 @@ export default defineComponent({
           }
         }
       }
-			.generalModel_state{
+      .generalModel_state {
-				>.generalModel_state_item{
+        > .generalModel_state_item {
-					:deep(.ant-select-selector){
+          :deep(.ant-select-selector) {
             border: 0.1rem solid #dfdfdf;
             border-radius: 2.5rem;
             height: 5rem !important;
             width: 100%;
             box-sizing: border-box;
-						&:hover{
+            &:hover {
               border: 0.1rem solid #000;
             }
           }
@@ -778,8 +735,8 @@ export default defineComponent({
           font-size: 1.4rem;
           box-sizing: border-box;
           outline: none;
-					transition: all .3s;
+          transition: all 0.3s;
-					&:hover{
+          &:hover {
             border: 0.1rem solid #000;
           }
           &::placeholder {
@@ -832,9 +789,9 @@ export default defineComponent({
         font-weight: 500;
         color: #ffffff;
         cursor: pointer;
-				transition: all .3s;
+        transition: all 0.3s;
-				&:hover{
+        &:hover {
-					background: #3C3C3C;
+          background: #3c3c3c;
         }
         &[state="2"] {
           cursor: not-allowed;
@@ -980,13 +937,13 @@ export default defineComponent({
   .marign_top40 {
     margin-top: 4rem;
   }
-	.thirdPartyLogin{
+  .thirdPartyLogin {
     display: flex;
     // justify-content: flex-start;
-		> div{
+    > div {
       position: relative;
       margin-right: 1rem;
-			> .mask{
+      > .mask {
         position: absolute;
         width: 100%;
         height: 100%;

src/component/LoginPage/login/personal.vue

@@ -4,7 +4,6 @@
       <!-- 账号密码和邮箱登录  start-->
       <div class="login_content" v-if="isLogin === 1">
         <div class="login_content_left">
-                  
           <!-- v-show="loginType == 'username'" -->
           <div>
             <div class="login_form_content" :state="emailStap">
@@ -15,9 +14,7 @@
                                 v-model="username"
                             /> -->
               <div v-show="emailStap === 1">
-								<div class="login_form_title marign_top30">
+                <div class="login_form_title marign_top30">Email</div>
-									Email
-								</div>
                 <input
                   class="login_form_input"
                   placeholder="Enter your email address"
@@ -42,21 +39,16 @@
                 </div>
               </div>
 
-
               <!-- 邮箱登录 start -->
               <div
                 v-show="emailStap === 2"
                 class="login_form_email"
                 :class="{ active: emailStap === 2 }"
               >
-                                <div
+                <div v-show="emailStap === 2" class="email_last_step">
-                                    v-show="emailStap === 2"
-                                    class="email_last_step"
-                                >
                   <div class="email_last_step_block">
                     <span class="email_last_step_content"
-                                            >Verify with one-time verification
+                      >Verify with one-time verification code</span
-                                            code</span
                     >
                     <i
                       class="fi fi-br-cross email_last_step_block_icon"
@@ -65,34 +57,23 @@
                   </div>
                   <div class="email_last_step_bottom">
                     <div class="email_last_step_des">
-                                            <div class="sent_email_content">
+                      <div class="sent_email_content">Sent to {{ email }}</div>
-                                                Sent to {{ email }}
-                                            </div>
                       <div class="tip_content">
-                                                <span v-show="time"
+                        <span v-show="time">{{ time }}s</span>
-                                                    >{{ time }}s</span
+                        <span v-show="!time" @click="emailNextStepFun()"
-                                                >
-                                                <span
-                                                    v-show="!time"
-                                                    @click="emailNextStepFun()"
                           >Resend</span
                         >
                       </div>
                     </div>
                     <VerificationCodeInput
                       :ct="emailCode"
-                                            @sendCaptcha="
+                      @sendCaptcha="submitEmailLogin($event)"
-                                                submitEmailLogin($event)
-                                            "
                     ></VerificationCodeInput>
 
                     <div class="email_last_step_des">
-                                            <div
+                      <div class="sent_email_content email_tip_content">
-                                                class="sent_email_content email_tip_content"
+                        Please check the junk box if you haven't received
-                                            >
+                        verification code
-                                                Please check the junk box if you
-                                                haven't received verification
-                                                code
                       </div>
                     </div>
                   </div>
@@ -102,24 +83,25 @@
 
             <div class="login_form_title marign_top30">
               <label :class="{ active: emailStap == 2 }">
-                                <input
+                <input :state="emailStap" type="checkbox" v-model="checked" />
-                                    :state="emailStap"
+                <span>I agree to all Term, Privacy Policy and Fees</span>
-                                    type="checkbox"
-                                    v-model="checked"
-                                />
-                                <span
-                                    >I agree to all Term, Privacy Policy and
-                                    Fees</span
-                                >
               </label>
             </div>
             <div class="thirdPartyLogin marign_top30">
               <div class="label">
-								<div class="mask" v-show="!checked" @click="isCheckAgreement"></div>
+                <div
+                  class="mask"
+                  v-show="!checked"
+                  @click="isCheckAgreement"
+                ></div>
                 <googleLogin @googelLogin="googelLogin"></googleLogin>
               </div>
               <div class="label">
-								<div class="mask" v-show="!checked" @click="isCheckAgreement"></div>
+                <div
+                  class="mask"
+                  v-show="!checked"
+                  @click="isCheckAgreement"
+                ></div>
                 <weiXinLogin></weiXinLogin>
               </div>
               <!-- <phoneLogin></phoneLogin> -->
@@ -133,10 +115,7 @@
             </div>
 
             <div class="login_text">
-                            <div
+              <div class="forget_password_text" @click="changeIsLogin(2)">
-                                class="forget_password_text"
-                                @click="changeIsLogin(2)"
-                            >
                 Forgot your password
               </div>
             </div>
@@ -156,9 +135,7 @@
           <!-- <span class="icon iconfont fi-br-arrow-left"></span
                     > -->
           <i class="fi fi-br-arrow-left"></i>
-                    <span class="forget_password_content_title"
+          <span class="forget_password_content_title">Retrieve password</span>
-                        >Retrieve password</span
-                    >
         </div>
         <div v-show="frogetPasswordStep === 1">
           <div class="forget_passored_form_content">
@@ -186,9 +163,7 @@
             </div>
             <div class="tip_content">
               <span v-show="time">{{ time }}s</span>
-                            <span
+              <span v-show="!time" @click="forgetPasswordNextStepFun()"
-                                v-show="!time"
-                                @click="forgetPasswordNextStepFun()"
                 >Resend</span
               >
             </div>
@@ -220,8 +195,6 @@
       <!-- 忘记密码 end -->
     </div>
 
-
-
     <!-- <div class="login_footer">
             <div class="login_footer_item">
                 <div class="login_footer_item_text">
@@ -271,16 +244,19 @@ import phoneLogin from "@/component/LoginPage/phoneLogin.vue";
 import { useStore } from "vuex";
 import { useI18n } from "vue-i18n";
 import { setLang } from "@/tool/guide";
-const md5 = require("md5");
+import md5 from "md5";
 export default defineComponent({
   components: {
-        VerificationCodeInput,googleLogin,weiXinLogin,phoneLogin
+    VerificationCodeInput,
+    googleLogin,
+    weiXinLogin,
+    phoneLogin,
   },
   setup() {
     let timer: any = 0;
     const { locale } = useI18n();
     const store = useStore();
-		let loadingShow = ref(false)
+    let loadingShow = ref(false);
     return {
       store,
       timer,
@@ -297,8 +273,8 @@ export default defineComponent({
       emailCode: ["", "", "", "", "", ""], //邮箱验证码
       emailNextStep: true,
       username: "",
-            password: localStorage.getItem("loginPassword") || '',
+      password: localStorage.getItem("loginPassword") || "",
-            email: localStorage.getItem("loginEmail") || '', //邮箱登录邮箱
+      email: localStorage.getItem("loginEmail") || "", //邮箱登录邮箱
       frogetPasswordStep: 1, //忘记密码的步骤
       forgetPasswordEmail: "",
       forgetEmailCode: ["", "", "", "", "", ""], //忘记密码的邮箱验证码
@@ -343,16 +319,14 @@ export default defineComponent({
         email: this.email,
         operationType: "LOGIN",
       };
-            Https.axiosPost(Https.httpUrls.accountSendEmail, data).then(
+      Https.axiosPost(Https.httpUrls.accountSendEmail, data).then((rv: any) => {
-                (rv: any) => {
         if (rv) {
           this.emailStap = 2;
           this.time = 60;
           this.emailCode = ["", "", "", "", "", ""];
           this.createTimer();
         }
-                }
+      });
-            );
     },
 
     //邮箱登录的上一步
@@ -375,15 +349,12 @@ export default defineComponent({
         email: this.forgetPasswordEmail,
         operationType: "FORGET_PWD",
       };
-            Https.axiosPost(Https.httpUrls.accountSendEmail, data).then(
+      Https.axiosPost(Https.httpUrls.accountSendEmail, data).then((rv: any) => {
-                (rv: any) => {
         if (rv) {
           this.frogetPasswordStep = 2;
-                        (this.forgetEmailCode = ["", "", "", "", "", ""]),
+          (this.forgetEmailCode = ["", "", "", "", "", ""]), this.createTimer();
-                            this.createTimer();
         }
-                }
+      });
-            );
     },
     //忘记密码的上一步
     forgetPasswordLastStepFun() {
@@ -392,8 +363,7 @@ export default defineComponent({
       } else {
         this.frogetPasswordStep = this.frogetPasswordStep - 1;
         this.forgetPasswordEmail = "";
-                (this.forgetEmailCode = ["", "", "", "", "", ""]),
+        (this.forgetEmailCode = ["", "", "", "", "", ""]), this.clearTimer();
-                    this.clearTimer();
       }
     },
 
@@ -406,15 +376,13 @@ export default defineComponent({
         password: "",
         verifyEmail: true,
       };
-            Https.axiosPost(Https.httpUrls.accountResetPwd, data).then(
+      Https.axiosPost(Https.httpUrls.accountResetPwd, data).then((rv: any) => {
-                (rv: any) => {
         if (rv) {
           this.forgetEmailValue = emailVerifyCode;
           this.frogetPasswordStep = 3;
           this.clearTimer();
         }
-                }
+      });
-            );
     },
 
     //改变勾选是否是机器人
@@ -429,9 +397,7 @@ export default defineComponent({
         return;
       } else {
         if (!this.password) {
-                    message.info(
+          message.info("Please enter your account number or password");
-                        "Please enter your account number or password"
-                    );
           return;
         }
         //输入邮箱
@@ -446,14 +412,12 @@ export default defineComponent({
         }
         //判断是否同意隐私政策
         if (!this.checked) {
-                    message.info(
+          message.info("Agree to all terms, privacy fees and policies");
-                        "Agree to all terms, privacy fees and policies"
-                    );
           return;
         }
         let data = {
           password: md5(this.password + "abc"),
-                    userName: 'a',
+          userName: "a",
           // userName: this.username,
           email: this.email,
           operationType: "LOGIN",
@@ -469,7 +433,7 @@ export default defineComponent({
               //     this.loginType = 'email'
               // }
               if (rv) {
-								this.clearTimer()
+                this.clearTimer();
                 this.time = 60;
                 this.emailStap = 2;
                 this.emailCode = ["", "", "", "", "", ""];
@@ -482,8 +446,7 @@ export default defineComponent({
                 localStorage.setItem("loginPassword", this.password);
               }
             })
-                        .catch((res) => {
+            .catch((res) => {});
-                        });
           setTimeout(() => {
             this.loginTime = true;
           }, 2000);
@@ -506,40 +469,40 @@ export default defineComponent({
       };
       Https.axiosPost(Https.httpUrls.accountLogin, data)
         .then((rv: any) => {
-					this.setSuccessLogin(rv)
+          this.setSuccessLogin(rv);
         })
         .catch((res) => {});
     },
-		isCheckAgreement(){
+    isCheckAgreement() {
-			message.info(
+      message.info("Agree to all terms, privacy fees and policies");
-					"Agree to all terms, privacy fees and policies"
-				);
     },
     //微信登录
-		wechatLogin(value:any) {
+    wechatLogin(value: any) {
       let data = {
-				code : value.code,
+        code: value.code,
-				type:2
+        type: 2,
-			}
+      };
-			this.loadingShow = true
+      this.loadingShow = true;
-		    Https.axiosGet(Https.httpUrls.parseWeChatCode, {params:data})
+      Https.axiosGet(Https.httpUrls.parseWeChatCode, { params: data })
         .then((rv: any) => {
-					this.loadingShow = false
+          this.loadingShow = false;
-					this.setSuccessLogin(rv)
+          this.setSuccessLogin(rv);
         })
-                .catch((res) => {this.loadingShow = false});
+        .catch((res) => {
+          this.loadingShow = false;
+        });
     },
     //谷歌登录
-		googelLogin(value:any) {
+    googelLogin(value: any) {
-			let data = {credential : value,type:2}
+      let data = { credential: value, type: 2 };
-		    Https.axiosGet(Https.httpUrls.parseGoogleCredential, {params:data})
+      Https.axiosGet(Https.httpUrls.parseGoogleCredential, { params: data })
         .then((rv: any) => {
-					this.setSuccessLogin(rv)
+          this.setSuccessLogin(rv);
         })
         .catch((res) => {});
     },
     //登陆成功设置参数
-		setSuccessLogin(rv:any){
+    setSuccessLogin(rv: any) {
       if (rv) {
         if (rv.systemUser == 4) {
           rv.systemUser = 1;
@@ -554,11 +517,11 @@ export default defineComponent({
         setCookie("isBeginner", isBeginner);
         setCookie("isBeginnerNum", 0); //从第一步开始，机器人开始的话就是从第二部开始
         setCookie("userInfo", JSON.stringify(rv));
-				let userid:any = {
+        let userid: any = {
-					ueserId:rv.userId,
+          ueserId: rv.userId,
-					systemUser:rv.systemUser,
+          systemUser: rv.systemUser,
-				}
+        };
-				if(rv.email)userid.email = rv.email
+        if (rv.email) userid.email = rv.email;
         this.store.commit("upUserDetail", userid);
 
         if (window.innerWidth < 768) {
@@ -569,13 +532,9 @@ export default defineComponent({
         } else {
           this.turnToHomePage("/home");
         }
-				sessionStorage.setItem(
+        sessionStorage.setItem("isTimeOne", JSON.stringify(false)); //是否需要公告 提示 弹窗
-					"isTimeOne",
-					JSON.stringify(false)
-				); //是否需要公告 提示 弹窗
         let randomNum: any =
-					Math.floor(Math.random() * 9000000000000000) +
+          Math.floor(Math.random() * 9000000000000000) + 1000000000000000;
-					1000000000000000;
         sessionStorage.setItem("sessionId", randomNum);
         sessionStorage.setItem("record", JSON.stringify([]));
       }
@@ -588,14 +547,12 @@ export default defineComponent({
         password: md5(this.newPassword + "abc"),
         verifyEmail: false,
       };
-            Https.axiosPost(Https.httpUrls.accountResetPwd, data).then(
+      Https.axiosPost(Https.httpUrls.accountResetPwd, data).then((rv: any) => {
-                (rv: any) => {
         if (rv) {
           message.success("Changing the password successfully");
           this.changeIsLogin(1);
         }
-                }
+      });
-            );
     },
 
     //创建定时器
@@ -641,9 +598,9 @@ export default defineComponent({
     // },
   },
   mounted() {
-		const data = this.$route.query
+    const data = this.$route.query;
-		if(data?.state == 'weiXin'){
+    if (data?.state == "weiXin") {
-			this.wechatLogin(data)
+      this.wechatLogin(data);
     }
   },
 });
@@ -749,8 +706,8 @@ export default defineComponent({
           font-size: 1.4rem;
           box-sizing: border-box;
           outline: none;
-					transition: all .3s;
+          transition: all 0.3s;
-					&:hover{
+          &:hover {
             border: 0.1rem solid #000;
           }
           &::placeholder {
@@ -803,9 +760,9 @@ export default defineComponent({
         font-weight: 500;
         color: #ffffff;
         cursor: pointer;
-				transition: all .3s;
+        transition: all 0.3s;
-				&:hover{
+        &:hover {
-					background: #3C3C3C;
+          background: #3c3c3c;
         }
         &[state="2"] {
           cursor: not-allowed;
@@ -951,13 +908,13 @@ export default defineComponent({
   .marign_top40 {
     margin-top: 4rem;
   }
-	.thirdPartyLogin{
+  .thirdPartyLogin {
     display: flex;
     // justify-content: flex-start;
-		> div{
+    > div {
       position: relative;
       margin-right: 1rem;
-			> .mask{
+      > .mask {
         position: absolute;
         width: 100%;
         height: 100%;

src/component/LoginPage/login/school.vue

@@ -8,19 +8,19 @@
           <!-- v-show="loginType == 'username'" -->
           <div>
             <div class="login_form_content" :state="emailStap">
-							
               <div v-show="emailStap === 1">
-								<div class="login_form_title marign_top30">
+                <div class="login_form_title marign_top30">School</div>
-									School
-								</div>
                 <div class="generalModel_state">
-									<div class="generalModel_state_item" style="width: 100%; margin: 0;">
+                  <div
+                    class="generalModel_state_item"
+                    style="width: 100%; margin: 0"
+                  >
                     <a-select
                       placeholder="Select a school"
                       v-model:value="selectSchool"
                       :options="schoolList"
                       @change="schoolListChange"
-											style="width:100%"
+                      style="width: 100%"
                       show-search
                       size="large"
                       :fieldNames="{ label: 'name', value: 'value' }"
@@ -36,9 +36,7 @@
                     </a-select>
                   </div>
                 </div>
-								<div class="login_form_title marign_top30">
+                <div class="login_form_title marign_top30">Email</div>
-									Email
-								</div>
                 <input
                   class="login_form_input"
                   placeholder="Enter your email address"
@@ -63,21 +61,16 @@
                 </div>
               </div>
 
-
               <!-- 邮箱登录 start -->
               <div
                 v-show="emailStap === 2"
                 class="login_form_email"
                 :class="{ active: emailStap === 2 }"
               >
-                                <div
+                <div v-show="emailStap === 2" class="email_last_step">
-                                    v-show="emailStap === 2"
-                                    class="email_last_step"
-                                >
                   <div class="email_last_step_block">
                     <span class="email_last_step_content"
-                                            >Verify with one-time verification
+                      >Verify with one-time verification code</span
-                                            code</span
                     >
                     <i
                       class="fi fi-br-cross email_last_step_block_icon"
@@ -86,34 +79,23 @@
                   </div>
                   <div class="email_last_step_bottom">
                     <div class="email_last_step_des">
-                                            <div class="sent_email_content">
+                      <div class="sent_email_content">Sent to {{ email }}</div>
-                                                Sent to {{ email }}
-                                            </div>
                       <div class="tip_content">
-                                                <span v-show="time"
+                        <span v-show="time">{{ time }}s</span>
-                                                    >{{ time }}s</span
+                        <span v-show="!time" @click="emailNextStepFun()"
-                                                >
-                                                <span
-                                                    v-show="!time"
-                                                    @click="emailNextStepFun()"
                           >Resend</span
                         >
                       </div>
                     </div>
                     <VerificationCodeInput
                       :ct="emailCode"
-                                            @sendCaptcha="
+                      @sendCaptcha="submitEmailLogin($event)"
-                                                submitEmailLogin($event)
-                                            "
                     ></VerificationCodeInput>
 
                     <div class="email_last_step_des">
-                                            <div
+                      <div class="sent_email_content email_tip_content">
-                                                class="sent_email_content email_tip_content"
+                        Please check the junk box if you haven't received
-                                            >
+                        verification code
-                                                Please check the junk box if you
-                                                haven't received verification
-                                                code
                       </div>
                     </div>
                   </div>
@@ -123,15 +105,8 @@
 
             <div class="login_form_title marign_top30">
               <label :class="{ active: emailStap == 2 }">
-                                <input
+                <input :state="emailStap" type="checkbox" v-model="checked" />
-                                    :state="emailStap"
+                <span>I agree to all Term, Privacy Policy and Fees</span>
-                                    type="checkbox"
-                                    v-model="checked"
-                                />
-                                <span
-                                    >I agree to all Term, Privacy Policy and
-                                    Fees</span
-                                >
               </label>
             </div>
             <!-- <div class="thirdPartyLogin marign_top30">
@@ -174,9 +149,7 @@
           @click="forgetPasswordLastStepFun()"
         >
           <i class="fi fi-br-arrow-left"></i>
-                    <span class="forget_password_content_title"
+          <span class="forget_password_content_title">Retrieve password</span>
-                        >Retrieve password</span
-                    >
         </div>
         <div v-show="frogetPasswordStep === 1">
           <div class="forget_passored_form_content">
@@ -204,9 +177,7 @@
             </div>
             <div class="tip_content">
               <span v-show="time">{{ time }}s</span>
-                            <span
+              <span v-show="!time" @click="forgetPasswordNextStepFun()"
-                                v-show="!time"
-                                @click="forgetPasswordNextStepFun()"
                 >Resend</span
               >
             </div>
@@ -244,7 +215,7 @@
 </template>
 
 <script lang="ts">
-import { defineComponent, ref, onMounted, reactive,toRefs } from "vue";
+import { defineComponent, ref, onMounted, reactive, toRefs } from "vue";
 import { Https } from "@/tool/https";
 import { isEmail } from "@/tool/util";
 import { setCookie, WriteCookie } from "@/tool/cookie";
@@ -256,42 +227,47 @@ import phoneLogin from "@/component/LoginPage/phoneLogin.vue";
 import { useStore } from "vuex";
 import { useI18n } from "vue-i18n";
 import { setLang } from "@/tool/guide";
-const md5 = require("md5");
+import md5 from "md5";
 export default defineComponent({
   components: {
-        VerificationCodeInput,googleLogin,weiXinLogin,phoneLogin
+    VerificationCodeInput,
+    googleLogin,
+    weiXinLogin,
+    phoneLogin,
   },
   setup() {
     let timer: any = 0;
     const { locale } = useI18n();
     const store = useStore();
-		let loadingShow = ref(false)
+    let loadingShow = ref(false);
     const data = reactive({
-			selectSchool:'',
+      selectSchool: "",
-			schoolList:[] as any,
+      schoolList: [] as any,
-		})
+    });
-		const schoolListChange = (e:any)=>{
+    const schoolListChange = (e: any) => {};
-		}
+    const filterOption = (e: any) => {
-		const filterOption = (e:any)=>{
       let params = {
-				name:e,
+        name: e,
-				type:'School'
+        type: "School",
-			}
+      };
-			Https.axiosPost(Https.httpUrls.organizationNameSearch,{},{params:params}).then((rv:any)=>{
+      Https.axiosPost(
-				data.schoolList = rv.map((item:any)=>{
+        Https.httpUrls.organizationNameSearch,
+        {},
+        { params: params }
+      ).then((rv: any) => {
+        data.schoolList = rv.map((item: any) => {
           return {
-						label:item,
+            label: item,
-						value:item,
+            value: item,
-					}	
+          };
-				})
+        });
-			})
+      });
-			
+    };
-		}
+    const handleFocus = () => {
-		const handleFocus= ()=>{
+      if (data.schoolList.length == 0) {
-			if(data.schoolList.length == 0){
+        filterOption("");
-				filterOption('')
-			}
       }
+    };
     return {
       ...toRefs(data),
       store,
@@ -299,7 +275,8 @@ export default defineComponent({
       locale,
       loadingShow,
       schoolListChange,
-			filterOption,handleFocus
+      filterOption,
+      handleFocus,
     };
   },
   data() {
@@ -311,8 +288,8 @@ export default defineComponent({
       emailCode: ["", "", "", "", "", ""], //邮箱验证码
       emailNextStep: true,
       username: "",
-            password: localStorage.getItem("loginPassword") || '',
+      password: localStorage.getItem("loginPassword") || "",
-            email: localStorage.getItem("loginEmail") || '', //邮箱登录邮箱
+      email: localStorage.getItem("loginEmail") || "", //邮箱登录邮箱
       frogetPasswordStep: 1, //忘记密码的步骤
       forgetPasswordEmail: "",
       forgetEmailCode: ["", "", "", "", "", ""], //忘记密码的邮箱验证码
@@ -357,16 +334,14 @@ export default defineComponent({
         email: this.email,
         operationType: "LOGIN",
       };
-            Https.axiosPost(Https.httpUrls.accountSendEmail, data).then(
+      Https.axiosPost(Https.httpUrls.accountSendEmail, data).then((rv: any) => {
-                (rv: any) => {
         if (rv) {
           this.emailStap = 2;
           this.time = 60;
           this.emailCode = ["", "", "", "", "", ""];
           this.createTimer();
         }
-                }
+      });
-            );
     },
 
     //邮箱登录的上一步
@@ -389,15 +364,12 @@ export default defineComponent({
         email: this.forgetPasswordEmail,
         operationType: "FORGET_PWD",
       };
-            Https.axiosPost(Https.httpUrls.accountSendEmail, data).then(
+      Https.axiosPost(Https.httpUrls.accountSendEmail, data).then((rv: any) => {
-                (rv: any) => {
         if (rv) {
           this.frogetPasswordStep = 2;
-                        (this.forgetEmailCode = ["", "", "", "", "", ""]),
+          (this.forgetEmailCode = ["", "", "", "", "", ""]), this.createTimer();
-                            this.createTimer();
         }
-                }
+      });
-            );
     },
     //忘记密码的上一步
     forgetPasswordLastStepFun() {
@@ -406,8 +378,7 @@ export default defineComponent({
       } else {
         this.frogetPasswordStep = this.frogetPasswordStep - 1;
         this.forgetPasswordEmail = "";
-                (this.forgetEmailCode = ["", "", "", "", "", ""]),
+        (this.forgetEmailCode = ["", "", "", "", "", ""]), this.clearTimer();
-                    this.clearTimer();
       }
     },
 
@@ -420,15 +391,13 @@ export default defineComponent({
         password: "",
         verifyEmail: true,
       };
-            Https.axiosPost(Https.httpUrls.accountResetPwd, data).then(
+      Https.axiosPost(Https.httpUrls.accountResetPwd, data).then((rv: any) => {
-                (rv: any) => {
         if (rv) {
           this.forgetEmailValue = emailVerifyCode;
           this.frogetPasswordStep = 3;
           this.clearTimer();
         }
-                }
+      });
-            );
     },
 
     //改变勾选是否是机器人
@@ -443,9 +412,7 @@ export default defineComponent({
         return;
       } else {
         if (!this.password) {
-                    message.info(
+          message.info("Please enter your account number or password");
-                        "Please enter your account number or password"
-                    );
           return;
         }
         //输入邮箱
@@ -464,16 +431,14 @@ export default defineComponent({
         }
         //判断是否同意隐私政策
         if (!this.checked) {
-                    message.info(
+          message.info("Agree to all terms, privacy fees and policies");
-                        "Agree to all terms, privacy fees and policies"
-                    );
           return;
         }
         let data = {
           password: md5(this.password + "abc"),
-                    userName: 'a',
+          userName: "a",
           // userName: this.username,
-					organizationName:this.selectSchool,
+          organizationName: this.selectSchool,
           email: this.email,
           operationType: "LOGIN",
           ip: "",
@@ -484,7 +449,7 @@ export default defineComponent({
           Https.axiosPost(Https.httpUrls.schoolLogin, data)
             .then((rv: any) => {
               if (rv) {
-								 this.clearTimer()
+                this.clearTimer();
                 this.time = 60;
                 this.emailStap = 2;
                 this.emailCode = ["", "", "", "", "", ""];
@@ -517,44 +482,44 @@ export default defineComponent({
         emailVerifyCode: emailVerifyCode,
         loginType: "EMAIL",
         userId: this.userId,
-				organizationName:this.selectSchool
+        organizationName: this.selectSchool,
       };
       Https.axiosPost(Https.httpUrls.accountLogin, data)
         .then((rv: any) => {
-					this.setSuccessLogin(rv)
+          this.setSuccessLogin(rv);
         })
         .catch((res) => {});
     },
-		isCheckAgreement(){
+    isCheckAgreement() {
-			message.info(
+      message.info("Agree to all terms, privacy fees and policies");
-					"Agree to all terms, privacy fees and policies"
-				);
     },
     //微信登录
-		wechatLogin(value:any) {
+    wechatLogin(value: any) {
       let data = {
-				code : value.code,
+        code: value.code,
-				type:2
+        type: 2,
-			}
+      };
-			this.loadingShow = true
+      this.loadingShow = true;
-		    Https.axiosGet(Https.httpUrls.parseWeChatCode, {params:data})
+      Https.axiosGet(Https.httpUrls.parseWeChatCode, { params: data })
         .then((rv: any) => {
-					this.loadingShow = false
+          this.loadingShow = false;
-					this.setSuccessLogin(rv)
+          this.setSuccessLogin(rv);
         })
-                .catch((res) => {this.loadingShow = false});
+        .catch((res) => {
+          this.loadingShow = false;
+        });
     },
     //谷歌登录
-		googelLogin(value:any) {
+    googelLogin(value: any) {
-			let data = {credential : value,type:2}
+      let data = { credential: value, type: 2 };
-		    Https.axiosGet(Https.httpUrls.parseGoogleCredential, {params:data})
+      Https.axiosGet(Https.httpUrls.parseGoogleCredential, { params: data })
         .then((rv: any) => {
-					this.setSuccessLogin(rv)
+          this.setSuccessLogin(rv);
         })
         .catch((res) => {});
     },
     //登陆成功设置参数
-		setSuccessLogin(rv:any){
+    setSuccessLogin(rv: any) {
       if (rv) {
         if (rv.systemUser == 4) {
           rv.systemUser = 1;
@@ -569,11 +534,11 @@ export default defineComponent({
         setCookie("isBeginner", isBeginner);
         setCookie("isBeginnerNum", 0); //从第一步开始，机器人开始的话就是从第二部开始
         setCookie("userInfo", JSON.stringify(rv));
-				let userid:any = {
+        let userid: any = {
-					ueserId:rv.userId,
+          ueserId: rv.userId,
-					systemUser:rv.systemUser,
+          systemUser: rv.systemUser,
-				}
+        };
-				if(rv.email)userid.email = rv.email
+        if (rv.email) userid.email = rv.email;
         this.store.commit("upUserDetail", userid);
 
         if (window.innerWidth < 768) {
@@ -584,13 +549,9 @@ export default defineComponent({
         } else {
           this.turnToHomePage("/home");
         }
-				sessionStorage.setItem(
+        sessionStorage.setItem("isTimeOne", JSON.stringify(false)); //是否需要公告 提示 弹窗
-					"isTimeOne",
-					JSON.stringify(false)
-				); //是否需要公告 提示 弹窗
         let randomNum: any =
-					Math.floor(Math.random() * 9000000000000000) +
+          Math.floor(Math.random() * 9000000000000000) + 1000000000000000;
-					1000000000000000;
         sessionStorage.setItem("sessionId", randomNum);
         sessionStorage.setItem("record", JSON.stringify([]));
       }
@@ -603,14 +564,12 @@ export default defineComponent({
         password: md5(this.newPassword + "abc"),
         verifyEmail: false,
       };
-            Https.axiosPost(Https.httpUrls.accountResetPwd, data).then(
+      Https.axiosPost(Https.httpUrls.accountResetPwd, data).then((rv: any) => {
-                (rv: any) => {
         if (rv) {
           message.success("Changing the password successfully");
           this.changeIsLogin(1);
         }
-                }
+      });
-            );
     },
 
     //创建定时器
@@ -656,9 +615,9 @@ export default defineComponent({
     // },
   },
   mounted() {
-		const data = this.$route.query
+    const data = this.$route.query;
-		if(data?.state == 'weiXin'){
+    if (data?.state == "weiXin") {
-			this.wechatLogin(data)
+      this.wechatLogin(data);
     }
   },
 });
@@ -730,15 +689,15 @@ export default defineComponent({
           }
         }
       }
-			.generalModel_state{
+      .generalModel_state {
-				>.generalModel_state_item{
+        > .generalModel_state_item {
-					:deep(.ant-select-selector){
+          :deep(.ant-select-selector) {
             border: 0.1rem solid #dfdfdf;
             border-radius: 2.5rem;
             height: 5rem !important;
             width: 100%;
             box-sizing: border-box;
-						&:hover{
+            &:hover {
               border: 0.1rem solid #000;
             }
           }
@@ -779,8 +738,8 @@ export default defineComponent({
           font-size: 1.4rem;
           box-sizing: border-box;
           outline: none;
-					transition: all .3s;
+          transition: all 0.3s;
-					&:hover{
+          &:hover {
             border: 0.1rem solid #000;
           }
           &::placeholder {
@@ -833,9 +792,9 @@ export default defineComponent({
         font-weight: 500;
         color: #ffffff;
         cursor: pointer;
-				transition: all .3s;
+        transition: all 0.3s;
-				&:hover{
+        &:hover {
-					background: #3C3C3C;
+          background: #3c3c3c;
         }
         &[state="2"] {
           cursor: not-allowed;
@@ -981,13 +940,13 @@ export default defineComponent({
   .marign_top40 {
     margin-top: 4rem;
   }
-	.thirdPartyLogin{
+  .thirdPartyLogin {
     display: flex;
     // justify-content: flex-start;
-		> div{
+    > div {
       position: relative;
       margin-right: 1rem;
-			> .mask{
+      > .mask {
         position: absolute;
         width: 100%;
         height: 100%;

src/component/LoginPage/phoneLogin.vue

@@ -1,40 +1,46 @@
 <template>
   <div class="Container">
     <div class="icon" @click="openphoneModel">
-			<img src="@/assets/images/loginPage/phone.svg" alt="">
+      <img src="@/assets/images/loginPage/phone.svg" alt="" />
     </div>
     <phoneModel ref="phoneModel"></phoneModel>
   </div>
 </template>
 <script>
-	import { defineComponent, ref, reactive, watch, onMounted, nextTick, toRefs,router } from "vue";
+import {
-	import phoneModel from "./phoneModel.vue";
+  defineComponent,
-    export default defineComponent({
+  ref,
+  reactive,
+  watch,
+  onMounted,
+  nextTick,
+  toRef,
+} from "vue";
+import phoneModel from "./phoneModel.vue";
+export default defineComponent({
   name: "login",
   components: {
-		    phoneModel
+    phoneModel,
   },
   setup() {
     let phoneDom = reactive({
-				phoneModel:null
+      phoneModel: null,
-			})
+    });
-			const openphoneModel = ()=>{
+    const openphoneModel = () => {
-				phoneDom.phoneModel.init()
+      phoneDom.phoneModel.init();
-			}
+    };
-			onMounted(()=>{
+    onMounted(() => {});
-				
-			})
     return {
       ...toRefs(phoneDom),
       openphoneModel,
-            }
+    };
   },
-    })
+});
 </script>
 <style scoped lang="less">
-.Container{
+.Container {
   position: relative;
-	.icon{
+  .icon {
     width: 40px;
     height: 40px;
     display: flex;
@@ -43,15 +49,15 @@
     border: 1px solid #dadce0;
     border-radius: 50%;
     cursor: pointer;
-		&:hover{
+    &:hover {
       background: #f8faff;
     }
-		img{
+    img {
       width: 18px;
       height: 18px;
     }
   }
-	&.Container:hover{
+  &.Container:hover {
   }
 }
 </style>

src/component/LoginPage/phoneModel.vue

@@ -17,12 +17,33 @@
     <div class="generalModel_btn">
       <div class="generalModel_closeIcon" @click.stop="cancelDsign()">
         <!-- <i class="fi fi-rr-cross-small"></i> -->
-				<svg width="46" height="46" viewBox="0 0 46 46" fill="none" xmlns="http://www.w3.org/2000/svg">
+        <svg
-						<circle cx="23" cy="23" r="23" fill="white" fill-opacity="0.3"/>
+          width="46"
-						<rect x="32.5063" y="12" width="3" height="29" rx="1.5" transform="rotate(45 32.5063 12)" fill="white"/>
+          height="46"
-						<rect x="34.6274" y="32.5059" width="3" height="29" rx="1.5" transform="rotate(135 34.6274 32.5059)" fill="white"/>
+          viewBox="0 0 46 46"
+          fill="none"
+          xmlns="http://www.w3.org/2000/svg"
+        >
+          <circle cx="23" cy="23" r="23" fill="white" fill-opacity="0.3" />
+          <rect
+            x="32.5063"
+            y="12"
+            width="3"
+            height="29"
+            rx="1.5"
+            transform="rotate(45 32.5063 12)"
+            fill="white"
+          />
+          <rect
+            x="34.6274"
+            y="32.5059"
+            width="3"
+            height="29"
+            rx="1.5"
+            transform="rotate(135 34.6274 32.5059)"
+            fill="white"
+          />
         </svg>
-
       </div>
     </div>
     <div class="phoneLogin">
@@ -32,45 +53,42 @@
       <a-spin size="large" />
     </div>
   </a-modal>
-
 </template>
 
 <script>
-import { defineComponent,ref,reactive,toRefs, onMounted} from "vue";
+import { defineComponent, ref, reactive, toRefs, onMounted } from "vue";
 import VerificationCodeInput from "@/component/LoginPage/verificationCodeInput.vue";
-const md5 = require("md5");
+import md5 from "md5";
 export default defineComponent({
   components: {
     VerificationCodeInput,
   },
-    setup(){
+  setup() {
     let phoneModel = reactive({
-			phoneModel:false,
+      phoneModel: false,
-			phoneModelMask:true,
+      phoneModelMask: true,
-			pageWidth:'50%',
+      pageWidth: "50%",
-		})
+    });
     let data = reactive({
-			loadingShow:false,
+      loadingShow: false,
-		})
+    });
-		const init = async ()=>{
+    const init = async () => {
-			phoneModel.phoneModel = true
+      phoneModel.phoneModel = true;
-		}
+    };
-		const cancelDsign = ()=>{
+    const cancelDsign = () => {
-			phoneModel.phoneModel = false
+      phoneModel.phoneModel = false;
-		}
+    };
-        return{
+    return {
       ...toRefs(phoneModel),
       ...toRefs(data),
       init,
       cancelDsign,
-        }
-    },
-    data() {
-        return {
     };
   },
-    methods: {
+  data() {
+    return {};
   },
+  methods: {},
 });
 </script>
 <style lang="less" scoped>

src/component/LoginPage/weiXinLogin.vue

@@ -1,47 +1,53 @@
 <template>
   <div class="Container">
     <div class="icon" @click="openWeiXinModel">
-			<img src="@/assets/images/loginPage/weiXinIcon.svg" alt="">
+      <img src="@/assets/images/loginPage/weiXinIcon.svg" alt="" />
       <span>{{ $props.text }}</span>
     </div>
     <weiXinModel ref="weiXinModel"></weiXinModel>
   </div>
 </template>
 <script>
-	import { defineComponent, ref, reactive, watch, onMounted, nextTick, toRefs,router } from "vue";
+import {
-	import weiXinModel from "./weiXinModel.vue";
+  defineComponent,
-    export default defineComponent({
+  ref,
+  reactive,
+  watch,
+  onMounted,
+  nextTick,
+  toRefs,
+} from "vue";
+import weiXinModel from "./weiXinModel.vue";
+export default defineComponent({
   name: "login",
   components: {
-		    weiXinModel
+    weiXinModel,
   },
   props: {
     text: {
       type: String,
-				default: 'Sign in with Wechat'
+      default: "Sign in with Wechat",
-			}
+    },
   },
   setup() {
     let weiXinDom = reactive({
-				weiXinModel:null
+      weiXinModel: null,
-			})
+    });
-			const openWeiXinModel = ()=>{
+    const openWeiXinModel = () => {
-				weiXinDom.weiXinModel.init()
+      weiXinDom.weiXinModel.init();
-			}
+    };
-			onMounted(()=>{
+    onMounted(() => {});
-				
-			})
     return {
       ...toRefs(weiXinDom),
       openWeiXinModel,
-            }
+    };
   },
-    })
+});
 </script>
 <style scoped lang="less">
-.Container{
+.Container {
   position: relative;
-	.icon{
+  .icon {
     // width: 40px;
     width: auto;
     display: flex;
@@ -49,22 +55,22 @@
     justify-content: center;
     border: 1px solid #dadce0;
     border-radius: 4rem;
-		padding: .5rem 3rem;
+    padding: 0.5rem 3rem;
     cursor: pointer;
     box-sizing: border-box;
-		&:hover{
+    &:hover {
       background: #f8faff;
     }
-		img{
+    img {
       width: 3.8rem;
       height: 3.8rem;
     }
-		span{
+    span {
       font-size: 1.4rem;
       margin-left: 1.4rem;
     }
   }
-	&.Container:hover{
+  &.Container:hover {
   }
 }
 </style>

src/component/Pay/payMethod.vue

@@ -18,74 +18,140 @@
     <div class="generalModel_btn">
       <div class="generalModel_closeIcon" @click.stop="cancelDsign()">
         <!-- <i class="fi fi-rr-cross-small"></i> -->
-				<svg width="46" height="46" viewBox="0 0 46 46" fill="none" xmlns="http://www.w3.org/2000/svg">
+        <svg
-						<circle cx="23" cy="23" r="23" fill="white" fill-opacity="0.3"/>
+          width="46"
-						<rect x="32.5063" y="12" width="3" height="29" rx="1.5" transform="rotate(45 32.5063 12)" fill="white"/>
+          height="46"
-						<rect x="34.6274" y="32.5059" width="3" height="29" rx="1.5" transform="rotate(135 34.6274 32.5059)" fill="white"/>
+          viewBox="0 0 46 46"
+          fill="none"
+          xmlns="http://www.w3.org/2000/svg"
+        >
+          <circle cx="23" cy="23" r="23" fill="white" fill-opacity="0.3" />
+          <rect
+            x="32.5063"
+            y="12"
+            width="3"
+            height="29"
+            rx="1.5"
+            transform="rotate(45 32.5063 12)"
+            fill="white"
+          />
+          <rect
+            x="34.6274"
+            y="32.5059"
+            width="3"
+            height="29"
+            rx="1.5"
+            transform="rotate(135 34.6274 32.5059)"
+            fill="white"
+          />
         </svg>
-
       </div>
     </div>
     <div class="payMethodContent">
       <div class="generalModelTitle">
-				{{ $t('upgradePlan.paymentmethod') }}
+        {{ $t("upgradePlan.paymentmethod") }}
       </div>
       <div class="payMethod_list">
         <label class="payMethod_item" v-show="$props.type == 'credits'">
-					<input name="payAffirm" type="radio" value="paypal" v-model="modeOfPayment">
+          <input
-					<img src="../../assets/images/homePage/paypal.svg" alt="">
+            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">
+          <input
-					<img src="../../assets/images/homePage/stripe.svg" alt="">
+            name="Stripe"
-					 <span>Stripe ({{ $t('Renew.CreditCard') }}、{{ $t('Renew.Alipay') }})</span>
+            type="radio"
+            value="stripe"
+            v-model="modeOfPayment"
+          />
+          <img src="../../assets/images/homePage/stripe.svg" alt="" />
+          <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">
+          <input
-					<img src="../../assets/images/homePage/alipay.svg" alt="">
+            name="payAffirm"
-					<span>{{ $t('upgradePlan.Alipay') }}</span>
+            type="radio"
+            value="alipay"
+            v-model="modeOfPayment"
+          />
+          <img src="../../assets/images/homePage/alipay.svg" alt="" />
+          <span>{{ $t("upgradePlan.Alipay") }}</span>
           <div v-show="modeOfPayment == 'alipay'" class="payAffirm_detail">
             <label>
-							<input name="location" type="radio" value="ALIPAYHK" v-model="modeOfPaymentDetail">
+              <input
-							<span>{{ $t('upgradePlan.HongKong') }}</span>
+                name="location"
+                type="radio"
+                value="ALIPAYHK"
+                v-model="modeOfPaymentDetail"
+              />
+              <span>{{ $t("upgradePlan.HongKong") }}</span>
             </label>
             <label>
-							<input name="location" type="radio" value="ALIPAYCN" v-model="modeOfPaymentDetail">
+              <input
-							<span>{{ $t('upgradePlan.MainlandChina') }}</span>
+                name="location"
+                type="radio"
+                value="ALIPAYCN"
+                v-model="modeOfPaymentDetail"
+              />
+              <span>{{ $t("upgradePlan.MainlandChina") }}</span>
             </label>
           </div>
         </label>
       </div>
       <div class="payMethod_payAffirm_clause" ref="labelDisclaimer">
         <label>
-					<input type="checkbox" v-model="clause">
+          <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>
+          <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 class="payMethod_payAffirm_btn">
-				<div class="gallery_btn white" @click="cancelDsign">{{ $t('upgradePlan.Cancel') }}</div>
+        <div class="gallery_btn white" @click="cancelDsign">
-				<div class="gallery_btn" @click="payAffirm">{{ $t('upgradePlan.Payment') }}</div>
+          {{ $t("upgradePlan.Cancel") }}
+        </div>
+        <div class="gallery_btn" @click="payAffirm">
+          {{ $t("upgradePlan.Payment") }}
+        </div>
       </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_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') }}</div>
+        <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>
-
 </template>
 
 <script lang="ts">
-import { defineComponent,ref,reactive,toRefs ,onMounted} from "vue";
+import { defineComponent, ref, reactive, toRefs, onMounted } from "vue";
 import { Https } from "@/tool/https";
 import { isEmail } from "@/tool/util";
 import { message } from "ant-design-vue";
@@ -93,119 +159,133 @@ import VerificationCodeInput from "@/component/LoginPage/verificationCodeInput.v
 import { useStore } from "vuex";
 import { useI18n } from "vue-i18n";
 import { setLang } from "@/tool/guide";
-const md5 = require("md5");
+import md5 from "md5";
 export default defineComponent({
   components: {
     VerificationCodeInput,
   },
-	props:{
+  props: {
-		type:{
+    type: {
-			type:String,
+      type: String,
-			default:''
+      default: "",
-		}
     },
-	emits: ['completePayment'],
+  },
-    setup(prop,{emit}){
+  emits: ["completePayment"],
+  setup(prop, { emit }) {
     const store = useStore();
     let payMethod = reactive({
-			payMethodModel:false,
+      payMethodModel: false,
-			payMethodModelMask:true,
+      payMethodModelMask: true,
-			pageWidth:'50%'
+      pageWidth: "50%",
-		})
+    });
     let payMethodData = reactive({
-			modeOfPayment:prop.type == 'credits'?'paypal':'stripe',
+      modeOfPayment: prop.type == "credits" ? "paypal" : "stripe",
-			modeOfPaymentDetail:'ALIPAYHK',
+      modeOfPaymentDetail: "ALIPAYHK",
-			labelDisclaimer:null,//dom
+      labelDisclaimer: null, //dom
-			payAffirmData:{} as any,
+      payAffirmData: {} as any,
-			clause:false,
+      clause: false,
-			newWindow:null as any,
+      newWindow: null as any,
-			isShowMark:false,
+      isShowMark: false,
-			isShowMark_:false,
+      isShowMark_: false,
-		})
+    });
-		const init = (data:any)=>{
+    const init = (data: any) => {
-			payMethod.payMethodModel = true
+      payMethod.payMethodModel = true;
-			payMethodData.payAffirmData = data
+      payMethodData.payAffirmData = data;
-		}
+    };
     const cancelDsign = () => {
-			payMethod.payMethodModel = false
+      payMethod.payMethodModel = false;
-		}
+    };
     const payAffirm = () => {
-		    if(!payMethodData.clause){
+      if (!payMethodData.clause) {
-				let labelDisclaimer:any = payMethodData.labelDisclaimer
+        let labelDisclaimer: any = payMethodData.labelDisclaimer;
-				if(!labelDisclaimer.classList.contains('animation')){
+        if (!labelDisclaimer.classList.contains("animation")) {
-					labelDisclaimer.classList.add('animation')
+          labelDisclaimer.classList.add("animation");
           setTimeout(() => {
-						labelDisclaimer.classList.remove('animation')
+            labelDisclaimer.classList.remove("animation");
           }, 1000);
         }
-				return
+        return;
       }
-			payMethodData.isShowMark_ = true
+      payMethodData.isShowMark_ = true;
-			let httpsUrl
+      let httpsUrl;
-			let url = window.location.origin+'/paySucceed' 
+      let url = window.location.origin + "/paySucceed";
-			let payAffirmData = payMethodData.payAffirmData
+      let payAffirmData = payMethodData.payAffirmData;
       let data = {
-				autoRenewal:payAffirmData.autoRenewal,//false为不自动续费
+        autoRenewal: payAffirmData.autoRenewal, //false为不自动续费
-				productName:payAffirmData.productName,
+        productName: payAffirmData.productName,
-				quantity:payAffirmData.quantity?payAffirmData.quantity:1,
+        quantity: payAffirmData.quantity ? payAffirmData.quantity : 1,
-				returnUrl:url,
+        returnUrl: url,
-				subscribeType:payAffirmData.subscribeType?payAffirmData.subscribeType:'',//yearly为年费，monthly为月费
+        subscribeType: payAffirmData.subscribeType
-				wallet:payMethodData.modeOfPaymentDetail,
+          ? payAffirmData.subscribeType
-			}
+          : "", //yearly为年费，monthly为月费
-			if(payMethodData.modeOfPayment == 'paypal'){
+        wallet: payMethodData.modeOfPaymentDetail,
-				httpsUrl = Https.httpUrls.payPaypal
+      };
-			}else if (payMethodData.modeOfPayment == 'stripe') {
+      if (payMethodData.modeOfPayment == "paypal") {
-				httpsUrl = Https.httpUrls.payStripe
+        httpsUrl = Https.httpUrls.payPaypal;
+      } else if (payMethodData.modeOfPayment == "stripe") {
+        httpsUrl = Https.httpUrls.payStripe;
         // data.
-			}else{
+      } else {
-				httpsUrl = Https.httpUrls.payAlipayHK
+        httpsUrl = Https.httpUrls.payAlipayHK;
       }
-			Https.axiosPost(httpsUrl,data).then(
+      Https.axiosPost(httpsUrl, data)
-				(rv: any) => {
+        .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);
+          payMethodData.newWindow = window.open(
-					let herf
+            "",
-					if(payMethodData.modeOfPayment == 'paypal'){
+            "_blank",
+            "width=" +
+              width +
+              ", height=" +
+              height +
+              ", left=" +
+              left +
+              ", top=" +
+              top
+          );
+          let herf;
+          if (payMethodData.modeOfPayment == "paypal") {
             // 在新窗口中写入内容
             herf = rv.approve;
             // payMethodData.newWindow.location.href = rv.approve;
-					}else if(payMethodData.modeOfPayment == 'stripe'){
+          } else if (payMethodData.modeOfPayment == "stripe") {
-						herf = rv
+            herf = rv;
             // payMethodData.newWindow.location.href = rv
-					}else{
+          } else {
-						let data = JSON.parse(rv)
+            let data = JSON.parse(rv);
-						herf = `${data.url}?${data.alipay_order_string}`
+            herf = `${data.url}?${data.alipay_order_string}`;
             // payMethodData.newWindow.location.href = herf;
           }
-					if(payMethodData.newWindow){
+          if (payMethodData.newWindow) {
-						payMethodData.newWindow.location.href = herf
+            payMethodData.newWindow.location.href = herf;
-					}else{
+          } 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=>{
+        .catch((res) => {
-				payMethodData.isShowMark_ = false
+          payMethodData.isShowMark_ = false;
         });
-		}
+    };
-		const setPaidBack = ()=>{
+    const setPaidBack = () => {
-			payMethod.payMethodModel = false
+      payMethod.payMethodModel = false;
-			payMethodData.isShowMark = false
+      payMethodData.isShowMark = false;
-			payMethodData.clause = false
+      payMethodData.clause = false;
-			payMethodData.modeOfPayment = prop.type == 'credits'?'paypal':'stripe'
+      payMethodData.modeOfPayment =
-			payMethodData.modeOfPaymentDetail = 'ALIPAYHK'
+        prop.type == "credits" ? "paypal" : "stripe";
-		}
+      payMethodData.modeOfPaymentDetail = "ALIPAYHK";
-		const completePayment = ()=>{
+    };
-			setPaidBack()
+    const completePayment = () => {
-			emit('completePayment')
+      setPaidBack();
-		}
+      emit("completePayment");
-        return{
+    };
+    return {
       store,
       ...toRefs(payMethod),
       ...toRefs(payMethodData),
@@ -214,14 +294,13 @@ export default defineComponent({
       payAffirm,
       setPaidBack,
       completePayment,
-        }
-    },
-    data() {
-        return {
     };
   },
+  data() {
+    return {};
+  },
   methods: {
-		turnToWindow(url:any) {
+    turnToWindow(url: any) {
       window.open(url);
     },
   },
@@ -229,126 +308,126 @@ export default defineComponent({
 </script>
 <style lang="less" scoped>
 .payMethod {
-   .payMethodContent{
+  .payMethodContent {
     display: flex;
     flex-direction: column;
     align-items: center;
     width: 60rem;
     margin: 0 auto;
     position: relative;
-		.generalModelTitle,.generalModelInfo{
+    .generalModelTitle,
+    .generalModelInfo {
       width: 100%;
     }
-		.payMethod_list{
+    .payMethod_list {
       margin-bottom: 4rem;
       display: flex;
       flex-direction: column;
       width: 100%;
-			>label{
+      > label {
         display: flex;
         align-items: center;
         padding: 0 2rem;
         margin-bottom: 3rem;
         cursor: pointer;
-					border: 2px solid #EFEFEF;
+        border: 2px solid #efefef;
         border-radius: 2rem;
         height: 8rem;
         width: 100%;
-				img{
+        img {
           margin: 0rem 2rem;
           // max-width: 4rem;
           width: 4rem;
         }
-				.payAffirm_detail{
+        .payAffirm_detail {
           margin-left: auto;
           display: flex;
-					>label{
+          > label {
             cursor: pointer;
             display: flex;
             align-items: center;
             margin-right: 1rem;
-						span{
+            span {
-							margin-left: .5rem;
+              margin-left: 0.5rem;
             }
           }
-					
         }
       }
-			>label:last-child{
+      > label:last-child {
         margin: 0;
       }
     }
-		.payMethod_payAffirm_clause{
+    .payMethod_payAffirm_clause {
       margin-bottom: 4rem;
-			label{
+      label {
         cursor: pointer;
-				input{
+        input {
           margin-right: 1rem;
           cursor: pointer;
           vertical-align: middle;
         }
-				span{
+        span {
           vertical-align: top;
-					a{
+          a {
             color: #000;
             text-decoration: underline;
           }
         }
       }
-			&.animation{
+      &.animation {
-				animation: shake .3s linear;
+        animation: shake 0.3s linear;
         @keyframes shake {
-					0%{
+          0% {
             transform: translateX(0px);
           }
-					25%{
+          25% {
             transform: translateX(-10px);
           }
-					50%{
+          50% {
             transform: translateX(10px);
           }
-					75%{
+          75% {
             transform: translateX(-10px);
           }
-					100%{
+          100% {
             transform: translateX(0px);
           }
         }
       }
     }
-		.payMethod_payAffirm_btn{
+    .payMethod_payAffirm_btn {
       display: flex;
       justify-content: space-between;
       width: 100%;
-			>div{
+      > div {
         width: 29rem;
       }
     }
-		
   }
-   .mark_loading{
+  .mark_loading {
     position: absolute;
     z-index: 2;
     background: #fff;
-		.mark_loading_title{
+    .mark_loading_title {
       font-size: 3rem;
       // text-decoration: underline;
       font-weight: 600;
       margin-bottom: 2rem;
       // color: #fff;
     }
-	.mark_loading_intro{
+    .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{
+    .mark_loading_title_box {
       display: flex;
     }
 
-	.mark_loading_btn,.mark_loading_btn2{
+    .mark_loading_btn,
+    .mark_loading_btn2 {
       // border: #000;
       // color: #fff;
       display: flex;
@@ -358,19 +437,18 @@ export default defineComponent({
       padding: 0 20px;
       border-radius: 10px;
       cursor: pointer;
-		padding: .3rem 4rem;
+      padding: 0.3rem 4rem;
       background: #39215b;
       color: #fff;
       border: none;
       margin: 0 2rem;
       align-items: center;
     }
-	.mark_loading_btn2{
+    .mark_loading_btn2 {
       border: 2px solid #000;
       color: #000;
-		background: rgba(0,0,0,0);
+      background: rgba(0, 0, 0, 0);
     }
   }
 }
-
 </style>

src/component/WorksPage/Falls.vue

@@ -1,6 +1,10 @@
 <template>
   <div class="Falls">
-		<div class="falls_item" v-fadeIn="isScroll" v-for="item in list" :key="item.id"
+    <div
+      class="falls_item"
+      v-fadeIn="isScroll"
+      v-for="item in list"
+      :key="item.id"
       :style="{
         width: item.style.width + 'px',
         height: item.style.height + 'px',
@@ -17,20 +21,22 @@
             height: item.style.imgHeihgt + 'px',
           }"
         />
-				<div v-if="item.original == 1" class="falls_item_user_Original">{{$t('newScaleImage.Original')}}</div>
+        <div v-if="item.original == 1" class="falls_item_user_Original">
+          {{ $t("newScaleImage.Original") }}
+        </div>
       </div>
 
       <!-- 文字 -->
       <div class="falls_item_bottom" v-if="isText">
         <div class="falls_item_text" :title="item.text">
-					{{item.text}}
+          {{ item.text }}
         </div>
         <div class="falls_item_content">
           <div class="falls_item_user">
             <!-- <img src="http://121.40.53.210:3000/falls/5.png" alt=""> -->
             <div class="falls_item_user_detail">
               <span>@{{ item.userName }}</span>
-							<div :title="item.portfolioName">{{item.portfolioName}}</div>
+              <div :title="item.portfolioName">{{ item.portfolioName }}</div>
               <!-- <span :title="item.portfolioDes">{{item.portfolioDes}}</span> -->
             </div>
           </div>
@@ -42,9 +48,13 @@
 							<span>{{item.viewNums}}</span>
 						</div> -->
             <label @click="portfolioLike(item)">
-							<i v-if="true" class="fi fi-sr-thumbs-up" style="color:rgba(158, 158, 167);"></i>
+              <i
+                v-if="true"
+                class="fi fi-sr-thumbs-up"
+                style="color: rgba(158, 158, 167)"
+              ></i>
               <i v-else class="fi fi-rr-social-network"></i>
-							<span>{{item.likeNum}}</span>
+              <span>{{ item.likeNum }}</span>
             </label>
             <div>
               <!-- <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16" fill="none" role="img" style="color: #9e9ea7;fill: currentColor;">
@@ -52,7 +62,7 @@
 								<path d="M8 10C9.10457 10 10 9.10457 10 8C10 6.89543 9.10457 6 8 6C6.89543 6 6 6.89543 6 8C6 9.10457 6.89543 10 8 10Z" fill="white"></path>
 							</svg> -->
               <i class="fi fi-sr-eye"></i>
-							<span>{{item.viewNums}}</span>
+              <span>{{ item.viewNums }}</span>
             </div>
           </div>
         </div>
@@ -62,36 +72,46 @@
 </template>
 
 <script>
-import { defineComponent,h ,toRefs,ref,reactive,onMounted,onBeforeDestroy,nextTick,provide,computed} from 'vue'
+import {
+  defineComponent,
+  h,
+  toRefs,
+  ref,
+  reactive,
+  onMounted,
+  nextTick,
+  provide,
+  computed,
+} from "vue";
 import { gsap, TweenMax } from "gsap";
 import { ScrollTrigger } from "gsap/ScrollTrigger";
 export default defineComponent({
-	props:{
+  props: {
-		isScroll:{
+    isScroll: {
-			 type:Boolean,
+      type: Boolean,
-			 default:true,
+      default: true,
     },
-		 isText:{
+    isText: {
-			 type:Boolean,
+      type: Boolean,
-			 default:true,
+      default: true,
     },
-		 itemWidth:{
+    itemWidth: {
-			 type:Number,
+      type: Number,
-			 default:300,
+      default: 300,
-		 }
     },
-	setup(){
+  },
-		let list = ref([])
+  setup() {
-		let wait_list = ref([])
+    let list = ref([]);
-		let width = ref(300)
+    let wait_list = ref([]);
-		let num_x = ref(1)
+    let width = ref(300);
-		let gap_x = ref(0)
+    let num_x = ref(1);
-		let gap_y = ref(0)
+    let gap_x = ref(0);
-		let poss = ref([])
+    let gap_y = ref(0);
-		let loading = ref(false)
+    let poss = ref([]);
-		let computedHeight = 0
+    let loading = ref(false);
-		let imgDom = ref()
+    let computedHeight = 0;
-		return{
+    let imgDom = ref();
+    return {
       list,
       wait_list,
       width,
@@ -102,29 +122,29 @@ export default defineComponent({
       loading,
       computedHeight,
       imgDom,
-		}
+    };
   },
-	directives:{
+  directives: {
-		fadeIn:{
+    fadeIn: {
-			mounted (el,binding) {
+      mounted(el, binding) {
-				let dom
+        let dom;
-				if(binding.value){
+        if (binding.value) {
-					dom = document.querySelector('.works_page .page_content')
+          dom = document.querySelector(".works_page .page_content");
-				}else{
+        } else {
-					dom = document.querySelector('.homeRecommend_content_body')
+          dom = document.querySelector(".homeRecommend_content_body");
         }
         gsap.registerPlugin(ScrollTrigger);
         let tl1 = gsap.timeline();
-				tl1.from(el,1, {y:'30px',opacity:0},)
+        tl1.from(el, 1, { y: "30px", opacity: 0 });
         ScrollTrigger.create({
           trigger: el, // 触发器元素
           start: "top 90%", // 滚动触发器的起始滚动位置
-					end: '100% 80%',   // 滚动触发器的结束滚动位置
+          end: "100% 80%", // 滚动触发器的结束滚动位置
           // markers: true, // 开启标注功能
           scrub: true,
-					animation:tl1,
+          animation: tl1,
-					scroller:dom,//设置指定元素为滚动依据
+          scroller: dom, //设置指定元素为滚动依据
-					scrub:2,
+          scrub: 2,
           // onUpdate:(v)=>{
           // 	if(v.progress < 0.1){
           // 		v.trigger?.classList.remove('active')
@@ -134,41 +154,46 @@ export default defineComponent({
           // 	}
           // }
         });
-			}
       },
     },
-		mounted () {
+  },
-			this.resize()
+  mounted() {
+    this.resize();
     window.addEventListener("resize", this.resize);
-			let domFalls = document.querySelector('.Falls')
+    let domFalls = document.querySelector(".Falls");
     let domCss = getComputedStyle(domFalls);
-			const paddingBottom = domCss.getPropertyValue('--paddingBottom').split('px')[0]*1;
+    const paddingBottom =
-			const textMarginTop = domCss.getPropertyValue('--textMarginTop').split('px')[0]*1;
+      domCss.getPropertyValue("--paddingBottom").split("px")[0] * 1;
-			const textHeight = domCss.getPropertyValue('--textHeight').split('px')[0]*1;
+    const textMarginTop =
-			const contentHeight = domCss.getPropertyValue('--contentHeight').split('px')[0]*1;
+      domCss.getPropertyValue("--textMarginTop").split("px")[0] * 1;
-			if(this.$props.isText){
+    const textHeight =
-				this.computedHeight = paddingBottom + textMarginTop + textHeight + contentHeight;
+      domCss.getPropertyValue("--textHeight").split("px")[0] * 1;
+    const contentHeight =
+      domCss.getPropertyValue("--contentHeight").split("px")[0] * 1;
+    if (this.$props.isText) {
+      this.computedHeight =
+        paddingBottom + textMarginTop + textHeight + contentHeight;
     }
   },
-		beforeDestroy () {
+  beforeDestroy() {
-			this.wait_list = []
+    this.wait_list = [];
     window.removeEventListener("resize", this.resize);
   },
   // 挂载方法
   methods: {
-			clearData(){
+    clearData() {
-				this.wait_list = []
+      this.wait_list = [];
-				this.width = this.itemWidth
+      this.width = this.itemWidth;
-				this.num_x = 1
+      this.num_x = 1;
-				this.gap_x = 0
+      this.gap_x = 0;
-				this.gap_y = 0
+      this.gap_y = 0;
-				this.poss = []
+      this.poss = [];
-				this.loading = false
+      this.loading = false;
-				this.list = []
+      this.list = [];
-				this.resize()
+      this.resize();
-				if(this.imgDom){
+      if (this.imgDom) {
         this.imgDom.remove();
-					this.imgDom = null
+        this.imgDom = null;
       }
     },
     push(arr) {
@@ -178,11 +203,11 @@ export default defineComponent({
         this.loadImg();
       }
     },
-			deleteItem(id){
+    deleteItem(id) {
       for (let index = 0; index < this.list.length; index++) {
-					if(this.list[index].id == id){
+        if (this.list[index].id == id) {
-						this.list.splice(index,1)
+          this.list.splice(index, 1);
-						this.resize()
+          this.resize();
           break;
         }
       }
@@ -195,16 +220,16 @@ export default defineComponent({
       }
 
       let url = this.wait_list[0].canvasUrl || this.wait_list[0].url;
-				let data = this.wait_list[0]
+      let data = this.wait_list[0];
       this.imgDom = document.createElement("img");
       this.imgDom.src = url;
       this.imgDom.style.width = this.itemWidth + "px";
-				this.imgDom.style.maxHeight = this.itemWidth+330 + "px";
+      this.imgDom.style.maxHeight = this.itemWidth + 330 + "px";
       this.imgDom.style.position = "absolute";
       this.imgDom.style.top = "-99999px";
       document.body.appendChild(this.imgDom);
       this.imgDom.addEventListener("load", () => {
-					if(!this.imgDom) return
+        if (!this.imgDom) return;
         var idx = 0;
         var pos_num = this.poss[idx];
         for (var i = 1; i < this.poss.length; i++) {
@@ -215,22 +240,21 @@ export default defineComponent({
         }
         // this.computedHeight = 0
         let width = this.imgDom.offsetWidth;
-					let height = this.imgDom.offsetHeight+this.computedHeight;
+        let height = this.imgDom.offsetHeight + this.computedHeight;
         let top = this.poss[idx] + this.gap_y;
         let left = (idx + 1) * this.gap_x + idx * width;
-					let imgHeight = height - this.computedHeight
+        let imgHeight = height - this.computedHeight;
         this.poss[idx] = top + height;
         let obj = {
-						canvasUrl:url,
+          canvasUrl: url,
           style: { width, height, top, left, imgHeight },
-						...data
+          ...data,
         };
         this.list.push(obj);
         this.imgDom.remove();
-					this.imgDom = null
+        this.imgDom = null;
         this.wait_list.splice(0, 1);
-					this.$el.style.height =
+        this.$el.style.height = Math.max(...this.poss) + this.gap_y + "px";
-						Math.max(...this.poss) + this.gap_y + "px";
         if (this.wait_list.length <= 0) {
           this.loading = false;
           this.$emit("loadend");
@@ -254,8 +278,7 @@ export default defineComponent({
         for (var i = 0; i < num_x; i++) poss.push(0);
         this.poss = poss;
         this.reset();
-				})
+      });
-				
     },
     reset() {
       for (let i = 0; i < this.list.length; i++) {
@@ -276,26 +299,26 @@ export default defineComponent({
       }
       this.$el.style.height = Math.max(...this.poss) + this.gap_y + "px";
     },
-			setItemDetail(data){
+    setItemDetail(data) {
-				this.$emit('getImgScale',data)
+      this.$emit("getImgScale", data);
     },
-			portfolioLike(data){
+    portfolioLike(data) {
-				this.$emit('setPortfolioLike',data)
+      this.$emit("setPortfolioLike", data);
-			}
     },
-})
+  },
+});
 </script>
 
-<style lang='less' scoped>
+<style lang="less" scoped>
-	.Falls {
+.Falls {
   width: 100%;
   height: auto;
   position: relative;
-		--paddingBottom:10px;
+  --paddingBottom: 10px;
-		--textMarginTop:10px;
+  --textMarginTop: 10px;
-		--textHeight:25px;
+  --textHeight: 25px;
-		--contentHeight:35px;
+  --contentHeight: 35px;
-		.falls_item{
+  .falls_item {
     position: absolute;
     transition: all 0.15s;
     display: flex;
@@ -304,24 +327,24 @@ export default defineComponent({
     border-radius: 2rem;
     overflow: hidden;
     padding-bottom: var(--paddingBottom);
-			&.falls_item:hover{
+    &.falls_item:hover {
-				.falls_item_img{
+      .falls_item_img {
-					img{
+        img {
           transform: scale(1.1);
         }
       }
     }
-			.falls_item_img{
+    .falls_item_img {
       cursor: pointer;
       width: 100%;
       overflow: hidden;
-				img{
+      img {
         width: 100%;
         object-fit: cover;
         height: 100%;
-					transition: all .3s;
+        transition: all 0.3s;
       }
-				.falls_item_user_Original{
+      .falls_item_user_Original {
         font-weight: 600;
         font-size: 12px;
         color: #39215b;
@@ -335,9 +358,9 @@ export default defineComponent({
         left: auto;
       }
     }
-			.falls_item_bottom{
+    .falls_item_bottom {
       padding: 0 10px;
-				.falls_item_text{
+      .falls_item_text {
         overflow: hidden;
         text-overflow: ellipsis;
         white-space: nowrap;
@@ -346,25 +369,25 @@ export default defineComponent({
         margin-top: var(--textMarginTop);
         height: var(--textHeight);
       }
-				.falls_item_content{
+      .falls_item_content {
         display: flex;
         justify-content: space-between;
         align-items: center;
         color: #525252;
         height: var(--contentHeight);
-					.falls_item_user{
+        .falls_item_user {
           width: 50%;
           display: flex;
           align-items: center;
           flex: 1;
           overflow: hidden;
-						img{
+          img {
             width: 25px;
             height: 25px;
             border-radius: 50%;
             margin-right: 10px;
           }
-						.falls_item_user_detail{
+          .falls_item_user_detail {
             line-height: 1;
             width: 60%;
             width: 100%;
@@ -373,20 +396,20 @@ export default defineComponent({
             flex-direction: column;
             align-items: flex-start;
 
-							>div{
+            > div {
               width: 100%;
               font-size: 16px;
               overflow: hidden;
               text-overflow: ellipsis;
               white-space: nowrap;
             }
-							span{
+            span {
               font-size: 12px;
               color: #525252;
             }
           }
         }
-					.falls_item_detail{
+        .falls_item_detail {
           display: flex;
           // width: 40%;
           // width: 20%;
@@ -394,27 +417,29 @@ export default defineComponent({
           // width: 70px;
           width: auto;
           justify-content: space-between;
-						>label:nth-child(1){
+          > label:nth-child(1) {
             margin-right: 2rem;
           }
-						>label{
+          > label {
             // cursor: pointer;
           }
-						>label,>div{
+          > label,
+          > div {
             display: flex;
             align-items: center;
-							i{
+            i {
               // font-size: 1.8rem;
               font-size: 12px;
             }
-							svg,i{
+            svg,
+            i {
               color: #9e9ea7;
               display: flex;
               // width: 10px;
               // height: 10px;
               margin-right: 5px;
             }
-							span{
+            span {
               margin-left: 3px;
               font-size: 12px;
             }
@@ -422,8 +447,6 @@ export default defineComponent({
         }
       }
     }
-			
-
-		}
   }
+}
 </style>

src/main.ts

@@ -1,35 +1,42 @@
-import { createApp,defineComponent,h } from 'vue'
+import { createApp, defineComponent, h } from "vue";
-import App from './App.vue'
+import App from "./App.vue";
-import router from './router'
+import router from "./router";
-import store from './store'
+import store from "./store";
-import './assets/iconfont/iconfont.css'
+import "./assets/iconfont/iconfont.css";
-import './assets/iconfont/iconfont.js'
+import "./assets/iconfont/iconfont.js";
-import './assets/iconfont2/iconfont.css'
+import "./assets/iconfont2/iconfont.css";
-import flexible from './tool/flexible.js'
+import flexible from "./tool/flexible.js";
-import 'ant-design-vue/dist/antd.css';
+import "ant-design-vue/dist/antd.css";
-import Antd from 'ant-design-vue';
+import Antd from "ant-design-vue";
-import './assets/style/style.less';
+import "./assets/style/style.less";
 import VueLazyload from "vue-lazyload";
-import i18n from './lang/index'
+import i18n from "./lang/index";
-import { getBrowserInfo, murmur } from './tool/util'
+import { getBrowserInfo, murmur } from "./tool/util";
-import "../node_modules/@flaticon/flaticon-uicons/css/all/all.css"
+import "../node_modules/@flaticon/flaticon-uicons/css/all/all.css";
 // import { Https } from "@/tool/https";
-import 'swiper/css';
+import "swiper/css";
-import 'swiper/css/pagination';
+import "swiper/css/pagination";
 
 // import "@/tool/color-thief.js";
 // import "@/tool/fabric.brushes.js";
 // import "@/tool/fabric.min.js";
 const app = createApp(App);
-flexible()
+flexible();
 
 import { getCookie, setCookie } from "@/tool/cookie";
-document.addEventListener('touchstart', function(event) {
+import loadingGif from "./assets/images/homePage/loading.gif";
+
+document.addEventListener("touchstart", function (event) {
   event.preventDefault(); // 阻止长按选中
 });
 let loadingParam = {
-	loading: require('./assets/images/homePage/loading.gif'),
+  loading: loadingGif,
-	attempt: 1
+  attempt: 1,
-}
+};
-app.use(store).use(router).use(Antd).use(VueLazyload, loadingParam).use(i18n).mount('#app')
+app
-
+  .use(store)
+  .use(router)
+  .use(Antd)
+  .use(VueLazyload, loadingParam)
+  .use(i18n)
+  .mount("#app");

src/views/Login.vue

@@ -3,7 +3,7 @@
     <div class="left">
       <!-- :isScroll="!isMask" -->
       <Works :autoscroll="true" :position="'login'"></Works>
-			<div class="mask" v-show="isMask" @click="()=>isMask = !isMask">
+      <div class="mask" v-show="isMask" @click="() => (isMask = !isMask)">
         <div class="content">
           <div class="userNum">
             <div class="title">5 000 000 +</div>
@@ -16,22 +16,32 @@
     <div class="right">
       <div class="Text" v-show="!loginType">
         <div class="title">Join millions <br />using AI every day</div>
-				<div class="info">Experience secure,spam-free support that empowers you to grow, create,and succeed with confidence</div>
+        <div class="info">
+          Experience secure,spam-free support that empowers you to grow,
+          create,and succeed with confidence
+        </div>
       </div>
       <div class="loginBox">
         <div class="selectType" v-show="!loginType">
-					<div class="text">
+          <div class="text">Continue with one of these:</div>
-						Continue with one of these:
-					</div>
           <div class="typeList">
-						<div class="gallery_btn white" @click="setLoginType('personal')">personal</div>
+            <div class="gallery_btn white" @click="setLoginType('personal')">
-						<div class="gallery_btn white" @click="setLoginType('school')">school</div>
+              personal
-						<div class="gallery_btn white" @click="setLoginType('enterprise')">enterprise</div>
+            </div>
+            <div class="gallery_btn white" @click="setLoginType('school')">
+              school
+            </div>
+            <div class="gallery_btn white" @click="setLoginType('enterprise')">
+              enterprise
+            </div>
           </div>
         </div>
         <div class="login" v-show="loginType">
           <div class="title">
-						<i class="fi fi-br-angle-small-left" @click="()=>loginType = ''"></i>
+            <i
+              class="fi fi-br-angle-small-left"
+              @click="() => (loginType = '')"
+            ></i>
             <!-- <i class="fi fi-rr-arrow-left" @click="()=>loginType = ''"></i> -->
             <span>Log on to AiDA 3.0</span>
           </div>
@@ -44,12 +54,21 @@
   </div>
 </template>
 <script lang="ts">
-import { defineComponent,computed,ref,provide,nextTick,createVNode,toRefs, reactive} from 'vue'
+import {
-import { ExclamationCircleOutlined } from '@ant-design/icons-vue';
+  defineComponent,
+  computed,
+  ref,
+  provide,
+  nextTick,
+  createVNode,
+  toRefs,
+  reactive,
+} from "vue";
+import { ExclamationCircleOutlined } from "@ant-design/icons-vue";
 import { Https } from "@/tool/https";
 import { useStore } from "vuex";
-import { useI18n } from 'vue-i18n'
+import { useI18n } from "vue-i18n";
-const md5 = require("md5");
+import md5 from "md5";
 import Works from "@/views/HomeView/Works.vue";
 import { message } from "ant-design-vue";
 import { isEmail } from "@/tool/util";
@@ -57,124 +76,133 @@ import personal from "@/component/LoginPage/login/personal.vue";
 import school from "@/component/LoginPage/login/school.vue";
 import enterprise from "@/component/LoginPage/login/enterprise.vue";
 export default defineComponent({
-	components:{
+  components: {
-		Works,personal,school,enterprise
+    Works,
+    personal,
+    school,
+    enterprise,
   },
-	props:{
+  props: {},
-	},
+  emits: [],
-	emits:[],
+  setup(props, { emit }) {
-	setup(props,{emit}) {
     const store = useStore();
     const loginData = reactive({
-			loginType:'',
+      loginType: "",
-			isMask:true,
+      isMask: true,
-		})
+    });
-		const dataDom = reactive({
+    const dataDom = reactive({});
-		})
+    const setLoginType = (str: any) => {
-		const setLoginType = (str:any)=>{
+      loginData.loginType = str;
-			loginData.loginType = str
+    };
-		}
+    return {
-		return{
       ...toRefs(dataDom),
       ...toRefs(loginData),
       setLoginType,
-		}
+    };
   },
   provide() {
-		return {
+    return {};
-		}
   },
-})
+});
 </script>
 <style lang="less" scoped>
-	.loginPage{
+.loginPage {
   width: 100%;
   height: 100%;
   position: relative;
   display: flex;
-		> .left,>.right{
+  > .left,
+  > .right {
     height: 100%;
   }
-		> .left{
+  > .left {
     width: 60%;
     background: #f7f8fa;
     position: relative;
-			> .mask{
+    > .mask {
       position: absolute;
       width: 100%;
       height: 100%;
       top: 0;
       left: 0;
-				background: linear-gradient(to bottom, rgba(255, 255, 255, 0) 0%, rgba(0, 0, 0, .8) 100%);
+      background: linear-gradient(
+        to bottom,
+        rgba(255, 255, 255, 0) 0%,
+        rgba(0, 0, 0, 0.8) 100%
+      );
       display: flex;
       justify-content: center;
       align-items: center;
       color: #fff;
       cursor: pointer;
-				> .content{
+      > .content {
         text-align: center;
         padding: 15rem;
         //黑色径向渐变
-					background: radial-gradient(ellipse at center, rgba(0, 0, 0, 0.3) 0%, rgba(0, 0, 0, 0) 70%);
+        background: radial-gradient(
-					.userNum{
+          ellipse at center,
+          rgba(0, 0, 0, 0.3) 0%,
+          rgba(0, 0, 0, 0) 70%
+        );
+        .userNum {
           line-height: 1;
           margin-bottom: 3rem;
-						> .title{
+          > .title {
             font-size: 8rem;
             font-weight: 900;
           }
-						> div{
+          > div {
             font-size: 3rem;
             font-weight: 500;
           }
         }
-					> .info{
+        > .info {
           font-size: 4rem;
           font-weight: 500;
         }
       }
     }
   }
-		> .right{
+  > .right {
     display: flex;
     width: 40%;
     align-items: center;
     justify-content: center;
     flex-direction: column;
-			> .Text{
+    > .Text {
       width: 60rem;
       text-align: center;
-				> .title{
+      > .title {
         font-size: 4rem;
         font-weight: 900;
         line-height: 1.2;
         margin-bottom: 2rem;
       }
-				> .info{
+      > .info {
         font-size: 1.8rem;
         margin-bottom: 2rem;
         line-height: 1.2;
       }
-				> .continue{
+      > .continue {
-					> i{
+        > i {
           margin-left: 1rem;
         }
       }
     }
-			> .loginBox{
+    > .loginBox {
       width: 60rem;
-				> .selectType{
+      > .selectType {
         width: 100%;
         text-align: center;
-					> .text{
+        > .text {
           font-size: 2.5rem;
           font-weight: 600;
         }
-					> .typeList{
+        > .typeList {
-						> div{
+          > div {
             margin: 0 auto;
             width: 33rem;
-							margin-top: .8rem;
+            margin-top: 0.8rem;
             border-radius: 1rem;
             border: 2px solid;
             display: flex;
@@ -183,14 +211,14 @@ export default defineComponent({
           }
         }
       }
-				> .login{
+      > .login {
         position: relative;
-					> .title{
+        > .title {
           font-size: 4rem;
           font-weight: 900;
           display: flex;
           align-items: center;
-						> i{
+          > i {
             margin-right: 2rem;
             font-size: 3rem;
             display: flex;
@@ -201,5 +229,5 @@ export default defineComponent({
       }
     }
   }
-	}
+}
 </style>