|
@@ -0,0 +1,86 @@
|
|
|
+<template>
|
|
|
+ <window-size>
|
|
|
+ <div style="height: 5px"></div>
|
|
|
+ <van-tag>请拍摄照片</van-tag>
|
|
|
+ <div :style="uploadHeight" id="capBox">
|
|
|
+ <div :style="uploadWidth">
|
|
|
+ <van-uploader style="width: 100%; height: 100%" v-model="fileList" :max-count="1">
|
|
|
+ <img style="width: 100%; height: 100%" :src="capImg"/>
|
|
|
+ </van-uploader>
|
|
|
+ </div>
|
|
|
+ <div class="cap-tip">
|
|
|
+ <van-tag type="danger">拍摄要求</van-tag>
|
|
|
+ <p>* 光线充足</p>
|
|
|
+ <p>* 背景底色单一</p>
|
|
|
+ <p>* 拍摄正脸免冠照片</p>
|
|
|
+ <div style="margin: 20px">
|
|
|
+ <van-button type="primary" block :disabled="disableUpload" @click="resizeIdCard">确定上传</van-button>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </window-size>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script setup>
|
|
|
+import {computed,ref} from 'vue'
|
|
|
+import store from '@/store'
|
|
|
+import capImg from '@/assets/capture-img.png'
|
|
|
+import {showToast} from 'vant'
|
|
|
+import {resize} from '@/utils/image'
|
|
|
+import {updateDoorFace} from "@/api/inpatient-service";
|
|
|
+import router from "@/router";
|
|
|
+
|
|
|
+const routeParams = router.currentRoute.value.params
|
|
|
+
|
|
|
+const screenSize = store.state.screenSize
|
|
|
+const uploadWidth = {
|
|
|
+ margin: '10px 60px',
|
|
|
+ width: screenSize.w - 120 + 'px',
|
|
|
+}
|
|
|
+const uploadHeight = {
|
|
|
+ height: ((screenSize.w - 120) / 3) * 2 + 'px',
|
|
|
+}
|
|
|
+const fileList = ref([])
|
|
|
+const disableUpload = computed(() => {
|
|
|
+ return fileList.value.length !== 1
|
|
|
+})
|
|
|
+
|
|
|
+const uploadFaceData = (base64) => {
|
|
|
+ const params = {
|
|
|
+ patNo: routeParams.patNo,
|
|
|
+ times: routeParams.times,
|
|
|
+ faceData: base64
|
|
|
+ }
|
|
|
+ updateDoorFace(params).then((res) => {
|
|
|
+ showToast({
|
|
|
+ message: res,
|
|
|
+ position: 'top',
|
|
|
+ });
|
|
|
+ })
|
|
|
+}
|
|
|
+
|
|
|
+const resizeIdCard = () => {
|
|
|
+ let content = fileList.value[0].content
|
|
|
+ if (content.length / 1024 < 2000) {
|
|
|
+ uploadFaceData(content)
|
|
|
+ } else {
|
|
|
+ resize(content, uploadFaceData)
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+</script>
|
|
|
+
|
|
|
+<style>
|
|
|
+#capBox .van-uploader__upload,
|
|
|
+#capBox .van-uploader__preview,
|
|
|
+#capBox .van-uploader__preview-image {
|
|
|
+ width: 100% !important;
|
|
|
+ height: 100% !important;
|
|
|
+}
|
|
|
+
|
|
|
+.cap-tip p {
|
|
|
+ font-size: 13px;
|
|
|
+ margin-left: 10px;
|
|
|
+ color: orangered;
|
|
|
+}
|
|
|
+</style>
|