index.vue 2.1 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768
  1. <template>
  2. <div class="dialogue">
  3. <custom-header :name="nameVal" bgColor="#f2f3f5" isGoBack @goback="headerCallBack"></custom-header>
  4. <chat-window :text="desc" :userId="userIdVal" :img="imgVal" @update:name="nameVal = $event"></chat-window>
  5. </div>
  6. </template>
  7. <script setup>
  8. import customHeader from "@/components/customHeader.vue";
  9. import { onActivated, ref } from "vue";
  10. import chatWindow from "@/components/chatWindow";
  11. import { useRoute, useRouter } from "vue-router";
  12. import eventBus from "@/api/eventBus";
  13. const route = useRoute();
  14. const router = useRouter();
  15. const desc = ref("");
  16. const nameVal = ref("");
  17. const userIdVal = ref(null);
  18. const imgVal = ref("");
  19. const formPageVal = ref("");
  20. onActivated(() => {
  21. userIdVal.value = null;
  22. setTimeout(() => {
  23. const { text, formPage, userId, img } = route.query;
  24. desc.value = text;
  25. userIdVal.value = userId;
  26. imgVal.value = img;
  27. formPageVal.value = formPage;
  28. if(formPage) {
  29. sessionStorage.setItem('chat_frame_page', formPage);
  30. }
  31. }, 100);
  32. });
  33. function headerCallBack() {
  34. const page = sessionStorage.getItem('chat_frame_page');
  35. console.log("page", page);
  36. if(page === 'messageList') {
  37. VE_API.bbs.readUpdate({ targetUserId: userIdVal.value, farmId: route.query.farmId }).then((res) => {
  38. if (res.code === 0) {
  39. sessionStorage.removeItem('chat_frame_page');
  40. router.replace({ path: '/message_list', query: { farmId: route.query.farmId, from: 'monitor' } });
  41. }
  42. });
  43. } else {
  44. router.go(-1);
  45. }
  46. }
  47. </script>
  48. <style lang="scss" scoped>
  49. .dialogue {
  50. width: 100%;
  51. height: calc(100vh - 40px);
  52. background: #f2f3f5;
  53. box-sizing: border-box;
  54. .chat-container {
  55. display: flex;
  56. flex-direction: column;
  57. height: 100%;
  58. width: 100%;
  59. margin: 0 auto;
  60. border: 1px solid #e6e6e6;
  61. font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, sans-serif;
  62. }
  63. }
  64. </style>