Home Explore Help
Sign In
lex
/
imChat
1
0
Fork 0
Files Issues 0 Pull Requests 0 Wiki
Browse Source

合并

lex-xin 1 year ago
parent
b1a45990c7 ef8de3ef7f
commit
9dc140578e
38 changed files with 1704 additions and 756 deletions
Unified View Show Diff Stats
  1. 1 0
      dist/assets/index-1e6dac8f.js
  2. 1 0
      dist/assets/index-41630b3b.css
  3. 1 0
      dist/assets/index-4f5b20f6.css
  4. 1 0
      dist/assets/index-aa4ee879.js
  5. 5 0
      dist/index.html
  6. 1 1
      index.html
  7. 2 2
      src/TUIKit/TUIComponents/components/transferTUI/index.vue
  8. 1 1
      src/TUIKit/TUIComponents/container/TUIChat/components/index.vue
  9. 2 2
      src/TUIKit/TUIComponents/container/TUIChat/components/message-bubble.vue
  10. 64 1
      src/TUIKit/TUIComponents/container/TUIChat/components/message-custom.vue
  11. 2 0
      src/TUIKit/TUIComponents/container/TUIChat/components/message-reference.vue
  12. 5 1
      src/TUIKit/TUIComponents/container/TUIChat/manage-components/manage-member.vue
  13. 587 0
      src/TUIKit/TUIComponents/container/TUIChat/manage-components/manage-notification-detail.vue
  14. 519 99
      src/TUIKit/TUIComponents/container/TUIChat/manage-components/manage-notification.vue
  15. 82 22
      src/TUIKit/TUIComponents/container/TUIChat/manage-components/manage.vue
  16. 32 51
      src/TUIKit/TUIComponents/container/TUIChat/manage-components/member-profile.vue
  17. 55 85
      src/TUIKit/TUIComponents/container/TUIChat/message-input/message-input-at.vue
  18. 38 67
      src/TUIKit/TUIComponents/container/TUIChat/plugin-components/readReceiptDialog/readReceiptDialog.vue
  19. 55 131
      src/TUIKit/TUIComponents/container/TUIChat/plugin-components/replies/replies-item.vue
  20. 2 2
      src/TUIKit/TUIComponents/container/TUIChat/utils/dist/utils.js
  21. 4 2
      src/TUIKit/TUIComponents/container/TUIChat/utils/utils.ts
  22. 48 125
      src/TUIKit/TUIComponents/container/TUIContact/index.vue
  23. 1 1
      src/TUIKit/TUIComponents/container/TUIConversation/components/list-item/style/web.scss
  24. 1 1
      src/TUIKit/TUIComponents/container/TUIGroup/index.vue
  25. 1 1
      src/TUIKit/TUIComponents/container/TUIPerson/index.vue
  26. 109 129
      src/TUIKit/TUIComponents/container/TUIProfile/components/TUIProfileEdit/index.vue
  27. 19 23
      src/TUIKit/TUIComponents/container/TUIProfile/index.vue
  28. 1 0
      src/TUIKit/TUIComponents/container/constant.ts
  29. 27 2
      src/TUIKit/api.ts
  30. BIN
      src/assets/icon-add.png
  31. BIN
      src/assets/icon-more-point.png
  32. BIN
      src/assets/icon-notice.png
  33. BIN
      src/assets/icon-t-1.png
  34. BIN
      src/assets/icon-t-2.png
  35. 1 1
      src/index.scss
  36. 9 3
      src/main.ts
  37. 26 2
      src/style.css
  38. 1 1
      vite.config.ts

File diff suppressed because it is too large
+ 1 - 0
dist/assets/index-1e6dac8f.js


File diff suppressed because it is too large
+ 1 - 0
dist/assets/index-41630b3b.css


File diff suppressed because it is too large
+ 1 - 0
dist/assets/index-4f5b20f6.css


File diff suppressed because it is too large
+ 1 - 0
dist/assets/index-aa4ee879.js


+ 5 - 0
dist/index.html
View File 

@@ -6,8 +6,13 @@
 
   <link rel="icon" type="image/svg+xml" href="./vite.svg" />
 
   <link rel="icon" type="image/svg+xml" href="./vite.svg" />
 
   <meta name="viewport" content="width=device-width, initial-scale=1.0" />
 
   <meta name="viewport" content="width=device-width, initial-scale=1.0" />
 
   <title>IM</title>
 
   <title>IM</title>
 
+<<<<<<< HEAD
 
   <script type="module" crossorigin src="./assets/index-aa4ee879.js"></script>
 
   <script type="module" crossorigin src="./assets/index-aa4ee879.js"></script>
 
   <link rel="stylesheet" href="./assets/index-4f5b20f6.css">
 
   <link rel="stylesheet" href="./assets/index-4f5b20f6.css">
 
+=======
 
+  <script type="module" crossorigin src="./assets/index-1e6dac8f.js"></script>
 
+  <link rel="stylesheet" href="./assets/index-41630b3b.css">
 
+>>>>>>> gym-20240920
 
 </head>
 
 </head>
 
 
 
 <body>
 
 <body>

+ 1 - 1
index.html
View File 

@@ -5,7 +5,7 @@
 
   <meta charset="UTF-8" />
 
   <meta charset="UTF-8" />
 
   <link rel="icon" type="image/svg+xml" href="/vite.svg" />
 
   <link rel="icon" type="image/svg+xml" href="/vite.svg" />
 
   <meta name="viewport" content="width=device-width, initial-scale=1.0" />
 
   <meta name="viewport" content="width=device-width, initial-scale=1.0" />
 
-  <title>IM</title>
 
+  <title>聊天</title>
 
 </head>
 
 </head>
 
 
 
 <body>
 
 <body>

+ 2 - 2
src/TUIKit/TUIComponents/components/transferTUI/index.vue
View File 

@@ -18,7 +18,7 @@
 
             <li class="list-item" v-for="(item, index) in list" :key="index" @click="selected(item)">
 
             <li class="list-item" v-for="(item, index) in list" :key="index" @click="selected(item)">
 
               <i class="icon" :class="[item?.isDisabled && 'disabled', selectedList.indexOf(item) > -1 ? 'icon-selected' : 'icon-unselected']"></i>
 
               <i class="icon" :class="[item?.isDisabled && 'disabled', selectedList.indexOf(item) > -1 ? 'icon-selected' : 'icon-unselected']"></i>
 
               <template v-if="!isCustomItem">
 
               <template v-if="!isCustomItem">
 
-                <img class="avatar" :src="item?.avatar || 'https://news-info.ks3-cn-beijing.ksyuncs.com/07/1690787574969.png'" onerror="this.src='https://news-info.ks3-cn-beijing.ksyuncs.com/07/1690787574969.png'" />
 
+                <img class="avatar" :src="item?.avatar || 'https://oss.dayaedu.com/news-info/07/1690787574969.png'" onerror="this.src='https://oss.dayaedu.com/news-info/07/1690787574969.png'" />
 
                 <span class="name">{{ item?.nick || item?.userID }}</span>
 
                 <span class="name">{{ item?.nick || item?.userID }}</span>
 
                 <span v-if="item?.isDisabled">（{{ $t("component.已在群聊中") }}）</span>
 
                 <span v-if="item?.isDisabled">（{{ $t("component.已在群聊中") }}）</span>
 
               </template>
 
               </template>
 
@@ -41,7 +41,7 @@
 
           <li class="list-item space-between" v-for="(item, index) in selectedList" :key="index">
 
           <li class="list-item space-between" v-for="(item, index) in selectedList" :key="index">
 
             <aside>
 
             <aside>
 
               <template v-if="!isCustomItem">
 
               <template v-if="!isCustomItem">
 
-                <img class="avatar" :src="item?.avatar || 'https://news-info.ks3-cn-beijing.ksyuncs.com/07/1690787574969.png'" onerror="this.src='https://news-info.ks3-cn-beijing.ksyuncs.com/07/1690787574969.png'" />
 
+                <img class="avatar" :src="item?.avatar || 'https://oss.dayaedu.com/news-info/07/1690787574969.png'" onerror="this.src='https://oss.dayaedu.com/news-info/07/1690787574969.png'" />
 
                 <span v-if="!isH5">{{ item.nick || item.userID }}</span>
 
                 <span v-if="!isH5">{{ item.nick || item.userID }}</span>
 
               </template>
 
               </template>
 
               <template v-else>
 
               <template v-else>

+ 1 - 1
src/TUIKit/TUIComponents/container/TUIChat/components/index.vue
View File 

@@ -39,7 +39,7 @@
 
     <!-- <DialogTUI :show="dialogShow" :isHeaderShow="false" :is-footer-show="false" @update:show="(e) => (dialogShow = e)">
 
     <!-- <DialogTUI :show="dialogShow" :isHeaderShow="false" :is-footer-show="false" @update:show="(e) => (dialogShow = e)">
 
       <div v-for="(item, index) in dialogMessageList" :key="index">
 
       <div v-for="(item, index) in dialogMessageList" :key="index">
 
         <div class="dialogItem">
 
         <div class="dialogItem">
 
-          <img class="avatar" :src="item?.avatar || 'https://news-info.ks3-cn-beijing.ksyuncs.com/07/1690787574969.png'" onerror="this.src='https://news-info.ks3-cn-beijing.ksyuncs.com/07/1690787574969.png'" />
 
+          <img class="avatar" :src="item?.avatar || 'https://oss.dayaedu.com/news-info/07/1690787574969.png'" onerror="this.src='https://oss.dayaedu.com/news-info/07/1690787574969.png'" />
 
         </div>
 
         </div>
 
       </div>
 
       </div>
 
     </DialogTUI> -->
 
     </DialogTUI> -->

+ 2 - 2
src/TUIKit/TUIComponents/container/TUIChat/components/message-bubble.vue
View File 

@@ -1,6 +1,6 @@
 
 <template>
 
 <template>
 
   <div class="message-bubble" :class="[message.flow === 'in' ? '' : 'reverse']" ref="htmlRefHook">
 
   <div class="message-bubble" :class="[message.flow === 'in' ? '' : 'reverse']" ref="htmlRefHook">
 
-    <img class="avatar" :src="message?.avatar || 'https://news-info.ks3-cn-beijing.ksyuncs.com/07/1690787574969.png'" onerror="this.src='https://news-info.ks3-cn-beijing.ksyuncs.com/07/1690787574969.png'" />
 
+    <img class="avatar" :src="message?.avatar || 'https://oss.dayaedu.com/news-info/07/1690787574969.png'" onerror="this.src='https://oss.dayaedu.com/news-info/07/1690787574969.png'" />
 
     <main class="message-area">
 
     <main class="message-area">
 
       <label class="name" v-if="message.flow === 'in' && message.conversationType === 'GROUP'">
 
       <label class="name" v-if="message.flow === 'in' && message.conversationType === 'GROUP'">
 
         {{ message.nameCard || message.nick || message.from }}
 
         {{ message.nameCard || message.nick || message.from }}
 
