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.
369 lines
10 KiB
369 lines
10 KiB
10 months ago
|
<template>
|
||
|
<view class="" id="page">
|
||
|
<view class="Width100 Box BorderBox">
|
||
|
<top-title :is-show-left="true" :title="'治理结果'" class="custom_bg">
|
||
|
</top-title>
|
||
|
</view>
|
||
|
<view class="navBar-top">
|
||
|
|
||
|
</view>
|
||
|
<view class="form-content">
|
||
|
<view>
|
||
|
<uni-forms border v-for="(itemData,indexData) in hiddenDangerList" :key="indexData"
|
||
|
style="margin-bottom: 12px;">
|
||
|
<view class="formBox">
|
||
|
<view class="label-box">
|
||
|
<view class="border"></view> 问题{{formatIndex(indexData)}}
|
||
|
</view>
|
||
|
<view style="margin-bottom:20rpx; display: flex; align-items: baseline">
|
||
|
<uni-forms-item label="问题类型" label-position="top" label-width="80px" />
|
||
|
<view class="value" style="font-size:28rpx">
|
||
|
{{ itemData.dangerProblem}}
|
||
|
</view>
|
||
|
</view>
|
||
|
|
||
|
<view style="margin-bottom: 30rpx;">
|
||
|
<view class="investigation-item" style="width: 100%; padding: 0">
|
||
|
<view class="detail-item">
|
||
|
<uni-forms-item label="问题描述" label-position="top" label-width="200px" />
|
||
|
<u-textarea placeholder="- -" :disabled="true" border="none"
|
||
|
v-model="itemData.hdDesc" style="margin-top: -20rpx;" />
|
||
|
</view>
|
||
|
</view>
|
||
|
<view class="investigation-item" style="width: 100%; padding: 0">
|
||
|
<view class="detail-item">
|
||
|
<uni-forms-item label="隐患图片" label-position="top" label-width="200px" />
|
||
|
<u-upload :fileList="itemData.hdPic" :disabled="true" style="margin-top: -20rpx;"
|
||
|
name="1" :maxCount="10"></u-upload>
|
||
|
</view>
|
||
|
</view>
|
||
|
<view class="investigation-item" style="width: 100%; padding: 0">
|
||
|
<view class="detail-item">
|
||
|
<uni-forms-item label="补充信息" label-position="top" label-width="200px" />
|
||
|
<u-textarea :disabled="true" placeholder="- -" border="none"
|
||
|
v-model="itemData.hdInfo" style="margin-top: -20rpx;" />
|
||
|
</view>
|
||
|
</view>
|
||
|
<view class="investigation-item" style="width: 100%; padding: 0">
|
||
|
<view class="detail-item detail-item-flex" style="align-items: baseline;">
|
||
|
<uni-forms-item label="治理措施" label-position="top" label-width="100px" required />
|
||
|
<upload-file @fileSuccess="fileSuccess.call(this,$event, indexData)"
|
||
|
@fileDelete="fileDelete.call(this, $event, indexData)"
|
||
|
:fileList="itemData.zlMeasure" />
|
||
|
</view>
|
||
|
</view>
|
||
|
<view class="investigation-item " style="width: 100%; padding: 0">
|
||
|
<view class="detail-item">
|
||
|
<uni-forms-item label="治理后照片" label-position="top" label-width="100px" required />
|
||
|
<u-upload :fileList="itemData.zlPic" style="margin-top: -20rpx;" name="1"
|
||
|
:maxCount="9" @afterRead="afterRead.call(this, $event,indexData)"
|
||
|
@delete="deletePic.call(this, $event,indexData)"></u-upload>
|
||
|
</view>
|
||
|
</view>
|
||
|
<view class="investigation-item" style="width: 100%; padding: 0">
|
||
|
<view class="detail-item detail-item-flex" @click="handleOpenDate(indexData)">
|
||
|
<uni-forms-item label="治理时间" label-position="top" label-width="100px" required />
|
||
|
<view class="value" :class="itemData.zlTime ? 'value-date' : 'value-placeholder'">
|
||
|
{{itemData.zlTime || '请选择入治理时间'}}
|
||
|
</view>
|
||
|
</view>
|
||
|
</view>
|
||
|
<view class="investigation-item" style="width: 100%; padding: 0">
|
||
|
<view class="detail-item detail-item-flex">
|
||
|
<uni-forms-item label="治理单位" label-position="top" label-width="100px" required />
|
||
|
<input class="BorderNone Height100 formInput"
|
||
|
style="font-size: 14px; text-align: right;" placeholder-style="fontSize: 14px"
|
||
|
v-model="itemData.zlUnit" placeholder="请输入治理单位" />
|
||
|
</view>
|
||
|
</view>
|
||
|
</view>
|
||
|
|
||
|
</view>
|
||
|
</uni-forms>
|
||
|
</view>
|
||
|
</view>
|
||
|
<three class="footer-buttons" :type="'view'" first-text="取消" next-text="确认" :second-primary="true"
|
||
|
@first="handleBack" @last="handleSubmit" />
|
||
|
<u-datetime-picker :show="dateShow" :value="dateTime" :maxDate="maxDate" @cancel="dateShow = false"
|
||
|
@confirm="handleConfirm" mode="datetime" :defaultIndex="[1, 2, 1, 1, 1]"></u-datetime-picker>
|
||
|
</view>
|
||
|
</template>
|
||
|
|
||
|
<script>
|
||
|
import TopTitle from "../../components/top-title";
|
||
|
import Three from "../../components/bottom-button/three.vue";
|
||
|
import uploadFile from "../../components/upload-file.vue";
|
||
|
const indexList = ['一', '二', '三', '四', '五', '六', '七', '八', '九']
|
||
|
export default {
|
||
|
components: {
|
||
|
TopTitle,
|
||
|
Three,
|
||
|
uploadFile
|
||
|
},
|
||
|
data() {
|
||
|
return {
|
||
|
hiddenDangerList: [],
|
||
|
businessId: '',
|
||
|
dateShow: false,
|
||
|
dateTime: this.formatTime(),
|
||
|
curIndex: 0,
|
||
|
maxDate: null
|
||
|
}
|
||
|
},
|
||
|
onLoad(e) {
|
||
|
this.businessId = e.id
|
||
|
this.initPage()
|
||
|
},
|
||
|
methods: {
|
||
|
handleConfirm(value) {
|
||
|
this.$set(this.hiddenDangerList[this.curIndex], 'zlTime', this.formatTime(value.value))
|
||
|
this.dateShow = false
|
||
|
},
|
||
|
handleOpenDate(index) {
|
||
|
this.curIndex = index
|
||
|
this.dateTime = this.hiddenDangerList[index].zlTime || this.formatTime()
|
||
|
this.$nextTick(() => {
|
||
|
this.maxDate = this.getCurTimeForX()
|
||
|
this.dateShow = true
|
||
|
})
|
||
|
},
|
||
|
getCurTimeForX() {
|
||
|
return (new Date()).getTime()
|
||
|
},
|
||
|
formatTime(time) {
|
||
|
console.log(time)
|
||
|
return this.$moment(time).format('YYYY-MM-DD HH:mm')
|
||
|
},
|
||
|
fileSuccess(result, index) {
|
||
|
console.log(result, index)
|
||
|
this.hiddenDangerList[index].zlMeasure.push({
|
||
|
id: this.uuid(),
|
||
|
fileName: result.fileName,
|
||
|
filePath: result.result
|
||
|
})
|
||
|
|
||
|
},
|
||
|
fileDelete(fileIndex, index) {
|
||
|
this.hiddenDangerList[index].zlMeasure.splice(
|
||
|
fileIndex,
|
||
|
1,
|
||
|
);
|
||
|
},
|
||
|
initPage() {
|
||
|
this.$.showLoading()
|
||
|
this.$request
|
||
|
.globalRequest(
|
||
|
"/hiddenDanger/highDanger/getUserHiddenDangerList", {
|
||
|
// nuserid: this.$.getData("token"),
|
||
|
pcType: 2,
|
||
|
businessId: this.businessId
|
||
|
},
|
||
|
"GET"
|
||
|
)
|
||
|
.then((res) => {
|
||
|
if (res.code === 200) {
|
||
|
this.hiddenDangerList = res.result.map(item => ({
|
||
|
...item,
|
||
|
hdPic: item.hdPic ? item.hdPic.split(',').map(item => ({
|
||
|
url: item
|
||
|
})) : [],
|
||
|
zlPic: [],
|
||
|
zlMeasure: []
|
||
|
}))
|
||
|
}
|
||
|
}).finally(() => {
|
||
|
this.$.hideLoading()
|
||
|
})
|
||
|
},
|
||
|
formatIndex(index) {
|
||
|
return indexList[index]
|
||
|
},
|
||
|
//获取随机id
|
||
|
uuid(len, binary) {
|
||
|
len = !len ? 36 : len;
|
||
|
binary = !binary ? 16 : binary;
|
||
|
return "xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx"
|
||
|
.replace(/[xy]/g, function(c) {
|
||
|
var r = (Math.random() * binary) | 0,
|
||
|
v = c == "x" ? r : (r & 0x3) | 0x8;
|
||
|
return v.toString(binary);
|
||
|
})
|
||
|
.substring(0, len);
|
||
|
},
|
||
|
deletePic(event, index) {
|
||
|
this.hiddenDangerList[index].zlPic.splice(event.index, 1);
|
||
|
},
|
||
|
uploadFilePromise(url) {
|
||
|
return new Promise((resolve, reject) => {
|
||
|
let a = uni.uploadFile({
|
||
|
url: this.$.baseUrl + "/hiddenDanger/ftp/uploadFileToFtp", // 仅为示例,非真实的接口地址
|
||
|
filePath: url,
|
||
|
name: "file",
|
||
|
success: (res) => {
|
||
|
resolve(res.data);
|
||
|
},
|
||
|
});
|
||
|
});
|
||
|
},
|
||
|
async afterRead(event, index) {
|
||
|
console.log(event, index)
|
||
|
// 当设置 multiple 为 true 时, file 为数组格式,否则为对象格式
|
||
|
const id = this.uuid();
|
||
|
this.hiddenDangerList[index].zlPic.push({
|
||
|
id,
|
||
|
...event.file,
|
||
|
status: "uploading",
|
||
|
message: "上传中",
|
||
|
});
|
||
|
const result = await this.uploadFilePromise(event.file.url);
|
||
|
const resultInfo = JSON.parse(result);
|
||
|
const fileIndex = this.hiddenDangerList[index].zlPic.findIndex((v) => v.id === id);
|
||
|
if (resultInfo.code == 200) {
|
||
|
this.hiddenDangerList[index].zlPic.splice(
|
||
|
fileIndex,
|
||
|
1,
|
||
|
Object.assign(event.file, {
|
||
|
status: "success",
|
||
|
message: "",
|
||
|
result: resultInfo,
|
||
|
url: resultInfo.result,
|
||
|
|
||
|
})
|
||
|
);
|
||
|
console.log(this.hiddenDangerList[index].zlPic)
|
||
|
} else {
|
||
|
this.$.toast("上传失败");
|
||
|
this.hiddenDangerList[index].zlPic.splice(
|
||
|
fileIndex,
|
||
|
1,
|
||
|
);
|
||
|
}
|
||
|
},
|
||
|
handleBack() {
|
||
|
this.$.back(1)
|
||
|
},
|
||
|
getFormatData() {
|
||
|
return this.hiddenDangerList.map(item => ({
|
||
|
zlMeasure: item.zlMeasure.map(item => item.filePath).join(','),
|
||
|
zlPic: item.zlPic.map(item => item.url).join(','),
|
||
|
zlUnit: item.zlUnit,
|
||
|
zlTime: item.zlTime,
|
||
|
hdTerm: item.hdTerm
|
||
|
}))
|
||
|
},
|
||
|
validDate(data) {
|
||
|
if (!data.length) return false
|
||
|
return data.reduce((result, item) => {
|
||
|
if (!result) return false
|
||
|
const {
|
||
|
zlMeasure,
|
||
|
zlPic,
|
||
|
zlUnit,
|
||
|
zlTime
|
||
|
} = item
|
||
|
if (zlMeasure && zlPic && zlUnit && zlTime) {
|
||
|
return true
|
||
|
}
|
||
|
return false
|
||
|
}, true)
|
||
|
},
|
||
|
handleSubmit() {
|
||
|
const formData = this.getFormatData()
|
||
|
console.log({
|
||
|
businessId: this.businessId,
|
||
|
nuserid: this.$.getData('token'),
|
||
|
describe: formData
|
||
|
})
|
||
|
if (this.validDate(formData)) {
|
||
|
this.$.showLoading()
|
||
|
this.$request.globalRequest('/hiddenDanger/government/saveGovernment', {
|
||
|
businessId: this.businessId,
|
||
|
nuserid: this.$.getData('token'),
|
||
|
describe: formData
|
||
|
}, 'post').then(res => {
|
||
|
if (res.code === 200) {
|
||
|
console.log('提交成功', res)
|
||
|
this.$.toast('提交成功')
|
||
|
setTimeout(() => {
|
||
|
this.handleBack()
|
||
|
}, 500)
|
||
|
}
|
||
|
}).finally(() => {
|
||
|
this.$.hideLoading()
|
||
|
})
|
||
|
} else {
|
||
|
this.$.toast('请填写完整的表单必填项*')
|
||
|
}
|
||
|
}
|
||
|
}
|
||
|
}
|
||
|
</script>
|
||
|
|
||
|
<style lang="scss" scoped>
|
||
|
page {
|
||
|
background: #F6F8FA;
|
||
|
font-size: 14px;
|
||
|
}
|
||
|
|
||
|
.navBar-top {
|
||
|
height: calc(var(--status-bar-height) + 88rpx);
|
||
|
}
|
||
|
|
||
|
.form-content {
|
||
|
padding-bottom: 120rpx;
|
||
|
}
|
||
|
|
||
|
.formBox {
|
||
|
margin: 30rpx 20rpx;
|
||
|
border: 1px solid #e6e6e6;
|
||
|
background: #ffffff;
|
||
|
padding: 0 20rpx 20rpx;
|
||
|
box-sizing: border-box;
|
||
|
|
||
|
/deep/ .uni-forms-item--border .uni-forms-item__content {
|
||
|
justify-content: flex-end;
|
||
|
text-align: right;
|
||
|
}
|
||
|
|
||
|
.photo {
|
||
|
width: 100%;
|
||
|
|
||
|
image {
|
||
|
width: 100%;
|
||
|
}
|
||
|
}
|
||
|
}
|
||
|
|
||
|
.label-box {
|
||
|
display: flex;
|
||
|
align-items: center;
|
||
|
height: 110rpx;
|
||
|
font-size: 30rpx;
|
||
|
font-weight: 600;
|
||
|
|
||
|
.border {
|
||
|
background-color: #2663BF;
|
||
|
height: 35rpx;
|
||
|
width: 6rpx;
|
||
|
margin-right: 14rpx;
|
||
|
}
|
||
|
}
|
||
|
|
||
|
.detail-item-flex {
|
||
|
display: flex;
|
||
|
align-items: center;
|
||
|
justify-content: space-between;
|
||
|
}
|
||
|
|
||
|
.uni-forms-item--border {
|
||
|
border: none;
|
||
|
}
|
||
|
|
||
|
.investigation-item {
|
||
|
border-top: 1px solid #eee;
|
||
|
}
|
||
|
|
||
|
.value-placeholder {
|
||
|
color: #B4BAC9
|
||
|
}
|
||
|
</style>
|