通知

src/components/medical-insurance/patient-overview/Index.vue

@@ -13,7 +13,7 @@
     </el-select>
     <el-table
         :data="cptOverviews.slice((currentPage - 1) * 15, currentPage * 15)"
-        :height="tableHieght"
+        :height="visibleWindowSize.height - 190"
         highlight-current-row
         stripe
         @row-click="handleClickOverview"
@@ -58,9 +58,10 @@ import femaleIcon from '@/assets/female-icon.png'
 import dismissIcon from '@/assets/dismiss-icon.png'
 import {getOverView, getPatientInfo} from '@/api/inpatient/patient'
 import {setBaseinfo} from '@/data/inpatient'
-import {trueMedTypes} from '@/data/index'
+import {trueMedTypes} from '@/data'
 import {getWardsApi} from '@/api/login'
 import {allWardsVisible} from '@/utils/permission'
+import {visibleWindowSize} from '@/utils/window-size'
 
 export default {
   props: {
@@ -159,6 +160,7 @@ export default {
       fetchOverviews,
       handleClickOverview,
       handleSelectionChange,
+      visibleWindowSize
     }
   },
 }

src/components/xc/xc-table/XcTable.vue

@@ -3,9 +3,9 @@
       ref="tableRef"
       :data="tableData"
       style="width: 100%"
-      :height="windowSize.h - props.height  "
       @selection-change="selectionChange"
       @row-click="rowClick"
+      :height="visibleWindowSize.height - props.height  "
       highlight-current-row
       @row-contextmenu="contextmenu"
       :row-key="props.rowKey"
@@ -28,10 +28,9 @@
 </template>
 
 <script setup name='XcTable'>
-import store from "@/store";
 import {ElMessage} from "element-plus";
 import {BizException, ExceptionEnum} from "@/utils/BizException";
