diff --git a/resources/assets/js/pages/manage/components/ChatInput.vue b/resources/assets/js/pages/manage/components/ChatInput.vue
index 37ea121f9..df026b6a1 100755
--- a/resources/assets/js/pages/manage/components/ChatInput.vue
+++ b/resources/assets/js/pages/manage/components/ChatInput.vue
@@ -1,6 +1,11 @@
@@ -33,6 +38,10 @@ export default {
type: Boolean,
default: false
},
+ loading: {
+ type: Boolean,
+ default: false
+ },
enterSend: {
type: Boolean,
default: true
@@ -118,7 +127,7 @@ export default {
shortKey: true,
handler: _ => {
if (!this.enterSend) {
- this.$emit('on-send', this.quill)
+ this.send();
return false;
}
return true;
@@ -129,7 +138,7 @@ export default {
shiftKey: false,
handler: _ => {
if (this.enterSend) {
- this.$emit('on-send', this.quill)
+ this.send();
return false;
}
return true;
@@ -230,6 +239,10 @@ export default {
})
},
+ send() {
+ this.$emit('on-send', this.quill)
+ },
+
getSource(mentionChar) {
return new Promise(resolve => {
switch (mentionChar) {
diff --git a/resources/assets/js/pages/manage/components/DialogWrapper.vue b/resources/assets/js/pages/manage/components/DialogWrapper.vue
index cc9298db4..f7e839d35 100644
--- a/resources/assets/js/pages/manage/components/DialogWrapper.vue
+++ b/resources/assets/js/pages/manage/components/DialogWrapper.vue
@@ -82,19 +82,18 @@
{{$L('有' + msgNew + '条新消息')}}
-
-
-
{{$L('拖动到这里发送')}}
@@ -1090,7 +1085,7 @@ export default {
};
this.msgFile = [];
this.msgText = "";
- this.goForward({name: 'manage-messenger', params: {dialogId: data.dialog_id}});
+ this.goForward({name: 'manage-messenger', params: {dialogId: data.dialog_id}, query: {_: $A.randomString(6)}});
this.$store.dispatch('openTask', 0);
} else {
this.sendDialogMsg();
diff --git a/resources/assets/js/pages/manage/messenger.vue b/resources/assets/js/pages/manage/messenger.vue
index 0c8704145..43d51bb55 100644
--- a/resources/assets/js/pages/manage/messenger.vue
+++ b/resources/assets/js/pages/manage/messenger.vue
@@ -59,7 +59,7 @@
{{$A.formatTime(dialog.last_at)}}
-
+
{{$L('您')}}
diff --git a/resources/assets/sass/pages/components/chat-input.scss b/resources/assets/sass/pages/components/chat-input.scss
index ea0008afc..7fb5a870a 100755
--- a/resources/assets/sass/pages/components/chat-input.scss
+++ b/resources/assets/sass/pages/components/chat-input.scss
@@ -6,169 +6,199 @@
width: 100%;
&.task-mention {
+ .ql-container {
+ .ql-mention-list-container {
+ .ql-mention-list {
+ > li {
+ &:first-child {
+ margin-top: 0;
+ }
+ }
+ }
+ .ql-mention-list-item {
+ line-height: 36px;
+ .mention-item-disabled {
+ padding: 8px 4px 0;
+ }
+ }
+ }
+ }
+ }
+
+ .ql-container {
+ display: block;
+ float: left;
+ max-width: 100%;
+ min-width: calc(100% - 28px);
+
+ .ql-editor {
+ padding: 4px 7px;
+ font-size: 14px;
+ max-height: 200px;
+
+ img {
+ max-width: 150px;
+ max-height: 150px;
+ }
+
+ &.ql-blank {
+ &::before {
+ left: 7px;
+ right: 7px;
+ color: #ccc;
+ font-style: normal;
+ }
+ }
+ }
+
.ql-mention-list-container {
+ width: auto;
+ min-width: 220px;
+ max-width: 350px;
+ max-height: 360px;
+ overflow-y: overlay;
+
+ &::-webkit-scrollbar {
+ width: 10px;
+ height: 10px;
+ }
+
+ &::-webkit-scrollbar-thumb {
+ border-radius: 10px;
+ background: rgba(0, 0, 0, 0);
+ }
+
+ &::-webkit-scrollbar-thumb:active {
+ border-radius: 10px;
+ background: rgba(0, 0, 0, .5);
+ }
+
+ &:hover::-webkit-scrollbar-thumb {
+ border: 2px solid transparent;
+ background: rgba(0, 0, 0, .2);
+ background-clip: content-box;
+ }
+
+ &:hover::-webkit-scrollbar-thumb:hover {
+ border-top-width: 0;
+ border-bottom-width: 0;
+ }
+
+ &::-webkit-scrollbar-track {
+ border-radius: 10px;
+ background: rgba(0, 0, 0, 0);
+ }
+
.ql-mention-list {
> li {
&:first-child {
- margin-top: 0;
+ margin-top: 8px;
+ }
+ &:last-child {
+ margin-bottom: 8px;
}
}
}
+
.ql-mention-list-item {
- line-height: 36px;
- .mention-item-disabled {
- padding: 8px 4px 0;
- }
- }
- }
- }
-
- .ql-editor {
- padding: 4px 7px;
- font-size: 14px;
- max-height: 200px;
-
- img {
- max-width: 150px;
- max-height: 150px;
- }
-
- &.ql-blank {
- &::before {
- left: 7px;
- right: 7px;
- color: #ccc;
- font-style: normal;
- }
- }
- }
-
- .ql-mention-list-container {
- width: auto;
- min-width: 220px;
- max-width: 350px;
- max-height: 360px;
- overflow-y: overlay;
-
- &::-webkit-scrollbar {
- width: 10px;
- height: 10px;
- }
-
- &::-webkit-scrollbar-thumb {
- border-radius: 10px;
- background: rgba(0, 0, 0, 0);
- }
-
- &::-webkit-scrollbar-thumb:active {
- border-radius: 10px;
- background: rgba(0, 0, 0, .5);
- }
-
- &:hover::-webkit-scrollbar-thumb {
- border: 2px solid transparent;
- background: rgba(0, 0, 0, .2);
- background-clip: content-box;
- }
-
- &:hover::-webkit-scrollbar-thumb:hover {
- border-top-width: 0;
- border-bottom-width: 0;
- }
-
- &::-webkit-scrollbar-track {
- border-radius: 10px;
- background: rgba(0, 0, 0, 0);
- }
-
- .ql-mention-list {
- > li {
- &:first-child {
- margin-top: 8px;
- }
- &:last-child {
- margin-bottom: 8px;
- }
- }
- }
-
- .ql-mention-list-item {
- padding: 0 8px;
- display: flex;
- align-items: center;
- margin: 0 8px;
-
- &.selected {
- border-radius: 4px;
- }
-
- .mention-item-at {
- width: 28px;
- height: 28px;
- line-height: 28px;
- border-radius: 50%;
- text-align: center;
- color: #ffffff;
- background-color: #8bcf70;
- overflow: hidden;
- }
-
- .mention-item-img {
- position: relative;
+ padding: 0 8px;
display: flex;
align-items: center;
- justify-content: center;
+ margin: 0 8px;
- > img {
+ &.selected {
+ border-radius: 4px;
+ }
+
+ .mention-item-at {
width: 28px;
height: 28px;
+ line-height: 28px;
border-radius: 50%;
+ text-align: center;
+ color: #ffffff;
+ background-color: #8bcf70;
overflow: hidden;
}
- > em {
- position: absolute;
- right: 0;
- bottom: 0;
- width: 8px;
- height: 8px;
- border-radius: 50%;
- background-color: #ff9900;
- border: 1px solid #ffffff;
- transform-origin: right bottom;
- z-index: 1;
- }
+ .mention-item-img {
+ position: relative;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+
+ > img {
+ width: 28px;
+ height: 28px;
+ border-radius: 50%;
+ overflow: hidden;
+ }
- &.online {
> em {
- background-color: $primary-color;
+ position: absolute;
+ right: 0;
+ bottom: 0;
+ width: 8px;
+ height: 8px;
+ border-radius: 50%;
+ background-color: #ff9900;
+ border: 1px solid #ffffff;
+ transform-origin: right bottom;
+ z-index: 1;
+ }
+
+ &.online {
+ > em {
+ background-color: $primary-color;
+ }
}
}
- }
- .mention-item-name {
- padding: 0 8px;
- font-size: 14px;
- overflow: hidden;
- white-space: nowrap;
- text-overflow: ellipsis;
- }
+ .mention-item-name {
+ padding: 0 8px;
+ font-size: 14px;
+ overflow: hidden;
+ white-space: nowrap;
+ text-overflow: ellipsis;
+ }
- .mention-item-tip {
- color: #8f8f8e;
- font-size: 12px;
- font-style: normal;
- overflow: hidden;
- white-space: nowrap;
- text-overflow: ellipsis;
- }
+ .mention-item-tip {
+ color: #8f8f8e;
+ font-size: 12px;
+ font-style: normal;
+ overflow: hidden;
+ white-space: nowrap;
+ text-overflow: ellipsis;
+ }
- .mention-item-disabled {
- color: #aaa;
- font-size: 12px;
- padding: 0 4px;
- line-height: 40px;
+ .mention-item-disabled {
+ color: #aaa;
+ font-size: 12px;
+ padding: 0 4px;
+ line-height: 40px;
+ }
}
}
}
+
+ .chat-input-toolbar {
+ display: flex;
+ align-items: center;
+ justify-content: flex-end;
+ float: right;
+ width: 28px;
+ height: 28px;
+ padding: 0 2px;
+ .common-loading {
+ width: 18px;
+ height: 18px;
+ }
+ > i {
+ font-size: 18px;
+ &.disabled {
+ opacity: 0.5;
+ }
+ }
+ }
+
}
diff --git a/resources/assets/sass/pages/components/dialog-wrapper.scss b/resources/assets/sass/pages/components/dialog-wrapper.scss
index 3179d68a3..962d067a5 100644
--- a/resources/assets/sass/pages/components/dialog-wrapper.scss
+++ b/resources/assets/sass/pages/components/dialog-wrapper.scss
@@ -550,21 +550,16 @@
}
.dialog-input {
- background-color: #F4F5F7;
- padding: 10px 52px 10px 12px;
- border-radius: 10px;
- }
-
- .dialog-send {
- position: absolute;
- top: 0;
- right: 28px;
- bottom: 0;
- font-size: 18px;
- width: 46px;
+ width: 100%;
display: flex;
align-items: center;
- justify-content: center;
+ .chat-input-wrapper {
+ flex: 1;
+ width: 0;
+ background-color: #F4F5F7;
+ padding: 10px 12px;
+ border-radius: 10px;
+ }
}
.chat-upload {
diff --git a/resources/assets/sass/pages/components/project-dialog.scss b/resources/assets/sass/pages/components/project-dialog.scss
index 0075fe1b7..4772b7b3d 100644
--- a/resources/assets/sass/pages/components/project-dialog.scss
+++ b/resources/assets/sass/pages/components/project-dialog.scss
@@ -68,8 +68,18 @@
padding: 0 20px;
}
.dialog-footer {
- .dialog-back {
- display: none;
+ .dialog-input {
+ .dialog-back {
+ display: none;
+ align-items: center;
+ justify-content: center;
+ width: 64px;
+ height: 100%;
+ max-height: 64px;
+ font-size: 26px;
+ margin-left: -20px;
+ z-index: 1;
+ }
}
}
}
@@ -90,24 +100,11 @@
padding: 0 20px;
}
.dialog-footer {
- position: relative;
- .dialog-back {
- position: absolute;
- top: 0;
- left: 0;
- bottom: 0;
- width: 64px;
- z-index: 1;
- font-size: 26px;
- display: flex;
- align-items: center;
- justify-content: center;
- }
.dialog-input {
- width: calc(100% - 44px);
- }
- .dialog-send {
- right: 22px;
+ align-items: flex-end;
+ .dialog-back {
+ display: flex;
+ }
}
}
}
diff --git a/resources/assets/sass/pages/components/task-detail.scss b/resources/assets/sass/pages/components/task-detail.scss
index b25b84fe9..5817a475c 100644
--- a/resources/assets/sass/pages/components/task-detail.scss
+++ b/resources/assets/sass/pages/components/task-detail.scss
@@ -574,21 +574,13 @@
background-color: #F4F5F7;
padding: 10px 12px;
border-radius: 10px;
- .ivu-input {
- border: 0;
- resize: none;
- background-color: transparent;
- &:focus {
- box-shadow: none;
- }
- }
- .no-send {
- display: none;
+ .chat-input-toolbar {
+ position: relative;
.ivu-badge {
position: absolute;
transform: scale(0.6);
- top: 5px;
- left: 4px;
+ top: -6px;
+ left: 0;
}
}
}
@@ -826,28 +818,5 @@
overflow-x: auto;
}
}
- .task-dialog {
- .no-dialog {
- .no-input {
- position: relative;
- padding-right: 52px;
- .no-send {
- position: absolute;
- top: 0;
- right: 0;
- bottom: 0;
- font-size: 18px;
- width: 46px;
- display: flex;
- align-items: center;
- justify-content: center;
- .common-loading {
- width: 20px;
- height: 20px;
- }
- }
- }
- }
- }
}
}
diff --git a/resources/assets/sass/pages/page-messenger.scss b/resources/assets/sass/pages/page-messenger.scss
index c3242e9a4..9bc4762f2 100644
--- a/resources/assets/sass/pages/page-messenger.scss
+++ b/resources/assets/sass/pages/page-messenger.scss
@@ -352,8 +352,18 @@
position: relative;
.dialog-wrapper {
.dialog-footer {
- .dialog-back {
- display: none;
+ .dialog-input {
+ .dialog-back {
+ display: none;
+ align-items: center;
+ justify-content: center;
+ width: 64px;
+ height: 100%;
+ max-height: 64px;
+ font-size: 26px;
+ margin-left: -20px;
+ z-index: 1;
+ }
}
}
}
@@ -415,24 +425,11 @@
justify-content: center;
}
.dialog-footer {
- position: relative;
- .dialog-back {
- position: absolute;
- left: 0;
- bottom: 0;
- width: 64px;
- height: 49px;
- z-index: 1;
- font-size: 26px;
- display: flex;
- align-items: center;
- justify-content: center;
- }
.dialog-input {
- width: calc(100% - 44px);
- }
- .dialog-send {
- right: 22px;
+ align-items: flex-end;
+ .dialog-back {
+ display: flex;
+ }
}
}
}