@uxda/appkit 4.2.46 → 4.2.48

package/src/user/components/UserBinding.vue

@@ -1,12 +1,8 @@
 <template>
   <div class="user-binding">
     <div class="user-binding-layout">
-      <img
-        class="user-binding-img"
-        :src="`https://cdn.ddjf.com/static/images/customer-center/user-${
-          current === 1 ? 'binding' : 'auth'
-        }.png`"
-      />
+      <img class="user-binding-img" :src="`https://cdn.ddjf.com/static/images/customer-center/user-${current === 1 ? 'binding' : 'auth'
+        }.png`" />
       <nut-steps :current="current" class="user-binding-steps">
         <nut-step title="身份认证">1</nut-step>
         <nut-step title="换绑手机">2</nut-step>
@@ -16,82 +12,39 @@
     <div class="user-binding-layout user-binding-inputlayout" style="flex: 1" v-if="current === 1">
       <nut-form>
         <nut-form-item label="手机号码" label-align="left">
-          <nut-input
-            v-model="authState.mobile"
-            placeholder="请输入手机号码"
-            :max-length="11"
-            readonly
-            input-align="right"
-          />
+          <nut-input v-model="authState.mobile" placeholder="请输入手机号码" :max-length="11" readonly input-align="right" />
         </nut-form-item>
         <nut-form-item label="验证码" label-align="left">
-          <nut-input
-            v-model="authState.code"
-            placeholder="请输入验证码"
-            :max-length="6"
-            input-align="right"
-          >
+          <nut-input v-model="authState.code" placeholder="请输入验证码" :max-length="6" input-align="right">
             <template #right>
-              <nut-button
-                :disabled="countdownActive"
-                class="user-binding-codebtn"
-                type="default"
-                @click="onAuthCode"
-                >{{ countdownText }}</nut-button
-              >
+              <nut-button :disabled="countdownActive" class="user-binding-codebtn" type="default" @click="onAuthCode">{{
+                countdownText }}</nut-button>
             </template>
           </nut-input>
         </nut-form-item>
       </nut-form>
 
-      <nut-button
-        class="user-binding-btn"
-        :disabled="!authState.code"
-        block
-        type="primary"
-        @click="onAuth"
-        >提交</nut-button
-      >
+      <nut-button class="user-binding-btn" :disabled="!authState.code" block type="primary"
+        @click="onAuth">提交</nut-button>
     </div>
 
     <div class="user-binding-layout user-binding-inputlayout" style="flex: 1" v-else>
       <nut-form>
         <nut-form-item label="手机号码" label-align="left">
-          <nut-input
-            v-model="bindingState.mobile"
-            placeholder="请输入新手机号码"
-            :max-length="11"
-            input-align="right"
-          />
+          <nut-input v-model="bindingState.mobile" placeholder="请输入新手机号码" :max-length="11" input-align="right" />
         </nut-form-item>
         <nut-form-item label="验证码" label-align="left">
-          <nut-input
-            v-model="bindingState.code"
-            placeholder="请输入验证码"
-            :max-length="6"
-            input-align="right"
-          >
+          <nut-input v-model="bindingState.code" placeholder="请输入验证码" :max-length="6" input-align="right">
             <template #right>
-              <nut-button
-                :disabled="countdownActive1"
-                class="user-binding-codebtn"
-                type="default"
-                @click="onBindingCode"
-                >{{ countdownText1 }}</nut-button
-              >
+              <nut-button :disabled="countdownActive1" class="user-binding-codebtn" type="default"
+                @click="onBindingCode">{{ countdownText1 }}</nut-button>
             </template>
           </nut-input>
         </nut-form-item>
       </nut-form>
 
-      <nut-button
-        class="user-binding-btn"
-        :disabled="!bindingState.code || !bindingState.mobile"
-        block
-        type="primary"
-        @click="onBinding"
-        >提交</nut-button
-      >
+      <nut-button class="user-binding-btn" :disabled="!bindingState.code || !bindingState.mobile" block type="primary"
+        @click="onBinding">提交</nut-button>
     </div>
   </div>
 </template>
@@ -100,7 +53,7 @@
 import { ref, reactive, onMounted } from 'vue'
 import { useCountdown } from '../../shared/composables/useCountdown'
 import { useValidator } from '../../shared/composables/useValidator'
-import Taro from '@tarojs/taro'
+import Taro, { showToast } from '@tarojs/taro'
 import { useHttp } from '../api'
 import { useRouter } from '@tarojs/taro'
 
@@ -116,7 +69,7 @@ const current = ref(1)
 
 onMounted(() => {
   if (!params.mobile) {
-    return Taro.showToast({ title: '路径缺少mobile参数', icon: 'none' })
+    return showToast({ title: '路径缺少mobile参数', icon: 'none' })
   }
   authState.mobile = params.mobile
 })
@@ -136,7 +89,7 @@ function onAuth() {
     console.log(res, 'res')
     if (typeof res !== 'boolean') return
 
-    Taro.showToast({ title: '身份认证成功', icon: 'success' })
+    showToast({ title: '身份认证成功', icon: 'success' })
     current.value++
   })
 }
@@ -147,7 +100,7 @@ function onAuthCode() {
   $http.get('/cas/sysAccount/getVerifyCodeToUserMobile').then((res) => {
     if (typeof res !== 'boolean') return
 
-    Taro.showToast({ title: '短信发送成功,请注意查收', icon: 'none' })
+    showToast({ title: '短信发送成功,请注意查收', icon: 'none' })
     startCountdown()
   })
 }
@@ -162,7 +115,7 @@ const bindingState = reactive({
 function onBinding() {
   const msg = phoneValidator(bindingState.mobile)
   if (msg) {
-    return Taro.showToast({ title: msg, icon: 'none' })
+    return showToast({ title: msg, icon: 'none' })
   }
 
   const $http = useHttp()
@@ -175,17 +128,17 @@ function onBinding() {
     .then((res) => {
       if (typeof res !== 'boolean') return
 
-      Taro.showToast({ title: '换绑成功', icon: 'success' })
+      showToast({ title: '换绑成功', icon: 'success' })
       emits('success', bindingState.mobile)
     })
 }
 function onBindingCode() {
   const msg = phoneValidator(bindingState.mobile)
   if (msg) {
-    return Taro.showToast({ title: msg, icon: 'none' })
+    return showToast({ title: msg, icon: 'none' })
   }
   if (params.mobile === bindingState.mobile) {
-    return Taro.showToast({ title: '新手机号码不应与旧手机号码一致', icon: 'none' })
+    return showToast({ title: '新手机号码不应与旧手机号码一致', icon: 'none' })
   }
 
   const $http = useHttp()
@@ -194,7 +147,7 @@ function onBindingCode() {
   $http.get(`/cas/sysAccount/getVerifyCodeToMobile/${bindingState.mobile}`).then((res) => {
     if (typeof res !== 'boolean') return
 
-    Taro.showToast({ title: '短信发送成功,请注意查收', icon: 'none' })
+    showToast({ title: '短信发送成功,请注意查收', icon: 'none' })
     startCountdown1()
   })
 }
@@ -216,6 +169,7 @@ const emits = defineEmits(['success'])
     width: 351px;
     height: 192px;
   }
+
   &-layout {
     position: relative;
     width: 351px;
@@ -224,9 +178,11 @@ const emits = defineEmits(['success'])
     overflow: hidden;
     margin-bottom: 10px;
   }
+
   &-inputlayout {
     padding: 0 10px;
     box-sizing: border-box;
+
     .nut-input {
       height: 40px;
       padding: 0;
@@ -235,14 +191,17 @@ const emits = defineEmits(['success'])
       font-size: 16px;
       padding-left: 3px;
       border-color: #f5f5f5;
+
       .input-text {
         width: 100%;
       }
     }
   }
+
   .nut-placeholder {
     color: #cccccc;
   }
+
   .user-binding-btn {
     position: absolute;
     bottom: 50px;
@@ -253,6 +212,7 @@ const emits = defineEmits(['success'])
     height: 40px;
     line-height: 38px;
   }
+
   .user-binding-codebtn {
     height: 30px;
     font-size: 12px;
@@ -262,42 +222,53 @@ const emits = defineEmits(['success'])
     color: var(--app-primary-color, #017fff);
     background: #f2f2f2;
   }
+
   .user-binding-steps {
     margin-top: 15px;
+
     .nut-step-line {
       background: rgba(220, 220, 220, 1);
       left: 60%;
       right: -40%;
     }
+
     .nut-step-title {
       font-weight: bold;
       color: rgba(0, 0, 0, 0.4);
     }
+
     .nut-step.nut-step-wait .nut-step-icon {
       background: rgba(243, 243, 243, 1);
       border-color: rgba(243, 243, 243, 1);
       color: rgba(0, 0, 0, 0.4);
     }
+
     .nut-step.nut-step-process .nut-step-icon {
       background: var(--app-primary-color, #017fff);
       border-color: var(--app-primary-color, #017fff);
     }
+
     .nut-step.nut-step-process .nut-step-title {
       color: var(--app-primary-color, #017fff);
     }
+
     .nut-step-head {
       margin-bottom: 8px;
     }
+
     .nut-step.nut-step-finish .nut-step-title {
       color: rgba(0, 0, 0, 0.9);
     }
+
     .nut-step.nut-step-finish .nut-step-line {
       background: var(--app-primary-color, #017fff);
     }
+
     .nut-step.nut-step-finish .nut-step-head {
       color: var(--app-primary-color, #017fff);
       border-color: var(--app-primary-color, #017fff);
     }
+
     .nut-step-icon {
       width: 22px;
       height: 22px;

package/src/user/components/UserBindingSuccess.vue

@@ -20,7 +20,7 @@
 <script lang="ts" setup>
 import { onMounted, ref } from 'vue'
 import { useRouter } from '@tarojs/taro'
-import Taro from '@tarojs/taro'
+import Taro, { showToast } from '@tarojs/taro'
 import { useEncode } from '../../shared/composables/useEncode'
 
 const { params } = useRouter()
@@ -28,7 +28,7 @@ const { encodePhone } = useEncode()
 
 onMounted(() => {
   if (!params.mobile) {
-    return Taro.showToast({ title: '路径缺少mobile参数', icon: 'none' })
+    return showToast({ title: '路径缺少mobile参数', icon: 'none' })
   }
 })
 

package/src/user/components/UserFeedback.vue

@@ -5,64 +5,40 @@
         style="width: 311px;height:149.5px;margin: 0 auto;" />
       <div class="user-feedback-tit">补充描述</div>
       <div class="user-feedback-body">
-        <editor
-          id="myEditor"
-          :show-img-resize="true"
-          class="user-feedback-editor"
-          placeholder="请输入补充描述"
-        />
+        <editor id="myEditor" :show-img-resize="true" class="user-feedback-editor" placeholder="请输入补充描述" />
         <div class="user-feedback-handle">
-          <div
-            class="user-feedback-handle-item"
-            v-for="(item, key) in formState.attachment"
-            :key="key"
-          >
+          <div class="user-feedback-handle-item" v-for="(item, key) in formState.attachment" :key="key">
             <template v-if="item.status === 'done'">
-              <img
-                v-if="item.type === 'image'"
-                class="user-feedback-handle-item-img"
-                mode="aspectFit"
-                :src="item.url"
-              />
+              <img v-if="item.type === 'image'" class="user-feedback-handle-item-img" mode="aspectFit"
+                :src="item.url" />
               <video class="user-feedback-handle-item-img" :src="item.url" v-else />
               <div class="user-feedback-handle-item-close" @click="onDelete(key)">
-                <img
-                  class="user-feedback-handle-item-close-img"
-                  src="https://cdn.ddjf.com/static/images/customer-center/close-filled.png"
-                />
+                <img class="user-feedback-handle-item-close-img"
+                  src="https://cdn.ddjf.com/static/images/customer-center/close-filled.png" />
               </div>
             </template>
-            <img
-              class="user-feedback-handle-item-loading"
-              mode="aspectFit"
-              src="https://cdn.ddjf.com/static/images/customer-center/loading.png"
-              alt=""
-            />
+            <img class="user-feedback-handle-item-loading" mode="aspectFit"
+              src="https://cdn.ddjf.com/static/images/customer-center/loading.png" alt="" />
           </div>
           <div class="user-feedback-handle-item" @click="toUpload">+</div>
         </div>
       </div>
 
       <div class="user-feedback-footer">
-        <nut-button class="user-feedback-footer-btn" plain type="primary" @click="onCancel"
-          >最小化</nut-button
-        >
+        <nut-button class="user-feedback-footer-btn" plain type="primary" @click="onCancel">最小化</nut-button>
         <nut-button class="user-feedback-footer-btn" type="primary" @click="onOk">反馈</nut-button>
       </div>
     </div>
     <div class="user-feedback-wrap" v-else>
-      <img
-        class="user-feedback-success-img"
-        mode="aspectFit"
-        src="https://cdn.ddjf.com/static/images/customer-center/success-icon.png"
-      />
+      <img class="user-feedback-success-img" mode="aspectFit"
+        src="https://cdn.ddjf.com/static/images/customer-center/success-icon.png" />
       <div class="user-feedback-success-info">提交成功</div>
     </div>
   </div>
 </template>
 
 <script lang="ts" setup>
-import Taro from '@tarojs/taro'
+import Taro, { showToast, showLoading } from '@tarojs/taro'
 import { onMounted, reactive, ref } from 'vue'
 import { useAppKitOptions } from '../../Appkit'
 import { useHttp } from '../api'
@@ -83,7 +59,7 @@ const props = withDefaults(
     app: '',
     traceIds: '',
     value: null,
-    captureScreen: () => {},
+    captureScreen: () => { },
   }
 )
 
@@ -126,7 +102,7 @@ function initEditor() {
 // 上传图片、视频
 function toUpload() {
   if (formState.attachment.length >= 20) {
-    return Taro.showToast({
+    return showToast({
       title: '最多上传20份附件',
       icon: 'none',
     })
@@ -140,7 +116,7 @@ function toUpload() {
       for (const item of res.tempFiles) {
         if (item.fileType === 'video') {
           if (item.size > 1024 * 1024 * 50) {
-            return Taro.showToast({
+            return showToast({
               title: '视频大小不能超过50M',
               icon: 'none',
             })
@@ -208,7 +184,7 @@ function onOk() {
     success: (res) => {
       const html = res.html
       if (html === '<p><br></p>' || !html) {
-        Taro.showToast({
+        showToast({
           title: '请输入问题描述',
           icon: 'none',
         })
@@ -225,7 +201,7 @@ function requestFeedback() {
   const $http = useHttp()
   const appkitOptions = useAppKitOptions()
 
-  Taro.showLoading({
+  showLoading({
     title: '反馈中...',
   })
 
@@ -257,13 +233,15 @@ function requestFeedback() {
     .then(() => {
       Taro.hideLoading()
       emits('success')
-      // Taro.showToast({ title: '反馈提交成功', icon: 'none' })
-      // Taro.navigateBack()
       isSuccess.value = true
       clearFormState()
     })
     .catch(() => {
       Taro.hideLoading()
+      showToast({
+        title: '反馈提交失败',
+        icon: 'none',
+      })
     })
 }
 
@@ -284,15 +262,18 @@ const emits = defineEmits(['minimize', 'success'])
   min-height: 100vh;
   box-sizing: border-box;
   overflow: hidden;
+
   &.isSuccess {
     margin: 0;
     padding: 0;
     height: 100%;
+
     .user-feedback-wrap {
       height: 100vh;
       align-items: center;
     }
   }
+
   &-wrap {
     min-height: calc(100vh - calc(75px + env(safe-area-inset-bottom, 0px)));
     height: 100%;
@@ -303,17 +284,20 @@ const emits = defineEmits(['minimize', 'success'])
     padding: 10px;
     border-radius: 5px;
   }
+
   &-head {
     background: #f2f9ff;
     padding: 15px;
     border-radius: 2px;
     font-size: 12px;
     margin-bottom: 8px;
+
     &-info {
       padding-left: 9px;
       text-indent: -9px;
     }
   }
+
   &-tit {
     height: 44px;
     display: flex;
@@ -322,12 +306,14 @@ const emits = defineEmits(['minimize', 'success'])
     font-weight: 500;
     font-size: 17px;
   }
+
   &-body {
     border-radius: 4px 4px 0px 0px;
     display: flex;
     flex-direction: column;
     overflow: hidden;
   }
+
   &-editor {
     padding: 10px;
     font-size: 14px;
@@ -335,12 +321,14 @@ const emits = defineEmits(['minimize', 'success'])
     overflow-y: auto;
     min-height: 165px;
   }
+
   &-handle {
     display: flex;
     align-items: center;
     flex-wrap: wrap;
     margin-top: 10px;
     margin-right: -4px;
+
     &-item {
       position: relative;
       border-radius: 2px;
@@ -354,10 +342,12 @@ const emits = defineEmits(['minimize', 'success'])
       color: rgba(53, 53, 53, 0.3);
       margin-right: 4px;
       margin-bottom: 4px;
+
       &-img {
         max-width: 100%;
         max-height: 100%;
       }
+
       &-close {
         position: absolute;
         top: -2px;
@@ -367,11 +357,13 @@ const emits = defineEmits(['minimize', 'success'])
         display: flex;
         justify-content: center;
         align-items: center;
+
         &-img {
           width: 10px;
           height: 10px;
         }
       }
+
       &-loading {
         width: 17px;
         height: 17px;
@@ -379,6 +371,7 @@ const emits = defineEmits(['minimize', 'success'])
       }
     }
   }
+
   .ql-editor.ql-blank:before {
     color: rgba(0, 0, 0, 0.3);
     font-style: normal;
@@ -397,8 +390,10 @@ const emits = defineEmits(['minimize', 'success'])
     display: flex;
     justify-content: space-between;
     box-sizing: border-box;
+
     &-btn {
       flex: 1;
+
       &:first-child {
         margin-right: 10px;
       }
@@ -412,6 +407,7 @@ const emits = defineEmits(['minimize', 'success'])
       margin-top: 110px;
       margin-bottom: 20px;
     }
+
     &-info {
       color: #353535;
       font-size: 16px;
@@ -423,6 +419,7 @@ const emits = defineEmits(['minimize', 'success'])
     from {
       transform: rotate(0);
     }
+
     to {
       transform: rotate(360deg);
     }