|
|
|
@ -10,26 +10,241 @@ |
|
|
|
</div> |
|
|
|
|
|
|
|
<!-- 角色 --> |
|
|
|
<Roles /> |
|
|
|
<!-- <Roles /> --> |
|
|
|
<div class="role-list flex items-center"> |
|
|
|
<div class="role-box relative" v-for="(item, index) in roles" :key="index"> |
|
|
|
<div class="role-name" :class="{ mine: roleId === item.id }">{{ item.name }}</div> |
|
|
|
<div class="line-box absolute flex justify-center" v-if="roleId === item.id"><div class="line"></div></div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
|
|
|
|
<!-- 日常任务 --> |
|
|
|
<Global /> |
|
|
|
<!-- <Global /> --> |
|
|
|
<div class="global"> |
|
|
|
<div class="global-box" v-if="permanents && permanents.length > 0"> |
|
|
|
<div class="global-task cursor-pointer" v-for="(item, index) in permanents" :key="index" @click="toGlobalDetail(item)"> |
|
|
|
<template v-for="v in item.plugins"> |
|
|
|
<template v-if="v[0].pluginId == 1">{{ item.name }}</template> |
|
|
|
</template> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
|
|
|
|
<!-- 定期任务 --> |
|
|
|
<RegularTask /> |
|
|
|
<!-- <RegularTask /> --> |
|
|
|
<div class="task-list" :style="{ height: 'calc(100vh - 160px - (' + globalHeight + 'px))' }"> |
|
|
|
<div class="task-box" v-for="(item, index) in regularTasks" :key="index"> |
|
|
|
<div class="task-time flex items-center justify-between"> |
|
|
|
<div class="flex items-center"> |
|
|
|
<PlayCircleOutlined style="font-size: 23px; color: #999999" /> |
|
|
|
<span>{{ dayjs(item.planStart).format('D日 HH:mm') }}</span> |
|
|
|
</div> |
|
|
|
<div class="task-action"></div> |
|
|
|
</div> |
|
|
|
|
|
|
|
<div class="task-info"> |
|
|
|
<div> |
|
|
|
<div class="task-card"> |
|
|
|
<div class="task-name cursor-pointer" @click="toDetail(item)"> |
|
|
|
<template v-for="v in item.plugins"> |
|
|
|
<template v-if="v[0].pluginId == 1">{{ item.name }}</template> |
|
|
|
</template> |
|
|
|
</div> |
|
|
|
|
|
|
|
<div class="task-con" v-if="item.sonList && item.sonList.length > 0"> |
|
|
|
<div v-for="(val, key) in item.sonList" :key="key"> |
|
|
|
<!-- <a-checkbox>{{ val.name }}</a-checkbox> --> |
|
|
|
<span class="son-task-name cursor-pointer" @click.stop="toSonDetail(item, val.detailId)">{{ val.name }}</span> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<!-- <div class="open-icon" v-if="item.sonList" @click="openCard"> |
|
|
|
<img /> |
|
|
|
</div> --> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</template> |
|
|
|
|
|
|
|
<script setup> |
|
|
|
import { computed } from 'vue'; |
|
|
|
import { computed, watch, reactive } from 'vue'; |
|
|
|
import { useStore } from 'vuex'; |
|
|
|
import { ReloadOutlined, MoreOutlined } from '@ant-design/icons-vue'; |
|
|
|
import Roles from './Roles.vue'; // 角色 |
|
|
|
import Global from './Global.vue'; // 日常任务面板 |
|
|
|
import RegularTask from './RegularTask.vue'; // 定期任务 |
|
|
|
import dayjs from 'dayjs'; |
|
|
|
import { ReloadOutlined, MoreOutlined, PlayCircleOutlined } from '@ant-design/icons-vue'; |
|
|
|
// import Roles from './Roles.vue'; // 角色 |
|
|
|
import { message } from 'ant-design-vue'; |
|
|
|
import { findShowRole, getPermanent, getRegularTask, findSonTask } from 'apis'; |
|
|
|
// import Global from './Global.vue'; // 日常任务面板 |
|
|
|
// import RegularTask from './RegularTask.vue'; // 定期任务 |
|
|
|
|
|
|
|
const store = useStore(); |
|
|
|
const project = computed(() => store.state.projects.project); // 项目信息 |
|
|
|
|
|
|
|
const roleId = computed(() => store.state.role.roleId); // 当前角色 |
|
|
|
const sessionRoles = sessionStorage.getItem('roles'); // 角色缓存 |
|
|
|
const roles = computed(() => store.state.role.visibleRoles); // 当前项目角色列表 |
|
|
|
|
|
|
|
const permanents = computed(() => store.state.task.permanents); // 日常任务 |
|
|
|
const sessionPermanents = sessionStorage.getItem('permanents'); // 日常任务缓存 |
|
|
|
const globalHeight = computed(() => store.state.task.globalHeight); // 日常任务面板高度 |
|
|
|
const sessionGlobalHeight = sessionStorage.getItem('globalHeight'); // 日常任务面板高度缓存 |
|
|
|
|
|
|
|
const regularTasks = computed(() => store.state.task.regularTasks); // 定期任务 |
|
|
|
const taskObj = reactive({ tasks: [] }); // 定期任务 |
|
|
|
const sessionTasks = sessionStorage.getItem('regularTasks'); // 定期任务缓存 |
|
|
|
const refreshProjects = computed(() => store.state.layout.refreshProjects); // 刷新项目列表 |
|
|
|
|
|
|
|
if (sessionRoles) { |
|
|
|
const roleArr = JSON.parse(sessionRoles); |
|
|
|
store.commit('role/setVisibleRoles', roleArr); |
|
|
|
setInitialRoleId(roleArr); |
|
|
|
} |
|
|
|
|
|
|
|
if (sessionPermanents) { |
|
|
|
const arr = JSON.parse(sessionPermanents); |
|
|
|
store.commit('task/setPermanents', arr); |
|
|
|
} |
|
|
|
|
|
|
|
if (sessionGlobalHeight) { |
|
|
|
store.commit('task/setGlobalHeight', sessionGlobalHeight); |
|
|
|
} |
|
|
|
|
|
|
|
if (sessionTasks) { |
|
|
|
const arr = JSON.parse(sessionTasks); |
|
|
|
store.commit('task/setRegularTasks', arr); |
|
|
|
} |
|
|
|
|
|
|
|
init(); |
|
|
|
|
|
|
|
watch(project, async () => { |
|
|
|
if (project.value.id) { |
|
|
|
await getRoles(project.value.id); // 通过项目id获取角色信息 |
|
|
|
await getPermanentData(roleId.value); // 根据角色查找永久的日常任务 |
|
|
|
await getTasks({ roleId: roleId.value }); // 根据角色查找定期任务 |
|
|
|
} |
|
|
|
}); |
|
|
|
|
|
|
|
watch(refreshProjects, async () => { |
|
|
|
if (roleId.value) { |
|
|
|
await getTasks({ roleId: roleId.value }); // 根据角色查找定期任务 |
|
|
|
} |
|
|
|
}); |
|
|
|
|
|
|
|
// 初始化 |
|
|
|
async function init() { |
|
|
|
if (project.value) { |
|
|
|
await getRoles(project.value.id); // 通过项目id获取角色信息 |
|
|
|
await getPermanentData(roleId.value); // 根据角色查找永久的日常任务; |
|
|
|
await getTasks({ roleId: roleId.value }); // 根据角色查找定期任务 |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
/** 通过项目id获取角色信息 |
|
|
|
* @param {string} projectId |
|
|
|
* @param {object} params 提交的参数 |
|
|
|
*/ |
|
|
|
async function getRoles(params) { |
|
|
|
try { |
|
|
|
const data = await findShowRole(params); |
|
|
|
store.commit('role/setInvisibleRoles', data ? data.invisibleList : []); |
|
|
|
store.commit('role/setVisibleRoles', data ? data.visibleList : []); |
|
|
|
setInitialRoleId(data ? data.visibleList : []); |
|
|
|
} catch (error) { |
|
|
|
message.info(error); |
|
|
|
throw new Error(error); |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
// 设置 初始显示角色信息 |
|
|
|
function setInitialRoleId(visibleList) { |
|
|
|
if (!visibleList || !visibleList.length) return; |
|
|
|
const index = visibleList.findIndex(item => +item.mine === 1); |
|
|
|
const currentRole = index > 0 ? visibleList[index] : visibleList[0]; |
|
|
|
const currentRoleId = currentRole ? currentRole.id : ''; |
|
|
|
store.commit('role/setRoleId', currentRoleId); |
|
|
|
} |
|
|
|
|
|
|
|
// 日常任务 |
|
|
|
async function getPermanentData(id) { |
|
|
|
const params = { param: { roleId: id } }; |
|
|
|
try { |
|
|
|
const data = await getPermanent(params); |
|
|
|
store.commit('task/setPermanents', data); |
|
|
|
const height = data.length * 38 + 26; |
|
|
|
store.commit('task/setGlobalHeight', height); |
|
|
|
} catch (error) { |
|
|
|
message.info(error); |
|
|
|
throw new Error(error); |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
// 日常任务详情 |
|
|
|
function toGlobalDetail(item) { |
|
|
|
store.commit('task/setTaskDetail', item); |
|
|
|
store.commit('layout/setListStatus', false); |
|
|
|
store.commit('task/setIntellectualId', ''); |
|
|
|
store.commit('task/setMeetId', ''); |
|
|
|
store.commit('task/setSubMeetId', ''); |
|
|
|
} |
|
|
|
|
|
|
|
/** |
|
|
|
* 根据时间基准点和角色查找定期任务 |
|
|
|
* @param {object} query |
|
|
|
* @param {string} query.roleId 角色id |
|
|
|
* @param {string} query.timeNode 时间基准点 默认当前 |
|
|
|
* @param {string} query.timeUnit 时间颗粒度 默认天 |
|
|
|
* @param {string} query.queryNum 查找颗粒度数量 默认3个 |
|
|
|
* @param {number} query.queryType 0向上查找 1向下查找(默认) 下查包含自己，上查不包含 |
|
|
|
*/ |
|
|
|
async function getTasks(query) { |
|
|
|
const params = { param: query }; |
|
|
|
try { |
|
|
|
const data = await getRegularTask(params); |
|
|
|
taskObj.tasks = data; |
|
|
|
data.forEach(item => { |
|
|
|
item.plugins.forEach(val => { |
|
|
|
if (Number(val[0].pluginId) === 6) { |
|
|
|
getSonTask(item.detailId); |
|
|
|
} |
|
|
|
}); |
|
|
|
}); |
|
|
|
store.commit('task/setRegularTasks', data); |
|
|
|
} catch (error) { |
|
|
|
message.info(error); |
|
|
|
throw new Error(error); |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
// 根据id获取子任务 |
|
|
|
async function getSonTask(id) { |
|
|
|
const params = { param: { detailId: id } }; |
|
|
|
try { |
|
|
|
const data = await findSonTask(params); |
|
|
|
taskObj.tasks.forEach(item => { |
|
|
|
if (item.detailId === id) { |
|
|
|
item.sonList = data; |
|
|
|
} |
|
|
|
}); |
|
|
|
store.commit('task/setRegularTasks', taskObj.tasks); |
|
|
|
} catch (error) { |
|
|
|
message.info(error); |
|
|
|
throw new Error(error); |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
function toDetail(item) { |
|
|
|
store.commit('task/setTaskDetail', item); |
|
|
|
store.commit('task/sonDetailId', ''); |
|
|
|
store.commit('task/sonExperimentationId', ''); |
|
|
|
} |
|
|
|
|
|
|
|
function toSonDetail(item, id) { |
|
|
|
store.commit('task/setTaskDetail', item); |
|
|
|
store.commit('task/sonDetailId', id); |
|
|
|
store.commit('task/sonExperimentationId', id); |
|
|
|
} |
|
|
|
</script> |
|
|
|
|
|
|
|
<style scoped> |
|
|
|
@ -48,4 +263,108 @@ const project = computed(() => store.state.projects.project); // 项目信息 |
|
|
|
margin-left: 16px; |
|
|
|
cursor: pointer; |
|
|
|
} |
|
|
|
|
|
|
|
.role-list { |
|
|
|
padding: 0 16px; |
|
|
|
height: 36px; |
|
|
|
border-bottom: 1px solid #cccccc; |
|
|
|
} |
|
|
|
.role-box { |
|
|
|
margin-right: 16px; |
|
|
|
height: 36px; |
|
|
|
} |
|
|
|
|
|
|
|
.role-name { |
|
|
|
font-size: 14px; |
|
|
|
line-height: 36px; |
|
|
|
color: #333333; |
|
|
|
} |
|
|
|
|
|
|
|
.role-name.mine { |
|
|
|
font-weight: 600; |
|
|
|
color: #1890ff; |
|
|
|
} |
|
|
|
|
|
|
|
.role-box .line-box { |
|
|
|
width: 100%; |
|
|
|
bottom: 0; |
|
|
|
} |
|
|
|
|
|
|
|
.line-box .line { |
|
|
|
width: 16px; |
|
|
|
height: 2px; |
|
|
|
background-color: #1890ff; |
|
|
|
} |
|
|
|
|
|
|
|
.global { |
|
|
|
padding: 16px; |
|
|
|
} |
|
|
|
|
|
|
|
.global-box { |
|
|
|
border: 1px solid #cccccc; |
|
|
|
border-radius: 10px; |
|
|
|
padding: 12px 16px; |
|
|
|
} |
|
|
|
|
|
|
|
.global-task { |
|
|
|
padding: 8px 0; |
|
|
|
line-height: 22px; |
|
|
|
} |
|
|
|
|
|
|
|
.task-list { |
|
|
|
padding: 0 16px 50px; |
|
|
|
overflow-y: auto; |
|
|
|
} |
|
|
|
|
|
|
|
.task-time { |
|
|
|
height: 32px; |
|
|
|
} |
|
|
|
|
|
|
|
.task-time .anticon { |
|
|
|
margin-right: 16px; |
|
|
|
} |
|
|
|
|
|
|
|
.task-time span { |
|
|
|
font-size: 14px; |
|
|
|
color: #595959; |
|
|
|
} |
|
|
|
|
|
|
|
.task-info { |
|
|
|
margin: 8px 0; |
|
|
|
padding-left: 11px; |
|
|
|
} |
|
|
|
|
|
|
|
.task-info > div { |
|
|
|
padding-left: 27px; |
|
|
|
border-left: 1px solid #d2d2d2; |
|
|
|
} |
|
|
|
|
|
|
|
.task-info .task-card { |
|
|
|
padding: 16px; |
|
|
|
border-radius: 8px; |
|
|
|
-moz-box-shadow: 0px 3px 6px 0px rgba(0, 0, 0, 0.12); |
|
|
|
-webkit-box-shadow: 0px 3px 6px 0px rgba(0, 0, 0, 0.12); |
|
|
|
box-shadow: 0px 3px 6px 0px rgba(0, 0, 0, 0.12); |
|
|
|
} |
|
|
|
|
|
|
|
.task-con { |
|
|
|
margin-top: 16px; |
|
|
|
padding-left: 16px; |
|
|
|
} |
|
|
|
|
|
|
|
.task-con > div { |
|
|
|
height: 30px; |
|
|
|
} |
|
|
|
|
|
|
|
:deep(.ant-checkbox + span) { |
|
|
|
color: #607d8b; |
|
|
|
} |
|
|
|
|
|
|
|
.son-task-name { |
|
|
|
color: #607d8b; |
|
|
|
} |
|
|
|
|
|
|
|
.task-list::-webkit-scrollbar { |
|
|
|
width: 0 !important; |
|
|
|
} |
|
|
|
</style> |
|
|
|
|
