|
@@ -0,0 +1,102 @@
|
|
|
+<template>
|
|
|
+ <view>
|
|
|
+ <u-popup
|
|
|
+ v-model="isShow"
|
|
|
+ mode="bottom"
|
|
|
+ border-radius="40"
|
|
|
+ :mask-close-able="false"
|
|
|
+ >
|
|
|
+ <!-- 播放前拍照start -->
|
|
|
+ <!-- :mask-close-able="false" -->
|
|
|
+ <!-- style="bottom: 0; position: fixed; width: 100%; z-index: 999" -->
|
|
|
+ <view v-if="isShow">
|
|
|
+ <view class="photoBox">
|
|
|
+ <view class="photoTop">
|
|
|
+ <view class="centersq">请正视手机屏幕</view>
|
|
|
+ </view>
|
|
|
+ <view class="photoCenter">
|
|
|
+ <view class="center_camera" v-if="photoPopup && isTaking">
|
|
|
+ <!-- #ifdef MP-WEIXIN -->
|
|
|
+ <camera
|
|
|
+ device-position="front"
|
|
|
+ flash="off"
|
|
|
+ @error="error"
|
|
|
+ style="width: 100%; height: 100%"
|
|
|
+ >
|
|
|
+ <!-- 加人脸框 -->
|
|
|
+ <cover-view class="head_take">
|
|
|
+ <cover-view class="headTake_up color"></cover-view>
|
|
|
+ <cover-view class="headTake_minddle">
|
|
|
+ <cover-view class="min_left color"></cover-view>
|
|
|
+ <cover-view class="min_img"></cover-view>
|
|
|
+ <cover-view class="min_right color"></cover-view>
|
|
|
+ </cover-view>
|
|
|
+ <cover-view class="headTake_down color"></cover-view>
|
|
|
+ </cover-view>
|
|
|
+ </camera>
|
|
|
+ <!-- #endif -->
|
|
|
+ <!-- #ifdef H5 -->
|
|
|
+ <video
|
|
|
+ :controls="false"
|
|
|
+ id="video"
|
|
|
+ width="400"
|
|
|
+ height="300"
|
|
|
+ class="photo_v"
|
|
|
+ ></video>
|
|
|
+ <view class="mask"></view>
|
|
|
+ <!-- #endif -->
|
|
|
+ </view>
|
|
|
+ <view class="custom" v-if="!isTaking">
|
|
|
+ <!-- #ifdef MP-WEIXIN -->
|
|
|
+ <image :src="avatarUrl" mode=""></image>
|
|
|
+ <!-- #endif -->
|
|
|
+ <!-- #ifdef H5 -->
|
|
|
+ <image :src="faceUrl" mode=""></image>
|
|
|
+ <!-- #endif -->
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="btns">
|
|
|
+ <!-- <view class="btnResult" v-if="isTaking" @click="takePhoto"
|
|
|
+ >拍照</view
|
|
|
+ > -->
|
|
|
+ <view v-if="isTaking" class="takePhoto_btn">
|
|
|
+ <view style="width: 100rpx; height: 2rpx"></view>
|
|
|
+ <view class="middle_btn" @click="takePhoto">
|
|
|
+ <view class="square"></view>
|
|
|
+ </view>
|
|
|
+ <view class="rights" @click="takePhTips()">
|
|
|
+ <text>拍照提示</text>
|
|
|
+ <u-icon name="arrow-right" color="#FFFFFF" size="30"></u-icon>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="btnResult" v-if="!isTaking" @click="reTake">重拍</view>
|
|
|
+ <view class="btnResult" v-if="!isTaking" @click="submit">确认</view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </u-popup>
|
|
|
+ </view>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+export default {
|
|
|
+ name: "SaasMiniprogramCamera",
|
|
|
+ popos: {
|
|
|
+ visible: {
|
|
|
+ type: Boolean,
|
|
|
+ defaule: false,
|
|
|
+ },
|
|
|
+ },
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ isShow: false,
|
|
|
+ };
|
|
|
+ },
|
|
|
+
|
|
|
+ mounted() {},
|
|
|
+
|
|
|
+ methods: {},
|
|
|
+};
|
|
|
+</script>
|
|
|
+
|
|
|
+<style lang="scss" scoped></style>
|