bug fix

src/style/global.less

@@ -12,7 +12,11 @@ body {
   height: 100%;
   min-width: 1200px;
 }
-
+.ellipsis {
+  overflow: hidden;
+  white-space: nowrap;
+  text-overflow: ellipsis;
+}
 .layout-header {
   width: 100%;
   // box-shadow: 1px 1px 2px var(--color-neutral-2);

src/views/my-workbenches/workbenches/message-reminder/index.vue

@@ -31,24 +31,40 @@
         @open="open"
       ></MessageList>
     </div>
+
+    <t-drawer
+      v-model:visible="visible"
+      header="消息"
+      size="80%"
+      :close-btn="true"
+    >
+      <div class="msg-content" v-html="curMsg.content"></div>
+
+      <template #footer>
+        <t-button theme="primary" @click="visible = false">返回</t-button>
+      </template>
+    </t-drawer>
   </div>
 </template>
 
 <script setup name="MessageReminder">
 import { reactive, computed, ref } from 'vue';
 import useFetchTable from '@/hooks/useFetchTable';
-import {getMyMessages, setMyMessagesRead} from '@/api/my-workbenches';
+import { getMyMessages, setMyMessagesRead } from '@/api/my-workbenches';
 import { MESSAGE_TYPE } from '@/config/constants';
 import { dictToOptionList } from '@/utils/tool';
 import MessageList from './message-list.vue';
 import { useWorkStore } from '@/store';
-import NoticeList from "@/views/my-workbenches/workbenches/notice/notice-list.vue";
-
+import NoticeList from '@/views/my-workbenches/workbenches/notice/notice-list.vue';
+const curMsg = ref({});
+const visible = ref(false);
 const open = (notice) => {
-    setMyMessagesRead(notice.id).then(()=> {
-      search()
-      workStore.updateWorkCounts();
-    })
+  setMyMessagesRead(notice.id).then(() => {
+    // search()
+    workStore.updateWorkCounts();
+  });
+  curMsg.value = notice;
+  visible.value = true;
 };
 const workStore = useWorkStore();
 const tabs = [

src/views/my-workbenches/workbenches/message-reminder/message-list.vue

@@ -1,10 +1,21 @@
 <template>
   <div class="message-list">
-    <div class="message-item" v-for="item in tableData" :key="item.id">
+    <div
+      class="message-item cursor-pointer"
+      v-for="item in tableData"
+      :key="item.id"
+      @click="open(item)"
+    >
       <div class="m-head">
-        <div class="m-title">
-          <t-link hover="color" @click="open(item)">
-          <span>{{ messageTypeFilter(item.messageType) }}</span>
+        <div
+          class="m-title flex items-center"
+          style="max-width: calc(100% - 180px)"
+        >
+          <!-- <t-link hover="color"> -->
+          <!-- <span>{{ messageTypeFilter(item.messageType) }}</span> -->
+          <span class="ellipsis">{{ item.content }}</span>
+
+          <!-- </t-link> -->
           <t-tag
             theme="danger"
             variant="light"
@@ -12,16 +23,16 @@
             v-if="!item.readStatus"
             >未读</t-tag
           >
-          </t-link>
         </div>
+
         <div class="m-time">{{ timestampFilter(item.sendTime, 'mm') }}</div>
       </div>
-      <div class="m-body">
-        <div class="m-content">{{ item.content }}</div>
+      <div class="m-body m-t-10px">
+        <!-- <div class="m-content">{{ item.content }}</div> -->
         <t-space class="m-info" :size="5">
           <p>发起人：{{ item.formUser }}</p>
           <p>服务单元：{{ item.service }} </p>
-          <p>客户类型：{{ item.customType }}</p>
+          <p>客户类型：{{ customerTypeFilter(item.customType) }}</p>
           <p>客户名称：{{ item.custom }}</p>
           <template #separator>
             <t-divider layout="vertical" />
@@ -49,7 +60,11 @@
 </template>
 
 <script setup name="MessageList">
-import { messageTypeFilter, timestampFilter } from '@/utils/filter';
+import {
+  messageTypeFilter,
+  timestampFilter,
+  customerTypeFilter,
+} from '@/utils/filter';
 
 const { tableData, pagination, onChange } = defineProps([
   'tableData',