From db82e5990f81ba35b1668e08dcbbb71990a6a486 Mon Sep 17 00:00:00 2001 From: zhaoxiaoqiang <287285524@qq.com> Date: Fri, 05 Aug 2022 15:02:35 +0800 Subject: [PATCH] 身份证 --- src/components/upload/uploadIdCard.vue | 66 +++++++++++++++++++++----------- 1 files changed, 43 insertions(+), 23 deletions(-) diff --git a/src/components/upload/uploadIdCard.vue b/src/components/upload/uploadIdCard.vue index b0943b9..8de02da 100644 --- a/src/components/upload/uploadIdCard.vue +++ b/src/components/upload/uploadIdCard.vue @@ -1,7 +1,7 @@ <!-- * @Date: 2019-08-30 18:04:49 * @LastEditors: zxq - * @LastEditTime: 2022-08-05 14:35:52 + * @LastEditTime: 2022-08-05 15:02:07 * @Description: --> <template> @@ -20,23 +20,8 @@ </div> <!-- 真正的上传按钮--> <div> - <input - style="display: none;cursor:pointer" - type="file" - id='inputFileImage' - ref="androidInputFileImage" - @change="handlePhotoChange($event,1)" - accept="image/jpg, image/jpeg, image/png" - /> - <input - style="display: none;cursor:pointer;" - type="file" - id='inputFileCapture' - ref="androidInputFileCapture" - @change="handlePhotoChange($event,2)" - accept="image/*" - capture="camera" - /> + + </div> <!--选择上传图片还是拍照--> <!-- <van-action-sheet @@ -46,9 +31,31 @@ :actions="nav" @select="handleMenuSelect" ></van-action-sheet> --> - <van-action-sheet v-model="selectModel" cancel-text="取消" title="标题"> - <div v-for="item in nav" :key="item.code" class="content"> - <span @click="handleMenuSelect(item.code)">{{item.name}}</span> + <van-action-sheet v-model="selectModel" cancel-text="取消" title="上传身份证"> + <div class="content"> + <div class="upload_input"> + <div>拍照</div> + <input + style="cursor:pointer;width:100%;opacity:0;" + type="file" + id='inputFileCapture' + ref="androidInputFileCapture" + @change="handlePhotoChange($event,2)" + accept="image/*" + capture="camera" + /> + </div> + <div class="upload_input"> + <div>本地相册上传</div> + <input + style="cursor:pointer;width:100%;opacity: 0;" + type="file" + id='inputFileImage' + ref="androidInputFileImage" + @change="handlePhotoChange($event,1)" + accept="image/jpg, image/jpeg, image/png" + /> + </div> </div> </van-action-sheet> <!-- <button @click="onclick">aa</button> --> @@ -103,6 +110,7 @@ ...mapMutations([SET_APP_LOADING]), // 处理图片上传的事件(deleteIndex---删除图片的索引) handlePhotoChange: function(evt,type) { + this.selectModel = false; let that = this; let shebei = this.judgeBrand(navigator.userAgent.toLowerCase()); that.SET_APP_LOADING(true); @@ -318,7 +326,6 @@ }, // 选择拍照或者相册选项 handleMenuSelect(index) { - console.log( this.$children[0] ) if (index === 0) { this.$refs.androidInputFileCapture.click(); } else { @@ -365,8 +372,21 @@ }; </script> -<style lang="less" scoped > +<style lang="less" > .component-photo-upload { + .upload_input{ + font-size: 16px; + width: 100%; + height: 45px; + position: relative; + text-align: center; + margin-top: 10px; + input{ + position: absolute; + left: 0; + top: 0; + } + } .pic-title { h4 { padding: 10px 0; -- Gitblit v1.8.0