|
@@ -1,18 +1,51 @@
|
|
|
<template>
|
|
|
- <div class="member-list">
|
|
|
- <el-checkbox v-model="checkAllMember" :indeterminate="isIndeterminate" style="margin: 0 20px 0 5px" @change="checkAllChange">全选</el-checkbox>
|
|
|
- <el-checkbox-group v-model="filtrate.checkedMembers" @change="membersChange">
|
|
|
- <el-checkbox v-for="item in memberList" :key="item.idap" :label="item.idap">
|
|
|
- <div class="check-point">
|
|
|
- {{ item.name }}
|
|
|
- <div class="point" :style="{'background-color': mapMemberColor.get(item.idap).bgColor}" />
|
|
|
- </div>
|
|
|
- </el-checkbox>
|
|
|
- </el-checkbox-group>
|
|
|
+ <div>
|
|
|
+ <div class="member-list">
|
|
|
+ <div class="teamMember">团队成员:</div>
|
|
|
+ <el-checkbox v-model="checkAllMember" :indeterminate="isIndeterminate" style="margin: 0 20px 0 0" @change="checkAllChange">全选</el-checkbox>
|
|
|
+ <el-checkbox-group v-model="filtrate.checkedMembers" @change="membersChange">
|
|
|
+ <el-checkbox v-for="item in memberList" :key="item.idap" :label="item.idap">
|
|
|
+ <div class="check-point">
|
|
|
+ {{ item.name }}
|
|
|
+ <div class="point" :style="{'background-color': mapMemberColor.get(item.idap).bgColor}" />
|
|
|
+ </div>
|
|
|
+ </el-checkbox>
|
|
|
+ </el-checkbox-group>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="member-list">
|
|
|
+ <div class="teamMember">类型:</div>
|
|
|
+ <el-checkbox-group v-model="checkList" @change="getCheckList">
|
|
|
+ <el-checkbox label="0">排期任务</el-checkbox>
|
|
|
+ <el-checkbox label="1">日程</el-checkbox>
|
|
|
+ </el-checkbox-group>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div v-if="ScheduleAndSchedule[0] === '0' || ScheduleAndSchedule[1] === '0'" class="member-list">
|
|
|
+ <div class="teamMember">排期类型:</div>
|
|
|
+ <el-checkbox v-model="checkAllMember_1" :indeterminate="isIndeterminate_1" style="margin: 0 20px 0 0" @change="checkAllScheduling">全选 </el-checkbox>
|
|
|
+ <el-checkbox-group v-model="scheduling" @change="membersChange_1">
|
|
|
+ <el-checkbox v-for="item in taskScheduleEvent" :key="item.code" :label="item.code">
|
|
|
+ <div class="check-point">
|
|
|
+ {{ item.msg }}
|
|
|
+ </div>
|
|
|
+ </el-checkbox>
|
|
|
+ </el-checkbox-group>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div v-if="ScheduleAndSchedule[0] === '1' || ScheduleAndSchedule[1] === '1'" class="member-list">
|
|
|
+ <div class="teamMember">日程类型:</div>
|
|
|
+ <el-checkbox v-model="checkAllMember_2" :indeterminate="isIndeterminate_2" style="margin: 0 20px 0 0" @change="checkAllSchedule">全选 </el-checkbox>
|
|
|
+ <el-checkbox-group v-model="schedule" @change="membersChange_2">
|
|
|
+ <el-checkbox v-for="(item, index) in selfScheduleType" :key="index" :label="item.code">
|
|
|
+ <div class="check-point">{{ item.msg }}</div>
|
|
|
+ </el-checkbox>
|
|
|
+ </el-checkbox-group>
|
|
|
+ </div>
|
|
|
</div>
|
|
|
</template>
|
|
|
<script>
|
|
|
-import { queryTeamMember } from '@/api/workSchedule'
|
|
|
+import { queryTeamMember, configShowWorkbenchEnum } from '@/api/workSchedule'
|
|
|
export default {
|
|
|
props: {
|
|
|
value: {
|
|
@@ -37,15 +70,25 @@ export default {
|
|
|
filtrate: {// 筛选项
|
|
|
checkedMembers: [] // 被选中的成员列表
|
|
|
},
|
|
|
+ schedule: [], // 日程
|
|
|
+ scheduling: [], // 排期
|
|
|
checkAllMember: false, // 选择全部成员
|
|
|
+ checkAllMember_1: false, // 选择全部排期类型
|
|
|
+ checkAllMember_2: false, // 选择全部日程类型
|
|
|
isIndeterminate: false,
|
|
|
+ isIndeterminate_1: false,
|
|
|
+ isIndeterminate_2: false,
|
|
|
colorList: [
|
|
|
'rgba(64,127,232,1)', 'rgba(11,160,188,1)', 'rgba(28,188,126,1)', 'rgba(235,172,0,1)', 'rgba(132,100,247,1)',
|
|
|
'rgba(73,92,197,1)', 'rgba(193,67,96,1)', 'rgba(211,87,35,1)', 'rgba(40,28,149,1)', 'rgba(85,138,43,1)',
|
|
|
'rgba(67,17,59,1)', 'rgba(221,57,222,1)', 'rgba(149,114,109,1)', 'rgba(202,50,31,1)', 'rgba(226,119,141,1)',
|
|
|
'rgba(240,164,126,1)', 'rgba(59,64,72,1)', 'rgba(115,159,158,1)', 'rgba(122,209,67,1)', 'rgba(152,40,49,1)'
|
|
|
],
|
|
|
- mapMemberColor: this.memberColor // 人员对应颜色表
|
|
|
+ mapMemberColor: this.memberColor, // 人员对应颜色表
|
|
|
+ checkList: ['0', '1'], // 类型默认全部选择
|
|
|
+ ScheduleAndSchedule: ['0', '1'],
|
|
|
+ selfScheduleType: [], // 日程类型
|
|
|
+ taskScheduleEvent: [] // 排期类型
|
|
|
}
|
|
|
},
|
|
|
watch: {
|
|
@@ -69,10 +112,25 @@ export default {
|
|
|
this.filtrate.checkedMembers = this.memberList.map(item => item.idap)
|
|
|
this.checkAllMember = true
|
|
|
this.colorHandler(this.memberList)
|
|
|
+ }
|
|
|
+ const res_1 = await configShowWorkbenchEnum()
|
|
|
+ if (res_1.code === 200) {
|
|
|
+ this.selfScheduleType = res_1.data.selfScheduleType // 日程类型
|
|
|
+ this.taskScheduleEvent = res_1.data.taskScheduleEvent // 排期类型
|
|
|
+ this.selfScheduleType.unshift({ code: -1, msg: '未分类' })
|
|
|
+ this.schedule = this.selfScheduleType.map(item => item.code)
|
|
|
+ this.scheduling = this.taskScheduleEvent.map(item => item.code)
|
|
|
+ this.checkAllMember_1 = true
|
|
|
+ this.checkAllMember_2 = true
|
|
|
+ this.filtrate.selfScheduleTypeList = this.schedule
|
|
|
+ this.filtrate.scheduleTypeList = this.scheduling
|
|
|
+ this.filtrate.origin = this.ScheduleAndSchedule
|
|
|
+ }
|
|
|
+ this.$nextTick(() => {
|
|
|
this.$emit('change')
|
|
|
this.$emit('update:value', this.filtrate)
|
|
|
this.$emit('update:memberColor', this.mapMemberColor)
|
|
|
- }
|
|
|
+ })
|
|
|
},
|
|
|
colorHandler(arr) { // 成员对应颜色处理
|
|
|
this.mapMemberColor.clear()
|
|
@@ -92,16 +150,48 @@ export default {
|
|
|
}
|
|
|
})
|
|
|
},
|
|
|
+ getCheckList(val) { // 排期类型与日程的转换
|
|
|
+ this.ScheduleAndSchedule = val
|
|
|
+ // this.ScheduleAndSchedule[0] === '0' || this.ScheduleAndSchedule[1] === '0' ? this.scheduling = this.taskScheduleEvent.map(item => item.code) : []
|
|
|
+ },
|
|
|
checkAllChange(val) { // 成员全部选择
|
|
|
this.filtrate.checkedMembers = val ? this.memberList.map(item => item.idap) : []
|
|
|
this.isIndeterminate = false
|
|
|
- this.$emit('change')
|
|
|
- this.$emit('update:value', this.filtrate)
|
|
|
+ this.updateParent()
|
|
|
+ },
|
|
|
+ checkAllScheduling(val) { // 全部排期选择
|
|
|
+ this.scheduling = val ? this.taskScheduleEvent.map(item => item.code) : []
|
|
|
+ this.filtrate.scheduleTypeList = this.scheduling
|
|
|
+ this.isIndeterminate_1 = false
|
|
|
+ this.updateParent()
|
|
|
+ },
|
|
|
+ checkAllSchedule(val) { // 全部日程选择
|
|
|
+ this.schedule = val ? this.selfScheduleType.map(item => item.code) : []
|
|
|
+ this.filtrate.selfScheduleTypeList = this.schedule
|
|
|
+ this.isIndeterminate_2 = false
|
|
|
+ this.updateParent()
|
|
|
},
|
|
|
membersChange(value) { // 成员变动
|
|
|
const checkedCount = value.length
|
|
|
this.checkAllMember = checkedCount === this.memberList.length
|
|
|
this.isIndeterminate = checkedCount > 0 && checkedCount < this.memberList.length
|
|
|
+ this.updateParent()
|
|
|
+ },
|
|
|
+ membersChange_1(val) { // 排期变动
|
|
|
+ this.filtrate.scheduleTypeList = val
|
|
|
+ const checkedCount = val.length
|
|
|
+ this.checkAllMember_1 = checkedCount === this.taskScheduleEvent.length
|
|
|
+ this.isIndeterminate_1 = checkedCount > 0 && checkedCount < this.taskScheduleEvent.length
|
|
|
+ this.updateParent()
|
|
|
+ },
|
|
|
+ membersChange_2(val) { // 日程变动
|
|
|
+ this.filtrate.selfScheduleTypeList = val
|
|
|
+ const checkedCount = val.length
|
|
|
+ this.checkAllMember_2 = checkedCount === this.selfScheduleType.length
|
|
|
+ this.isIndeterminate_2 = checkedCount > 0 && checkedCount < this.selfScheduleType.length
|
|
|
+ this.updateParent()
|
|
|
+ },
|
|
|
+ updateParent() { // 刷新父组件数据
|
|
|
this.$emit('change')
|
|
|
this.$emit('update:value', this.filtrate)
|
|
|
}
|
|
@@ -111,7 +201,12 @@ export default {
|
|
|
<style lang="scss" scoped>
|
|
|
.member-list {
|
|
|
display: flex;
|
|
|
+ .teamMember {
|
|
|
+ width: 100px;
|
|
|
+ margin: 0 20px 20px 5px;
|
|
|
+}
|
|
|
}
|
|
|
+
|
|
|
.check-point {
|
|
|
display: flex;
|
|
|
align-items: center;
|