You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

283 lines
8.7 KiB

<template>
<div style="padding: 0 20px">
<div ref="lxHeader">
<lx-header icon="md-apps" :text="textName" style="margin-bottom: 10px; border: 0px; margin-top: 15px">
<slot>
<div style="display: flex;justify-content: flex-start;flex-wrap: wrap;">
<DatePicker v-model="select.year" style='width:200px;margin-right: 10px;' placeholder="年份"
placement="bottom" format='yyyy' type="year" @on-change="changeYear"></DatePicker>
<Select filterable clearable style='width:200px;margin-right: 10px;' v-model="select.audit_status"
placeholder="计划状态">
<Option v-for="item in auditStatusList" :value="item.id">{{item.value}}</Option>
</Select>
<Input v-model="select.keyword" clearable style="width: 200px;margin-right: 10px;" placeholder="关键字搜索" />
<Button type="primary" @click="getList">查询</Button>
</div>
</slot>
</lx-header>
</div>
<div class="tablewrap">
<div class="tablemonth">
<el-checkbox :indeterminate="isIndeterminate" v-model="checkAll" @change="handleCheckAllChange">全选</el-checkbox>
<div style="margin: 15px 0;"></div>
<el-checkbox-group v-model="selectMonth" @change="changeMonth">
<el-checkbox v-for="item in allMonths" :label="item"></el-checkbox>
</el-checkbox-group>
</div>
<div class="tablecontent">
<xy-table :list="list" :total="total" row-key="rowindex" stripe @cell-dblclick="cellClicks"
@pageSizeChange="e => {select.page_size = e,getList()}" @pageIndexChange="e => {select.page = e,getList()}"
:table-item="table">
<template v-slot:btns>
<el-table-column align='center' label="操作" width="200" header-align="center">
<template slot-scope="scope">
<div v-if="scope.row.audit_status==0">
<Button v-if="stateObj.is_leader" type="primary" style='margin-right:5px;margin-bottom:5px;' size="small"
@click="auditPlan(scope.row,'audit')">审核任务</Button>
<div v-else>等待审核</div>
</div>
<div v-if="scope.row.audit_status==1">
<Button type="primary" style='margin-right:5px;margin-bottom:5px;' size="small"
@click="editUnit(scope.row,1,'plan_unit')">发布任务</Button>
</div>
<div v-if="scope.row.audit_status!=0">
<Button type="primary" style='margin-right:5px;margin-bottom:5px;' size="small"
@click="editorPlan(scope.row.id,'editor')">编辑计划</Button>
</div>
</template>
</el-table-column>
</template>
</xy-table>
</div>
</div>
<addPlan ref='addPlan' @refresh='getList'></addPlan>
<addUnit ref='addUnit' @refresh="getList"></addUnit>
<showPlan ref='showPlan'></showPlan>
</div>
</template>
<script>
import addPlan from '../list/components/addPlan.vue'
import addUnit from '../list/components/addUnit.vue'
import showPlan from '../list/components/showPlan.vue'
import {
listplan,
del
} from '@/api/task/plan.js'
import state from '@/store/modules/user.js'
export default {
components: {
addPlan,
showPlan,
addUnit
},
data() {
return {
textName: '',
stateObj: {},
select: {
keyword: '',
page: 1,
page_size: 10,
audit_status:'',
// is_myself_audit:0,
year: '',
plan_type: '',
sort_name: '',
sort_type: '',
main_admin_id:1,
month:''
},
isIndeterminate: true,
checkAll: false,
selectMonth: [],
allMonths: ['一月', '二月', '三月', '四月', '五月', '六月', '七月', '八月', '九月', '十月', '十一月', '十二月'],
total: 0,
list: [],
auditStatusList:[{
id:0,
value:'待审核',
type:'info'
},{
id:1,
value:'已审核',
type:'success'
},{
id:2,
value:'已保存',
type:''
}],
table: [{
label: "计划名称",
prop: 'name',
align:'left'
}, {
label: "状态",
prop: 'audit_status',
align:'center',
width:120,
customFn: (row) => {
return ( <div> {
this.auditStatusList.map(item => {
if (item.id == row.audit_status) {
return ( <el-tag type = {
item.type
}> {
item.value
} </el-tag>)
}
})
} </div>)
}
},{
label: "任务要求及内容",
prop: 'content',
// width: 120,
align: 'left'
}, {
label: "责任人",
prop: 'main_admin.name',
width: 120,
}]
}
},
created() {
// this.getUserId()
// this.getLeads()
this.stateObj = state.state
console.log("this.stateObj",this.stateObj)
if(this.stateObj.is_guiji){
this.select.main_admin_id = 0
}
this.select.year = (new Date()).getFullYear() + ''
let currentMonth = this.allMonths[(new Date()).getMonth()]
this.selectMonth.push(currentMonth)
this.select.month = this.selectMonth.join(',')
this.getList()
},
methods: {
async getList() {
const res = await listplan({
...this.select
})
this.list = res.data
this.total = res.total
},
handleCheckAllChange(val) {
this.selectMonth = val ? this.allMonths : [];
this.isIndeterminate = false;
let _arr = []
this.select.month = this.selectMonth.join(',')
this.getList()
},
changeMonth(e) {
let checkedCount = e.length;
this.checkAll = checkedCount === this.allMonths.length;
this.isIndeterminate = checkedCount > 0 && checkedCount < this.allMonths.length;
this.select.month = this.selectMonth.join(',')
this.getList()
},
changeYear(e) {
console.log(e)
this.select.year = e
},
editUnit(row,type,plan_unit){
this.$refs.addUnit.type="add"
this.$refs.addUnit.setoutLineId(row.out_line_id)
this.$refs.addUnit.setMissionPlanId(row.id)
this.$refs.addUnit.setType(type)
this.$refs.addUnit.setPlanUnit(plan_unit)
this.$refs.addUnit.setNameContent(row.name,row.content)
this.$refs.addUnit.setMenuLevel(row.menu,row.level,row.menu_id,row.level_id)
this.$refs.addUnit.setMainId(row.main_department_id,row.main_admin_id)
this.$refs.addUnit.isShow = true
},
toUrlUnit(e){
this.$router.push('/task/list/unit_1')
},
editorPlan(id, type) {
if (type == 'add') {
this.$refs.addPlan.plan_type = this.select.plan_type
}
this.$refs.addPlan.id = id
this.$refs.addPlan.type = type
this.$refs.addPlan.isShow = true
},
// 审核
auditPlan(row,type){
this.$refs.addPlan.id = row.id
this.$refs.addPlan.type = type
this.$refs.addPlan.isShow = true
},
cellClicks(e) {
this.$refs.showPlan.id = e.row.id
this.$refs.showPlan.isShow = true
},
showPlan(id) {
this.$refs.showPlan.id = id
this.$refs.showPlan.isShow = true
},
},
watch: {}
}
</script>
<style scoped>
.tablewrap {
display: flex;
}
.tablemonth {
width: 10%;
background: #fff;
padding: 20px;
margin-right: 1%;
}
.tablecontent {
width: 89%
}
/deep/ .v-table .el-table__body .monthName {
vertical-align: top !important;
}
/deep/ .el-icon-circle-close {
color: #fff
}
.expandrow {
display: flex;
font-size: 16px;
padding-left: 50px;
padding-bottom: 9px;
flex-wrap: wrap;
}
.expandrow p {
margin-right: 20px;
}
.expandrow p span:first-child {
font-weight: 300;
}
::v-deep .el-table .cell.el-tooltip {
white-space: normal !important;
width: 100% !important;
}
::v-deep .el-collapse-item__header {
padding-left: 30px;
font-size: 18px;
}
/* /deep/ .el-table__body tr.el-table__row--striped td {
background-color: #C0C4CC!important;
} */
</style>