@uxda/appkit 4.0.14 → 4.0.18

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@uxda/appkit",
-  "version": "4.0.14",
+  "version": "4.0.18",
   "description": "小程序应用开发包",
   "main": "dist/index.js",
   "module": "dist/index.ts",

package/src/balance/components/DateRange.vue

@@ -1,6 +1,6 @@
 <template>
   <div class="date-range" @click="openDateRangePicker">
-    <div class="text number">{{ dateRangeDisplay }}</div>
+    <div class="text">{{ dateRangeDisplay }}</div>
     <img
       style="margin-top: -2px"
       class="time-icon"
@@ -51,7 +51,7 @@ const openDateRangePicker = () => {
 const dateRangeDisplay = computed(() => {
   let startTime = (model.value.from || '').replace(/-/g, '.').substring(2)
   let endTime = (model.value.to || '').replace(/-/g, '.').substring(2)
-  return startTime + ' - ' + endTime
+  return startTime + '-' + endTime
 })
 
 </script>

package/src/shared/components/AppVerify.vue

@@ -3,78 +3,84 @@
     <h2>{{ title || '手机号验证' }}</h2>
     <p class="caption">{{ message || '短信将发送至账号绑定手机号' }}</p>
     <p class="number">{{ phone }}</p>
-    <ns-form v-model="formData">
+    <ns-form v-model="formData" class="form">
       <ns-input
+        class="form-input"
         name="code"
         v-model="formData.code"
         placeholder="请输入验证码"
+        maxlength="6"
         variant="solid"
         :rules="['required', {
-        name: 'function',
-        message: '输入错误, 请重新输入',
-        method: (value: string) => value.length === 6,
-      }]"
+          name: 'function',
+          message: '输入错误, 请重新输入',
+          method: (value: string) => value.length === 6,
+          }]"
       >
-        <template #append>
-          <ns-button
-            v-if="!sent"
-            size="xs"
-            variant="plain"
-            color="primary"
-            @click="send"
-            label="获取验证码"
-          />
-          <div class="caption" v-if="sent">{{ countdown }} 秒收重新发送</div>
-        </template>
       </ns-input>
+      <div class="form-btn">
+        <ns-button
+          v-if="!sent"
+          size="xs"
+          variant="plain"
+          color="primary"
+          @click="send"
+          label="获取验证码"
+        />
+        <div class="caption" v-if="sent">{{ countdown }}s后重新发送</div>
+      </div>
     </ns-form>
     <div class="row buttons">
-      <ns-button round @click="emits('cancel')">取消</ns-button>
-      <ns-button round gradient="#FFEBC1,#FFD7A7,#FFB875/90" @click="onOk">确认</ns-button>
+      <ns-button class="cancel-btn" round @click="emits('cancel')"
+        >取消</ns-button
+      >
+      <ns-button round gradient="#FFEBC1,#FFD7A7,#FFB875/90" @click="onOk"
+        >确认</ns-button
+      >
     </div>
   </div>
 </template>
 
 <script lang="ts" setup>
-import { NsForm, NsInput, NsButton } from '@uxda/nutshell/taro'
-import { reactive, ref } from 'vue'
+import { NsForm, NsInput, NsButton } from '@uxda/nutshell/taro';
+import { reactive, ref } from 'vue';
 
 export interface AppVerifyProps {
-  phone: string
-  title?: string
-  message?: string
-  onSend?: Function
+  phone: string;
+  title?: string;
+  message?: string;
+  onSend?: Function;
 }
 
-const emits = defineEmits(['complete', 'cancel'])
+const emits = defineEmits(['complete', 'cancel']);
 
 const sent = ref(false),
-  countdown = ref(60)
+  countdown = ref(60);
 
 let formData = reactive({
   code: '',
-})
+});
 
 const send = () => {
-  sent.value = true
+  sent.value = true;
 
-  props.onSend && props.onSend()
+  props.onSend && props.onSend();
 
-  countdown.value = 60
+  countdown.value = 60;
   let timer = setInterval(() => {
-    countdown.value--
+    countdown.value--;
     if (countdown.value <= 0) {
-      clearInterval(timer)
-      sent.value = false
+      clearInterval(timer);
+      sent.value = false;
     }
-  }, 1000)
-}
+  }, 1000);
+};
 
 const onOk = () => {
-  emits('complete', { code: formData.code })
-}
+  emits('complete', { code: formData.code });
+};
 
-const props = defineProps<AppVerifyProps>()
+const props = defineProps<AppVerifyProps>();
 </script>
 
 <style lang="scss">
