新加入的 store 中的属性无效

src/api/zhu-yuan-yi-sheng/yi-zhu-lu-ru.js

@@ -17,7 +17,7 @@ export const huanZheXinXiHeight = ref(0)
 // 获取医生选中的病区
 export const selectWardCode = ref(0)
 // 是否点击了修改整个模板
-export const muBanMing = ref('')
+export const muBanMing = ref({})
 
 
 export function youWuXuanZheHuanZhe() {
@@ -44,7 +44,6 @@ export function getSelfBuy(val) {
     }
 }
 
-
 // 下面是 api 请求
 export function huoQuHuanZheLieBiao(wardCode) {
     return request({

src/components/zhu-yuan-yi-sheng/yi-zhu-lu-ru/GongJuZuJian.vue

@@ -0,0 +1,75 @@
+<template>
+  <div class="gong-ju-body" style="right: 20px;top: 100px;" @click="dianJiGongJuLan">
+    <div class="gong-ju-wen-zi"><i class="el-icon-setting"></i></div>
+  </div>
+  <el-dialog title="工具箱" v-model="dialog">
+    兼容模式：
+    <el-switch
+        active-color="#13ce66"
+        inactive-color="#ff4949"
+        active-text="启用"
+        inactive-text="停用"
+        :active-value="true"
+        :inactive-value="false"
+        v-model="jianRongMoShi"
+    >
+    </el-switch>
+    <span style="color: #e9ae62;margin-left: 10px;">如果电脑过于卡顿请使用该模式</span>
+  </el-dialog>
+</template>
+
+<script>
+import {ref} from "vue";
+import store from '../../../store'
+
+export default {
+  name: "GongJuZuJian",
+  setup() {
+    const dialog = ref(false)
+
+    const jianRongMoShi = ref(true)
+
+    console.log(store.state.app)
+
+    const dianJiGongJuLan = () => {
+      console.log(1)
+      // dialog.value = true
+    }
+
+    return {
+      dianJiGongJuLan,
+      dialog,
+      jianRongMoShi
+    }
+  }
+
+}
+</script>
+
+<style scoped>
+.gong-ju-body {
+  position: fixed;
+  background-color: #bacff3;
+  width: 40px;
+  height: 40px;
+  border-radius: 50%;
+  color: #bacff3;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  font-size: 20px;
+  box-shadow: 0 0 6px #0000001f;
+  cursor: pointer;
+  z-index: 5;
+}
+
+.gong-ju-wen-zi {
+  height: 100%;
+  width: 100%;
+  background-color: rgb(242, 245, 246);
+  box-shadow: rgb(0 0 0 / 12%) 0 0 6px;
+  text-align: center;
+  line-height: 40px;
+  color: rgb(25, 137, 250);
+}
+</style>

src/components/zhu-yuan-yi-sheng/yi-zhu-lu-ru/TianJiaHuoXiuGaiYiZhu.vue

@@ -331,6 +331,7 @@ import {uuid} from "../../../utils/getUuid";
 import BaoCunMuBan from "./BaoCunMuBan.vue";
 import {getServerDateApi} from "../../../api/public-api";
 
+
 export default {
   name: "TianJiaHuoXiuGaiYiZhu",
   components: {BaoCunMuBan, HuoQuMuBan},

src/layout/index.vue

@@ -1,20 +1,21 @@
 <template>
   <el-container style="height: 100vh">
     <div class="mask" v-show="!isCollapse && !contentFullScreen" @click="hideMenu"></div>
-    <el-aside :width="isCollapse ? '60px' : '250px'" :class="isCollapse ? 'hide-aside' : 'show-side'" v-show="!contentFullScreen">
-      <Logo v-if="showLogo" />
-      <Menu />
+    <el-aside :width="isCollapse ? '60px' : '250px'" :class="isCollapse ? 'hide-aside' : 'show-side'"
+              v-show="!contentFullScreen">
+      <Logo v-if="showLogo"/>
+      <Menu/>
     </el-aside>
     <el-container>
       <el-header v-show="!contentFullScreen">
-        <Header />
+        <Header/>
       </el-header>
-      <Tabs v-show="showTabs" />
+      <Tabs v-show="showTabs"/>
       <el-main>
         <router-view v-slot="{ Component }" v-loading="loading">
           <transition name="fade-transform" mode="out-in">
             <keep-alive>
-              <component :is="Component" />
+              <component :is="Component"/>
             </keep-alive>
           </transition>
         </router-view>
@@ -24,15 +25,16 @@
 </template>
 
 <script>
-import { defineComponent, computed, onBeforeMount, onMounted } from 'vue'
-import { useStore } from 'vuex'
-import { useEventListener } from '@vueuse/core'
+import {defineComponent, computed, onBeforeMount, onMounted} from 'vue'
+import {useStore} from 'vuex'
+import {useEventListener} from '@vueuse/core'
 import Menu from './Menu/index.vue'
 import Logo from './Logo/index.vue'
 import Header from './Header/index.vue'
 import Tabs from './Tabs/index.vue'
-import { useRouter } from 'vue-router'
-import { initWebSocket } from '@/utils/websocket'
+import {useRouter} from 'vue-router'
+import {initWebSocket} from '@/utils/websocket'
+
 export default defineComponent({
   components: {
     Menu,
@@ -103,27 +105,32 @@ export default defineComponent({
   padding-left: 0;
   padding-right: 0;
 }
+
 .el-aside {
   display: flex;
   flex-direction: column;
-  transition: 0.2s;
   overflow-x: hidden;
   transition: 0.3s;
+
   &::-webkit-scrollbar {
     width: 0 !important;
   }
 }
+
 .el-main {
   background-color: var(--system-container-background);
   height: 100%;
   padding: 0;
 }
+
 .el-main-box {
   width: 100%;
+  min-width: 1200px;
   height: 100%;
   overflow-y: auto;
   box-sizing: border-box;
 }
+
 @media screen and (max-width: 1000px) {
   .el-aside {
     position: fixed;
@@ -131,6 +138,7 @@ export default defineComponent({
     left: 0;
     height: 100vh;
     z-index: 1000;
+
     &.hide-aside {
       left: -250px;
     }

src/store/index.js

@@ -1,29 +1,30 @@
-import { createStore, createLogger } from 'vuex'
+import {createStore} from 'vuex'
 import Presistent from './plugins/persistent'
+
 const debug = process.env.NODE_ENV !== 'production'
 
 const files = import.meta.globEager('./modules/*.js')
 
 let modules = {}
 Object.keys(files).forEach((c) => {
-  const module = files[c].default
-  const moduleName = c.replace(/^\.\/(.*)\/(.*)\.\w+$/, '$2')
-  modules[moduleName] = module
+    const module = files[c].default
+    const moduleName = c.replace(/^\.\/(.*)\/(.*)\.\w+$/, '$2')
+    modules[moduleName] = module
 })
 
 const presistent = Presistent({
-  key: 'vuex',
-  modules,
-  modulesKeys: {
-    local: Object.keys(modules),
-    session: [],
-  },
+    key: 'vuex',
+    modules,
+    modulesKeys: {
+        local: Object.keys(modules),
+        session: [],
+    },
 })
 
 export default createStore({
-  modules: {
-    ...modules,
-  },
-  strict: debug,
-  plugins: [presistent],
+    modules: {
+        ...modules,
+    },
+    strict: debug,
+    plugins: [presistent],
 })

src/store/modules/app.js

@@ -23,6 +23,10 @@ const state = () => ({
             menuType: 'side',
         },
     },
+    yiZhuLuRu: {
+        jianRongMoShi: true,
+        elTabgName: '',
+    },
 })
 
 // mutations

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

@@ -11,10 +11,12 @@
             <yi-zhu-lu-ru-zhu-jian></yi-zhu-lu-ru-zhu-jian>
           </el-tab-pane>
           <el-tab-pane label="检查申请"></el-tab-pane>
+          <el-tab-pane label="会诊申请"></el-tab-pane>
         </el-tabs>
       </el-main>
     </el-container>
   </el-container>
+  <gong-ju-zu-jian></gong-ju-zu-jian>
 </template>
 
 <script>
@@ -23,10 +25,11 @@ import {computed} from "vue";
 import HuanZheLieBiao from "../../../components/zhu-yuan-yi-sheng/yi-zhu-lu-ru/HuanZheLieBiao.vue";
 import HuanZheXinXi from "../../../components/zhu-yuan-yi-sheng/yi-zhu-lu-ru/HuanZheXinXi.vue";
 import YiZhuLuRuZhuJian from "../../../components/zhu-yuan-yi-sheng/yi-zhu-lu-ru/YiZhuLuRuZhuJian.vue";
+import GongJuZuJian from "../../../components/zhu-yuan-yi-sheng/yi-zhu-lu-ru/GongJuZuJian.vue";
 
 export default {
   name: "YiZhuLuRu",
-  components: {YiZhuLuRuZhuJian, HuanZheXinXi, HuanZheLieBiao},
+  components: {GongJuZuJian, YiZhuLuRuZhuJian, HuanZheXinXi, HuanZheLieBiao},
   setup() {
     const tableHeight = computed(() => {
       return store.state.app.windowSize.h