no message

This commit is contained in:
kuaifan 2021-06-15 21:06:49 +08:00
parent 8174d4b6b3
commit fc96cc37df
8 changed files with 125 additions and 60 deletions

View File

@ -19,15 +19,15 @@
</Dropdown> </Dropdown>
<ul> <ul>
<li @click="toggleRoute('dashboard')" :class="classNameRoute('dashboard')"> <li @click="toggleRoute('dashboard')" :class="classNameRoute('dashboard')">
<Icon type="ios-speedometer-outline" /> <i class="iconfont">&#xe6fb;</i>
<div class="menu-title">{{$L('仪表板')}}</div> <div class="menu-title">{{$L('仪表板')}}</div>
</li> </li>
<li @click="toggleRoute('calendar')" :class="classNameRoute('calendar')"> <li @click="toggleRoute('calendar')" :class="classNameRoute('calendar')">
<Icon type="ios-calendar-outline" /> <i class="iconfont">&#xe6f5;</i>
<div class="menu-title">{{$L('日历')}}</div> <div class="menu-title">{{$L('日历')}}</div>
</li> </li>
<li @click="toggleRoute('messenger')" :class="classNameRoute('messenger')"> <li @click="toggleRoute('messenger')" :class="classNameRoute('messenger')">
<Icon type="ios-chatbubbles-outline" /> <i class="iconfont">&#xe6eb;</i>
<div class="menu-title">{{$L('消息')}}</div> <div class="menu-title">{{$L('消息')}}</div>
<Badge class="menu-badge" :count="dialogMsgUnread"></Badge> <Badge class="menu-badge" :count="dialogMsgUnread"></Badge>
</li> </li>
@ -41,7 +41,7 @@
<div class="project-h1"> <div class="project-h1">
<em @click.stop="toggleOpenMenu(item.id)"></em> <em @click.stop="toggleOpenMenu(item.id)"></em>
<div class="title">{{item.name}}</div> <div class="title">{{item.name}}</div>
<div v-if="item.task_my_num > 0" class="num">{{item.task_my_num - item.task_my_complete}}</div> <div v-if="item.task_my_num - item.task_my_complete > 0" class="num">{{item.task_my_num - item.task_my_complete}}</div>
</div> </div>
<div class="project-h2"> <div class="project-h2">
<p> <p>

View File

