|
|
<template> <div class="mod-config"> <el-row> <el-col :span="24"> <el-button @click="getDataList()" type="primary">查询</el-button> <download-excel :fields="fields()" type="xls" :name="exportName" :fetch="createExportData" worksheet="导出信息" class="el-button el-button--primary el-button--medium"> {{ '导出' }} </download-excel> <el-button @click="addOrUpdateHandle()" type="primary">发起任务 </el-button> </el-col> </el-row> <el-row> <el-col :span="24"> <el-form :inline="true" label-position="top" :model="dataForm" @keyup.enter.native="getDataList()"> <el-row> <el-col :span="24"> <el-form-item label="责任部门"> <el-input style="width: 120px" v-model="dataForm.department" clearable></el-input> </el-form-item> <el-form-item label="责任人"> <el-input style="width: 120px" v-model="dataForm.responsiblePerson" clearable></el-input> </el-form-item> <el-form-item label="最终状态"> <el-select v-model="dataForm.finalStatus" style="width: 120px"> <el-option label="未完成" value="未完成"></el-option> <el-option label="已完成" value="已完成"></el-option> <el-option label="全部" value=""></el-option> </el-select> </el-form-item> <el-form-item label="发起日期"> <el-date-picker style="width: 120px" v-model="dataForm.startDate" value-format='yyyy-MM-dd 00:00:00' format='yyyy-MM-dd' ></el-date-picker> - <el-date-picker style="width: 120px" v-model="dataForm.endDate" value-format='yyyy-MM-dd 23:59:59' format='yyyy-MM-dd' ></el-date-picker> </el-form-item> </el-col> </el-row> <el-row> <el-col style="margin-top: -5px" :span="24"> <el-form-item label="客户"> <el-input style="width: 120px" v-model="dataForm.customer" clearable></el-input> </el-form-item> <el-form-item label="项目"> <el-input style="width: 120px" v-model="dataForm.project" clearable></el-input> </el-form-item> <el-form-item label="状态"> <el-select v-model="dataForm.status" style="width: 120px"> <el-option label="未受理" value="未受理"></el-option> <el-option label="已受理" value="已受理"></el-option> <el-option label="全部" value=""></el-option> </el-select> </el-form-item> <el-form-item label="要求完成日期"> <el-date-picker style="width: 120px" v-model="dataForm.finishStartDate" value-format='yyyy-MM-dd 00:00:00' format='yyyy-MM-dd' ></el-date-picker> - <el-date-picker style="width: 120px" v-model="dataForm.finishEndDate" value-format='yyyy-MM-dd 23:59:59' format='yyyy-MM-dd' ></el-date-picker> </el-form-item> </el-col> </el-row> </el-form> </el-col> </el-row> <el-row> <el-col :span="24"> <el-table :data="dataList" border :height="height" v-loading="dataListLoading" :row-class-name="tableRowClassName" @selection-change="selectionChangeHandle" highlight-current-row style="width: 100%;"> <el-table-column v-for="(item,index) in columnList" :key="index" :sortable="item.columnSortable" :prop="item.columnProp" :header-align="'center'" :show-overflow-tooltip="item.showOverflowTooltip" :align="item.align" :fixed="item.fixed==''?false:item.fixed" :width="item.columnWidth" :label="item.columnLabel"> <template slot-scope="scope"> <span v-if="!item.columnHidden"> {{ scope.row[item.columnProp] }}</span> <span v-if="item.columnImage"><img :src="scope.row[item.columnProp]" style="width: 100px; height: 80px"/></span> </template> </el-table-column> <el-table-column fixed="right" header-align="center" align="center" width="300" label="操作"> <template slot-scope="scope"> <el-link type="text" size="small" @click="addOrUpdateHandle(scope.row.taskId)">修改 |</el-link> <el-link type="text" size="small" @click="updateStatusDialog(scope.row)">更改最终状态 |</el-link> <el-link type="text" size="small" @click="chatHistoryDialog(scope.row)">沟通 |</el-link> <el-link type="text" size="small" @click="annex(scope.row)">附件 |</el-link><!-- <el-link type="text" size="small" @click="annex(scope.row.id)"> 沟通附件</el-link>--> <el-link type="text" size="small" @click="deleteHandle(scope.row.id)">删除 </el-link> </template> </el-table-column> </el-table> </el-col> </el-row>
<el-dialog v-drag :title="'更改状态'" :close-on-click-modal="false" width="139px" :visible.sync="statusVisible"> <el-form :model="dataForm" :inline="true" label-position="top" label-width="80px"> <el-form-item label="状态"> <el-select v-model="selectRow.finalStatus" style="width: 120px"> <el-option label="未完成" value="未完成"></el-option> <el-option label="已完成" value="已完成"></el-option> </el-select> </el-form-item> </el-form> <span slot="footer" class="dialog-footer"> <el-button type="primary" @click="updateStatus()">确定</el-button> <el-button type="primary" @click="statusVisible = false">取消</el-button> </span> </el-dialog> <!-- 沟通记录 --> <chat-history v-if="chatHistoryVisible" ref="chatHistory" ></chat-history> <!-- 文件列表 --> <task-file-list v-if="taskFileVisible" ref="taskFileList"></task-file-list> <!-- 弹窗, 新增 / 修改 --> <add-or-update v-if="addOrUpdateVisible" ref="addOrUpdate" @refreshDataList="getDataList"></add-or-update> </div></template>
<script>
import ChatHistory from './chat-history.vue' import {getTaskDetailList,updateTaskDetail} from '@/api/taskmanage/tasklist.js' import TaskFileList from './task-file-upload-list.vue' import AddOrUpdate from "./tasklist-add-or-update";
export default { data() { return { height: 200, dataForm: { site: this.$store.state.user.site, customer: '', taskHeader: '', project: '', taskDescription: '', taskInitiator: this.$store.state.user.name, finalStatus: '', department: '', responsiblePerson: '', startDate: '', endDate: '', finishStartDate: '', finishEndDate: '', status: '', }, // 展示列集
columnList: [ { tableId: "ProjectInfo", tableName: this.$route.meta.title, columnProp: "taskStartDate", columnLabel: "发起日期", columnHidden: false, columnImage: false, columnSortable: false, columnWidth: null, format: null, functionId: this.$route.meta.menuId, sortLv: 0, status: true, fixed: '', serialNumber: null, columnType: null, align: null }, { tableId: "ProjectInfo", tableName: this.$route.meta.title, columnProp: "taskInitiator", columnLabel: "任务发起人", columnHidden: false, columnImage: false, columnSortable: false, columnWidth: null, format: null, functionId: this.$route.meta.menuId, sortLv: 0, status: true, fixed: '', serialNumber: null, columnType: null, align: null }, { tableId: "ProjectInfo", tableName: this.$route.meta.title, columnProp: "customer", columnLabel: "客户", columnHidden: false, columnImage: false, columnSortable: false, columnWidth: null, format: null, functionId: this.$route.meta.menuId, sortLv: 0, status: true, fixed: '', serialNumber: null, columnType: null, align: null }, { tableId: "ProjectInfo", tableName: this.$route.meta.title, columnProp: "project", columnLabel: "项目", columnHidden: false, columnImage: false, columnSortable: false, columnWidth: null, format: null, functionId: this.$route.meta.menuId, sortLv: 0, status: true, fixed: '', serialNumber: null, columnType: null, align: null }, { tableId: "ProjectInfo", tableName: this.$route.meta.title, columnProp: "taskHeader", columnLabel: "任务主题", columnHidden: false, columnImage: false, columnSortable: false, columnWidth: null, format: null, functionId: this.$route.meta.menuId, sortLv: 0, status: true, fixed: '', serialNumber: null, columnType: null, align: null },
{ tableId: "ProjectInfo", tableName: this.$route.meta.title, columnProp: "taskDescription", columnLabel: "任务描述", columnHidden: false, columnImage: false, columnSortable: false, columnWidth: null, format: null, functionId: this.$route.meta.menuId, sortLv: 0, status: true, fixed: '', serialNumber: null, columnType: null, align: null }, { tableId: "ProjectInfo", tableName: this.$route.meta.title, columnProp: "department", columnLabel: "责任部门", columnHidden: false, columnImage: false, columnSortable: false, columnWidth: null, format: null, functionId: this.$route.meta.menuId, sortLv: 0, status: true, fixed: '', serialNumber: null, columnType: null, align: null }, { tableId: "ProjectInfo", tableName: this.$route.meta.title, columnProp: "responsiblePerson", columnLabel: "责任人", columnHidden: false, columnImage: false, columnSortable: false, columnWidth: null, format: null, functionId: this.$route.meta.menuId, sortLv: 0, status: true, fixed: '', serialNumber: null, columnType: null, align: null }, { tableId: "ProjectInfo", tableName: this.$route.meta.title, columnProp: "requiredCompletionDate", columnLabel: "要求完成日期", columnHidden: false, columnImage: false, columnSortable: false, columnWidth: null, format: null, functionId: this.$route.meta.menuId, sortLv: 0, status: true, fixed: '', serialNumber: null, columnType: null, align: null }, { tableId: "ProjectInfo", tableName: this.$route.meta.title, columnProp: "status", columnLabel: "状态", columnHidden: false, columnImage: false, columnSortable: false, columnWidth: null, format: null, functionId: this.$route.meta.menuId, sortLv: 0, status: true, fixed: '', serialNumber: null, columnType: null, align: null }, { tableId: "ProjectInfo", tableName: this.$route.meta.title, columnProp: "finalStatus", columnLabel: "最终状态", columnHidden: false, columnImage: false, columnSortable: false, columnWidth: null, format: null, functionId: this.$route.meta.menuId, sortLv: 0, status: true, fixed: '', serialNumber: null, columnType: null, align: null }, { tableId: "ProjectInfo", tableName: this.$route.meta.title, columnProp: "createdBy", columnLabel: "创建人", columnHidden: false, columnImage: false, columnSortable: false, columnWidth: null, format: null, functionId: this.$route.meta.menuId, sortLv: 0, status: true, fixed: '', serialNumber: null, columnType: null, align: null }, { tableId: "ProjectInfo", tableName: this.$route.meta.title, columnProp: "createdDate", columnLabel: "创建时间", columnHidden: false, columnImage: false, columnSortable: false, columnWidth: 140, format: null, functionId: this.$route.meta.menuId, sortLv: 0, status: true, fixed: '', serialNumber: null, columnType: null, align: null }, { tableId: "ProjectInfo", tableName: this.$route.meta.title, columnProp: "updatedBy", columnLabel: "修改人", columnHidden: false, columnImage: false, columnSortable: false, columnWidth: null, format: null, functionId: this.$route.meta.menuId, sortLv: 0, status: true, fixed: '', serialNumber: null, columnType: null, align: null }, { tableId: "ProjectInfo", tableName: this.$route.meta.title, columnProp: "updatedDate", columnLabel: "修改时间", columnHidden: false, columnImage: false, columnSortable: false, columnWidth: 140, format: null, functionId: this.$route.meta.menuId, sortLv: 0, status: true, fixed: '', serialNumber: null, columnType: null, align: null }, ], dataList: [], selectRow: { id: 0, finalStatus: '', }, dataListLoading: false, dataListSelections: [], chatHistoryVisible: false, statusVisible: false, taskFileVisible: false, addOrUpdateVisible: false, exportName: this.$route.meta.title + this.dayjs().format('YYYYMMDDHHmmss') } }, components: { ChatHistory, TaskFileList, AddOrUpdate, }, activated() { // this.getDataList()
}, mounted() { this.$nextTick(() => { this.height = window.innerHeight - 200; }) }, methods: { // 获取数据列表
getDataList() { this.dataListLoading = true getTaskDetailList(this.dataForm).then(({data}) => { if (data && data.code === 0) { this.dataList = data.data } else { this.dataList = [] } this.dataListLoading = false }) }, // 多选
selectionChangeHandle(val) { this.dataListSelections = val }, // 更改状态模态框
updateStatusDialog(row) { this.selectRow.finalStatus = row.finalStatus this.selectRow.id = row.id this.statusVisible = true; }, // 更改状态提交
updateStatus() { updateTaskDetail(this.selectRow).then(({data}) =>{ if (data && data.code == 0 ){ this.statusVisible = false this.$message.success(data.msg) this.getDataList() }else { this.$message.warning(data.msg) } }) }, // 沟通记录
chatHistoryDialog(id){ this.chatHistoryVisible = true this.$nextTick(() => { this.$refs.chatHistory.init(id) }) }, // 附件
annex(row) { this.taskFileVisible = true let dto = { fileTypeCode: 'TASK', orderRef3:row.taskId, orderRef2:row.id } this.$nextTick(() => { this.$refs.taskFileList.init(dto) }) }, // 删除
deleteHandle(id) { var ids = id this.$confirm(`确定进行删除操作?`, '提示', { confirmButtonText: '确定', cancelButtonText: '取消', type: 'warning' }).then(() => { this.$http({ url: this.$http.adornUrl('/taskmanage/taskDetail/delete'), method: 'post', data: this.$http.adornData(ids, false) }).then(({data}) => { if (data && data.code === 0) { this.$message.success('操作成功') this.getDataList() } else { this.$message.error(data.msg) } }) }) }, tableRowClassName({row, rowIndex}) { if (row.chatLastType == '有新回复'&&row.finalStatus=='未完成') { return 'newChat' } }, // 新增 / 修改
addOrUpdateHandle(id) { this.addOrUpdateVisible = true this.$nextTick(() => { this.$refs.addOrUpdate.init(id) }) }, // 导出
fields() { let json = "{" this.columnList.forEach((item, index) => { if (index == this.columnList.length - 1) { json += "\"" + item.columnLabel + "\"" + ":" + "\"" + item.columnProp + "\"" } else { json += "\"" + item.columnLabel + "\"" + ":" + "\"" + item.columnProp + "\"" + "," } }) json += "}" let s = eval("(" + json + ")") return s }, createExportData() { // 点击导出按钮之后,开始导出数据之前的执行函数,返回值为需要下载的数据
return this.dataList; }, } }</script><style> .mod-config .newChat { background-color: #00d9ff; }</style>
|
