@uxda/appkit 4.0.0 → 4.0.2

package/src/components/dd-selector/index.vue

@@ -1,124 +1,124 @@
-<!--* NAME: index-->
-<!--* AUTHOR: yanglong-->
-<!--* UPDATE: 2022-02-23 09:33-->
-<!--* TIP: 微信原生实现单列选择器-->
-<script setup lang="ts">
-import { computed, ref, watch } from 'vue'
-import DdIcon from '../dd-icon/index.vue'
-
-interface Option {
-  label?: string
-  value?: string
-}
-interface PropsType {
-  value?: string
-  options?: Option[]
-  placeholder?: string
-  rightIcon?: boolean
-  disabled?: boolean
-}
-
-const props = withDefaults(defineProps<PropsType>(), {
-  value: '',
-  options: () => [],
-  placeholder: '请选择',
-  rightIcon: true,
-  disabled: false,
-})
-
-const currentIndex = ref<number>()
-const currentLabel = ref<string>()
-
-const emit = defineEmits(['update:value', 'change', 'cancel'])
-function onChange(e) {
-  const index = e.detail.value as number
-  const item = props.options[index]
-  if (item === void 0) return
-  currentIndex.value = index
-  currentLabel.value = item.label
-  emit('update:value', item.value)
-  emit('change', item)
-}
-
-// 通过value查询item index
-function findIndexByValue(value: string) {
-  if (value == undefined) return undefined
-  const index = props.options.findIndex((item: Option) => item.value == value)
-  return index >= 0 ? index : undefined
-}
-
-function onCancel(e) {
-  emit('cancel', e)
-}
-
-watch(
-  () => props,
-  () => {
-    init()
-  },
-  {
-    deep: true,
-    immediate: true,
-  }
-)
-
-function init() {
-  currentIndex.value = findIndexByValue(props.value)
-  currentLabel.value =
-    currentIndex.value >= 0 ? (props.options[currentIndex.value] || {}).label : ''
-}
-</script>
-
-<template>
-  <picker
-    mode="selector"
-    :range="props.options"
-    range-key="label"
-    :value="currentIndex"
-    @cancel="onCancel"
-    @change="onChange"
-    style="flex: 1"
-    :disabled="props.disabled"
-  >
-    <slot name="content">
-      <div class="dd-selector">
-        <div class="dd-selector-value">
-          <div
-            :class="
-              currentIndex >= 0 && !props.disabled ? 'dd-selector-value' : 'dd-selector-label'
-            "
-          >
-            {{ currentLabel || props.placeholder }}
-          </div>
-          <div>
-            <slot name="tips"></slot>
-          </div>
-        </div>
-        <slot name="icon">
-          <DdIcon
-            v-if="props.rightIcon"
-            name="icon-arrow"
-            size="11px"
-            :color="currentIndex >= 0 && !props.disabled ? '#353535' : '#DFDFDF'"
-            class="icon-arrow"
-          />
-        </slot>
-      </div>
-    </slot>
-  </picker>
-</template>
-
-<style lang="scss">
-.dd-selector {
-  display: flex;
-  justify-content: flex-end;
-  align-items: center;
-  &-value {
-    text-align: right;
-    color: black;
-  }
-  &-label {
-    color: var(--placeholder-color);
-  }
-}
-</style>
+<!--* NAME: index-->
+<!--* AUTHOR: yanglong-->
+<!--* UPDATE: 2022-02-23 09:33-->
+<!--* TIP: 微信原生实现单列选择器-->
+<script setup lang="ts">
+import { computed, ref, watch } from 'vue'
+import DdIcon from '../dd-icon/index.vue'
+
+interface Option {
+  label?: string
+  value?: string
+}
+interface PropsType {
+  value?: string
+  options?: Option[]
+  placeholder?: string
+  rightIcon?: boolean
+  disabled?: boolean
+}
+
+const props = withDefaults(defineProps<PropsType>(), {
+  value: '',
+  options: () => [],
+  placeholder: '请选择',
+  rightIcon: true,
+  disabled: false,
+})
+
+const currentIndex = ref<number>()
+const currentLabel = ref<string>()
+
+const emit = defineEmits(['update:value', 'change', 'cancel'])
+function onChange(e) {
+  const index = e.detail.value as number
+  const item = props.options[index]
+  if (item === void 0) return
+  currentIndex.value = index
+  currentLabel.value = item.label
+  emit('update:value', item.value)
+  emit('change', item)
+}
+
+// 通过value查询item index
+function findIndexByValue(value: string) {
+  if (value == undefined) return undefined
+  const index = props.options.findIndex((item: Option) => item.value == value)
+  return index >= 0 ? index : undefined
+}
+
+function onCancel(e) {
+  emit('cancel', e)
+}
+
+watch(
+  () => props,
+  () => {
+    init()
+  },
+  {
+    deep: true,
+    immediate: true,
+  }
+)
+
+function init() {
+  currentIndex.value = findIndexByValue(props.value)
+  currentLabel.value =
+    currentIndex.value >= 0 ? (props.options[currentIndex.value] || {}).label : ''
+}
+</script>
+
+<template>
+  <picker
+    mode="selector"
+    :range="props.options"
+    range-key="label"
+    :value="currentIndex"
+    @cancel="onCancel"
+    @change="onChange"
+    style="flex: 1"
+    :disabled="props.disabled"
+  >
+    <slot name="content">
+      <div class="dd-selector">
+        <div class="dd-selector-value">
+          <div
+            :class="
+              currentIndex >= 0 && !props.disabled ? 'dd-selector-value' : 'dd-selector-label'
+            "
+          >
+            {{ currentLabel || props.placeholder }}
+          </div>
+          <div>
+            <slot name="tips"></slot>
+          </div>
+        </div>
+        <slot name="icon">
+          <DdIcon
+            v-if="props.rightIcon"
+            name="icon-arrow"
+            size="11px"
+            :color="currentIndex >= 0 && !props.disabled ? '#353535' : '#DFDFDF'"
+            class="icon-arrow"
+          />
+        </slot>
+      </div>
+    </slot>
+  </picker>
+</template>
+
+<style lang="scss">
+.dd-selector {
+  display: flex;
+  justify-content: flex-end;
+  align-items: center;
+  &-value {
+    text-align: right;
+    color: black;
+  }
+  &-label {
+    color: var(--placeholder-color);
+  }
+}
+</style>