-import sleep from "@/utils/sleep";
+import {getVisibleSize, visibleWindowSize} from "@/utils/window-size";
 
 const props = defineProps({
   data: {
@@ -85,10 +84,6 @@ const emit = defineEmits([
 const tableRef = ref(null)
 let selection = $ref([])
 
-const windowSize = computed(() => {
-  return store.state.app.windowSize
-})
-
 const tableData = computed(() => {
   if (props.localPaging) {
     return props.data.data.slice((props.data.currentPage - 1) * props.data.pageSize, props.data.currentPage * props.data.pageSize)

src/layout/HeaderV2/ScrollNotifications.vue

@@ -1,6 +1,6 @@
 <template>
   <transition name="el-zoom-in-center">
-    <div class="announcement" v-show="isShow">
+    <div class="announcement" v-show="data.systemUpdatesMessage || data.scrollingMessages">
       <el-popover :width="500">
         <div v-if="data.systemUpdatesMessage">
           系统更新通知:
@@ -18,25 +18,13 @@
         {{ data.scrollingMessages }}
         <template #reference>
           <div class='ad' ref="adRef">
-            <i class="iconfont icon-tongzhi"/>
-            <div class="wrap" ref="wrapRef">
-              <p class="txt" ref="txtRef">
-                {{
-                  data.systemUpdatesMessage ? '系统更新通知:' + data.systemUpdatesMessage : data.systemUpdatesMessage
-                }}
-                {{ data.scrollingMessages }}
-                &nbsp;&nbsp;&nbsp;&nbsp;
-              </p>
-              <p class="txt" v-show="whetherToScroll">
-                {{
-                  data.systemUpdatesMessage ? '系统更新通知:' + data.systemUpdatesMessage : data.systemUpdatesMessage
-                }}
-                {{ data.scrollingMessages }}
-                &nbsp;&nbsp;&nbsp;&nbsp;
-              </p>
-            </div>
-            <div style="color: white;font-size: 14px;margin-left: 10px;white-space: nowrap">
-              查看详情
+            <div ref="scrollRef" :style=" {
+
+            }">
+              {{
+                data.systemUpdatesMessage ? '系统更新通知:' + data.systemUpdatesMessage : data.systemUpdatesMessage
+              }}
+              {{ data.scrollingMessages }}
             </div>
           </div>
         </template>
@@ -45,10 +33,11 @@
   </transition>
 </template>
 
-<script setup name='ScrollNotifications'>
-
+<script setup name='ScrollNotifications' lang="ts">
 import {setCallback} from "@/utils/websocket";
 import {getSystemAnnouncement} from "@/api/public-api";
+import {ref, watch, onMounted, Ref, nextTick} from "vue";
+import {$ref} from "vue/macros";
 
 let data = $ref({
   systemUpdatesMessage: '',
@@ -57,40 +46,19 @@ let data = $ref({
 
 let isShow = $ref(false)
 
-const wrapRef = ref()
-const txtRef = ref()
-const adRef = ref()
-
-let whetherToScroll = $ref(false)
-
-let timer = null;
-
-watch(() => data, () => {
-  isShow = (data.systemUpdatesMessage || data.scrollingMessages)
-  nextTick(() => {
-    if (isShow) {
-      wrapRef.value.style.width = adRef.value.clientWidth - 85 + 'px'
-      if (wrapRef.value.offsetWidth < txtRef.value.offsetWidth) {
-        let p_w = txtRef.value.offsetWidth;
-        whetherToScroll = true
-        timer = setInterval(() => {
-          if (p_w > wrapRef.value.scrollLeft) {
-            wrapRef.value.scrollLeft++;
-          } else {
-            wrapRef.value.scrollLeft = 0
-          }
-        }, 30)
-      } else {
-        clearInterval(timer)
-        wrapRef.value.scrollLeft = 0
-        whetherToScroll = false
-      }
-    } else {
-      clearInterval(timer)
-    }
+const scrollRef: Ref<HTMLElement> = ref(null)
+const adRef: Ref<HTMLElement> = ref(null)
 
-  })
+let scrollStyle: object = $ref()
 
+watch(() => data, async () => {
+  // isShow = (data.systemUpdatesMessage || data.scrollingMessages)
+  await nextTick()
+  let width = scrollRef.value?.clientWidth
+  if (width >= 220) {
+    adRef.value.innerHTML += adRef.value.innerHTML
+    console.log('需要滚动')
+  }
 }, {deep: true, immediate: true})
 
 
@@ -119,8 +87,6 @@ onMounted(() => {
   z-index: 1000;
   right: 0;
   top: -5px;
-
-  //margin-right: -8px;
 }
 
 .announcement {
@@ -130,8 +96,9 @@ onMounted(() => {
   padding: 5px;
 
   .ad {
-    width: 70%;
-    background-color: #e6a23c;
+    width: max-content;
+    max-width: 220px;
+    //overflow: hidden;
     align-items: center;
     display: flex;
     border-radius: 8px;
@@ -140,28 +107,21 @@ onMounted(() => {
     font-size: 16px;
     color: #353535;
     cursor: pointer;
-    box-shadow: 2px 1px 8px 1px rgb(228, 232, 235);
     padding: 5px;
+    white-space: nowrap;
+    animation: move 8s linear infinite normal;
+    animation-fill-mode: forwards;
+  }
 
-    i {
-      color: white;
+  @keyframes move {
+    0% {
+      transform: translateX(0px);
     }
-
-    .wrap {
-      margin-left: 10px;
-      font-size: 14px;
-      color: #333;
-      white-space: nowrap;
-      overflow: hidden;
-
-      p {
-        color: white;
-        margin: 0;
-        padding: 0;
-        display: inline-block;
-      }
+    100% {
+      transform: translateX(-100px);
     }
   }
+
 }
 
 </style>

src/layout/HeaderV2/ToolInfoBar.vue

@@ -1,5 +1,8 @@
 <template>
   <div class="tool_info_bar">
+    <div>
+      <scroll-notifications/>
+    </div>
     <!-- 快捷功能按钮 -->
     <div class="function-list">
       <div class="function-list-item">
@@ -36,6 +39,7 @@ import SizeChange from './function-list/sizeChange.vue'
 import Theme from './function-list/theme.vue'
 import PasswordLayer from './PasswordLayer.vue'
 import UserInfo from "./function-list/UserInfo.vue";
+import ScrollNotifications from "./ScrollNotifications.vue";
 
 const store = useStore()
 

src/layout/PageLayer.vue

@@ -5,10 +5,10 @@
     </el-header>
     <el-container>
       <el-aside v-if="useSlots().aside" class="aside" :style="mainStyleSize" ref="asideRef">
-        <slot name="aside"></slot>
+        <slot name="aside" :size="{height:heightRef,width:asideRef?.$el?.clientWidth}"></slot>
       </el-aside>
       <el-main :style="mainStyleSize" class="page_main" ref="mainRef">
-        <slot name="main"></slot>
+        <slot name="main" :size="{height:heightRef,width:mainRef?.$el?.clientWidth}"></slot>
       </el-main>
     </el-container>
   </el-container>
@@ -19,19 +19,21 @@ import {onMounted, Ref, ref, useSlots} from "vue";
 import {getVisibleSize} from "../utils/window-size.js"
 import {$ref} from "vue/macros";
 
-const headerRef: Ref<HTMLElement> = ref(null)
 let mainStyleSize: object = $ref({})
 
+const headerRef: Ref<HTMLElement> = ref(null)
 const asideRef: Ref<HTMLElement> = ref(null)
 const mainRef: Ref<HTMLElement> = ref(null)
 
+let heightRef: number = $ref(0)
 
 getVisibleSize((val) => {
-  let height = (val.height - headerRef.value.$el.clientHeight) + 'px'
+  let clientHeight = (val.height - headerRef.value.$el.clientHeight) + 'px'
   mainStyleSize = {
-    maxHeight: height,
-    minHeight: height
+    maxHeight: clientHeight,
+    minHeight: clientHeight
   }
+  heightRef = val.height - headerRef.value.$el?.clientHeight
 })
 
 

src/layout/index.vue

@@ -11,8 +11,8 @@
       <el-header v-show="!contentFullScreen" style="height: 50px; display: block">
         <header-v2/>
       </el-header>
-      <div style="width: 100%;margin-top: 4px">
-        <scroll-notifications/>
+      <div style="width: 100%;position: fixed;z-index: 99;top: 0">
+<!--        <scroll-notifications/>-->
       </div>
       <el-main class="scrollbar" ref="mainRef">
         <router-view v-slot="{ Component }">

src/views/hospitalization/zhu-yuan-yi-sheng/Home.vue

@@ -5,7 +5,7 @@
       <huan-zhe-xin-xi v-show="basicPatientInformation"></huan-zhe-xin-xi>
     </template>
 
-    <template #aside>
+    <template #aside="{size}">
       <Overview v-show="xianShiLieBiao" :showSelection="false"/>
     </template>
 
@@ -25,30 +25,6 @@
     </template>
 
   </page-layer>
-
-
-  <!--  <el-container>-->
-  <!--    <el-container>-->
-  <!--      <el-aside style="width:auto !important;">-->
-  <!--        <Overview v-show="xianShiLieBiao" :showSelection="false"/>-->
-  <!--      </el-aside>-->
-  <!--      <el-main class="main">-->
-  <!--        <huan-zhe-xin-xi v-show="basicPatientInformation"></huan-zhe-xin-xi>-->
-  <!--        <el-row v-show="xianShiLieBiao" class="tabs">-->
-  <!--          <template v-for="item in pathList">-->
-  <!--            <el-col :span="3" :style="currentPagePosition(item.path)" class="tab-item" @click="handleClick(item.path)">-->
-  <!--              <span> {{ item.title }}</span>-->
-  <!--            </el-col>-->
-  <!--          </template>-->
-  <!--        </el-row>-->
-  <!--        <router-view v-slot="{ Component }">-->
-  <!--          <keep-alive>-->
-  <!--            <component :is="Component"/>-->
-  <!--          </keep-alive>-->
-  <!--        </router-view>-->
-  <!--      </el-main>-->
-  <!--    </el-container>-->
-  <!--  </el-container>-->
 </template>
 
 <script name="Home" setup>

src/views/hospitalization/zhu-yuan-yi-sheng/yi-zhu-lu-ru/YiZhuLuRu.vue

@@ -60,7 +60,7 @@
               row-key="id"
               @currentChange="handleCurrentChange"
               @sizeChange="handleSizeChange"
-              :height="250"
+              :height="230"
               @rowContextmenu="clickToViewTheDoctorSOrderFee"
               @selectionChange="huoQuXuanZhongDeShuJu"
               ref="tableRef">