562 lines
15 KiB
Python
562 lines
15 KiB
Python
<template>
|
||
<div class="app-container">
|
||
<el-card>
|
||
<div slot="header" class="clearfix">
|
||
<span>任务详情</span>
|
||
</div>
|
||
<div style="margin-left: 10px; margin-right: 10px;">
|
||
<el-row :gutter="20">
|
||
<el-col :span="6">
|
||
<div style="margin-bottom: 6px">
|
||
<span class="term">任务名称:</span>
|
||
<span class="desc"> {{ task.name }}</span>
|
||
</div>
|
||
</el-col>
|
||
<el-col :span="6">
|
||
<div style="margin-bottom: 6px">
|
||
<span class="term">巡检开始日期:</span>
|
||
<span class="desc"> {{ task.start_date }}</span>
|
||
</div>
|
||
</el-col>
|
||
<el-col :span="6">
|
||
<div style="margin-bottom: 6px">
|
||
<span class="term">巡检结束日期:</span>
|
||
<span class="desc"> {{ task.end_date }}</span>
|
||
</div>
|
||
</el-col>
|
||
<el-col :span="6">
|
||
<div style="margin-bottom: 6px">
|
||
<span class="term">创建人:</span>
|
||
<span class="desc" v-if="task.create_by_">
|
||
{{ task.create_by_.name }}/</span
|
||
>
|
||
<span class="desc" v-if="task.belong_dept_">{{
|
||
task.belong_dept_.name
|
||
}}</span>
|
||
</div>
|
||
</el-col>
|
||
|
||
|
||
</el-row>
|
||
|
||
</div>
|
||
<el-button
|
||
type="primary"
|
||
@click="starttask()"
|
||
v-if="task.state != '已完成'"
|
||
size="small"
|
||
>发布任务</el-button
|
||
>
|
||
</el-card>
|
||
|
||
|
||
<el-card style="margin-top: 2px">
|
||
<div slot="header" class="clearfix">
|
||
<el-button type="primary" icon="el-icon-plus" @click="dialogVisible = true"
|
||
>创建子任务</el-button
|
||
>
|
||
</div>
|
||
|
||
<el-table
|
||
:data="subinsecttask"
|
||
border
|
||
fit
|
||
stripe
|
||
highlight-current-row
|
||
max-height="300"
|
||
@row-click="clickRow"
|
||
>
|
||
<el-table-column type="index" width="50" />
|
||
<el-table-column align="center" label="子任务">
|
||
<template slot-scope="scope">{{ scope.row.name }}</template>
|
||
</el-table-column>
|
||
<el-table-column align="center" label="巡检人员">
|
||
<template slot-scope="scope">
|
||
<span v-for="item in scope.row.members" v-bind:key="item.member">
|
||
|
||
<el-tag v-if="item.type=='组长'" effect="plain">{{
|
||
item.member__name
|
||
}}</el-tag>
|
||
<el-tag type="danger" effect="plain" v-else>{{
|
||
item.member__name
|
||
}}</el-tag>
|
||
</span>
|
||
|
||
</template>
|
||
</el-table-column>
|
||
|
||
<el-table-column align="center" label="发布状态">
|
||
<template slot-scope="scope">{{ scope.row.state }}</template>
|
||
</el-table-column>
|
||
|
||
<el-table-column
|
||
align="center"
|
||
label="操作"
|
||
width="200px"
|
||
fixed="right"
|
||
>
|
||
<template slot-scope="scope">
|
||
<!-- <el-button
|
||
type="primary"
|
||
size="small"
|
||
icon="el-icon-edit"
|
||
@click="handleEdit(scope)"
|
||
/> -->
|
||
<el-button
|
||
type="danger"
|
||
size="small"
|
||
icon="el-icon-delete"
|
||
@click="handleDelete(scope)"
|
||
/>
|
||
</template>
|
||
</el-table-column>
|
||
</el-table>
|
||
</el-card>
|
||
|
||
|
||
<el-card style="float:left;width: 30%;margin-top:4px">
|
||
<!-- <el-button type="primary" icon="el-icon-plus" @click="adddept">增加巡检组织</el-button> -->
|
||
<el-table
|
||
:data="recordList"
|
||
max-height="300"
|
||
fit
|
||
stripe
|
||
highlight-current-row
|
||
style="width: 100%"
|
||
@row-click="recorclickRow"
|
||
>
|
||
<el-table-column
|
||
label="组织名称">
|
||
<template slot-scope="scope">
|
||
|
||
{{ scope.row.dept__name }}
|
||
|
||
</template>
|
||
</el-table-column>
|
||
<el-table-column
|
||
label="检查状态">
|
||
<template slot-scope="scope">
|
||
|
||
<el-tag size="medium">{{ scope.row.state }}</el-tag>
|
||
|
||
</template>
|
||
</el-table-column>
|
||
|
||
|
||
</el-table>
|
||
</el-card>
|
||
<el-card class="box-card" style="float:right;width: 70%;margin-top:4px;">
|
||
<el-button type="primary" @click="dialogFormVisible=true">指派任务</el-button>
|
||
<el-table
|
||
:data="inspectitemList"
|
||
max-height="300"
|
||
fit
|
||
stripe
|
||
highlight-current-row
|
||
style="width: 100%"
|
||
@selection-change="handleSelectionChange">
|
||
<el-table-column
|
||
type="selection"
|
||
width="55">
|
||
</el-table-column>
|
||
<el-table-column
|
||
label="检查类别">
|
||
<template slot-scope="scope">
|
||
|
||
{{ scope.row.item_.cate_name }}
|
||
|
||
</template>
|
||
</el-table-column>
|
||
<el-table-column
|
||
label="检查要点">
|
||
<template slot-scope="scope">
|
||
|
||
{{ scope.row.item_.name }}
|
||
|
||
</template>
|
||
</el-table-column>
|
||
<el-table-column
|
||
label="检查类型">
|
||
<template slot-scope="scope">
|
||
|
||
{{ scope.row.item_.type }}
|
||
|
||
</template>
|
||
</el-table-column>
|
||
<el-table-column
|
||
label="检查人">
|
||
<template slot-scope="scope" v-if="scope.row.checker_">
|
||
|
||
{{ scope.row.checker_.name }}
|
||
|
||
</template>
|
||
</el-table-column>
|
||
<el-table-column
|
||
label="是否检查">
|
||
<template slot-scope="scope">
|
||
<el-tag v-if="scope.row.checked" effect="plain">是</el-tag>
|
||
<el-tag type="danger" effect="plain" v-else>否</el-tag>
|
||
|
||
</template>
|
||
</el-table-column>
|
||
|
||
</el-table>
|
||
</el-card>
|
||
|
||
<el-dialog
|
||
:visible.sync="dialogFormVisible"
|
||
:title="dialogType === 'edit' ? '编辑任务' : '指派人员'"
|
||
>
|
||
<el-form
|
||
ref="Forms"
|
||
:model="mbersData"
|
||
label-width="80px"
|
||
label-position="right"
|
||
>
|
||
|
||
<el-form-item label="负责人" prop="checker">
|
||
<el-select
|
||
v-model="mbersData.checker"
|
||
style="width: 100%"
|
||
allow-create
|
||
default-first-option
|
||
placeholder="请选择组长">
|
||
<el-option
|
||
v-for="item in leaders"
|
||
:key="item.member"
|
||
:label="item.member__name"
|
||
:value="item.member">
|
||
</el-option>
|
||
</el-select>
|
||
|
||
|
||
</el-form-item>
|
||
|
||
|
||
</el-form>
|
||
<div style="text-align: right">
|
||
<el-button type="danger" @click="dialogVisible = false">取消</el-button>
|
||
<el-button type="primary" @click="sendconfirm('Forms')">确认</el-button>
|
||
</div>
|
||
</el-dialog>
|
||
|
||
|
||
<el-dialog
|
||
:visible.sync="dialogVisible"
|
||
:title="dialogType === 'edit' ? '编辑任务' : '新增任务'"
|
||
>
|
||
<el-form
|
||
ref="Form"
|
||
:model="inspecttask"
|
||
label-width="80px"
|
||
label-position="right"
|
||
>
|
||
<el-form-item label="子任务名" prop="name">
|
||
<el-input v-model="inspecttask.name" placeholder="子任务名" />
|
||
</el-form-item>
|
||
<el-form-item label="选择组长" prop="leader">
|
||
<el-select
|
||
v-model="inspecttask.leader"
|
||
style="width: 100%"
|
||
allow-create
|
||
default-first-option
|
||
placeholder="请选择组长">
|
||
<el-option
|
||
v-for="item in leaderOptions"
|
||
:key="item.value"
|
||
:label="item.label"
|
||
:value="item.value">
|
||
</el-option>
|
||
</el-select>
|
||
|
||
|
||
</el-form-item>
|
||
<el-form-item label="选择组员" prop="member">
|
||
<el-select
|
||
v-model="inspecttask.members"
|
||
multiple
|
||
filterable
|
||
style="width: 100%"
|
||
allow-create
|
||
default-first-option
|
||
placeholder="请选择组员">
|
||
<el-option
|
||
v-for="item in memberOptions"
|
||
:key="item.value"
|
||
:label="item.label"
|
||
:value="item.value">
|
||
</el-option>
|
||
</el-select>
|
||
|
||
|
||
</el-form-item>
|
||
<el-form-item label="选择组织" prop="leader">
|
||
|
||
<el-select
|
||
v-model="inspecttask.depts"
|
||
multiple
|
||
filterable
|
||
style="width: 100%"
|
||
allow-create
|
||
default-first-option
|
||
placeholder="请选择组织">
|
||
<el-option
|
||
v-for="item in deptOptions"
|
||
:key="item.value"
|
||
:label="item.label"
|
||
:value="item.value">
|
||
</el-option>
|
||
</el-select>
|
||
</el-form-item>
|
||
|
||
</el-form>
|
||
<div style="text-align: right">
|
||
<el-button type="danger" @click="dialogVisible = false">取消</el-button>
|
||
<el-button type="primary" @click="confirm('Form')">确认</el-button>
|
||
</div>
|
||
</el-dialog>
|
||
|
||
</div>
|
||
</template>
|
||
<style>
|
||
.text {
|
||
font-size: 14px;
|
||
}
|
||
|
||
.item {
|
||
padding: 18px 0;
|
||
}
|
||
|
||
.box-card {
|
||
width: 50%;
|
||
}
|
||
</style>
|
||
<style >
|
||
.term {
|
||
color: rgba(0, 0, 0, 0.85);
|
||
font-weight: bold;
|
||
font-size: 16px;
|
||
}
|
||
.desc {
|
||
color: rgba(0, 0, 0, 0.65);
|
||
font-weight: bold;
|
||
font-size: 16px;
|
||
}
|
||
.litem {
|
||
margin-bottom: 4px;
|
||
margin-left: 2px;
|
||
cursor: pointer;
|
||
color: #409eff;
|
||
}
|
||
</style>
|
||
<script>
|
||
import { getinspecttask } from "@/api/inspectTask";
|
||
import { getsubinspecttasklist,createsubinspecttask,starttask,deletesubinspecttask,getsubinspecttaskdep,getinspectrecordlist,addappoint} from "@/api/subinspecttask";
|
||
import { getUserList } from "@/api/user";
|
||
import { getOrgList } from "@/api/org";
|
||
import { genTree } from "@/utils";
|
||
import Pagination from "@/components/Pagination";
|
||
import checkPermission from "@/utils/permission";
|
||
|
||
const defaulttask = {
|
||
name: "",
|
||
leader:"",
|
||
members:"",
|
||
depts:"",
|
||
};
|
||
const mbersData = {
|
||
checker:""
|
||
}
|
||
export default {
|
||
components: { Pagination},
|
||
|
||
data() {
|
||
return {
|
||
task: { id: 0 },
|
||
inspecttask: defaulttask,
|
||
dialogVisible: false,
|
||
dialogFormVisible:false,
|
||
listLoading: true,
|
||
leaderOptions:[],
|
||
recordList:[],
|
||
ids:[],
|
||
subinsecttask:[],
|
||
memberOptions:[],
|
||
inspectitemList:[],
|
||
mbersData:mbersData,
|
||
deptOptions:[],
|
||
leaders:[],
|
||
dialogType: "new",
|
||
data: {},
|
||
listQuery:{},
|
||
};
|
||
},
|
||
created() {
|
||
this.task.id = this.$route.params.id;
|
||
this.getinspecttask();//主任务信息
|
||
//this.getTypeAll();//组长
|
||
this.getUserList();//组员
|
||
this.getOrgList();//组织
|
||
this.getsubinspecttasklist();//子任务名
|
||
},
|
||
methods: {
|
||
checkPermission,
|
||
//主任务信息展示
|
||
getinspecttask() {
|
||
getinspecttask(this.task.id).then((res) => {
|
||
this.task = res.data;
|
||
|
||
});
|
||
},
|
||
//子任务信息
|
||
getsubinspecttasklist(){
|
||
getsubinspecttasklist({pageoff:true}).then((res)=>{
|
||
this.subinsecttask=res.data;
|
||
});
|
||
},
|
||
//组长列表
|
||
getTypeAll() {
|
||
getUserList({pageoff:true, roles__name:'质量巡查成员'}).then((res) => {
|
||
this.leaderOptions = genTree(res.data);
|
||
this.memberOptions = genTree(res.data);
|
||
});
|
||
},
|
||
//组员列表
|
||
getUserList() {
|
||
getUserList({pageoff:true, roles__name:'质量巡查成员'}).then((res) => {
|
||
this.leaderOptions = genTree(res.data);
|
||
this.memberOptions = genTree(res.data);
|
||
});
|
||
},
|
||
//组织列表
|
||
getOrgList() {
|
||
getOrgList({can_supervision:true}).then((res) => {
|
||
this.deptOptions = genTree(res.data);
|
||
});
|
||
},
|
||
|
||
handleCreate() {
|
||
this.inspecttask = Object.assign({}, defaulttask);
|
||
this.dialogType = "new";
|
||
this.dialogVisible = true;
|
||
this.$nextTick(() => {
|
||
this.$refs["Form"].clearValidate();
|
||
});
|
||
},
|
||
|
||
starttask() {
|
||
this.$confirm("确认发布任务吗?", "提示")
|
||
.then(async () => {
|
||
await starttask(this.task.id);
|
||
location.reload();
|
||
this.$message.success("成功");
|
||
})
|
||
.catch((err) => {
|
||
console.error(err);
|
||
});
|
||
},
|
||
//创建子任务
|
||
async confirm(form) {
|
||
console.log(this.inspecttask)
|
||
this.inspecttask.inspecttask=this.$route.params.id;
|
||
|
||
createsubinspecttask(this.inspecttask).then((res) => {
|
||
|
||
this.dialogVisible = false;
|
||
this.getsubinspecttasklist()
|
||
this.$message.success("成功");
|
||
|
||
});
|
||
},
|
||
//子任务删除
|
||
handleDelete(scope){
|
||
|
||
this.$confirm("确认删除?", "警告", {
|
||
confirmButtonText: "确认",
|
||
cancelButtonText: "取消",
|
||
type: "error",
|
||
})
|
||
.then(async () => {
|
||
await deletesubinspecttask(scope.row.id);
|
||
this.getsubinspecttasklist()
|
||
this.$message.success("成功");
|
||
})
|
||
.catch((err) => {
|
||
console.error(err);
|
||
});
|
||
},
|
||
//子任务编辑
|
||
handleEdit(){
|
||
|
||
},
|
||
//点击子任务，弹出巡检的公司
|
||
getsubinspecttaskdep() {
|
||
getsubinspecttaskdep(this.id)
|
||
.then((res) => {
|
||
this.recordList = res.data;
|
||
|
||
})
|
||
|
||
},
|
||
|
||
clickRow(row, col, e) {
|
||
this.listLoading2 = true;
|
||
this.id = row.id;
|
||
this.subtask=row.id;
|
||
|
||
this.getsubinspecttaskdep();
|
||
|
||
this.leaders = row.members;
|
||
|
||
|
||
},
|
||
//增加巡检组织
|
||
adddept()
|
||
{
|
||
|
||
},
|
||
//点击组织弹出清单
|
||
getinspectrecordlist() {
|
||
getinspectrecordlist(this.listQuery)
|
||
.then((res) => {
|
||
this.inspectitemList = res.data;
|
||
|
||
})
|
||
|
||
},
|
||
|
||
recorclickRow(row, col, e) {
|
||
this.listLoading2 = true;
|
||
this.listQuery = {pageoff:true, subtask: this.subtask, dept: row.dept }
|
||
this.getinspectrecordlist();
|
||
},
|
||
|
||
handleSelectionChange(val){
|
||
|
||
this.multipleSelection = val;
|
||
},
|
||
sendconfirm(){
|
||
|
||
|
||
const lengths = this.multipleSelection.length;
|
||
for (let i = 0; i < lengths; i++) {
|
||
this.ids.push(this.multipleSelection[i].id);
|
||
}
|
||
console.log(lengths)
|
||
//let data = { records: this.ids };//检查项ID
|
||
|
||
|
||
this.mbersData.records=this.ids
|
||
console.log(this.mbersData)
|
||
addappoint(this.mbersData).then((res) => {
|
||
|
||
this.dialogFormVisible = false;
|
||
this.getinspectrecordlist();
|
||
this.$message.success("成功");
|
||
|
||
});
|
||
|
||
}
|
||
},
|
||
};
|
||
</script> |