bonus
/
bonus-material-app
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity
bonus-material-app/src/pages/back/backCodeScan.vue

585 lines
329 KiB
Vue
Raw Normal View History

ocr识别问题完善
2025-05-16 16:27:32 +08:00
<template>
<view class="page-container">
<!-- <view>
<live-pusher
v-once
id="livePusher"
ref="livePusher"
class="livePusher"
mode="FHD"
beauty="0"
whiteness="0"
device-position="back"
:auto-focus="false"
:muted="true"
:enable-camera="true"
:enable-mic="true"
:zoom="true"
:style="[{ height: '350rpx', width: '750rpx' }]"
>
</live-pusher>
</view> -->
<view class="table-list-item">
<view class="scan-btn" @click="handleInstruct()">
<text style="color: #fff">开始识别</text>
</view>
</view>
<view class="table-list-item">
<uni-row :gutter="24" style="display: flex; align-items: center">
<uni-col :span="5">
<text> 设备编码 </text>
</uni-col>
<uni-col :span="10">
<view style="width: 100%">
<uni-easyinput v-model="queryCodeParams.maCode" placeholder="请输入内容" />
</view>
</uni-col>
<uni-col :span="6">
<view
class="coding-btn"
style="
padding: 10rpx 0;
color: #fe9a09;
background-color: #fff7eb;
border: 1px solid #fe9a09;
"
@click="getCode()"
>
<text style="color: #fe9a09; text-align: center">编码检索</text>
</view>
</uni-col>
</uni-row>
</view>
<view class="table-list-item">
<scroll-view class="scroll-view" scroll-y="true" style="height: 500rpx">
<uni-forms :model="codeData" label-width="100" :border="true">
<uni-forms-item label="物资名称：" name="materialType">
<text style="display: flex; align-items: center">{{
codeData?.materialType
}}</text>
</uni-forms-item>
<uni-forms-item label="物资类型：" name="materialName">
<text style="height: 100%; display: flex; align-items: center">{{
codeData?.typeName
}}</text>
</uni-forms-item>
<uni-forms-item label="规格型号：" name="materialModel">
<text style="height: 100%; display: flex; align-items: center">{{
codeData?.materialName
}}</text>
</uni-forms-item>
<uni-forms-item label="设备编码：" name="maCode">
<text style="height: 100%; display: flex; align-items: center">{{
codeData?.maCode
}}</text>
</uni-forms-item>
<uni-forms-item label="设备状态：" name="statusName">
<text style="height: 100%; display: flex; align-items: center">{{
codeData?.maStatusName
}}</text>
</uni-forms-item>
<uni-forms-item label="外观判定：" name="apDetection">
<uni-easyinput
maxlength="30"
v-model="apDetection"
placeholder="请输入内容"
/>
</uni-forms-item>
<uni-forms-item label="附件：">
<div class="upload" @click="uploadImg" v-if="imgUrl == ''">+</div>
<div class="upload" @click="uploadImg" v-else>
<image
:src="imgUrl"
style="width: 160rpx; height: 160rpx"
mode=""
></image>
</div>
</uni-forms-item>
</uni-forms>
</scroll-view>
</view>
<view class="outbound-btn" @tap="onHandleConfirm">
<text style="color: #fff">确认</text>
</view>
</view>
</template>
<script>
退料编码识别附件上传
2025-07-31 10:45:00 +08:00
import { decryptWithSM4, encryptWithSM4, hashWithSM3AndSalt } from '@/utils/sm'
ocr识别问题完善
2025-05-16 16:27:32 +08:00
export default {
data() {
return {
livePusher: null,
ready: true,
cameraHeight: '', //相机画面宽度
coverImage: null,
queryParams: {},
queryCodeParams: {
maCode: '',
},
codeData: {},
apDetection: '',
bmFileInfos: [],
imgUrl: '',
}
},
onLoad(options) {
this.queryParams = JSON.parse(options.queryParams)
console.log(this.queryParams)
// this.queryCodeParams.typeId = this.queryParams.typeId;
},
onReady() {
this.cameraHeight = uni.getSystemInfoSync().screenHeight * 0.22
console.log(this.cameraHeight)
优化
2025-06-18 21:00:57 +08:00
// this.init()
ocr识别问题完善
2025-05-16 16:27:32 +08:00
},
methods: {
// 开始识别
handleInstruct() {
uni.showActionSheet({
itemList: ['拍照', '从相册选择'],
success: (res) => {
if (res.tapIndex === 0) {
this.getCamera()
} else if (res.tapIndex === 1) {
// 从相册选择
this.getPhoto()
}
},
fail: (err) => {
console.error('操作菜单选择失败:', err)
},
})
},
// 拍照
getCamera() {
navigator.camera.getPicture(this.onCameraSuccess, this.onCameraError, {
quality: 50,
destinationType: window.Camera.DestinationType.DATA_URL,
sourceType: window.Camera.PictureSourceType.CAMERA,
})
},
// 从相册选择
getPhoto() {
navigator.camera.getPicture(this.onCameraSuccess, this.onCameraError, {
quality: 50,
destinationType: window.Camera.DestinationType.DATA_URL,
sourceType: window.Camera.PictureSourceType.SAVEDPHOTOALBUM,
})
},
onCameraError(message) {
console.log(message)
},
onCameraSuccess(file) {
// const file1 = "data:image/jpeg;base64," + file;
const file1 = file
let params = {
image: file1,
jiju_type: '',
auth_lic:
'xIWDlaDVdijcBB4mjhGCPYk5Kvk8tHZJbUn+vW+ih15+MYx98e/PXyBmKL5gFcWMPznLgDA15QuSAnZQSLddwdy9HkZgtuQDEEZZ351Eyb1eiDUccUnyoSGIrNimbx5TooBNNPYqU4qJeFrPJXAqjBHzRrxoBxuR2CEGKQPgHC4=',
}
this.testParams = params
uni.request({
url: '/material/app/ocr/getOcrCode',
method: 'post',
data: params,
header: {
'Content-Type': 'application/json', // 根据后端要求设置请求头，常见的 POST 请求数据格式为 JSON
},
success: (res) => {
const { data: resData } = res
if (resData.data.data.result) {
this.queryCodeParams.maCode = resData.data.data.result
this.getCode()
} else {
uni.showToast({
title: '识别失败！' + resData.data.msg,
icon: 'none',
})
}
},
fail: (err) => {
uni.showToast({
title: '请求失败：' + err.errMsg,
icon: 'none',
})
},
})
},
//编码检索
async getCode() {
let param = {
maCode: this.queryCodeParams.maCode,
unitId: this.queryParams.unitId,
proId: this.queryParams.proId,
优化
2025-06-18 21:00:57 +08:00
id: this.queryParams.id,
ocr识别问题完善
2025-05-16 16:27:32 +08:00
}
console.log(param)
uni.request({
url: '/material/back_apply_info/getMachine',
method: 'get',
data: param,
success: (res) => {
res = res.data
console.log(res)
if (res.code == 200) {
if (res.data && res.data.length > 0) {
this.codeData = res.data[0]
}
} else {
uni.showToast({
title: res.msg,
icon: 'none',
})
}
// if(res.rows&&res.rows.length>0){
// this.codeData=res.rows[0];
// }else{
// uni.showToast({
// title: '未检索到有效的设备编码！',
// icon: 'none',
// })
// }
},
fail: (err) => {
console.log(err)
},
})
},
//上传
uploadImg() {
退料编码识别附件上传
2025-07-31 10:45:00 +08:00
uni.showActionSheet({
itemList: ['拍照', '从相册选择'],
ocr识别问题完善
2025-05-16 16:27:32 +08:00
success: (res) => {
退料编码识别附件上传
2025-07-31 10:45:00 +08:00
if (res.tapIndex === 0) {
this.getCameraFj()
} else if (res.tapIndex === 1) {
// 从相册选择
this.getPhotoFj()
}
ocr识别问题完善
2025-05-16 16:27:32 +08:00
},
退料编码识别附件上传
2025-07-31 10:45:00 +08:00
fail: (err) => {
console.error('操作菜单选择失败:', err)
},
})
// uni.chooseImage({
// count: 1, //图片可选择数量
// sizeType: ['original', 'compressed'], //original 原图，compressed 压缩图，默认二者都有
// sourceType: ['album', 'camera'], //album 从相册选图，camera 使用相机，默认二者都有。
// success: (res) => {
// console.log(res)
// let imgFiles = res.tempFilePaths //图片的本地文件路径列表
// this.imgUrl = imgFiles[0]
// uni.uploadFile({
// // url: baseURL+"/file/upload",//app
// url: '/file/upload', //h5
// filePath: imgFiles[0],
// name: 'file',
// success: (res) => {
// res = JSON.parse(res.data)
// console.log('上传成功', res)
// if (res.code && res.code == 200) {
// let obj = {
// name: res.data.name,
// url: res.data.url,
// taskType: '10',
// }
// this.bmFileInfos = [obj]
// uni.showToast({ title: '上传成功', icon: 'none' })
// } else {
// this.bmFileInfos = []
// uni.showToast({ title: '上传失败', icon: 'none' })
// }
// },
// fail: (err) => {
// console.error('上传失败', err)
// },
// })
// // this.$refs.vForm.clearValidate()
// },
// })
},
// 附件拍照
getCameraFj(){
navigator.camera.getPicture(onCameraSuccessFj, onCameraErrorFj, {
quality: 50,
destinationType: window.Camera.DestinationType.DATA_URL,
sourceType: window.Camera.PictureSourceType.CAMERA,
ocr识别问题完善
2025-05-16 16:27:32 +08:00
})
},
退料编码识别附件上传
2025-07-31 10:45:00 +08:00
// 附件从相册选择
getPhotoFj(){
this.uploadSignUrlFj()
// navigator.camera.getPicture(onCameraSuccessFj, onCameraErrorFj, {
// quality: 50,
// destinationType: window.Camera.DestinationType.DATA_URL,
// sourceType: window.Camera.PictureSourceType.SAVEDPHOTOALBUM,
// })
},
onCameraErrorFj(message){
console.log(message)
},
onCameraSuccessFj(file){
this.uploadSignUrlFj(file)
},
generateRandomString(length){
let result = '';
const characters = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789';
const charactersLength = characters.length;
for (let i = 0; i < length; i++) {
result += characters.charAt(Math.floor(Math.random() * charactersLength));
}
return result;
},
uploadSignUrlFj(){
const base64Data = 'iVBORw0KGgoAAAANSUhEUgAABuoAAAQMCAYAAABwc8+BAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAP+lSURBVHhe7N15eJTl2f7xc5bMJJnshH0LqCCLCgrWpVKrdUNqUdtaa0VftVZcEPfa1pJqW3ekuFCtK9aFX1urlbpWVFxQAQFZIsoSkpB9TybJTGb5/TGZYeaZSTIJgQTy/RzHc7zkvu95Znny2smcc123acGCBX4BAAAAAAAAAAAA2K/MxgEAAAAAAAAAAAAA+x5BHQAAAAAAAAAAANALCOoAAAAAAAAAAACAXmCKtUddfn6+amtrjcM9IiMjQzk5OcZhAAAAAAAAAAAAoF+JGdQ999xzys/PNw73iJycHF1yySXGYWCfKt+Rr4JmyZ4+WEeMSDJOB1SWaE2Zq+M16JrKEm1syej49Wys0MZdHg2eNFSDjHMd4JoCAAAAAAAAAA50lpNPPjnXOLhr1y4lJiYqIyOjx4+cnJwDp6Ju1wo9vs6qaWPSjTNtGvTVv57TJscxGpthnOsnGiu08dsKlbvtGpyWYJztnrZz1pkzNCDZOBlDZ+sbK7SjslXepExNHZ1inA0pL61Snceu4YdmymGc7CfKd+Qrr7hZ1kGpsV+DyhKt2VmlxvZea4Py0ipVNzoj1xt/Z9xNKq9rVnWjScMyEyNvvyNfeeWtSs92yBY+wTUFAAAAAAAAABwEYlbUIaDg/Sf05jeSxp2lX31/pHF6z3z2cfr5+Ucq1bhg1wo9/tY242i3HXrmlTp1tHG0dzmLCpVX55Vk16hgRVRjhTbucsplXNyepExNGxsWhrbd3j44R+Oywxe2o5P1wcqr9lk0aHCi6so6fsz29MEa7C5r91xpgwcrsapM5R7jTGxp7Tze3hR4rcKupVFbhVpXHnvgnBYNGj1So1IkqU7fbK6RK7zKLeZ5m1WwtUzlCYbfD64pAAAAAAAAAOAgQVDXiUAYl63jLzxPR6btGW/Y8Ipe/KxS2cddqPOPioro4tbe+fedRpUWNcjlNyt5wGANjKMqqn2BIKXO0RZ2tDo0YfzA2JVL8YRpwdtHrG0La9Q2V1miNfXJ8Qd7bQGQkjI1bZBbG3e1KD0UGAWFB0K20HPquFViIGyqjwgZYwRLbY9NnYZSe6GlVrsrmuVRgtJGZivTON8F8QV1nrDQLR5tr1UozI3xOgXHgtc57HYRgZ76yTUFAAAAAAAAAPQLZuNAv7VrhR5//Imo481vJKlSq16KHH/xs0pJUuVnL0Xd5vHHn9C/NjQY7yGGQn37jaRx0/dTSCfJ6VarX5LJKvtehXSSKmtV7rEoPSNJg8YO1iA5lbejzrhKkuSsbZFLFiVGdjYMGZRmlzwtqmo0TDQ2qs4j2R0pcqhZBVUuqblGazaXqNywNEpjhTaWuSSrQxPGpsvZItmtXpXvCt62WQVb87VmR2OgAmtQIIhJTLDIVVemjUXtlFn1Mb7mVnkkyZqguLOz/Spd4wbbZU/PaAv/kpSYIKnVLWdoTZJGDbBL8sgZ/B1odMslyZ4YFq71k2sKAAAAAAAAAOgfYu5RJ0m1tbVqaWnp1pHYXhrTl2WM0bRpx3RwjJNt1yYVJR+nn188UydEzUceE4fYjfcQrX6X1m0q0rDpp+y3Pe5aGhrU2OqXEhI1MMUuk3FB3JpVUFgnpz1DEwYnSkpQerZJjcU1Ko7ar65ZpSUNcpqTNWqYYa+xoGSfGiua5JRdgxPdKq9rlTUlQ4mN1Sp1mTVgyACl2xKUnp2hYcmtqqprVnVFgzzJ6UpXU2h9+L5p5UUVqg6r0LIlOzQg2y5PTZ2qWuwanCbVVTnldLfKMnB02zVIkCPTJk+NUy7ZlJKZGPvxyqWqiha5EpLC9lXzBM5nCRtzBx6bElP2vCZNjSp2emU3PN7uqq9vUItXMtsdykzeu30CnTW1qvNYld7eHnVNjSp2+uTISFd67BcmtuTUyN8JZ4Mqm6Xk8PtJTtWw7FQ52s7rLA9c+/TsPffVX64pAAAAAAAAAKB/iNn6Mj8/X88995xxOC6XXHKJcnJyjMOSpA8//FCjR49ud75Pq/9K/3rpM2V0a5+4Qr33+Jvq3m51PdkW06+a0lLVt0rW5AEaPiB2XBGXUAvENLXsalJGxP50LUpPt6q8rqPdwdqEtRkMtV0cbVXZLqfswf3BYuxRFmhTWK/E0SM1Sh20vuxUrHaH8Yh1u7Y2ift1P7Nmle+uVbPPJHv6EA3Zy9+T6NaXwbaVnQnfgy4OcbSKjGiHapzsUKxrE49Yt+uNawoAAAAAAAAA6C96PKi7/vrrlZERWR5WW1ur1157Tfn5+R0GeX3DvgjV2s457iz96vsjjZPtCuyDp3bO2R1OlRXVq8VvUlLWEA3qWvoRZs/edEdkuPXN7hrVG8O0ToOY6FDEWVSoPKdVowZYVVbmlD3dIVddHAFcu3vUxRsyxSEq9Il+/L2yn1lrnXaXNskjq1KHD1TWXjazjQ7qDGLsUecsKlRenQxBnTHgMgZ57ew/FxLr9Q0bDxvptvbO3dvXFAAAAAAAAADQb8QM6npSfn6+XnvtNdXW1kqdVNz1DYFQrfa4C3X+UanGyfbtWqHH36ptJ1TrIKjroFKvx4O6phoVVbXIa0pQxohsdaXWKFwgmLHuCXNihDdRwUVUmBYrFGkTtTaoWQVbK6Xhhsqtdtd3cB9xa+8cscZ7IdSprdSuhlbJkqTBwzLUvaazxlAtKDqwixXKxRqLEOv3o7OKuXZfo1ive1e1d45Y471wTQEAAAAAAAAA/cZe1t90LFiZFwzp0LtaW1rllSRLgrq/jVazqpxepQ0OC3Cyk5Umr+pqmyOXdkH5jnyt2dx27HLKJam+LGxsR53U2Kg6j1flu9p+7gXOosK2x9RW1dVc0/ZzoQoajav3vXp3IF0zWRO6GdJJUpJGjc/RtEk5GpWktoAuR9PaQrrAcy5ReWi9VYkxArm63flas7VCTuNEOwal2SWPU7srjTNSeb1Lkl0Z+yH06mvXFAAAAAAAAADQf1hOPvnkXONgT9mwYYNqa2vV0tISGpsyZUpUa8y+pV47125Ty4gjNHGI3TjZvrqdWrutRSOPmKDBUTcLnLN6wGGaNsZQBeQqU96mIiUeeozGGl4Wd1meNhapnXN2XWN9g1q8ksWeosxkq3E6TglKz87QgIikL1EDBmVocFrCnqGmRhU7vbKntK11N6m8rlXW4M9yqaqiRa6EJA3LTJQjM0PDBgUOa2Ot6jyB/b6OyGkbz0yUbA4NDs43t6i4plXp2Q7Zos4dFHhcwzITVb4jX3nFtSquiPdolnVQqhxh55AkW1p62+M0qbGiRa6kTE0bP0TDBqUr3eZRXZVTTnfLnvPUBcJRr8u5Z8zplaQ9r023udVQ16RWv2RLzlJq95O6EGdNreo8VqUPSm2rcqtTfmGTXElpOiwzUbWVNYZ5qbW+XpUuq4YPtKquoVlus+F5NTWq2OmTIyNd6eHbIib71FjRonqfKfT6SoGKtR2VrfK23Wekg/2aAgAAAAAAAAD6k30a1OXk5GjIkCHatWtXKKw7UIK6oqJNWrt2bfzHtmpJye2Ean0hqGtSfV2LPH6T7CkZStmb8zVWaOO3FSqMCkICR6M5QwPUtaBujzrtLm6RS5I9xSRntV/p4QGgJEdmhtLdDWpQsjIzEzsI6vZw1tSqTg5NmDBcOW2BYHtHICiMDKOixXr8baGOPRj0ZGhYcquq6lplTR+sqYcODIyZmyNfm+7yNaq2rlU+WZSU5VCyxbig64xBnbOoQrtdNo0any2HmlVV7pTTnKhh2Q4FM7dQeJeTIXuNU9UeQ/DWXlCnRCW6G1TZ6JInec9ceVGFqj0WDRo+yLA+0kF5TQEAAAAAAAAA/UrMPepqa2v1l7/8xTgcl1h70NXW1oZaYMaa71v28x51HdyuR/eoa6nV7opmeZSgtOHZytwXTU/D9yJr6d4edYH9zgLVSUGd7vsVde5oHe6HZlC+I18FzdH7s0WK/fijxNrPrKfUV6q
uni.request({
url: '/file/uploadBase64',
method: 'POST',
data: {
base64File:base64Data,
fileName: `${this.generateRandomString(10)}_${Date.now()}.png`,
fileType: 'image/png'
},
success: (uploadRes) => {
console.log("xxxxxxxxxx",uploadRes)
if(!uploadRes.data.code){
uploadRes = JSON.parse(decryptWithSM4(uploadRes.data))
}else{
uploadRes =JSON.parse(uploadRes.data)
}
if (uploadRes.code && uploadRes.code == 200) {
let obj = {
name: uploadRes.data.name,
url: uploadRes.data.url,
}
this.bmFileInfos = [obj]
this.imgUrl = uploadRes.data.url
// imgList.value.push({
// url: uploadRes.data.url, // Show local path first
// serverUrl: uploadRes.data.url // Store server URL
// })
// bmFileInfos.value.push({
// name: uploadRes.data.name,
// url: uploadRes.data.url,
// taskType: '10'
// })
uni.showToast({ title: '上传成功', icon: 'none' })
} else {
uni.showToast({ title: '上传失败', icon: 'none' })
}
},
fail: (err) => {
console.error('上传失败', err)
uni.showToast({ title: '上传失败', icon: 'none' })
}
})
},
ocr识别问题完善
2025-05-16 16:27:32 +08:00
//确认按钮
async onHandleConfirm() {
console.log(this.codeData.maId)
if (this.codeData.maId == undefined) {
uni.showToast({
title: '请先识别编码！',
icon: 'none',
})
} else {
let obj = {
maId: this.codeData.maId,
maCode: this.codeData.maCode,
typeId: this.codeData.typeId,
apDetection: this.apDetection,
bmFileInfos: this.bmFileInfos,
}
let param = {
backApplyInfo: this.queryParams,
backApplyDetails: obj,
}
console.log('333333333', param)
uni.request({
url: '/material/back_apply_info/insertApp',
method: 'post',
data: param,
success: (res) => {
res = res.data
console.log(res)
if (res.code === 200) {
uni.showToast({
title: '添加成功！',
icon: 'none',
})
this.queryCodeParams.maCode = ''
this.codeData = {}
}
},
fail: (err) => {
console.log(err)
},
})
}
},
},
}
</script>
<style>
.page-container {
display: flex;
height: auto;
flex-direction: column;
background-color: #f7f8fa;
padding: 24rpx;
}
.table-list-item {
margin-top: 10rpx;
background: #fff;
padding: 20rpx;
border-radius: 20rpx;
box-shadow: 0 4rpx 16rpx rgba(0, 0, 0, 0.06);
margin-bottom: 20rpx;
}
.scan-btn {
/* width: 100%; */
height: 88rpx;
background: #4b8eff;
display: flex;
justify-content: center;
align-items: center;
border-radius: 12rpx;
font-size: 32rpx;
font-weight: 600;
box-shadow: 0 6rpx 20rpx rgba(55, 132, 251, 0.2);
/* transition: all 0.3s ease; */
margin: 0;
padding: 0;
}
.coding-btn {
/* padding: 12rpx 0; */
background: #fff;
color: #ff9800;
border: 2rpx solid rgba(255, 152, 0, 0.5);
background: linear-gradient(to bottom, rgba(255, 152, 0, 0.05), rgba(255, 152, 0, 0.1));
border-radius: 12rpx;
text-align: center;
font-size: 28rpx;
font-weight: 600;
letter-spacing: 1rpx;
/* transition: all 0.3s ease; */
/* &:active {
background: rgba(255, 152, 0, 0.15);
border-color: rgba(255, 152, 0, 0.6);
transform: translateY(1rpx);
} */
}
.outbound-btn {
position: absolute;
bottom: 40rpx;
left: 50%;
transform: translateX(-50%);
/* width: 90%; */
height: 88rpx;
width: 620rpx;
/* margin: 0 10px; */
/* background: linear-gradient(135deg, #4b8eff 0%, #3784fb 100%); */
background: #4b8eff;
display: flex;
align-items: center;
justify-content: center;
color: #fff;
border-radius: 12rpx;
font-size: 32rpx;
font-weight: 600;
box-shadow: 0 6rpx 20rpx rgba(55, 132, 251, 0.2);
/* transition: all 0.3s ease; */
/* &:active {
transform: translateX(-50%) scale(0.98);
opacity: 0.9;
} */
}
/* 上传区域样式 */
.upload {
width: 160rpx;
height: 160rpx;
background-color: #f7f8fa;
border: 1rpx dashed #d9d9d9;
border-radius: 12rpx;
display: flex;
justify-content: center;
align-items: center;
font-size: 48rpx;
color: #bfbfbf;
/* transition: all 0.3s ease; */
&:active {
background-color: #f0f0f0;
border-color: #3784fb;
}
image {
width: 100%;
height: 100%;
border-radius: 12rpx;
object-fit: cover;
}
}
.camera-background {
width: 100%;
height: 100%;
background-color: rgba(0, 0, 0, 0.3);
}
.cover-image {
position: fixed;
top: 0;
left: 0;
z-index: 99;
}
.camera-options {
flex-direction: row;
align-items: center;
}
.camera-item {
flex: 1;
flex-direction: row;
justify-content: center;
align-items: center;
height: 100%;
}
.camera-item .camera-item-image {
width: 80rpx;
height: 80rpx;
}
.camera-options-center .camera-item-image {
width: 120rpx;
height: 120rpx;
}
</style>