factory_mp_old/pages/workSpace/opls/usecl.vue

745 lines
19 KiB
Vue
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<template>
<view class="list-body">
<uni-nav-bar @clickLeft="goBack()" class="nav-bar" height="110rpx" leftWidth="400rpx" leftText="添加作业许可证"
leftIcon="left" border backgroundColor="#2cade8" color="#fff" fixed statusBar shadow></uni-nav-bar>
<view class="form-info">
<view class="form-item border-bottom" style="height: 100rpx;">
<view class="">
<text class="form-left-text">关联作业</text>
</view>
<view class="form-right">
<view>{{operationName}}</view>
</view>
</view>
<view class="form-item" style="height: 100rpx;">
<view class="">
<text class="form-left-text">许可证类型</text>
</view>
<view class="form-right">
<view>临时用电</view>
</view>
</view>
</view>
<view class="form-info">
<view class="form-content ">
<view class="form-item border-bottom">
<view class="form-left">
<text class="star">*</text>
<text class="form-left-text">开始时间</text>
</view>
<view class="form-right form-date">
<uni-datetime-picker
v-model="formData.start_time"
type="datetime"
:hide-second="true"
/>
</view>
</view>
<view class="form-item border-bottom">
<view class="form-left">
<text class="star">*</text>
<text class="form-left-text">结束时间</text>
</view>
<view class="form-right form-date">
<uni-datetime-picker
v-model="formData.end_time"
type="datetime"
:hide-second="true"
/>
</view>
</view>
<view class="form-item border-bottom">
<view class="form-left">
<text class="star">*</text>
<text class="form-left-text">作业部门</text>
</view>
<view class="form-right" style="position: relative;">
<ba-tree-picker ref="deptDoPicker" :multiple='false' @select-change="deptDoChange" title="选择作业部门"
:localdata="depRange" valueKey="id" textKey="name" childrenKey="children"/>
<view @click="showDeptDoPicker" style="position: relative;display: flex;">
<text type="text" @click="showDeptDoPicker">{{dept_do_name}}</text>
<uni-icons style="position: absolute; right: 0;" @click="showDeptDoPicker" type="arrowright" color="#999999"/>
</view>
</view>
</view>
<view class="form-item border-bottom">
<view class="form-left">
<text class="star">*</text>
<text class="form-left-text">作业负责人</text>
</view>
<view class="form-right" style="position: relative;">
<ba-tree-picker ref="charger_Picker" :multiple='false' @select-change="select_charger_Change" title="选择作业负责人"
:localdata="vuex_userRange" valueKey="id" textKey="name" childrenKey="children" :selectParent='false'/>
<view @click="showChargerPicker" style="position: relative;display: flex;">
<text type="text" @click="showChargerPicker">{{charger_name}}</text>
<uni-icons style="position: absolute; right: 0;" @click="showChargerPicker" type="arrowright" color="#999999"/>
</view>
</view>
</view>
<view class="form-item border-bottom">
<view class="form-left">
<text class="star">*</text>
<text class="form-left-text">作业监护人</text>
</view>
<view class="form-right" style="position: relative;">
<ba-tree-picker ref="monitor_Picker" :multiple='false' @select-change="select_monitor_Change" title="选择作业监护人"
:localdata="vuex_userRange" valueKey="id" textKey="name" childrenKey="children" :selectParent='false'/>
<view @click="showMonitorPicker" style="position: relative;display: flex;">
<text type="text" @click="showMonitorPicker">{{monitor_name}}</text>
<uni-icons style="position: absolute; right: 0;" @click="showMonitorPicker" type="arrowright" color="#999999"/>
</view>
</view>
</view>
<view class="form-item border-bottom">
<view class="form-left">
<text class="star">*</text>
<text class="form-left-text">供电制式</text>
</view>
<view class="form-right">
<uni-data-select v-model="formData.level" :localdata="leveloptions">
</uni-data-select>
</view>
</view>
<view class="form-item border-bottom">
<view class="form-left">
<text class="star">*</text>
<text class="form-left-text">用电功率</text>
</view>
<view class="form-right">
<input type="number" v-model="formData.power"
placeholder="请输入" />
</view>
</view>
<view class="form-item border-bottom">
<view class="form-left">
<text class="star">*</text>
<text class="form-left-text">用电地点</text>
</view>
<view class="form-right">
<input type="text" v-model="formData.power_to" maxlength="50"
placeholder="请输入" />
</view>
</view>
<view class="form-item border-bottom">
<view class="form-left">
<text class="star">*</text>
<text class="form-left-text">工作类型</text>
</view>
<view class="form-right">
<uni-data-select v-model="formData.work_type" :localdata="workTypeOptions">
</uni-data-select>
</view>
</view>
<view class="form-item border-bottom">
<view class="form-left">
<text class="star">*</text>
<text class="form-left-text">电源接入点</text>
</view>
<view class="form-right form-date">
<input type="text" v-model="formData.power_from" maxlength="50"
placeholder="请输入" />
</view>
</view>
<view class="form-item border-bottom">
<view class="form-left">
<text class="star">*</text>
<text class="form-left-text">用电开始</text>
</view>
<view class="form-right form-date">
<uni-datetime-picker
v-model="formData.power_start_time"
type="datetime"
:hide-second="true"
/>
</view>
</view>
<view class="form-item border-bottom">
<view class="form-left">
<text class="star">*</text>
<text class="form-left-text">用电截止</text>
</view>
<view class="form-right form-date">
<uni-datetime-picker
v-model="formData.power_end_time"
type="datetime"
:hide-second="true"
/>
</view>
</view>
<view class="form-item border-bottom">
<view class="form-left">
<text class="star">*</text>
<text class="form-left-text">工作时间</text>
</view>
<view class="form-right form-date">
<uni-datetime-picker
v-model="formData.work_time"
type="datetime"
:hide-second="true"
/>
</view>
</view>
<view class="form-item border-bottom">
<view class="form-left">
<text class="star">*</text>
<text class="form-left-text">验收时间</text>
</view>
<view class="form-right form-date">
<uni-datetime-picker
v-model="formData.accept_time"
type="datetime"
:hide-second="true"
/>
</view>
</view>
<view class="form-item border-bottom" style="height: fit-content;">
<view class="form-left">
<text class="star">*</text>
<text class="form-left-text">风险选择</text>
<!-- risks_checked -->
</view>
<view class="form-right">
<checkbox-group @change="checkboxRiskChange">
<label v-for="(item,index) in risklist" :key="item.value">
<checkbox :value="item.id" :checked="item.checked" />{{item.name}}
</label>
</checkbox-group>
</view>
</view>
<view class="form-item border-bottom">
<view class="form-left">
<text class="star">*</text>
<text class="form-left-text">其他风险</text>
</view>
<view class="form-right">
<input type="text" v-model="formData.other_risk" maxlength="50" placeholder="请输入" />
</view>
</view>
<view class="form-item border-bottom" style="height: fit-content;">
<view class="form-left">
<text class="star">*</text>
<text class="form-left-text">措施选择</text>
<!-- measures_checked -->
</view>
<view class="form-right">
<checkbox-group @change="checkboxMeasuresChange">
<label v-for="(item,index) in measurelist" :key="item.value"
style="margin-right: 20rpx;margin-bottom: 20rpx;">
<checkbox :value="item.id" :checked="item.checked" />{{item.name}}
</label>
</checkbox-group>
</view>
</view>
<view class="form-item border-bottom">
<view class="form-left">
<text class="star">*</text>
<text class="form-left-text">其他应急处置</text>
</view>
<view class="form-right">
<input type="text" v-model="formData.other_emr" maxlength="50" placeholder="请输入" />
</view>
</view>
</view>
<view class="form-info">
<view class="form-item " style="height: fit-content;">
<view class="title">照片</view>
<view style="flex: 3;">
<u-upload :action="vuex_apifile" :header="header" ref="uUpload"
:file-list="fileList" max-count="9" @on-success="imgUpSuccess"></u-upload>
</view>
</view>
</view>
</view>
<view class="btn">
<button type="primary" class="save-btn" @click="saveSubmit">下一步</button>
</view>
</view>
</template>
<script>
import baTreePicker from "../../comm/ba-tree-picker/ba-tree-picker.vue";
import nonNullCheck from '../../../utils/nonNullCheck.js';
import resetData from '../../../utils/common.js';
export default {
name: "usecl",
components: {
baTreePicker
},
data() {
return {
formData: {
id: "",
start_time: null,
end_time: null,
power_start_time:null,
power_end_time:null,
work_time:null,
accept_time:null,
operation: "",
cate: "",
level: '',
dept_do: '',
charger: '',
monitor: '',
other_emr: '',
other_risk: '',
risks_checked: [],
measures_checked: [],
},
header: {},
oplId: null,
operationName: '',
oplCateName: '',
fileList: [],
risklist: [],
measurelist: [],
range: [],
userRange: [],
//部门
depRange: [],
leveloptions: [{
value: "单项",
text: "单项"
},
{
value: "三相四线",
text: "三相四线"
},
{
value: "三相五线",
text: "三相五线"
},
],
workTypeOptions: [
{
value: "安装",
text: "安装"
},
{
value: "拆除",
text: "拆除"
}
],
dept_do_name:'',
charger_name:'',
monitor_name:'',
}
},
onLoad(params) {
// debugger;
console.log(params)
this.operationId = params.operationId;
this.oplcateId = params.oplcateId;
this.type = params.type;
if (params.oplId) {
this.oplId = params.oplId;
this.formData.id = params.oplId;
this.getOplDetail();
}else{
console.log('s', this.vuex_user.belong_dept)
this.formData.dept_do = this.vuex_user.belong_dept
}
this.formData.cate = this.oplcateId;
this.formData.operation = this.operationId;
},
onShow() {
debugger;
this.getOperation();
this.getOplcates();
this.getdept();
this.getRange();
// this.getUserRange();
this.getHeader();
},
methods: {
showDeptDoPicker() {
this.$refs.deptDoPicker._show();
},
showChargerPicker() {
this.$refs.charger_Picker._show();
},
showMonitorPicker() {
this.$refs.monitor_Picker._show();
},
deptDoChange(ids, names) {
this.formData.dept_do = ids[0];
this.dept_do_name = names;
},
select_charger_Change(ids, names) {
this.formData.charger = ids[0];
this.charger_name = names;
},
select_monitor_Change(ids, names) {
this.formData.monitor = ids[0];
this.monitor_name = names;
},
getHeader() {
this.header = {
Authorization: "Bearer " + this.vuex_token
}
},
imgUpSuccess(data,index,lists){
this.fileList=lists;
},
//获取工作operation
getOperation() {
let that = this;
that.$u.api.operationItem(that.operationId).then((res) => {
that.formData.start_time = res.start_time; //作业开始时间
that.formData.end_time = res.end_time; //作业结束时间
that.operationName = res.name; //作业
console.log(res);
});
},
timeFix(time){
if(time.length){}else{}
},
getOplDetail(){
let that = this;
that.$u.api.oplItem(that.oplId).then((res) => {
that.formData = res; //作业开始时间
that.operationName = res.operation_.name;
that.dept_do_name = res.dept_do_.name;
that.charger_name = res.charger_.name;
that.monitor_name = res.monitor_.name;
res.create_imgs_.forEach(item=>{
that.fileList.push({
url: that.vuex_host+item.path,
progress: 0,
id:item.id,
error: false,
file: item
})
})
this.getOplcates()
});
},
//根据作业许可证类别ID获取风险、措施===>作业许可证类别详情
getOplcates() {
let that = this;
that.$u.api.oplCateItem(that.oplcateId).then((res) => {
console.log(res); //
that.risklist = [];
that.measurelist = [];
that.oplCateName = res.name;
that.oplcateCode = res.code;
let risklist = res.risk_options_;
let measurelist = res.measure_options_;
if (that.oplId !== null) {
that.editCheckShow(risklist, measurelist);
} else {
risklist.forEach(item => {
let obj = {};
obj = item;
obj.checked = false;
that.risklist.push(obj)
})
measurelist.forEach(item => {
let obj = {};
obj = item;
obj.checked = false;
that.measurelist.push(obj)
})
}
});
},
editCheckShow(risklist, measurelist) {
debugger;
let that = this;
that.$u.api.oplItem(that.oplId).then((res) => {
that.formData = res; //作业开始时间
risklist.forEach(item => {
let obj = {};
obj = item;
if (res.risks_checked.indexOf(item.id) > -1) {
obj.checked = true;
} else {
obj.checked = false;
}
that.risklist.push(obj)
})
measurelist.forEach(item => {
let obj = {};
obj = item;
if (res.measures_checked.indexOf(item.id) > -1) {
obj.checked = true;
} else {
obj.checked = false;
}
that.measurelist.push(obj)
})
debugger;
console.log(res);
});
},
//获取作业区域
getRange() {
this.$u.api.areaLists({
page: 0
}).then(res => {
let range = [];
let obj = {};
res.forEach(item => {
obj = {
value: null,
text: ''
};
obj.value = item.id;
obj.text = item.name;
range.push(obj);
})
this.range = range
})
},
//获取用户
getUserRange() {
this.$u.api.userList({
page: 0
}).then(res => {
let user = [];
let obj = {};
res.forEach(item => {
obj = {
value: null,
text: ''
};
obj.value = item.id;
obj.text = item.name;
user.push(obj);
})
this.userRange = user
})
},
//获取dept
getdept() {
let that = this;
that.$u.api.deptList({
page: 0
}).then(res => {
that.depRange = that.redata(res);
console.log(that.depRange)
})
},
redata(postList) {
let posts = [];
postList.forEach((item) => {
let obj = new Object();
obj = {
...item
};
obj.value = item.id;
obj.text = item.name;
obj.parentId = item.parent;
posts.push(obj);
});
let obj = posts.reduce((res, v) => ((res[v.id] = v), res), {}); //Object
let arr = [];
for (let item of posts) {
if (item.parentId == null) {
arr.push(item);
continue;
}
let parent = obj[item.parentId];
parent.children = parent.children ? parent.children : [];
parent.children.push(item);
}
console.log(arr);
return arr;
},
checkboxRiskChange(e) {
let values = e.detail.value;
this.formData.risks_checked = values;
// debugger;
// console.log(this.formData.risks_checked);
},
checkboxMeasuresChange(e) {
let values = e.detail.value;
this.formData.measures_checked = values;
// debugger;
// console.log(this.formData.measures_checked);
},
select(row) {},
goBack() {
uni.navigateBack({
delta: 1
})
},
edit(row) {},
saveSubmit() {
debugger;
uni.showLoading({
title: '提交中'
});
let that = this;
let params = null;
// that.formData.start_time = that.formData.start_time;
// that.formData.end_time = that.formData.end_time;
// that.formData.power_start_time = that.formData.power_start_time;
// that.formData.power_end_time = that.formData.power_end_time;
// that.formData.work_time = that.formData.work_time;
that.formData.create_imgs = [];
that.fileList.forEach(item=>{
if(item.id){
console.log(item.id);
that.formData.create_imgs.push(item.id)
}else{
console.log(item.response.id)
that.formData.create_imgs.push(item.response.id)
}
})
if (that.oplId !== null) {
that.$u.api.oplUpdate(that.oplId, that.formData).then(res => {
uni.hideLoading();
params = `?oplId=${that.oplId}`;
uni.navigateTo({
url: '/pages/workSpace/operation/workerList' + params
})
})
} else {
that.$u.api.oplCreate(that.formData).then(res => {
uni.hideLoading();
params = `?oplId=${res.id}`;
uni.navigateTo({
url: '/pages/workSpace/operation/workerList' + params
})
})
}
},
}
}
</script>
<style>
>>>.uni-navbar__header,
>>>.uni-status-bar {
background-image: linear-gradient(90deg, #164cc3 0%, #2c6fd9 100%), linear-gradient(#e60012, #e60012) !important;
}
.list-body {
background-color: #f3fbff;
padding-bottom: 113px;
}
.form-info {
width: 720upx;
margin: 0 auto;
background-color: #FFFFFF;
border-radius: 5px;
padding: 12px 16px;
box-sizing: border-box;
margin-top: 12px;
}
.row {
padding: 10upx;
margin-bottom: 20upx;
border-bottom: 1upx solid #eeeeee;
}
.uni-list-cell {
display: flex;
padding: 10upx;
margin-bottom: 20upx;
border-bottom: 1upx solid #eeeeee;
}
.add {
position: fixed;
bottom: 0;
width: 100%;
height: 120upx;
justify-content: center;
align-items: center;
}
.btn {
margin: auto;
box-shadow: 0upx 5upx 10upx rgba(0, 0, 0, 0.4);
width: 70%;
}
.save-btn {
height: 80rpx;
color: #fff;
font-size: 30upx;
justify-content: center;
align-items: center;
}
.form-item {
font-family: PingFang-SC-Medium;
font-size: 30rpx;
height: 200rpx;
display: flex;
flex-wrap: wrap;
align-items: center;
}
.form-left-text {
color: #212121;
margin-bottom: 33rpx;
}
.form-left {
width: 100%;
}
.form-right {
margin-left: 20rpx;
flex: 1;
color: #414141;
}
.form-right input {
font-size: 30rpx;
}
.form-date>>>.uni-date__x-input {
height: 97rpx;
font-size: 30rpx;
}
.form-date>>>.uni-icons {
display: none;
}
.form-right>>>.uni-label-pointer {
min-width: 50%;
display: inline-block;
margin-bottom: 20rpx;
}
.apply-reason-text {
width: 653rpx;
height: 179rpx;
background-color: #f6f8fc;
border: solid 1rpx #e5e5e5;
margin-top: 21rpx;
padding: 14rpx 24rpx;
font-size: 26rpx;
box-sizing: border-box;
}
.apply_require {
margin-top: 0rpx !important;
}
.form-right {
flex: 1;
color: #414141;
}
.border-bottom {
border-bottom: 1rpx solid #eeeeee;
}
</style>