Commit 48700bd8d4f7b9a07f0524c16c3075c961c17859

Authored by fengtao
1 parent 06f15142

fix:pc端 修改告警配置左侧组织显示隐藏

@@ -4,13 +4,30 @@ @@ -4,13 +4,30 @@
4 <OrganizationIdTree 4 <OrganizationIdTree
5 class="w-1/4 xl:w-1/5" 5 class="w-1/4 xl:w-1/5"
6 @select="handleSelect" 6 @select="handleSelect"
  7 + style="position: relative"
7 ref="organizationIdTreeRef" 8 ref="organizationIdTreeRef"
  9 + :style="[{ width: !isFold ? '0rem' : '20rem' }]"
  10 + :class="[!isFold ? 'w-1/4 xl:w-1/1' : 'w-1/4 xl:w-1/5']"
8 /> 11 />
  12 + <div
  13 + style="position: absolute; top: 1.48rem; left: 6.5rem; cursor: pointer"
  14 + :style="[{ left: !isFold ? '0.5rem' : '6.5rem' }, { top: !isFold ? '0.8rem' : '1.48rem' }]"
  15 + >
  16 + <Tooltip v-if="isFold">
  17 + <template #title>隐藏组织</template>
  18 + <MenuFoldOutlined @click="changeWidth(true)" />
  19 + </Tooltip>
  20 + <Tooltip v-else>
  21 + <template #title>打开组织</template>
  22 + <MenuUnfoldOutlined @click="changeWidth(false)" />
  23 + </Tooltip>
  24 + </div>
9 <BasicTable 25 <BasicTable
10 @register="registerTable" 26 @register="registerTable"
11 :searchInfo="searchInfo" 27 :searchInfo="searchInfo"
12 class="w-3/4 xl:w-4/5" 28 class="w-3/4 xl:w-4/5"
13 :clickToRowSelect="false" 29 :clickToRowSelect="false"
  30 + :class="[!isFold ? 'w-3/4 xl:w-7/7' : 'w-3/4 xl:w-4/5']"
14 > 31 >
15 <template #toolbar> 32 <template #toolbar>
16 <Authority value="api:yt:alarm:profile:post"> 33 <Authority value="api:yt:alarm:profile:post">
@@ -81,7 +98,7 @@ @@ -81,7 +98,7 @@
81 </template> 98 </template>
82 99
83 <script lang="ts"> 100 <script lang="ts">
84 - import { defineComponent, reactive, h, nextTick } from 'vue'; 101 + import { defineComponent, reactive, h, nextTick, ref } from 'vue';
85 import { BasicTable, useTable, TableAction } from '/@/components/Table'; 102 import { BasicTable, useTable, TableAction } from '/@/components/Table';
86 import { PageWrapper } from '/@/components/Page'; 103 import { PageWrapper } from '/@/components/Page';
87 import { useDrawer } from '/@/components/Drawer'; 104 import { useDrawer } from '/@/components/Drawer';
@@ -89,7 +106,7 @@ @@ -89,7 +106,7 @@
89 import { useResetOrganizationTree, OrganizationIdTree } from '/@/views/common/organizationIdTree'; 106 import { useResetOrganizationTree, OrganizationIdTree } from '/@/views/common/organizationIdTree';
90 import { deleteAlarmConfig, queryAlarmConfig } from '/@/api/alarm/config/alarmConfig'; 107 import { deleteAlarmConfig, queryAlarmConfig } from '/@/api/alarm/config/alarmConfig';
91 import { searchFormSchema, columns } from './config.data'; 108 import { searchFormSchema, columns } from './config.data';
92 - import { Modal } from 'ant-design-vue'; 109 + import { Modal, Tooltip } from 'ant-design-vue';
93 import { JsonPreview } from '/@/components/CodeEditor'; 110 import { JsonPreview } from '/@/components/CodeEditor';
94 import { findDictItemByCode } from '/@/api/system/dict'; 111 import { findDictItemByCode } from '/@/api/system/dict';
95 import { alarmContactGetPage } from '/@/api/device/deviceConfigApi'; 112 import { alarmContactGetPage } from '/@/api/device/deviceConfigApi';
@@ -98,6 +115,7 @@ @@ -98,6 +115,7 @@
98 import { putAlarmConfigStatus } from '/@/api/alarm/config/alarmConfig'; 115 import { putAlarmConfigStatus } from '/@/api/alarm/config/alarmConfig';
99 import { useMessage } from '/@/hooks/web/useMessage'; 116 import { useMessage } from '/@/hooks/web/useMessage';
100 import { Authority } from '/@/components/Authority'; 117 import { Authority } from '/@/components/Authority';
  118 + import { MenuFoldOutlined, MenuUnfoldOutlined } from '@ant-design/icons-vue';
101 119
102 export default defineComponent({ 120 export default defineComponent({
103 components: { 121 components: {
@@ -108,8 +126,13 @@ @@ -108,8 +126,13 @@
108 ContactDrawer, 126 ContactDrawer,
109 Switch, 127 Switch,
110 Authority, 128 Authority,
  129 + MenuFoldOutlined,
  130 + MenuUnfoldOutlined,
  131 + Tooltip,
111 }, 132 },
112 setup() { 133 setup() {
  134 + const isFold = ref(true);
  135 +
113 const searchInfo = reactive<Recordable>({}); 136 const searchInfo = reactive<Recordable>({});
114 const { organizationIdTreeRef, resetFn } = useResetOrganizationTree(searchInfo); 137 const { organizationIdTreeRef, resetFn } = useResetOrganizationTree(searchInfo);
115 // 刷新 138 // 刷新
@@ -237,6 +260,13 @@ @@ -237,6 +260,13 @@
237 reload(); 260 reload();
238 } 261 }
239 }; 262 };
  263 + const changeWidth = (e) => {
  264 + if (e) {
  265 + isFold.value = false;
  266 + } else {
  267 + isFold.value = true;
  268 + }
  269 + };
240 return { 270 return {
241 searchInfo, 271 searchInfo,
242 hasBatchDelete, 272 hasBatchDelete,
@@ -250,6 +280,8 @@ @@ -250,6 +280,8 @@
250 showAlarmContact, 280 showAlarmContact,
251 showMessageMode, 281 showMessageMode,
252 statusChange, 282 statusChange,
  283 + changeWidth,
  284 + isFold,
253 }; 285 };
254 }, 286 },
255 }); 287 });