mirror of
https://github.com/kuaifan/dootask.git
synced 2026-03-03 16:02:08 +00:00
no message
This commit is contained in:
kuaifan
parent
2f76e932b0
commit
c5c9e19f76
@ -1,14 +1,16 @@
|
||||
<template>
|
||||
<Modal
|
||||
:value="show"
|
||||
:value="visible"
|
||||
:mask="false"
|
||||
:mask-closable="false"
|
||||
:footer-hide="true"
|
||||
:transition-names="['mobile-dialog', '']"
|
||||
:transition-names="['', '']"
|
||||
:beforeClose="onBeforeClose"
|
||||
class-name="dialog-modal"
|
||||
fullscreen>
|
||||
<DialogWrapper v-if="windowSmall && dialogId > 0" :dialogId="dialogId" :beforeBack="onBeforeClose"/>
|
||||
<transition name="mobile-dialog">
|
||||
<DialogWrapper v-if="windowSmall && dialogId > 0" :dialogId="dialogId" :beforeBack="onBeforeClose"/>
|
||||
</transition>
|
||||
</Modal>
|
||||
</template>
|
||||
|
||||
@ -23,6 +25,7 @@ body {
|
||||
padding: 0;
|
||||
|
||||
.ivu-modal-content {
|
||||
background: transparent;
|
||||
|
||||
.ivu-modal-close {
|
||||
display: none;
|
||||
@ -49,6 +52,13 @@ export default {
|
||||
name: "DialogModal",
|
||||
components: {DialogWrapper},
|
||||
|
||||
data() {
|
||||
return {
|
||||
timer: null,
|
||||
visible: false,
|
||||
}
|
||||
},
|
||||
|
||||
computed: {
|
||||
...mapState(['dialogId']),
|
||||
|
||||
@ -57,6 +67,19 @@ export default {
|
||||
}
|
||||
},
|
||||
|
||||
watch: {
|
||||
show(v) {
|
||||
this.timer && clearTimeout(this.timer);
|
||||
if (v) {
|
||||
this.visible = true;
|
||||
} else {
|
||||
this.timer = setTimeout(_ => {
|
||||
this.visible = false;
|
||||
}, 300);
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
methods: {
|
||||
onBeforeClose() {
|
||||
return new Promise(_ => {
|
||||
|
||||
@ -3,69 +3,70 @@
|
||||
v-if="isReady"
|
||||
class="dialog-wrapper"
|
||||
:class="wrapperClass"
|
||||
:style="wrapperStyle"
|
||||
@drop.prevent="chatPasteDrag($event, 'drag')"
|
||||
@dragover.prevent="chatDragOver(true, $event)"
|
||||
@dragleave.prevent="chatDragOver(false, $event)"
|
||||
@touchmove="onTouchmove">
|
||||
<!--顶部导航-->
|
||||
<slot name="head">
|
||||
<div class="dialog-nav" :class="{completed:$A.dialogCompleted(dialogData)}">
|
||||
<div class="dialog-back" @click="onBack">
|
||||
<i class="taskfont"></i>
|
||||
<div v-if="msgUnreadOnly" class="back-num">{{msgUnreadOnly}}</div>
|
||||
</div>
|
||||
|
||||
<div class="dialog-block">
|
||||
<div class="dialog-avatar">
|
||||
<template v-if="dialogData.type=='group'">
|
||||
<i v-if="dialogData.group_type=='project'" class="taskfont icon-avatar project"></i>
|
||||
<i v-else-if="dialogData.group_type=='task'" class="taskfont icon-avatar task"></i>
|
||||
<Icon v-else class="icon-avatar" type="ios-people" />
|
||||
</template>
|
||||
<div v-else-if="dialogData.dialog_user" class="user-avatar">
|
||||
<UserAvatar :online.sync="dialogData.online_state" :userid="dialogData.dialog_user.userid" :size="42"/>
|
||||
</div>
|
||||
<Icon v-else class="icon-avatar" type="md-person" />
|
||||
<div class="dialog-nav" :style="navStyle">
|
||||
<slot name="head">
|
||||
<div class="nav-wrapper" :class="{completed:$A.dialogCompleted(dialogData)}">
|
||||
<div class="dialog-back" @click="onBack">
|
||||
<i class="taskfont"></i>
|
||||
<div v-if="msgUnreadOnly" class="back-num">{{msgUnreadOnly}}</div>
|
||||
</div>
|
||||
<div class="dialog-title">
|
||||
<div class="main-title">
|
||||
<template v-for="tag in $A.dialogTags(dialogData)" v-if="tag.color != 'success'">
|
||||
<Tag :color="tag.color" :fade="false">{{$L(tag.text)}}</Tag>
|
||||
|
||||
<div class="dialog-block">
|
||||
<div class="dialog-avatar">
|
||||
<template v-if="dialogData.type=='group'">
|
||||
<i v-if="dialogData.group_type=='project'" class="taskfont icon-avatar project"></i>
|
||||
<i v-else-if="dialogData.group_type=='task'" class="taskfont icon-avatar task"></i>
|
||||
<Icon v-else class="icon-avatar" type="ios-people" />
|
||||
</template>
|
||||
<h2>{{dialogData.name}}</h2>
|
||||
<em v-if="peopleNum > 0">({{peopleNum}})</em>
|
||||
<label v-if="dialogData.top_at" class="top-text">{{$L('置顶')}}</label>
|
||||
<div v-else-if="dialogData.dialog_user" class="user-avatar">
|
||||
<UserAvatar :online.sync="dialogData.online_state" :userid="dialogData.dialog_user.userid" :size="42"/>
|
||||
</div>
|
||||
<Icon v-else class="icon-avatar" type="md-person" />
|
||||
</div>
|
||||
<template v-if="dialogData.type === 'group'">
|
||||
<div v-if="dialogData.group_type === 'project'" class="sub-title pointer" @click="openProject">
|
||||
{{$L('项目聊天室')}} {{$L('打开项目管理')}}
|
||||
<div class="dialog-title">
|
||||
<div class="main-title">
|
||||
<template v-for="tag in $A.dialogTags(dialogData)" v-if="tag.color != 'success'">
|
||||
<Tag :color="tag.color" :fade="false">{{$L(tag.text)}}</Tag>
|
||||
</template>
|
||||
<h2>{{dialogData.name}}</h2>
|
||||
<em v-if="peopleNum > 0">({{peopleNum}})</em>
|
||||
<label v-if="dialogData.top_at" class="top-text">{{$L('置顶')}}</label>
|
||||
</div>
|
||||
<div v-else-if="dialogData.group_type === 'task'" class="sub-title pointer" @click="openTask">
|
||||
{{$L('任务聊天室')}} {{$L('查看任务详情')}}
|
||||
<template v-if="dialogData.type === 'group'">
|
||||
<div v-if="dialogData.group_type === 'project'" class="sub-title pointer" @click="openProject">
|
||||
{{$L('项目聊天室')}} {{$L('打开项目管理')}}
|
||||
</div>
|
||||
<div v-else-if="dialogData.group_type === 'task'" class="sub-title pointer" @click="openTask">
|
||||
{{$L('任务聊天室')}} {{$L('查看任务详情')}}
|
||||
</div>
|
||||
</template>
|
||||
<div v-else-if="dialogData.type === 'user'" :class="['sub-title', dialogData.online_state === true ? 'online' : 'offline']">
|
||||
{{$L(dialogData.online_state === true ? '在线' : dialogData.online_state)}}
|
||||
</div>
|
||||
</template>
|
||||
<div v-else-if="dialogData.type === 'user'" :class="['sub-title', dialogData.online_state === true ? 'online' : 'offline']">
|
||||
{{$L(dialogData.online_state === true ? '在线' : dialogData.online_state)}}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<template v-if="dialogData.type === 'group'">
|
||||
<ETooltip
|
||||
v-if="dialogData.group_type === 'user'"
|
||||
placement="top"
|
||||
:disabled="windowSmall"
|
||||
:openDelay="600"
|
||||
:content="$L('群设置')">
|
||||
<i class="taskfont dialog-create" @click="groupInfoShow = true"></i>
|
||||
<template v-if="dialogData.type === 'group'">
|
||||
<ETooltip
|
||||
v-if="dialogData.group_type === 'user'"
|
||||
placement="top"
|
||||
:disabled="windowSmall"
|
||||
:openDelay="600"
|
||||
:content="$L('群设置')">
|
||||
<i class="taskfont dialog-create" @click="groupInfoShow = true"></i>
|
||||
</ETooltip>
|
||||
</template>
|
||||
<ETooltip v-else-if="dialogData.type === 'user' && !isMyDialog" placement="top" :disabled="windowSmall" :content="$L('创建群组')">
|
||||
<i class="taskfont dialog-create" @click="openCreateGroup"></i>
|
||||
</ETooltip>
|
||||
</template>
|
||||
<ETooltip v-else-if="dialogData.type === 'user' && !isMyDialog" placement="top" :disabled="windowSmall" :content="$L('创建群组')">
|
||||
<i class="taskfont dialog-create" @click="openCreateGroup"></i>
|
||||
</ETooltip>
|
||||
</div>
|
||||
</slot>
|
||||
</div>
|
||||
</slot>
|
||||
</div>
|
||||
|
||||
<!--消息列表-->
|
||||
<DynamicScroller
|
||||
@ -327,7 +328,7 @@ export default {
|
||||
dialogDrag: false,
|
||||
groupInfoShow: false,
|
||||
|
||||
wrapperStyle: {},
|
||||
navStyle: {},
|
||||
|
||||
operateVisible: false,
|
||||
operateHasText: false,
|
||||
@ -364,7 +365,8 @@ export default {
|
||||
'cacheDialogs',
|
||||
'dialogMsgs',
|
||||
'wsOpenNum',
|
||||
'touchBackInProgress'
|
||||
'touchBackInProgress',
|
||||
'taskId',
|
||||
]),
|
||||
|
||||
isReady() {
|
||||
@ -510,8 +512,8 @@ export default {
|
||||
windowScrollY(val) {
|
||||
if ($A.isIos()) {
|
||||
const {scrollE} = this.scrollInfo();
|
||||
this.wrapperStyle = {
|
||||
top: val + 'px'
|
||||
this.navStyle = {
|
||||
marginTop: val + 'px'
|
||||
}
|
||||
if (scrollE <= 10) {
|
||||
this.$nextTick(_ => {
|
||||
@ -751,6 +753,9 @@ export default {
|
||||
if (!this.dialogData.group_info) {
|
||||
return;
|
||||
}
|
||||
if (this.windowSmall) {
|
||||
this.$store.dispatch("openDialog", 0);
|
||||
}
|
||||
this.goForward({name: 'manage-project', params: {projectId:this.dialogData.group_info.id}});
|
||||
},
|
||||
|
||||
@ -758,6 +763,9 @@ export default {
|
||||
if (!this.dialogData.group_info) {
|
||||
return;
|
||||
}
|
||||
if (this.taskId > 0) {
|
||||
this.$store.dispatch("openDialog", 0);
|
||||
}
|
||||
this.$store.dispatch("openTask", this.dialogData.group_info.id);
|
||||
},
|
||||
|
||||
|
||||
@ -1,5 +1,5 @@
|
||||
<template>
|
||||
<DialogWrapper v-if="projectData.cacheParameter.chat" :dialog-id="projectData.dialog_id" class="project-dialog">
|
||||
<DialogWrapper v-if="windowLarge && projectData.cacheParameter.chat" :dialog-id="projectData.dialog_id" class="project-dialog">
|
||||
<template slot="head">
|
||||
<div class="dialog-user">
|
||||
<div class="member-head">
|
||||
@ -14,7 +14,7 @@
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="dialog-nav">
|
||||
<div class="nav-wrapper">
|
||||
<div class="dialog-title">
|
||||
<h2>{{$L('群聊')}}</h2>
|
||||
</div>
|
||||
|
||||
@ -44,7 +44,7 @@
|
||||
</div>
|
||||
</Tooltip>
|
||||
</li>
|
||||
<li :class="['project-icon', projectData.cacheParameter.chat ? 'active' : '']" @click="toggleParameter('chat')">
|
||||
<li :class="['project-icon', windowLarge && projectData.cacheParameter.chat ? 'active' : '']" @click="toggleParameter('chat')">
|
||||
<Icon class="menu-icon" type="ios-chatbubbles" />
|
||||
<Badge class="menu-badge" :count="msgUnread"></Badge>
|
||||
</li>
|
||||
@ -1420,6 +1420,11 @@ export default {
|
||||
toggleParameter(data) {
|
||||
if (data === 'completedTask') {
|
||||
this.$store.dispatch("forgetTaskCompleteTemp", true);
|
||||
} else if (data === 'chat') {
|
||||
if (this.windowSmall) {
|
||||
this.$store.dispatch('openDialog', this.projectData.dialog_id)
|
||||
return;
|
||||
}
|
||||
}
|
||||
this.$store.dispatch('toggleProjectParameter', data);
|
||||
},
|
||||
|
||||
@ -554,6 +554,7 @@ export default {
|
||||
'taskContents',
|
||||
'taskFiles',
|
||||
'taskPriority',
|
||||
'dialogId',
|
||||
]),
|
||||
|
||||
projectName() {
|
||||
@ -1111,6 +1112,9 @@ export default {
|
||||
this.msgRecord = {};
|
||||
this.msgFile = [];
|
||||
this.msgText = "";
|
||||
if (this.dialogId > 0) {
|
||||
this.$store.dispatch("openTask", 0);
|
||||
}
|
||||
this.$store.dispatch('openDialog', data.dialog_id)
|
||||
} else {
|
||||
this.sendDialogMsg();
|
||||
|
||||
26
resources/assets/sass/dark.scss
vendored
26
resources/assets/sass/dark.scss
vendored
@ -157,19 +157,21 @@ body.dark-mode-reverse {
|
||||
|
||||
.dialog-wrapper {
|
||||
.dialog-nav {
|
||||
.dialog-block {
|
||||
.dialog-avatar {
|
||||
.icon-avatar {
|
||||
color: #1c1917;
|
||||
}
|
||||
}
|
||||
.dialog-title {
|
||||
.main-title {
|
||||
> h2 {
|
||||
color: #555;
|
||||
.nav-wrapper {
|
||||
.dialog-block {
|
||||
.dialog-avatar {
|
||||
.icon-avatar {
|
||||
color: #1c1917;
|
||||
}
|
||||
.top-text {
|
||||
color: #000000;
|
||||
}
|
||||
.dialog-title {
|
||||
.main-title {
|
||||
> h2 {
|
||||
color: #555;
|
||||
}
|
||||
.top-text {
|
||||
color: #000000;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@ -18,176 +18,180 @@
|
||||
}
|
||||
|
||||
.dialog-nav {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 0 22px;
|
||||
height: 68px;
|
||||
position: relative;
|
||||
width: 100%;
|
||||
|
||||
&:before {
|
||||
content: "";
|
||||
position: absolute;
|
||||
left: 0;
|
||||
bottom: 0;
|
||||
width: 100%;
|
||||
height: 1px;
|
||||
background-color: #f4f5f5;
|
||||
}
|
||||
|
||||
&.completed {
|
||||
&:after {
|
||||
content: "\f373";
|
||||
font-family: Ionicons, serif;
|
||||
pointer-events: none;
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
right: 22px;
|
||||
transform: translateY(-50%);
|
||||
font-size: 40px;
|
||||
color: #19be6b;
|
||||
opacity: .2;
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
.dialog-title {
|
||||
padding-right: 52px;
|
||||
}
|
||||
}
|
||||
|
||||
.dialog-block {
|
||||
flex: 1;
|
||||
width: 0;
|
||||
.nav-wrapper {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 0 22px;
|
||||
height: 68px;
|
||||
position: relative;
|
||||
|
||||
.dialog-avatar {
|
||||
flex-shrink: 0;
|
||||
margin-right: 12px;
|
||||
&:before {
|
||||
content: "";
|
||||
position: absolute;
|
||||
left: 0;
|
||||
bottom: 0;
|
||||
width: 100%;
|
||||
height: 1px;
|
||||
background-color: #f4f5f5;
|
||||
}
|
||||
|
||||
.user-avatar,
|
||||
.icon-avatar {
|
||||
width: 42px;
|
||||
height: 42px;
|
||||
margin: 2px;
|
||||
flex-grow: 0;
|
||||
flex-shrink: 0;
|
||||
&.completed {
|
||||
&:after {
|
||||
content: "\f373";
|
||||
font-family: Ionicons, serif;
|
||||
pointer-events: none;
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
right: 22px;
|
||||
transform: translateY(-50%);
|
||||
font-size: 40px;
|
||||
color: #19be6b;
|
||||
opacity: .2;
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
.icon-avatar {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
border-radius: 50%;
|
||||
font-size: 26px;
|
||||
background-color: #61B2F9;
|
||||
color: #ffffff;
|
||||
|
||||
&.project {
|
||||
background-color: #6E99EB;
|
||||
}
|
||||
|
||||
&.task {
|
||||
background-color: #9B96DF;
|
||||
font-size: 24px;
|
||||
}
|
||||
.dialog-title {
|
||||
padding-right: 52px;
|
||||
}
|
||||
}
|
||||
|
||||
.dialog-title {
|
||||
.dialog-block {
|
||||
flex: 1;
|
||||
width: 0;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
|
||||
.main-title {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
line-height: 22px;
|
||||
max-width: 100%;
|
||||
.dialog-avatar {
|
||||
flex-shrink: 0;
|
||||
margin-right: 12px;
|
||||
|
||||
.ivu-tag {
|
||||
.user-avatar,
|
||||
.icon-avatar {
|
||||
width: 42px;
|
||||
height: 42px;
|
||||
margin: 2px;
|
||||
flex-grow: 0;
|
||||
flex-shrink: 0;
|
||||
margin: 0 6px 0 0;
|
||||
padding: 0 5px;
|
||||
}
|
||||
|
||||
&.ivu-tag-success {
|
||||
.icon-avatar {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
border-radius: 50%;
|
||||
font-size: 26px;
|
||||
background-color: #61B2F9;
|
||||
color: #ffffff;
|
||||
|
||||
&.project {
|
||||
background-color: #6E99EB;
|
||||
}
|
||||
|
||||
&.task {
|
||||
background-color: #9B96DF;
|
||||
font-size: 24px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.dialog-title {
|
||||
flex: 1;
|
||||
width: 0;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
|
||||
.main-title {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
line-height: 22px;
|
||||
max-width: 100%;
|
||||
|
||||
.ivu-tag {
|
||||
flex-shrink: 0;
|
||||
margin: 0 6px 0 0;
|
||||
padding: 0 5px;
|
||||
|
||||
&.ivu-tag-success {
|
||||
padding: 0 6px;
|
||||
}
|
||||
}
|
||||
|
||||
.ivu-icon {
|
||||
font-size: 18px;
|
||||
margin-right: 6px;
|
||||
|
||||
&.completed {
|
||||
color: $primary-color;
|
||||
}
|
||||
}
|
||||
|
||||
> h2 {
|
||||
font-size: 17px;
|
||||
font-weight: 600;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
> em {
|
||||
flex-shrink: 0;
|
||||
font-style: normal;
|
||||
font-size: 17px;
|
||||
font-weight: 500;
|
||||
padding-left: 6px;
|
||||
}
|
||||
|
||||
.top-text {
|
||||
flex-shrink: 0;
|
||||
height: 24px;
|
||||
line-height: 24px;
|
||||
padding: 0 6px;
|
||||
border-radius: 4px;
|
||||
margin-left: 10px;
|
||||
background-color: $primary-color;
|
||||
color: #FFFFFF;
|
||||
text-align: center;
|
||||
white-space: nowrap;
|
||||
}
|
||||
}
|
||||
|
||||
.ivu-icon {
|
||||
font-size: 18px;
|
||||
margin-right: 6px;
|
||||
.sub-title {
|
||||
flex-shrink: 0;
|
||||
font-size: 12px;
|
||||
line-height: 20px;
|
||||
padding-top: 2px;
|
||||
color: #aaaaaa;
|
||||
white-space: normal;
|
||||
|
||||
&.completed {
|
||||
&.pointer {
|
||||
cursor: pointer;
|
||||
|
||||
&:hover {
|
||||
color: #888888;
|
||||
}
|
||||
}
|
||||
|
||||
&.online {
|
||||
color: $primary-color;
|
||||
}
|
||||
}
|
||||
|
||||
> h2 {
|
||||
font-size: 17px;
|
||||
font-weight: 600;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
> em {
|
||||
flex-shrink: 0;
|
||||
font-style: normal;
|
||||
font-size: 17px;
|
||||
font-weight: 500;
|
||||
padding-left: 6px;
|
||||
}
|
||||
|
||||
.top-text {
|
||||
flex-shrink: 0;
|
||||
height: 24px;
|
||||
line-height: 24px;
|
||||
padding: 0 6px;
|
||||
border-radius: 4px;
|
||||
margin-left: 10px;
|
||||
background-color: $primary-color;
|
||||
color: #FFFFFF;
|
||||
text-align: center;
|
||||
white-space: nowrap;
|
||||
}
|
||||
}
|
||||
|
||||
.sub-title {
|
||||
flex-shrink: 0;
|
||||
font-size: 12px;
|
||||
line-height: 20px;
|
||||
padding-top: 2px;
|
||||
color: #aaaaaa;
|
||||
white-space: normal;
|
||||
|
||||
&.pointer {
|
||||
cursor: pointer;
|
||||
|
||||
&:hover {
|
||||
color: #888888;
|
||||
}
|
||||
}
|
||||
|
||||
&.online {
|
||||
color: $primary-color;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.dialog-back,
|
||||
.dialog-create {
|
||||
cursor: pointer;
|
||||
margin-left: 24px;
|
||||
font-size: 22px;
|
||||
color: $primary-text-color;
|
||||
}
|
||||
.dialog-back,
|
||||
.dialog-create {
|
||||
cursor: pointer;
|
||||
margin-left: 24px;
|
||||
font-size: 22px;
|
||||
color: $primary-text-color;
|
||||
}
|
||||
|
||||
.dialog-back {
|
||||
display: none;
|
||||
.dialog-back {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@ -1038,74 +1042,76 @@
|
||||
|
||||
@media (max-width: 768px) {
|
||||
.dialog-wrapper {
|
||||
background-color: #f8f8f8;
|
||||
.dialog-nav {
|
||||
height: 52px;
|
||||
padding: 0;
|
||||
justify-content: center;
|
||||
background-color: #f8f8f8;
|
||||
|
||||
&.completed {
|
||||
&:after {
|
||||
right: 14px;
|
||||
}
|
||||
.dialog-title {
|
||||
padding-right: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.dialog-back,
|
||||
.dialog-create {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
right: 0;
|
||||
margin: 0;
|
||||
width: 52px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
.nav-wrapper {
|
||||
height: 52px;
|
||||
padding: 0;
|
||||
justify-content: center;
|
||||
}
|
||||
.dialog-back {
|
||||
padding-right: 6px;
|
||||
right: auto;
|
||||
left: 0;
|
||||
> i {
|
||||
font-size: 26px;
|
||||
}
|
||||
.back-num {
|
||||
font-family: "Source Sans Pro", "Helvetica Neue", Arial, sans-serif;
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 32px;
|
||||
background: #e6ebf1;
|
||||
color: $primary-title-color;
|
||||
transform: translate(0, -50%);
|
||||
font-weight: 500;
|
||||
font-size: 14px;
|
||||
border-radius: 12px;
|
||||
min-width: 24px;
|
||||
height: 24px;
|
||||
line-height: 24px;
|
||||
text-align: center;
|
||||
padding: 0 6px;
|
||||
}
|
||||
}
|
||||
.dialog-block {
|
||||
margin: 0 80px;
|
||||
justify-content: center;
|
||||
.dialog-avatar {
|
||||
display: none;
|
||||
}
|
||||
.dialog-title {
|
||||
flex: unset;
|
||||
width: unset;
|
||||
overflow: hidden;
|
||||
text-align: center;
|
||||
.main-title {
|
||||
justify-content: center;
|
||||
|
||||
&.completed {
|
||||
&:after {
|
||||
right: 14px;
|
||||
}
|
||||
.sub-title {
|
||||
line-height: 18px;
|
||||
.dialog-title {
|
||||
padding-right: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.dialog-back,
|
||||
.dialog-create {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
right: 0;
|
||||
margin: 0;
|
||||
width: 52px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
.dialog-back {
|
||||
padding-right: 6px;
|
||||
right: auto;
|
||||
left: 0;
|
||||
> i {
|
||||
font-size: 26px;
|
||||
}
|
||||
.back-num {
|
||||
font-family: "Source Sans Pro", "Helvetica Neue", Arial, sans-serif;
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 32px;
|
||||
background: #e6ebf1;
|
||||
color: $primary-title-color;
|
||||
transform: translate(0, -50%);
|
||||
font-weight: 500;
|
||||
font-size: 14px;
|
||||
border-radius: 12px;
|
||||
min-width: 24px;
|
||||
height: 24px;
|
||||
line-height: 24px;
|
||||
text-align: center;
|
||||
padding: 0 6px;
|
||||
}
|
||||
}
|
||||
.dialog-block {
|
||||
margin: 0 80px;
|
||||
justify-content: center;
|
||||
.dialog-avatar {
|
||||
display: none;
|
||||
}
|
||||
.dialog-title {
|
||||
flex: unset;
|
||||
width: unset;
|
||||
overflow: hidden;
|
||||
text-align: center;
|
||||
.main-title {
|
||||
justify-content: center;
|
||||
}
|
||||
.sub-title {
|
||||
line-height: 18px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -1115,6 +1121,7 @@
|
||||
padding-left: 14px;
|
||||
overscroll-behavior: none;
|
||||
user-select: none;
|
||||
background-color: #ffffff;
|
||||
|
||||
.dialog-item {
|
||||
.dialog-view {
|
||||
|
||||
@ -64,22 +64,8 @@
|
||||
}
|
||||
}
|
||||
.dialog-nav {
|
||||
padding: 0 20px;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 768px) {
|
||||
.project-dialog {
|
||||
.dialog-user {
|
||||
margin-top: 16px;
|
||||
padding: 0 12px;
|
||||
.member-list {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
.dialog-nav {
|
||||
padding: 0 12px;
|
||||
height: 64px;
|
||||
.nav-wrapper {
|
||||
padding: 0 20px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
12
resources/assets/sass/pages/page-project.scss
vendored
12
resources/assets/sass/pages/page-project.scss
vendored
@ -18,18 +18,6 @@
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 768px) {
|
||||
.page-project {
|
||||
.project-dialog {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
max-width: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
@media (max-height: 700px) {
|
||||
.page-project {
|
||||
.project-panel {
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user