You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
347 lines
8.3 KiB
347 lines
8.3 KiB
<template>
|
|
<view class="addRecord">
|
|
<navbar title="添加记录" :isCenter="true" :back="true"></navbar>
|
|
<view style="border-top:1px solid #EAEAEA;padding:40rpx 44rpx;">
|
|
<u--form
|
|
labelPosition="left"
|
|
:model="form"
|
|
:borderBottom="false"
|
|
:rules="rules"
|
|
ref="uForm"
|
|
labelWidth="70"
|
|
|
|
>
|
|
<u-form-item
|
|
label="验收项:"
|
|
prop="form.acceptance"
|
|
@click="showoption = true;"
|
|
ref="item1"
|
|
:borderBottom="false"
|
|
>
|
|
<view class="selectStyle">
|
|
<u--input
|
|
v-model="form.acceptance"
|
|
disabled
|
|
disabledColor="#ffffff"
|
|
placeholder="请选择"
|
|
border="none"
|
|
></u--input>
|
|
<u-icon
|
|
slot="right"
|
|
name="arrow-right"
|
|
></u-icon>
|
|
</view>
|
|
</u-form-item>
|
|
<!-- <u-form-item
|
|
:borderBottom="false"
|
|
label="调试记录:"
|
|
prop="record.record"
|
|
|
|
ref="item1"
|
|
>
|
|
<u--textarea v-model="form.record" placeholder="请输入内容" ></u--textarea>
|
|
|
|
</u-form-item> -->
|
|
<u-form-item
|
|
label="上传图片:"
|
|
ref="item1"
|
|
:borderBottom="false"
|
|
>
|
|
<u-upload
|
|
:fileList="finishImageList"
|
|
:capture="['camera']"
|
|
:previewFullImage="true"
|
|
@afterRead="afterRead"
|
|
:maxCount="6" width="80" height="80"
|
|
@delete="deletePic"
|
|
name="1"
|
|
multiple
|
|
></u-upload>
|
|
</u-form-item>
|
|
|
|
</u--form>
|
|
<view class="btn" @click="addLogHandle">
|
|
保存
|
|
</view>
|
|
</view>
|
|
<u-action-sheet
|
|
:show="showoption"
|
|
:actions="actions"
|
|
@close="showoption = false"
|
|
@select="selectHandle"
|
|
>
|
|
</u-action-sheet>
|
|
<u-toast ref="uToast"></u-toast>
|
|
<!-- 设置canvas用于添加水印 -->
|
|
<canvas id="canvas-clipper" canvas-id="canvas-clipper" type="2d"
|
|
:style="{width: canvasSiz.width+'px',height: canvasSiz.height+'px',position: 'absolute',left:'-500000px',top: '-500000px'}" />
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
import navbar from '@/components/navbar.vue'
|
|
import {addLogHandle} from '@/common/api.js'
|
|
import {getToken} from '@/common/auth.js'
|
|
|
|
export default {
|
|
components:{navbar},
|
|
data() {
|
|
return {
|
|
id:null,
|
|
showoption: false,
|
|
form:{
|
|
acceptance:'',
|
|
record:''
|
|
},
|
|
finishImageList:[],
|
|
fileList1: [],
|
|
actions: [
|
|
|
|
],
|
|
rules: {
|
|
// 'form.record': {
|
|
// required: true,
|
|
// message: '请填写调试记录',
|
|
// trigger: ['blur', 'change']
|
|
// },
|
|
'form.acceptance': {
|
|
required: true,
|
|
message: '请选择验收项',
|
|
trigger: ['blur', 'change']
|
|
},
|
|
},
|
|
//水印
|
|
canvasSiz:{
|
|
width:null,
|
|
height:null,
|
|
}
|
|
}
|
|
},
|
|
onLoad(option) {
|
|
this.id=option.id
|
|
|
|
let arr = uni.getStorageSync('acceptance')
|
|
this.actions=[]
|
|
arr.forEach(item=>{
|
|
this.actions.push({name:item.title})
|
|
|
|
})
|
|
},
|
|
methods: {
|
|
addLogHandle(){
|
|
let image;
|
|
if(this.finishImageList.length>0){
|
|
let arr = this.finishImageList.map(item=>{
|
|
return item.path
|
|
})
|
|
image=arr.join(',')
|
|
}else{
|
|
image=''
|
|
}
|
|
let params={
|
|
wordorder_id:this.id.toString(),
|
|
acceptance:this.form.acceptance,
|
|
record:this.form.record,
|
|
image:image,
|
|
custom: { auth: true },
|
|
}
|
|
addLogHandle(params).then(res=>{
|
|
console.log(res,"iiiii")
|
|
if(res.code==1){
|
|
this.$refs.uToast.show({
|
|
message:'添加成功'
|
|
});
|
|
uni.navigateBack({
|
|
delta:1
|
|
})
|
|
}
|
|
})
|
|
},
|
|
selectHandle(val){
|
|
this.form.acceptance = val.name
|
|
},
|
|
// 新增图片
|
|
async afterRead(event) {
|
|
// 当设置 multiple 为 true 时, file 为数组格式，否则为对象格式
|
|
// console.log(event)
|
|
// let path = event.file[0].url
|
|
// uni.getImageInfo({
|
|
// src: path,
|
|
// success:(image)=> {
|
|
// console.log(image);
|
|
// this.canvasSiz.width = image.width;
|
|
// this.canvasSiz.height = image.height;
|
|
// setTimeout(() => {
|
|
// let ctx = uni.createCanvasContext('canvas-clipper', this);
|
|
// ctx.drawImage(
|
|
// path,
|
|
// 0,
|
|
// 0,
|
|
// image.width,
|
|
// image.height
|
|
// );
|
|
// // 设置文字水印
|
|
// ctx.setFillStyle('white');
|
|
// ctx.setFontSize(30);
|
|
// ctx.fillText('抄表日期:', 20, 100);
|
|
|
|
|
|
// //再来加个时间水印
|
|
// var date = new Date();
|
|
// //这里用了uview的js如果不适配需要自行修改
|
|
// var time = this.$u.timeFormat(date, 'yyyy年mm月dd日 hh时MM分ss秒')
|
|
// ctx.setFontSize(30);
|
|
// ctx.fillText(time, 20, 140);
|
|
|
|
// ctx.draw(false, () => {
|
|
// // 导出图片
|
|
// uni.canvasToTempFilePath({
|
|
// destWidth: image.width,
|
|
// destHeight: image.height,
|
|
// canvasId: 'canvas-clipper',
|
|
// fileType: 'png',
|
|
// success:async(res)=> {
|
|
// console.log(res,"999999")
|
|
// let lists = [].concat(event.file)
|
|
// let fileListLen = this[`fileList${event.name}`].length
|
|
// lists.map((item) => {
|
|
// this[`fileList${event.name}`].push({
|
|
// ...item,
|
|
// status: 'uploading',
|
|
// message: '上传中'
|
|
// })
|
|
// })
|
|
// for (let i = 0; i < lists.length; i++) {
|
|
// const result = await this.uploadFilePromise(lists[i].url)
|
|
|
|
// if(JSON.parse(result).code==1){
|
|
// let item = this[`fileList${event.name}`][fileListLen]
|
|
// this[`fileList${event.name}`].splice(fileListLen, 1, Object.assign(item, {
|
|
// status: 'success',
|
|
// message: '',
|
|
// url: result
|
|
// }))
|
|
// fileListLen++
|
|
// }else{
|
|
// this[`fileList${event.name}`].splice(fileListLen, 1)
|
|
// }
|
|
|
|
// }
|
|
// }
|
|
// },
|
|
// //这个_this是当前页this在onload里面赋值的
|
|
// this
|
|
// );
|
|
// });
|
|
// }, 500)
|
|
|
|
|
|
// }
|
|
// })
|
|
|
|
|
|
|
|
|
|
let lists = [].concat(event.file)
|
|
let fileListLen = this[`fileList${event.name}`].length
|
|
lists.map((item) => {
|
|
this[`fileList${event.name}`].push({
|
|
...item,
|
|
status: 'uploading',
|
|
message: '上传中'
|
|
})
|
|
})
|
|
for (let i = 0; i < lists.length; i++) {
|
|
const result = await this.uploadFilePromise(lists[i].url)
|
|
|
|
if(JSON.parse(result).code==1){
|
|
let item = this[`fileList${event.name}`][fileListLen]
|
|
this[`fileList${event.name}`].splice(fileListLen, 1, Object.assign(item, {
|
|
status: 'success',
|
|
message: '',
|
|
url: result
|
|
}))
|
|
fileListLen++
|
|
}else{
|
|
this[`fileList${event.name}`].splice(fileListLen, 1)
|
|
}
|
|
|
|
}
|
|
|
|
},
|
|
//上传照片
|
|
uploadFilePromise(url) {
|
|
return new Promise((resolve, reject) => {
|
|
let a = uni.uploadFile({
|
|
url: this.baseUrl+'/api/common/upload', // 仅为示例，非真实的接口地址
|
|
filePath: url,
|
|
name: 'file',
|
|
formData: {
|
|
user: 'test',
|
|
token:getToken()
|
|
},
|
|
success: (res) => {
|
|
if(JSON.parse(res.data).code==1){
|
|
setTimeout(() => {
|
|
this.finishImageList.push({url:JSON.parse(res.data).data.fullurl,path:JSON.parse(res.data).data.url})
|
|
resolve(res.data)
|
|
}, 1000)
|
|
}else{
|
|
uni.$u.toast(JSON.parse(res.data).msg)
|
|
|
|
resolve(res.data)
|
|
}
|
|
},
|
|
fail: (res) => {
|
|
console.log(res,"rrr")
|
|
}
|
|
});
|
|
})
|
|
},
|
|
//删除图片
|
|
deletePic(event) {
|
|
// this[`fileList${event.name}`].splice(event.index, 1)
|
|
this.finishImageList.splice(event.index, 1)
|
|
},
|
|
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
.addRecord{
|
|
min-height: calc(100vh);
|
|
background-color: #ffffff;
|
|
|
|
}
|
|
/deep/.u-upload__deletable{
|
|
height: 50rpx !important;
|
|
width: 50rpx !important;
|
|
z-index:999 !important;
|
|
.u-icon__icon{
|
|
font-size: 40rpx !important;
|
|
line-height: 40rpx !important;
|
|
|
|
}
|
|
}
|
|
.btn{
|
|
line-height: 98rpx;
|
|
height: 98rpx;
|
|
background: #8EC31F;
|
|
border-radius: 10px;
|
|
// margin:0 24rpx;
|
|
text-align: center;
|
|
font-size: 30rpx;
|
|
font-family: Alibaba PuHuiTi;
|
|
font-weight: 400;
|
|
color: #FFFFFF;
|
|
margin-top:80rpx;
|
|
}
|
|
.selectStyle{
|
|
display: flex;
|
|
padding: 30rpx;
|
|
background: #FFFFFF;
|
|
border: 1px solid #E5E7EA;
|
|
border-radius: 10rpx;
|
|
}
|
|
</style>
|
|
|