517 lines
24 KiB
Vue
517 lines
24 KiB
Vue
<template>
|
||
<div class="panoramaPlan">
|
||
<div class="header-box">
|
||
<div class="search-item">
|
||
<div class="search-label">
|
||
<!-- 节点名称： -->
|
||
{{$t('message.projectInfo.nodeName')+':'}}
|
||
</div>
|
||
<el-input
|
||
v-model="nodeName"
|
||
:placeholder="$t('message.projectInfo.placeholder')"
|
||
class=""
|
||
></el-input>
|
||
</div>
|
||
<el-select style="margin-right: 10px" v-model="alarmType" class="alarmTypeBox" v-if="COMPANY != 'sccr'">
|
||
<el-option v-for="(item,index) in ProgressPlanBidSectionList" :key="index" :value="item.id" :label="item.projectfName"></el-option>
|
||
</el-select>
|
||
<el-button type="primary" @click="loadDataTwo">
|
||
<!-- 查询 -->
|
||
{{$t('message.projectInfo.query')}}
|
||
</el-button>
|
||
<el-button type="primary" @click="Refresh">
|
||
<!-- 刷新 -->
|
||
{{$t('message.projectInfo.fresh')}}
|
||
</el-button>
|
||
<el-button type="primary" @click="addForm">
|
||
<!-- 刷新 -->
|
||
{{$t('message.projectInfo.add')}}
|
||
</el-button>
|
||
</div>
|
||
<div class="table-box">
|
||
<vue-scroll style="height: 668px">
|
||
<el-table :data="tableData">
|
||
<!-- 标段名称 -->
|
||
<el-table-column v-if="COMPANY=='sccr'" align="center" prop="crSectionName" :label="$t('message.projectInfo.sectionName')"></el-table-column>
|
||
<el-table-column v-else align="center" prop="projectfName" :label="$t('message.projectInfo.sectionName')"></el-table-column>
|
||
<!-- 节点编号 -->
|
||
<el-table-column align="center" prop="nodeCode" :label="$t('message.projectInfo.nodeNumber')"></el-table-column>
|
||
<!-- 节点名称 -->
|
||
<el-table-column align="center" prop="nodeName" width="160px" :label="$t('message.projectInfo.nodeName')"></el-table-column>
|
||
<!-- 节点类型 -->
|
||
<el-table-column align="center" prop="levelName" :label="$t('message.projectInfo.nodeType')"></el-table-column>
|
||
<!-- 标准完成时间 -->
|
||
<el-table-column align="center" prop="standardFinishDate" :label="$t('message.projectInfo.standardCompletionTime')"></el-table-column>
|
||
<!-- 计划完成时间 -->
|
||
<el-table-column align="center" prop="plannedFinishDate" :label="$t('message.projectInfo.planCompleteTime')"></el-table-column>
|
||
<!-- 预计完成时间 -->
|
||
<el-table-column align="center" prop="predictFinishDate" :label="$t('message.projectInfo.predictCompleteTime')"></el-table-column>
|
||
<!-- 实际完成时间 -->
|
||
<el-table-column align="center" prop="actualFinishDate" :label="$t('message.projectInfo.realCompleteTime')"></el-table-column>
|
||
<el-table-column align="center" prop="status" :label="$t('message.projectInfo.status')">
|
||
<template slot-scope="scope">
|
||
{{scope.row.status ==2 ? $t('message.projectInfo.statusList')[0]:scope.row.status ==3 ? $t('message.projectInfo.statusList')[1]:scope.row.status == 4 ? $t('message.projectInfo.statusList')[2]:scope.row.status == 6 ? $t('message.projectInfo.statusList')[3]:$t('message.projectInfo.statusList')[4]}}
|
||
</template>
|
||
</el-table-column>
|
||
<!-- <el-table-column prop="diffDate" label="实际偏差"></el-table-column>-->
|
||
<!-- 职能条线 -->
|
||
|
||
<el-table-column align="center" prop="phaseName" :label="$t('message.projectInfo.theFunctionLine')"></el-table-column>
|
||
<!-- 节点责任人编号 -->
|
||
<el-table-column align="center" prop="chargerId" width="150px" :label="$t('message.projectInfo.nodeOwnerID')"></el-table-column>
|
||
<!-- 节点责任人名称 -->
|
||
<el-table-column align="center" prop="chargerName" width="150px" :label="$t('message.projectInfo.nodeResponsiblePersonName')"></el-table-column>
|
||
<!-- 节点失效标记 -->
|
||
<el-table-column align="center" :label="$t('message.projectInfo.isValidMark')">
|
||
<template slot-scope="scope">
|
||
{{scope.row.isDeleted ? $t('message.projectInfo.valid'):$t('message.projectInfo.unvalid')}}
|
||
</template>
|
||
</el-table-column>
|
||
<!-- 是否退回 -->
|
||
<el-table-column align="center" :label="$t('message.projectInfo.isSendBack')">
|
||
<template slot-scope="scope">
|
||
{{scope.row.isSendBack ?$t('message.projectInfo.no'):$t('message.projectInfo.yes')}}
|
||
</template>
|
||
</el-table-column>
|
||
<!-- 操作 -->
|
||
<el-table-column align="center" :label="$t('message.projectInfo.operation')" width="200">
|
||
<template slot-scope="scope">
|
||
<el-button type="text" icon="el-icon-tickets" @click="previewData(scope.row)"><!-- 查看 -->{{$t('message.projectInfo.look')}}</el-button>
|
||
<el-button type="text" icon="el-icon-edit-outline" @click="editData(scope.row)">编辑</el-button>
|
||
<el-button class="delete-btn" type="text" icon="el-icon-delete" @click="deleteData(scope.row)">删除</el-button>
|
||
</template>
|
||
</el-table-column>
|
||
</el-table>
|
||
</vue-scroll>
|
||
<el-pagination
|
||
class="pagerBox"
|
||
@size-change="handleSizeChange"
|
||
@current-change="handleCurrentChange"
|
||
:current-page="pageNo"
|
||
:page-sizes="$store.state.PAGESIZRS"
|
||
:page-size="pageSize"
|
||
layout="total, sizes, prev, pager, next"
|
||
:total="Number(total)"
|
||
background
|
||
></el-pagination>
|
||
</div>
|
||
<el-dialog
|
||
class="dialog"
|
||
:title="dialogTitle"
|
||
:modal-append-to-body="false"
|
||
:visible.sync="dialogVisible"
|
||
@close="closeDialog"
|
||
destroy-on-close
|
||
width="50%"
|
||
>
|
||
<div class="dialog-content">
|
||
<vue-scroll>
|
||
<el-form
|
||
ref="form"
|
||
:model="dialogdata"
|
||
:rules="rules"
|
||
label-width="130px"
|
||
size="medium"
|
||
class="dialogFormBox">
|
||
<!-- 标段名称 -->
|
||
<el-form-item :label="$t('message.projectInfo.sectionName')" v-if="COMPANY=='sccr'">
|
||
<el-input
|
||
:disabled="formType == 3" v-model="dialogdata.crSectionName" placeholder="请输入"
|
||
></el-input>
|
||
</el-form-item>
|
||
<el-form-item :label="$t('message.projectInfo.sectionName')" prop="projectfName" required v-else>
|
||
<el-select :disabled="formType == 3" v-model="dialogdata.projectfName" :placeholder="$t('message.projectInfo.pleaseChoose')">
|
||
<el-option
|
||
v-for="(item , index ) in projectfNameList"
|
||
:key="index"
|
||
:label="item.projectfName"
|
||
:value="item.id">
|
||
</el-option>
|
||
</el-select>
|
||
</el-form-item>
|
||
<!-- 节点编码 -->
|
||
<el-form-item :label="$t('message.projectInfo.nodeCode')" prop="nodeCode" required>
|
||
<el-input
|
||
v-model="dialogdata.nodeCode"
|
||
:placeholder="$t('message.projectInfo.placeholder')"
|
||
:disabled="formType == 3"
|
||
></el-input>
|
||
</el-form-item>
|
||
<!-- 节点名称 -->
|
||
<el-form-item :label="$t('message.projectInfo.nodeName')" prop="nodeName" required>
|
||
<el-input
|
||
v-model="dialogdata.nodeName"
|
||
:placeholder="$t('message.projectInfo.placeholder')"
|
||
:disabled="formType == 3"
|
||
></el-input>
|
||
</el-form-item>
|
||
<el-form-item :label="$t('message.projectInfo.nodeType')" prop="levelName" required>
|
||
<el-input
|
||
v-model="dialogdata.levelName"
|
||
:placeholder="$t('message.projectInfo.placeholder')"
|
||
:disabled="formType == 3"
|
||
></el-input>
|
||
</el-form-item>
|
||
<!-- 标准完成时间 -->
|
||
<el-form-item :label="$t('message.projectInfo.standardCompletionTime')" prop="standardFinishDate" required>
|
||
<!-- 选择日期 -->
|
||
<el-date-picker
|
||
v-model="dialogdata.standardFinishDate"
|
||
value-format="yyyy-MM-dd"
|
||
type="date"
|
||
:placeholder="$t('message.projectInfo.chooseDate')"
|
||
:disabled="formType == 3">
|
||
</el-date-picker>
|
||
</el-form-item>
|
||
<!-- 计划完成时间 -->
|
||
<el-form-item :label="$t('message.projectInfo.planCompleteTime')" prop="plannedFinishDate" required>
|
||
<el-date-picker
|
||
v-model="dialogdata.plannedFinishDate"
|
||
value-format="yyyy-MM-dd"
|
||
type="date"
|
||
:placeholder="$t('message.projectInfo.chooseDate')"
|
||
:disabled="formType == 3">
|
||
</el-date-picker>
|
||
</el-form-item>
|
||
<!-- 预计完成时间 -->
|
||
<el-form-item :label="$t('message.projectInfo.predictCompleteTime')" prop="predictFinishDate">
|
||
<el-date-picker
|
||
v-model="dialogdata.predictFinishDate"
|
||
value-format="yyyy-MM-dd"
|
||
type="date"
|
||
:disabled="formType == 3"
|
||
:placeholder="$t('message.projectInfo.chooseDate')">
|
||
</el-date-picker>
|
||
</el-form-item>
|
||
<!-- 实际完成时间 -->
|
||
<el-form-item :label="$t('message.projectInfo.realCompleteTime')" prop="actualFinishDate">
|
||
<el-date-picker
|
||
v-model="dialogdata.actualFinishDate"
|
||
value-format="yyyy-MM-dd"
|
||
type="date"
|
||
:disabled="formType == 3"
|
||
:placeholder="$t('message.projectInfo.chooseDate')">
|
||
</el-date-picker>
|
||
</el-form-item>
|
||
<!-- 状态 -->
|
||
<el-form-item :label="$t('message.projectInfo.status')" prop="status" required>
|
||
<el-select v-model="dialogdata.status" :disabled="formType == 3" :placeholder="$t('message.projectInfo.pleaseChoose')">
|
||
<el-option
|
||
v-for="item in options"
|
||
:key="item.value"
|
||
:label="item.label"
|
||
:value="item.value">
|
||
</el-option>
|
||
</el-select>
|
||
</el-form-item>
|
||
<!-- 实际偏差 -->
|
||
<el-form-item :label="$t('message.projectInfo.actualDeviation')" prop="diffDate">
|
||
<el-input
|
||
v-model="dialogdata.diffDate"
|
||
:placeholder="$t('message.projectInfo.placeholder')"
|
||
:disabled="formType == 3"
|
||
></el-input>
|
||
</el-form-item>
|
||
<!-- 职能条线 -->
|
||
<el-form-item :label="$t('message.projectInfo.theFunctionLine')" prop="phaseName" required>
|
||
<el-input
|
||
v-model="dialogdata.phaseName"
|
||
:placeholder="$t('message.projectInfo.placeholder')"
|
||
:disabled="formType == 3"
|
||
></el-input>
|
||
</el-form-item>
|
||
<!-- 节点责任人编号 -->
|
||
<el-form-item :label="$t('message.projectInfo.nodeOwnerID')" prop="chargerId" required>
|
||
<el-input
|
||
v-model="dialogdata.chargerId"
|
||
:disabled="formType == 3"
|
||
:placeholder="$t('message.projectInfo.placeholder')"
|
||
></el-input>
|
||
</el-form-item>
|
||
<!-- 节点责任人名称 -->
|
||
<el-form-item :label="$t('message.projectInfo.nodeResponsiblePersonName')" prop="chargerName" required>
|
||
<el-input
|
||
v-model="dialogdata.chargerName"
|
||
:disabled="formType == 3"
|
||
:placeholder="$t('message.projectInfo.placeholder')"
|
||
></el-input>
|
||
</el-form-item>
|
||
</el-form>
|
||
</vue-scroll>
|
||
</div>
|
||
<div class="dialog-btn" v-if="formType != 3">
|
||
<el-button type="primary" @click="submitForm">
|
||
<!-- 确定 -->
|
||
{{$t('message.energyManage.material.confirm')}}
|
||
</el-button>
|
||
<el-button @click="closeDialog">
|
||
<!-- 取消 -->
|
||
{{$t('message.energyManage.material.cancel')}}
|
||
</el-button>
|
||
</div>
|
||
</el-dialog>
|
||
</div>
|
||
</template>
|
||
|
||
<script>
|
||
import {
|
||
addPanoramaNodePlan,
|
||
editPanoramaNodePlan,
|
||
deletePanoramaNodePlan,
|
||
queryPanoramaNodePlan,
|
||
queryByIdPanoramaNodePlan,
|
||
getprojectfNameListApi
|
||
} from "@/assets/js/api/projectSummary.js";
|
||
import {
|
||
selectProgressPlanBidSectionListApi
|
||
} from "@/assets/js/api/dataBoard.js"
|
||
import moment from "moment";
|
||
export default {
|
||
data(){
|
||
return{
|
||
dialogTitle: /* '添加计划', */this.$t('message.projectInfo.addPlan'),
|
||
formType: 1, //1.新增 2.编辑 3.查看
|
||
nodeName: "",
|
||
tableData:[],
|
||
dialogVisible: false,
|
||
dialogdata:{
|
||
projectfName:'',
|
||
nodeCode: '',
|
||
nodeName: '',
|
||
levelName: '',
|
||
standardFinishDate: '',
|
||
plannedFinishDate: '',
|
||
predictFinishDate: '',
|
||
actualFinishDate: '',
|
||
status: '',
|
||
phaseName: '',
|
||
chargerId: '',
|
||
chargerName: '',
|
||
crSectionName:'',//成润项目字段
|
||
},
|
||
rules:{
|
||
projectfName:{ required: true, message: this.$t('message.projectInfo.pleaseChoose')+this.$t('message.projectInfo.projectfName')},
|
||
nodeCode: { required: true, message: this.$t('message.projectInfo.placeholder')+this.$t('message.projectInfo.nodeNumber')},
|
||
nodeName: { required: true, message: this.$t('message.projectInfo.placeholder')+this.$t('message.projectInfo.nodeName')},
|
||
levelName: { required: true, message: this.$t('message.projectInfo.placeholder')+this.$t('message.projectInfo.nodeType')},
|
||
standardFinishDate: {type: 'string', required: true, message: this.$t('message.projectInfo.pleaseChoose')+this.$t('message.projectInfo.standardCompletionTime')},
|
||
plannedFinishDate: {type: 'string', required: true, message: this.$t('message.projectInfo.pleaseChoose')+this.$t('message.projectInfo.predictCompleteTime')},
|
||
status: { required: true, message: this.$t('message.projectInfo.pleaseChoose')+this.$t('message.projectInfo.status')},
|
||
phaseName: { required: true, message: this.$t('message.projectInfo.placeholder')+this.$t('message.projectInfo.theFunctionLine')},
|
||
chargerId: { required: true, message: this.$t('message.projectInfo.placeholder')+this.$t('message.projectInfo.nodeOwnerID')},
|
||
chargerName: { required: true, message: this.$t('message.projectInfo.placeholder')+this.$t('message.projectInfo.nodeResponsiblePerson')},
|
||
},
|
||
options:this.$t('message.projectInfo.nodeStatusList'),
|
||
projectfNameList:[],
|
||
pageNo: 1,
|
||
pageSize: 10,
|
||
total: 0,
|
||
projectSn: "",
|
||
ProgressPlanBidSectionList:'',
|
||
alarmType:'',
|
||
COMPANY:COMPANY,
|
||
}
|
||
},
|
||
created(){
|
||
console.log(this.COMPANY,'当前项目端')
|
||
this.projectSn = this.$store.state.projectSn;
|
||
this.loadData()
|
||
this.selectProgressPlanBidSectionList()
|
||
this.getprojectfNameList()
|
||
},
|
||
methods:{
|
||
getprojectfNameList(){
|
||
getprojectfNameListApi({projectSn: this.$store.state.projectSn}).then((res)=>{
|
||
console.log('标段名',res)
|
||
this.projectfNameList = res.result
|
||
})
|
||
},
|
||
Refresh(){
|
||
nodeName: this.nodeName = ''
|
||
this.pageNo = 1
|
||
this.pageSize = 10
|
||
this.alarmType = ''
|
||
this.loadData()
|
||
},
|
||
//标段列表
|
||
selectProgressPlanBidSectionList(){
|
||
selectProgressPlanBidSectionListApi({projectSn: this.$store.state.projectSn}).then( res => {
|
||
this.ProgressPlanBidSectionList = res.result
|
||
console.log('标段列表',res.result);//projectfName
|
||
})
|
||
},
|
||
loadDataTwo(){
|
||
this.pageNo = 1
|
||
this.loadData()
|
||
},
|
||
loadData(){
|
||
let data = {
|
||
nodeName: this.nodeName,
|
||
projectSn: this.projectSn,
|
||
pageNo: this.pageNo,
|
||
pageSize: this.pageSize,
|
||
bidSectionId:this.alarmType,
|
||
}
|
||
queryPanoramaNodePlan(data).then(res=>{
|
||
if(res.code == 200){
|
||
this.tableData = res.result.records
|
||
this.total = res.result.total
|
||
}
|
||
})
|
||
},
|
||
addForm(){
|
||
this.dialogVisible = true
|
||
this.dialogTitle = /* '添加计划' */this.$t('message.projectInfo.addPlan'),
|
||
this.formType = 1
|
||
},
|
||
submitForm(){
|
||
this.$refs['form'].validate((valid) => {
|
||
console.log(valid)
|
||
if(valid){
|
||
let data = this.dialogdata
|
||
// let data = JSON.stringify(JSON.parse(this.dialogdata))
|
||
data.projectSn = this.projectSn
|
||
// console.log('标段名称',this.dialogdata.projectfName)
|
||
data.bidSectionId = this.dialogdata.projectfName
|
||
if(this.formType == 1){
|
||
addPanoramaNodePlan(data).then(res=>{
|
||
// console.log('新增成功了吗',res)
|
||
if(res.code == 200){
|
||
this.$message.success(this.$t('message.projectInfo.addSuccess')+'!')
|
||
this.closeDialog()
|
||
this.loadData()
|
||
}
|
||
})
|
||
} else if(this.formType == 2){
|
||
console.log('编辑时候的参数',data)
|
||
editPanoramaNodePlan(data).then(res=>{
|
||
console.log('编辑的结果',res)
|
||
if(res.code == 200){
|
||
this.$message.success(this.$t('message.projectInfo.editSuccess')+'!')
|
||
this.closeDialog()
|
||
this.loadData()
|
||
}
|
||
})
|
||
}
|
||
}
|
||
})
|
||
},
|
||
closeDialog(){
|
||
this.dialogVisible = false
|
||
this.dialogdata = {}
|
||
this.dialogdata = {
|
||
nodeCode: '',
|
||
nodeName: '',
|
||
levelName: '',
|
||
standardFinishDate: '',
|
||
plannedFinishDate: '',
|
||
predictFinishDate: '',
|
||
actualFinishDate: '',
|
||
status: '',
|
||
phaseName: '',
|
||
chargerId: '',
|
||
chargerName: '',
|
||
}
|
||
},
|
||
handleSizeChange(val){
|
||
this.pageSize = val
|
||
this.loadData()
|
||
},
|
||
handleCurrentChange(val){
|
||
this.pageNo = val
|
||
this.loadData()
|
||
},
|
||
previewData(val){
|
||
this.dialogdata = val
|
||
this.dialogVisible = true
|
||
this.dialogTitle = /* '查看计划' */this.$t('message.projectInfo.lookPlan'),
|
||
this.formType = 3
|
||
},
|
||
editData(val){
|
||
this.dialogdata = JSON.parse(JSON.stringify(val))
|
||
this.dialogVisible = true
|
||
this.dialogTitle = /* '编辑计划' */this.$t('message.projectInfo.editPlan'),
|
||
this.formType = 2
|
||
},
|
||
deleteData(val){
|
||
this.$confirm(this.$t('message.projectInfo.confirmTipText')+'?', this.$t('message.projectInfo.tip'), {
|
||
confirmButtonText: /* '确定', */this.$t('message.energyManage.material.confirm'),
|
||
cancelButtonText: /* '取消', */this.$t('message.energyManage.material.cancel'),
|
||
type: 'warning'
|
||
}).then(() => {
|
||
deletePanoramaNodePlan({id: val.id}).then(res=>{
|
||
if(res.code == 200){
|
||
this.$message({
|
||
type: 'success',
|
||
message: /* '删除成功!' */this.$t('message.projectInfo.deleteSuccess')+'!',
|
||
});
|
||
this.loadData()
|
||
}
|
||
})
|
||
}).catch(() => {
|
||
this.$message({
|
||
type: 'info',
|
||
message: /* '已取消删除' */this.$t('message.projectInfo.cancelDelete')
|
||
});
|
||
});
|
||
}
|
||
}
|
||
}
|
||
</script>
|
||
|
||
<style lang="less" scoped>
|
||
.panoramaPlan{
|
||
width: 100%;
|
||
height: 100%;
|
||
background: #fff;
|
||
padding: 20px;
|
||
box-sizing: border-box;
|
||
.header-box{
|
||
margin-bottom: 20px;
|
||
padding-left: 10px;
|
||
.search-item{
|
||
display: inline-flex;
|
||
align-items: center;
|
||
white-space: nowrap;
|
||
margin-right: 20px;
|
||
/deep/.el-input{
|
||
width: 200px;
|
||
}
|
||
}
|
||
}
|
||
.delete-btn{
|
||
color: #F56C6C;
|
||
}
|
||
.dialogFormBox{
|
||
width: 100%;
|
||
padding: 0 30px;
|
||
box-sizing: border-box;
|
||
/deep/.el-form-item{
|
||
display: inline-block;
|
||
width: 50%;
|
||
.el-select{
|
||
width: 260px !important;
|
||
}
|
||
.el-date-picker{
|
||
width: 260px !important;
|
||
}
|
||
.el-cascader{
|
||
width: 260px !important;
|
||
}
|
||
.el-input{
|
||
width: 260px !important;
|
||
}
|
||
}
|
||
}
|
||
.dialog-content{
|
||
height: 360px;
|
||
margin-bottom: 60px;
|
||
}
|
||
.dialog-btn{
|
||
display: flex;
|
||
justify-content: space-around;
|
||
align-items: center;
|
||
}
|
||
}
|
||
</style>
|