From 6981ee03bfecabcda8c968160e2a6076553c776b Mon Sep 17 00:00:00 2001 From: kuaifan Date: Sun, 6 Jun 2021 12:20:48 +0800 Subject: [PATCH] no message --- app/Http/Controllers/Api/DialogController.php | 5 +- app/Models/WebSocketDialog.php | 5 +- docker-compose.yml | 3 + resources/assets/js/components/ScrollerY.vue | 86 +++- resources/assets/js/components/UserAvatar.vue | 16 +- resources/assets/js/components/UserInput.vue | 4 +- resources/assets/js/components/WAvatar.vue | 124 +++++ resources/assets/js/functions/web.js | 43 +- resources/assets/js/pages/manage.vue | 2 +- .../js/pages/manage/components/DialogView.vue | 39 +- .../pages/manage/components/DialogWrapper.vue | 235 ++++++++++ .../pages/manage/components/ProjectDialog.vue | 429 +++--------------- .../manage/{dialog.vue => messenger.vue} | 52 ++- resources/assets/js/routes.js | 6 +- resources/assets/js/store/mutations.js | 42 +- resources/assets/js/store/state.js | 3 + resources/assets/sass/main.scss | 146 +++++- 17 files changed, 783 insertions(+), 457 deletions(-) create mode 100644 resources/assets/js/components/WAvatar.vue create mode 100644 resources/assets/js/pages/manage/components/DialogWrapper.vue rename resources/assets/js/pages/manage/{dialog.vue => messenger.vue} (73%) diff --git a/app/Http/Controllers/Api/DialogController.php b/app/Http/Controllers/Api/DialogController.php index df22ba7a..4356b459 100755 --- a/app/Http/Controllers/Api/DialogController.php +++ b/app/Http/Controllers/Api/DialogController.php @@ -105,7 +105,10 @@ class DialogController extends AbstractController return $item; }); // - return Base::retSuccess('success', $list); + $data = $list->toArray(); + $data['dialog'] = WebSocketDialog::formatData($dialog, $user->userid); + // + return Base::retSuccess('success', $data); } /** diff --git a/app/Models/WebSocketDialog.php b/app/Models/WebSocketDialog.php index 7763898d..2f671d6f 100644 --- a/app/Models/WebSocketDialog.php +++ b/app/Models/WebSocketDialog.php @@ -44,10 +44,13 @@ class WebSocketDialog extends AbstractModel $dialog->last_msg = $last_msg; // 未读信息 $dialog->unread = WebSocketDialogMsgRead::whereDialogId($dialog->id)->whereUserid($userid)->whereReadAt(null)->count(); + // 对话人数 + $builder = WebSocketDialogUser::whereDialogId($dialog->id); + $dialog->people = $builder->count(); // 对方信息 $dialog->dialog_user = null; if ($dialog->type === 'user') { - $dialog_user = WebSocketDialogUser::whereDialogId($dialog->id)->where('userid', '!=', $userid)->first(); + $dialog_user = $builder->where('userid', '!=', $userid)->first(); $dialog->name = User::userid2nickname($dialog_user->userid); $dialog->dialog_user = $dialog_user; } diff --git a/docker-compose.yml b/docker-compose.yml index 758a3ef6..8cf29bd3 100755 --- a/docker-compose.yml +++ b/docker-compose.yml @@ -12,6 +12,7 @@ services: - ./docker/php/php.ini:/usr/local/etc/php/php.ini - ./docker/log/supervisor:/var/log/supervisor - ./:/var/www + - /etc/localtime:/etc/localtime:ro environment: TZ: "Asia/Shanghai" LANG: "C.UTF-8" @@ -38,6 +39,7 @@ services: volumes: - ./docker/nginx:/etc/nginx/conf.d - ./public:/var/www/public + - /etc/localtime:/etc/localtime:ro environment: TZ: "Asia/Shanghai" networks: @@ -65,6 +67,7 @@ services: volumes: - ./docker/mysql/conf.d:/etc/mysql/conf.d - ./docker/mysql/data:/var/lib/mysql + - /etc/localtime:/etc/localtime:ro environment: TZ: "Asia/Shanghai" MYSQL_ROOT_PASSWORD: "${DB_ROOT_PASSWORD}" diff --git a/resources/assets/js/components/ScrollerY.vue b/resources/assets/js/components/ScrollerY.vue index f862b0b4..e2f12515 100644 --- a/resources/assets/js/components/ScrollerY.vue +++ b/resources/assets/js/components/ScrollerY.vue @@ -1,6 +1,7 @@ @@ -14,6 +15,11 @@ overflow-x: hidden; overflow-y: auto; -webkit-overflow-scrolling: touch; + .app-scroller-bottom { + height: 0; + margin: 0; + padding: 0; + } } .app-scroller-static { @@ -29,16 +35,49 @@ export default { type: Boolean, default: false }, + autoBottom: { + type: Boolean, + default: false + }, + autoRecovery: { + type: Boolean, + default: true + }, + autoRecoveryAnimate: { + type: Boolean, + default: false + }, }, + data() { return { scrollY: 0, scrollDiff: 0, - scrollInfo: {}, + autoInterval: null, } }, + mounted() { - this.$nextTick(() => { + this.openInterval() + this.$nextTick(this.initScroll); + }, + + activated() { + this.openInterval() + this.recoveryScroll() + }, + + destroyed() { + this.closeInterval() + }, + + deactivated() { + this.closeInterval() + }, + + methods: { + initScroll() { + this.autoToBottom(); let scrollListener = typeof this.$listeners['on-scroll'] === "function"; let scrollerView = $A(this.$refs.scrollerView); scrollerView.scroll(() => { @@ -72,16 +111,31 @@ export default { }); } }); - }); - }, - activated() { - if (this.scrollY > 0) { - this.$nextTick(() => { - this.scrollTo(this.scrollY); - }); - } - }, - methods: { + }, + + recoveryScroll() { + if (this.autoRecovery && (this.scrollY > 0 || this.autoBottom)) { + this.$nextTick(() => { + if (this.autoBottom) { + this.autoToBottom(); + } else { + this.scrollTo(this.scrollY, this.autoRecoveryAnimate); + } + }); + } + }, + + openInterval() { + this.autoToBottom(); + this.autoInterval && clearInterval(this.autoInterval); + this.autoInterval = setInterval(this.autoToBottom, 300) + }, + + closeInterval() { + clearInterval(this.autoInterval); + this.autoInterval = null; + }, + scrollTo(top, animate) { if (animate === false) { $A(this.$refs.scrollerView).stop().scrollTop(top); @@ -89,10 +143,16 @@ export default { $A(this.$refs.scrollerView).stop().animate({"scrollTop": top}); } }, + scrollToBottom(animate) { this.scrollTo(this.$refs.scrollerView.scrollHeight, animate); }, - getScrollInfo() { + + autoToBottom() { + this.autoBottom && this.$refs.bottom.scrollIntoView(false); + }, + + scrollInfo() { let scrollerView = $A(this.$refs.scrollerView); let wInnerH = Math.round(scrollerView.innerHeight()); let wScrollY = scrollerView.scrollTop(); diff --git a/resources/assets/js/components/UserAvatar.vue b/resources/assets/js/components/UserAvatar.vue index f9d0c689..dba73d21 100755 --- a/resources/assets/js/components/UserAvatar.vue +++ b/resources/assets/js/components/UserAvatar.vue @@ -9,8 +9,8 @@
- - {{nickname}} + + {{nickname}}
{{user.nickname}}
@@ -18,8 +18,11 @@ diff --git a/resources/assets/js/functions/web.js b/resources/assets/js/functions/web.js index c76a7ba8..d374ea4b 100755 --- a/resources/assets/js/functions/web.js +++ b/resources/assets/js/functions/web.js @@ -19,10 +19,6 @@ return window.location.origin + '/' + str; }, - webUrl(str) { - return $A.fillUrl(str || ''); - }, - apiUrl(str) { if (str.substring(0, 2) === "//" || str.substring(0, 7) === "http://" || @@ -34,6 +30,10 @@ return apiUrl + str; }, + /** + * @param params {url,data,method,timeout,header,spinner,websocket,timeout, before,complete,success,error,after} + * @returns {boolean} + */ apiAjax(params) { if (!$A.isJson(params)) return false; if (typeof params.success === 'undefined') params.success = () => { }; @@ -44,21 +44,23 @@ params.header['language'] = $A.getLanguage(); params.header['token'] = $A.store.state.userToken; // - let beforeCall = params.before; - params.before = () => { - $A.aAjaxLoadNum++; - $A(".common-spinner").show(); - typeof beforeCall == "function" && beforeCall(); - }; - // - let completeCall = params.complete; - params.complete = () => { - $A.aAjaxLoadNum--; - if ($A.aAjaxLoadNum <= 0) { - $A(".common-spinner").hide(); - } - typeof completeCall == "function" && completeCall(); - }; + if (params.spinner === true) { + let beforeCall = params.before; + params.before = () => { + $A.aAjaxLoadNum++; + $A(".common-spinner").show(); + typeof beforeCall == "function" && beforeCall(); + }; + // + let completeCall = params.complete; + params.complete = () => { + $A.aAjaxLoadNum--; + if ($A.aAjaxLoadNum <= 0) { + $A(".common-spinner").hide(); + } + typeof completeCall == "function" && completeCall(); + }; + } // let callback = params.success; params.success = (data, status, xhr) => { @@ -105,9 +107,9 @@ }); // params.complete = () => { }; - params.after = () => { }; params.success = () => { }; params.error = () => { }; + params.after = () => { }; params.header['Api-Websocket'] = apiWebsocket; // if ($A.aAjaxWsReady === false) { @@ -140,6 +142,7 @@ } // $A.ajaxc(params); + return true; }, aAjaxLoadNum: 0, aAjaxWsReady: false, diff --git a/resources/assets/js/pages/manage.vue b/resources/assets/js/pages/manage.vue index dd37b440..af1cab5b 100644 --- a/resources/assets/js/pages/manage.vue +++ b/resources/assets/js/pages/manage.vue @@ -14,7 +14,7 @@
{{$L('日历')}}
-
  • +
  • {{$L('消息')}}
    • diff --git a/resources/assets/js/pages/manage/components/DialogView.vue b/resources/assets/js/pages/manage/components/DialogView.vue index 3b41ef12..c5d721d0 100644 --- a/resources/assets/js/pages/manage/components/DialogView.vue +++ b/resources/assets/js/pages/manage/components/DialogView.vue @@ -2,18 +2,18 @@
    -
    +
    -
    - - +
    + +
    - +
    -
    {{msgInfo.name}}
    -
    {{$A.bytesToSize(msgInfo.size)}}
    +
    {{msgData.msg.name}}
    +
    {{$A.bytesToSize(msgData.msg.size)}}
     @@ -74,7 +74,6 @@ export default { data() { return { - msgInfo: {}, read_list: [] } }, @@ -117,8 +116,6 @@ export default { }, parsingData() { - this.msgInfo = this.msgData.msg; - // const {userid, r, id} = this.msgData; if (userid == this.userId) return; if ($A.isJson(r) && r.read_at) return; @@ -153,22 +150,22 @@ export default { imageStyle(info) { const {width, height} = info; if (width && height) { - let maxWidth = 220, - maxHeight = 220, - tempWidth = width, - tempHeight = height; - if (width > maxWidth || height > maxHeight) { + let maxW = 220, + maxH = 220, + tempW = width, + tempH = height; + if (width > maxW || height > maxH) { if (width > height) { - tempWidth = maxWidth; - tempHeight = height * (maxWidth / width); + tempW = maxW; + tempH = height * (maxW / width); } else { - tempWidth = width * (maxHeight / height); - tempHeight = maxHeight; + tempW = width * (maxH / height); + tempH = maxH; } } return { - width: tempWidth + 'px', - height: tempHeight + 'px', + width: tempW + 'px', + height: tempH + 'px', }; } return {}; diff --git a/resources/assets/js/pages/manage/components/DialogWrapper.vue b/resources/assets/js/pages/manage/components/DialogWrapper.vue new file mode 100644 index 00000000..6522eff2 --- /dev/null +++ b/resources/assets/js/pages/manage/components/DialogWrapper.vue @@ -0,0 +1,235 @@ + + + diff --git a/resources/assets/js/pages/manage/components/ProjectDialog.vue b/resources/assets/js/pages/manage/components/ProjectDialog.vue index b23711a2..a951bfda 100644 --- a/resources/assets/js/pages/manage/components/ProjectDialog.vue +++ b/resources/assets/js/pages/manage/components/ProjectDialog.vue @@ -1,74 +1,26 @@ - diff --git a/resources/assets/js/pages/manage/dialog.vue b/resources/assets/js/pages/manage/messenger.vue similarity index 73% rename from resources/assets/js/pages/manage/dialog.vue rename to resources/assets/js/pages/manage/messenger.vue index 147c5ff4..699da62f 100644 --- a/resources/assets/js/pages/manage/dialog.vue +++ b/resources/assets/js/pages/manage/messenger.vue @@ -1,35 +1,43 @@