455 lines
13 KiB
Vue
455 lines
13 KiB
Vue
|
<template>
|
|||
|
|
<view>
|
|||
|
|
<step-title :stepPage="stepsPage" :stepText="stepsText"></step-title>
|
|||
|
|
<view class="allview">
|
|||
|
|
<view class="card">
|
|||
|
|
<u--form labelWidth="auto" :model="dataModel" ref="wForm" class="demo-ruleForm">
|
|||
|
|
<!-- <view style="position: relative;">
|
|||
|
|
<view style="position: absolute;left: -10px;color: #3d4b70;top: -3px;">*</view>
|
|||
|
|
</view>
|
|||
|
|
|
|||
|
|
<view style="font-size: 15px; font-weight: bold;color: #3d4b70;margin-bottom: 10px;">基本信息填写</view> -->
|
|||
|
|
<u-form-item label="隐患地点" prop="CODE">
|
|||
|
|
<u--input v-model="dataModel.CODE" disabledColor="#ffffff" placeholder="请输入隐患地点" fontSize="14px" border="none" inputAlign="right">
|
|||
|
|
</u--input>
|
|||
|
|
</u-form-item>
|
|||
|
|
<u-form-item label="重大隐患" prop="CHOOSE">
|
|||
|
|
<u-switch inactiveColor="rgb(230, 230, 230)" size="24" space="4" v-model="dataModel.CHOOSE" @change="changeChoose"></u-switch>
|
|||
|
|
</u-form-item>
|
|||
|
|
<u-form-item label="问题描述" prop="EFFECTIVE">
|
|||
|
|
</u-form-item>
|
|||
|
|
<u--textarea v-model="dataModel.EFFECTIVE" placeholder="请输入描述内容" border="surround" inputAlign="left">
|
|||
|
|
</u--textarea>
|
|||
|
|
<view class="upload-title">隐患照片：</view>
|
|||
|
|
<u-upload :fileList="pictureLists" @afterRead="afterRead" @delete="deletePic" multiple :maxCount="5" style="margin-bottom: 0;" :previewFullImage="true" uploadIcon="plus"></u-upload>
|
|||
|
|
<u-form-item label="上报人" prop="PUSHNAME" v-if="stepsPage === 1">
|
|||
|
|
<u--input v-model="dataModel.PUSHNAME" disabled disabledColor="#ffffff" border="none" inputAlign="right" fontSize="14px">
|
|||
|
|
</u--input>
|
|||
|
|
</u-form-item>
|
|||
|
|
<view v-if="stepsPage === 2 ||stepsPage === 3 ">
|
|||
|
|
<u-form-item label="隐患上报人" prop="REPORTPEO">
|
|||
|
|
<u--input v-model="dataModel.REPORTPEO" disabled disabledColor="#ffffff" border="none" inputAlign="right" fontSize="14px">
|
|||
|
|
</u--input>
|
|||
|
|
</u-form-item>
|
|||
|
|
<u-form-item label="隐患确认人" prop="VERIFYPEO">
|
|||
|
|
<u--input v-model="dataModel.VERIFYPEO" disabled disabledColor="#ffffff" border="none" inputAlign="right" fontSize="14px">
|
|||
|
|
</u--input>
|
|||
|
|
</u-form-item>
|
|||
|
|
<u-form-item label="整改责任人" prop="DUTYPEO">
|
|||
|
|
<u--input v-model="dataModel.DUTYPEO" disabled disabledColor="#ffffff" border="none" inputAlign="right" fontSize="14px">
|
|||
|
|
</u--input>
|
|||
|
|
</u-form-item>
|
|||
|
|
<u-form-item label="整改期限" prop="LIMITPEO">
|
|||
|
|
<u--input v-model="dataModel.LIMITPEO" disabled disabledColor="#ffffff" border="none" inputAlign="right" fontSize="14px">
|
|||
|
|
</u--input>
|
|||
|
|
</u-form-item>
|
|||
|
|
<u-form-item label="整改验收人" prop="CHECKPEO">
|
|||
|
|
<u--input v-model="dataModel.CHECKPEO" disabled disabledColor="#ffffff" border="none" inputAlign="right" fontSize="14px">
|
|||
|
|
</u--input>
|
|||
|
|
</u-form-item>
|
|||
|
|
</view>
|
|||
|
|
<u-form-item label="整改落实人" prop="IMPLEMENTPEO" v-if="stepsPage === 3">
|
|||
|
|
<u--input v-model="dataModel.IMPLEMENTPEO" disabled disabledColor="#ffffff" border="none" inputAlign="right" fontSize="14px">
|
|||
|
|
</u--input>
|
|||
|
|
</u-form-item>
|
|||
|
|
|
|||
|
|
|
|||
|
|
|
|||
|
|
</u--form>
|
|||
|
|
</view>
|
|||
|
|
<view style="padding: 10px 16px;" v-if="stepsPage === 0" class="bottom-button">
|
|||
|
|
<u-button type="primary" @click="stepAdd" color="#3d4b70">提交</u-button>
|
|||
|
|
</view>
|
|||
|
|
<view class="sub-form" v-if="stepsPage === 1">
|
|||
|
|
<view>
|
|||
|
|
<u--form labelPosition="left" labelWidth="90px" ref="sForm" class="demo-ruleForm" size="mini">
|
|||
|
|
<u-form-item label="整改责任人" prop="DUTY" required @click="handleChange('DUTY')">
|
|||
|
|
<u--input v-model="dataModel.DUTY" disabled disabledColor="#ffffff" placeholder="请选择整改责任人" border="none" inputAlign="right" fontSize="14px">
|
|||
|
|
</u--input>
|
|||
|
|
<u-icon style="margin-left: 4px;" slot="right" name="arrow-down" size="12"></u-icon>
|
|||
|
|
</u-form-item>
|
|||
|
|
<u-form-item label="整改期限" prop="LIMIT" @click="showCheckDate1 = true;" required>
|
|||
|
|
<u--input v-model="dataModel.LIMIT" disabled disabledColor="#fff" placeholder="请选择整改期限" border="none" inputAlign="right" fontSize="14px"></u--input>
|
|||
|
|
<u-icon style="margin-left: 4px;" slot="right" name="arrow-down" size="12"></u-icon>
|
|||
|
|
</u-form-item>
|
|||
|
|
<u-form-item label="验收人" prop="CHECK" required @click="handleChange('CHECK')">
|
|||
|
|
<u--input v-model="dataModel.CHECK" disabled disabledColor="#ffffff" placeholder="请选择验收人" border="none" inputAlign="right" fontSize="14px">
|
|||
|
|
</u--input>
|
|||
|
|
<u-icon style="margin-left: 4px;" slot="right" name="arrow-down" size="12"></u-icon>
|
|||
|
|
</u-form-item>
|
|||
|
|
</u--form>
|
|||
|
|
</view>
|
|||
|
|
|
|||
|
|
</view>
|
|||
|
|
<view style="padding: 10px 16px;display: flex;flex-direction: row;" v-if="stepsPage === 1" class="bottom-button">
|
|||
|
|
<button type="default" @click="stepReduce" :plain="true"
|
|||
|
|
style="margin-right: 5px;background-color: #fff;color: #3d4b70;width: 50%;height: 40px;display: flex;align-items: center;justify-content: center;font-size: 14px;">驳回</button>
|
|||
|
|
<button type="default" @click="stepAddTwo"
|
|||
|
|
style="margin-left: 5px;background-color: #3d4b70;color: #fff;width: 50%;height: 40px;display: flex;align-items: center;justify-content: center;font-size: 14px;">提交</button>
|
|||
|
|
<!-- <u-button type="primary" @click="stepReduce" color="#3d4b70" :plain="true" style="margin-right: 5px;">上一步</u-button>
|
|||
|
|
<u-button type="primary" @click="stepAddTwo" color="#3d4b70" style="margin-left: 5px;">下一步</u-button> -->
|
|||
|
|
</view>
|
|||
|
|
<view class="sub-form" v-if="stepsPage === 2">
|
|||
|
|
|
|||
|
|
<u--form labelPosition="left" labelWidth="auto" ref="sForm" class="demo-ruleForm-thr" size="mini">
|
|||
|
|
<u-form-item label="整改落实人" prop="IMPLEMENT" required>
|
|||
|
|
<u--input v-model="dataModel.IMPLEMENT" disabled disabledColor="#ffffff" placeholder="----" border="none" inputAlign="right" fontSize="14px">
|
|||
|
|
</u--input>
|
|||
|
|
</u-form-item>
|
|||
|
|
</u--form>
|
|||
|
|
|
|||
|
|
</view>
|
|||
|
|
<view style="padding: 10px 16px;display: flex;flex-direction: row;" v-if="stepsPage === 2" class="bottom-button">
|
|||
|
|
<u-button type="primary" @click="stepAddThree" color="#3d4b70" style="margin-left: 5px;">提交</u-button>
|
|||
|
|
</view>
|
|||
|
|
|
|||
|
|
<view style="padding 10px 16px;display: flex;flex-direction: row;" v-if="stepsPage === 3" class="bottom-button">
|
|||
|
|
<u-button type="primary" @click="stepAddFour" color="#3d4b70" style="margin-left: 5px;">确认</u-button>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
<u-datetime-picker :show="showCheckDate1" mode="datetime" v-model=START_TIME @confirm="handleCheckDate1" @close="showCheckDate1 = false;" @cancel="showCheckDate1 = false;"></u-datetime-picker>
|
|||
|
|
<query-selector :show="selectorInfo.showPopup" :title="selectorInfo.title" :lists="selectorInfo.dataLists" :defaultChecked="selectorInfo.defaultChecked" @search="handleSearch" @select="handleSelected"
|
|||
|
|
@close="selectorInfo.showPopup=false" />
|
|||
|
|
</view>
|
|||
|
|
</template>
|
|||
|
|
|
|||
|
|
<script>
|
|||
|
|
import {
|
|||
|
|
mapState,
|
|||
|
|
mapMutations
|
|||
|
|
} from 'vuex'
|
|||
|
|
|
|||
|
|
import stepTitle from '@/components/custom/step-title.vue'
|
|||
|
|
import config from '../../../config/common'
|
|||
|
|
|
|||
|
|
export default {
|
|||
|
|
components: {
|
|||
|
|
stepTitle,
|
|||
|
|
},
|
|||
|
|
data() {
|
|||
|
|
return {
|
|||
|
|
stepsText: ['隐患上报', '隐患确认', '指定落实人', '验收人确认'],
|
|||
|
|
pictureLists: [],
|
|||
|
|
dataModel: {
|
|||
|
|
CODE: '',
|
|||
|
|
CHOOSE: false,
|
|||
|
|
EFFECTIVE: '',
|
|||
|
|
DUTY: '',
|
|||
|
|
LIMIT: uni.$u.timeFormat(new Date(), 'yyyy-mm-dd hh:MM'),
|
|||
|
|
CHECK: '',
|
|||
|
|
PUSHNAME: '',
|
|||
|
|
|
|||
|
|
REPORTPEO: '',
|
|||
|
|
VERIFYPEO: '',
|
|||
|
|
DUTYPEO: '',
|
|||
|
|
LIMITPEO: '',
|
|||
|
|
CHECKPEO: '',
|
|||
|
|
|
|||
|
|
IMPLEMENTPEO: '',
|
|||
|
|
|
|||
|
|
},
|
|||
|
|
stepsPage: 0,
|
|||
|
|
showCheckDate1: false,
|
|||
|
|
START_TIME: uni.$u.timeFormat(new Date(), 'yyyy-mm-dd hh:MM'),
|
|||
|
|
selectorInfo: {
|
|||
|
|
name: 'user',
|
|||
|
|
showPopup: false,
|
|||
|
|
title: '人员选择',
|
|||
|
|
dataLists: [],
|
|||
|
|
defaultChecked: []
|
|||
|
|
},
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
// onLoad(opt) {
|
|||
|
|
// this.handleGetJobActivityGet(opt)
|
|||
|
|
// },
|
|||
|
|
// onNavigationBarButtonTap(e) {
|
|||
|
|
// this.submitTemp()
|
|||
|
|
// },
|
|||
|
|
methods: {
|
|||
|
|
handleSearch(val) {
|
|||
|
|
if (val == 'DUTY') {
|
|||
|
|
this.selectorInfo.dataLists = [{
|
|||
|
|
name: '如不那',
|
|||
|
|
code: '',
|
|||
|
|
index: 1
|
|||
|
|
}, {
|
|||
|
|
name: '阿达瓦',
|
|||
|
|
code: '',
|
|||
|
|
index: 1
|
|||
|
|
}, {
|
|||
|
|
name: '阿迪王',
|
|||
|
|
code: '',
|
|||
|
|
index: 1
|
|||
|
|
}, {
|
|||
|
|
name: '人参果',
|
|||
|
|
code: '',
|
|||
|
|
index: 1
|
|||
|
|
}, {
|
|||
|
|
name: '首付',
|
|||
|
|
code: '',
|
|||
|
|
index: 1
|
|||
|
|
}, {
|
|||
|
|
name: '激发态',
|
|||
|
|
code: '',
|
|||
|
|
index: 1
|
|||
|
|
}]
|
|||
|
|
}
|
|||
|
|
if (val == 'CHECK') {
|
|||
|
|
this.selectorInfo.dataLists = [{
|
|||
|
|
name: '那',
|
|||
|
|
code: '',
|
|||
|
|
index: 2
|
|||
|
|
}, {
|
|||
|
|
name: '瓦',
|
|||
|
|
code: '',
|
|||
|
|
index: 2
|
|||
|
|
}, {
|
|||
|
|
name: '王',
|
|||
|
|
code: '',
|
|||
|
|
index: 2
|
|||
|
|
}, {
|
|||
|
|
name: '人参果',
|
|||
|
|
code: '',
|
|||
|
|
index: 2
|
|||
|
|
}, {
|
|||
|
|
name: '首付',
|
|||
|
|
code: '',
|
|||
|
|
index: 2
|
|||
|
|
}, {
|
|||
|
|
name: '激发态',
|
|||
|
|
code: '',
|
|||
|
|
index: 2
|
|||
|
|
}]
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
},
|
|||
|
|
handleSelected(e) {
|
|||
|
|
console.log(e, '12')
|
|||
|
|
this.selectorInfo.showPopup = false
|
|||
|
|
if (e.index == 1) {
|
|||
|
|
this.dataModel.DUTY = e.name
|
|||
|
|
} else {
|
|||
|
|
this.dataModel.CHECK = e.name
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
},
|
|||
|
|
handleChange(name) {
|
|||
|
|
this.selectorInfo.title = '人员选择'
|
|||
|
|
this.selectorInfo.defaultChecked = []
|
|||
|
|
this.selectorInfo.name = name
|
|||
|
|
this.selectorInfo.showPopup = true
|
|||
|
|
this.handleSearch(name)
|
|||
|
|
},
|
|||
|
|
|
|||
|
|
handleCheckDate1(e) {
|
|||
|
|
this.showCheckDate1 = false;
|
|||
|
|
this.dataModel.LIMIT = uni.$u.timeFormat(e.value, 'yyyy-mm-dd hh:MM');
|
|||
|
|
},
|
|||
|
|
async afterRead(event) {
|
|||
|
|
// 当设置 multiple 为 true 时, file 为数组格式，否则为对象格式
|
|||
|
|
let lists = [].concat(event.file)
|
|||
|
|
let fileListLen = this[`pictureLists`].length
|
|||
|
|
lists.map((item) => {
|
|||
|
|
this[`pictureLists`].push({
|
|||
|
|
...item,
|
|||
|
|
status: 'uploading',
|
|||
|
|
message: '上传中'
|
|||
|
|
})
|
|||
|
|
})
|
|||
|
|
for (let i = 0; i < lists.length; i++) {
|
|||
|
|
const result = await this.uploadFilePromise(lists[i].url)
|
|||
|
|
let item = this[`pictureLists`][fileListLen]
|
|||
|
|
this[`pictureLists`].splice(fileListLen, 1, Object.assign(item, {
|
|||
|
|
status: 'success',
|
|||
|
|
message: '',
|
|||
|
|
IMG_FILE_ID: result.imgFileID
|
|||
|
|
// url: result
|
|||
|
|
}))
|
|||
|
|
fileListLen++
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
uploadFilePromise(url) {
|
|||
|
|
const appInfoData = uni.getStorageSync('appInfo')
|
|||
|
|
const userId = appInfoData?.User?.ID || ''
|
|||
|
|
const orgId = uni.getStorageSync('orgId')
|
|||
|
|
const tenant = uni.getStorageSync('Tenant') || ''
|
|||
|
|
const remoteUrl = config.serviceHost('/PF/File/UploadFile')
|
|||
|
|
return new Promise((resolve, reject) => {
|
|||
|
|
uni.uploadFile({
|
|||
|
|
url: remoteUrl,
|
|||
|
|
filePath: url,
|
|||
|
|
fileList: url,
|
|||
|
|
name: 'file',
|
|||
|
|
formData: {
|
|||
|
|
OrgId: orgId
|
|||
|
|
},
|
|||
|
|
header: {
|
|||
|
|
Tenant: tenant,
|
|||
|
|
userid: userId
|
|||
|
|
},
|
|||
|
|
success: (res) => {
|
|||
|
|
if (res.statusCode === 200) {
|
|||
|
|
const uploadResult = JSON.parse(res.data)
|
|||
|
|
if (uploadResult.IsSuccessful) {
|
|||
|
|
resolve(uploadResult.Data)
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
});
|
|||
|
|
})
|
|||
|
|
},
|
|||
|
|
deletePic(event) {
|
|||
|
|
this[`pictureLists`].splice(event.index, 1)
|
|||
|
|
},
|
|||
|
|
changeChoose(e) {
|
|||
|
|
console.log(e, '9899989')
|
|||
|
|
// this.dataModel.CHOOSE = !this.dataModel.CHOOSE
|
|||
|
|
},
|
|||
|
|
stepAdd() {
|
|||
|
|
this.stepsPage = this.stepsPage + 1
|
|||
|
|
},
|
|||
|
|
stepAddTwo() {
|
|||
|
|
this.stepsPage = this.stepsPage + 1
|
|||
|
|
},
|
|||
|
|
stepAddThree() {
|
|||
|
|
this.stepsPage = this.stepsPage + 1
|
|||
|
|
},
|
|||
|
|
stepAddFour() {
|
|||
|
|
this.stepsPage = this.stepsPage + 1
|
|||
|
|
},
|
|||
|
|
stepReduce() {
|
|||
|
|
this.stepsPage = this.stepsPage - 1
|
|||
|
|
},
|
|||
|
|
stepReduceTwo() {
|
|||
|
|
this.stepsPage = this.stepsPage - 1
|
|||
|
|
},
|
|||
|
|
|
|||
|
|
submit() {
|
|||
|
|
|
|||
|
|
|
|||
|
|
|
|||
|
|
},
|
|||
|
|
submitTemp() {
|
|||
|
|
|
|||
|
|
|
|||
|
|
|
|||
|
|
},
|
|||
|
|
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
</script>
|
|||
|
|
|
|||
|
|
<style>
|
|||
|
|
/* @import url("../../../../style/css/editTemplate.css"); */
|
|||
|
|
|
|||
|
|
.page-wrap {
|
|||
|
|
/* padding: 16px 16px 166px; */
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.allview {
|
|||
|
|
padding: 0px 0px 180px 0px;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.card {
|
|||
|
|
/* margin-bottom: 18px; */
|
|||
|
|
margin: 20px 16px 10px 16px;
|
|||
|
|
/* border: 1px solid #EBEEF5; */
|
|||
|
|
padding: 20px 30px 10px 30px;
|
|||
|
|
/* box-shadow: rgba(0, 0, 0, 0.08) 0px 0px 3px 1px; */
|
|||
|
|
background-color: #ffffff;
|
|||
|
|
border-radius: 10px;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.bottom-button {
|
|||
|
|
position: fixed;
|
|||
|
|
bottom: 0;
|
|||
|
|
left: 0;
|
|||
|
|
width: 100%;
|
|||
|
|
padding: 10px 16px;
|
|||
|
|
box-sizing: border-box;
|
|||
|
|
background: #edf1fd;
|
|||
|
|
z-index: 999;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.bottom-save {
|
|||
|
|
position: fixed;
|
|||
|
|
bottom: 60px;
|
|||
|
|
left: 0;
|
|||
|
|
width: 100%;
|
|||
|
|
padding: 10px 16px 0px 16px;
|
|||
|
|
box-sizing: border-box;
|
|||
|
|
background: #edf1fd;
|
|||
|
|
z-index: 999;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.upload-title {
|
|||
|
|
font-size: 14px;
|
|||
|
|
color: #8e8b9c;
|
|||
|
|
line-height: 22px;
|
|||
|
|
padding: 8px 0px;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/* .demo-ruleForm-thr>>>.u-textarea {
|
|||
|
|
padding: 9px 9px 25px 9px;
|
|||
|
|
}
|
|||
|
|
*/
|
|||
|
|
.demo-ruleForm-thr>>>.u-form-item__body__left__content__label {
|
|||
|
|
font-size: 14px;
|
|||
|
|
color: #8e8b9c;
|
|||
|
|
margin-right: 20px;
|
|||
|
|
/* justify-content: flex-start; */
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.demo-ruleForm-thr>>>.u-form-item__body__left__content__ {
|
|||
|
|
left: -11px;
|
|||
|
|
top: 0px
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.demo-ruleForm-thr>>>.u-textarea__field {
|
|||
|
|
font-size: 14px;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.demo-ruleForm-thr>>>.u-cell__title-text {
|
|||
|
|
font-size: 14px;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
|
|||
|
|
/* .page-wrap>>>.u-upload__button {
|
|||
|
|
margin-bottom: 0;
|
|||
|
|
} */
|
|||
|
|
|
|||
|
|
.demo-ruleForm>>>.u-form-item__body__left__content__label {
|
|||
|
|
font-size: 14px;
|
|||
|
|
color: #8e8b9c;
|
|||
|
|
/* justify-content: flex-start; */
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.demo-ruleForm>>>.u-form-item__body__left__content__ {
|
|||
|
|
left: -11px;
|
|||
|
|
top: 0px
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.demo-ruleForm>>>.u-textarea__field {
|
|||
|
|
font-size: 14px;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.demo-ruleForm>>>.u-cell__title-text {
|
|||
|
|
font-size: 14px;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.demo-ruleForm>>>.u-form-item__body__right__content__slot {
|
|||
|
|
justify-content: flex-end;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.full-upload-border>>>.u-line {
|
|||
|
|
border-bottom: 0px !important;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.sub-form {
|
|||
|
|
margin: 20px 16px 80px 16px;
|
|||
|
|
padding: 20px 30px 20px 30px;
|
|||
|
|
background-color: #ffffff;
|
|||
|
|
border-radius: 10px;
|
|||
|
|
}
|
|||
|
|
</style>
|