1066 lines
34 KiB
Vue
1066 lines
34 KiB
Vue
<template>
|
||
<div style="height:100%">
|
||
<ai-detail>
|
||
<template #title>
|
||
<ai-title
|
||
:title="basicInfo.parentTaskCode ? '子任务详情' : '任务详情'"
|
||
isShowBottomBorder
|
||
isShowBack
|
||
@onBackClick="onBack()"
|
||
>
|
||
<template #rightBtn v-if="detailType == 1">
|
||
<el-button
|
||
type="primary"
|
||
icon="iconfont iconReject"
|
||
v-if="basicInfo.status == 0"
|
||
@click="closeWork()">关闭任务</el-button
|
||
>
|
||
<el-button
|
||
type="primary"
|
||
icon="iconfont iconCorrect"
|
||
v-if="basicInfo.status == 0"
|
||
@click="markCompleted('1')"
|
||
>确认完成</el-button
|
||
>
|
||
<el-button
|
||
icon="iconfont iconDelete"
|
||
class="del-btn-list"
|
||
v-if="basicInfo.status == 1 || basicInfo.status == 2"
|
||
@click="deleteTask()"
|
||
>删除任务</el-button
|
||
>
|
||
</template>
|
||
</ai-title>
|
||
</template>
|
||
<template #content>
|
||
<ai-card title="任务进度">
|
||
<template #right v-if="basicInfo.parentTaskCode && detailType != 2 && detailType != 3">
|
||
<el-button type="primary" @click="toParent()">查看父级任务</el-button>
|
||
</template>
|
||
<template slot="content">
|
||
<ai-wrapper class="mar-t16" label-width="80px" :columnsNumber="2">
|
||
<ai-info-item
|
||
label="任务状态："
|
||
:class="{
|
||
color1: basicInfo.status == 0,
|
||
color2: basicInfo.status == 1,
|
||
color3: basicInfo.status == 2,
|
||
}"
|
||
><span>{{
|
||
dict.getLabel("workTaskStatus", basicInfo.status) || "-"
|
||
}}</span></ai-info-item
|
||
>
|
||
<ai-info-item label="当前进度："
|
||
><span>{{ basicInfo.percent + "%" }}</span></ai-info-item
|
||
>
|
||
</ai-wrapper>
|
||
<div class="echart" id="echart"></div>
|
||
</template>
|
||
</ai-card>
|
||
<ai-card title="任务执行情况">
|
||
<template slot="content">
|
||
<el-row
|
||
type="flex"
|
||
justify="space-between"
|
||
align="center"
|
||
style="margin-bottom: 8px"
|
||
>
|
||
<el-col :span="16">
|
||
<el-radio-group
|
||
v-model="ListType"
|
||
size="small"
|
||
@change="ListTypeChange"
|
||
>
|
||
<el-radio-button label="userInfoList">执行人</el-radio-button>
|
||
<el-radio-button label="checkUserList">督办人</el-radio-button>
|
||
<el-radio-button label="sendUserList">抄送人</el-radio-button>
|
||
</el-radio-group>
|
||
<el-input
|
||
v-model="listName"
|
||
placeholder="姓名"
|
||
size="small"
|
||
style="width: 160px; margin-left: 8px"
|
||
@input="filterData"
|
||
></el-input>
|
||
</el-col>
|
||
<el-col
|
||
:span="8"
|
||
class="icon add-icon"
|
||
v-if="basicInfo.status == 0"
|
||
>
|
||
<ai-wechat-selecter style="display: inline-block;" v-if="ListType == 'userInfoList' && detailType == 1"
|
||
:instance="instance"
|
||
v-model="addUserList"
|
||
:disable="appReportTaskDoInfoList"
|
||
:isAdd="false"
|
||
@change="confirmAdd(1)"
|
||
>
|
||
<i
|
||
class="iconfont iconAdd"
|
||
style="color: #5088ff"
|
||
>添加执行人</i
|
||
>
|
||
</ai-wechat-selecter>
|
||
|
||
<ai-wechat-selecter style="display: inline-block;" v-if="ListType == 'checkUserList' && detailType == 1"
|
||
:instance="instance"
|
||
:disable="appReportTaskDoInfoList"
|
||
v-model="addUserList"
|
||
:isAdd="false"
|
||
@change="confirmAdd(2)"
|
||
>
|
||
<i
|
||
class="iconfont iconAdd"
|
||
style="color: #5088ff"
|
||
>添加督办人</i
|
||
>
|
||
</ai-wechat-selecter>
|
||
|
||
<ai-wechat-selecter style="display: inline-block;" v-if="ListType == 'sendUserList' && detailType == 1"
|
||
:instance="instance"
|
||
v-model="addUserList"
|
||
:disable="appReportTaskDoInfoList"
|
||
:isAdd="false"
|
||
@change="confirmAdd(3)"
|
||
>
|
||
<i
|
||
class="iconfont iconAdd"
|
||
style="color: #5088ff"
|
||
>添加抄送人</i
|
||
>
|
||
</ai-wechat-selecter>
|
||
|
||
<i
|
||
class="iconfont iconClock"
|
||
style="color: #5088ff; margin-left: 8px"
|
||
:style="isAll ? 'opacity:0.5' : ''"
|
||
v-if="ListType == 'userInfoList' && detailType != 3"
|
||
@click="urgeMessageAll()"
|
||
>一键催办</i
|
||
>
|
||
</el-col>
|
||
</el-row>
|
||
<ai-table :isShowPagination="false"
|
||
class="ai-table"
|
||
:tableData="basicInfo[ListType]"
|
||
:col-configs="colConfigs"
|
||
:dict="dict"
|
||
>
|
||
<el-table-column slot="status" label="任务状态" align="center" v-if="ListType == 'userInfoList'">
|
||
<template slot-scope="{ row }">
|
||
<span >{{$dict.getLabel("workTaskStatus", row.doStatus)}}</span>
|
||
</template>
|
||
</el-table-column>
|
||
<el-table-column slot="percent" label="完成时间" align="center" v-if="ListType == 'userInfoList'">
|
||
<template slot-scope="{ row }">
|
||
<span >{{ row.finishTime|| '-' }}</span>
|
||
</template>
|
||
</el-table-column>
|
||
<el-table-column slot="percent" label="完成进度" align="center" v-if="ListType == 'userInfoList'">
|
||
<template slot-scope="{ row }">
|
||
<span>{{ row.percent + '%'}}</span>
|
||
</template>
|
||
</el-table-column>
|
||
<el-table-column
|
||
slot="options"
|
||
label="操作"
|
||
align="center"
|
||
fixed="right"
|
||
width="200"
|
||
>
|
||
<template slot-scope="{ row }">
|
||
<div>
|
||
<i
|
||
class="iconfont iconClock icon-color89B"
|
||
title="催办"
|
||
:style="
|
||
row.doStatus == 0
|
||
? row.isSend
|
||
? 'opacity:0.5'
|
||
: ''
|
||
: 'opacity:0.5'
|
||
"
|
||
style="cursor: pointer"
|
||
v-if="ListType == 'userInfoList' && basicInfo.status == 0 && detailType != 3"
|
||
@click="urgeMessage(row)"
|
||
></i>
|
||
<span
|
||
class="iconfont iconShow icon-color89B"
|
||
title="详情"
|
||
v-if="ListType == 'userInfoList'"
|
||
style="cursor: pointer; margin-left: 8px"
|
||
@click="getExecute(row)"
|
||
></span>
|
||
<span
|
||
class="iconfont iconRevoke icon-color89B"
|
||
title="删除"
|
||
style="margin-left: 8px; cursor: pointer"
|
||
v-if="basicInfo.status == 0 && detailType == 1"
|
||
@click="deleteUnit(row)"
|
||
></span>
|
||
</div>
|
||
</template>
|
||
</el-table-column>
|
||
</ai-table>
|
||
</template>
|
||
</ai-card>
|
||
<ai-card title="任务信息">
|
||
<template slot="content">
|
||
<ai-wrapper class="mar-t16" label-width="80px" :columnsNumber="2">
|
||
<ai-info-item label="发起人："
|
||
><span>{{ basicInfo.sponsorUserName }}</span></ai-info-item
|
||
>
|
||
<ai-info-item label="创建人："
|
||
><span>{{ basicInfo.createUserName }}</span></ai-info-item
|
||
>
|
||
<ai-info-item label="创建时间："
|
||
><span>{{ basicInfo.createTime }}</span></ai-info-item
|
||
>
|
||
</ai-wrapper>
|
||
<ai-wrapper class="mar-t16" label-width="80px" :columnsNumber="2">
|
||
<ai-info-item label="任务状态：">
|
||
<span>{{
|
||
dict.getLabel("workTaskStatus", basicInfo.status) || "-"
|
||
}}</span>
|
||
</ai-info-item>
|
||
<ai-info-item label="任务类型："
|
||
><span>{{
|
||
$dict.getLabel("workTaskType", basicInfo.type) || "-"
|
||
}}</span></ai-info-item
|
||
>
|
||
</ai-wrapper>
|
||
<ai-wrapper class="mar-t16" label-width="80px" :columnsNumber="2">
|
||
<ai-info-item label="截止时间：">
|
||
<span
|
||
>{{ basicInfo.lastTime
|
||
}}<i
|
||
:style="
|
||
basicInfo.isOverTime == 0
|
||
? 'color:#FF8822;'
|
||
: 'color:#FF4466;'
|
||
"
|
||
style="margin-left: 8px; font-style: inherit"
|
||
v-if="basicInfo.overTimeStatus"
|
||
>({{ basicInfo.overTimeStatus }})</i
|
||
></span
|
||
>
|
||
</ai-info-item>
|
||
</ai-wrapper>
|
||
<ai-wrapper label-width="80px" :columnsNumber="1">
|
||
<ai-info-item label="任务说明："
|
||
><span>{{ basicInfo.taskDescription }}</span></ai-info-item
|
||
>
|
||
</ai-wrapper>
|
||
<ai-bar title="附件">
|
||
<template
|
||
slot="right"
|
||
v-if="basicInfo.fileList && basicInfo.fileList.length"
|
||
>
|
||
<span class="Edit" @click="downFileAll"
|
||
><i class="iconfont iconDownload"></i>下载全部</span
|
||
>
|
||
</template>
|
||
</ai-bar>
|
||
<ai-file-list
|
||
v-if="basicInfo.fileList && basicInfo.fileList.length"
|
||
:fileList="basicInfo.fileList"
|
||
:fileOps="{ name: 'name', size: 'fileSizeStr' }"
|
||
></ai-file-list>
|
||
</template>
|
||
</ai-card>
|
||
<ai-card title="人员信息">
|
||
<template slot="content">
|
||
<div class="especial">
|
||
<span class="people mar-r40 w80">执行人：</span>
|
||
<ai-wechat-selecter
|
||
slot="append"
|
||
isShowUser
|
||
:instance="instance"
|
||
v-model="basicInfo.userInfoList"
|
||
:isAdd="false"
|
||
></ai-wechat-selecter>
|
||
</div>
|
||
<div class="especial">
|
||
<span class="people mar-r40 w80">督办人：</span>
|
||
<ai-wechat-selecter
|
||
slot="append"
|
||
isShowUser
|
||
:instance="instance"
|
||
v-model="basicInfo.checkUserList"
|
||
:isAdd="false"
|
||
></ai-wechat-selecter>
|
||
</div>
|
||
<div class="especial">
|
||
<span class="people mar-r40 w80">抄送人：</span>
|
||
<ai-wechat-selecter
|
||
slot="append"
|
||
isShowUser
|
||
:instance="instance"
|
||
v-model="basicInfo.sendUserList"
|
||
:isAdd="false"
|
||
></ai-wechat-selecter>
|
||
</div>
|
||
</template>
|
||
</ai-card>
|
||
<el-dialog
|
||
class="deleteStyle mask execute"
|
||
:visible.sync="executeDialog"
|
||
width="800px"
|
||
title="执行情况"
|
||
:close-on-click-modal="false"
|
||
>
|
||
<el-dialog
|
||
width="520px"
|
||
title="执行说明："
|
||
class="deleteStyle mask execute"
|
||
:visible.sync="innerVisible"
|
||
@close="getExecute(executeInfo)"
|
||
:close-on-click-modal="false"
|
||
append-to-body
|
||
>
|
||
<div style="width: 480px; margin: auto; padding: 8px 0">
|
||
<el-form
|
||
:model="sayInfo"
|
||
ref="numberValidateForm"
|
||
label-width="100px"
|
||
class="demo-ruleForm"
|
||
>
|
||
<el-form-item label="执行说明：" prop="doDescription">
|
||
<el-input
|
||
maxlength="1000"
|
||
show-word-limit
|
||
type="textarea"
|
||
:rows="3"
|
||
v-model="sayInfo.doDescription"
|
||
autocomplete="off"
|
||
></el-input>
|
||
</el-form-item>
|
||
</el-form>
|
||
</div>
|
||
<div slot="footer" style="text-align: center">
|
||
<el-button
|
||
style="width: 92px"
|
||
size="small"
|
||
@click="(innerVisible = false), getExecute(executeInfo)"
|
||
>取 消</el-button
|
||
>
|
||
<el-button
|
||
style="width: 92px"
|
||
type="primary"
|
||
size="small"
|
||
@click="updateDescription()"
|
||
>确 认</el-button
|
||
>
|
||
</div>
|
||
</el-dialog>
|
||
<div
|
||
style="
|
||
width: 740px;
|
||
margin: auto;
|
||
padding: 8px 0;
|
||
max-height: 600px;
|
||
overflow: auto;
|
||
"
|
||
>
|
||
<ai-wrapper class="mar-t16" label-width="80px" :columnsNumber="2">
|
||
<ai-info-item label="执行人："><span>{{ executeInfo.userName }}</span></ai-info-item>
|
||
<ai-info-item label="手机号："><span>{{ executeInfo.phone }}</span></ai-info-item>
|
||
</ai-wrapper>
|
||
<ai-wrapper label-width="80px" :columnsNumber="1">
|
||
<ai-info-item label="所属部门："><span>{{ executeInfo.unitName }}</span></ai-info-item>
|
||
</ai-wrapper>
|
||
<ai-wrapper label-width="80px" :columnsNumber="2">
|
||
<ai-info-item label="执行状态：">
|
||
<p v-if="executeInfo.doStatus == 0" style="color: #ff8822">
|
||
未完成
|
||
</p>
|
||
<p v-if="executeInfo.doStatus == 1" style="color: #2ea222">
|
||
已完成
|
||
</p>
|
||
<p v-if="executeInfo.doStatus == 2">已终止</p>
|
||
<p v-if="executeInfo.doStatus == 3">进行中</p>
|
||
<p v-if="executeInfo.doStatus == 4">已关闭</p>
|
||
<p v-if="executeInfo.doStatus == null">-</p>
|
||
</ai-info-item>
|
||
<ai-info-item label="完成时间：">
|
||
<i style="display: block; font-style: normal">{{
|
||
executeInfo.finishTime || "-"
|
||
}}</i>
|
||
<i
|
||
style="color: #ff4466; display: block; font-style: normal"
|
||
v-if="executeInfo.overTimeStatus && executeInfo.doStatus == 1"
|
||
>({{ executeInfo.overTimeStatus }})</i
|
||
>
|
||
</ai-info-item>
|
||
</ai-wrapper>
|
||
<ai-wrapper label-width="80px" :columnsNumber="1">
|
||
<ai-info-item label="当前进度："><span>{{ executeInfo.percent + "%" }}</span></ai-info-item>
|
||
</ai-wrapper>
|
||
<ai-wrapper label-width="80px" :columnsNumber="1">
|
||
<ai-info-item label="执行说明："><span>{{ executeInfo.doDescription }}</span></ai-info-item>
|
||
</ai-wrapper>
|
||
|
||
<div class="step">
|
||
<!-- <el-steps direction="vertical" :active="null" >
|
||
<el-step icon="iconfont iconSteps_Finished" v-for="(e,index) in executeInfo.processList" :key="index">
|
||
<template v-slot:title>
|
||
<p style="color:#333333;">{{e.remarks}}</p>
|
||
</template>
|
||
<template v-slot:description>
|
||
<p style="color:#999999;">完成到 <span :style="e.percent<100 ? 'color:#5088FF':'color:#2EA222' ">{{e.percent}}%</span> | {{e.createDate}}</p>
|
||
</template>
|
||
</el-step>
|
||
|
||
</el-steps> -->
|
||
<el-timeline>
|
||
<el-timeline-item
|
||
v-for="(e, index) in executeInfo.processList"
|
||
:key="index"
|
||
>
|
||
<p style="color: #333333">{{ e.remarks }}</p>
|
||
<p style="color: #999999">
|
||
完成到
|
||
<span
|
||
:style="e.percent < 100 ? 'color:#5088FF' : 'color:#2EA222'"
|
||
>{{ e.percent }}%</span
|
||
>
|
||
| {{ e.createDate }}
|
||
</p>
|
||
</el-timeline-item>
|
||
</el-timeline>
|
||
</div>
|
||
</div>
|
||
<div slot="footer" style="text-align: center">
|
||
<el-button
|
||
style="width: 92px"
|
||
size="small"
|
||
@click="executeDialog = false"
|
||
>关 闭</el-button
|
||
>
|
||
<el-button
|
||
style="width: 148px"
|
||
type="primary"
|
||
size="small"
|
||
@click="
|
||
(innerVisible = true),
|
||
(sayInfo.doDescription = executeInfo.doDescription)
|
||
"
|
||
v-if="basicInfo.status == 0"
|
||
>编辑执行说明</el-button
|
||
>
|
||
</div>
|
||
</el-dialog>
|
||
</template>
|
||
</ai-detail>
|
||
<!-- <detail v-else :instance="instance" :dict="dict" @back="showDetail=false" :params="parentInfo" fromType="SonDetail" detailType="1"></detail> -->
|
||
</div>
|
||
</template>
|
||
|
||
<script>
|
||
|
||
import * as echarts from "echarts";
|
||
import { mapState } from "vuex";
|
||
export default {
|
||
name: "SonDetail",
|
||
props: {
|
||
instance: Function,
|
||
params: Object,
|
||
dict: Object,
|
||
detailType: String
|
||
},
|
||
data() {
|
||
return {
|
||
basicInfo: {
|
||
userInfoList: [],
|
||
checkUserList: [],
|
||
sendUserList: [],
|
||
},
|
||
ListType: "userInfoList",
|
||
listName: "",
|
||
saveList: [],
|
||
suspendDialog: false,
|
||
REttitle: "",
|
||
writeInfo: {
|
||
finishDescription: "",
|
||
},
|
||
appReportTaskDoInfoList: [],
|
||
taskRole: "1",
|
||
checkName: "",
|
||
sendName: "",
|
||
userName: "",
|
||
executeDialog: false,
|
||
executeInfo: {},
|
||
sayInfo: {
|
||
doDescription: "",
|
||
},
|
||
isAll: false,
|
||
colConfigs: [
|
||
{ prop: "userName", label: "姓名" },
|
||
{ prop: "phone", label: "手机号码" },
|
||
{ prop: "unitName", label: "所属部门" },
|
||
{ slot: "status"},
|
||
{ slot: "percent", label: "完成进度" },
|
||
{ slot: "finishTime"},
|
||
{ slot: "options", label: "操作" },
|
||
],
|
||
addUserList: [],
|
||
innerVisible: false,
|
||
showDetail: false,
|
||
parentInfo: {}
|
||
};
|
||
},
|
||
computed: {
|
||
...mapState(["user"]),
|
||
},
|
||
mounted() {
|
||
this.dict
|
||
.load("workTaskType", "workTaskStatus", "workTaskFinishStatus")
|
||
.then(() => {
|
||
this.searchDetail();
|
||
});
|
||
},
|
||
methods: {
|
||
//查详情
|
||
searchDetail() {
|
||
this.sendName = "";
|
||
this.checkName = "";
|
||
this.userName = "";
|
||
this.instance
|
||
.post("/app/appworktaskinfo/queryDetailById", null, {
|
||
params: { id: this.params.id },
|
||
})
|
||
.then((res) => {
|
||
if (res.code == 0) {
|
||
this.basicInfo = res.data;
|
||
|
||
this.basicInfo.userInfoList.map((item) => {
|
||
item.detailId = item.id
|
||
item.name = item.userName
|
||
item.id = item.userId
|
||
})
|
||
|
||
if(this.basicInfo.checkUserList.length) {
|
||
this.basicInfo.checkUserList.map((item) => {
|
||
item.detailId = item.id
|
||
item.name = item.userName
|
||
item.id = item.userId
|
||
})
|
||
}
|
||
|
||
if(this.basicInfo.sponsorUserList.length) {
|
||
this.basicInfo.sponsorUserList.map((item) => {
|
||
item.detailId = item.id
|
||
item.name = item.userName
|
||
item.id = item.userId
|
||
})
|
||
}
|
||
|
||
if(this.basicInfo.sendUserList.length) {
|
||
this.basicInfo.sendUserList.map((item) => {
|
||
item.detailId = item.id
|
||
item.name = item.userName
|
||
item.id = item.userId
|
||
})
|
||
}
|
||
|
||
|
||
this.parentInfo = res.data.parentTask
|
||
this.saveList = JSON.stringify(this.basicInfo[this.ListType]);
|
||
|
||
if (this.basicInfo.checkUserList.length) {
|
||
this.basicInfo.checkUserList.forEach((v) => {
|
||
this.checkName += v.userName + "、";
|
||
});
|
||
this.checkName = this.checkName.substring(
|
||
0,
|
||
this.checkName.length - 1
|
||
);
|
||
}
|
||
|
||
if (this.basicInfo.userInfoList.length) {
|
||
this.basicInfo.userInfoList.forEach((v, index) => {
|
||
this.userName += v.userName + "、";
|
||
this.basicInfo.userInfoList[index].isSend = false;
|
||
});
|
||
this.userName = this.userName.substring(
|
||
0,
|
||
this.userName.length - 1
|
||
);
|
||
}
|
||
|
||
if (this.basicInfo.sendUserList.length) {
|
||
this.basicInfo.sendUserList.forEach((v) => {
|
||
this.sendName += v.userName + "、";
|
||
});
|
||
this.sendName = this.sendName.substring(
|
||
0,
|
||
this.sendName.length - 1
|
||
);
|
||
}
|
||
|
||
//人员选择器去重
|
||
this.appReportTaskDoInfoList = [
|
||
...this.basicInfo.userInfoList,
|
||
...this.basicInfo.checkUserList,
|
||
...this.basicInfo.sendUserList,
|
||
...this.basicInfo.sponsorUserList,
|
||
];
|
||
this.showEchartScale();
|
||
}
|
||
});
|
||
},
|
||
showEchartScale() {
|
||
let myChart = echarts.init(document.getElementById("echart"));
|
||
let legendData = ["未完成", "已完成", "逾期完成"];
|
||
let seriesData = [
|
||
{ value: this.basicInfo.unFinished, name: "未完成" },
|
||
{ value: this.basicInfo.finishedOnTime, name: "按时完成" },
|
||
{ value: this.basicInfo.finishedOutOfTime, name: "逾期完成" },
|
||
];
|
||
let option = {
|
||
backgroundColor: "#fff",
|
||
tooltip: {
|
||
trigger: "item",
|
||
formatter: "{a} <br/>{b} : {c} ({d}%)",
|
||
},
|
||
legend: {
|
||
orient: "vertical",
|
||
right: 340,
|
||
top: 70,
|
||
bottom: 20,
|
||
itemWidth: 8,
|
||
itemHeight: 8,
|
||
formatter: (name) => {
|
||
let item = seriesData.find((e) => e.name == name);
|
||
return `{title|${name}}{content|${
|
||
item ? item.value.toLocaleString() : 0
|
||
}}`;
|
||
},
|
||
// data: legendData
|
||
textStyle: {
|
||
fontSize: 14,
|
||
rich: {
|
||
title: {
|
||
width: 100,
|
||
color: "#AAA",
|
||
paddingLeft: 6,
|
||
fontSize: 14,
|
||
},
|
||
content: {
|
||
color: "#333",
|
||
width: 50,
|
||
align: "right",
|
||
fontSize: 14,
|
||
},
|
||
},
|
||
},
|
||
},
|
||
series: [
|
||
{
|
||
name: "完成情况比例",
|
||
type: "pie",
|
||
radius: ["40%", "75%"],
|
||
center: ["14%", "45%"],
|
||
avoidLabelOverlap: false,
|
||
label: {
|
||
position: "inside",
|
||
formatter: (params) => {
|
||
if (params.value == 0) {
|
||
return "";
|
||
} else {
|
||
return `${params.percent}%`;
|
||
}
|
||
},
|
||
},
|
||
data: seriesData,
|
||
itemStyle: {
|
||
normal: {
|
||
color: function (params) {
|
||
//自定义颜色
|
||
var colorList = ["#FFAA44", "#2EA222", "#3D94FB"];
|
||
return colorList[params.dataIndex];
|
||
},
|
||
},
|
||
},
|
||
},
|
||
],
|
||
};
|
||
myChart.setOption(option);
|
||
},
|
||
ListTypeChange(val) {
|
||
this.saveList = JSON.stringify(this.basicInfo[val]);
|
||
this.listName = "";
|
||
if (val == "userInfoList") this.taskRole = "1";
|
||
if (val == "checkUserList") this.taskRole = "2";
|
||
if (val == "sendUserList") this.taskRole = "3";
|
||
this.searchDetail(this.params.id);
|
||
},
|
||
//删除任务
|
||
deleteTask() {
|
||
this.$confirm("是否确认删除本次任务，删除后无法恢复？", {
|
||
type: "error",
|
||
}).then(() => {
|
||
this.instance
|
||
.post("/app/appworktaskinfo/delete", null, {
|
||
params: {
|
||
id: this.params.id,
|
||
},
|
||
})
|
||
.then((res) => {
|
||
if (res.code == 0) {
|
||
this.$message.success("删除成功");
|
||
this.onBack();
|
||
}
|
||
});
|
||
});
|
||
},
|
||
filterData(val) {
|
||
if (val) {
|
||
let list = JSON.parse(this.saveList).filter(
|
||
(e) => e.userName.indexOf(val) !== -1
|
||
);
|
||
this.$set(this.basicInfo, this.ListType, list);
|
||
} else {
|
||
this.$set(this.basicInfo, this.ListType, JSON.parse(this.saveList));
|
||
}
|
||
},
|
||
//催办多人
|
||
urgeMessageAll() {
|
||
if (!this.isAll) {
|
||
this.$confirm("是否向全部执行人发送催办提醒？", {
|
||
type: "warning",
|
||
title: "发送催办提醒",
|
||
}).then(() => {
|
||
this.instance
|
||
.post("/app/appworktaskuserinfo/sendMesage", null, {
|
||
params: {
|
||
id: this.params.id,
|
||
},
|
||
})
|
||
.then((res) => {
|
||
if (res.code == 0) {
|
||
this.$message.success("催办消息已发送");
|
||
this.isAll = true;
|
||
this.basicInfo.userInfoList.forEach((e, index) => {
|
||
e.isSend = true;
|
||
this.$set(this.basicInfo.userInfoList, index, e);
|
||
});
|
||
}
|
||
});
|
||
});
|
||
}
|
||
},
|
||
//催办单人
|
||
urgeMessage(row) {
|
||
if (row.doStatus == 0 && !row.isSend) {
|
||
this.$confirm(`是否向【执行人：${row.userName}】发送催办提醒？`, {
|
||
type: "warning",
|
||
title: "发送催办提醒",
|
||
}).then(() => {
|
||
this.instance
|
||
.post("/app/appworktaskuserinfo/sendMesageOne", null, {
|
||
params: {
|
||
id: row.detailId,
|
||
},
|
||
})
|
||
.then((res) => {
|
||
if (res.code == 0) {
|
||
this.$message.success("催办消息已发送");
|
||
row.isSend = true;
|
||
let index = this.basicInfo.userInfoList.findIndex(
|
||
(e) => e.id == row.id
|
||
);
|
||
if (index > -1)
|
||
this.$set(this.basicInfo.userInfoList, index, row);
|
||
}
|
||
});
|
||
});
|
||
}
|
||
},
|
||
//执行情况
|
||
getExecute(row) {
|
||
this.instance
|
||
.post("/app/appworktaskuserinfo/queryDetailById", null, {
|
||
params: {
|
||
id: row.detailId,
|
||
},
|
||
})
|
||
.then((res) => {
|
||
if (res.code == 0) {
|
||
this.executeDialog = true;
|
||
this.executeInfo = res.data;
|
||
this.executeInfo.detailId = this.executeInfo.id
|
||
}
|
||
});
|
||
},
|
||
updateDescription() {
|
||
this.instance
|
||
.post(`/app/appworktaskuserinfo/updateDoDescription`, {
|
||
id: this.executeInfo.detailId,
|
||
doDescription: this.sayInfo.doDescription,
|
||
})
|
||
.then((res) => {
|
||
if (res.code == 0) {
|
||
this.innerVisible = false;
|
||
}
|
||
});
|
||
},
|
||
//中止任务-取消任务-退回任务
|
||
overTask(formName) {
|
||
let url = ``;
|
||
if (this.REttitle == "任务完成情况") {
|
||
url = `/app/appworktaskuserinfo/confirm`;
|
||
var obj = {
|
||
taskCode: this.params.taskCode,
|
||
finishDescription: this.writeInfo.finishDescription,
|
||
lastTime: this.basicInfo.lastTime,
|
||
};
|
||
} else if (this.REttitle == "关闭任务") {
|
||
url = `/app/appworktaskinfo/stopOrFinish`;
|
||
var obj = {
|
||
id: this.params.id,
|
||
status: "2",
|
||
closeDescription: this.writeInfo.finishDescription,
|
||
};
|
||
} else if (this.REttitle == "取消任务") {
|
||
url = `/app/appreporttaskinfo/cancelTaskById`;
|
||
var obj = {
|
||
id: this.params.id,
|
||
...this.writeInfo,
|
||
};
|
||
}
|
||
this.instance
|
||
.post(
|
||
url,
|
||
{
|
||
...obj,
|
||
},
|
||
null
|
||
)
|
||
.then((res) => {
|
||
if (res.code == 0) {
|
||
this.$message.success(this.REttitle + "成功");
|
||
if (this.REttitle == "退回任务") {
|
||
this.searchDetail(this.params.id);
|
||
} else {
|
||
this.onBack();
|
||
}
|
||
this.suspendDialog = false;
|
||
}
|
||
});
|
||
},
|
||
|
||
//确认完成
|
||
markCompleted(type) {
|
||
this.$confirm(
|
||
"标记完成后，本次任务变成已完成，任务结果将锁定无法修改，请确保所有执行人已经完成任务，是否继续？",
|
||
{
|
||
type: "success",
|
||
title: "标记完成",
|
||
}
|
||
).then(() => {
|
||
this.instance
|
||
.post(
|
||
"/app/appworktaskinfo/stopOrFinish",
|
||
{
|
||
id: this.params.id,
|
||
status: type,
|
||
},
|
||
null
|
||
)
|
||
.then((res) => {
|
||
if (res.code == 0) {
|
||
this.$message.success("已标记完成");
|
||
this.onBack();
|
||
}
|
||
});
|
||
});
|
||
},
|
||
//删掉执行单位
|
||
deleteUnit(row) {
|
||
this.$confirm("是否确认删除此人？", {
|
||
type: "warning",
|
||
}).then(() => {
|
||
this.instance
|
||
.post("/app/appworktaskuserinfo/delete", null, {
|
||
params: {
|
||
ids: row.detailId,
|
||
},
|
||
})
|
||
.then((res) => {
|
||
if (res.code == 0) {
|
||
this.$message.success("删除成功");
|
||
this.searchDetail(this.params.id);
|
||
}
|
||
});
|
||
});
|
||
},
|
||
surePersonalFn() {
|
||
this.lastPersonalList = this.tags;
|
||
this.lastPersonalList.forEach((item, index) => {
|
||
this.lastPersonalList[index].taskCode = this.params.taskCode;
|
||
this.lastPersonalList[index].taskRole = this.taskRole;
|
||
});
|
||
if (this.lastPersonalList.length > 0) {
|
||
this.instance
|
||
.post(
|
||
`/app/appworktaskuserinfo/addUserInfos`,
|
||
|
||
this.lastPersonalList
|
||
)
|
||
.then((res) => {
|
||
if (res.code == 0) {
|
||
this.$message.success("保存成功");
|
||
this.showSelectPer = false;
|
||
this.searchDetail(this.params.id);
|
||
}
|
||
});
|
||
} else {
|
||
this.$message.error("增加人数不能为空");
|
||
}
|
||
},
|
||
surePersonal() {
|
||
debounce(this.surePersonalFn(), 3000);
|
||
},
|
||
downFileAll () {
|
||
if (this.basicInfo.fileList.length > 0) {
|
||
this.instance.post('/app/appofficialdocumentinfo/downLoadAllFileForDetail', null, {
|
||
responseType: 'blob',
|
||
params: {
|
||
id: this.basicInfo.id
|
||
}
|
||
}).then((res) => {
|
||
const link = document.createElement('a')
|
||
let blob = new Blob([res], { type: 'application/vnd.ms-excel' })
|
||
link.style.display = 'none'
|
||
link.href = URL.createObjectURL(blob)
|
||
var num = ''
|
||
for (let i = 0; i < 10; i++) {
|
||
num += Math.ceil(Math.random() * 10)
|
||
}
|
||
link.setAttribute('download', '工作文件' + '.zip')
|
||
document.body.appendChild(link)
|
||
link.click()
|
||
document.body.removeChild(link)
|
||
})
|
||
} else {
|
||
this.$message.error('暂无附件提供下载')
|
||
}
|
||
},
|
||
downFile(item) {
|
||
window.open(item.url);
|
||
},
|
||
onBack() {
|
||
if(this.detailType == 'detail') { //从父任务
|
||
this.$emit("back");
|
||
}else { //列表
|
||
this.$emit('change', {
|
||
type: 'list',
|
||
})
|
||
}
|
||
|
||
},
|
||
toParent() {
|
||
if(this.detailType == 'detail') { //从父任务
|
||
this.$emit("back");
|
||
}else { //列表
|
||
this.$emit('change', {
|
||
type: 'Detail',
|
||
params: {
|
||
type: 'Detail',
|
||
id: this.parentInfo.id,
|
||
fromType: 'SonDetail',
|
||
sonDetailId: this.params.id
|
||
}
|
||
})
|
||
}
|
||
},
|
||
confirmAdd(type) {
|
||
if(this.addUserList.length>0){
|
||
this.addUserList.map((item) => {
|
||
item.taskRole = type
|
||
item.taskCode = this.basicInfo.taskCode;
|
||
})
|
||
this.instance.post(`/app/appworktaskuserinfo/addUserInfos`,this.addUserList).then(res => {
|
||
if(res.code==0){
|
||
this.addUserList = []
|
||
this.$message.success('保存成功');
|
||
this.searchDetail();
|
||
}
|
||
});
|
||
}else{
|
||
this.$message.error("增加人数不能为空")
|
||
}
|
||
},
|
||
closeWork() {
|
||
this.$confirm("任务关闭后无法恢复，确定关闭？", {
|
||
type: "error",
|
||
}).then(() => {
|
||
this.REttitle = "关闭任务"
|
||
this.overTask()
|
||
});
|
||
}
|
||
},
|
||
};
|
||
</script>
|
||
|
||
<style scoped lang="scss">
|
||
.especial {
|
||
margin-bottom: 12px;
|
||
.icon {
|
||
vertical-align: top;
|
||
display: inline-block;
|
||
padding-top: 5px;
|
||
margin-left: 20px;
|
||
color: #f46;
|
||
}
|
||
.people {
|
||
display: inline-block;
|
||
font-size: 14px;
|
||
color: #666;
|
||
margin-right: 16px;
|
||
vertical-align: top;
|
||
}
|
||
.AiWechatSelecter {
|
||
display: inline-block;
|
||
margin-left: 3px;
|
||
}
|
||
.hint {
|
||
font-size: 14px;
|
||
color: #999;
|
||
margin-left: 16px;
|
||
}
|
||
.mar-r40 {
|
||
margin-right: 40px;
|
||
}
|
||
.w80 {
|
||
width: 80px;
|
||
text-align: right;
|
||
color: #888;
|
||
}
|
||
}
|
||
.add-icon {
|
||
text-align: right;
|
||
cursor: pointer;
|
||
i {
|
||
font-size: 14px;
|
||
}
|
||
}
|
||
.color1 {
|
||
color: #4b87fe;
|
||
}
|
||
.color2 {
|
||
color: #2ea222;
|
||
}
|
||
.color3 {
|
||
color: #999999;
|
||
}
|
||
.echart {
|
||
width: 100%;
|
||
height: 240px;
|
||
}
|
||
.AiWechatSelecter{
|
||
width: calc(100% - 150px);
|
||
}
|
||
</style>
|