428 lines
18 KiB
Vue

<template>
<div class="fullHeight">
<div v-if="type != 'detail'">
<div class="searchBox whiteBlock">
<el-form :inline="true" size="medium" :model="queryInfo" class="demo-form-inline">
<el-form-item>
<el-button size="medium" type="primary" @click="refreshBtn">新增</el-button>
</el-form-item>
</el-form>
</div>
<div class="table_wrap whiteBlock">
<vue-scroll>
<el-table height="650" class="tables" :data="listData1" lazy row-key="id" default-expand-all
:tree-props="{ children: 'children' }">
<el-table-column width="200" prop="taskName" label="分部分项工程名称">
<template slot-scope="scope">
<span :title="scope.row.taskName"
style="overflow: hidden;white-space: nowrap;text-overflow: ellipsis;width: 150px;">
{{ scope.row.taskName }}
</span>
</template>
</el-table-column>
<el-table-column align="center" prop="startDate" label="计划开始时间"> </el-table-column>
<el-table-column align="center" prop="finishDate" label="计划完成时间"> </el-table-column>
<el-table-column align="center" prop="actualStartDate" label="实际开始时间"> </el-table-column>
<el-table-column align="center" prop="actualFinishDate" label="实际完成时间"></el-table-column>
<el-table-column align="center" prop="dutyUserName" label="负责人"></el-table-column>
<el-table-column width="300" label="操作" align="center">
<template slot-scope="scope">
<el-button @click.native.stop="addBefore(2, scope.row)" size="mini" type="text"
icon="el-icon-circle-plus-outline">
新增
</el-button>
<el-button size="mini" type="text" icon="el-icon-edit"
@click.native.stop="editBefore(scope.row)">
编辑
</el-button>
<el-button size="mini" type="text" class="delete-btn" icon="el-icon-delete"
@click.native.stop="deleteBefore(scope.row)">删除</el-button>
</template>
</el-table-column>
</el-table>
</vue-scroll>
<el-pagination class="pagerBox" style="position: absolute; top: 85%; left: 40%"
@size-change="SizeChange" @current-change="CurrentChange" :current-page="pagInfo.pageNo"
:page-sizes="$store.state.PAGESIZRS" :page-size="pagInfo.pageSize"
layout="total, sizes, prev, pager, next" :total="Number(pagInfo.total)" background></el-pagination>
</div>
<!-- '新增父子级工程弹框' -->
<el-dialog :modal-append-to-body="false" :title="title" :visible.sync="dialogVisible" width="667px"
@close="close">
<div class="dialog_content">
<el-form ref="addEditForm" label-width="135px" size="medium" class="dialogFormBox"
:rules="addEditRules" :model="workerInfo">
<el-form-item label="分部分项名称" prop="taskName" v-if="dialogType == 3">
<el-input v-model="parentTaskName" placeholder="请输入" :disabled="dialogType == 3"></el-input>
</el-form-item>
<el-form-item v-else label="分部分项名称" prop="taskName">
<el-input v-model="workerInfo.taskName" placeholder="请输入"></el-input>
</el-form-item>
<el-form-item v-if="dialogType == 3" label="子分部分项名称" prop="taskName">
<el-input v-model="workerInfo.taskName" placeholder="请输入"></el-input>
</el-form-item>
<el-form-item label="计划开始时间" prop="startDate">
<el-date-picker @change="time1" v-model="workerInfo.startDate" type="date"
placeholder="请选择日期" value-format="yyyy-MM-dd">
</el-date-picker>
</el-form-item>
<el-form-item label="计划结束时间" prop="finishDate">
<el-date-picker @change="time2" v-model="workerInfo.finishDate" :picker-options="dateBefore"
type="date" placeholder="请选择日期" value-format="yyyy-MM-dd">
</el-date-picker>
</el-form-item>
<el-form-item label="实际开始时间" prop="actualStartDate">
<el-date-picker v-model="workerInfo.actualStartDate" type="date" placeholder="请选择日期"
value-format="yyyy-MM-dd">
</el-date-picker>
</el-form-item>
<el-form-item label="实际结束时间" prop="actualFinishDate">
<el-date-picker v-model="workerInfo.actualFinishDate" :picker-options="actualDateBefore"
type="date" placeholder="请选择日期" value-format="yyyy-MM-dd">
</el-date-picker>
</el-form-item>
<el-form-item label="负责人" prop="dutyUserName">
<el-select v-model="workerInfo.dutyUserId" placeholder="请选择">
<el-option v-for="item in principalLsit" :key="item.userId" :label="item.realName"
:value="item.userId"> </el-option>
</el-select>
</el-form-item>
<el-form-item label="进度(%)" prop="progressRatio">
<el-input-number :disabled="workerInfo.status === 2" :max="100" style="width: 105%"
v-model="workerInfo.progressRatio" @input="validateInput"></el-input-number>
</el-form-item>
<el-form-item label="备注" prop="remark">
<el-input v-model="workerInfo.remark" placeholder="请输入"></el-input>
</el-form-item>
</el-form>
</div>
<div class="dialog-footer">
<el-button class="cancleBtn" @click="dialogVisible = false" icon="el-icon-circle-close"
size="medium">取消
</el-button>
<el-button type="primary" icon="el-icon-circle-check" @click="submitBtn" size="medium">确定
</el-button>
</div>
</el-dialog>
<!-- 一级新增弹框 -->
<el-dialog :modal-append-to-body="false" width="600px" title="导入" :visible.sync="uploadShow"
@close="close2">
<div class="dialog-footer">
<el-button class="cancleBtn" @click="uploadShow = false" icon="el-icon-circle-close"
size="medium">取消
</el-button>
<el-button type="primary" icon="el-icon-circle-check" size="medium" @click="handleUploadConfirm">确定
</el-button>
</div>
</el-dialog>
</div>
</div>
</template>
<script>
import {
addTaskProgressApi, deleteTaskProgressApi, editTaskProgressApi, getTaskProgressPageApi
} from '@/assets/js/api/examSystem/subjectManagement'
export default {
// components: {
// detailpage
// },
mounted() { },
data() {
return {
subjectList: [
{id: 1,subjectName: '科目名称01', children:[{id: 1, subjectName: '子科目名称1'},{id: 2, subjectName: '子科目名称2'}]},
{id: 2,subjectName: '科目名称02', children:[{id: 1, subjectName: '子科目名称1'},{id: 2, subjectName: '子科目名称2'}]},
{id: 3,subjectName: '科目名称03', children:[{id: 1, subjectName: '子科目名称1'},{id: 2, subjectName: '子科目名称2'}]},
],
rowData: {},
parentTaskName: '', // 用于存储父级taskName
pagInfo: {
pageNo: 1, //页数
pageSize: 10, //条数
total: 0 //总条数
},
radio: 1,
uploadShow: false, //导入弹框
dialogType: 1,
title: '',
daterange: [],
fileList: [], //上传文件
projectSn: '',
createUserId: '',
listData: [],
listData1: [],
dialogVisible: false, //新增弹窗
workerInfo: {
taskName: '',
startDate: '',
finishDate: '',
actualStartDate: '',
actualFinishDate: '',
dutyUserId: '',
progressRatio: '',
remark: '',
parentId: 0,
status: 0,
},
principalLsit: [], //负责人
seedId: '',
showTime: false, //工期
queryInfo: {
taskName: '',
status: '',
actualStartDate: '',
actualFinishDate: ''
},
type: 'add',
addEditRules: {
taskName: [
{
required: true,
message: this.$t('message.personnelPosition.required'),
trigger: 'blur'
}
],
startDate: [
{
required: true,
message: this.$t('message.personnelPosition.required'),
trigger: 'blur'
}
],
finishDate: [
{
required: true,
message: this.$t('message.personnelPosition.required'),
trigger: 'blur'
}
]
},
times: '',
fileName: ''
}
},
computed: {
headers() {
return { Authorization: this.$store.state.userInfo.token }
},
},
created() {
this.projectSn = this.$store.state.projectSn
this.getProgressListData()
},
methods: {
//导入确定提交
handleUploadConfirm() {
if (this.fileName == '') {
this.$message.warning('请先上传文件')
return
} else {
this.uploadShow = false
this.$message.success('操作成功')
this.getProgressListData()
}
},
handleRadioChange(val) {
this.radio = val
},
//获取列表数据
getProgressListData() {
let data = {
projectSn: this.projectSn,
pageNo: this.pagInfo.pageNo,
pageSize: this.pagInfo.pageSize,
taskName: this.queryInfo.taskName,
status: this.queryInfo.status,
actualFinishDate_begin: this.queryInfo.actualStartDate,
actualFinishDate_end: this.queryInfo.actualFinishDate
}
getTaskProgressPageApi(data).then(res => {
if (res.code == 200) {
// this.listData = res.result.records
this.listData1 = res.result.records
this.pagInfo.total = res.result.total
}
})
},
//新增
addBefore(addType, value) {
if (addType == 1) {
this.title = '新增分项'
this.dialogType = 1
} else {
console.log('新增子分项点击', value)
this.title = '新增子分项'
this.dialogType = 3
this.workerInfo.parentId = value.id
this.parentTaskName = value.taskName
}
this.dialogVisible = true
},
// 编辑按钮
editBefore(val) {
this.dialogType = 2
this.title = '编辑分项'
console.log('当前点击的行', val)
this.workerInfo = JSON.parse(JSON.stringify(val))
this.workerInfo.id = val.id
this.workerInfo.status = val.status
this.dialogVisible = true
},
//编辑
submitBtn() {
this.$refs.addEditForm.validate(valid => {
if (valid) {
let data = {
taskName: this.workerInfo.taskName,
startDate: this.workerInfo.startDate,
finishDate: this.workerInfo.finishDate,
actualStartDate: this.workerInfo.actualStartDate,
actualFinishDate: this.workerInfo.actualFinishDate,
dutyUserId: this.workerInfo.dutyUserId,
progressRatio: this.workerInfo.progressRatio,
remark: this.workerInfo.remark,
parentId: this.workerInfo.parentId,
projectSn: this.projectSn
}
if (this.dialogType == 1) {
addTaskProgressApi(data).then(res => {
if (res.code == 200) {
this.$message.success(res.message)
this.dialogVisible = false
this.getProgressListData()
}
})
} else if (this.dialogType == 2) {
data.id = this.workerInfo.id
editTaskProgressApi(data).then(res => {
if (res.code == 200) {
this.$message.success(res.message)
this.dialogVisible = false
this.getProgressListData()
}
})
} else if (this.dialogType == 3) {
data.parentId = this.workerInfo.parentId
data.level = 2
addTaskProgressApi(data).then(res => {
if (res.code == 200) {
this.$message.success(res.message)
this.dialogVisible = false
this.getProgressListData()
}
})
}
} else {
return false
}
})
},
//删除
deleteBefore(value) {
this.$confirm(this.$t('message.quality.deleteHint'), this.$t('message.quality.hint'), {
confirmButtonText: this.$t('message.quality.confirm'),
cancelButtonText: this.$t('message.quality.cancel'),
type: 'warning'
})
.then(() => {
let data = {
id: value.id
}
deleteTaskProgressApi(data).then(res => {
if (res.code == 200) {
this.$message({
type: 'success',
message: this.$t('message.quality.successfullyDelete') + '!'
})
this.getProgressListData()
}
})
})
.catch(() => { })
},
close() {
this.workerInfo = {}
this.workerInfo.parentId = 0
this.$nextTick(() => {
this.$refs.addEditForm.clearValidate()
})
},
close2() {
this.fileName = ''
this.radio = 1
},
//刷新
refreshBtn() {
this.daterange = []
this.pagInfo.pageNo = 1
this.pagInfo.pageSize = 10
this.queryInfo = {
status: '',
actualStartDate: '',
actualFinishDate: '',
taskName: ''
}
this.getProgressListData()
},
SizeChange(val) {
this.pagInfo.pageSize = val
this.getProgressListData()
},
CurrentChange(val) {
this.pagInfo.pageNo = val
this.getProgressListData()
},
changeDate() {
if (this.daterange) {
this.queryInfo.actualStartDate = this.daterange[0]
this.queryInfo.actualFinishDate = this.daterange[1]
} else {
this.queryInfo.actualStartDate = ''
this.queryInfo.actualFinishDate = ''
}
},
validateInput() {
let value = parseInt(this.workerInfo.progressRatio, 10)
if (isNaN(value) || value < 0 || value > 100 || Math.floor(value) !== value) {
this.workerInfo.progressRatio = ''
}
},
}
}
</script>
<style lang="less" scoped>
.down {
text-decoration: none;
color: #fff;
}
.expintBtn {
display: inline-block !important;
margin-right: 10px;
}
.table_wrap {
height: 800px;
overflow: auto;
}
.delete-btn {
color: #fe6565;
}
.dialogUplod {
height: 100px;
margin-left: 70px;
margin-top: 40px;
div {
margin-bottom: 20px;
}
}
</style>