打卡上传照片
This commit is contained in:
parent
0f34148494
commit
dac24ccd17
|
|
@ -12,6 +12,40 @@
|
|||
</view>
|
||||
<view class="tle">我的位置</view>
|
||||
<view class="curAdres">{{curAdres}}</view>
|
||||
|
||||
|
||||
<!-- 图片上传 -->
|
||||
<view class="tle" style="margin-top: 40rpx;">工作地证明（必填，1-3张）</view>
|
||||
<view class="upload_nav">
|
||||
<view
|
||||
class="upload_item"
|
||||
v-for="(item, index) in imgList"
|
||||
:key="index"
|
||||
>
|
||||
<image :src="item" class="upload_img" mode="aspectFill"></image>
|
||||
<view class="del" @click="removeImg(index)">×</view>
|
||||
</view>
|
||||
|
||||
<view
|
||||
class="upload_add"
|
||||
v-if="imgList.length < maxImg"
|
||||
@click="chooseImage"
|
||||
>
|
||||
<view class="plus">+</view>
|
||||
<view class="txt">拍照 / 相册</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="tle" style="margin-top: 40rpx;">说明（选填）</view>
|
||||
<view class="input_nav">
|
||||
<textarea
|
||||
style="width: 100%;height: 100%;"
|
||||
placeholder="请输入"
|
||||
v-model="describe"
|
||||
/>
|
||||
</view>
|
||||
|
||||
|
||||
<view class="tle" style="margin-top: 40rpx;">备注（选填）</view>
|
||||
<view class="input_nav">
|
||||
<textarea style="width: 100%;height: 100%;" placeholder="请输入" v-model="remark" />
|
||||
|
|
@ -32,6 +66,7 @@
|
|||
import tabbar from "@/components/tabbar/tabbar.vue"
|
||||
const bmap = require('@/utils/bmapjs/bmap-wx.min.js');
|
||||
import {selectFaceInfo} from "@/api/index.js"
|
||||
import { uploadFile } from '@/utils/http'
|
||||
export default {
|
||||
components: {
|
||||
tabbar
|
||||
|
|
@ -47,7 +82,13 @@
|
|||
timer: null,
|
||||
subscribe: [], // 订阅消息
|
||||
BMap: null,
|
||||
isNext: false
|
||||
isNext: false,
|
||||
|
||||
// 图片相关
|
||||
imgList: [],
|
||||
serverImgs: [],
|
||||
maxImg: 3,
|
||||
describe: '',
|
||||
}
|
||||
},
|
||||
onLoad() {
|
||||
|
|
@ -179,39 +220,93 @@
|
|||
})
|
||||
},
|
||||
|
||||
clockClick() {
|
||||
if(!this.isNext) {
|
||||
uni.showModal({
|
||||
title: '提示',
|
||||
content: '您当前还未录入人脸信息，请先录入',
|
||||
success: res => {
|
||||
if(res.confirm) {
|
||||
uni.redirectTo({
|
||||
url: '/pages/face/index'
|
||||
})
|
||||
}
|
||||
}
|
||||
})
|
||||
return
|
||||
}
|
||||
if(this.subscribe.length <= 0) {
|
||||
this.requestSubscribeMessage()
|
||||
}
|
||||
// let data = {
|
||||
// attLon: this.longitude,
|
||||
// attLat: this.latitude,
|
||||
// attAddress: this.curAdres,
|
||||
// remark: this.remark
|
||||
// }
|
||||
// uni.navigateTo({
|
||||
// url: '/pages/clock/detail',
|
||||
// })
|
||||
console.log("remark",this.remark);
|
||||
uni.redirectTo({
|
||||
|
||||
url: '/pages/clock/detail?attLon=' + this.longitude + '&attLat=' + this.latitude + '&remark=' + this.remark
|
||||
})
|
||||
}
|
||||
/* 选图 */
|
||||
chooseImage() {
|
||||
uni.chooseImage({
|
||||
count: this.maxImg - this.imgList.length,
|
||||
sourceType: ['camera', 'album'],
|
||||
sizeType: ['compressed'],
|
||||
success: (res) => {
|
||||
this.imgList = this.imgList.concat(res.tempFilePaths)
|
||||
}
|
||||
})
|
||||
},
|
||||
|
||||
removeImg(index) {
|
||||
this.imgList.splice(index, 1)
|
||||
this.serverImgs.splice(index, 1)
|
||||
},
|
||||
|
||||
/* 上传图片 */
|
||||
uploadImages() {
|
||||
return new Promise((resolve, reject) => {
|
||||
let count = 0
|
||||
this.serverImgs = []
|
||||
|
||||
this.imgList.forEach(path => {
|
||||
uploadFile({
|
||||
url: '/file/upload',
|
||||
filePath: path
|
||||
}).then(res => {
|
||||
// 后台返回的完整访问地址
|
||||
this.serverImgs.push(res.url)
|
||||
count++
|
||||
if (count === this.imgList.length) {
|
||||
resolve()
|
||||
}
|
||||
}).catch(err => {
|
||||
reject(err)
|
||||
})
|
||||
})
|
||||
})
|
||||
},
|
||||
|
||||
async clockClick() {
|
||||
if (!this.isNext) {
|
||||
uni.showModal({
|
||||
title: '提示',
|
||||
content: '您当前还未录入人脸信息，请先录入',
|
||||
success: res => {
|
||||
if (res.confirm) {
|
||||
uni.redirectTo({
|
||||
url: '/pages/face/index'
|
||||
})
|
||||
}
|
||||
}
|
||||
})
|
||||
return
|
||||
}
|
||||
|
||||
if (this.imgList.length < 1) {
|
||||
uni.showToast({title: '请至少上传一张现场照片', icon: 'none'})
|
||||
return
|
||||
}
|
||||
|
||||
try {
|
||||
await this.uploadImages()
|
||||
} catch (e) {
|
||||
uni.showToast({title: '图片上传失败', icon: 'none'})
|
||||
return
|
||||
}
|
||||
|
||||
if (this.subscribe.length <= 0) {
|
||||
this.requestSubscribeMessage()
|
||||
}
|
||||
// let data = {
|
||||
// attLon: this.longitude,
|
||||
// attLat: this.latitude,
|
||||
// attAddress: this.curAdres,
|
||||
// remark: this.remark
|
||||
// }
|
||||
// uni.navigateTo({
|
||||
// url: '/pages/clock/detail',
|
||||
// })
|
||||
console.log("remark", this.remark);
|
||||
uni.redirectTo({
|
||||
url: '/pages/clock/detail?attLon=' + this.longitude + '&attLat=' + this.latitude + '&remark=' + this.remark + '&describe='+this.describe + '&imgUrl=' + this.serverImgs
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
|
|
|||
|
|
@ -70,10 +70,10 @@
|
|||
data() {
|
||||
return {
|
||||
form: {
|
||||
// phone: '15240004260',
|
||||
// password: 'GZkq@123456!',
|
||||
phone: '',
|
||||
password: '',
|
||||
phone: '15240004260',
|
||||
password: 'GZkq@123456!',
|
||||
// phone: '',
|
||||
// password: '',
|
||||
},
|
||||
version: '3.6.2',
|
||||
}
|
||||
|
|
|
|||
|
|
@ -172,3 +172,51 @@ const request = (options) => {
|
|||
// }
|
||||
|
||||
export default request
|
||||
|
||||
|
||||
/**
|
||||
* 文件上传（MultipartFile）
|
||||
* @param {String} url 接口地址
|
||||
* @param {String} filePath 本地文件路径
|
||||
* @param {Object} formData 额外参数（可选）
|
||||
*/
|
||||
export function uploadFile({ url, filePath, formData = {} }) {
|
||||
return new Promise((resolve, reject) => {
|
||||
const token = uni.getStorageSync('token')
|
||||
|
||||
uni.uploadFile({
|
||||
url: BASE_URL + url,
|
||||
filePath: filePath,
|
||||
name: 'file', // ⚠️ 必须是 file（对应后台 @RequestParam("file")）
|
||||
formData: formData,
|
||||
header: {
|
||||
token: token || '',
|
||||
Authorization: token || ''
|
||||
},
|
||||
success: (res) => {
|
||||
try {
|
||||
const data = JSON.parse(res.data)
|
||||
if (data.code === 200) {
|
||||
resolve(data)
|
||||
} else {
|
||||
reject(data)
|
||||
uni.showToast({
|
||||
title: data.msg || '上传失败',
|
||||
icon: 'none'
|
||||
})
|
||||
}
|
||||
} catch (e) {
|
||||
reject(e)
|
||||
}
|
||||
},
|
||||
fail: (err) => {
|
||||
reject(err)
|
||||
uni.showToast({
|
||||
title: '文件上传失败',
|
||||
icon: 'none'
|
||||
})
|
||||
}
|
||||
})
|
||||
})
|
||||
}
|
||||
|
||||
|
|
|
|||
Loading…
Reference in New Issue