an_xiao/police_uniapp/pagesD/workreceipt/workreceipt.vue

275 lines
7.0 KiB
Vue

<template>
<view class="workreceipt">
<view>
根据{{getFullYears}}{{getMonths}}{{getDates}}日发来的
<spna style="color: red;">(治安防范建议书)</spna>所列治安隐患我单位采取以下措施加以整改:
</view>
<!-- 签名 -->
<view>
<navigator :url="`/pages/signature/signature?index=${4}`" hover-class="navigator-hover">
<u-button>签名</u-button>
</navigator>
<image v-if="mycanvasValues" :src=" mycanvasValues"></image>
</view>
<view>
<u--form labelWidth="150rpx" labelAlign="right">
<u-form-item label="整改描述:" prop="problemDesc" borderBottom>
<u--textarea :maxlength="-1" v-model="problemDesc" placeholder="请输入内容" autoHeight></u--textarea>
</u-form-item>
<u-form-item label="整改上传:" borderBottom>
<view style="color: red;">一次只能上传六张</view>
</u-form-item>
</u--form>
</view>
<view>
<u-upload width="100px" height="100px" :fileList="fileList3" @afterRead="afterRead" @delete="deletePic"
@clickPreview="clickPreview" name="3" multiple :maxCount="6" ></u-upload>
</view>
<u-button @click="pendingOperateList">提交</u-button>
</view>
</template>
<script>
import {
getpendingOperate,
getwordOrder
} from '@/api/login';
import {
mapGetters
} from 'vuex';
import {
timestampFormatTime
} from '@/utils/index.js';
export default {
data() {
return {
data: '',
dataList: [],
problemDesc: '',
fileList3: [],
baseURl: 'https://www.lonsungsh.com:8083',
imageUrlsDate: [],
mycanvasValues: '',
name: undefined
};
},
onLoad(val) {
this.name = val.index
console.log(val);
},
beforeDestroy(){
uni.removeStorage({key:'mycanvas'})
},
computed: {
// 拿取vuex数据
...mapGetters({
userInfo: 'users/getLoginInfo',
}),
getFullYears: function() {
return this.dataList[0] && this.dataList[0].timestamp.slice(0, 4).slice(0, 4) ? this.dataList[0]
.timestamp.slice(0, 4).slice(0, 4) : new Date().getFullYear()
},
getMonths: function() {
return this.dataList[0] && this.dataList[0].timestamp.slice(5, 7) ? this.dataList[0].timestamp.slice(5,
7) : new Date().getMonth() + 1
},
getDates: function() {
return this.dataList[0] && this.dataList[0].timestamp.slice(8, 10) ? this.dataList[0].timestamp.slice(
8, 10) : new Date().getDate()
}
},
onShow() {
const value = uni.getStorageSync("Security");
console.log(value, '111');
this.data = value&& value[0]
console.log(this.data);
this.mycanvasValues = uni.getStorageSync("mycanvas");
},
mounted() {
getwordOrder({
station: this.userInfo.station,
brigade: '长沙芙蓉区'
}).then((res) => {
if (res.data) {
this.dataList = res.data
}
})
},
methods: {
deletePic(event) {
const keyDelete = event.index
let UrlsDateLIst = this.imageUrlsDate.filter((value, index, arr) => index !== keyDelete);
this.imageUrlsDate = UrlsDateLIst;
this[`fileList${event.name}`].splice(event.index, 1)
},
clickPreview(event) {
const {index} = event.currentTarget.dataset
console.log(index);
uni.previewImage({
urls: this.imageUrlsDate,
current: this.imageUrlsDate
})
},
async afterRead(event) {
// 当设置 multiple 为 true 时, file 为数组格式,否则为对象格式
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)
let item = this[`fileList${event.name}`][fileListLen]
this[`fileList${event.name}`].splice(fileListLen, 1, Object.assign(item, {
status: 'success',
message: '',
url: result
}))
fileListLen++
}
},
uploadFilePromise(url) {
var that = this;
const picUploadData = {
creator: that.userInfo.name,
business: 'school.revise',
type: 'image',
deviceid: that.userInfo.id,
createtime: timestampFormatTime(),
description: '',
comment: ''
};
return new Promise((resolve, reject) => {
let a = uni.uploadFile({
url: that.baseURl + '/mdev/picture/upload',
filePath: url,
name: 'file',
header: {
'Content-Type': 'multipart/form-data;charset=utf-8'
},
formData: {
jsondata: JSON.stringify(picUploadData),
},
success: (res) => {
setTimeout(() => {
const resImage = JSON.parse(res.data)?.data;
if (!that.imageUrlsDate.includes(resImage.uri)) {
that.imageUrlsDate.push(resImage.uri);
}
resolve(that.imageUrlsDate)
}, 1000)
}
});
})
},
pendingOperateList() {
try {
console.log(this.data);
if (this.data !== undefined) {
var that = this;
const dataList = {
recordId: "",
itemId: that.data && that.data.id,
eventType: 'revise',
userAccount: '',
userName: '',
userType: '',
userSignature: that.mycanvasValue, //签名图片
processDesc: that.problemDesc, //描述
processUrls: JSON.stringify(that.imageUrlsDate), //整改后图片
timestamp: timestampFormatTime(),
station: that.data && that.data.station,
brigade: that.data && that.data.brigade,
detachment: that.data && that.data.detachment,
borough: that.data && that.data.borough
}
if (that.fileList3.length == 0) {
uni.showToast({
title: '请先上传图片',
icon: 'none',
duration: 2000
});
return;
}
getpendingOperate(dataList).then((res) => {
if (!res.code) {
uni.showLoading({
title: '整改中',
})
setTimeout(() => {
uni.hideLoading()
uni.showToast({
title: '整改成功',
icon: 'success',
mask: true,
success() {
setTimeout(() => {
uni.switchTab({
url: `/pages/securityCheck/securityCheck`
});
}, 1000)
uni.removeStorage({key:'mycanvas'})
}
});
}, 1000)
}
}).catch(() => {})
} else {
uni.showToast({
title: '无整改项',
icon: 'none',
duration: 2000,
success(){
setTimeout(() => {
uni.switchTab({
url: `/pages/securityCheck/securityCheck`
});
}, 1000)
uni.removeStorage({key:'mycanvas'})
}
});
}
} catch (e) {
console.log(e);
//错误
}
},
},
}
</script>
<style lang="scss" scoped>
.workreceipt {
padding: 15px;
/deep/ .u-button {
// width: 250rpx;
height: 25px;
line-height: 25px;
font-size: 12px;
margin: 0;
color: #fff;
border: none;
border: 1px solid #4e87ff;
background-color: #4e87ff;
}
}
// /deep/.u-upload__wrap__preview__image {
// width: 150px;
// height: 150px;
// }
</style>