@@ -86,13 +92,38 @@ const props = defineProps<AppVerifyProps>()
     margin: 10px;
   }
   .caption {
-    font-size: 14px;
-    color: #666;
+    font-size: 10px !important;
+    color: #ccc;
+    line-height: 21px;
+  }
+  .number {
+    line-height: 21px;
+  }
+  .form .nut-cell-group__wrap {
+    display: flex;
+    align-items: center;
+    margin: 20px 0 !important;
+    .form-input {
+      height: 36px;
+      line-height: 36px;
+      border: none;
+      background: #f5f5f5;
+      border-radius: 5px;
+      flex: 1;
+      padding-left: 12px;
+    }
+    .form-btn {
+      margin-left: 12px;
+      width: 90px;
+    }
   }
   .buttons {
     .ns-button {
       width: 104px;
     }
+    .cancel-btn {
+      border: 1px solid #969696 !important;
+    }
   }
 }
 </style>

package/src/shared/components/OcrBusinessLicense.vue

@@ -0,0 +1,115 @@
+<template>
+  <div class="ocr-icon" @click="onIconClick">
+    <ns-icon name="https://simple.shensi.tech/icons/ocr.svg" />
+  </div>
+</template>
+
+<script lang="ts" setup>
+import Taro from '@tarojs/taro';
+import { NsIcon } from '@uxda/nutshell/taro';
+import { useAppKitOptions } from '../../Appkit';
+
+const appKitOptions = useAppKitOptions();
+
+const emits = defineEmits(['complete']);
+
+export type OcrResult = {
+  companyName: string;
+  idCardNo: string;
+  legalPersonName: string;
+};
+
+async function taroImgCompress(src: string, quality = 80) {
+  return new Promise((resolve, reject) => {
+    Taro.compressImage({
+      src: src,
+      quality: quality,
+      success: (res) => {
+        resolve(res);
+      },
+      fail: (res) => {
+        reject(res);
+      },
+    });
+  });
+}
+
+function getCompressQuality(size: number) {
+  let quality = 100;
+  const curSize = size / (1024 * 1024);
+  if (curSize > 6) {
+    quality = quality - ((curSize - 6) / curSize) * 100;
+  }
+  return quality;
+}
+
+function allTrim(str: string) {
+  return str.replace(/\s+/g, '');
+}
+
+async function onIconClick() {
+  console.log('===onIconClick');
+  let result: OcrResult | null = null;
+  try {
+    const csRes = await Taro.chooseImage({
+      count: 1,
+    });
+    let { path, size } = csRes.tempFiles[0];
+    const compressImg: any =
+      (await taroImgCompress(path, getCompressQuality(size))) || {};
+    const filePath = compressImg.tempFilePath || path;
+    Taro.showLoading({ title: '营业执照识别中..' });
+    const session = appKitOptions.token();
+    const baseUrl = appKitOptions.baseUrl();
+    const upRes: any = await Taro.uploadFile({
+      url: baseUrl + '/promoact/common/parseBusinessLicense',
+      filePath,
+      name: 'file',
+      formData: {
+        objectNo: `min${Date.now()}`,
+      },
+      header: {
+        sessionKey: session || '',
+        token: session || '',
+      },
+    });
+    Taro.hideLoading();
+    const res = JSON.parse(upRes.data);
+    if (res.code === '200') {
+      const faceInfo = res.result || {};
+      result = {
+        companyName: allTrim(faceInfo.companyName || ''),
+        idCardNo: allTrim(faceInfo.idCardNo || ''),
+        legalPersonName: allTrim(faceInfo.legalPersonName || ''),
+        fileId: faceInfo.fileId,
+        originalUrl: faceInfo.originalUrl,
+        downloadUrl: faceInfo.downloadUrl,
+      };
+      console.log('===识别', result);
+      if (!result.companyName && !result.idCardNo) {
+        Taro.showToast({ title: '识别失败，请重试', icon: 'none' });
+      }
+    } else {
+      Taro.showToast({
+        title: res.msg,
+        icon: 'error',
+      });
+    }
+  } catch (err) {
+    Taro.hideLoading();
+    console.log(err);
+  }
+  emits('complete', result);
+}
+</script>
+
+<style lang="scss">
+.ocr-icon {
+  width: 24px;
+  height: 24px;
+  .ns-icon {
+    width: 24px;
+    height: 24px;
+  }
+}
+</style>

package/src/shared/components/index.ts

@@ -3,5 +3,6 @@ import PageHeader from './PageHeader.vue'
 import AppVerify from './AppVerify.vue'
 import DeviceVersion from './DeviceVersion.vue'
 import OcrIcon from './OcrIcon.vue'
+import OcrBusinessLicense from './OcrBusinessLicense.vue'
 
-export { AppDrawer, PageHeader, DeviceVersion, AppVerify, OcrIcon }
+export { AppDrawer, PageHeader, DeviceVersion, AppVerify, OcrIcon, OcrBusinessLicense }

package/src/shared/composables/useUpload.ts

@@ -7,7 +7,7 @@ export type UploadConfig = {
   headers?: Record<string, string>
 }
 
-const mappings = {
+const mappings: {[x: string]: keyof Media} = {
   downloadUrl: 'thrumb',
   fileId: 'id',
   fileName: 'name',