index.vue 1.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778
  1. <template>
  2. <TUIGroupManage class="setting" :conversation="conversation" :userInfo="userInfo" />
  3. </template>
  4. <script lang="ts">
  5. import TUIGroupManage from "./manage-components/manage.vue";
  6. import { defineComponent, reactive, toRefs, computed } from 'vue';
  7. import { onUnload } from "@dcloudio/uni-app";
  8. import store from '../../TUICore/store';
  9. import { TUIGroupServer } from '../../TUICore/server'
  10. const TUIConversation = defineComponent({
  11. name: "TUIConversation",
  12. components: {
  13. TUIGroupManage,
  14. },
  15. setup(props) {
  16. const timStore = store.state.timStore;
  17. uni.$TUIKit.TUIGroupServer = new TUIGroupServer();
  18. const data: any = reactive({
  19. conversation: computed(() => timStore.conversation),
  20. userInfo: {
  21. isGroup: false,
  22. list: [],
  23. },
  24. });
  25. onUnload(() => {
  26. uni.$TUIKit.TUIGroupServer.destroyed();
  27. });
  28. return {
  29. ...toRefs(data),
  30. };
  31. },
  32. });
  33. export default TUIConversation;
  34. </script>
  35. <style lang="scss" scoped>
  36. .title-container {
  37. width: 100%;
  38. display: flex;
  39. justify-content: center;
  40. padding: 34px 0px 0px;
  41. font-size: 17px;
  42. }
  43. .icon-container {
  44. width: 66px;
  45. display: flex;
  46. justify-content: center;
  47. padding: 34px 0 0 0;
  48. .add-icon-image {
  49. width: 24px;
  50. height: 24px;
  51. }
  52. &.right-icon-container {
  53. position: relative;
  54. left: 20px;
  55. }
  56. }
  57. .chat-container {
  58. display: flex;
  59. align-items: center;
  60. margin-bottom: 16px;
  61. color: #444444;
  62. .item-icon {
  63. display: inline-block;
  64. width: 21px;
  65. height: 21px;
  66. margin-right: 12px;
  67. }
  68. }
  69. </style>