@ -16,23 +16,23 @@
</UserAvatar> </UserAvatar>
</li> </li>
<li class="project-icon" @click="addTaskOpen(0)"> <li class="project-icon" @click="addTaskOpen(0)">
<Icon type="md-add" /> <Icon class="menu-icon" type="md-add" />
</li> </li>
<li :class="['project-icon', searchText!='' ? 'active' : '']"> <li :class="['project-icon', searchText!='' ? 'active' : '']">
<ETooltip :value="searchText!=''" :manual="searchText!=''" effect="light" transfer> <Tooltip :always="searchText!=''" theme="light">
<Icon type="ios-search" /> <Icon class="menu-icon" type="ios-search" />
<div slot="content"> <div slot="content">
<Input v-model="searchText" :placeholder="$L('名称、描述...')" clearable autofocus/> <Input v-model="searchText" :placeholder="$L('名称、描述...')" class="search-input" clearable autofocus/>
</div> </div>
</ETooltip> </Tooltip>
</li> </li>
<li :class="['project-icon', projectChatShow ? 'active' : '']" @click="toggleBoolean('projectChatShow')"> <li :class="['project-icon', projectChatShow ? 'active' : '']" @click="toggleBoolean('projectChatShow')">
<Icon type="ios-chatbubbles" /> <Icon class="menu-icon" type="ios-chatbubbles" />
<Badge :count="msgUnread"></Badge> <Badge class="menu-badge" :count="msgUnread"></Badge>
</li> </li>
<li class="project-icon"> <li class="project-icon">
<EDropdown @command="projectDropdown" trigger="click" transfer> <EDropdown @command="projectDropdown" trigger="click" transfer>
<Icon type="ios-more" /> <Icon class="menu-icon" type="ios-more" />
<EDropdownMenu v-if="projectDetail.owner_userid === userId" slot="dropdown"> <EDropdownMenu v-if="projectDetail.owner_userid === userId" slot="dropdown">
<EDropdownItem command="setting">{{$L('项目设置')}}</EDropdownItem> <EDropdownItem command="setting">{{$L('项目设置')}}</EDropdownItem>
<EDropdownItem command="user">{{$L('成员管理')}}</EDropdownItem> <EDropdownItem command="user">{{$L('成员管理')}}</EDropdownItem>
@ -46,6 +46,9 @@
</li> </li>
</ul> </ul>
<div class="project-switch"> <div class="project-switch">
<div v-if="projectTablePanel && completedList.length > 0" class="project-checkbox">
<Checkbox :value="projectCompleteHide" @on-change="toggleBoolean('projectCompleteHide', $event)">{{$L('隐藏已完成')}}</Checkbox>
</div>
<div :class="['project-switch-button', !projectTablePanel ? 'menu' : '']" @click="toggleBoolean('projectTablePanel')"> <div :class="['project-switch-button', !projectTablePanel ? 'menu' : '']" @click="toggleBoolean('projectTablePanel')">
<div><i class="iconfont">&#xe60c;</i></div> <div><i class="iconfont">&#xe60c;</i></div>
<div><i class="iconfont">&#xe66a;</i></div> <div><i class="iconfont">&#xe66a;</i></div>
@ -68,7 +71,7 @@
:style="column.color ? {backgroundColor: column.color} : {}"> :style="column.color ? {backgroundColor: column.color} : {}">
<div class="column-head-title"> <div class="column-head-title">
<AutoTip>{{column.name}}</AutoTip> <AutoTip>{{column.name}}</AutoTip>
<em>({{column.project_task.length}})</em> <em>({{panelTask(column.project_task).length}})</em>
</div> </div>
<div class="column-head-icon"> <div class="column-head-icon">
<div v-if="column.loading === true" class="loading"><Loading /></div> <div v-if="column.loading === true" class="loading"><Loading /></div>
@ -119,8 +122,8 @@
@sort="sortUpdate" @sort="sortUpdate"
@remove="sortUpdate"> @remove="sortUpdate">
<div <div
v-for="item in panelTask(column.project_task)" v-for="item in column.project_task"
:class="['task-item task-draggable', item.complete_at ? 'complete' : '']" :class="['task-item task-draggable', item.complete_at ? 'complete' : '', taskHidden(item) ? 'hidden' : '']"
:style="item.color ? {backgroundColor: item.color} : {}" :style="item.color ? {backgroundColor: item.color} : {}"
@click="openTask(item)"> @click="openTask(item)">
<div :class="['task-head', item.desc ? 'has-desc' : '']"> <div :class="['task-head', item.desc ? 'has-desc' : '']">
@ -447,6 +450,7 @@ export default {
'projectChatShow', 'projectChatShow',
'projectTablePanel', 'projectTablePanel',
'projectCompleteHide',
'taskMyShow', 'taskMyShow',
'taskUndoneShow', 'taskUndoneShow',
'taskCompletedShow' 'taskCompletedShow'
@ -459,11 +463,16 @@ export default {
}, },
panelTask() { panelTask() {
const {searchText} = this; const {searchText, projectCompleteHide} = this;
return function (project_task) { return function (project_task) {
if (projectCompleteHide) {
project_task = project_task.filter(({complete_at}) => {
return !complete_at;
});
}
if (searchText) { if (searchText) {
return project_task.filter((task) => { project_task = project_task.filter(({name, desc}) => {
return $A.strExists(task.name, searchText) || $A.strExists(task.desc, searchText); return $A.strExists(name, searchText) || $A.strExists(desc, searchText);
}); });
} }
return project_task; return project_task;
@ -486,7 +495,15 @@ export default {
} }
}); });
}); });
return array; return array.sort((a, b) => {
if (a.p_level != b.p_level) {
return a.p_level - b.p_level;
}
if (a.sort != b.sort) {
return a.sort - b.sort;
}
return a.id - b.id;
});
}, },
undoneList() { undoneList() {
@ -505,7 +522,15 @@ export default {
} }
}); });
}); });
return array; return array.sort((a, b) => {
if (a.p_level != b.p_level) {
return a.p_level - b.p_level;
}
if (a.sort != b.sort) {
return a.sort - b.sort;
}
return a.id - b.id;
});
}, },
completedList() { completedList() {
@ -524,7 +549,15 @@ export default {
} }
}); });
}); });
return array; return array.sort((a, b) => {
if (a.p_level != b.p_level) {
return a.p_level - b.p_level;
}
if (a.sort != b.sort) {
return a.sort - b.sort;
}
return a.id - b.id;
});
}, },
expiresFormat() { expiresFormat() {
@ -973,6 +1006,28 @@ export default {
this.$store.dispatch("toggleBoolean", type); this.$store.dispatch("toggleBoolean", type);
}, },
taskHidden(task) {
const {name, desc, complete_at} = task;
const {searchText, projectCompleteHide} = this;
if (projectCompleteHide) {
if (complete_at) {
return true;
}
}
if (searchText) {
if (!($A.strExists(name, searchText) || $A.strExists(desc, searchText))) {
return true;
}
}
return false;
},
sortBy(field) {
return function (a, b) {
return a[field] - b[field];
}
},
formatTime(date) { formatTime(date) {
let time = Math.round(new Date(date).getTime() / 1000), let time = Math.round(new Date(date).getTime() / 1000),
string = ''; string = '';

View File

@ -22,8 +22,8 @@
:class="{active: dialog.id == dialogId}" :class="{active: dialog.id == dialogId}"
@click="openDialog(dialog, true)"> @click="openDialog(dialog, true)">
<template v-if="dialog.type=='group'"> <template v-if="dialog.type=='group'">
<Icon v-if="dialog.group_type=='project'" class="icon-avatar project" type="logo-buffer" /> <i v-if="dialog.group_type=='project'" class="iconfont icon-avatar project">&#xe6f9;</i>
<Icon v-else-if="dialog.group_type=='task'" class="icon-avatar task" type="md-checkbox-outline" /> <i v-else-if="dialog.group_type=='task'" class="iconfont icon-avatar task">&#xe6f4;</i>
<Icon v-else class="icon-avatar" type="ios-people" /> <Icon v-else class="icon-avatar" type="ios-people" />
</template> </template>
<div v-else-if="dialog.dialog_user" class="user-avatar"><UserAvatar :userid="dialog.dialog_user.userid" :size="46" hide-icon-menu/></div> <div v-else-if="dialog.dialog_user" class="user-avatar"><UserAvatar :userid="dialog.dialog_user.userid" :size="46" hide-icon-menu/></div>

View File

@ -228,6 +228,7 @@ const state = { method };
[ [
'projectChatShow', // 项目聊天显示 'projectChatShow', // 项目聊天显示
'projectTablePanel', // 项目面板显示类型 'projectTablePanel', // 项目面板显示类型
'projectCompleteHide', // 项目面板显示已完成列表
'taskMyShow', // 项目面板显示我的任务 'taskMyShow', // 项目面板显示我的任务
'taskUndoneShow', // 项目面板显示未完成任务 'taskUndoneShow', // 项目面板显示未完成任务
'taskCompletedShow' // 项目面板显示已完成任务 'taskCompletedShow' // 项目面板显示已完成任务

View File

@ -1,8 +1,8 @@
@font-face { @font-face {
font-family: 'iconfont'; /* Project id 2583385 */ font-family: 'iconfont'; /* Project id 2583385 */
src: url('//at.alicdn.com/t/font_2583385_acaq8xa48dj.woff2?t=1623513995409') format('woff2'), src: url('//at.alicdn.com/t/font_2583385_cz486uauxcg.woff2?t=1623761047200') format('woff2'),
url('//at.alicdn.com/t/font_2583385_acaq8xa48dj.woff?t=1623513995409') format('woff'), url('//at.alicdn.com/t/font_2583385_cz486uauxcg.woff?t=1623761047200') format('woff'),
url('//at.alicdn.com/t/font_2583385_acaq8xa48dj.ttf?t=1623513995409') format('truetype'); url('//at.alicdn.com/t/font_2583385_cz486uauxcg.ttf?t=1623761047200') format('truetype');
} }
.iconfont { .iconfont {

View File

@ -61,18 +61,22 @@
&.project-icon { &.project-icon {
border-radius: 50%; border-radius: 50%;
background-color: #F2F3F5; background-color: #F2F3F5;
.ivu-icon { .menu-icon {
font-size: 20px; font-size: 20px;
width: 36px; width: 36px;
height: 36px; height: 36px;
line-height: 36px; line-height: 36px;
} }
.ivu-badge { .menu-badge {
position: absolute; position: absolute;
top: -6px; top: -6px;
left: 20px; left: 20px;
transform: scale(0.8); transform: scale(0.8);
} }
.search-input {
margin: 2px 0;
width: 170px;
}
&.active { &.active {
color: #ffffff; color: #ffffff;
background-color: #2d8cf0; background-color: #2d8cf0;
@ -84,6 +88,12 @@
display: flex; display: flex;
justify-content: flex-end; justify-content: flex-end;
margin-top: 24px; margin-top: 24px;
.project-checkbox {
display: flex;
align-items: center;
margin-right: 14px;
opacity: 0.9;
}
.project-switch-button { .project-switch-button {
display: flex; display: flex;
align-items: center; align-items: center;
@ -279,14 +289,13 @@
overflow-x: hidden; overflow-x: hidden;
overflow-y: auto; overflow-y: auto;
.task-list { .task-list {
flex: 1; > div:last-child {
height: 0; margin-bottom: 16px;
display: flex; }
flex-direction: column;
} }
.task-item { .task-item {
cursor: pointer; cursor: pointer;
margin: 0 10px 16px; margin: 16px 10px 0;
background-color: #ffffff; background-color: #ffffff;
border-radius: 12px; border-radius: 12px;
padding: 12px; padding: 12px;
@ -295,9 +304,6 @@
&:hover { &:hover {
box-shadow: 0 0 10px #e6ecfa; box-shadow: 0 0 10px #e6ecfa;
} }
&:first-child {
margin-top: 16px;
}
.task-head { .task-head {
display: flex; display: flex;
align-items: flex-start; align-items: flex-start;
@ -449,6 +455,9 @@
display: none; display: none;
} }
} }
&.hidden {
display: none;
}
} }
} }
} }

View File

@ -85,10 +85,9 @@
padding: 0 4%; padding: 0 4%;
border-radius: 4px; border-radius: 4px;
> i { > i {
opacity: 0.5; opacity: 0.3;
font-size: 22px; font-size: 20px;
margin-right: 10px; margin-right: 10px;
margin-top: -1px;
} }
.menu-title { .menu-title {
flex: 1; flex: 1;

View File

@ -76,27 +76,11 @@
> li { > li {
display: flex; display: flex;
flex-direction: row; flex-direction: row;
align-items: center; align-items: flex-start;
height: 80px; padding: 16px 12px;
padding: 0 12px;
position: relative; position: relative;
cursor: pointer; cursor: pointer;
list-style: none; list-style: none;
&.active {
background-color: #F4F5F7;
}
&.loading {
margin: 0;
height: 52px;
display: flex;
align-items: center;
justify-content: center;
.common-loading {
width: 20px;
height: 20px;
margin: 0;
}
}
.user-avatar, .user-avatar,
.icon-avatar { .icon-avatar {
width: 46px; width: 46px;
@ -105,16 +89,18 @@
flex-shrink: 0; flex-shrink: 0;
} }
.icon-avatar { .icon-avatar {
line-height: 46px; display: flex;
align-items: center;
justify-content: center;
border-radius: 50%; border-radius: 50%;
font-size: 26px; font-size: 26px;
background-color: #61B2F9; background-color: #61B2F9;
color: #ffffff; color: #ffffff;
&.project { &.project {
background-color: #7274E3; background-color: #6E99EB;
} }
&.task { &.task {
background-color: #4EA3F4; background-color: #9B96DF;
font-size: 24px; font-size: 24px;
} }
} }
@ -170,6 +156,21 @@
font-size: 12px; font-size: 12px;
transform: scale(0.8); transform: scale(0.8);
} }
&.active {
background-color: #F4F5F7;
}
&.loading {
margin: 0;
height: 52px;
display: flex;
align-items: center;
justify-content: center;
.common-loading {
width: 20px;
height: 20px;
margin: 0;
}
}
} }
} }
&.contacts { &.contacts {