Browse Source

imei帮助页,其他完善

冯诚 1 year ago
parent
commit
f167c12181

File diff suppressed because it is too large
+ 2 - 0
index.html


BIN
src/assets/imei-1.jpg


BIN
src/assets/imei-2.jpg


BIN
src/assets/imei-3.jpg


+ 1 - 3
src/components/nav-bar/index.vue

@@ -189,8 +189,6 @@ import { ref, watch, onMounted } from 'vue'
 import { useRoute, useRouter } from 'vue-router'
 import { state, logout } from '@/store'
 import Dialog from '@/components/dialog'
-import Swiper from 'swiper'
-import 'swiper/css'
 import { lockScroll } from '@/utils/dom'
 
 interface Props {
@@ -213,7 +211,7 @@ onMounted(() => {
     slidesPerView: 1.08,
     spaceBetween: 15,
     on: {
-      slideChange(swiper) {
+      slideChange(swiper: any) {
         slideIdx.value = swiper.realIndex
       },
     },

+ 1 - 0
src/env.d.ts

@@ -17,3 +17,4 @@ declare module 'nprogress'
 declare const FB: any
 declare const google: any
 declare const Beacon: any
+declare const Swiper: any

+ 30 - 8
src/pages/imei/index.vue

@@ -33,14 +33,35 @@
   </div>
 
   <div v-else class="p-imei">
-    <h3 class="ptc-title">View mobile IMEI</h3>
-    <div class="ptc-block">
-      <div class="guide ptc-inner">
-        <div class="guide-txt">
-          View on iPhone: Turn on the phone and click Settings-General-About
-          this machine to check the IMEI number。
+    <h3 class="ptc-title">What is an IMEI number?</h3>
+    <div class="ptc-wrapper">
+      <div class="ptc-block">
+        <div class="guide ptc-inner">
+          <p class="guide-txt">
+            The IMEI and series number are between 10 - 20 serial character
+            unique to each and every phone.
+          </p>
+          <p class="guide-txt bold">
+            You’ll usually find it printed on the back of your phone or on the
+            SIM tray.
+          </p>
+          <img class="guide-img" src="@img/imei-1.jpg" />
+          <img class="guide-img" src="@img/imei-2.jpg" />
+          <p class="guide-txt">
+            Alternatively you can have your mobile display its IMEI number by
+            typing the following on the keypad: <strong>*#06#</strong>
+          </p>
+          <img class="guide-img" src="@img/imei-3.jpg" />
+          <p class="guide-txt">
+            *If your handset display character and symbol please enter character
+            only. *
+          </p>
+        </div>
+      </div>
+      <div class="ptc-button-group">
+        <div class="ptc-inner">
+          <button class="ptc-button" @click="$router.back()">BACK</button>
         </div>
-        <div class="guide-img"></div>
       </div>
     </div>
   </div>
@@ -104,13 +125,14 @@ async function applyBind() {
 
   .guide {
     &-txt {
+      margin-top: 40px;
       line-height: 44px;
       font-size: 32px;
       color: #333;
     }
     &-img {
       display: block;
-      margin-top: 38px;
+      margin-top: 40px;
       height: 328px;
       background: #eee;
     }

+ 49 - 23
src/pages/password/index.vue

@@ -64,31 +64,36 @@
         We will send you an email( {{ resetForm.email }} )The password reset
         email has been sent. Please go to check it
       </div>
-      <!-- <div class="ptc-form">
-        <div class="ptc-form-item">
-          <button class="ptc-button">GO</button>
-        </div>
-      </div> -->
     </div>
-    <div v-if="step === 2" class="step ptc-inner">
-      <h3 class="title">Recover password</h3>
-      <div class="desc">
-        Please set a new password for {{ resetForm.email }}. It is recommended
-        to use a combination of numbers, letters, and characters to improve the
-        password security level
-      </div>
-      <div class="ptc-form">
-        <div class="ptc-form-item">
-          <input
-            v-model="resetForm.password"
-            class="ptc-input"
-            placeholder="6-20 digits password, case sensitive"
-          />
+    <div v-else-if="step === 2" class="step ptc-inner">
+      <template v-if="resetStatus === 1">
+        <h3 class="title">Recover password</h3>
+        <div class="desc">
+          Please set a new password for {{ resetForm.email }}. It is recommended
+          to use a combination of numbers, letters, and characters to improve
+          the password security level
         </div>
-        <div class="ptc-form-item">
-          <button class="ptc-button" @click="applyReset">SUBMIT</button>
+        <div class="ptc-form">
+          <div class="ptc-form-item">
+            <input
+              v-model="resetForm.password"
+              class="ptc-input"
+              placeholder="6-20 digits password, case sensitive"
+            />
+          </div>
+          <div class="ptc-form-item">
+            <button class="ptc-button" @click="applyReset">SUBMIT</button>
+          </div>
         </div>
-      </div>
+      </template>
+      <template v-if="resetStatus === -1">
+        <i class="icon-fail"></i>
+        <h3 class="title tac">The Link For Reset Your Password Has Expired</h3>
+        <p class="desc tac">Please Press Below Button To Retrieve New Link</p>
+        <button class="ptc-button mgt96" @click="refresh">
+          RESET PASSWORD
+        </button>
+      </template>
     </div>
     <div v-else-if="step === 3" class="step ptc-inner">
       <i class="icon-success"></i>
@@ -101,12 +106,13 @@
 </template>
 
 <script setup lang="ts">
-import { reactive, ref, watch } from 'vue'
+import { reactive, ref, watch, onMounted } from 'vue'
 import { useRoute, useRouter } from 'vue-router'
 import { state } from '@/store'
 import {
   sendPasswordEmail,
   resetPassword,
+  resetCheck,
   changePassword,
 } from '@/service/user'
 import { string } from 'yup'
@@ -120,6 +126,7 @@ const router = useRouter()
 const { query } = useRoute() as any
 const fromPath = history.state.back
 const step = ref(query.token ? 2 : 0)
+const resetStatus = ref(0)
 const { values, handleSubmit } = useForm<ApiUser.PasswordChange.Request>({
   schema: {
     old_password: string().required('Please enter old password'),
@@ -136,6 +143,15 @@ const resetForm = reactive<ApiUser.PasswordReset.Request>({
 
 state.bgWhite = true
 
+onMounted(() => {
+  if (step.value === 2) {
+    const { email, token } = resetForm
+    resetCheck({ email, token })
+      .then(() => (resetStatus.value = 1))
+      .catch(() => (resetStatus.value = -1))
+  }
+})
+
 watch(step, () => window.scrollTo(0, 0))
 
 async function applyChange() {
@@ -168,6 +184,10 @@ async function applyReset() {
     Toast(err.message)
   }
 }
+
+function refresh() {
+  location.href = 'reset'
+}
 </script>
 
 <style lang="scss">
@@ -195,9 +215,15 @@ async function applyReset() {
     color: #333;
   }
 
+  .icon-fail,
   .icon-success {
     display: block;
     margin: 0 auto 32px;
+  }
+  .icon-fail {
+    @include icon('@img/warn.png', 96px);
+  }
+  .icon-success {
     @include icon('@img/success.png', 96px);
   }
 

+ 42 - 2
src/pages/pay-result/index.vue

@@ -50,6 +50,33 @@
       </div>
     </div>
 
+    <div
+      v-else-if="$route.params.status === 'success'"
+      class="pay-success ptc-inner"
+    >
+      <div class="alert">
+        <i class="alert-icon icon-success"></i>
+        <p class="alert-message">
+          Payment Successful And Thank You For Joining PTC Care Plus
+        </p>
+      </div>
+      <div class="button-group">
+        <button
+          class="ptc-button"
+          @click="$router.push(`/imei/bind?id=${$route.query.id}`)"
+        >
+          BIND IMEI
+        </button>
+        <button class="ptc-button ptc-button--stroke" @click="toHomePage">
+          HOMEPAGE
+        </button>
+      </div>
+      <p class="tip">
+        Your Login Details Has Sent To Your Email, Please Login to Bind IMEI and
+        Start Enjoy PTC Care Plus
+      </p>
+    </div>
+
     <div v-else class="pay-fail ptc-inner">
       <div class="alert">
         <i class="alert-icon icon-warn"></i>
@@ -57,7 +84,9 @@
       </div>
       <!-- <p class="reason">Insufficient bank card balance</p> -->
       <div class="button-group">
-        <button class="ptc-button">CUSTOMER SERVICE</button>
+        <button class="ptc-button" @click="customerService">
+          CUSTOMER SERVICE
+        </button>
         <button class="ptc-button ptc-button--stroke" @click="toHomePage">
           HOMEPAGE
         </button>
@@ -73,7 +102,7 @@ import { state, getCurrentOrder } from '@/store'
 export default defineComponent({
   name: 'PayResult',
   async beforeRouteEnter(to) {
-    if (to.params.status === 'success') {
+    if (to.params.status === 'success' && state.userInfo) {
       await getCurrentOrder(to.query.id)
     }
   },
@@ -92,6 +121,9 @@ export default defineComponent({
     toHomePage() {
       location.href = '/ptc/'
     },
+    customerService() {
+      Beacon('open')
+    },
   },
 })
 </script>
@@ -150,5 +182,13 @@ export default defineComponent({
   .ptc-button--stroke {
     margin: 36px 0 64px;
   }
+
+  .tip {
+    margin: 40px 0 64px;
+    line-height: 40px;
+    text-align: center;
+    font-size: 28px;
+    color: #505050;
+  }
 }
 </style>

+ 0 - 1
src/router.ts

@@ -43,7 +43,6 @@ const router = createRouter({
     {
       path: '/pay-result/:status',
       component: () => import('./pages/pay-result/index.vue'),
-      meta: { auth: true },
     },
     {
       path: '/account',

+ 3 - 1
src/service/user.ts

@@ -21,7 +21,9 @@ export function resetPassword(data: ApiUser.PasswordReset.Request) {
 }
 
 export function resetCheck(data: any) {
-  return request.post('/user/password/reset/check', data)
+  return request.post('/user/password/reset/check', data, {
+    reportError: false,
+  })
 }
 
 export function changePassword(data: ApiUser.PasswordChange.Request) {