fix: shortpassword 键盘弹起优化

src/packages/__VUE/shortpassword/index.scss

@@ -29,16 +29,36 @@
     height: 41px;
     border-radius: 4px;
   }
-  input {
+  .nut-input-real {
+    position: absolute;
+    right: 247px;
+    width: 247px;
+    height: 41px;
+  }
+}
+.nut-input-normalw {
+  padding: 0px 0 10px 0;
+  text-align: center;
+  position: relative;
+  overflow: hidden;
+  .nut-input-site {
     width: 247px;
     height: 41px;
     border-radius: 4px;
   }
   .nut-input-real {
-    padding: 0 12px;
-    opacity: 0;
+    padding: 0 1200px 0 0;
+    width: 0;
+    position: absolute;
+    right: 0;
+    width: 247px;
+    height: 41px;
+  }
+  .nut-shortpsd-fake {
+    top: 5%;
   }
 }
+
 .nut-input-real-taro {
   width: 0;
   padding: 0 12px;
@@ -62,7 +82,7 @@
   position: absolute;
   left: 0;
   top: 29%;
-  z-index: 0;
+  z-index: 10;
 }
 
 .nut-shortpsd-li {

src/packages/__VUE/shortpassword/index.taro.vue

@@ -15,6 +15,7 @@
       <view class="nut-shortpsd-title">{{ title }}</view>
       <view class="nut-shortpsdWx-subtitle">{{ desc }}</view>
       <input
+        v-if="isWx"
         class="nut-input-real-taro"
         type="number"
         :maxlength="length"
@@ -22,6 +23,15 @@
         @input="changeValue"
       />
       <view class="nut-input-w">
+        <input
+          v-if="!isWx"
+          ref="realpwd"
+          class="nut-input-real"
+          type="number"
+          maxlength="6"
+          v-model="realInput"
+          @input="changeValue"
+        />
         <view class="nut-input-site"></view>
         <view class="nut-shortpsd-fake" @click="focus">
           <view
@@ -109,15 +119,19 @@ export default create({
     const realpwd = ref();
     const comLen = computed(() => range(Number(props.length)));
     const show = ref(props.visible);
+    const isWx = ref(false); // 判断是否为微信端
     // 方法
     function sureClick() {
       emit('ok', realInput.value);
     }
     function focus() {
-      let a = document.getElementsByClassName('nut-input-real-taro')[0] as any;
-      let h = a.children[0];
-      a.focus();
-      if (h) {
+      let a: any = '';
+      if (isWx.value) {
+        a = document.getElementsByClassName('nut-input-real-taro')[0] as any;
+        a.focus();
+      } else {
+        a = document.getElementsByClassName('nut-input-real')[0] as any;
+        let h = a.children[0];
         h.focus();
       }
     }
@@ -156,6 +170,13 @@ export default create({
     }
     onMounted(() => {
       eventCenter.once((getCurrentInstance() as any).router.onReady, () => {});
+      console.log(Taro.getEnv());
+
+      if (Taro.getEnv() === 'WEB') {
+        isWx.value = false;
+      } else {
+        isWx.value = true;
+      }
     });
     return {
       comLen,
@@ -168,7 +189,8 @@ export default create({
       onTips,
       focus,
       show,
-      closeIcon
+      closeIcon,
+      isWx
     };
   }
 });

src/packages/__VUE/shortpassword/index.vue

@@ -14,7 +14,8 @@
     >
       <view class="nut-shortpsd-title">{{ title }}</view>
       <view class="nut-shortpsd-subtitle">{{ desc }}</view>
-      <view class="nut-input-w">
+
+      <div class="nut-input-normalw">
         <input
           ref="realpwd"
           class="nut-input-real"
@@ -23,6 +24,7 @@
           v-model="realInput"
           @input="changeValue"
         />
+        <div class="nut-input-site"></div>
         <view class="nut-shortpsd-fake" @click="focus">
           <view
             class="nut-shortpsd-li"
@@ -35,7 +37,7 @@
             ></view>
           </view>
         </view>
-      </view>
+      </div>
       <view class="nut-shortpsd-message">
         <view class="nut-shortpsd-error">{{ errorMsg }}</view>
         <view class="nut-shortpsd-forget" v-if="tips">