package/src/components/dd-skeleton/doc.md

@@ -0,0 +1,19 @@
+# ddSkeleton 骨架屏
+
+#
+## 使用
+
+``` javascript
+import ddSkeleton from '~/components/ddSkeleton/index.vue'
+```
+``` html
+<dd-skeleton @onSuccess="onSuccess" />
+```
+
+## Prop
+
+| 字段       | 说明        | 类型    | 默认值   |
+|-----------|-------------|---------|----------|
+| row       | 大骨架个数     | number  | 3    |
+| shortRow   | 短骨架的行数    | string  | 2     |
+| longRow    | 长骨架的行数    | string  | 3     |

package/src/components/dd-skeleton/index.vue

@@ -0,0 +1,36 @@
+<script setup lang="ts">
+interface PropType {
+  row?: number
+  shortRow?: string
+  longRow?: string
+}
+
+withDefaults(defineProps<PropType>(), {
+  row: 3,
+  shortRow: '2',
+  longRow: '4',
+})
+</script>
+
+<template>
+  <div class="dd-skeleton">
+    <div class="dd-skeleton__item" v-for="(item, key) in row" :key="key">
+      <nut-skeleton
+        width="40%"
+        height="15px"
+        animated
+        v-if="Number(shortRow) > 0"
+        :row="shortRow"
+      ></nut-skeleton>
+      <nut-skeleton width="100%" height="15px" title animated :row="longRow"></nut-skeleton>
+    </div>
+  </div>
+</template>
+
+<style lang="scss">
+.dd-skeleton {
+  &__item {
+    margin-top: 10px;
+  }
+}
+</style>

package/src/components/ocr-id/index.vue