@@ -516,7 +516,7 @@ export default messageBubble;
 
       border-radius: 10px 10px 10px 10px;
 
       border-radius: 10px 10px 10px 10px;
 
     }
 
     }
 
     &-out {
 
     &-out {
 
-      background: #dceafd;
 
+      background: #FFF;
 
       border-radius: 10px 0px 10px 10px;
 
       border-radius: 10px 0px 10px 10px;
 
     }
 
     }
 
     &-image {
 
     &-image {

+ 64 - 1
src/TUIKit/TUIComponents/container/TUIChat/components/message-custom.vue
View File 

@@ -66,6 +66,20 @@
 
         <span>{{ data.custom }}</span>
 
         <span>{{ data.custom }}</span>
 
       </div>
 
       </div>
 
     </template>
 
     </template>
 
+    <template v-else-if="isCustom.businessID === constant.TC_GROUP_NOTICE">
 
+      <div class="notice-message" @click="handleNotice">
 
+        <div class="notice-title">
 
+          <i class="iconNotice"></i>
 
+          <span>群公告</span>
 
+        </div>
 
+        <div class="content">
 
+          <div class="content-title">
 
+          {{isCustom.msgTitle}}
 
+          </div>
 
+          <div class="content-text">{{isCustom.msgContent}}</div>
 
+        </div>
 
+      </div>
 
+    </template>
 
     <template v-else>
 
     <template v-else>
 
       <span v-html="data.custom"></span>
 
       <span v-html="data.custom"></span>
 
     </template>
 
     </template>
 
@@ -77,7 +91,9 @@ import { defineComponent, watchEffect, reactive, toRefs } from 'vue';
 
 import { isUrl, JSONToObject } from '../utils/utils';
 
 import { isUrl, JSONToObject } from '../utils/utils';
 
 import constant from '../../constant';
 
 import constant from '../../constant';
 
 import { useStore } from 'vuex';
 
 import { useStore } from 'vuex';
 
-
 
+import { eventGlobal } from "@/helpers";
 
+import TUIMessage from "../../../components/messageTUI/index";
 
+import { imGroupNoticeDetail } from "../../../../api";
 
 export default defineComponent({
 
 export default defineComponent({
 
   props: {
 
   props: {
 
     data: {
 
     data: {
 
@@ -155,11 +171,26 @@ export default defineComponent({
 
       }
 
       }
 
     };
 
     };
 
 
 
+    const handleNotice = async () => {
 
+      if(!data.isCustom?.msgId) return
 
+      try {
 
+        await imGroupNoticeDetail(data.isCustom?.msgId)
 
+        eventGlobal.emit('handleNotice', data.isCustom?.msgId)
 
+      } catch(e) {
 
+        //
 
+        TUIMessage({
 
+          message: e.message,
 
+          isH5: false,
 
+          type: "error",
 
+        });
 
+      }
 
+    }
 
     return {
 
     return {
 
       ...toRefs(data),
 
       ...toRefs(data),
 
       isUrl,
 
       isUrl,
 
       openLink,
 
       openLink,
 
       handleCallMessageIcon,
 
       handleCallMessageIcon,
 
+      handleNotice,
 
       handleCallAgain
 
       handleCallAgain
 
     };
 
     };
 
   }
 
   }
 
@@ -224,5 +255,37 @@ a {
 
       cursor: default;
 
       cursor: default;
 
     }
 
     }
 
   }
 
   }
 
+
 
+  .notice-message {
 
+    max-width: 376px;
 
+    cursor: pointer;
 
+    .notice-title {
 
+      display: flex;
 
+      align-items: center;
 
+      padding-bottom: 6px;
 
+      span {
 
+        font-weight: 600;
 
+        font-size: 16px;
 
+        color: #198CFE;
 
+        line-height: 24px;
 
+      }
 
+            
+      .iconNotice {
 
+        width: 18px;
 
+        height: 18px;
 
+        display: inline-block;
 
+        margin-right: 6px;
 
+      }
 
+    }
 
+    .content {
 
+      font-size: 16px;
 
+      color: #131415;
 
+      line-height: 24px;
 
+      .content-title {
 
+        font-weight: 600;
 
+        
+      }
 
+    }
 
+  }
 
 }
 
 }
 
 </style>
 
 </style>

+ 2 - 0
src/TUIKit/TUIComponents/container/TUIChat/components/message-reference.vue
View File 

@@ -115,6 +115,8 @@ const MessageReference = defineComponent({
 
       data.url = props.url;
 
       data.url = props.url;
 
       data.allMessageID = props.allMessageID;
 
       data.allMessageID = props.allMessageID;
 
       data.type = props.type;
 
       data.type = props.type;
 
+
 
+      console.log(data, '-----------------')
 
     });
 
     });
 
     watch(
 
     watch(
 
       () => props.referenceForShow,
 
       () => props.referenceForShow,

+ 5 - 1
src/TUIKit/TUIComponents/container/TUIChat/manage-components/manage-member.vue
View File 

@@ -4,12 +4,13 @@
 
       <li class="list-item" v-for="(item, index) in list" :key="index">
 
       <li class="list-item" v-for="(item, index) in list" :key="index">
 
         <!-- @click="handleMemberProfileShow(item)" -->
 
         <!-- @click="handleMemberProfileShow(item)" -->
 
         <aside>
 
         <aside>
 
-          <img class="avatar" :src="item?.avatar || 'https://news-info.ks3-cn-beijing.ksyuncs.com/07/1690787574969.png'" onerror="this.src='https://news-info.ks3-cn-beijing.ksyuncs.com/07/1690787574969.png'" />
 
+          <img class="avatar" :src="item?.avatar || 'https://oss.dayaedu.com/news-info/07/1690787574969.png'" onerror="this.src='https://oss.dayaedu.com/news-info/07/1690787574969.png'" />
 
           <span class="name">{{ item?.nickname || item?.userID }}</span>
 
           <span class="name">{{ item?.nickname || item?.userID }}</span>
 
           <span>{{ handleRoleName(item) }}</span>
 
           <span>{{ handleRoleName(item) }}</span>
 
         </aside>
 
         </aside>
 
         <i v-if="item.role !== 'Owner' && isShowDel" class="icon icon-del" @click="submit(item)"></i>
 
         <i v-if="item.role !== 'Owner' && isShowDel" class="icon icon-del" @click="submit(item)"></i>
 
       </li>
 
       </li>
 
+      
       <li class="list-item" v-if="list.length < total" @click="getMore">
 
       <li class="list-item" v-if="list.length < total" @click="getMore">
 
         {{ $t(`TUIChat.manage.查看更多`) }}
 
         {{ $t(`TUIChat.manage.查看更多`) }}
 
       </li>
 
       </li>
 
@@ -108,6 +109,9 @@ export default ManageMember;
 
 .member {
 
 .member {
 
   flex: 1;
 
   flex: 1;
 
   background: #ffffff;
 
   background: #ffffff;
 
+    overflow-y: auto;
 
+    overflow-x: hidden;
 
+    height: 100%;
 
   .list {
 
   .list {
 
     display: flex;
 
     display: flex;
 
     flex-direction: column;
 
     flex-direction: column;

+ 587 - 0
src/TUIKit/TUIComponents/container/TUIChat/manage-components/manage-notification-detail.vue
View File 

@@ -0,0 +1,587 @@
 
+<template>
 
+  <main :class="['notification', isEdit ? 'overflowHidden' : '']">
 
+    <div class="section" v-if="groupDetail?.id">
 
+      <div class="section-item">
 
+        <div class="userInfo">
 
+          <img class="img" :src="groupDetail.avatar" />
 
+
 
+          <div class="username">
 
+            <div class="users">
 
+              <span class="name">{{ groupDetail.username }}</span>
 
+              <span class="tag">{{ formatJobType(groupDetail.jobType) }}</span>
 
+            </div>
 
+            <div class="userTime">
 
+              <span class="time">{{ groupDetail.createTime }}</span>
 
+              <span class="tag" v-if="groupDetail.topFlag">置顶</span>
 
+            </div>
 
+          </div>
 
+
 
+          <n-popover
 
+            v-if="isAuth"
 
+            trigger="click"
 
+            ref="popoverRef"
 
+            :to="false"
 
+            placement="bottom-end"
 
+            width="160px"
 
+            :show-arrow="false"
 
+            class="popoverContainer"
 
+          >
 
+            <template #trigger>
 
+              <i class="iconMorePoint iconMore"></i>
 
+            </template>
 
+            <div class="p-list">
 
+              <div class="p-item" @click="onOperation(groupDetail, 'edit')">
 
+                编辑公告
 
+              </div>
 
+              <div class="p-item" @click="onOperation(groupDetail, 'top')">
 
+                设为置顶
 
+              </div>
 
+              <div
 
+                class="p-item p-red"
 
+                @click="onOperation(groupDetail, 'delete')"
 
+              >
 
+                删除公告
 
+              </div>
 
+            </div>
 
+          </n-popover>
 
+        </div>
 
+
 
+        <div class="section-content">
 
+          <h2>{{ groupDetail.title }}</h2>
 
+          <div class="content">
 
+            {{ groupDetail.content }}
 
+          </div>
 
+        </div>
 
+      </div>
 
+    </div>
 
+
 
+    <n-tooltip
 
+      trigger="hover"
 
+      :show-arrow="false"
 
+      class="toolsNotifi"
 
+      v-if="groupDetail.length > 0 && !isEdit"
 
+    >
 
+      <template #trigger>
 
+        <div class="iconNotifiAdd" @click="onOperation({}, 'add')"></div>
 
+      </template>
 
+      发布公告
 
+    </n-tooltip>
 
+
 
+    <div class="edit-notification" v-if="isEdit">
 
+      <div class="input-section">
 
+        <div class="input-title">
 
+          <i class="iconNotifit1"></i>
 
+          <span>公告标题</span>
 
+        </div>
 
+        <div class="input-content">
 
+          <n-input
 
+            v-model:value="title"
 
+            style="
 
+              --n-caret-color: #198cfe;
 
+              --n-border-hover: 1px solid #198cfe;
 
+              --n-border-focus: 1px solid #198cfe;
 
+              --n-loading-color: #198cfe;
 
+              --n-box-shadow-focus: 0 0 0 2px rgba(25 140 254, 0.2);
 
+            "
 
+            type="textarea"
 
+            placeholder="请输入公告标题"
 
+            show-count
 
+            :maxlength="50"
 
+          />
 
+        </div>
 
+      </div>
 
+
 
+      <div class="input-section">
 
+        <div class="input-title">
 
+          <i class="iconNotifit2"></i>
 
+          <span>公告内容</span>
 
+        </div>
 
+        <div class="input-content notice-content">
 
+          <n-input
 
+            v-model:value="input"
 
+            style="
 
+              --n-caret-color: #198cfe;
 
+              --n-border-hover: 1px solid #198cfe;
 
+              --n-border-focus: 1px solid #198cfe;
 
+              --n-loading-color: #198cfe;
 
+              --n-box-shadow-focus: 0 0 0 2px rgba(25 140 254, 0.2);
 
+            "
 
+            type="textarea"
 
+            placeholder="请输入公告内容"
 
+            :rows="10"
 
+            show-count
 
+            :maxlength="200"
 
+          />
 
+        </div>
 
+      </div>
 
+      <div class="input-section">
 
+        <div class="input-title input-slider">
 
+          <span>设置为置顶</span>
 
+
 
+          <Slider :open="topFlag" @change="onTopFlag" />
 
+        </div>
 
+      </div>
 
+      <div
 
+        :class="['submitBtn', !title || !input ? 'disabled' : '']"
 
+        @click="onSubmit"
 
+      >
 
+        发布
 
+      </div>
 
+    </div>
 
+  </main>
 
+</template>
 
+
 
+<script lang="ts">
 
+import {
 
+  defineComponent,
 
+  watchEffect,
 
+  reactive,
 
+  toRefs,
 
+  onMounted,
 
+  ref,
 
+} from "vue";
 
+import {
 
+  imGroupNoticeDetail,
 
+  imGroupNoticeSave,
 
+  imGroupNoticeUpdate,
 
+  imGroupNoticeRemove,
 
+} from "../../../../api";
 
+import Slider from "../../../components/sliderTUI/index.vue";
 
+import TUIMessage from "../../../components/messageTUI/index";
 
+const ManageNotification = defineComponent({
 
+  components: {
 
+    Slider,
 
+  },
 
+  props: {
 
+    data: {
 
+      type: Object,
 
+      default: () => ({}),
 
+    },
 
+    isAuth: {
 
+      type: Boolean,
 
+      default: false,
 
+    },
 
+    noticeId: {
 
+      type: String,
 
+      default: ""
 
+    }
 
+  },
 
+  setup(props: any, ctx: any) {
 
+    const data: any = reactive({
 
+      groupProfile: {},
 
+      id: "",
 
+      title: "",
 
+      input: "",
 
+      topFlag: true, // 是否置顶
 
+      loading: false,
 
+      groupDetail: {},
 
+      isEdit: false,
 
+    });
 
+    const popoverRef: any = ref();
 
+    const getNotification = async () => {
 
+      data.loading = true;
 
+      try {
 
+        // 获取群公告
 
+        let res = await imGroupNoticeDetail(data.id);
 
+        data.groupDetail = res.data || {};
 
+      } catch (e: any) {
 
+        //
 
+      }
 
+      data.loading = false;
 
+    };
 
+
 
+    const onMore = () => {
 
+      data.page = data.page + 1;
 
+      getNotification();
 
+    };
 
+
 
+    watchEffect(() => {
 
+      data.groupProfile = props.data;
 
+      data.id = props.noticeId
 
+      console.log(props)
 
+      // 不使用默认的数据，从我们自己的数据库中选择
 
+      // data.input = data.groupProfile.notification;
 
+      getNotification();
 
+    });
 
+
 
+    const formatJobType = (jobType: string) => {
 
+      const template = {
 
+        TEACHER: "音乐老师",
 
+        ADMIN: "管理员",
 
+        HEADMASTER: "校长",
 
+      } as any;
 
+      return template[jobType];
 
+    };
 
+
 
+
 
+    const onOperation = async (item: any, type: string) => {
 
+      try {
 
+        if (type === "edit") {
 
+          ctx.emit("changeStatus", "editDetail");
 
+          data.isEdit = true;
 
+          data.title = item.title;
 
+          data.input = item.content;
 
+          data.topFlag = item.topFlag;
 
+          data.id = item.id;
 
+        } else if (type === "top") {
 
+          await imGroupNoticeUpdate({
 
+            imGroupId: data.groupProfile.groupID,
 
+            topFlag: true,
 
+            id: item.id,
 
+          });
 
+          getNotification();
 
+        } else if (type === "delete") {
 
+          await imGroupNoticeRemove({
 
+            id: item.id,
 
+          });
 
+          ctx.emit("changeStatus", "deleteDetail");
 
+        } else if (type === "add") {
 
+          data.isEdit = true;
 
+          data.title = "";
 
+          data.input = "";
 
+          data.topFlag = true;
 
+          data.id = "";
 
+          ctx.emit("changeStatus", "addDetail");
 
+        }
 
+      } catch(e) {
 
+        //
 
+        TUIMessage({
 
+          message: e.message,
 
+          isH5: false,
 
+          type: "error",
 
+        });
 
+      }
 
+      popoverRef.value?.setShow(false);
 
+    };
 
+
 
+    const onSubmit = async () => {
 
+      if (!data.title || !data.input) {
 
+        return;
 
+      }
 
+      try {
 
+        //
 
+        if (data.id) {
 
+          await imGroupNoticeUpdate({
 
+            imGroupId: data.groupProfile.groupID,
 
+            topFlag: data.topFlag,
 
+            title: data.title,
 
+            content: data.input,
 
+            id: data.id,
 
+          });
 
+        } else {
 
+          await imGroupNoticeSave({
 
+            imGroupId: data.groupProfile.groupID,
 
+            title: data.title,
 
+            content: data.input,
 
+            topFlag: data.topFlag,
 
+          });
 
+        }
 
+
 
+        data.isEdit = false;
 
+        ctx.emit("changeStatus", "submitDetail");
 
+        data.page = 1;
 
+        data.groupDetail = [];
 
+        getNotification();
 
+      }  catch(e) {
 
+        //
 
+        TUIMessage({
 
+          message: e.message,
 
+          isH5: false,
 
+          type: "error",
 
+        });
 
+      }
 
+    };
 
+
 
+    const onTopFlag = (val: any) => {
 
+      console.log(val, 'onTopFlag')
 
+      data.topFlag = val
 
+    }
 
+
 
+    const onCloseEdit = () => {
 
+      data.isEdit = false;
 
+    };
 
+
 
+    ctx.expose({
 
+      onCloseEdit,
 
+    });
 
+
 
+    return {
 
+      ...toRefs(data),
 
+      popoverRef,
 
+      formatJobType,
 
+      onMore,
 
+      onTopFlag,
 
+      // updateProfile,
 
+      onOperation,
 
+      onSubmit,
 
+    };
 
+  },
 
+});
 
+export default ManageNotification;
 
+</script>
 
+
 
+<style lang="scss" scoped>
 
+@import url("../../../styles/common.scss");
 
+@import url("../../../styles/icon.scss");
 
+.notification {
 
+  position: relative;
 
+  flex: 1;
 
+  background: #ffffff;
 
+    overflow-y: auto;
 
+    overflow-x: hidden;
 
+    height: 100%;
 
+  // padding: 20px;
 
+  display: flex;
 
+  flex-direction: column;
 
+  background: #f8f9fc;
 
+
 
+  &.overflowHidden {
 
+    overflow: hidden;
 
+  }
 
+}
 
+
 
+.list-item {
 
+  padding: 13px;
 
+  align-items: center;
 
+  font-size: 14px;
 
+  overflow: hidden;
 
+  text-align: center;
 
+  cursor: pointer;
 
+}
 
+
 
+.section-item {
 
+  background: #fff;
 
+  padding: 20px;
 
+  margin-bottom: 8px;
 
+  .userInfo {
 
+    position: relative;
 
+    display: flex;
 
+    align-items: center;
 
+    border-bottom: 1px solid #f2f2f2;
 
+    padding-bottom: 16px;
 
+    margin-bottom: 16px;
 
+
 
+    .img {
 
+      width: 45px;
 
+      height: 45px;
 
+      border-radius: 6px;
 
+      margin-right: 10px;
 
+    }
 
+
 
+    .iconMore {
 
+      width: 23px;
 
+      height: 17px;
 
+      position: absolute;
 
+      right: 0;
 
+      top: 5px;
 
+      cursor: pointer;
 
+    }
 
+  }
 
+  .users {
 
+    display: flex;
 
+    align-items: center;
 
+    .name {
 
+      font-weight: 600;
 
+      font-size: 16px;
 
+      color: #333333;
 
+      line-height: 22px;
 
+    }
 
+    .tag {
 
+      margin-left: 5px;
 
+      font-weight: 400;
 
+      font-size: 12px;
 
+      line-height: 17px;
 
+      color: #2089ff;
 
+      background: #e8f4ff;
 
+      border-radius: 3px;
 
+      border: 1px solid rgba(25, 140, 254, 0.5);
 
+      padding: 0 4px;
 
+    }
 
+  }
 
+  .userTime {
 
+    .time {
 
+      font-size: 13px;
 
+      color: #777777;
 
+      line-height: 18px;
 
+    }
 
+    .tag {
 
+      font-size: 12px;
 
+      color: #f44541;
 
+      line-height: 17px;
 
+      border-radius: 10px;
 
+      border: 1px solid #f44541;
 
+      padding: 0 8px;
 
+      border-radius: 20px;
 
+      margin-left: 6px;
 
+    }
 
+  }
 
+
 
+  .section-content {
 
+    h2 {
 
+      font-weight: 600;
 
+      font-size: 16px;
 
+      color: #333333;
 
+      line-height: 24px;
 
+      word-wrap: break-word;
 
+      word-break: break-all;
 
+    }
 
+    .content {
 
+      font-size: 16px;
 
+      color: #777777;
 
+      line-height: 24px;
 
+      word-wrap: break-word;
 
+      word-break: break-all;
 
+    }
 
+  }
 
+}
 
+
 
+.iconNotifiAdd {
 
+  position: fixed;
 
+  bottom: 24px;
 
+  right: 16px;
 
+  width: 58px;
 
+  height: 58px;
 
+}
 
+
 
+.theEmpty {
 
+  width: 100%;
 
+  display: flex;
 
+  justify-content: center;
 
+  align-items: center;
 
+  flex-direction: column;
 
+  flex: 1;
 
+  background: #fff;
 
+  padding-bottom: 40px;
 
+
 
+  .emptyImg {
 
+    width: 210px;
 
+    height: 210px;
 
+  }
 
+
 
+  p {
 
+    font-size: 16px;
 
+    color: #aaaaaa;
 
+    line-height: 22px;
 
+  }
 
+}
 
+
 
+.notificationBtn {
 
+  margin-top: 10px;
 
+}
 
+
 
+.edit-notification {
 
+  position: fixed;
 
+  width: 360px;
 
+  height: calc(100% - 109Px);
 
+  top: 109Px;
 
+  right: 0;
 
+  z-index: 9;
 
+  background: #fff;
 
+  padding: 0 20px;
 
+  overflow-x: hidden;
 
+  overflow-y: auto;
 
+
 
+  .input-section {
 
+    padding-top: 20px;
 
+  }
 
+
 
+  .input-title {
 
+    display: flex;
 
+    align-items: center;
 
+    font-size: 16px;
 
+    color: #333333;
 
+    line-height: 22px;
 
+    padding-bottom: 10px;
 
+    .iconNotifit1,
 
+    .iconNotifit2 {
 
+      width: 22px;
 
+      height: 22px;
 
+      margin-right: 6px;
 
+      flex-shrink: 0;
 
+    }
 
+    span {
 
+      line-height: 1;
 
+      padding-bottom: 4px;
 
+    }
 
+  }
 
+
 
+  .input-slider {
 
+    display: flex;
 
+    align-items: center;
 
+    justify-content: space-between;
 
+    span {
 
+      padding-bottom: 0;
 
+    }
 
+
 
+    .slider-box {
 
+      cursor: pointer;
 
+    }
 
+  }
 
+
 
+  .n-input {
 
+    border-radius: 6px !important;
 
+    .n-input-wrapper {
 
+      padding-bottom: 18px !important;
 
+    }
 
+  }
 
+}
 
+
 
+.submitBtn {
 
+  margin-top: 30px;
 
+  margin-bottom: 20px;
 
+  background: #198cfe;
 
+  border-radius: 8px;
 
+  font-weight: 600;
 
+  font-size: 18px;
 
+  color: #ffffff;
 
+  line-height: 47px;
 
+  text-align: center;
 
+  cursor: pointer;
 
+
 
+  &.disabled {
 
+    opacity: 0.7;
 
+    cursor: not-allowed;
 
+  }
 
+}
 
+</style>
 
+<style lang="scss">
 
+.notice-content {
 
+  .n-input .n-input-wrapper {
 
+    padding-bottom: 18px !important;
 
+  }
 
+}
 
+
 
+.popoverContainer {
 
+  background: #ffffff;
 
+  box-shadow: 0px 2px 17px 0px rgba(0, 0, 0, 0.08) !important;
 
+  border-radius: 12px !important;
 
+  padding: 8px !important;
 
+  margin-top: 8px !important;
 
+
 
+  .p-item {
 
+    margin-bottom: 8px;
 
+    font-size: 16px;
 
+    color: #131415;
 
+    border-radius: 8px;
 
+    padding: 12px 0;
 
+    text-align: center;
 
+    cursor: pointer;
 
+    &:hover {
 
+      background: #f3f3f5;
 
+    }
 
+    &:last-child {
 
+      margin-bottom: 0;
 
+    }
 
+    &.p-red {
 
+      color: #f44541;
 
+    }
 
+  }
 
+}
 
+.toolsNotifi .n-popover__content {
 
+  color: #fff !important;
 
+}
 
+
 
+.notificationBtn .n-button__content {
 
+  color: #ffffff;
 
+}
 
+</style>

+ 519 - 99
src/TUIKit/TUIComponents/container/TUIChat/manage-components/manage-notification.vue
View File 

@@ -1,32 +1,171 @@
 
 <template>
 
 <template>
 
-  <main class="notification">
 
-    <input v-if="isEdit" type="text" v-model="title" placeholder="请输入标题" maxlength="15" />
 
-    <textarea v-if="isEdit" v-model="input" @keyup.enter="updateProfile" placeholder="请输入内容"></textarea>
 
-    <section v-else>
 
-      <p v-if="!groupList.content">
 
-        {{ $t(`TUIChat.manage.暂无公告`) }}
 
-      </p>
 
-      <article v-else>
 
-        <h2>{{ groupList.title }}</h2>
 
-        {{ groupList.content }}
 
-      </article>
 
-    </section>
 
-    <footer v-if="isAuth">
 
-      <button class="btn" v-if="isEdit" @click="updateProfile">
 
-        {{ $t(`TUIChat.manage.发布`) }}
 
-      </button>
 
-      <button class="btn" v-else @click="isEdit = !isEdit">
 
-        {{ $t(`TUIChat.manage.编辑`) }}
 
-      </button>
 
-    </footer>
 
+  <main :class="['notification', isEdit ? 'overflowHidden' : '']">
 
+    <div class="section">
 
+      <div class="section-item" v-for="(item, index) in groupList" :key="index">
 
+        <div class="userInfo">
 
+          <img class="img" :src="item.avatar" />
 
+
 
+          <div class="username">
 
+            <div class="users">
 
+              <span class="name">{{ item.username }}</span>
 
+            </div>
 
+            <div class="userTime">
 
+              <span class="time">{{ item.createTime }}</span>
 
+              <span class="tag" v-if="item.isTop">置顶</span>
 
+            </div>
 
+          </div>
 
+
 
+          <n-popover
 
+            v-if="isAuth"
 
+            trigger="click"
 
+            ref="popoverRef"
 
+            :to="false"
 
+            placement="bottom-end"
 
+            width="160px"
 
+            :show-arrow="false"
 
+            class="popoverContainer"
 
+          >
 
+            <template #trigger>
 
+              <i class="iconMorePoint iconMore"></i>
 
+            </template>
 
+            <div class="p-list">
 
+              <div class="p-item" @click="onOperation(item, 'edit', index)">
 
+                编辑公告
 
+              </div>
 
+              <div class="p-item" @click="onOperation(item, 'top', index)">
 
+                设为置顶
 
+              </div>
 
+              <div
 
+                class="p-item p-red"
 
+                @click="onOperation(item, 'delete', index)"
 
+              >
 
+                删除公告
 
+              </div>
 
+            </div>
 
+          </n-popover>
 
+        </div>
 
+
 
+        <div class="section-content">
 
+          <h2>{{ item.title }}</h2>
 
+          <div class="content">
 
+            {{ item.content }}
 
+          </div>
 
+        </div>
 
+      </div>
 
+
 
+      <div class="list-item" v-if="groupList.length < total" @click="onMore">
 
+        查看更多
 
+      </div>
 
+    </div>
 
+    <div class="theEmpty" v-if="!loading && groupList.length <= 0">
 
+      <img class="emptyImg" src="../../../assets/nomore.png" />
 
+      <p>暂无群公告</p>
 
+      <n-button
 
+        round
 
+        type="info"
 
+        class="notificationBtn"
 
+        @click="onOperation({}, 'add')"
 
+        >发布公告</n-button
 
+      >
 
+    </div>
 
+
 
+    <n-tooltip
 
+      trigger="hover"
 
+      :show-arrow="false"
 
+      class="toolsNotifi"
 
+      v-if="groupList.length > 0 && !isEdit"
 
+    >
 
+      <template #trigger>
 
+        <div class="iconNotifiAdd" @click="onOperation({}, 'add')"></div>
 
+      </template>
 
+      发布公告
 
+    </n-tooltip>
 
+
 
+    <div class="edit-notification" v-if="isEdit">
 
+      <div class="input-section">
 
+        <div class="input-title">
 
+          <i class="iconNotifit1"></i>
 
+          <span>公告标题</span>
 
+        </div>
 
+        <div class="input-content">
 
+          <n-input
 
+            v-model:value="title"
 
+            style="
 
+              --n-caret-color: #198cfe;
 
+              --n-border-hover: 1px solid #198cfe;
 
+              --n-border-focus: 1px solid #198cfe;
 
+              --n-loading-color: #198cfe;
 
+              --n-box-shadow-focus: 0 0 0 2px rgba(25 140 254, 0.2);
 
+            "
 
+            type="textarea"
 
+            placeholder="请输入公告标题"
 
+            show-count
 
+            :maxlength="50"
 
+          />
 
+        </div>
 
+      </div>
 
+
 
+      <div class="input-section">
 
+        <div class="input-title">
 
+          <i class="iconNotifit2"></i>
 
+          <span>公告内容</span>
 
+        </div>
 
+        <div class="input-content notice-content">
 
+          <n-input
 
+            v-model:value="input"
 
+            style="
 
+              --n-caret-color: #198cfe;
 
+              --n-border-hover: 1px solid #198cfe;
 
+              --n-border-focus: 1px solid #198cfe;
 
+              --n-loading-color: #198cfe;
 
+              --n-box-shadow-focus: 0 0 0 2px rgba(25 140 254, 0.2);
 
+            "
 
+            type="textarea"
 
+            placeholder="请输入公告内容"
 
+            :rows="10"
 
+            show-count
 
+            :maxlength="200"
 
+          />
 
+        </div>
 
+      </div>
 
+      <div class="input-section">
 
+        <div class="input-title input-slider">
 
+          <span>设置为置顶</span>
 
+
 
+          <Slider :open="isTop" @change="onIsTop" />
 
+        </div>
 
+      </div>
 
+      <div
 
+        :class="['submitBtn', !title || !input ? 'disabled' : '']"
 
+        @click="onSubmit"
 
+      >
 
+        发布
 
+      </div>
 
+    </div>
 
   </main>
 
   </main>
 
 </template>
 
 </template>
 
 
 
 <script lang="ts">
 
 <script lang="ts">
 
-import { defineComponent, watchEffect, reactive, toRefs, onMounted } from "vue";
 
-import { imGroupNoticePage, imGroupNoticeSave, imGroupNoticeUpdate } from "../../../../api";
 
-
 
+import {
 
+  defineComponent,
 
+  watchEffect,
 
+  reactive,
 
+  toRefs,
 
+  onMounted,
 
+  ref,
 
+} from "vue";
 
+import {
 
+  imGroupNoticePage,
 
+  imGroupNoticeSave,
 
+  imGroupNoticeUpdate,
 
+  imGroupNoticeRemove,
 
+} from "../../../../api";
 
+import Slider from "../../../components/sliderTUI/index.vue";
 
+import TUIMessage from "../../../components/messageTUI/index";
 
 const ManageNotification = defineComponent({
 
 const ManageNotification = defineComponent({
 
+  components: {
 
+    Slider,
 
+  },
 
   props: {
 
   props: {
 
     data: {
 
     data: {
 
       type: Object,
 
       type: Object,
 
@@ -40,28 +179,41 @@ const ManageNotification = defineComponent({
 
   setup(props: any, ctx: any) {
 
   setup(props: any, ctx: any) {
 
     const data: any = reactive({
 
     const data: any = reactive({
 
       groupProfile: {},
 
       groupProfile: {},
 
+      total: 0,
 
+      id: "",
 
       title: "",
 
       title: "",
 
       input: "",
 
       input: "",
 
-      groupList: {},
 
+      isTop: true, // 是否置顶
 
+      loading: false,
 
+      groupList: [],
 
       isEdit: false,
 
       isEdit: false,
 
+      page: 1,
 
+      rows: 20,
 
     });
 
     });
 
+    const popoverRef: any = ref();
 
     const getNotification = async () => {
 
     const getNotification = async () => {
 
+      data.loading = true;
 
       try {
 
       try {
 
         // 获取群公告
 
         // 获取群公告
 
         let res = await imGroupNoticePage({
 
         let res = await imGroupNoticePage({
 
-          groupId: data.groupProfile.groupID,
 
-          page: 1,
 
-          rows: 1,
 
+          imGroupId: data.groupProfile.groupID,
 
+          page: data.page,
 
+          rows: data.rows,
 
         });
 
         });
 
         const result = res.data.rows || [];
 
         const result = res.data.rows || [];
 
+        data.total = res.data.total || 0;
 
         if (result.length > 0) {
 
         if (result.length > 0) {
 
-          data.input = result[0].content;
 
-          data.title = result[0].title;
 
-          data.groupList = result[0];
 
+          data.groupList = [...data.groupList, ...result];
 
         }
 
         }
 
       } catch (e: any) {
 
       } catch (e: any) {
 
         //
 
         //
 
       }
 
       }
 
+      data.loading = false;
 
+    };
 
+
 
+    const onMore = () => {
 
+      if(data.loading) return
 
+      data.page = data.page + 1;
 
     };
 
     };
 
 
 
     watchEffect(() => {
 
     watchEffect(() => {
 
@@ -71,44 +223,109 @@ const ManageNotification = defineComponent({
 
       getNotification();
 
       getNotification();
 
     });
 
     });
 
 
 
-    // 更新群资料
 
-    const updateProfile = async () => {
 
-      if (data.title && data.input) {
 
-        // ctx.emit("update", { key: "notification", value: data.input });
 
-        // data.groupProfile.notification = data.input;
 
-        // data.input = "";
 
-        try {
 
-          const params = {
 
-            clientType: "TEACHER",
 
-            groupId: data.groupProfile.groupID,
 
+
 
+
 
+    const onOperation = async (item: any, type: string, index?: number) => {
 
+      try {
 
+        if (type === "edit") {
 
+          data.isEdit = true;
 
+          data.title = item.title;
 
+          data.input = item.content;
 
+          data.isTop = item.isTop;
 
+          data.id = item.id;
 
+        } else if (type === "top") {
 
+          await imGroupNoticeUpdate({
 
+            imGroupId: data.groupProfile.groupID,
 
+            isTop: true,
 
+            id: item.id,
 
+          });
 
+          data.page = 1;
 
+          data.groupList = [];
 
+          getNotification();
 
+        } else if (type === "delete") {
 
+          await imGroupNoticeRemove({
 
+            id: item.id,
 
+          });
 
+          data.page = 1;
 
+          data.groupList = [];
 
+          getNotification();
 
+        } else if (type === "add") {
 
+          data.isEdit = true;
 
+          data.title = "";
 
+          data.input = "";
 
+          data.isTop = true;
 
+          data.id = "";
 
+          ctx.emit("changeStatus", "add");
 
+        }
 
+      } catch(e) {
 
+        //
 
+        TUIMessage({
 
+          message: e.message,
 
+          isH5: false,
 
+          type: "error",
 
+        });
 
+      }
 
+      popoverRef.value[index]?.setShow(false);
 
+    };
 
+
 
+    const onSubmit = async () => {
 
+      if (!data.title || !data.input) {
 
+        return;
 
+      }
 
+      try {
 
+        //
 
+        if (data.id) {
 
+          await imGroupNoticeUpdate({
 
+            imGroupId: data.groupProfile.groupID,
 
+            isTop: data.isTop,
 
+            title: data.title,
 
             content: data.input,
 
             content: data.input,
 
+            id: data.id,
 
+          });
 
+        } else {
 
+          await imGroupNoticeSave({
 
+            imGroupId: data.groupProfile.groupID,
 
             title: data.title,
 
             title: data.title,
 
-          };
 
-          if (data.groupList.id) {
 
-            await imGroupNoticeUpdate({
 
-              ...params,
 
-              id: data.groupList.id,
 
-            });
 
-          } else {
 
-            await imGroupNoticeSave(params);
 
-          }
 
-          data.groupList.content = data.input;
 
-          ctx.emit("update", { key: "notification", value: data.title });
 
-          data.groupProfile.notification = data.title;
 
-          data.groupList.content = data.input;
 
-          data.groupList.title = data.title;
 
-          data.input = "";
 
-          getNotification();
 
-        } catch {
 
-          //
 
+            content: data.input,
 
+            isTop: data.isTop,
 
+          });
 
         }
 
         }
 
+
 
+        data.isEdit = false;
 
+        ctx.emit("changeStatus", "submit");
 
+        data.page = 1;
 
+        data.groupList = [];
 
+        getNotification();
 
+      } catch(e) {
 
+        //
 
+        TUIMessage({
 
+          message: e.message,
 
+          isH5: false,
 
+          type: "error",
 
+        });
 
       }
 
       }
 
-      data.isEdit = !data.isEdit;
 
     };
 
     };
 
 
 
+    const onIsTop = (val: any) => {
 
+      data.isTop = val
 
+    }
 
+
 
+    const onCloseEdit = () => {
 
+      data.isEdit = false;
 
+    };
 
+
 
+    ctx.expose({
 
+      onCloseEdit,
 
+    });
 
+
 
     return {
 
     return {
 
       ...toRefs(data),
 
       ...toRefs(data),
 
-      updateProfile,
 
+      popoverRef,
 
+      onMore,
 
+      onIsTop,
 
+      // updateProfile,
 
+      onOperation,
 
+      onSubmit,
 
     };
 
     };
 
   },
 
   },
 
 });
 
 });
 
@@ -119,61 +336,264 @@ export default ManageNotification;
 
 @import url("../../../styles/common.scss");
 
 @import url("../../../styles/common.scss");
 
 @import url("../../../styles/icon.scss");
 
 @import url("../../../styles/icon.scss");
 
 .notification {
 
 .notification {
 
+  position: relative;
 
   flex: 1;
 
   flex: 1;
 
-  padding: 20px;
 
+  background: #ffffff;
 
+    overflow-y: auto;
 
+    overflow-x: hidden;
 
+    height: 100%;
 
+  // padding: 20px;
 
   display: flex;
 
   display: flex;
 
   flex-direction: column;
 
   flex-direction: column;
 
-  section {
 
-    flex: 1;
 
-    font-size: 14px;
 
-    word-wrap: break-word;
 
-    word-break: break-word;
 
-    p {
 
-      text-align: center;
 
-      padding-bottom: 20px;
 
+  background: #f8f9fc;
 
+
 
+  &.overflowHidden {
 
+    overflow: hidden;
 
+  }
 
+}
 
+
 
+.list-item {
 
+  padding: 13px;
 
+  align-items: center;
 
+  font-size: 14px;
 
+  overflow: hidden;
 
+  text-align: center;
 
+  cursor: pointer;
 
+}
 
+
 
+.section-item {
 
+  background: #fff;
 
+  padding: 20px;
 
+  margin-bottom: 8px;
 
+  .userInfo {
 
+    position: relative;
 
+    display: flex;
 
+    align-items: center;
 
+    border-bottom: 1px solid #f2f2f2;
 
+    padding-bottom: 16px;
 
+    margin-bottom: 16px;
 
+
 
+    .img {
 
+      width: 45px;
 
+      height: 45px;
 
+      border-radius: 6px;
 
+      margin-right: 10px;
 
+    }
 
+
 
+    .iconMore {
 
+      width: 23px;
 
+      height: 17px;
 
+      position: absolute;
 
+      right: 0;
 
+      top: 5px;
 
+      cursor: pointer;
 
     }
 
     }
 
   }
 
   }
 
-  textarea {
 
-    margin-bottom: 20px;
 
-    flex: 1;
 
-    box-sizing: border-box;
 
-    padding: 10px;
 
-    border: 1px solid #e8e8e9;
 
-    resize: none;
 
-    font-size: 14px;
 
+  .users {
 
+    display: flex;
 
+    align-items: center;
 
+    .name {
 
+      font-weight: 600;
 
+      font-size: 16px;
 
+      color: #333333;
 
+      line-height: 22px;
 
+    }
 
+    .tag {
 
+      margin-left: 5px;
 
+      font-weight: 400;
 
+      font-size: 12px;
 
+      line-height: 17px;
 
+      color: #2089ff;
 
+      background: #e8f4ff;
 
+      border-radius: 3px;
 
+      border: 1px solid rgba(25, 140, 254, 0.5);
 
+      padding: 0 4px;
 
+    }
 
+  }
 
+  .userTime {
 
+    .time {
 
+      font-size: 13px;
 
+      color: #777777;
 
+      line-height: 18px;
 
+    }
 
+    .tag {
 
+      font-size: 12px;
 
+      color: #f44541;
 
+      line-height: 17px;
 
+      border-radius: 10px;
 
+      border: 1px solid #f44541;
 
+      padding: 0 8px;
 
+      border-radius: 20px;
 
+      margin-left: 6px;
 
+    }
 
+  }
 
+
 
+  .section-content {
 
+    h2 {
 
+      font-weight: 600;
 
+      font-size: 16px;
 
+      color: #333333;
 
+      line-height: 24px;
 
+      word-wrap: break-word;
 
+      word-break: break-all;
 
+    }
 
+    .content {
 
+      font-size: 16px;
 
+      color: #777777;
 
+      line-height: 24px;
 
+      word-wrap: break-word;
 
+      word-break: break-all;
 
+    }
 
+  }
 
+}
 
+
 
+.iconNotifiAdd {
 
+  position: fixed;
 
+  bottom: 24px;
 
+  right: 16px;
 
+  width: 58px;
 
+  height: 58px;
 
+}
 
+
 
+.theEmpty {
 
+  width: 100%;
 
+  display: flex;
 
+  justify-content: center;
 
+  align-items: center;
 
+  flex-direction: column;
 
+  flex: 1;
 
+  background: #fff;
 
+  padding-bottom: 40px;
 
+
 
+  .emptyImg {
 
+    width: 210px;
 
+    height: 210px;
 
   }
 
   }
 
 
 
-  input {
 
-    margin-bottom: 20px;
 
-    padding: 10px;
 
-    border: 1px solid #e8e8e9;
 
-    resize: none;
 
-    font-size: 14px;
 
+  p {
 
+    font-size: 16px;
 
+    color: #aaaaaa;
 
+    line-height: 22px;
 
+  }
 
+}
 
+
 
+.notificationBtn {
 
+  margin-top: 10px;
 
+}
 
+
 
+.edit-notification {
 
+  position: fixed;
 
+  width: 360px;
 
+  height: calc(100% - 109Px);
 
+  top: 109Px;
 
+  right: 0;
 
+  z-index: 9;
 
+  background: #fff;
 
+  padding: 0 20px;
 
+  overflow-x: hidden;
 
+  overflow-y: auto;
 
+
 
+  .input-section {
 
+    padding-top: 20px;
 
   }
 
   }
 
 
 
-  h2 {
 
+  .input-title {
 
+    display: flex;
 
+    align-items: center;
 
     font-size: 16px;
 
     font-size: 16px;
 
+    color: #333333;
 
+    line-height: 22px;
 
+    padding-bottom: 10px;
 
+    .iconNotifit1,
 
+    .iconNotifit2 {
 
+      width: 22px;
 
+      height: 22px;
 
+      margin-right: 6px;
 
+      flex-shrink: 0;
 
+    }
 
+    span {
 
+      line-height: 1;
 
+      padding-bottom: 4px;
 
+    }
 
   }
 
   }
 
 
 
-  footer {
 
+  .input-slider {
 
     display: flex;
 
     display: flex;
 
-    justify-content: flex-end;
 
-    padding: 10px;
 
+    align-items: center;
 
+    justify-content: space-between;
 
+    span {
 
+      padding-bottom: 0;
 
+    }
 
+
 
+    .slider-box {
 
+      cursor: pointer;
 
+    }
 
+  }
 
+
 
+  .n-input {
 
+    border-radius: 6px !important;
 
+    .n-input-wrapper {
 
+      padding-bottom: 18px !important;
 
+    }
 
   }
 
   }
 
 }
 
 }
 
-.btn {
 
-  background: #3370ff;
 
-  border: 0 solid #2f80ed;
 
-  padding: 4px 28px;
 
-  font-weight: 400;
 
-  font-size: 12px;
 
+
 
+.submitBtn {
 
+  margin-top: 30px;
 
+  margin-bottom: 20px;
 
+  background: #198cfe;
 
+  border-radius: 8px;
 
+  font-weight: 600;
 
+  font-size: 18px;
 
   color: #ffffff;
 
   color: #ffffff;
 
-  line-height: 24px;
 
-  border-radius: 4px;
 
-  &-cancel {
 
-    background: #ffffff;
 
-    border: 1px solid #dddddd;
 
-    color: #828282;
 
+  line-height: 47px;
 
+  text-align: center;
 
+  cursor: pointer;
 
+
 
+  &.disabled {
 
+    opacity: 0.7;
 
+    cursor: not-allowed;
 
+  }
 
+}
 
+</style>
 
+<style lang="scss">
 
+.notice-content {
 
+  .n-input .n-input-wrapper {
 
+    padding-bottom: 18px !important;
 
   }
 
   }
 
 }
 
 }
 
+
 
+.popoverContainer {
 
+  background: #ffffff;
 
+  box-shadow: 0px 2px 17px 0px rgba(0, 0, 0, 0.08) !important;
 
+  border-radius: 12px !important;
 
+  padding: 8px !important;
 
+  margin-top: 8px !important;
 
+
 
+  .p-item {
 
+    margin-bottom: 8px;
 
+    font-size: 16px;
 
+    color: #131415;
 
+    border-radius: 8px;
 
+    padding: 12px 0;
 
+    text-align: center;
 
+    cursor: pointer;
 
+    &:hover {
 
+      background: #f3f3f5;
 
+    }
 
+    &:last-child {
 
+      margin-bottom: 0;
 
+    }
 
+    &.p-red {
 
+      color: #f44541;
 
+    }
 
+  }
 
+}
 
+.toolsNotifi .n-popover__content {
 
+  color: #fff !important;
 
+}
 
+
 
+.notificationBtn .n-button__content {
 
+  color: #ffffff;
 
+}
 
 </style>
 
 </style>

+ 82 - 22
src/TUIKit/TUIComponents/container/TUIChat/manage-components/manage.vue
View File 

@@ -1,13 +1,16 @@
 
 <template>
 
 <template>
 
   <div>
 
   <div>
 
-    <i class="icon icon-chat-setting" v-if="platform != 'daya'" @click="toggleShow"></i>
 
+    <i class="icon icon-chat-setting" v-if="platform == 'daya'" @click="toggleShow"></i>
 
     <div class="manage" :class="[isH5 ? 'manage-h5' : '']" v-if="show" ref="dialog">
 
     <div class="manage" :class="[isH5 ? 'manage-h5' : '']" v-if="show" ref="dialog">
 
       <header class="manage-header">
 
       <header class="manage-header">
 
         <i class="icon icon-back" v-if="isH5 && !currentTab" @click="toggleShow"></i>
 
         <i class="icon icon-back" v-if="isH5 && !currentTab" @click="toggleShow"></i>
 
         <aside class="manage-header-left">
 
         <aside class="manage-header-left">
 
-          <i class="icon icon-back" v-if="currentTab" @click="setTab('')"></i>
 
-          <main>
 
-            <h1>{{ $t(`TUIChat.manage.${TabName}`) }}</h1>
 
+          <i class="icon icon-back" v-if="currentTab" @click="() =>{
 
+            currentModel = 'not_mute'
 
+            setTab('')
 
+          }"></i>
 
+          <main v-if="currentTab !== 'onlyMute'">
 
+            <h1>{{ TabName }} <span v-if="currentTab === 'member'"> {{ groupDetail.memberNum || 0 }}{{ $t(`TUIChat.manage.人`) }} </span></h1>
 
           </main>
 
           </main>
 
         </aside>
 
         </aside>
 
         <span>
 
         <span>
 
@@ -16,7 +19,7 @@
 
       </header>
 
       </header>
 
       <main class="main" style="background-color: #f4f5f9; height: 100%" v-if="!currentTab">
 
       <main class="main" style="background-color: #f4f5f9; height: 100%" v-if="!currentTab">
 
         <ManageName class="space-top" :isAuth="isAuth" :isH5="isH5" :data="conversation.groupProfile" @update="updateProfile" style="background-color: #fff" />
 
         <ManageName class="space-top" :isAuth="isAuth" :isH5="isH5" :data="conversation.groupProfile" @update="updateProfile" style="background-color: #fff" />
 
-        <div class="userInfo space-top" style="background-color: #fff">
 
+        <!-- <div class="userInfo space-top" style="background-color: #fff">
 
           <header class="userInfo-header" @click="setTab('member')">
 
           <header class="userInfo-header" @click="setTab('member')">
 
             <label>{{ $t(`TUIChat.manage.群成员`) }}</label>
 
             <label>{{ $t(`TUIChat.manage.群成员`) }}</label>
 
             <p>
 
             <p>
 
@@ -25,22 +28,17 @@
 
             </p>
 
             </p>
 
           </header>
 
           </header>
 
           <ol>
 
           <ol>
 
-            <!-- @click="handleMemberProfileShow(item)" -->
 
             <dl v-for="(item, index) in userInfo?.list?.slice(0, showUserNum)" :key="index">
 
             <dl v-for="(item, index) in userInfo?.list?.slice(0, showUserNum)" :key="index">
 
               <dt>
 
               <dt>
 
-                <img class="avatar" :src="item?.avatar || 'https://news-info.ks3-cn-beijing.ksyuncs.com/07/1690787574969.png'" onerror="this.src='https://news-info.ks3-cn-beijing.ksyuncs.com/07/1690787574969.png'" />
 
+                <img class="avatar" :src="item?.avatar || 'https://oss.dayaedu.com/news-info/07/1690787574969.png'" onerror="this.src='https://oss.dayaedu.com/news-info/07/1690787574969.png'" />
 
               </dt>
 
               </dt>
 
               <dd>{{ item?.nickname || item?.userID }}</dd>
 
               <dd>{{ item?.nickname || item?.userID }}</dd>
 
             </dl>
 
             </dl>
 
-            <!-- v-if="isShowAddMember" -->
 
             <dl v-if="currentUserDetail.groupRoleType === 'Owner'">
 
             <dl v-if="currentUserDetail.groupRoleType === 'Owner'">
 
               <dt class="avatar" @click="toggleMask('add')">+</dt>
 
               <dt class="avatar" @click="toggleMask('add')">+</dt>
 
             </dl>
 
             </dl>
 
-            <!-- <dl v-if="conversation.groupProfile.selfInfo.role === 'Owner'">
 
-              <dt class="avatar" @click="toggleMask('remove')">-</dt>
 
-            </dl> -->
 
           </ol>
 
           </ol>
 
-        </div>
 
+        </div> -->
 
         <ul class="content space-top" @click="editLableName = ''" style="background-color: #fff">
 
         <ul class="content space-top" @click="editLableName = ''" style="background-color: #fff">
 
           <li @click.stop="setTab('notification')">
 
           <li @click.stop="setTab('notification')">
 
             <aside>
 
             <aside>
 
@@ -70,9 +68,9 @@
 
               class="avatar"
 
               class="avatar"
 
               :src="
 
               :src="
 
                 conversation?.groupProfile?.avatar ||
 
                 conversation?.groupProfile?.avatar ||
 
-                'https://news-info.ks3-cn-beijing.ksyuncs.com/07/1690775328089.png'
 
+                'https://oss.dayaedu.com/news-info/07/1690775328089.png'
 
               "
 
               "
 
-              onerror="this.src='https://news-info.ks3-cn-beijing.ksyuncs.com/07/1690775328089.png'"
 
+              onerror="this.src='https://oss.dayaedu.com/news-info/07/1690775328089.png'"
 
             />
 
             />
 
           </li>
 
           </li>
 
           <li>
 
           <li>
 
@@ -97,7 +95,7 @@
 
           </li> -->
 
           </li> -->
 
         </ul>
 
         </ul>
 
 
 
-        <div v-if="currentUserDetail.groupRoleType === 'Owner'" class="admin-content space-top" style="background-color: #fff; padding-top: 12px">
 
+       <!-- <div v-if="currentUserDetail.groupRoleType === 'Owner'" class="admin-content space-top" style="background-color: #fff; padding-top: 12px">
 
           <aside>
 
           <aside>
 
             <label>学生禁言</label>
 
             <label>学生禁言</label>
 
           </aside>
 
           </aside>
 
@@ -107,19 +105,20 @@
 
           <li v-if="currentUserDetail.groupRoleType === 'Owner' && userInfo?.list.length > 1" @click.stop="toggleMask('changeOwner')">移交群主</li>
 
           <li v-if="currentUserDetail.groupRoleType === 'Owner' && userInfo?.list.length > 1" @click.stop="toggleMask('changeOwner')">移交群主</li>
 
           <li v-if="currentUserDetail.groupRoleType === 'Owner'" @click.stop="dismiss(conversation.groupProfile)">解散群聊</li>
 
           <li v-if="currentUserDetail.groupRoleType === 'Owner'" @click.stop="dismiss(conversation.groupProfile)">解散群聊</li>
 
           <li v-else @click.stop="quit(conversation.groupProfile)">退出群组</li>
 
           <li v-else @click.stop="quit(conversation.groupProfile)">退出群组</li>
 
-        </ul>
 
+        </ul>-->
 
       </main>
 
       </main>
 
       <ManageMember v-else-if="currentTab === 'member'" :self="conversation.groupProfile.selfInfo" :list="userInfo.list" :total="~~conversation.groupProfile.memberCount" @more="getMember('more')" @del="submit" @handleMemberProfileShow="handleMemberProfileShow" />
 
       <ManageMember v-else-if="currentTab === 'member'" :self="conversation.groupProfile.selfInfo" :list="userInfo.list" :total="~~conversation.groupProfile.memberCount" @more="getMember('more')" @del="submit" @handleMemberProfileShow="handleMemberProfileShow" />
 
       <!-- :isShowDel="conversation.groupProfile.selfInfo.role === 'Owner'" -->
 
       <!-- :isShowDel="conversation.groupProfile.selfInfo.role === 'Owner'" -->
 
       <MemeberProfile v-else-if="currentTab === 'profile'" :userInfo="currentMember" />
 
       <MemeberProfile v-else-if="currentTab === 'profile'" :userInfo="currentMember" />
 
-      <ManageNotification v-else-if="currentTab === 'notification'" :isAuth="isAuth" :data="conversation.groupProfile" @update="updateProfile" />
 
+      <ManageNotification ref="manageNotificationRef" v-else-if="currentTab === 'notification' || currentTab === 'notificationAdd' || currentTab === 'notificationUpdate'" :isAuth="isAuth" :data="conversation.groupProfile" @update="updateProfile" @changeStatus="onNotificationChangeStatus" />
 
+      <ManageNotificationDetail ref="manageNotificationDetailRef" v-else-if="currentTab === 'notificationDetail' || currentTab === 'notificationAddDetail' || currentTab === 'notificationUpdateDetail'" :noticeId="noticeId" :isAuth="isAuth" :data="conversation.groupProfile" @changeStatus="onNotificationChangeStatus" />
 
       <main class="admin" v-else-if="currentTab === 'admin'">
 
       <main class="admin" v-else-if="currentTab === 'admin'">
 
         <div class="admin-list" v-if="isAdmin">
 
         <div class="admin-list" v-if="isAdmin">
 
           <label>{{ $t(`TUIChat.manage.群管理员`) }}</label>
 
           <label>{{ $t(`TUIChat.manage.群管理员`) }}</label>
 
           <ol>
 
           <ol>
 
             <dl v-for="(item, index) in member.admin" :key="index">
 
             <dl v-for="(item, index) in member.admin" :key="index">
 
               <dt>
 
               <dt>
 
-                <img class="avatar" :src="item?.avatar || 'https://news-info.ks3-cn-beijing.ksyuncs.com/07/1690787574969.png'" onerror="this.src='https://news-info.ks3-cn-beijing.ksyuncs.com/07/1690787574969.png'" />
 
+                <img class="avatar" :src="item?.avatar || 'https://oss.dayaedu.com/news-info/07/1690787574969.png'" onerror="this.src='https://oss.dayaedu.com/news-info/07/1690787574969.png'" />
 
               </dt>
 
               </dt>
 
               <dd>{{ item?.nick || item?.userID }}</dd>
 
               <dd>{{ item?.nick || item?.userID }}</dd>
 
             </dl>
 
             </dl>
 
@@ -145,7 +144,7 @@
 
           <ol>
 
           <ol>
 
             <dl v-for="(item, index) in member.muteMember" :key="index">
 
             <dl v-for="(item, index) in member.muteMember" :key="index">
 
               <dt>
 
               <dt>
 
-                <img class="avatar" :src="item?.avatar || 'https://news-info.ks3-cn-beijing.ksyuncs.com/07/1690787574969.png'" onerror="this.src='https://news-info.ks3-cn-beijing.ksyuncs.com/07/1690787574969.png'" />
 
+                <img class="avatar" :src="item?.avatar || 'https://oss.dayaedu.com/news-info/07/1690787574969.png'" onerror="this.src='https://oss.dayaedu.com/news-info/07/1690787574969.png'" />
 
               </dt>
 
               </dt>
 
               <dd>{{ item?.nick || item?.userID }}</dd>
 
               <dd>{{ item?.nick || item?.userID }}</dd>
 
             </dl>
 
             </dl>
 
@@ -189,6 +188,7 @@ import Transfer from "../../../components/transferTUI/index.vue";
 
 import Slider from "../../../components/sliderTUI/index.vue";
 
 import Slider from "../../../components/sliderTUI/index.vue";
 
 import ManageName from "./manage-name.vue";
 
 import ManageName from "./manage-name.vue";
 
 import ManageNotification from "./manage-notification.vue";
 
 import ManageNotification from "./manage-notification.vue";
 
+import ManageNotificationDetail from "./manage-notification-detail.vue";
 
 import ManageMember from "./manage-member.vue";
 
 import ManageMember from "./manage-member.vue";
 
 import MemeberProfile from "./member-profile.vue";
 
 import MemeberProfile from "./member-profile.vue";
 
 import DialogTUI from "../../../components/dialogTUi/index.vue";
 
 import DialogTUI from "../../../components/dialogTUi/index.vue";
 
@@ -205,6 +205,7 @@ const manage = defineComponent({
 
     Slider,
 
     Slider,
 
     ManageName,
 
     ManageName,
 
     ManageNotification,
 
     ManageNotification,
 
+    ManageNotificationDetail,
 
     ManageMember,
 
     ManageMember,
 
     MemeberProfile,
 
     MemeberProfile,
 
     DialogTUI,
 
     DialogTUI,
 
@@ -245,6 +246,7 @@ const manage = defineComponent({
 
       editLableName: "",
 
       editLableName: "",
 
       mask: false,
 
       mask: false,
 
       currentTab: "",
 
       currentTab: "",
 
+      noticeId: "", // 查看公告详情时
 
       transferType: "",
 
       transferType: "",
 
       isSearch: false,
 
       isSearch: false,
 
       isRadio: false,
 
       isRadio: false,
 
@@ -280,6 +282,8 @@ const manage = defineComponent({
 
     });
 
     });
 
 
 
     const dialog: any = ref();
 
     const dialog: any = ref();
 
+    const manageNotificationRef: any = ref()
 
+    const manageNotificationDetailRef: any = ref()
 
 
 
     watchEffect(() => {
 
     watchEffect(() => {
 
       data.conversation = props.conversation;
 
       data.conversation = props.conversation;
 
@@ -295,7 +299,18 @@ const manage = defineComponent({
 
         case "notification":
 
         case "notification":
 
           name = "群公告";
 
           name = "群公告";
 
           break;
 
           break;
 
-        case "member":
 
+        case "notificationAdd":
 
+          case "notificationAddDetail":
 
+          name = '添加群公告';
 
+          break;
 
+        case "notificationUpdate":
 
+        case "notificationUpdateDetail":
 
+          name = '修改群公告';
 
+          break;
 
+        case "notificationDetail":
 
+          name = "公告详情";
 
+          break;
 
+         case "member":
 
           name = "群成员";
 
           name = "群成员";
 
           break;
 
           break;
 
         case "profile":
 
         case "profile":
 
@@ -558,6 +573,25 @@ const manage = defineComponent({
 
       data.editLableName = labelName;
 
       data.editLableName = labelName;
 
     };
 
     };
 
 
 
+    /** 群公告修改 */
 
+    const onNotificationChangeStatus = (type: string) => {
 
+      if(type === "add") {
 
+        data.currentTab = 'notificationAdd'
 
+      } else if(type === "edit") {
 
+        data.currentTab = 'notificationUpdate'
 
+      } else if(type === "submit") {
 
+        data.currentTab = 'notification'
 
+      } else if(type === "addDetail") {
 
+        data.currentTab = 'notificationAddDetail'
 
+      } else if(type === "editDetail") {
 
+        data.currentTab = 'notificationUpdateDetail'
 
+      } else if(type === "submitDetail") {
 
+        data.currentTab = 'notificationDetail'
 
+      } else if(type === "deleteDetail") {
 
+        data.currentTab = ""
 
+      }
 
+    }
 
+
 
     const updateProfile = async (params: any) => {
 
     const updateProfile = async (params: any) => {
 
       const { key, value } = params;
 
       const { key, value } = params;
 
       const options: any = {
 
       const options: any = {
 
@@ -573,6 +607,20 @@ const manage = defineComponent({
 
     };
 
     };
 
 
 
     const setTab = (tabName: string) => {
 
     const setTab = (tabName: string) => {
 
+      if(data.currentTab === "notificationAdd" || data.currentTab === "notificationUpdate") {
 
+        manageNotificationRef.value?.onCloseEdit()
 
+        data.currentTab = 'notification'
 
+        return
 
+      }
 
+      if(data.currentTab === "notificationAddDetail" || data.currentTab === "notificationUpdateDetail") {
 
+        manageNotificationDetailRef.value?.onCloseEdit()
 
+        data.currentTab = 'notificationDetail'
 
+        return
 
+      }
 
+
 
+      if(tabName === 'onlyMute') {
 
+        getUserList()
 
+      }
 
       data.currentTab = tabName;
 
       data.currentTab = tabName;
 
       data.editLableName = "";
 
       data.editLableName = "";
 
       if (data.currentTab === "member") {
 
       if (data.currentTab === "member") {
 
@@ -827,7 +875,6 @@ const manage = defineComponent({
 
 
 
     const getGroupMemberUserDetail = async () => {
 
     const getGroupMemberUserDetail = async () => {
 
       try {
 
       try {
 
-        console.log(data?.conversation?.groupProfile, "data?.conversation?.groupProfile?");
 
         const res = await imGroupMemberUserDetail({
 
         const res = await imGroupMemberUserDetail({
 
           groupId: data?.conversation?.groupProfile?.groupID,
 
           groupId: data?.conversation?.groupProfile?.groupID,
 
           imUserId: data?.conversation?.groupProfile?.selfInfo.userID,
 
           imUserId: data?.conversation?.groupProfile?.selfInfo.userID,
 
@@ -861,16 +908,26 @@ const manage = defineComponent({
 
           } catch {
 
           } catch {
 
             //
 
             //
 
           }
 
           }
 
+        } else {
 
+          data.currentTab = ""
 
         }
 
         }
 
       }
 
       }
 
     );
 
     );
 
 
 
     onMounted(() => {
 
     onMounted(() => {
 
+      eventGlobal.on('handleNotice', (id: any) => {
 
+        data.show = !data.show;
 
+        data.noticeId = id
 
+        data.currentTab = "notificationDetail"
 
+        if (data.show) {
 
+          getMember();
 
+        }
 
+      })
 
       try {
 
       try {
 
         data.platform = sessionStorage.getItem("platform") || "classroom";
 
         data.platform = sessionStorage.getItem("platform") || "classroom";
 
         getGroupDetail();
 
         getGroupDetail();
 
         getGroupMemberUserDetail();
 
         getGroupMemberUserDetail();
 
-        console.log(data?.conversation, "data?.conversation?");
 
+        // console.log(data?.conversation, "data?.conversation?");
 
         // console.log(data.userInfo.list, "data.userInfo.list");
 
         // console.log(data.userInfo.list, "data.userInfo.list");
 
       } catch {
 
       } catch {
 
         //
 
         //
 
@@ -893,6 +950,7 @@ const manage = defineComponent({
 
       setMemberMuteTime,
 
       setMemberMuteTime,
 
       kickedOut,
 
       kickedOut,
 
       edit,
 
       edit,
 
+      onNotificationChangeStatus,
 
       updateProfile,
 
       updateProfile,
 
       setTab,
 
       setTab,
 
       TabName,
 
       TabName,
 
@@ -906,6 +964,8 @@ const manage = defineComponent({
 
       handleManage,
 
       handleManage,
 
       showUserNum,
 
       showUserNum,
 
       dialog,
 
       dialog,
 
+      manageNotificationRef,
 
+      manageNotificationDetailRef,
 
       handleGroupIDCopy,
 
       handleGroupIDCopy,
 
       handleMemberProfileShow,
 
       handleMemberProfileShow,
 
     };
 
     };

+ 32 - 51
src/TUIKit/TUIComponents/container/TUIChat/manage-components/member-profile.vue
View File 

@@ -1,14 +1,7 @@
 
 <template>
 
 <template>
 
   <div class="memeber-profile">
 
   <div class="memeber-profile">
 
     <div class="memeber-profile-main">
 
     <div class="memeber-profile-main">
 
-      <img
 
-        class="avatar"
 
-        :src="
 
-          userInfo?.avatar ||
 
-          'https://news-info.ks3-cn-beijing.ksyuncs.com/07/1690787574969.png'
 
-        "
 
-        onerror="this.src='https://news-info.ks3-cn-beijing.ksyuncs.com/07/1690787574969.png'"
 
-      />
 
+      <img class="avatar" :src="userInfo?.avatar || 'https://oss.dayaedu.com/news-info/07/1690787574969.png'" onerror="this.src='https://oss.dayaedu.com/news-info/07/1690787574969.png'" />
 
       <ul class="list">
 
       <ul class="list">
 
         <h1>{{ userInfo?.nick || userInfo?.userID }}</h1>
 
         <h1>{{ userInfo?.nick || userInfo?.userID }}</h1>
 
         <li>
 
         <li>
 
@@ -16,40 +9,36 @@
 
           <span>{{ userInfo?.userID }}</span>
 
           <span>{{ userInfo?.userID }}</span>
 
         </li>
 
         </li>
 
         <li>
 
         <li>
 
-          <label>{{ $t('TUIContact.个性签名') }}：</label>
 
+          <label>{{ $t("TUIContact.个性签名") }}：</label>
 
           <span>{{ userInfo?.selfSignature }}</span>
 
           <span>{{ userInfo?.selfSignature }}</span>
 
         </li>
 
         </li>
 
       </ul>
 
       </ul>
 
     </div>
 
     </div>
 
     <div class="memeber-profile-footer">
 
     <div class="memeber-profile-footer">
 
-      <div
 
-        class="button"
 
-        @click="enter(userInfo?.userID, 'C2C')"
 
-        v-if="showEnter()"
 
-      >
 
-        {{ $t('TUIContact.发送消息') }}
 
+      <div class="button" @click="enter(userInfo?.userID, 'C2C')" v-if="showEnter()">
 
+        {{ $t("TUIContact.发送消息") }}
 
       </div>
 
       </div>
 
     </div>
 
     </div>
 
   </div>
 
   </div>
 
 </template>
 
 </template>
 
 <script lang="ts">
 
 <script lang="ts">
 
-import TIM from '../../../../TUICore/tim';
 
-import { reactive, toRefs, watch, watchEffect, defineComponent } from 'vue';
 
-import manage from './manage.vue';
 
+import TIM from "../../../../TUICore/tim";
 
+import { reactive, toRefs, watch, watchEffect, defineComponent } from "vue";
 
+import manage from "./manage.vue";
 
 
 
 const memberProfile = defineComponent({
 
 const memberProfile = defineComponent({
 
   props: {
 
   props: {
 
     userInfo: {
 
     userInfo: {
 
       type: Object,
 
       type: Object,
 
-      default: () => ({})
 
-    }
 
+      default: () => ({}),
 
+    },
 
   },
 
   },
 
   setup(props: any, ctx: any) {
 
   setup(props: any, ctx: any) {
 
     const TUIServer = manage?.TUIServer;
 
     const TUIServer = manage?.TUIServer;
 
     const data = reactive({
 
     const data = reactive({
 
       isFriendShip: false,
 
       isFriendShip: false,
 
       userInfo: {},
 
       userInfo: {},
 
-      self: {}
 
+      self: {},
 
     });
 
     });
 
     watchEffect(() => {
 
     watchEffect(() => {
 
       data.self = props.self;
 
       data.self = props.self;
 
@@ -64,29 +53,21 @@ const memberProfile = defineComponent({
 
       },
 
       },
 
       {
 
       {
 
         deep: true,
 
         deep: true,
 
-        immediate: true
 
+        immediate: true,
 
       }
 
       }
 
     );
 
     );
 
     const enter = async (ID: any, type: string) => {
 
     const enter = async (ID: any, type: string) => {
 
       const name = `${type}${ID}`;
 
       const name = `${type}${ID}`;
 
-      TUIServer.TUICore.TUIServer.TUIConversation.getConversationProfile(
 
-        name
 
-      ).then((imResponse: any) => {
 
+      TUIServer.TUICore.TUIServer.TUIConversation.getConversationProfile(name).then((imResponse: any) => {
 
         // 通知 TUIConversation 添加当前会话
 
         // 通知 TUIConversation 添加当前会话
 
         // Notify TUIConversation to toggle the current conversation
 
         // Notify TUIConversation to toggle the current conversation
 
-        TUIServer.TUICore.TUIServer.TUIConversation.handleCurrentConversation(
 
-          imResponse.data.conversation
 
-        );
 
+        TUIServer.TUICore.TUIServer.TUIConversation.handleCurrentConversation(imResponse.data.conversation);
 
       });
 
       });
 
     };
 
     };
 
     const checkFriend = async () => {
 
     const checkFriend = async () => {
 
       if (!(data.userInfo as any).userID) return;
 
       if (!(data.userInfo as any).userID) return;
 
-      const relation = await TUIServer.checkFriend(
 
-        (data.userInfo as any).userID,
 
-        TIM.TYPES.SNS_CHECK_TYPE_BOTH
 
-      );
 
-      data.isFriendShip =
 
-        relation === TIM.TYPES.SNS_TYPE_BOTH_WAY ? true : false;
 
+      const relation = await TUIServer.checkFriend((data.userInfo as any).userID, TIM.TYPES.SNS_CHECK_TYPE_BOTH);
 
+      data.isFriendShip = relation === TIM.TYPES.SNS_TYPE_BOTH_WAY ? true : false;
 
     };
 
     };
 
 
 
     const showEnter = () => {
 
     const showEnter = () => {
 
@@ -95,15 +76,15 @@ const memberProfile = defineComponent({
 
     return {
 
     return {
 
       ...toRefs(data),
 
       ...toRefs(data),
 
       enter,
 
       enter,
 
-      showEnter
 
+      showEnter,
 
     };
 
     };
 
-  }
 
+  },
 
 });
 
 });
 
 export default memberProfile;
 
 export default memberProfile;
 
 </script>
 
 </script>
 
 <style lang="scss" scoped>
 
 <style lang="scss" scoped>
 
-@import url('../../../styles/common.scss');
 
-@import url('../../../styles/icon.scss');
 
+@import url("../../../styles/common.scss");
 
+@import url("../../../styles/icon.scss");
 
 .memeber-profile {
 
 .memeber-profile {
 
   flex: 1;
 
   flex: 1;
 
   display: flex;
 
   display: flex;
 
@@ -114,15 +95,15 @@ export default memberProfile;
 
     width: 100%;
 
     width: 100%;
 
     overflow: hidden;
 
     overflow: hidden;
 
     img {
 
     img {
 
-      width: 60Px;
 
-      height: 60Px;
 
-      border-radius: 8Px;
 
-      margin: 20Px 10Px 20Px 20Px;
 
+      width: 60px;
 
+      height: 60px;
 
+      border-radius: 8px;
 
+      margin: 20px 10px 20px 20px;
 
     }
 
     }
 
     .list {
 
     .list {
 
       flex: 1;
 
       flex: 1;
 
       overflow: hidden;
 
       overflow: hidden;
 
-      margin: 20Px 10Px;
 
+      margin: 20px 10px;
 
       font-weight: 400;
 
       font-weight: 400;
 
       li {
 
       li {
 
         color: #999999;
 
         color: #999999;
 
@@ -136,24 +117,24 @@ export default memberProfile;
 
     }
 
     }
 
   }
 
   }
 
   &-footer {
 
   &-footer {
 
-    border-top: 10Px solid #f4f5f9;
 
-    padding: 14Px;
 
+    border-top: 10px solid #f4f5f9;
 
+    padding: 14px;
 
     display: flex;
 
     display: flex;
 
     flex-direction: column;
 
     flex-direction: column;
 
     align-items: center;
 
     align-items: center;
 
     justify-content: center;
 
     justify-content: center;
 
     .button {
 
     .button {
 
-      width: 100Px;
 
-      font-size: 14Px;
 
+      width: 100px;
 
+      font-size: 14px;
 
       cursor: pointer;
 
       cursor: pointer;
 
       background-color: #006eff;
 
       background-color: #006eff;
 
       color: #ffffff;
 
       color: #ffffff;
 
-      padding: 8Px 20Px;
 
-      border-radius: 4Px;
 
+      padding: 8px 20px;
 
+      border-radius: 4px;
 
       border: none;
 
       border: none;
 
-      font-size: 14Px;
 
+      font-size: 14px;
 
       text-align: center;
 
       text-align: center;
 
-      line-height: 20Px;
 
+      line-height: 20px;
 
     }
 
     }
 
   }
 
   }
 
 }
 
 }

+ 55 - 85
src/TUIKit/TUIComponents/container/TUIChat/message-input/message-input-at.vue
View File 

@@ -1,31 +1,15 @@
 
 <template>
 
 <template>
 
-  <div
 
-    class="message-input-at"
 
-    :class="[isH5 && 'message-input-at-h5']"
 
-    v-if="showAtList"
 
-    ref="MessageInputAt"
 
-  >
 
+  <div class="message-input-at" :class="[isH5 && 'message-input-at-h5']" v-if="showAtList" ref="MessageInputAt">
 
     <div class="memberList" ref="dialog">
 
     <div class="memberList" ref="dialog">
 
       <header class="memberList-title" v-if="isH5">
 
       <header class="memberList-title" v-if="isH5">
 
-        <span class="title">{{ $t('TUIChat.选择提醒的人') }}</span>
 
+        <span class="title">{{ $t("TUIChat.选择提醒的人") }}</span>
 
         <i class="icon icon-close close" @click="closeAt"></i>
 
         <i class="icon icon-close close" @click="closeAt"></i>
 
       </header>
 
       </header>
 
       <ul class="memberList-box">
 
       <ul class="memberList-box">
 
-        <li
 
-          class="memberList-box-body"
 
-          :class="[index === selectedIndex && 'selected']"
 
-          v-for="(item, index) in showMemberList"
 
-          :key="index"
 
-          @click="selectItem(index)"
 
-          ref="memberListItems"
 
-        >
 
-          <img
 
-            :src="(item as any)?.avatar || 'https://news-info.ks3-cn-beijing.ksyuncs.com/07/1690787574969.png'"
 
-          />
 
+        <li class="memberList-box-body" :class="[index === selectedIndex && 'selected']" v-for="(item, index) in showMemberList" :key="index" @click="selectItem(index)" ref="memberListItems">
 
+          <img :src="(item as any)?.avatar || 'https://oss.dayaedu.com/news-info/07/1690787574969.png'" />
 
           <span>
 
           <span>
 
-            {{
 
-              (item as any)?.nick ? (item as any)?.nick : (item as any)?.userID
 
-            }}
 
+            {{ (item as any)?.nick ? (item as any)?.nick : (item as any)?.userID }}
 
           </span>
 
           </span>
 
         </li>
 
         </li>
 
       </ul>
 
       </ul>
 
@@ -33,11 +17,11 @@
 
   </div>
 
   </div>
 
 </template>
 
 </template>
 
 <script lang="ts">
 
 <script lang="ts">
 
-import { defineComponent, ref, toRefs, watchEffect, watch } from 'vue';
 
-import { SuggestionProps, SuggestionKeyDownProps } from '@tiptap/suggestion';
 
-import atIcon from '../../../assets/icon/at.svg';
 
-import TIM from '../../../../TUICore/tim';
 
-import { onClickOutside } from '@vueuse/core';
 
+import { defineComponent, ref, toRefs, watchEffect, watch } from "vue";
 
+import { SuggestionProps, SuggestionKeyDownProps } from "@tiptap/suggestion";
 
+import atIcon from "../../../assets/icon/at.svg";
 
+import TIM from "../../../../TUICore/tim";
 
+import { onClickOutside } from "@vueuse/core";
 
 
 
 const MessageInputAt = ref();
 
 const MessageInputAt = ref();
 
 const showAtList = ref(false);
 
 const showAtList = ref(false);
 
@@ -45,7 +29,7 @@ const allMemberList = ref<Array<any>>();
 
 const showMemberList = ref<Array<any>>();
 
 const showMemberList = ref<Array<any>>();
 
 const position = ref({
 
 const position = ref({
 
   left: 0,
 
   left: 0,
 
-  top: 0
 
+  top: 0,
 
 });
 
 });
 
 const command = ref();
 
 const command = ref();
 
 const selectedIndex = ref(0);
 
 const selectedIndex = ref(0);
 
@@ -56,14 +40,8 @@ const MessageInputAtSuggestion = () => {
 
   return {
 
   return {
 
     allowedPrefixes: null,
 
     allowedPrefixes: null,
 
     items: (props: { query: string }) => {
 
     items: (props: { query: string }) => {
 
-      const queryResult = allMemberList?.value?.filter(
 
-        item =>
 
-          item?.nick?.toLowerCase()?.startsWith(props?.query?.toLowerCase()) ||
 
-          item?.userID?.toLowerCase()?.startsWith(props?.query?.toLowerCase())
 
-      );
 
-      showMemberList.value = queryResult?.length
 
-        ? queryResult
 
-        : allMemberList.value;
 
+      const queryResult = allMemberList?.value?.filter((item) => item?.nick?.toLowerCase()?.startsWith(props?.query?.toLowerCase()) || item?.userID?.toLowerCase()?.startsWith(props?.query?.toLowerCase()));
 
+      showMemberList.value = queryResult?.length ? queryResult : allMemberList.value;
 
       return showMemberList.value;
 
       return showMemberList.value;
 
     },
 
     },
 
     render: () => {
 
     render: () => {
 
@@ -83,7 +61,7 @@ const MessageInputAtSuggestion = () => {
 
           if (rect?.left && rect?.top && !isH5.value) {
 
           if (rect?.left && rect?.top && !isH5.value) {
 
             position.value = {
 
             position.value = {
 
               left: rect?.left,
 
               left: rect?.left,
 
-              top: rect?.top
 
+              top: rect?.top,
 
             };
 
             };
 
           }
 
           }
 
           command.value = props.command;
 
           command.value = props.command;
 
@@ -97,30 +75,30 @@ const MessageInputAtSuggestion = () => {
 
           if (rect?.left && rect?.top && !isH5.value) {
 
           if (rect?.left && rect?.top && !isH5.value) {
 
             position.value = {
 
             position.value = {
 
               left: rect?.left,
 
               left: rect?.left,
 
-              top: rect?.top
 
+              top: rect?.top,
 
             };
 
             };
 
           }
 
           }
 
         },
 
         },
 
 
 
         onKeyDown(props: SuggestionKeyDownProps) {
 
         onKeyDown(props: SuggestionKeyDownProps) {
 
-          if (props.event.key === 'Enter') {
 
+          if (props.event.key === "Enter") {
 
             props.event?.stopPropagation();
 
             props.event?.stopPropagation();
 
             props.event?.preventDefault();
 
             props.event?.preventDefault();
 
           }
 
           }
 
-          if (props.event.key === 'Escape') {
 
+          if (props.event.key === "Escape") {
 
             showAtList.value = false;
 
             showAtList.value = false;
 
             showMemberList.value = allMemberList.value;
 
             showMemberList.value = allMemberList.value;
 
             return true;
 
             return true;
 
           }
 
           }
 
-          if (props?.event.key === 'ArrowUp') {
 
+          if (props?.event.key === "ArrowUp") {
 
             upHandler();
 
             upHandler();
 
             return true;
 
             return true;
 
           }
 
           }
 
-          if (props?.event.key === 'ArrowDown') {
 
+          if (props?.event.key === "ArrowDown") {
 
             downHandler();
 
             downHandler();
 
             return true;
 
             return true;
 
           }
 
           }
 
-          if (props?.event.key === 'Enter') {
 
+          if (props?.event.key === "Enter") {
 
             enterHandler();
 
             enterHandler();
 
             return true;
 
             return true;
 
           }
 
           }
 
@@ -132,26 +110,23 @@ const MessageInputAtSuggestion = () => {
 
           showMemberList.value = allMemberList.value;
 
           showMemberList.value = allMemberList.value;
 
           position.value = {
 
           position.value = {
 
             left: 0,
 
             left: 0,
 
-            top: 0
 
+            top: 0,
 
           };
 
           };
 
-        }
 
+        },
 
       };
 
       };
 
-    }
 
+    },
 
   };
 
   };
 
 };
 
 };
 
 
 
 const upHandler = () => {
 
 const upHandler = () => {
 
   if (!showMemberList?.value?.length) return;
 
   if (!showMemberList?.value?.length) return;
 
-  selectedIndex.value =
 
-    (selectedIndex.value + showMemberList?.value?.length - 1) %
 
-    showMemberList?.value?.length;
 
+  selectedIndex.value = (selectedIndex.value + showMemberList?.value?.length - 1) % showMemberList?.value?.length;
 
   memberListItems?.value[selectedIndex.value]?.scrollIntoView(false);
 
   memberListItems?.value[selectedIndex.value]?.scrollIntoView(false);
 
 };
 
 };
 
 
 
 const downHandler = () => {
 
 const downHandler = () => {
 
   if (!showMemberList?.value?.length) return;
 
   if (!showMemberList?.value?.length) return;
 
-  selectedIndex.value =
 
-    (selectedIndex.value + 1) % showMemberList?.value?.length;
 
+  selectedIndex.value = (selectedIndex.value + 1) % showMemberList?.value?.length;
 
   memberListItems?.value[selectedIndex.value]?.scrollIntoView(false);
 
   memberListItems?.value[selectedIndex.value]?.scrollIntoView(false);
 
 };
 
 };
 
 
 
@@ -166,7 +141,7 @@ const selectItem = (index: number) => {
 
     command.value &&
 
     command.value &&
 
       command.value({
 
       command.value({
 
         id: (item as any)?.userID,
 
         id: (item as any)?.userID,
 
-        label: (item as any)?.nick || (item as any)?.userID
 
+        label: (item as any)?.nick || (item as any)?.userID,
 
       });
 
       });
 
   }
 
   }
 
 };
 
 };
 
@@ -175,28 +150,28 @@ const MessageInputAtComponent = defineComponent({
 
   props: {
 
   props: {
 
     memberList: {
 
     memberList: {
 
       type: Array,
 
       type: Array,
 
-      default: () => []
 
+      default: () => [],
 
     },
 
     },
 
     isGroup: {
 
     isGroup: {
 
       type: Boolean,
 
       type: Boolean,
 
-      default: false
 
+      default: false,
 
     },
 
     },
 
     selfInfo: {
 
     selfInfo: {
 
       type: Object,
 
       type: Object,
 
-      default: () => ({})
 
+      default: () => ({}),
 
     },
 
     },
 
     isH5: {
 
     isH5: {
 
       type: Boolean,
 
       type: Boolean,
 
-      default: false
 
-    }
 
+      default: false,
 
+    },
 
   },
 
   },
 
   setup(props) {
 
   setup(props) {
 
     const { memberList, isGroup, selfInfo } = toRefs(props);
 
     const { memberList, isGroup, selfInfo } = toRefs(props);
 
     const all = {
 
     const all = {
 
       userID: TIM.TYPES.MSG_AT_ALL,
 
       userID: TIM.TYPES.MSG_AT_ALL,
 
-      nick: '所有人',
 
+      nick: "所有人",
 
       isAll: true,
 
       isAll: true,
 
-      avatar: atIcon
 
+      avatar: atIcon,
 
     };
 
     };
 
     const dialog = ref();
 
     const dialog = ref();
 
     watchEffect(() => {
 
     watchEffect(() => {
 
@@ -220,27 +195,22 @@ const MessageInputAtComponent = defineComponent({
 
       },
 
       },
 
       {
 
       {
 
         deep: true,
 
         deep: true,
 
-        immediate: true
 
+        immediate: true,
 
       }
 
       }
 
     );
 
     );
 
 
 
     watch(
 
     watch(
 
       () => [position.value, MessageInputAt?.value],
 
       () => [position.value, MessageInputAt?.value],
 
       () => {
 
       () => {
 
-        if (
 
-          isH5.value ||
 
-          !MessageInputAt?.value ||
 
-          !MessageInputAt?.value?.style
 
-        ) {
 
+        if (isH5.value || !MessageInputAt?.value || !MessageInputAt?.value?.style) {
 
           return;
 
           return;
 
         }
 
         }
 
-        MessageInputAt.value.style.left = position.value.left + 'Px';
 
-        MessageInputAt.value.style.top =
 
-          position.value.top - MessageInputAt.value.clientHeight + 'Px';
 
+        MessageInputAt.value.style.left = position.value.left + "Px";
 
+        MessageInputAt.value.style.top = position.value.top - MessageInputAt.value.clientHeight + "Px";
 
       },
 
       },
 
       {
 
       {
 
         deep: true,
 
         deep: true,
 
-        immediate: true
 
+        immediate: true,
 
       }
 
       }
 
     );
 
     );
 
 
 
@@ -249,7 +219,7 @@ const MessageInputAtComponent = defineComponent({
 
       showMemberList.value = allMemberList.value;
 
       showMemberList.value = allMemberList.value;
 
       position.value = {
 
       position.value = {
 
         left: 0,
 
         left: 0,
 
-        top: 0
 
+        top: 0,
 
       };
 
       };
 
     };
 
     };
 
 
 
@@ -266,17 +236,17 @@ const MessageInputAtComponent = defineComponent({
 
       allMemberList,
 
       allMemberList,
 
       MessageInputAt,
 
       MessageInputAt,
 
       memberListItems,
 
       memberListItems,
 
-      dialog
 
+      dialog,
 
     };
 
     };
 
-  }
 
+  },
 
 });
 
 });
 
 
 
 export default MessageInputAtComponent;
 
 export default MessageInputAtComponent;
 
 export { MessageInputAtSuggestion, MessageInputAtComponent };
 
 export { MessageInputAtSuggestion, MessageInputAtComponent };
 
 </script>
 
 </script>
 
 <style scoped lang="scss">
 
 <style scoped lang="scss">
 
-@import url('../../../styles/common.scss');
 
-@import url('../../../styles/icon.scss');
 
+@import url("../../../styles/common.scss");
 
+@import url("../../../styles/icon.scss");
 
 .message-input-at {
 
 .message-input-at {
 
   position: fixed;
 
   position: fixed;
 
   max-width: 15rem;
 
   max-width: 15rem;
 
@@ -290,7 +260,7 @@ export { MessageInputAtSuggestion, MessageInputAtComponent };
 
 .memberList-box {
 
 .memberList-box {
 
   &-header {
 
   &-header {
 
     height: 2.5rem;
 
     height: 2.5rem;
 
-    padding-top: 5Px;
 
+    padding-top: 5px;
 
     cursor: pointer;
 
     cursor: pointer;
 
 
 
     &:hover {
 
     &:hover {
 
@@ -303,10 +273,11 @@ export { MessageInputAtSuggestion, MessageInputAtComponent };
 
     font-size: 0.88rem;
 
     font-size: 0.88rem;
 
     color: #000000;
 
     color: #000000;
 
     letter-spacing: 0;
 
     letter-spacing: 0;
 
-    padding: 5Px;
 
+    padding: 5px;
 
   }
 
   }
 
   &-body {
 
   &-body {
 
     height: 2.5rem;
 
     height: 2.5rem;
 
+    padding: 0 10px;
 
     cursor: pointer;
 
     cursor: pointer;
 
     display: flex;
 
     display: flex;
 
     align-items: center;
 
     align-items: center;
 
@@ -325,7 +296,6 @@ export { MessageInputAtSuggestion, MessageInputAtComponent };
 
   img {
 
   img {
 
     width: 1.5rem;
 
     width: 1.5rem;
 
     height: 1.5rem;
 
     height: 1.5rem;
 
-    padding-left: 10Px;
 
   }
 
   }
 
   .selected {
 
   .selected {
 
     background: rgba(0, 110, 255, 0.1);
 
     background: rgba(0, 110, 255, 0.1);
 
@@ -351,25 +321,25 @@ export { MessageInputAtSuggestion, MessageInputAtComponent };
 
     width: 100%;
 
     width: 100%;
 
     max-width: 100%;
 
     max-width: 100%;
 
     background: white;
 
     background: white;
 
-    border-radius: 12Px 12Px 0 0;
 
+    border-radius: 12px 12px 0 0;
 
     display: flex;
 
     display: flex;
 
     flex-direction: column;
 
     flex-direction: column;
 
     overflow: hidden;
 
     overflow: hidden;
 
     &-title {
 
     &-title {
 
       height: fit-content;
 
       height: fit-content;
 
-      width: calc(100% - 30Px);
 
+      width: calc(100% - 30px);
 
       text-align: center;
 
       text-align: center;
 
       vertical-align: middle;
 
       vertical-align: middle;
 
-      padding: 15Px;
 
+      padding: 15px;
 
       .title {
 
       .title {
 
         vertical-align: middle;
 
         vertical-align: middle;
 
         display: inline-block;
 
         display: inline-block;
 
-        font-size: 16Px;
 
+        font-size: 16px;
 
       }
 
       }
 
       .close {
 
       .close {
 
         vertical-align: middle;
 
         vertical-align: middle;
 
         position: absolute;
 
         position: absolute;
 
-        right: 10Px;
 
+        right: 10px;
 
         display: inline-block;
 
         display: inline-block;
 
       }
 
       }
 
     }
 
     }
 
@@ -377,13 +347,13 @@ export { MessageInputAtSuggestion, MessageInputAtComponent };
 
       flex: 1;
 
       flex: 1;
 
       overflow-y: scroll;
 
       overflow-y: scroll;
 
       &-body {
 
       &-body {
 
-        padding: 10Px;
 
+        padding: 10px;
 
         img {
 
         img {
 
-          width: 26Px;
 
-          height: 26Px;
 
+          width: 26px;
 
+          height: 26px;
 
         }
 
         }
 
         span {
 
         span {
 
-          font-size: 14Px;
 
+          font-size: 14px;
 
         }
 
         }
 
       }
 
       }
 
     }
 
     }

+ 38 - 67
src/TUIKit/TUIComponents/container/TUIChat/plugin-components/readReceiptDialog/readReceiptDialog.vue
View File 

@@ -1,16 +1,11 @@
 
 <template>
 
 <template>
 
-  <div
 
-    class="read-receipt"
 
-    :class="[isH5 ? 'read-receipt-H5' : '', isMenuOpen ? 'read-receipt-menu-open' : '']"
 
-    v-if="show"
 
-    ref="dialog"
 
-  >
 
+  <div class="read-receipt" :class="[isH5 ? 'read-receipt-H5' : '', isMenuOpen ? 'read-receipt-menu-open' : '']" v-if="show" ref="dialog">
 
     <div class="header">
 
     <div class="header">
 
       <div class="header-back">
 
       <div class="header-back">
 
         <i v-if="isH5" class="icon icon-back" @click="toggleShow"></i>
 
         <i v-if="isH5" class="icon icon-back" @click="toggleShow"></i>
 
       </div>
 
       </div>
 
       <div class="header-title">
 
       <div class="header-title">
 
-        <span>{{ $t('TUIChat.消息详情') }}</span>
 
+        <span>{{ $t("TUIChat.消息详情") }}</span>
 
       </div>
 
       </div>
 
       <div class="header-close">
 
       <div class="header-close">
 
         <i v-if="!isH5" class="icon icon-close" @click="toggleShow"></i>
 
         <i v-if="!isH5" class="icon icon-close" @click="toggleShow"></i>
 
@@ -31,13 +26,7 @@
 
       </div>
 
       </div>
 
       <div class="body-tab">
 
       <div class="body-tab">
 
         <template v-for="(val, key) in readReceiptList">
 
         <template v-for="(val, key) in readReceiptList">
 
-          <div
 
-            class="tab-item"
 
-            :class="key === showListNow && 'tab-item-now'"
 
-            v-if="val.show"
 
-            :key="key"
 
-            @click="showListNow = key"
 
-          >
 
+          <div class="tab-item" :class="key === showListNow && 'tab-item-now'" v-if="val.show" :key="key" @click="showListNow = key">
 
             <div class="tab-item-title">{{ val?.label }}</div>
 
             <div class="tab-item-title">{{ val?.label }}</div>
 
             <div class="tab-item-count">{{ val?.count }}</div>
 
             <div class="tab-item-count">{{ val?.count }}</div>
 
           </div>
 
           </div>
 
@@ -46,11 +35,7 @@
 
       <div class="body-list">
 
       <div class="body-list">
 
         <ul>
 
         <ul>
 
           <li v-for="(item, index) in readReceiptList[showListNow].userList" :key="index" class="body-list-item">
 
           <li v-for="(item, index) in readReceiptList[showListNow].userList" :key="index" class="body-list-item">
 
-            <img
 
-              class="avatar"
 
-              :src="item?.avatar || 'https://news-info.ks3-cn-beijing.ksyuncs.com/07/1690787574969.png'"
 
-              onerror="this.src='https://news-info.ks3-cn-beijing.ksyuncs.com/07/1690787574969.png'"
 
-            />
 
+            <img class="avatar" :src="item?.avatar || 'https://oss.dayaedu.com/news-info/07/1690787574969.png'" onerror="this.src='https://oss.dayaedu.com/news-info/07/1690787574969.png'" />
 
             <div class="name">
 
             <div class="name">
 
               {{ item?.nick || item?.userID }}
 
               {{ item?.nick || item?.userID }}
 
             </div>
 
             </div>
 
@@ -62,18 +47,14 @@
 
   </div>
 
   </div>
 
 </template>
 
 </template>
 
 <script lang="ts">
 
 <script lang="ts">
 
-import { defineComponent, reactive, watchEffect, toRefs, watch, ref } from 'vue';
 
-import { onClickOutside } from '@vueuse/core';
 
-import { caculateTimeago, handleErrorPrompts } from '../../../utils';
 
-import { Message, userListItem } from '../../interface';
 
-import {
 
-  handleImageMessageShowContext,
 
-  handleVideoMessageShowContext,
 
-  handleFaceMessageShowContext,
 
-} from '../../utils/utils';
 
-import { TUIEnv } from '../../../../../TUIPlugin';
 
+import { defineComponent, reactive, watchEffect, toRefs, watch, ref } from "vue";
 
+import { onClickOutside } from "@vueuse/core";
 
+import { caculateTimeago, handleErrorPrompts } from "../../../utils";
 
+import { Message, userListItem } from "../../interface";
 
+import { handleImageMessageShowContext, handleVideoMessageShowContext, handleFaceMessageShowContext } from "../../utils/utils";
 
+import { TUIEnv } from "../../../../../TUIPlugin";
 
 const ReadReceiptDialog = defineComponent({
 
 const ReadReceiptDialog = defineComponent({
 
-  type: 'custom',
 
+  type: "custom",
 
   props: {
 
   props: {
 
     message: {
 
     message: {
 
       type: Object,
 
       type: Object,
 
@@ -97,31 +78,31 @@ const ReadReceiptDialog = defineComponent({
 
       isH5: false,
 
       isH5: false,
 
       messageInfo: {
 
       messageInfo: {
 
         isImg: false,
 
         isImg: false,
 
-        content: '',
 
+        content: "",
 
       },
 
       },
 
       readReceiptList: [
 
       readReceiptList: [
 
         {
 
         {
 
-          label: props.isH5 ? t('TUIChat.人已读') : t('TUIChat.已读'),
 
+          label: props.isH5 ? t("TUIChat.人已读") : t("TUIChat.已读"),
 
           count: 0,
 
           count: 0,
 
           userList: [] as userListItem[],
 
           userList: [] as userListItem[],
 
           isCompleted: true,
 
           isCompleted: true,
 
-          cursor: '',
 
+          cursor: "",
 
           show: true,
 
           show: true,
 
         },
 
         },
 
         {
 
         {
 
-          label: props.isH5 ? t('TUIChat.人未读') : t('TUIChat.未读'),
 
+          label: props.isH5 ? t("TUIChat.人未读") : t("TUIChat.未读"),
 
           count: 0,
 
           count: 0,
 
           userList: [] as userListItem[],
 
           userList: [] as userListItem[],
 
           isCompleted: true,
 
           isCompleted: true,
 
-          cursor: '',
 
+          cursor: "",
 
           show: true,
 
           show: true,
 
         },
 
         },
 
         {
 
         {
 
-          label: props.isH5 ? t('TUIChat.人关闭阅读状态') : t('TUIChat.关闭阅读状态'),
 
+          label: props.isH5 ? t("TUIChat.人关闭阅读状态") : t("TUIChat.关闭阅读状态"),
 
           count: 0,
 
           count: 0,
 
           userList: [] as userListItem[],
 
           userList: [] as userListItem[],
 
           isCompleted: true,
 
           isCompleted: true,
 
-          cursor: '',
 
+          cursor: "",
 
           show: false,
 
           show: false,
 
         },
 
         },
 
       ],
 
       ],
 
@@ -158,34 +139,29 @@ const ReadReceiptDialog = defineComponent({
 
     const toggleShow = () => {
 
     const toggleShow = () => {
 
       data.show = !data.show;
 
       data.show = !data.show;
 
       if (!data.show) {
 
       if (!data.show) {
 
-        ctx.emit('closeDialog', 'receipt');
 
+        ctx.emit("closeDialog", "receipt");
 
         close();
 
         close();
 
       }
 
       }
 
     };
 
     };
 
 
 
     onClickOutside(dialog, () => {
 
     onClickOutside(dialog, () => {
 
       data.show = false;
 
       data.show = false;
 
-      ctx.emit('closeDialog', 'receipt');
 
+      ctx.emit("closeDialog", "receipt");
 
       close();
 
       close();
 
     });
 
     });
 
 
 
     const getReadList = async (more = false) => {
 
     const getReadList = async (more = false) => {
 
       if (!data.isGroup || !data.message || Object.keys(data.message).length === 0) return;
 
       if (!data.isGroup || !data.message || Object.keys(data.message).length === 0) return;
 
       try {
 
       try {
 
-        const obj = await ReadReceiptDialog.TUIServer.getGroupReadMemberList(
 
-          data.message,
 
-          more ? data.readReceiptList[0].cursor : ''
 
-        );
 
+        const obj = await ReadReceiptDialog.TUIServer.getGroupReadMemberList(data.message, more ? data.readReceiptList[0].cursor : "");
 
         data.readReceiptList[0].isCompleted = obj?.data?.isCompleted;
 
         data.readReceiptList[0].isCompleted = obj?.data?.isCompleted;
 
-        data.readReceiptList[0].cursor = obj?.data?.cursor || '';
 
+        data.readReceiptList[0].cursor = obj?.data?.cursor || "";
 
         const list = obj.data.readUserIDList;
 
         const list = obj.data.readUserIDList;
 
         const readList: userListItem[] = await handleAvatarAndName(list);
 
         const readList: userListItem[] = await handleAvatarAndName(list);
 
-        data.readReceiptList[0].userList = more
 
-          ? ([...data.readReceiptList[0].userList, ...readList] as userListItem[])
 
-          : readList;
 
+        data.readReceiptList[0].userList = more ? ([...data.readReceiptList[0].userList, ...readList] as userListItem[]) : readList;
 
       } catch (error) {
 
       } catch (error) {
 
         if (error && (error as any)?.code === 10062) {
 
         if (error && (error as any)?.code === 10062) {
 
-          const message = t('TUIChat.您当前购买使用的套餐包暂未开通群消息已读回执功能');
 
+          const message = t("TUIChat.您当前购买使用的套餐包暂未开通群消息已读回执功能");
 
           handleErrorPrompts(message, data.env);
 
           handleErrorPrompts(message, data.env);
 
           console.warn(message);
 
           console.warn(message);
 
         }
 
         }
 
@@ -194,17 +170,12 @@ const ReadReceiptDialog = defineComponent({
 
 
 
     const getUnreadList = async (more = false) => {
 
     const getUnreadList = async (more = false) => {
 
       if (!data.isGroup || !data.message || Object.keys(data.message).length === 0) return;
 
       if (!data.isGroup || !data.message || Object.keys(data.message).length === 0) return;
 
-      const obj = await ReadReceiptDialog.TUIServer.getGroupUnreadMemberList(
 
-        data.message,
 
-        more ? data.readReceiptList[1].cursor : ''
 
-      );
 
+      const obj = await ReadReceiptDialog.TUIServer.getGroupUnreadMemberList(data.message, more ? data.readReceiptList[1].cursor : "");
 
       data.readReceiptList[1].isCompleted = obj?.data.isCompleted;
 
       data.readReceiptList[1].isCompleted = obj?.data.isCompleted;
 
-      data.readReceiptList[1].cursor = obj?.data?.cursor || '';
 
+      data.readReceiptList[1].cursor = obj?.data?.cursor || "";
 
       const list = obj.data.unreadUserIDList;
 
       const list = obj.data.unreadUserIDList;
 
       const unreadList: userListItem[] = await handleAvatarAndName(list);
 
       const unreadList: userListItem[] = await handleAvatarAndName(list);
 
-      data.readReceiptList[1].userList = more
 
-        ? ([...data.readReceiptList[1].userList, ...unreadList] as userListItem[])
 
-        : unreadList;
 
+      data.readReceiptList[1].userList = more ? ([...data.readReceiptList[1].userList, ...unreadList] as userListItem[]) : unreadList;
 
     };
 
     };
 
 
 
     const handleAvatarAndName = async (list: any) => {
 
     const handleAvatarAndName = async (list: any) => {
 
@@ -249,34 +220,34 @@ const ReadReceiptDialog = defineComponent({
 
       data.message = {};
 
       data.message = {};
 
       data.readReceiptList = [
 
       data.readReceiptList = [
 
         {
 
         {
 
-          label: props.isH5 ? t('TUIChat.人已读') : t('TUIChat.已读'),
 
+          label: props.isH5 ? t("TUIChat.人已读") : t("TUIChat.已读"),
 
           count: 0,
 
           count: 0,
 
           userList: [] as userListItem[],
 
           userList: [] as userListItem[],
 
           isCompleted: true,
 
           isCompleted: true,
 
-          cursor: '',
 
+          cursor: "",
 
           show: true,
 
           show: true,
 
         },
 
         },
 
         {
 
         {
 
-          label: props.isH5 ? t('TUIChat.人未读') : t('TUIChat.未读'),
 
+          label: props.isH5 ? t("TUIChat.人未读") : t("TUIChat.未读"),
 
           count: 0,
 
           count: 0,
 
           userList: [] as userListItem[],
 
           userList: [] as userListItem[],
 
           isCompleted: true,
 
           isCompleted: true,
 
-          cursor: '',
 
+          cursor: "",
 
           show: true,
 
           show: true,
 
         },
 
         },
 
         {
 
         {
 
-          label: props.isH5 ? t('TUIChat.人关闭阅读状态') : t('TUIChat.关闭阅读状态'),
 
+          label: props.isH5 ? t("TUIChat.人关闭阅读状态") : t("TUIChat.关闭阅读状态"),
 
           count: 0,
 
           count: 0,
 
           userList: [] as userListItem[],
 
           userList: [] as userListItem[],
 
           isCompleted: true,
 
           isCompleted: true,
 
-          cursor: '',
 
+          cursor: "",
 
           show: false,
 
           show: false,
 
         },
 
         },
 
       ];
 
       ];
 
       data.showListNow = 0;
 
       data.showListNow = 0;
 
       data.messageInfo = {
 
       data.messageInfo = {
 
         isImg: false,
 
         isImg: false,
 
-        content: '',
 
+        content: "",
 
       };
 
       };
 
     };
 
     };
 
 
 
@@ -288,7 +259,7 @@ const ReadReceiptDialog = defineComponent({
 
           data.messageInfo.isImg = false;
 
           data.messageInfo.isImg = false;
 
           break;
 
           break;
 
         case ReadReceiptDialog.TUIServer.TUICore.TIM.TYPES.MSG_CUSTOM:
 
         case ReadReceiptDialog.TUIServer.TUICore.TIM.TYPES.MSG_CUSTOM:
 
-          data.messageInfo.content = t('TUIChat.自定义');
 
+          data.messageInfo.content = t("TUIChat.自定义");
 
           data.messageInfo.isImg = false;
 
           data.messageInfo.isImg = false;
 
           break;
 
           break;
 
         case ReadReceiptDialog.TUIServer.TUICore.TIM.TYPES.MSG_IMAGE:
 
         case ReadReceiptDialog.TUIServer.TUICore.TIM.TYPES.MSG_IMAGE:
 
@@ -296,7 +267,7 @@ const ReadReceiptDialog = defineComponent({
 
           data.messageInfo.isImg = true;
 
           data.messageInfo.isImg = true;
 
           break;
 
           break;
 
         case ReadReceiptDialog.TUIServer.TUICore.TIM.TYPES.MSG_AUDIO:
 
         case ReadReceiptDialog.TUIServer.TUICore.TIM.TYPES.MSG_AUDIO:
 
-          data.messageInfo.content = t('TUIChat.语音');
 
+          data.messageInfo.content = t("TUIChat.语音");
 
           data.messageInfo.isImg = false;
 
           data.messageInfo.isImg = false;
 
           break;
 
           break;
 
         case ReadReceiptDialog.TUIServer.TUICore.TIM.TYPES.MSG_VIDEO:
 
         case ReadReceiptDialog.TUIServer.TUICore.TIM.TYPES.MSG_VIDEO:
 
@@ -304,7 +275,7 @@ const ReadReceiptDialog = defineComponent({
 
           data.messageInfo.isImg = true;
 
           data.messageInfo.isImg = true;
 
           break;
 
           break;
 
         case ReadReceiptDialog.TUIServer.TUICore.TIM.TYPES.MSG_FILE:
 
         case ReadReceiptDialog.TUIServer.TUICore.TIM.TYPES.MSG_FILE:
 
-          data.messageInfo.content = t('TUIChat.文件') + data.message?.payload?.fileName;
 
+          data.messageInfo.content = t("TUIChat.文件") + data.message?.payload?.fileName;
 
           data.messageInfo.isImg = false;
 
           data.messageInfo.isImg = false;
 
           break;
 
           break;
 
         case ReadReceiptDialog.TUIServer.TUICore.TIM.TYPES.MSG_FACE:
 
         case ReadReceiptDialog.TUIServer.TUICore.TIM.TYPES.MSG_FACE:
 
@@ -315,7 +286,7 @@ const ReadReceiptDialog = defineComponent({
 
     };
 
     };
 
 
 
     const handleDialogPosition = () => {
 
     const handleDialogPosition = () => {
 
-      data.isMenuOpen = !!document?.getElementsByClassName('home-menu')?.length;
 
+      data.isMenuOpen = !!document?.getElementsByClassName("home-menu")?.length;
 
     };
 
     };
 
 
 
     return {
 
     return {

+ 55 - 131
src/TUIKit/TUIComponents/container/TUIChat/plugin-components/replies/replies-item.vue
View File 

@@ -1,108 +1,36 @@
 
 <template>
 
 <template>
 
   <div class="replies-item" :class="!isRoot ? 'replies-item-normal' : ''">
 
   <div class="replies-item" :class="!isRoot ? 'replies-item-normal' : ''">
 
     <div class="message-bubble" ref="htmlRefHook">
 
     <div class="message-bubble" ref="htmlRefHook">
 
-      <img
 
-        class="avatar"
 
-        :src="
 
-          message?.avatar ||
 
-          'https://news-info.ks3-cn-beijing.ksyuncs.com/07/1690787574969.png'
 
-        "
 
-        onerror="this.src='https://news-info.ks3-cn-beijing.ksyuncs.com/07/1690787574969.png'"
 
-      />
 
+      <img class="avatar" :src="message?.avatar || 'https://oss.dayaedu.com/news-info/07/1690787574969.png'" onerror="this.src='https://oss.dayaedu.com/news-info/07/1690787574969.png'" />
 
       <main class="message-area">
 
       <main class="message-area">
 
         <div class="message-area-title">
 
         <div class="message-area-title">
 
           <label class="name">
 
           <label class="name">
 
-            {{
 
-              isRoot
 
-                ? message.nameCard || message.nick || message.from
 
-                : message.messageSender
 
-            }}
 
+            {{ isRoot ? message.nameCard || message.nick || message.from : message.messageSender }}
 
           </label>
 
           </label>
 
           <label class="time">
 
           <label class="time">
 
-            {{
 
-              caculateTimeago(
 
-                (isRoot ? message?.time : message?.messageTime) * 1000
 
-              )
 
-            }}
 
+            {{ caculateTimeago((isRoot ? message?.time : message?.messageTime) * 1000) }}
 
           </label>
 
           </label>
 
         </div>
 
         </div>
 
         <div class="content content-in">
 
         <div class="content content-in">
 
-          <MessageText
 
-            v-if="
 
-              message.messageType === constant.typeText ||
 
-              message.type === TIM.TYPES.MSG_TEXT ||
 
-              !isRoot
 
-            "
 
-            :data="
 
-              handleTextMessageShowContext(
 
-                isRoot
 
-                  ? message
 
-                  : { payload: { text: message?.messageAbstract } }
 
-              )
 
-            "
 
-          />
 
-          <span
 
-            v-if="
 
-              message.messageType === constant.typeCustom ||
 
-              message.type === TIM.TYPES.MSG_CUSTOM
 
-            "
 
-          >
 
+          <MessageText v-if="message.messageType === constant.typeText || message.type === TIM.TYPES.MSG_TEXT || !isRoot" :data="handleTextMessageShowContext(isRoot ? message : { payload: { text: message?.messageAbstract } })" />
 
+          <span v-if="message.messageType === constant.typeCustom || message.type === TIM.TYPES.MSG_CUSTOM">
 
             {{ handleCustomMessageShowContext(message)?.custom }}
 
             {{ handleCustomMessageShowContext(message)?.custom }}
 
           </span>
 
           </span>
 
-          <img
 
-            v-if="
 
-              message.messageType === constant.typeImage ||
 
-              message.type === TIM.TYPES.MSG_IMAGE
 
-            "
 
-            class="message-img"
 
-            :src="message?.payload?.imageInfoArray[1].url"
 
-          />
 
-          <div
 
-            v-if="
 
-              message.messageType === constant.typeAudio ||
 
-              message.type === TIM.TYPES.MSG_AUDIO
 
-            "
 
-            class="message-audio"
 
-            :style="`width: ${message?.payload?.second * 10 + 40}Px`"
 
-          >
 
+          <img v-if="message.messageType === constant.typeImage || message.type === TIM.TYPES.MSG_IMAGE" class="message-img" :src="message?.payload?.imageInfoArray[1].url" />
 
+          <div v-if="message.messageType === constant.typeAudio || message.type === TIM.TYPES.MSG_AUDIO" class="message-audio" :style="`width: ${message?.payload?.second * 10 + 40}Px`">
 
             <i class="icon icon-voice"></i>
 
             <i class="icon icon-voice"></i>
 
             <label>{{ message?.payload?.second }}s</label>
 
             <label>{{ message?.payload?.second }}s</label>
 
           </div>
 
           </div>
 
-          <div
 
-            v-if="
 
-              message.messageType === constant.typeVideo ||
 
-              message.type === TIM.TYPES.MSG_VIDEO
 
-            "
 
-            class="message-video-cover"
 
-          >
 
-            <img
 
-              class="message-videoimg"
 
-              :src="message?.payload?.snapshotUrl || message?.payload?.thumbUrl"
 
-            />
 
+          <div v-if="message.messageType === constant.typeVideo || message.type === TIM.TYPES.MSG_VIDEO" class="message-video-cover">
 
+            <img class="message-videoimg" :src="message?.payload?.snapshotUrl || message?.payload?.thumbUrl" />
 
           </div>
 
           </div>
 
-          <img
 
-            v-if="
 
-              message.messageType === constant.typeFace ||
 
-              message.type === TIM.TYPES.MSG_FACE
 
-            "
 
-            class="message-img"
 
-            :src="url"
 
-          />
 
-          <div
 
-            v-if="
 
-              message.messageType === constant.typeFile ||
 
-              message.type === TIM.TYPES.MSG_FILE
 
-            "
 
-            class="message-file"
 
-          >
 
+          <img v-if="message.messageType === constant.typeFace || message.type === TIM.TYPES.MSG_FACE" class="message-img" :src="url" />
 
+          <div v-if="message.messageType === constant.typeFile || message.type === TIM.TYPES.MSG_FILE" class="message-file">
 
             <i class="icon icon-files"></i>
 
             <i class="icon icon-files"></i>
 
             <div class="message-file-content">
 
             <div class="message-file-content">
 
               <label>{{ message?.payload?.fileName }}</label>
 
               <label>{{ message?.payload?.fileName }}</label>
 
               <span>
 
               <span>
 
-                {{
 
-                  handleFileMessageShowContext(message)?.size ||
 
-                  message?.payload?.fileSize
 
-                }}
 
+                {{ handleFileMessageShowContext(message)?.size || message?.payload?.fileSize }}
 
               </span>
 
               </span>
 
             </div>
 
             </div>
 
           </div>
 
           </div>
 
@@ -113,44 +41,40 @@
 
   </div>
 
   </div>
 
 </template>
 
 </template>
 
 <script lang="ts">
 
 <script lang="ts">
 
-import { defineComponent, reactive, toRefs, watchEffect } from 'vue';
 
-import { Message } from '../../interface';
 
-import {
 
-  handleTextMessageShowContext,
 
-  handleCustomMessageShowContext,
 
-  handleFileMessageShowContext
 
-} from '../../utils/utils';
 
-import { MessageText, MessageEmojiReact } from '../../components';
 
-import { caculateTimeago } from '../../../utils';
 
-import constant from '../../../constant';
 
-import TIM from '../../../../../TUICore/tim/index';
 
+import { defineComponent, reactive, toRefs, watchEffect } from "vue";
 
+import { Message } from "../../interface";
 
+import { handleTextMessageShowContext, handleCustomMessageShowContext, handleFileMessageShowContext } from "../../utils/utils";
 
+import { MessageText, MessageEmojiReact } from "../../components";
 
+import { caculateTimeago } from "../../../utils";
 
+import constant from "../../../constant";
 
+import TIM from "../../../../../TUICore/tim/index";
 
 const RepliesItem = defineComponent({
 
 const RepliesItem = defineComponent({
 
   props: {
 
   props: {
 
     message: {
 
     message: {
 
       type: Object,
 
       type: Object,
 
-      default: () => ({})
 
+      default: () => ({}),
 
     },
 
     },
 
     isH5: {
 
     isH5: {
 
       type: Boolean,
 
       type: Boolean,
 
-      default: false
 
+      default: false,
 
     },
 
     },
 
     isRoot: {
 
     isRoot: {
 
       type: Boolean,
 
       type: Boolean,
 
-      default: false
 
-    }
 
+      default: false,
 
+    },
 
   },
 
   },
 
   components: {
 
   components: {
 
     MessageText,
 
     MessageText,
 
-    MessageEmojiReact
 
+    MessageEmojiReact,
 
   },
 
   },
 
   setup(props: any, ctx: any) {
 
   setup(props: any, ctx: any) {
 
     const data = reactive({
 
     const data = reactive({
 
       message: {} as Message,
 
       message: {} as Message,
 
       isH5: false,
 
       isH5: false,
 
-      url: '',
 
+      url: "",
 
       isRoot: false,
 
       isRoot: false,
 
       constant,
 
       constant,
 
-      TIM
 
+      TIM,
 
     });
 
     });
 
     watchEffect(() => {
 
     watchEffect(() => {
 
       data.message = props.message;
 
       data.message = props.message;
 
@@ -165,37 +89,37 @@ const RepliesItem = defineComponent({
 
       handleTextMessageShowContext,
 
       handleTextMessageShowContext,
 
       handleCustomMessageShowContext,
 
       handleCustomMessageShowContext,
 
       handleFileMessageShowContext,
 
       handleFileMessageShowContext,
 
-      caculateTimeago
 
+      caculateTimeago,
 
     };
 
     };
 
-  }
 
+  },
 
 });
 
 });
 
 export default RepliesItem;
 
 export default RepliesItem;
 
 </script>
 
 </script>
 
 <style lang="scss" scoped>
 
 <style lang="scss" scoped>
 
 .replies-item {
 
 .replies-item {
 
-  padding: 15Px;
 
+  padding: 15px;
 
   width: auto;
 
   width: auto;
 
   &-normal {
 
   &-normal {
 
-    padding: 12.8Px 15Px 0 17Px;
 
+    padding: 12.8px 15px 0 17px;
 
     .message-bubble {
 
     .message-bubble {
 
       padding-bottom: 0;
 
       padding-bottom: 0;
 
       .avatar {
 
       .avatar {
 
-        width: 48Px;
 
-        height: 48Px;
 
-        border-radius: 8Px;
 
+        width: 48px;
 
+        height: 48px;
 
+        border-radius: 8px;
 
       }
 
       }
 
       .message-area {
 
       .message-area {
 
-        padding: 0 0 8Px 0;
 
-        margin: 0 0 0 16Px;
 
-        border-bottom: 0.1Px solid #dbdbdb;
 
+        padding: 0 0 8px 0;
 
+        margin: 0 0 0 16px;
 
+        border-bottom: 0.1px solid #dbdbdb;
 
         &-title {
 
         &-title {
 
           .name {
 
           .name {
 
-            font-size: 14Px;
 
-            line-height: 20Px;
 
+            font-size: 14px;
 
+            line-height: 20px;
 
           }
 
           }
 
           .time {
 
           .time {
 
-            font-size: 12Px;
 
-            line-height: 18Px;
 
+            font-size: 12px;
 
+            line-height: 18px;
 
           }
 
           }
 
         }
 
         }
 
         .content,
 
         .content,
 
@@ -203,31 +127,31 @@ export default RepliesItem;
 
           background: inherit;
 
           background: inherit;
 
           border-radius: 0;
 
           border-radius: 0;
 
           padding: 0;
 
           padding: 0;
 
-          line-height: 22Px;
 
+          line-height: 22px;
 
         }
 
         }
 
       }
 
       }
 
     }
 
     }
 
   }
 
   }
 
   .avatar {
 
   .avatar {
 
-    width: 36Px;
 
-    height: 36Px;
 
-    border-radius: 5Px;
 
+    width: 36px;
 
+    height: 36px;
 
+    border-radius: 5px;
 
   }
 
   }
 
   .message-bubble {
 
   .message-bubble {
 
     width: 100%;
 
     width: 100%;
 
     display: flex;
 
     display: flex;
 
-    padding-bottom: 5Px;
 
+    padding-bottom: 5px;
 
   }
 
   }
 
   .line-left {
 
   .line-left {
 
-    border: 1Px solid rgba(0, 110, 255, 0.5);
 
+    border: 1px solid rgba(0, 110, 255, 0.5);
 
   }
 
   }
 
 
 
   .message-area {
 
   .message-area {
 
-    max-width: calc(100% - 54Px);
 
+    max-width: calc(100% - 54px);
 
     position: relative;
 
     position: relative;
 
     display: flex;
 
     display: flex;
 
     flex-direction: column;
 
     flex-direction: column;
 
-    padding: 0 8Px;
 
+    padding: 0 8px;
 
     flex: 1;
 
     flex: 1;
 
     &-title {
 
     &-title {
 
       display: flex;
 
       display: flex;
 
@@ -235,7 +159,7 @@ export default RepliesItem;
 
       justify-content: space-between;
 
       justify-content: space-between;
 
       .name,
 
       .name,
 
       .time {
 
       .time {
 
-        padding-bottom: 4Px;
 
+        padding-bottom: 4px;
 
         font-weight: 400;
 
         font-weight: 400;
 
         font-size: 0.8rem;
 
         font-size: 0.8rem;
 
         color: #999999;
 
         color: #999999;
 
@@ -249,9 +173,9 @@ export default RepliesItem;
 
       }
 
       }
 
     }
 
     }
 
     .content {
 
     .content {
 
-      padding: 12Px;
 
+      padding: 12px;
 
       font-weight: 400;
 
       font-weight: 400;
 
-      font-size: 14Px;
 
+      font-size: 14px;
 
       color: #000000;
 
       color: #000000;
 
       letter-spacing: 0;
 
       letter-spacing: 0;
 
       word-wrap: break-word;
 
       word-wrap: break-word;
 
@@ -259,14 +183,14 @@ export default RepliesItem;
 
       width: fit-content;
 
       width: fit-content;
 
       &-in {
 
       &-in {
 
         background: #f2f2f2;
 
         background: #f2f2f2;
 
-        border-radius: 0Px 10Px 10Px 10Px;
 
+        border-radius: 0px 10px 10px 10px;
 
         .message-img,
 
         .message-img,
 
         .message-videoimg {
 
         .message-videoimg {
 
           width: inherit;
 
           width: inherit;
 
           height: inherit;
 
           height: inherit;
 
           max-height: 100%;
 
           max-height: 100%;
 
           max-width: 100%;
 
           max-width: 100%;
 
-          max-height: 300Px;
 
+          max-height: 300px;
 
         }
 
         }
 
       }
 
       }
 
     }
 
     }
 
@@ -275,7 +199,7 @@ export default RepliesItem;
 
     align-self: flex-end;
 
     align-self: flex-end;
 
     font-family: PingFangSC-Regular;
 
     font-family: PingFangSC-Regular;
 
     font-weight: 400;
 
     font-weight: 400;
 
-    font-size: 12Px;
 
+    font-size: 12px;
 
     color: #b6b8ba;
 
     color: #b6b8ba;
 
     word-break: keep-all;
 
     word-break: keep-all;
 
   }
 
   }
 
@@ -298,7 +222,7 @@ export default RepliesItem;
 
     max-width: 100%;
 
     max-width: 100%;
 
     overflow: hidden;
 
     overflow: hidden;
 
     .icon {
 
     .icon {
 
-      margin: 0 4Px;
 
+      margin: 0 4px;
 
     }
 
     }
 
     audio {
 
     audio {
 
       width: 0;
 
       width: 0;

+ 2 - 2
src/TUIKit/TUIComponents/container/TUIChat/utils/dist/utils.js
View File 

@@ -64,14 +64,14 @@ function handleAvatar(item) {
 
         ? (_b = item === null || item === void 0 ? void 0 : item.userProfile) === null || _b === void 0
 
         ? (_b = item === null || item === void 0 ? void 0 : item.userProfile) === null || _b === void 0
 
           ? void 0
 
           ? void 0
 
           : _b.avatar
 
           : _b.avatar
 
-        : "https://news-info.ks3-cn-beijing.ksyuncs.com/07/1690787574969.png";
 
+        : "https://oss.dayaedu.com/news-info/07/1690787574969.png";
 
       break;
 
       break;
 
     case tim_1["default"].TYPES.CONV_GROUP:
 
     case tim_1["default"].TYPES.CONV_GROUP:
 
       avatar = isUrl((_c = item === null || item === void 0 ? void 0 : item.groupProfile) === null || _c === void 0 ? void 0 : _c.avatar)
 
       avatar = isUrl((_c = item === null || item === void 0 ? void 0 : item.groupProfile) === null || _c === void 0 ? void 0 : _c.avatar)
 
         ? (_d = item === null || item === void 0 ? void 0 : item.groupProfile) === null || _d === void 0
 
         ? (_d = item === null || item === void 0 ? void 0 : item.groupProfile) === null || _d === void 0
 
           ? void 0
 
           ? void 0
 
           : _d.avatar
 
           : _d.avatar
 
-        : "https://news-info.ks3-cn-beijing.ksyuncs.com/07/1690775328089.png";
 
+        : "https://oss.dayaedu.com/news-info/07/1690775328089.png";
 
       break;
 
       break;
 
     case tim_1["default"].TYPES.CONV_SYSTEM:
 
     case tim_1["default"].TYPES.CONV_SYSTEM:
 
       avatar = isUrl((_e = item === null || item === void 0 ? void 0 : item.groupProfile) === null || _e === void 0 ? void 0 : _e.avatar)
 
       avatar = isUrl((_e = item === null || item === void 0 ? void 0 : item.groupProfile) === null || _e === void 0 ? void 0 : _e.avatar)

+ 4 - 2
src/TUIKit/TUIComponents/container/TUIChat/utils/utils.ts
View File 

@@ -9,10 +9,10 @@ export function handleAvatar(item: any) {
 
   let avatar = "";
 
   let avatar = "";
 
   switch (item.type) {
 
   switch (item.type) {
 
     case TIM.TYPES.CONV_C2C:
 
     case TIM.TYPES.CONV_C2C:
 
-      avatar = isUrl(item?.userProfile?.avatar) ? item?.userProfile?.avatar : "https://news-info.ks3-cn-beijing.ksyuncs.com/07/1690787574969.png";
 
+      avatar = isUrl(item?.userProfile?.avatar) ? item?.userProfile?.avatar : "https://oss.dayaedu.com/news-info/07/1690787574969.png";
 
       break;
 
       break;
 
     case TIM.TYPES.CONV_GROUP:
 
     case TIM.TYPES.CONV_GROUP:
 
-      avatar = isUrl(item?.groupProfile?.avatar) ? item?.groupProfile?.avatar : "https://news-info.ks3-cn-beijing.ksyuncs.com/07/1690775328089.png";
 
+      avatar = isUrl(item?.groupProfile?.avatar) ? item?.groupProfile?.avatar : "https://oss.dayaedu.com/news-info/07/1690775328089.png";
 
       break;
 
       break;
 
     case TIM.TYPES.CONV_SYSTEM:
 
     case TIM.TYPES.CONV_SYSTEM:
 
       avatar = isUrl(item?.groupProfile?.avatar) ? item?.groupProfile?.avatar : "https://web.sdk.qcloud.com/component/TUIKit/assets/group_avatar.png";
 
       avatar = isUrl(item?.groupProfile?.avatar) ? item?.groupProfile?.avatar : "https://web.sdk.qcloud.com/component/TUIKit/assets/group_avatar.png";
 
@@ -115,6 +115,8 @@ export function handleShowLastMessage(item: any) {
 
     if (data?.businessID === 1) {
 
     if (data?.businessID === 1) {
 
       lastMessagePayload = extractCallingInfoFromMessage(lastMessage);
 
       lastMessagePayload = extractCallingInfoFromMessage(lastMessage);
 
       return lastMessagePayload;
 
       return lastMessagePayload;
 
+    } else if(data?.businessID === "TC_GROUP_NOTICE") {
 
+      return '[群公告]'
 
     }
 
     }
 
     lastMessagePayload = lastMessage?.messageForShow;
 
     lastMessagePayload = lastMessage?.messageForShow;
 
   } else {
 
   } else {

+ 48 - 125
src/TUIKit/TUIComponents/container/TUIContact/index.vue
View File 

@@ -32,31 +32,18 @@
 
         <ul class="TUI-contact-column" v-if="!isSearch">
 
         <ul class="TUI-contact-column" v-if="!isSearch">
 
           <li class="TUI-contact-column-item">
 
           <li class="TUI-contact-column-item">
 
             <header @click="select('system')">
 
             <header @click="select('system')">
 
-              <i
 
-                class="icon icon-right"
 
-                :class="[columnName === 'system' && 'icon-down']"
 
-              ></i>
 
+              <i class="icon icon-right" :class="[columnName === 'system' && 'icon-down']"></i>
 
               <main>
 
               <main>
 
-                <label>{{ $t('TUIContact.群聊通知') }}</label>
 
-                <span
 
-                  class="num"
 
-                  v-if="
 
-                    systemConversation && systemConversation.unreadCount > 0
 
-                  "
 
-                >
 
+                <label>{{ $t("TUIContact.群聊通知") }}</label>
 
+                <span class="num" v-if="systemConversation && systemConversation.unreadCount > 0">
 
                   {{ systemConversation.unreadCount }}
 
                   {{ systemConversation.unreadCount }}
 
                 </span>
 
                 </span>
 
               </main>
 
               </main>
 
             </header>
 
             </header>
 
             <ul class="TUI-contact-list" v-if="columnName === 'system'">
 
             <ul class="TUI-contact-list" v-if="columnName === 'system'">
 
               <li class="TUI-contact-list-item selected not-aside">
 
               <li class="TUI-contact-list-item selected not-aside">
 
-                <label>{{ $t('TUIContact.系统通知') }}</label>
 
-                <span
 
-                  class="num"
 
-                  v-if="
 
-                    systemConversation && systemConversation.unreadCount > 0
 
-                  "
 
-                >
 
+                <label>{{ $t("TUIContact.系统通知") }}</label>
 
+                <span class="num" v-if="systemConversation && systemConversation.unreadCount > 0">
 
                   {{ systemConversation.unreadCount }}
 
                   {{ systemConversation.unreadCount }}
 
                 </span>
 
                 </span>
 
               </li>
 
               </li>
 
@@ -64,31 +51,15 @@
 
           </li>
 
           </li>
 
           <li class="TUI-contact-column-item">
 
           <li class="TUI-contact-column-item">
 
             <header @click="select('group')">
 
             <header @click="select('group')">
 
-              <i
 
-                class="icon icon-right"
 
-                :class="[columnName === 'group' && 'icon-down']"
 
-              ></i>
 
+              <i class="icon icon-right" :class="[columnName === 'group' && 'icon-down']"></i>
 
               <main>
 
               <main>
 
-                <label>{{ $t('TUIContact.我的群聊') }}</label>
 
+                <label>{{ $t("TUIContact.我的群聊") }}</label>
 
               </main>
 
               </main>
 
             </header>
 
             </header>
 
             <ul class="TUI-contact-list" v-show="columnName === 'group'">
 
             <ul class="TUI-contact-list" v-show="columnName === 'group'">
 
-              <li
 
-                class="TUI-contact-list-item"
 
-                :class="[currentGroup?.groupID === item?.groupID && 'selected']"
 
-                v-for="(item, index) in groupList"
 
-                :key="index"
 
-                @click="handleListItem(item)"
 
-              >
 
+              <li class="TUI-contact-list-item" :class="[currentGroup?.groupID === item?.groupID && 'selected']" v-for="(item, index) in groupList" :key="index" @click="handleListItem(item)">
 
                 <aside class="left">
 
                 <aside class="left">
 
-                  <img
 
-                    class="avatar"
 
-                    :src="
 
-                      item?.avatar ||
 
-                      'https://news-info.ks3-cn-beijing.ksyuncs.com/07/1690775328089.png'
 
-                    "
 
-                    onerror="this.src='https://news-info.ks3-cn-beijing.ksyuncs.com/07/1690775328089.png'"
 
-                  />
 
+                  <img class="avatar" :src="item?.avatar || 'https://oss.dayaedu.com/news-info/07/1690775328089.png'" onerror="this.src='https://oss.dayaedu.com/news-info/07/1690775328089.png'" />
 
                 </aside>
 
                 </aside>
 
                 <main class="content">
 
                 <main class="content">
 
                   <ul>
 
                   <ul>
 
@@ -105,40 +76,16 @@
 
           </li>
 
           </li>
 
           <li class="TUI-contact-column-item">
 
           <li class="TUI-contact-column-item">
 
             <header @click="select('friend')">
 
             <header @click="select('friend')">
 
-              <i
 
-                class="icon icon-right"
 
-                :class="[columnName === 'friend' && 'icon-down']"
 
-              ></i>
 
+              <i class="icon icon-right" :class="[columnName === 'friend' && 'icon-down']"></i>
 
               <main>
 
               <main>
 
-                <label>{{ $t('TUIContact.我的好友') }}</label>
 
+                <label>{{ $t("TUIContact.我的好友") }}</label>
 
               </main>
 
               </main>
 
             </header>
 
             </header>
 
             <ul class="TUI-contact-list" v-show="columnName === 'friend'">
 
             <ul class="TUI-contact-list" v-show="columnName === 'friend'">
 
-              <li
 
-                class="TUI-contact-list-item"
 
-                :class="[currentFriend?.userID === item?.userID && 'selected']"
 
-                v-for="(item, index) in friendList"
 
-                :key="index"
 
-                @click="handleListItem(item)"
 
-              >
 
+              <li class="TUI-contact-list-item" :class="[currentFriend?.userID === item?.userID && 'selected']" v-for="(item, index) in friendList" :key="index" @click="handleListItem(item)">
 
                 <aside class="left">
 
                 <aside class="left">
 
-                  <img
 
-                    class="avatar"
 
-                    :src="
 
-                      item?.profile?.avatar ||
 
-                      'https://news-info.ks3-cn-beijing.ksyuncs.com/07/1690787574969.png'
 
-                    "
 
-                    onerror="this.src='https://news-info.ks3-cn-beijing.ksyuncs.com/07/1690787574969.png'"
 
-                  />
 
-                  <div
 
-                    class="online-status"
 
-                    :class="
 
-                      userStatusList.get(item?.userID)?.statusType === 1
 
-                        ? 'online-status-online'
 
-                        : 'online-status-offline'
 
-                    "
 
-                    v-if="displayOnlineStatus"
 
-                  ></div>
 
+                  <img class="avatar" :src="item?.profile?.avatar || 'https://oss.dayaedu.com/news-info/07/1690787574969.png'" onerror="this.src='https://oss.dayaedu.com/news-info/07/1690787574969.png'" />
 
+                  <div class="online-status" :class="userStatusList.get(item?.userID)?.statusType === 1 ? 'online-status-online' : 'online-status-offline'" v-if="displayOnlineStatus"></div>
 
                 </aside>
 
                 </aside>
 
                 <main class="content">
 
                 <main class="content">
 
                   <ul>
 
                   <ul>
 
@@ -152,23 +99,9 @@
 
           </li>
 
           </li>
 
         </ul>
 
         </ul>
 
         <ul class="TUI-contact-list" v-else>
 
         <ul class="TUI-contact-list" v-else>
 
-          <li
 
-            v-if="!!searchGroup?.groupID"
 
-            class="TUI-contact-list-item"
 
-            :class="[
 
-              currentGroup?.groupID === searchGroup?.groupID && 'selected'
 
-            ]"
 
-            @click="handleListItem(searchGroup)"
 
-          >
 
+          <li v-if="!!searchGroup?.groupID" class="TUI-contact-list-item" :class="[currentGroup?.groupID === searchGroup?.groupID && 'selected']" @click="handleListItem(searchGroup)">
 
             <aside class="left">
 
             <aside class="left">
 
-              <img
 
-                class="avatar"
 
-                :src="
 
-                  searchGroup?.avatar ||
 
-                  'https://news-info.ks3-cn-beijing.ksyuncs.com/07/1690775328089.png'
 
-                "
 
-                onerror="this.src='https://news-info.ks3-cn-beijing.ksyuncs.com/07/1690775328089.png'"
 
-              />
 
+              <img class="avatar" :src="searchGroup?.avatar || 'https://oss.dayaedu.com/news-info/07/1690775328089.png'" onerror="this.src='https://oss.dayaedu.com/news-info/07/1690775328089.png'" />
 
             </aside>
 
             </aside>
 
             <main class="content">
 
             <main class="content">
 
               <ul>
 
               <ul>
 
@@ -214,7 +147,7 @@
 
                 currentGroup?.avatar ||
 
                 currentGroup?.avatar ||
 
                 'https://web.sdk.qcloud.com/component/TUIKit/assets/group_avatar.png'
 
                 'https://web.sdk.qcloud.com/component/TUIKit/assets/group_avatar.png'
 
               "
 
               "
 
-              onerror="this.src='https://news-info.ks3-cn-beijing.ksyuncs.com/07/1690775328089.png'"
 
+              onerror="this.src='https://oss.dayaedu.com/news-info/07/1690775328089.png'"
 
             />
 
             />
 
           </header>
 
           </header>
 
           <main class="TUI-contact-main-info-main" v-if="isNeedPermission">
 
           <main class="TUI-contact-main-info-main" v-if="isNeedPermission">
 
@@ -288,9 +221,9 @@
 
               class="avatar"
 
               class="avatar"
 
               :src="
 
               :src="
 
                 currentFriend?.profile?.avatar ||
 
                 currentFriend?.profile?.avatar ||
 
-                'https://news-info.ks3-cn-beijing.ksyuncs.com/07/1690787574969.png'
 
+                'https://oss.dayaedu.com/news-info/07/1690787574969.png'
 
               "
 
               "
 
-              onerror="this.src='https://news-info.ks3-cn-beijing.ksyuncs.com/07/1690787574969.png'"
 
+              onerror="this.src='https://oss.dayaedu.com/news-info/07/1690787574969.png'"
 
             />
 
             />
 
           </header>
 
           </header>
 
 
 
@@ -320,20 +253,20 @@
 
   </transition>
 
   </transition>
 
 </template>
 
 </template>
 
 <script lang="ts">
 
 <script lang="ts">
 
-import { computed, defineComponent, reactive, toRefs, watch } from 'vue';
 
+import { computed, defineComponent, reactive, toRefs, watch } from "vue";
 
 // import MessageSystem from './components/message-system.vue';
 
 // import MessageSystem from './components/message-system.vue';
 
-import { handleErrorPrompts, isArrayEqual } from '../utils';
 
+import { handleErrorPrompts, isArrayEqual } from "../utils";
 
 
 
 const TUIContact = defineComponent({
 
 const TUIContact = defineComponent({
 
-  name: 'TUIContact',
 
+  name: "TUIContact",
 
   components: {
 
   components: {
 
     // MessageSystem
 
     // MessageSystem
 
   },
 
   },
 
   props: {
 
   props: {
 
     displayOnlineStatus: {
 
     displayOnlineStatus: {
 
       type: Boolean,
 
       type: Boolean,
 
-      default: false
 
-    }
 
+      default: false,
 
+    },
 
   },
 
   },
 
   setup(props: any, ctx: any) {
 
   setup(props: any, ctx: any) {
 
     const TUIServer: any = TUIContact.TUIServer;
 
     const TUIServer: any = TUIContact.TUIServer;
 
@@ -341,13 +274,13 @@ const TUIContact = defineComponent({
 
     const data = reactive({
 
     const data = reactive({
 
       groupList: [],
 
       groupList: [],
 
       searchGroup: {},
 
       searchGroup: {},
 
-      searchID: '',
 
+      searchID: "",
 
       currentGroup: null,
 
       currentGroup: null,
 
       systemConversation: {
 
       systemConversation: {
 
-        unreadCount: 0
 
+        unreadCount: 0,
 
       },
 
       },
 
       systemMessageList: [],
 
       systemMessageList: [],
 
-      columnName: '',
 
+      columnName: "",
 
       types: TUIServer.TUICore.TIM.TYPES,
 
       types: TUIServer.TUICore.TIM.TYPES,
 
       isSearch: false,
 
       isSearch: false,
 
       env: TUIServer.TUICore.TUIEnv,
 
       env: TUIServer.TUICore.TUIEnv,
 
@@ -356,7 +289,7 @@ const TUIContact = defineComponent({
 
       currentFriend: {},
 
       currentFriend: {},
 
       displayOnlineStatus: false,
 
       displayOnlineStatus: false,
 
       onlineStatus: false,
 
       onlineStatus: false,
 
-      userStatusList: new Map()
 
+      userStatusList: new Map(),
 
     });
 
     });
 
 
 
     TUIServer.bind(data);
 
     TUIServer.bind(data);
 
@@ -369,7 +302,7 @@ const TUIContact = defineComponent({
 
         TUIServer.handleUserStatus(data.displayOnlineStatus, data.userIDList);
 
         TUIServer.handleUserStatus(data.displayOnlineStatus, data.userIDList);
 
       },
 
       },
 
       {
 
       {
 
-        immediate: true
 
+        immediate: true,
 
       }
 
       }
 
     );
 
     );
 
 
 
@@ -383,18 +316,16 @@ const TUIContact = defineComponent({
 
 
 
     const isNeedPermission = computed(() => {
 
     const isNeedPermission = computed(() => {
 
       const isHaveSeif = (data.currentGroup as any).selfInfo.userID;
 
       const isHaveSeif = (data.currentGroup as any).selfInfo.userID;
 
-      const isPermission =
 
-        (data.currentGroup as any).joinOption ===
 
-        TUIServer.TUICore.TIM.TYPES.JOIN_OPTIONS_NEED_PERMISSION;
 
+      const isPermission = (data.currentGroup as any).joinOption === TUIServer.TUICore.TIM.TYPES.JOIN_OPTIONS_NEED_PERMISSION;
 
       return !isHaveSeif && isPermission;
 
       return !isHaveSeif && isPermission;
 
     });
 
     });
 
 
 
     const handleListItem = async (item: any) => {
 
     const handleListItem = async (item: any) => {
 
       switch (data.columnName) {
 
       switch (data.columnName) {
 
-        case 'group':
 
+        case "group":
 
           data.currentGroup = item;
 
           data.currentGroup = item;
 
           break;
 
           break;
 
-        case 'friend':
 
+        case "friend":
 
           data.currentFriend = item;
 
           data.currentFriend = item;
 
           break;
 
           break;
 
       }
 
       }
 
@@ -409,7 +340,7 @@ const TUIContact = defineComponent({
 
         try {
 
         try {
 
           await TUIServer.searchGroupByID(data.searchID.trim());
 
           await TUIServer.searchGroupByID(data.searchID.trim());
 
         } catch (error) {
 
         } catch (error) {
 
-          const message = t('TUIContact.该群组不存在');
 
+          const message = t("TUIContact.该群组不存在");
 
           handleErrorPrompts(message, data.env);
 
           handleErrorPrompts(message, data.env);
 
         }
 
         }
 
       }
 
       }
 
@@ -418,8 +349,8 @@ const TUIContact = defineComponent({
 
     const join = async (group: any) => {
 
     const join = async (group: any) => {
 
       const options: any = {
 
       const options: any = {
 
         groupID: group.groupID,
 
         groupID: group.groupID,
 
-        applyMessage: group.applyMessage || t('TUIContact.加群'),
 
-        type: group?.type
 
+        applyMessage: group.applyMessage || t("TUIContact.加群"),
 
+        type: group?.type,
 
       };
 
       };
 
       await TUIServer.joinGroup(options);
 
       await TUIServer.joinGroup(options);
 
       (data.currentGroup as any).apply = true;
 
       (data.currentGroup as any).apply = true;
 
@@ -432,14 +363,10 @@ const TUIContact = defineComponent({
 
 
 
     const enter = async (ID: any, type: string) => {
 
     const enter = async (ID: any, type: string) => {
 
       const name = `${type}${ID}`;
 
       const name = `${type}${ID}`;
 
-      TUIServer.TUICore.TUIServer.TUIConversation.getConversationProfile(
 
-        name
 
-      ).then((imResponse: any) => {
 
+      TUIServer.TUICore.TUIServer.TUIConversation.getConversationProfile(name).then((imResponse: any) => {
 
         // 通知 TUIConversation 添加当前会话
 
         // 通知 TUIConversation 添加当前会话
 
         // Notify TUIConversation to toggle the current conversation
 
         // Notify TUIConversation to toggle the current conversation
 
-        TUIServer.TUICore.TUIServer.TUIConversation.handleCurrentConversation(
 
-          imResponse.data.conversation
 
-        );
 
+        TUIServer.TUICore.TUIServer.TUIConversation.handleCurrentConversation(imResponse.data.conversation);
 
         back();
 
         back();
 
       });
 
       });
 
     };
 
     };
 
@@ -450,36 +377,32 @@ const TUIContact = defineComponent({
 
     };
 
     };
 
 
 
     const select = async (name: string) => {
 
     const select = async (name: string) => {
 
-      if (
 
-        data.columnName !== 'system' &&
 
-        name === 'system' &&
 
-        (data.systemConversation as any)?.conversationID
 
-      ) {
 
+      if (data.columnName !== "system" && name === "system" && (data.systemConversation as any)?.conversationID) {
 
         await TUIServer.getSystemMessageList();
 
         await TUIServer.getSystemMessageList();
 
         await TUIServer.setMessageRead();
 
         await TUIServer.setMessageRead();
 
       }
 
       }
 
       (data.currentGroup as any) = {};
 
       (data.currentGroup as any) = {};
 
-      if (data.columnName !== 'group' && name === 'group' && !data.env.isH5) {
 
+      if (data.columnName !== "group" && name === "group" && !data.env.isH5) {
 
         (data.currentGroup as any) = data.groupList[0];
 
         (data.currentGroup as any) = data.groupList[0];
 
       } else {
 
       } else {
 
         (data.currentGroup as any) = {};
 
         (data.currentGroup as any) = {};
 
       }
 
       }
 
-      data.searchID = '';
 
-      data.columnName = data.columnName === name ? '' : name;
 
+      data.searchID = "";
 
+      data.columnName = data.columnName === name ? "" : name;
 
     };
 
     };
 
 
 
     const toggleSearch = () => {
 
     const toggleSearch = () => {
 
       data.isSearch = !data.isSearch;
 
       data.isSearch = !data.isSearch;
 
-      data.columnName = '';
 
-      data.searchID = '';
 
+      data.columnName = "";
 
+      data.searchID = "";
 
       data.searchGroup = {};
 
       data.searchGroup = {};
 
       (data.currentGroup as any) = {};
 
       (data.currentGroup as any) = {};
 
     };
 
     };
 
 
 
     const init = () => {
 
     const init = () => {
 
       data.isSearch = false;
 
       data.isSearch = false;
 
-      data.columnName = '';
 
-      data.searchID = '';
 
+      data.columnName = "";
 
+      data.searchID = "";
 
       data.searchGroup = {};
 
       data.searchGroup = {};
 
       (data.currentGroup as any) = {};
 
       (data.currentGroup as any) = {};
 
     };
 
     };
 
@@ -490,7 +413,7 @@ const TUIContact = defineComponent({
 
     const back = () => {
 
     const back = () => {
 
       (data.currentGroup as any) = {};
 
       (data.currentGroup as any) = {};
 
       (data.currentFriend as any) = {};
 
       (data.currentFriend as any) = {};
 
-      data.columnName = '';
 
+      data.columnName = "";
 
     };
 
     };
 
 
 
     const getUserStatusList = (userList: Array<string>) => {
 
     const getUserStatusList = (userList: Array<string>) => {
 
@@ -511,9 +434,9 @@ const TUIContact = defineComponent({
 
       init,
 
       init,
 
       back,
 
       back,
 
       enter,
 
       enter,
 
-      getUserStatusList
 
+      getUserStatusList,
 
     };
 
     };
 
-  }
 
+  },
 
 });
 
 });
 
 export default TUIContact;
 
 export default TUIContact;
 
 </script>
 
 </script>

+ 1 - 1
src/TUIKit/TUIComponents/container/TUIConversation/components/list-item/style/web.scss
View File 

@@ -21,7 +21,7 @@
 
         display: inline-block;
 
         display: inline-block;
 
         right: 0Px;
 
         right: 0Px;
 
         top: -5Px;
 
         top: -5Px;
 
-        min-width: 10Px;
 
+        min-width: 15Px;
 
         width: fit-content;
 
         width: fit-content;
 
         padding: 0 2.5Px;
 
         padding: 0 2.5Px;
 
         height: 15Px;
 
         height: 15Px;

+ 1 - 1
src/TUIKit/TUIComponents/container/TUIGroup/index.vue
View File 

@@ -26,7 +26,7 @@
 
           <ul class="TUI-contact-list">
 
           <ul class="TUI-contact-list">
 
             <li class="TUI-contact-list-item" v-for="(item, index) in groupList" :key="index" @click="handleListItem(item)">
 
             <li class="TUI-contact-list-item" v-for="(item, index) in groupList" :key="index" @click="handleListItem(item)">
 
               <aside class="left">
 
               <aside class="left">
 
-                <img class="avatar" :src="item.img || 'https://news-info.ks3-cn-beijing.ksyuncs.com/07/1690775328089.png'" onerror="this.src='https://news-info.ks3-cn-beijing.ksyuncs.com/07/1690775328089.png'" />
 
+                <img class="avatar" :src="item.img || 'https://oss.dayaedu.com/news-info/07/1690775328089.png'" onerror="this.src='https://oss.dayaedu.com/news-info/07/1690775328089.png'" />
 
               </aside>
 
               </aside>
 
               <div class="content-header">
 
               <div class="content-header">
 
                 <label>
 
                 <label>

+ 1 - 1
src/TUIKit/TUIComponents/container/TUIPerson/index.vue
View File 

@@ -26,7 +26,7 @@
 
           <ul class="TUI-contact-list">
 
           <ul class="TUI-contact-list">
 
             <li class="TUI-contact-list-item" v-for="(item, index) in friendList" :key="index" @click="handleListItem(item)">
 
             <li class="TUI-contact-list-item" v-for="(item, index) in friendList" :key="index" @click="handleListItem(item)">
 
               <aside class="left">
 
               <aside class="left">
 
-                <img class="avatar" :src="item.friendAvatar || 'https://news-info.ks3-cn-beijing.ksyuncs.com/07/1690787574969.png'" onerror="this.src='https://news-info.ks3-cn-beijing.ksyuncs.com/07/1690787574969.png'" />
 
+                <img class="avatar" :src="item.friendAvatar || 'https://oss.dayaedu.com/news-info/07/1690787574969.png'" onerror="this.src='https://oss.dayaedu.com/news-info/07/1690787574969.png'" />
 
               </aside>
 
               </aside>
 
               <div class="content-header">
 
               <div class="content-header">
 
                 <label>
 
                 <label>

+ 109 - 129
src/TUIKit/TUIComponents/container/TUIProfile/components/TUIProfileEdit/index.vue
View File 

@@ -1,56 +1,54 @@
 
-<template >
 
-  <div class="edit" :class="[isH5 ? 'edit-h5': '']">
 
+<template>
 
+  <div class="edit" :class="[isH5 ? 'edit-h5' : '']">
 
     <header class="edit-header">
 
     <header class="edit-header">
 
       <i v-if="isH5" class="icon icon-back" @click="cancel"></i>
 
       <i v-if="isH5" class="icon icon-back" @click="cancel"></i>
 
-      <h1 class="edit-header-title">{{$t('TUIProfile.资料设置')}}</h1>
 
+      <h1 class="edit-header-title">{{ $t("TUIProfile.资料设置") }}</h1>
 
     </header>
 
     </header>
 
     <ul class="edit-list">
 
     <ul class="edit-list">
 
       <li class="edit-list-item space-top">
 
       <li class="edit-list-item space-top">
 
-          <main class="edit-list-item-content" @click="setProfile('avatar')">
 
-            <label>{{$t('TUIProfile.头像')}}</label>
 
-            <span v-if="isH5">
 
-              <img
 
-                :src="profile.avatar ? profile.avatar : 'https://news-info.ks3-cn-beijing.ksyuncs.com/07/1690787574969.png'"
 
-                onerror="this.src='https://news-info.ks3-cn-beijing.ksyuncs.com/07/1690787574969.png'">
 
-            </span>
 
-            <ul class="avatar-list" v-else>
 
-              <li class="avatar-list-item" v-for="(item,index) in avatarList"  :key="index" @click="chooseAvatar(item)">
 
-                <img :class="[profile.avatar === item.avatar &&  'selected']" :src="item.avatar" >
 
-              </li>
 
-            </ul>
 
-          </main>
 
-          <i v-if="isH5" class="icon icon-right"></i>
 
+        <main class="edit-list-item-content" @click="setProfile('avatar')">
 
+          <label>{{ $t("TUIProfile.头像") }}</label>
 
+          <span v-if="isH5">
 
+            <img :src="profile.avatar ? profile.avatar : 'https://oss.dayaedu.com/news-info/07/1690787574969.png'" onerror="this.src='https://oss.dayaedu.com/news-info/07/1690787574969.png'" />
 
+          </span>
 
+          <ul class="avatar-list" v-else>
 
+            <li class="avatar-list-item" v-for="(item, index) in avatarList" :key="index" @click="chooseAvatar(item)">
 
+              <img :class="[profile.avatar === item.avatar && 'selected']" :src="item.avatar" />
 
+            </li>
 
+          </ul>
 
+        </main>
 
+        <i v-if="isH5" class="icon icon-right"></i>
 
       </li>
 
       </li>
 
       <li class="edit-list-item space-top">
 
       <li class="edit-list-item space-top">
 
         <main class="edit-list-item-content" @click="setProfile('nick')">
 
         <main class="edit-list-item-content" @click="setProfile('nick')">
 
-          <label>{{$t('TUIProfile.昵称')}}</label>
 
-          <span v-if="isH5">{{profile.nick}}</span>
 
-          <input v-else type="text" v-model="profile.nick">
 
+          <label>{{ $t("TUIProfile.昵称") }}</label>
 
+          <span v-if="isH5">{{ profile.nick }}</span>
 
+          <input v-else type="text" v-model="profile.nick" />
 
         </main>
 
         </main>
 
         <i v-if="isH5" class="icon icon-right"></i>
 
         <i v-if="isH5" class="icon icon-right"></i>
 
       </li>
 
       </li>
 
       <li class="edit-list-item">
 
       <li class="edit-list-item">
 
         <main class="edit-list-item-content">
 
         <main class="edit-list-item-content">
 
-          <label>{{$t('TUIProfile.账号')}}</label>
 
-          <span>{{profile.userID}}</span>
 
+          <label>{{ $t("TUIProfile.账号") }}</label>
 
+          <span>{{ profile.userID }}</span>
 
         </main>
 
         </main>
 
       </li>
 
       </li>
 
       <li class="edit-list-item space-top">
 
       <li class="edit-list-item space-top">
 
         <main class="edit-list-item-content" @click="setProfile('selfSignature')">
 
         <main class="edit-list-item-content" @click="setProfile('selfSignature')">
 
-          <label>{{$t('TUIProfile.个性签名')}}</label>
 
-          <span v-if="isH5">{{profile.selfSignature}}</span>
 
-          <input v-else type="text" v-model="profile.selfSignature">
 
+          <label>{{ $t("TUIProfile.个性签名") }}</label>
 
+          <span v-if="isH5">{{ profile.selfSignature }}</span>
 
+          <input v-else type="text" v-model="profile.selfSignature" />
 
         </main>
 
         </main>
 
         <i v-if="isH5" class="icon icon-right"></i>
 
         <i v-if="isH5" class="icon icon-right"></i>
 
       </li>
 
       </li>
 
       <li class="edit-list-item">
 
       <li class="edit-list-item">
 
         <main class="edit-list-item-content" @click="setProfile('gender')">
 
         <main class="edit-list-item-content" @click="setProfile('gender')">
 
-          <label>{{$t('TUIProfile.性别')}}</label>
 
-          <span v-if="isH5">{{profile.gender ? $t(`TUIProfile.${genderLabel[profile.gender]}`) : ''}}</span>
 
+          <label>{{ $t("TUIProfile.性别") }}</label>
 
+          <span v-if="isH5">{{ profile.gender ? $t(`TUIProfile.${genderLabel[profile.gender]}`) : "" }}</span>
 
           <ul v-else class="gender-list">
 
           <ul v-else class="gender-list">
 
-            <li class="gender-list-item" v-for="(item, index) in type" :key="index"  @click="showChooseGender(item)">
 
+            <li class="gender-list-item" v-for="(item, index) in type" :key="index" @click="showChooseGender(item)">
 
               <i class="gender" :class="[profile.gender === item.type && 'gender-selected']"></i>
 
               <i class="gender" :class="[profile.gender === item.type && 'gender-selected']"></i>
 
-              <p class="name">{{$t(`TUIProfile.${item.label}`)}}</p>
 
+              <p class="name">{{ $t(`TUIProfile.${item.label}`) }}</p>
 
             </li>
 
             </li>
 
           </ul>
 
           </ul>
 
         </main>
 
         </main>
 
@@ -58,65 +56,50 @@
 
       </li>
 
       </li>
 
       <li class="edit-list-item">
 
       <li class="edit-list-item">
 
         <main class="edit-list-item-content" @click="setProfile('birthday')">
 
         <main class="edit-list-item-content" @click="setProfile('birthday')">
 
-          <label>{{$t('TUIProfile.出生年月')}}</label>
 
-          <span v-if="isH5">{{profile.birthday}}</span>
 
-          <Datepicker
 
-            v-else
 
-            :placeholder="$t(`TUIProfile.请选择出生日期`)"
 
-            :enableTimePicker="false"
 
-            :format="format"
 
-            :previewFormat="format"
 
-            :modelValue="birthday"
 
-            @update:modelValue="showBirthday" />
 
+          <label>{{ $t("TUIProfile.出生年月") }}</label>
 
+          <span v-if="isH5">{{ profile.birthday }}</span>
 
+          <Datepicker v-else :placeholder="$t(`TUIProfile.请选择出生日期`)" :enableTimePicker="false" :format="format" :previewFormat="format" :modelValue="birthday" @update:modelValue="showBirthday" />
 
         </main>
 
         </main>
 
         <i v-if="isH5" class="icon icon-right"></i>
 
         <i v-if="isH5" class="icon icon-right"></i>
 
       </li>
 
       </li>
 
     </ul>
 
     </ul>
 
     <footer class="edit-footer" v-if="!isH5">
 
     <footer class="edit-footer" v-if="!isH5">
 
-      <button class="btn-default" @click="cancel">{{$t('TUIProfile.取消')}}</button>
 
-      <button class="btn-submit" @click="submit">{{$t('TUIProfile.保存')}}</button>
 
+      <button class="btn-default" @click="cancel">{{ $t("TUIProfile.取消") }}</button>
 
+      <button class="btn-submit" @click="submit">{{ $t("TUIProfile.保存") }}</button>
 
     </footer>
 
     </footer>
 
-    <div class="mask" v-if="setName&&isH5" @click.self="closeMask">
 
+    <div class="mask" v-if="setName && isH5" @click.self="closeMask">
 
       <div class="mask-main">
 
       <div class="mask-main">
 
         <header class="edit-h5-header">
 
         <header class="edit-h5-header">
 
-          <h1>{{$t(`TUIProfile.${editConfig.title}`)}}</h1>
 
-          <span class="close" @click="closeMask">{{$t(`关闭`)}}</span>
 
+          <h1>{{ $t(`TUIProfile.${editConfig.title}`) }}</h1>
 
+          <span class="close" @click="closeMask">{{ $t(`关闭`) }}</span>
 
         </header>
 
         </header>
 
         <main class="edit-h5-main">
 
         <main class="edit-h5-main">
 
           <ul class="list" v-if="editConfig.type === 'select'">
 
           <ul class="list" v-if="editConfig.type === 'select'">
 
-            <li class="list-item" v-for="(item,index) in editConfig.list"  :key="index" @click="choose(item)">
 
-              <img v-if="item?.avatar" :class="[editConfig.value === item.avatar &&  'selected']" :src="item.avatar">
 
-              <span v-else :class="[editConfig.value === item.type &&  'selected']">{{$t(`TUIProfile.${item.label}`)}}</span>
 
+            <li class="list-item" v-for="(item, index) in editConfig.list" :key="index" @click="choose(item)">
 
+              <img v-if="item?.avatar" :class="[editConfig.value === item.avatar && 'selected']" :src="item.avatar" />
 
+              <span v-else :class="[editConfig.value === item.type && 'selected']">{{ $t(`TUIProfile.${item.label}`) }}</span>
 
             </li>
 
             </li>
 
           </ul>
 
           </ul>
 
           <div class="input" v-else>
 
           <div class="input" v-else>
 
             <textarea v-if="editConfig.type === 'textarea'" :placeholder="editConfig.placeholder" v-model="editConfig.value"></textarea>
 
             <textarea v-if="editConfig.type === 'textarea'" :placeholder="editConfig.placeholder" v-model="editConfig.value"></textarea>
 
-            <Datepicker
 
-              class="datePicker"
 
-              :placeholder="$t(`TUIProfile.请选择出生日期`)"
 
-              v-else-if="editConfig.type === 'date'"
 
-              :enableTimePicker="false"
 
-              :format="format"
 
-              :previewFormat="format"
 
-              :modelValue="birthday"
 
-              @update:modelValue="showBirthday" />
 
-            <input v-else :type="editConfig.type" :placeholder="$t(`TUIProfile.${editConfig.placeholder}`)" v-model="editConfig.value">
 
+            <Datepicker class="datePicker" :placeholder="$t(`TUIProfile.请选择出生日期`)" v-else-if="editConfig.type === 'date'" :enableTimePicker="false" :format="format" :previewFormat="format" :modelValue="birthday" @update:modelValue="showBirthday" />
 
+            <input v-else :type="editConfig.type" :placeholder="$t(`TUIProfile.${editConfig.placeholder}`)" v-model="editConfig.value" />
 
           </div>
 
           </div>
 
-          <sub v-if="editConfig.subText">{{$t(`TUIProfile.${editConfig.subText}`)}}</sub>
 
+          <sub v-if="editConfig.subText">{{ $t(`TUIProfile.${editConfig.subText}`) }}</sub>
 
         </main>
 
         </main>
 
         <footer class="edit-h5-footer">
 
         <footer class="edit-h5-footer">
 
-          <button class="btn btn-submit" :disabled="!editConfig.value" @click="submit">{{$t(`确定`)}}</button>
 
+          <button class="btn btn-submit" :disabled="!editConfig.value" @click="submit">{{ $t(`确定`) }}</button>
 
         </footer>
 
         </footer>
 
       </div>
 
       </div>
 
     </div>
 
     </div>
 
   </div>
 
   </div>
 
 </template>
 
 </template>
 
 <script lang="ts">
 
 <script lang="ts">
 
-import { computed, defineComponent, reactive, toRefs, watchEffect } from 'vue';
 
-import Datepicker from '@vuepic/vue-datepicker';
 
-import '@vuepic/vue-datepicker/dist/main.css';
 
+import { computed, defineComponent, reactive, toRefs, watchEffect } from "vue";
 
+import Datepicker from "@vuepic/vue-datepicker";
 
+import "@vuepic/vue-datepicker/dist/main.css";
 
 
 
-const TUIProfileEdit:any = defineComponent({
 
+const TUIProfileEdit: any = defineComponent({
 
   props: {
 
   props: {
 
     userInfo: {
 
     userInfo: {
 
       type: Object,
 
       type: Object,
 
@@ -128,64 +111,64 @@ const TUIProfileEdit:any = defineComponent({
 
     },
 
     },
 
   },
 
   },
 
   components: { Datepicker },
 
   components: { Datepicker },
 
-  setup(props:any, ctx:any) {
 
-    const TUIServer:any = TUIProfileEdit?.TUIServer;
 
+  setup(props: any, ctx: any) {
 
+    const TUIServer: any = TUIProfileEdit?.TUIServer;
 
     const data = reactive({
 
     const data = reactive({
 
       profile: {},
 
       profile: {},
 
       isEdit: false,
 
       isEdit: false,
 
       avatarList: [
 
       avatarList: [
 
         {
 
         {
 
-          name: 'avatar_01',
 
-          avatar: ' https://im.sdk.qcloud.com/download/tuikit-resource/avatar/avatar_1.png',
 
+          name: "avatar_01",
 
+          avatar: " https://im.sdk.qcloud.com/download/tuikit-resource/avatar/avatar_1.png",
 
         },
 
         },
 
         {
 
         {
 
-          name: 'avatar_02',
 
-          avatar: ' https://im.sdk.qcloud.com/download/tuikit-resource/avatar/avatar_2.png',
 
+          name: "avatar_02",
 
+          avatar: " https://im.sdk.qcloud.com/download/tuikit-resource/avatar/avatar_2.png",
 
         },
 
         },
 
         {
 
         {
 
-          name: 'avatar_03',
 
-          avatar: ' https://im.sdk.qcloud.com/download/tuikit-resource/avatar/avatar_3.png',
 
+          name: "avatar_03",
 
+          avatar: " https://im.sdk.qcloud.com/download/tuikit-resource/avatar/avatar_3.png",
 
         },
 
         },
 
         {
 
         {
 
-          name: 'avatar_04',
 
-          avatar: ' https://im.sdk.qcloud.com/download/tuikit-resource/avatar/avatar_4.png',
 
+          name: "avatar_04",
 
+          avatar: " https://im.sdk.qcloud.com/download/tuikit-resource/avatar/avatar_4.png",
 
         },
 
         },
 
         {
 
         {
 
-          name: 'avatar_05',
 
-          avatar: ' https://im.sdk.qcloud.com/download/tuikit-resource/avatar/avatar_5.png',
 
+          name: "avatar_05",
 
+          avatar: " https://im.sdk.qcloud.com/download/tuikit-resource/avatar/avatar_5.png",
 
         },
 
         },
 
         {
 
         {
 
-          name: 'avatar_06',
 
-          avatar: ' https://im.sdk.qcloud.com/download/tuikit-resource/avatar/avatar_6.png',
 
+          name: "avatar_06",
 
+          avatar: " https://im.sdk.qcloud.com/download/tuikit-resource/avatar/avatar_6.png",
 
         },
 
         },
 
       ],
 
       ],
 
       type: [
 
       type: [
 
         {
 
         {
 
-          label: '男',
 
+          label: "男",
 
           type: TUIServer.TUICore.TIM.TYPES.GENDER_MALE,
 
           type: TUIServer.TUICore.TIM.TYPES.GENDER_MALE,
 
         },
 
         },
 
         {
 
         {
 
-          label: '女',
 
+          label: "女",
 
           type: TUIServer.TUICore.TIM.TYPES.GENDER_FEMALE,
 
           type: TUIServer.TUICore.TIM.TYPES.GENDER_FEMALE,
 
         },
 
         },
 
       ],
 
       ],
 
       genderLabel: {
 
       genderLabel: {
 
-        [TUIServer.TUICore.TIM.TYPES.GENDER_MALE]: '男',
 
-        [TUIServer.TUICore.TIM.TYPES.GENDER_FEMALE]: '女',
 
-        [TUIServer.TUICore.TIM.TYPES.GENDER_UNKNOWN]: '不显示',
 
+        [TUIServer.TUICore.TIM.TYPES.GENDER_MALE]: "男",
 
+        [TUIServer.TUICore.TIM.TYPES.GENDER_FEMALE]: "女",
 
+        [TUIServer.TUICore.TIM.TYPES.GENDER_UNKNOWN]: "不显示",
 
       },
 
       },
 
-      setName: '',
 
+      setName: "",
 
       editConfig: {
 
       editConfig: {
 
-        title: '',
 
+        title: "",
 
         list: [],
 
         list: [],
 
-        type: '', // select、text、textarea、date
 
-        subText: '',
 
-        placeholder: '',
 
-        value: '',
 
+        type: "", // select、text、textarea、date
 
+        subText: "",
 
+        placeholder: "",
 
+        value: "",
 
       },
 
       },
 
     });
 
     });
 
 
 
-    const format = (date:any) => {
 
+    const format = (date: any) => {
 
       const day = date.getDate() > 9 ? date.getDate() : `0${date.getDate()}`;
 
       const day = date.getDate() > 9 ? date.getDate() : `0${date.getDate()}`;
 
       const month = date.getMonth() > 8 ? date.getMonth() + 1 : `0${date.getMonth() + 1}`;
 
       const month = date.getMonth() > 8 ? date.getMonth() + 1 : `0${date.getMonth() + 1}`;
 
       const year = date.getFullYear();
 
       const year = date.getFullYear();
 
@@ -196,37 +179,34 @@ const TUIProfileEdit:any = defineComponent({
 
       data.profile = JSON.parse(JSON.stringify(props.userInfo));
 
       data.profile = JSON.parse(JSON.stringify(props.userInfo));
 
     });
 
     });
 
 
 
-
 
     const birthday = computed(() => {
 
     const birthday = computed(() => {
 
       let value = (data.profile as any).birthday;
 
       let value = (data.profile as any).birthday;
 
-      if (data.setName === 'birthday' && props.isH5) {
 
+      if (data.setName === "birthday" && props.isH5) {
 
         value = data.editConfig.value;
 
         value = data.editConfig.value;
 
       }
 
       }
 
       return handleBirthdayFamate(value);
 
       return handleBirthdayFamate(value);
 
     });
 
     });
 
 
 
     const handleBirthdayFamate = (value: any) => {
 
     const handleBirthdayFamate = (value: any) => {
 
-      const birthday:any = `${value}`;
 
+      const birthday: any = `${value}`;
 
       if (birthday.length === 8) {
 
       if (birthday.length === 8) {
 
         const y = birthday.slice(0, 4);
 
         const y = birthday.slice(0, 4);
 
         const m = birthday.slice(4, 6);
 
         const m = birthday.slice(4, 6);
 
         const d = birthday.slice(-2);
 
         const d = birthday.slice(-2);
 
-        return  `${y}-${m}-${d}`;
 
+        return `${y}-${m}-${d}`;
 
       }
 
       }
 
-      return '';
 
+      return "";
 
     };
 
     };
 
 
 
-
 
-    const showChooseGender = (options: any)  =>  {
 
+    const showChooseGender = (options: any) => {
 
       (data.profile as any).gender = options.type;
 
       (data.profile as any).gender = options.type;
 
     };
 
     };
 
 
 
-
 
-    const  chooseAvatar = (item: any) =>  {
 
-      (data.profile as any).avatar  = item.avatar;
 
+    const chooseAvatar = (item: any) => {
 
+      (data.profile as any).avatar = item.avatar;
 
     };
 
     };
 
 
 
-    const showBirthday = (e:any) => {
 
+    const showBirthday = (e: any) => {
 
       if (!props.isH5) {
 
       if (!props.isH5) {
 
         (data.profile as any).birthday = e ? Number(format(e)) : 0;
 
         (data.profile as any).birthday = e ? Number(format(e)) : 0;
 
       } else {
 
       } else {
 
@@ -239,61 +219,61 @@ const TUIProfileEdit:any = defineComponent({
 
         (data.profile as any)[data.setName] = data.editConfig.value;
 
         (data.profile as any)[data.setName] = data.editConfig.value;
 
         closeMask();
 
         closeMask();
 
       }
 
       }
 
-      ctx.emit('submit', data.profile);
 
+      ctx.emit("submit", data.profile);
 
     };
 
     };
 
 
 
     const cancel = () => {
 
     const cancel = () => {
 
-      ctx.emit('cancel', data.profile);
 
+      ctx.emit("cancel", data.profile);
 
     };
 
     };
 
 
 
     const setProfile = (name: string) => {
 
     const setProfile = (name: string) => {
 
       data.editConfig.value = `${(data.profile as any)[name]}`;
 
       data.editConfig.value = `${(data.profile as any)[name]}`;
 
       data.setName = name;
 
       data.setName = name;
 
       switch (name) {
 
       switch (name) {
 
-        case 'avatar':
 
-          data.editConfig.title = '选择头像';
 
+        case "avatar":
 
+          data.editConfig.title = "选择头像";
 
           (data.editConfig.list as unknown) = data.avatarList;
 
           (data.editConfig.list as unknown) = data.avatarList;
 
-          data.editConfig.type = 'select';
 
+          data.editConfig.type = "select";
 
           break;
 
           break;
 
-        case 'nick':
 
-          data.editConfig.title = '设置昵称';
 
-          data.editConfig.subText = '仅限中文、字母、数字和下划线，2-20个字';
 
-          data.editConfig.placeholder = '请输入昵称';
 
-          data.editConfig.type = 'text';
 
+        case "nick":
 
+          data.editConfig.title = "设置昵称";
 
+          data.editConfig.subText = "仅限中文、字母、数字和下划线，2-20个字";
 
+          data.editConfig.placeholder = "请输入昵称";
 
+          data.editConfig.type = "text";
 
           break;
 
           break;
 
-        case 'gender':
 
-          data.editConfig.title = '性别选择';
 
+        case "gender":
 
+          data.editConfig.title = "性别选择";
 
           (data.editConfig.list as unknown) = data.type;
 
           (data.editConfig.list as unknown) = data.type;
 
-          data.editConfig.type = 'select';
 
+          data.editConfig.type = "select";
 
           break;
 
           break;
 
-        case 'selfSignature':
 
-          data.editConfig.title = '个性签名';
 
-          data.editConfig.type = 'textarea';
 
-          data.editConfig.placeholder = '请输入内容';
 
+        case "selfSignature":
 
+          data.editConfig.title = "个性签名";
 
+          data.editConfig.type = "textarea";
 
+          data.editConfig.placeholder = "请输入内容";
 
           break;
 
           break;
 
-        case 'birthday':
 
-          data.editConfig.title = '出生年月';
 
-          data.editConfig.type = 'date';
 
-          data.editConfig.placeholder = '请选择出生日期';
 
+        case "birthday":
 
+          data.editConfig.title = "出生年月";
 
+          data.editConfig.type = "date";
 
+          data.editConfig.placeholder = "请选择出生日期";
 
           break;
 
           break;
 
         default:
 
         default:
 
           break;
 
           break;
 
       }
 
       }
 
     };
 
     };
 
 
 
-    const choose = (item: any) =>  {
 
-      data.editConfig.value  = item?.avatar || item?.type;
 
+    const choose = (item: any) => {
 
+      data.editConfig.value = item?.avatar || item?.type;
 
     };
 
     };
 
 
 
     const closeMask = () => {
 
     const closeMask = () => {
 
-      data.setName = '';
 
+      data.setName = "";
 
       data.editConfig = {
 
       data.editConfig = {
 
-        title: '',
 
+        title: "",
 
         list: [],
 
         list: [],
 
-        type: '',
 
-        subText: '',
 
-        placeholder: '',
 
-        value: '',
 
+        type: "",
 
+        subText: "",
 
+        placeholder: "",
 
+        value: "",
 
       };
 
       };
 
     };
 
     };

+ 19 - 23
src/TUIKit/TUIComponents/container/TUIProfile/index.vue
View File 

@@ -3,37 +3,33 @@
 
     <div class="profile" v-if="!isEdit" @click="toggleEdit">
 
     <div class="profile" v-if="!isEdit" @click="toggleEdit">
 
       <header class="profile-header">
 
       <header class="profile-header">
 
         <aside class="profile-avatar">
 
         <aside class="profile-avatar">
 
-          <img
 
-            class="avatar"
 
-            :src="profile.avatar ? profile.avatar : 'https://news-info.ks3-cn-beijing.ksyuncs.com/07/1690787574969.png'"
 
-            onerror="this.src='https://news-info.ks3-cn-beijing.ksyuncs.com/07/1690787574969.png'"
 
-          />
 
+          <img class="avatar" :src="profile.avatar ? profile.avatar : 'https://oss.dayaedu.com/news-info/07/1690787574969.png'" onerror="this.src='https://oss.dayaedu.com/news-info/07/1690787574969.png'" />
 
         </aside>
 
         </aside>
 
         <ul class="profile-main">
 
         <ul class="profile-main">
 
           <li class="profile-main-item">
 
           <li class="profile-main-item">
 
-            <h1 class="profile-main-name">{{ profile.nick || '-' }}</h1>
 
+            <h1 class="profile-main-name">{{ profile.nick || "-" }}</h1>
 
             <p class="gender" v-if="!env.isH5">
 
             <p class="gender" v-if="!env.isH5">
 
-              {{ profile.gender ? $t(`TUIProfile.${genderLabel[profile.gender]}`) : '' }}
 
+              {{ profile.gender ? $t(`TUIProfile.${genderLabel[profile.gender]}`) : "" }}
 
             </p>
 
             </p>
 
           </li>
 
           </li>
 
           <li class="profile-main-item">
 
           <li class="profile-main-item">
 
-            <label class="profile-main-label">{{ $t('TUIProfile.用户ID') }}:</label>
 
+            <label class="profile-main-label">{{ $t("TUIProfile.用户ID") }}:</label>
 
             <span>{{ profile.userID }}</span>
 
             <span>{{ profile.userID }}</span>
 
           </li>
 
           </li>
 
           <li class="profile-main-item" v-if="env.isH5">
 
           <li class="profile-main-item" v-if="env.isH5">
 
-            <label class="profile-main-label">{{ $t('TUIProfile.个性签名') }}:</label>
 
-            <span>{{ profile.selfSignature || $t('TUIProfile.暂未设置') }}</span>
 
+            <label class="profile-main-label">{{ $t("TUIProfile.个性签名") }}:</label>
 
+            <span>{{ profile.selfSignature || $t("TUIProfile.暂未设置") }}</span>
 
           </li>
 
           </li>
 
         </ul>
 
         </ul>
 
       </header>
 
       </header>
 
       <ul class="profile-main" v-if="!env.isH5">
 
       <ul class="profile-main" v-if="!env.isH5">
 
         <li class="profile-main-item">
 
         <li class="profile-main-item">
 
-          <label class="profile-main-label">{{ $t('TUIProfile.个性签名') }}</label>
 
-          <span>{{ profile.selfSignature || $t('TUIProfile.暂未设置') }}</span>
 
+          <label class="profile-main-label">{{ $t("TUIProfile.个性签名") }}</label>
 
+          <span>{{ profile.selfSignature || $t("TUIProfile.暂未设置") }}</span>
 
         </li>
 
         </li>
 
         <li class="profile-main-item">
 
         <li class="profile-main-item">
 
-          <label class="profile-main-label">{{ $t('TUIProfile.出生年月') }}</label>
 
-          <span>{{ profile.birthday ? profile.birthday : $t('TUIProfile.暂未设置') }}</span>
 
+          <label class="profile-main-label">{{ $t("TUIProfile.出生年月") }}</label>
 
+          <span>{{ profile.birthday ? profile.birthday : $t("TUIProfile.暂未设置") }}</span>
 
         </li>
 
         </li>
 
       </ul>
 
       </ul>
 
       <i class="icon icon-right" v-if="env.isH5"></i>
 
       <i class="icon icon-right" v-if="env.isH5"></i>
 
@@ -42,12 +38,12 @@
 
   </div>
 
   </div>
 
 </template>
 
 </template>
 
 <script lang="ts">
 
 <script lang="ts">
 
-import { defineComponent, reactive, toRefs } from 'vue';
 
-import { useStore } from 'vuex';
 
-import TUIProfileEdit from './components/TUIProfileEdit';
 
+import { defineComponent, reactive, toRefs } from "vue";
 
+import { useStore } from "vuex";
 
+import TUIProfileEdit from "./components/TUIProfileEdit";
 
 
 
 const TUIProfile = defineComponent({
 
 const TUIProfile = defineComponent({
 
-  name: 'TUIProfile',
 
+  name: "TUIProfile",
 
   components: {
 
   components: {
 
     TUIProfileEdit,
 
     TUIProfileEdit,
 
   },
 
   },
 
@@ -57,9 +53,9 @@ const TUIProfile = defineComponent({
 
       profile: {},
 
       profile: {},
 
       isEdit: false,
 
       isEdit: false,
 
       genderLabel: {
 
       genderLabel: {
 
-        [TUIServer.TUICore.TIM.TYPES.GENDER_MALE]: '男',
 
-        [TUIServer.TUICore.TIM.TYPES.GENDER_FEMALE]: '女',
 
-        [TUIServer.TUICore.TIM.TYPES.GENDER_UNKNOWN]: '不显示',
 
+        [TUIServer.TUICore.TIM.TYPES.GENDER_MALE]: "男",
 
+        [TUIServer.TUICore.TIM.TYPES.GENDER_FEMALE]: "女",
 
+        [TUIServer.TUICore.TIM.TYPES.GENDER_UNKNOWN]: "不显示",
 
       },
 
       },
 
       env: TUIServer.TUICore.TUIEnv,
 
       env: TUIServer.TUICore.TUIEnv,
 
     });
 
     });
 
@@ -79,7 +75,7 @@ const TUIProfile = defineComponent({
 
         birthday: profile.birthday,
 
         birthday: profile.birthday,
 
       };
 
       };
 
       if (TUIServer.TUICore.getStore().TUIProfile.profile.nick !== profile.nick) {
 
       if (TUIServer.TUICore.getStore().TUIProfile.profile.nick !== profile.nick) {
 
-        (window as any)?.TUIKitTUICore?.isOfficial && VuexStore?.commit && VuexStore?.commit('handleTask', 2);
 
+        (window as any)?.TUIKitTUICore?.isOfficial && VuexStore?.commit && VuexStore?.commit("handleTask", 2);
 
       }
 
       }
 
       try {
 
       try {
 
         await TUIServer.updateMyProfile(options);
 
         await TUIServer.updateMyProfile(options);
 
@@ -100,7 +96,7 @@ const TUIProfile = defineComponent({
 
     };
 
     };
 
 
 
     const changeStatus = () => {
 
     const changeStatus = () => {
 
-      ctx.emit('changeStatus');
 
+      ctx.emit("changeStatus");
 
     };
 
     };
 
 
 
     const toggleEdit = () => {
 
     const toggleEdit = () => {

+ 1 - 0
src/TUIKit/TUIComponents/container/constant.ts
View File 

@@ -42,6 +42,7 @@ const constant: any = {
 
     scroll: 'scroll',
 
     scroll: 'scroll',
 
   },
 
   },
 
   TYPE_CALL_MESSAGE: 1,
 
   TYPE_CALL_MESSAGE: 1,
 
+  TC_GROUP_NOTICE: "TC_GROUP_NOTICE", // 自定义公告消息
 
   CALL_ACTION_TYPE: {
 
   CALL_ACTION_TYPE: {
 
     INVITE: 1,
 
     INVITE: 1,
 
     CANCEL_INVITE: 2,
 
     CANCEL_INVITE: 2,

+ 27 - 2
src/TUIKit/api.ts
View File 

@@ -53,10 +53,9 @@ export const imGroupChangeGroupOwner = (params?: object) => {
 
  */
 
  */
 
 export const imGroupNoticePage = (params?: object) => {
 
 export const imGroupNoticePage = (params?: object) => {
 
   if (platform == "daya") {
 
   if (platform == "daya") {
 
-    return request.post(api + "/imGroup/queryNoticeList", {
 
+    return request.post(api + "/imGroupNotice/queryNoticePage", {
 
       data: params,
 
       data: params,
 
     });
 
     });
 
-  } else {
 
   }
 
   }
 
   return request.post(api + "/imGroupNotice/page", {
 
   return request.post(api + "/imGroupNotice/page", {
 
     data: params,
 
     data: params,
 
@@ -72,6 +71,23 @@ if (platform == "daya") {
 
 }
 
 }
 
 export const imGroupNoticeSave = (params?: object) => {
 
 export const imGroupNoticeSave = (params?: object) => {
 
   return request.post(imGroupNoticeSaveUrl, {
 
   return request.post(imGroupNoticeSaveUrl, {
 
+    requestType: 'form',
 
+    data: params,
 
+  });
 
+};
 
+
 
+/**
 
+ * 即时通讯 - 删除公告
 
+ */
 
+export const imGroupNoticeRemove = (params?: any) => {
 
+  if (platform == "daya") {
 
+    return request.post(api + "/imGroupNotice/del", {
 
+      requestType: 'form',
 
+      data: params,
 
+    });
 
+  }
 
+  return request.post(api + "/imGroupNotice/remove", {
 
+    requestType: 'form',
 
     data: params,
 
     data: params,
 
   });
 
   });
 
 };
 
 };
 
@@ -82,6 +98,7 @@ export const imGroupNoticeSave = (params?: object) => {
 
  */
 
  */
 
 export const imGroupNoticeUpdate = (params?: object) => {
 
 export const imGroupNoticeUpdate = (params?: object) => {
 
   return request.post(api + "/imGroupNotice/update", {
 
   return request.post(api + "/imGroupNotice/update", {
 
+    requestType: 'form',
 
     data: params,
 
     data: params,
 
   });
 
   });
 
 };
 
 };
 
@@ -89,11 +106,19 @@ export const imGroupNoticeUpdate = (params?: object) => {
 
 /**
 
 /**
 
  * 即时通讯 - 详情
 
  * 即时通讯 - 详情
 
  */
 
  */
 
+export const imGroupNoticeDetail = (id?: any) => {
 
+  return request.get(api + "/imGroupNotice/detail/" + id);
 
+};
 
+
 
+
 
 let imGroupDetailUrl = api + "/imGroup/detail/";
 
 let imGroupDetailUrl = api + "/imGroup/detail/";
 
 if (platform == "daya") {
 
 if (platform == "daya") {
 
   // https://test.dayaedu.com/api-teacher/imGroup/getDetail/1664236980537458690
 
   // https://test.dayaedu.com/api-teacher/imGroup/getDetail/1664236980537458690
 
   imGroupDetailUrl = api + "/imGroup/getDetail/";
 
   imGroupDetailUrl = api + "/imGroup/getDetail/";
 
 }
 
 }
 
+/**
 
+ * 即时通讯 - 详情
 
+ */
 
 export const imGroupDetail = (params?: any) => {
 
 export const imGroupDetail = (params?: any) => {
 
   return request.get(imGroupDetailUrl + params.id);
 
   return request.get(imGroupDetailUrl + params.id);
 
 };
 
 };

BIN
src/assets/icon-add.png
View File


BIN
src/assets/icon-more-point.png
View File


BIN
src/assets/icon-notice.png
View File


BIN
src/assets/icon-t-1.png
View File


BIN
src/assets/icon-t-2.png
View File


+ 1 - 1
src/index.scss
View File 

@@ -435,7 +435,7 @@
 
   flex-direction: column;
 
   flex-direction: column;
 
   width: 100%;
 
   width: 100%;
 
   background-size: contain;
 
   background-size: contain;
 
-
 
+  height: 100vh;
 
   &-header {
 
   &-header {
 
     width: 100%;
 
     width: 100%;
 
     position: sticky;
 
     position: sticky;

+ 9 - 3
src/main.ts
View File 

@@ -14,11 +14,15 @@ import {
 
   NInput,
 
   NInput,
 
   NEmpty,
 
   NEmpty,
 
   NImage,
 
   NImage,
 
+  NSpin,
 
+  NScrollbar,
 
+  NPopover,
 
+  NTooltip
 
 } from "naive-ui";
 
 } from "naive-ui";
 
 
 
 // n-tab-pane
 
 // n-tab-pane
 
 const naive = create({
 
 const naive = create({
 
-  components: [NButton, NTabs, NTabPane, NInput, NEmpty, NImage],
 
+  components: [NButton, NTabs, NTabPane, NInput, NEmpty, NImage, NSpin, NScrollbar, NPopover, NTooltip],
 
 });
 
 });
 
 
 
 import qs from "query-string";
 
 import qs from "query-string";
 
@@ -41,8 +45,10 @@ import { TUIComponents, TUICore, genTestUserSig } from "./TUIKit";
 
 console.log(import.meta.env.DEV, "import.meta.env.DEV");
 
 console.log(import.meta.env.DEV, "import.meta.env.DEV");
 
 
 
 // 判断是否是测试环境的
 
 // 判断是否是测试环境的
 
-const SDKAppID = parseSearch.appId || hashSearch.appId || 1400805079; // import.meta.env.DEV ? 1400805079 : 1400799837; // 1400805079; // Your SDKAppID
 
-const secretKey = parseSearch.secretKey || hashSearch.secretKey || "c5f4ea6140128a36c842990446a2c89249ab886b5e1ea6893555aa635a0b3c30"; //import.meta.env.DEV ? "c5f4ea6140128a36c842990446a2c89249ab886b5e1ea6893555aa635a0b3c30" : "37bfb220843e25e78768cadd0dc06756e460e55bd631354930a4149565a1d0c9"; //"c5f4ea6140128a36c842990446a2c89249ab886b5e1ea6893555aa635a0b3c30"; // Your secretKey
 
+// import.meta.env.DEV ? 1400805079 : 1400799837; // 1400805079; // Your SDKAppID
 
+const SDKAppID = parseSearch.appId || hashSearch.appId || 1400805079; 
+//import.meta.env.DEV ? "c5f4ea6140128a36c842990446a2c89249ab886b5e1ea6893555aa635a0b3c30" : "37bfb220843e25e78768cadd0dc06756e460e55bd631354930a4149565a1d0c9"; //"c5f4ea6140128a36c842990446a2c89249ab886b5e1ea6893555aa635a0b3c30"; // Your secretKey
 
+const secretKey = parseSearch.secretKey || hashSearch.secretKey || "c5f4ea6140128a36c842990446a2c89249ab886b5e1ea6893555aa635a0b3c30"; 
 const userID = parseSearch.userID; //|| "KT:140:TEACHER"; // User ID
 
 const userID = parseSearch.userID; //|| "KT:140:TEACHER"; // User ID
 
 
 
 // init TUIKit
 
 // init TUIKit

+ 26 - 2
src/style.css
View File 

@@ -25,8 +25,8 @@ a:hover {
 
 
 
 body {
 
 body {
 
   margin: 0;
 
   margin: 0;
 
-  display: flex;
 
-  place-items: center;
 
+  /* display: flex;
 
+  place-items: center; */
 
   min-width: 320px;
 
   min-width: 320px;
 
   min-height: 100vh;
 
   min-height: 100vh;
 
 }
 
 }
 
@@ -126,3 +126,27 @@ button:focus-visible {
 
     background-size: contain;
 
     background-size: contain;
 
   }
 
   }
 
 }
 
 }
 
+
 
+
 
+/**  **/
 
+.iconMorePoint {
 
+  background: url('./assets/icon-more-point.png') no-repeat center;
 
+  background-size: contain;
 
+}
 
+
 
+.iconNotifiAdd {
 
+  background: url('./assets/icon-add.png') no-repeat center;
 
+  background-size: contain;
 
+}
 
+.iconNotifit1 {
 
+  background: url('./assets/icon-t-1.png') no-repeat center;
 
+  background-size: contain;
 
+}
 
+.iconNotifit2 {
 
+  background: url('./assets/icon-t-2.png') no-repeat center;
 
+  background-size: contain;
 
+}
 
+.iconNotice {
 
+  background: url('./assets/icon-notice.png') no-repeat center;
 
+  background-size: contain;
 
+}

+ 1 - 1
vite.config.ts
View File 

@@ -13,7 +13,7 @@ function pathResolve(dir: string) {
 
 //   return path.join(__dirname, dir);
 
 //   return path.join(__dirname, dir);
 
 // }
 
 // }
 
 // const proxyUrl = "https://test.lexiaoya.cn";
 
 // const proxyUrl = "https://test.lexiaoya.cn";
 
-const proxyUrl = "https://test.dayaedu.com";
 
+const proxyUrl = "https://test.gym.lexiaoya.cn";
 
 // https://vitejs.dev/config/
 
 // https://vitejs.dev/config/
 
 export default defineConfig({
 
 export default defineConfig({
 
   base: "./",
 
   base: "./",

Some files were not shown because too many files changed in this diff