HolyKnightIX 1 anno fa
parent
commit
6444ec1692
3 ha cambiato i file con 104 aggiunte e 3 eliminazioni
  1. +31
    -0
      src/api/camera.js
  2. +73
    -1
      src/pages/camera/index.vue
  3. +0
    -2
      src/style/my.scss

+ 31
- 0
src/api/camera.js Vedi File

@@ -0,0 +1,31 @@
import { request } from "../utils/request"

/**
* @description:获取上传二维码
* @param machineQrcodeId
* @return: status
*/
export function getImageQrcode(machineQrcodeId) {
return request({
url: `/api/screenImg/imageQrcode`,
method: 'post',
data: {
machineQrcodeId
}
})
}

/**
* @description:生成画报
* @param {appId,img}
* @return: data
*/
export function getUserQrcodeApi(data) {
return request({
url: `/api/miniApp/getUserQrcode`,
method: 'POST',
responseType: "arraybuffer",
data
})
}


+ 73
- 1
src/pages/camera/index.vue Vedi File

@@ -19,7 +19,7 @@
></video>

<div v-if="!isSuccess">
<div class="selectImg">
<div class="selectImg" @click="uploadImg">
<img src="../../assets/img/selectImg.png" />
<div class="uploadText">上传照片</div>
</div>
@@ -57,6 +57,20 @@
</div>
</div>
<!-- Top section -->
<u-overlay
class="overlay"
:show="showQrCode"
@click="showQrCode = false"
opacity="0.9"
>
<view class="content">
<view class="imageBox">
<image :src="QRCodeUrl" mode="scaleToFill" />
</view>
<text>打开微信扫码登录小程序</text>
<view class="orangeBtn" style="margin-top: 100rpx">取&nbsp;消</view>
</view>
</u-overlay>
</div>
</template>

@@ -64,11 +78,16 @@
import { ref, onMounted } from "vue";
import { onLoad, onShow, onUnload } from "@dcloudio/uni-app";

import { getImageQrcode } from "../../api/camera.js";

let imgSrc = ref("");
let isSuccess = ref(false);
let isShowCanvas = ref(true);
let modelUrl = ref("");

let QRCodeUrl = ref("");
let showQrCode = ref(false);

const startCamera = () => {
function getUserMedia(constraints, success, error) {
if (navigator.mediaDevices.getUserMedia) {
@@ -176,6 +195,19 @@ const reTry = () => {
}, 10);
};

// 点击上传照片按钮
const uploadImg = async () => {
const UserId = localStorage.getItem("UserId");
try {
const res = await getImageQrcode(UserId);
QRCodeUrl.value = res.data.wxQrcode;
showQrCode.value = true;
console.log(res, "res");
} catch (error) {
console.log(error, "error");
}
};

onLoad((options) => {
console.log(options, "options");
modelUrl.value = options.modelUrl;
@@ -346,5 +378,45 @@ onMounted(() => {
}
}
}
.overlay {
.content {
width: 100%;
height: 100vh;
display: flex;
flex-direction: column;
align-items: center;
text-align: center;
.imageBox {
position: relative;
margin-top: 200rpx;
width: 500rpx;
height: 500rpx;
border-radius: 30rpx;
background-color: #fff;
.mask {
position: absolute;
width: 500rpx;
height: 500rpx;
border-radius: 30rpx;
background-color: rgba($color: #000000, $alpha: 0.7);
z-index: 2;
}
image {
width: 500rpx;
height: 500rpx;
border-radius: 30rpx;
background-color: #fff;
}
}
text {
margin-top: 20rpx;
font-weight: 900;
font-size: 32rpx;
}
// .orangeBtn {
// margin-top: 100rpx;
// }
}
}
}
</style>

+ 0
- 2
src/style/my.scss Vedi File

@@ -47,8 +47,6 @@ view {
}

.orangeBtn {
position: absolute;
bottom: 50;
background-color: #FF4F00;
width: 520rpx;
height: 100rpx;


Caricamento…
Annulla
Salva