perf: 项目版面成员显示
This commit is contained in:
kuaifan
parent
267c09f20c
commit
7f454f279c
@ -67,8 +67,6 @@ class ProjectController extends AbstractController
|
||||
"owner": 1, // 是否项目负责人
|
||||
"owner_userid": 1, // 项目负责人ID
|
||||
|
||||
"project_user": [], // 为空，数据在one接口返回
|
||||
|
||||
"task_num": 9,
|
||||
"task_complete": 0,
|
||||
"task_percent": 0,
|
||||
@ -118,9 +116,7 @@ class ProjectController extends AbstractController
|
||||
//
|
||||
$list = $builder->orderByDesc('projects.id')->paginate(Base::getPaginate(100, 50));
|
||||
$list->transform(function (Project $project) use ($user) {
|
||||
return array_merge($project->toArray(), $project->getTaskStatistics($user->userid), [
|
||||
'project_user' => []
|
||||
]);
|
||||
return array_merge($project->toArray(), $project->getTaskStatistics($user->userid));
|
||||
});
|
||||
//
|
||||
$data = $list->toArray();
|
||||
|
||||
@ -8,13 +8,30 @@
|
||||
<div v-if="projectLoad > 0" class="project-load"><Loading/></div>
|
||||
</div>
|
||||
<ul class="project-icons">
|
||||
<li>
|
||||
<UserAvatar :userid="projectData.owner_userid" :size="36">
|
||||
<p>{{$L('项目负责人')}}</p>
|
||||
</UserAvatar>
|
||||
<li class="project-avatar" @click="projectDropdown('user')">
|
||||
<ul>
|
||||
<li>
|
||||
<UserAvatar :userid="projectData.owner_userid" :size="36" :borderWitdh="2">
|
||||
<p>{{$L('项目负责人')}}</p>
|
||||
</UserAvatar>
|
||||
</li>
|
||||
<template v-if="projectUser.length > 0">
|
||||
<li v-for="(item, index) in projectUser" :key="index" v-if="index < projectUserShowNum">
|
||||
<UserAvatar :userid="item.userid" :size="36" :borderWitdh="2"/>
|
||||
</li>
|
||||
<li v-if="projectUser.length > projectUserShowNum" class="more">
|
||||
<Icon type="ios-more"/>
|
||||
</li>
|
||||
<li class="add">
|
||||
<Icon type="md-person-add"/>
|
||||
</li>
|
||||
</template>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="project-icon" @click="addTaskOpen(0)">
|
||||
<Icon class="menu-icon" type="md-add" />
|
||||
<ETooltip :content="$L('添加任务')">
|
||||
<Icon class="menu-icon" type="md-add" />
|
||||
</ETooltip>
|
||||
</li>
|
||||
<li :class="['project-icon', searchText!='' ? 'active' : '']">
|
||||
<Tooltip :always="searchText!=''" theme="light">
|
||||
@ -65,7 +82,7 @@
|
||||
<Draggable
|
||||
:list="columnList"
|
||||
:animation="150"
|
||||
:disabled="sortDisabled || $store.state.windowMax768"
|
||||
:disabled="sortDisabled || windowMax768"
|
||||
class="column-list"
|
||||
tag="ul"
|
||||
draggable=".column-item"
|
||||
@ -121,7 +138,7 @@
|
||||
<Draggable
|
||||
:list="column.tasks"
|
||||
:animation="150"
|
||||
:disabled="sortDisabled || $store.state.windowMax768"
|
||||
:disabled="sortDisabled || windowMax768"
|
||||
class="task-list"
|
||||
draggable=".task-draggable"
|
||||
group="task"
|
||||
@ -519,6 +536,8 @@ export default {
|
||||
|
||||
computed: {
|
||||
...mapState([
|
||||
'windowMax768',
|
||||
|
||||
'userId',
|
||||
'dialogs',
|
||||
|
||||
@ -569,6 +588,18 @@ export default {
|
||||
}
|
||||
},
|
||||
|
||||
projectUser() {
|
||||
const {projectData} = this;
|
||||
if (!projectData.project_user) {
|
||||
return [];
|
||||
}
|
||||
return projectData.project_user.filter(({userid}) => userid != projectData.owner_userid)
|
||||
},
|
||||
|
||||
projectUserShowNum() {
|
||||
return this.windowMax768 ? 3 : 10;
|
||||
},
|
||||
|
||||
columnList() {
|
||||
const {projectId, columns, tasks} = this;
|
||||
const list = columns.filter(({project_id}) => {
|
||||
|
||||
3
resources/assets/js/store/actions.js
vendored
3
resources/assets/js/store/actions.js
vendored
@ -521,6 +521,9 @@ export default {
|
||||
if (index > -1) {
|
||||
state.projects.splice(index, 1, Object.assign({}, state.projects[index], data));
|
||||
} else {
|
||||
if (typeof data.project_user === "undefined") {
|
||||
data.project_user = []
|
||||
}
|
||||
state.projects.push(data);
|
||||
}
|
||||
setTimeout(() => {
|
||||
|
||||
@ -50,6 +50,56 @@
|
||||
&:hover {
|
||||
box-shadow: 0 0 6px #cccccc;
|
||||
}
|
||||
&.project-avatar {
|
||||
width: auto;
|
||||
min-width: 36px;
|
||||
&:hover {
|
||||
box-shadow: none;
|
||||
}
|
||||
> ul {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
> li {
|
||||
list-style: none;
|
||||
margin-left: -6px;
|
||||
transition: transform 0.2s;
|
||||
&:hover {
|
||||
transform: scale(1.1);
|
||||
}
|
||||
&:first-child {
|
||||
margin-left: 0;
|
||||
}
|
||||
&.more,
|
||||
&.add {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
font-size: 17px;
|
||||
width: 32px;
|
||||
height: 32px;
|
||||
border-radius: 50%;
|
||||
color: #b4bcce;
|
||||
background-color: #fff;
|
||||
font-weight: 700;
|
||||
border: 2px dashed #8bcf70;
|
||||
cursor: pointer;
|
||||
z-index: 1;
|
||||
> i {
|
||||
color: #8bcf70
|
||||
}
|
||||
}
|
||||
&.more {
|
||||
width: 30px;
|
||||
transform: translateX(-1px);
|
||||
background-color: transparent;
|
||||
border-color: transparent;
|
||||
&:hover {
|
||||
transform: scale(1);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
&.project-icon {
|
||||
border-radius: 50%;
|
||||
background-color: #F2F3F5;
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user