@@ -1,114 +1,114 @@
-<script setup lang="ts">
-import Taro from '@tarojs/taro'
-import { OcrResultType } from './types'
-import { useAppKitOptions } from '../../Appkit'
-
-const emits = defineEmits(['ocr'])
-
-const appKitOptions = useAppKitOptions()
-
-// 压缩图片
-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 ocrIDCard() {
-  let ocrResult: OcrResultType = 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 + '/hkapprove/ocr/idcard',
-      filePath,
-      name: 'file',
-      formData: {
-        objectNo: `min${Date.now()}`,
-        side: 'face',
-      },
-      header: {
-        sessionKey: session || '',
-        token: session || '',
-      },
-    })
-    Taro.hideLoading()
-    const res = JSON.parse(upRes.data)
-    if (res.code === '200') {
-      const faceInfo = res.result.faceInfo || {}
-      ocrResult = {
-        faceInfo: {
-          name: allTrim(faceInfo.name || ''),
-          certNo: allTrim(faceInfo.num || ''),
-          address: allTrim(faceInfo.address || ''),
-        },
-        fileUploadVO: res.result.fileUploadVO || {},
-      }
-      if (!ocrResult.faceInfo.name && !ocrResult.faceInfo.certNo) {
-        Taro.showToast({ title: '识别失败，请重试', icon: 'none' })
-      }
-    } else {
-      Taro.showToast({
-        title: res.msg,
-        icon: 'error',
-      })
-    }
-  } catch (err) {
-    Taro.hideLoading()
-    console.log(err)
-  }
-  emits('ocr', ocrResult)
-}
-</script>
-
-<template>
-  <div class="ocr-id" @click="ocrIDCard">
-    <slot name="icon">
-      <img
-        class="ocr-id__img"
-        src="data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSI0MCIgaGVpZ2h0PSI0MCIgZmlsbD0ibm9uZSI+PHBhdGggb3BhY2l0eT0iLjAxIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGNsaXAtcnVsZT0iZXZlbm9kZCIgZD0iTTQwIDB2NDBIMFYwaDQweiIgZmlsbD0iI0M0QzRDNCIvPjxwYXRoIGZpbGwtcnVsZT0iZXZlbm9kZCIgY2xpcC1ydWxlPSJldmVub2RkIiBkPSJNMzMuMDQ0IDE3LjM2M2MuOTYgMCAxLjczOS0uNzkgMS43MzktMS43NjYgMC0uOTc1LS43NzktMS43NjYtMS43NC0xLjc2Ni0uOTYgMC0xLjczOC43OS0xLjczOCAxLjc2NnMuNzc4IDEuNzY2IDEuNzM5IDEuNzY2eiIgZmlsbD0iIzRCQ0I5MyIvPjxwYXRoIGZpbGwtcnVsZT0iZXZlbm9kZCIgY2xpcC1ydWxlPSJldmVub2RkIiBkPSJNMCAzMS44MTJWMTQuNzg4YzAtMi4yNTggMi4wNDktNC4wOTcgNC41NjQtNC4wOTdoMy44NDRsMS4xMzYtMy42NThDOS44ODggNS45MTMgMTEuMjM3IDUgMTIuNTQ4IDVIMjcuNDVjMS4zOSAwIDIuNjguODc2IDMuMDEgMi4wNDRsMS4xMzMgMy42NDdoMy44NDRjMi41MTUgMCA0LjU2NCAxLjgzOSA0LjU2NCA0LjA5N3YxLjczOWMwIC41MDMtLjQ1NC45MS0xLjAxNC45MXMtMS4wMTQtLjQwNy0xLjAxNC0uOTF2LTEuNzRjMC0xLjI1My0xLjEzOS0yLjI3NS0yLjUzNi0yLjI3NWgtMy44NDRjLS45MDcgMC0xLjcxMS0uNTQ5LTEuOTU1LTEuMzMybC0xLjEzNi0zLjY2YS4zNDIuMzQyIDAgMCAwLS4wMDctLjAyNWMtLjExLS4zOTYtLjYzOS0uNjc0LTEuMDQ1LS42NzRoLTE0LjljLS4zOTkgMC0uOTUuMzY2LTEuMDUzLjY5OWwtMS4xMzYgMy42NmMtLjI0Ny43ODYtMS4wNDUgMS4zMy0xLjk1NSAxLjMzMkg0LjU2NGMtMS4zOTcgMC0yLjUzNiAxLjAyMi0yLjUzNiAyLjI3NnYxNy4wMjRjMCAxLjI1NCAxLjEzOSAyLjI3NiAyLjUzNiAyLjI3NmgzMC44N2MxLjM5NyAwIDIuNTM1LTEuMDIyIDIuNTM1LTIuMjc2VjIxLjU5NmMwLS41MDMuNDU0LS45MSAxLjAxNC0uOTFzMS4wMTUuNDA3IDEuMDE1LjkxVjMxLjgxYy0uMDAzIDIuMjYtMi4wNSA0LjEtNC41NjcgNC4xSDQuNTY0QzIuMDQ5IDM1LjkxIDAgMzQuMDcgMCAzMS44MTF6IiBmaWxsPSIjNEJDQjkzIi8+PHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik0xMi4xNzQgMjEuNzc4YzAtNC44NyAzLjcwNS04LjgzIDguMjYtOC44MyA0LjU1NiAwIDguMjYyIDMuOTYgOC4yNjIgOC44M3MtMy43MDYgOC44MzItOC4yNjEgOC44MzJjLTQuNTU2IDAtOC4yNjEtMy45NjItOC4yNjEtOC44MzJ6bTEuNzc5LjEzYzAgMy43OTYgMi45MDcgNi44ODMgNi40ODIgNi44ODMgMy41NzQgMCA2LjQ4MS0zLjA4NyA2LjQ4MS02Ljg4M3MtMi45MDctNi44ODMtNi40ODItNi44ODNjLTMuNTc0IDAtNi40ODEgMy4wODctNi40ODEgNi44ODN6IiBmaWxsPSIjNEJDQjkzIi8+PC9zdmc+"
-      />
-    </slot>
-  </div>
-</template>
-
-<style lang="scss">
-.ocr-id {
-  &__img {
-    width: 20px;
-    height: 20px;
-  }
-}
-</style>
+<script setup lang="ts">
+import Taro from '@tarojs/taro'
+import { OcrResultType } from './types'
+import { useAppKitOptions } from '../../Appkit'
+
+const emits = defineEmits(['ocr'])
+
+const appKitOptions = useAppKitOptions()
+
+// 压缩图片
+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 ocrIDCard() {
+  let ocrResult: OcrResultType = 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 + '/hkapprove/ocr/idcard',
+      filePath,
+      name: 'file',
+      formData: {
+        objectNo: `min${Date.now()}`,
+        side: 'face',
+      },
+      header: {
+        sessionKey: session || '',
+        token: session || '',
+      },
+    })
+    Taro.hideLoading()
+    const res = JSON.parse(upRes.data)
+    if (res.code === '200') {
+      const faceInfo = res.result.faceInfo || {}
+      ocrResult = {
+        faceInfo: {
+          name: allTrim(faceInfo.name || ''),
+          certNo: allTrim(faceInfo.num || ''),
+          address: allTrim(faceInfo.address || ''),
+        },
+        fileUploadVO: res.result.fileUploadVO || {},
+      }
+      if (!ocrResult.faceInfo.name && !ocrResult.faceInfo.certNo) {
+        Taro.showToast({ title: '识别失败，请重试', icon: 'none' })
+      }
+    } else {
+      Taro.showToast({
+        title: res.msg,
+        icon: 'error',
+      })
+    }
+  } catch (err) {
+    Taro.hideLoading()
+    console.log(err)
+  }
+  emits('ocr', ocrResult)
+}
+</script>
+
+<template>
+  <div class="ocr-id" @click="ocrIDCard">
+    <slot name="icon">
+      <img
+        class="ocr-id__img"
+        src="data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSI0MCIgaGVpZ2h0PSI0MCIgZmlsbD0ibm9uZSI+PHBhdGggb3BhY2l0eT0iLjAxIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGNsaXAtcnVsZT0iZXZlbm9kZCIgZD0iTTQwIDB2NDBIMFYwaDQweiIgZmlsbD0iI0M0QzRDNCIvPjxwYXRoIGZpbGwtcnVsZT0iZXZlbm9kZCIgY2xpcC1ydWxlPSJldmVub2RkIiBkPSJNMzMuMDQ0IDE3LjM2M2MuOTYgMCAxLjczOS0uNzkgMS43MzktMS43NjYgMC0uOTc1LS43NzktMS43NjYtMS43NC0xLjc2Ni0uOTYgMC0xLjczOC43OS0xLjczOCAxLjc2NnMuNzc4IDEuNzY2IDEuNzM5IDEuNzY2eiIgZmlsbD0iIzRCQ0I5MyIvPjxwYXRoIGZpbGwtcnVsZT0iZXZlbm9kZCIgY2xpcC1ydWxlPSJldmVub2RkIiBkPSJNMCAzMS44MTJWMTQuNzg4YzAtMi4yNTggMi4wNDktNC4wOTcgNC41NjQtNC4wOTdoMy44NDRsMS4xMzYtMy42NThDOS44ODggNS45MTMgMTEuMjM3IDUgMTIuNTQ4IDVIMjcuNDVjMS4zOSAwIDIuNjguODc2IDMuMDEgMi4wNDRsMS4xMzMgMy42NDdoMy44NDRjMi41MTUgMCA0LjU2NCAxLjgzOSA0LjU2NCA0LjA5N3YxLjczOWMwIC41MDMtLjQ1NC45MS0xLjAxNC45MXMtMS4wMTQtLjQwNy0xLjAxNC0uOTF2LTEuNzRjMC0xLjI1My0xLjEzOS0yLjI3NS0yLjUzNi0yLjI3NWgtMy44NDRjLS45MDcgMC0xLjcxMS0uNTQ5LTEuOTU1LTEuMzMybC0xLjEzNi0zLjY2YS4zNDIuMzQyIDAgMCAwLS4wMDctLjAyNWMtLjExLS4zOTYtLjYzOS0uNjc0LTEuMDQ1LS42NzRoLTE0LjljLS4zOTkgMC0uOTUuMzY2LTEuMDUzLjY5OWwtMS4xMzYgMy42NmMtLjI0Ny43ODYtMS4wNDUgMS4zMy0xLjk1NSAxLjMzMkg0LjU2NGMtMS4zOTcgMC0yLjUzNiAxLjAyMi0yLjUzNiAyLjI3NnYxNy4wMjRjMCAxLjI1NCAxLjEzOSAyLjI3NiAyLjUzNiAyLjI3NmgzMC44N2MxLjM5NyAwIDIuNTM1LTEuMDIyIDIuNTM1LTIuMjc2VjIxLjU5NmMwLS41MDMuNDU0LS45MSAxLjAxNC0uOTFzMS4wMTUuNDA3IDEuMDE1LjkxVjMxLjgxYy0uMDAzIDIuMjYtMi4wNSA0LjEtNC41NjcgNC4xSDQuNTY0QzIuMDQ5IDM1LjkxIDAgMzQuMDcgMCAzMS44MTF6IiBmaWxsPSIjNEJDQjkzIi8+PHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik0xMi4xNzQgMjEuNzc4YzAtNC44NyAzLjcwNS04LjgzIDguMjYtOC44MyA0LjU1NiAwIDguMjYyIDMuOTYgOC4yNjIgOC44M3MtMy43MDYgOC44MzItOC4yNjEgOC44MzJjLTQuNTU2IDAtOC4yNjEtMy45NjItOC4yNjEtOC44MzJ6bTEuNzc5LjEzYzAgMy43OTYgMi45MDcgNi44ODMgNi40ODIgNi44ODMgMy41NzQgMCA2LjQ4MS0zLjA4NyA2LjQ4MS02Ljg4M3MtMi45MDctNi44ODMtNi40ODItNi44ODNjLTMuNTc0IDAtNi40ODEgMy4wODctNi40ODEgNi44ODN6IiBmaWxsPSIjNEJDQjkzIi8+PC9zdmc+"
+      />
+    </slot>
+  </div>
+</template>
+
+<style lang="scss">
+.ocr-id {
+  &__img {
+    width: 20px;
+    height: 20px;
+  }
+}
+</style>

package/src/components/ocr-id/types.d.ts

@@ -1,13 +1,13 @@
-export type OcrResultType = {
-  faceInfo: {
-    name: string
-    certNo: string
-    address: string
-  }
-  fileUploadVO: {
-    fileKey: string
-    fileUrl: string
-    objectNo: string
-    thumbnailUrl?: string
-  }
+export type OcrResultType = {
+  faceInfo: {
+    name: string
+    certNo: string
+    address: string
+  }
+  fileUploadVO: {
+    fileKey: string
+    fileUrl: string
+    objectNo: string
+    thumbnailUrl?: string
+  }
 } | null

package/src/global.ts

@@ -1,7 +1,7 @@
-const globalData: any = {
-
-}
-
-export {
-  globalData
+const globalData: any = {
+
+}
+
+export {
+  globalData
 }