简柏林 / thingskit-front · Commits

Commit 4365929bdf27dc0458ac13b888e914d735623a4b

Authored by fengtao
1 parent 6ee0079c

fix：移除之前写的组织列表显示和隐藏

Inline Side-by-side
Showing 7 changed files with 46 additions and 113 deletions
@@ -9,20 +9,8 @@ @@ -9,20 +9,8 @@
9 :style="[{ width: !isFold ? '0rem' : '20rem' }]" 9 :style="[{ width: !isFold ? '0rem' : '20rem' }]"
10 :class="[!isFold ? 'w-1/4 xl:w-1/1' : 'w-1/4 xl:w-1/5']" 10 :class="[!isFold ? 'w-1/4 xl:w-1/1' : 'w-1/4 xl:w-1/5']"
11 /> 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>  
25 <BasicTable 12 <BasicTable
  13 + style="flex: auto"
26 @register="registerTable" 14 @register="registerTable"
27 :searchInfo="searchInfo" 15 :searchInfo="searchInfo"
28 class="w-3/4 xl:w-4/5" 16 class="w-3/4 xl:w-4/5"
@@ -106,7 +94,7 @@ @@ -106,7 +94,7 @@
106 import { useResetOrganizationTree, OrganizationIdTree } from '/@/views/common/organizationIdTree'; 94 import { useResetOrganizationTree, OrganizationIdTree } from '/@/views/common/organizationIdTree';
107 import { deleteAlarmConfig, queryAlarmConfig } from '/@/api/alarm/config/alarmConfig'; 95 import { deleteAlarmConfig, queryAlarmConfig } from '/@/api/alarm/config/alarmConfig';
108 import { searchFormSchema, columns } from './config.data'; 96 import { searchFormSchema, columns } from './config.data';
109 - import { Modal, Tooltip } from 'ant-design-vue'; 97 + import { Modal } from 'ant-design-vue';
110 import { JsonPreview } from '/@/components/CodeEditor'; 98 import { JsonPreview } from '/@/components/CodeEditor';
111 import { findDictItemByCode } from '/@/api/system/dict'; 99 import { findDictItemByCode } from '/@/api/system/dict';
112 import { alarmContactGetPage } from '/@/api/device/deviceConfigApi'; 100 import { alarmContactGetPage } from '/@/api/device/deviceConfigApi';
@@ -115,7 +103,6 @@ @@ -115,7 +103,6 @@
115 import { putAlarmConfigStatus } from '/@/api/alarm/config/alarmConfig'; 103 import { putAlarmConfigStatus } from '/@/api/alarm/config/alarmConfig';
116 import { useMessage } from '/@/hooks/web/useMessage'; 104 import { useMessage } from '/@/hooks/web/useMessage';
117 import { Authority } from '/@/components/Authority'; 105 import { Authority } from '/@/components/Authority';
118 - import { MenuFoldOutlined, MenuUnfoldOutlined } from '@ant-design/icons-vue';  
119 106
120 export default defineComponent({ 107 export default defineComponent({
121 components: { 108 components: {
@@ -126,9 +113,6 @@ @@ -126,9 +113,6 @@
126 ContactDrawer, 113 ContactDrawer,
127 Switch, 114 Switch,
128 Authority, 115 Authority,
129 - MenuFoldOutlined,  
130 - MenuUnfoldOutlined,  
131 - Tooltip,  
132 }, 116 },
133 setup() { 117 setup() {
134 const isFold = ref(true); 118 const isFold = ref(true);
@@ -9,20 +9,8 @@ @@ -9,20 +9,8 @@
9 @select="handleSelect" 9 @select="handleSelect"
10 ref="organizationIdTreeRef" 10 ref="organizationIdTreeRef"
11 /> 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>  
25 <BasicTable 12 <BasicTable
  13 + style="flex: auto"
26 @register="registerTable" 14 @register="registerTable"
27 :searchInfo="searchInfo" 15 :searchInfo="searchInfo"
28 class="w-3/4 xl:w-4/5" 16 class="w-3/4 xl:w-4/5"
@@ -82,8 +70,6 @@ @@ -82,8 +70,6 @@
82 import { getAlarmContact, deleteAlarmContact } from '/@/api/alarm/contact/alarmContact'; 70 import { getAlarmContact, deleteAlarmContact } from '/@/api/alarm/contact/alarmContact';
83 import { searchFormSchema, columns } from './config.data'; 71 import { searchFormSchema, columns } from './config.data';
84 import { Authority } from '/@/components/Authority'; 72 import { Authority } from '/@/components/Authority';
85 - import { MenuFoldOutlined, MenuUnfoldOutlined } from '@ant-design/icons-vue';  
86 - import { Tooltip } from 'ant-design-vue';  
87 73
88 export default defineComponent({ 74 export default defineComponent({
89 components: { 75 components: {
@@ -93,9 +79,6 @@ @@ -93,9 +79,6 @@
93 TableAction, 79 TableAction,
94 ContactDrawer, 80 ContactDrawer,
95 Authority, 81 Authority,
96 - MenuFoldOutlined,  
97 - MenuUnfoldOutlined,  
98 - Tooltip,  
99 }, 82 },
100 setup() { 83 setup() {
101 const isFold = ref(true); 84 const isFold = ref(true);
@@ -9,20 +9,8 @@ @@ -9,20 +9,8 @@
9 :style="[{ width: !isFold ? '0rem' : '20rem' }]" 9 :style="[{ width: !isFold ? '0rem' : '20rem' }]"
10 :class="[!isFold ? 'w-1/4 xl:w-1/1' : 'w-1/4 xl:w-1/5']" 10 :class="[!isFold ? 'w-1/4 xl:w-1/1' : 'w-1/4 xl:w-1/5']"
11 /> 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>  
25 <BasicTable 12 <BasicTable
  13 + style="flex: auto"
26 :clickToRowSelect="false" 14 :clickToRowSelect="false"
27 @register="registerTable" 15 @register="registerTable"
28 :searchInfo="searchInfo" 16 :searchInfo="searchInfo"
@@ -104,8 +92,6 @@ @@ -104,8 +92,6 @@
104 import { useModal } from '/@/components/Modal'; 92 import { useModal } from '/@/components/Modal';
105 import { Authority } from '/@/components/Authority'; 93 import { Authority } from '/@/components/Authority';
106 import { useBatchDelete } from '/@/hooks/web/useBatchDelete'; 94 import { useBatchDelete } from '/@/hooks/web/useBatchDelete';
107 - import { MenuFoldOutlined, MenuUnfoldOutlined } from '@ant-design/icons-vue';  
108 - import { Tooltip } from 'ant-design-vue';  
109 95
110 export default defineComponent({ 96 export default defineComponent({
111 components: { 97 components: {
@@ -117,9 +103,6 @@ @@ -117,9 +103,6 @@
117 VideoPreviewModal, 103 VideoPreviewModal,
118 TableImg, 104 TableImg,
119 Authority, 105 Authority,
120 - MenuFoldOutlined,  
121 - MenuUnfoldOutlined,  
122 - Tooltip,  
123 }, 106 },
124 setup() { 107 setup() {
125 const isFold = ref(true); 108 const isFold = ref(true);
1 <template> 1 <template>
2 - <div class="bg-white m-4 mr-0 overflow-hidden"> 2 + <div :style="foldIconStyle">
  3 + <Tooltip v-if="isFold">
  4 + <template #title>隐藏组织</template>
  5 + <MenuFoldOutlined @click="changeWidth(true)" />
  6 + </Tooltip>
  7 + <Tooltip v-else>
  8 + <template #title>打开组织</template>
  9 + <MenuUnfoldOutlined @click="changeWidth(false)" />
  10 + </Tooltip>
  11 + </div>
  12 + <div v-show="isFold" class="bg-white m-4 mr-0 overflow-hidden">
3 <BasicTree 13 <BasicTree
4 - v-if="treeData.length > 0"  
5 title="组织列表" 14 title="组织列表"
6 toolbar 15 toolbar
7 search 16 search
@@ -15,13 +24,39 @@ @@ -15,13 +24,39 @@
15 </div> 24 </div>
16 </template> 25 </template>
17 <script lang="ts" setup name="OrganizationIdTree"> 26 <script lang="ts" setup name="OrganizationIdTree">
18 - import { onMounted, ref } from 'vue'; 27 + import { onMounted, ref, unref } from 'vue';
19 import { BasicTree, TreeItem } from '/@/components/Tree'; 28 import { BasicTree, TreeItem } from '/@/components/Tree';
20 import { getOrganizationList } from '/@/api/system/system'; 29 import { getOrganizationList } from '/@/api/system/system';
  30 + import { MenuFoldOutlined, MenuUnfoldOutlined } from '@ant-design/icons-vue';
  31 + import { computed } from '@vue/reactivity';
21 const emit = defineEmits(['select']); 32 const emit = defineEmits(['select']);
22 const treeData = ref<TreeItem[]>([]); 33 const treeData = ref<TreeItem[]>([]);
23 const selectedKeys = ref<string[]>(); 34 const selectedKeys = ref<string[]>();
24 const treeExpandData = ref([]); 35 const treeExpandData = ref([]);
  36 +
  37 + const isFold = ref(false);
  38 +
  39 + const changeWidth = (e) => {
  40 + if (e) {
  41 + isFold.value = false;
  42 + } else {
  43 + isFold.value = true;
  44 + }
  45 + };
  46 +
  47 + const foldIconStyle = computed(() => {
  48 + return unref(isFold)
  49 + ? {
  50 + padding: '22px 0 0 16px',
  51 + position: 'absolute',
  52 + left: '85px',
  53 + lineHeight: '24px',
  54 + }
  55 + : {
  56 + padding: '22px 0 0 16px',
  57 + };
  58 + });
  59 +
25 //获取所有父级id 60 //获取所有父级id
26 function findForAllId(data = [], arr = []) { 61 function findForAllId(data = [], arr = []) {
27 for (const item of data) { 62 for (const item of data) {
@@ -9,20 +9,8 @@ @@ -9,20 +9,8 @@
9 :style="[{ width: !isFold ? '0rem' : '20rem' }]" 9 :style="[{ width: !isFold ? '0rem' : '20rem' }]"
10 :class="[!isFold ? 'w-1/4 xl:w-1/1' : 'w-1/4 xl:w-1/5']" 10 :class="[!isFold ? 'w-1/4 xl:w-1/1' : 'w-1/4 xl:w-1/5']"
11 /> 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>  
25 <BasicTable 12 <BasicTable
  13 + style="flex: auto"
26 :clickToRowSelect="false" 14 :clickToRowSelect="false"
27 @register="registerTable" 15 @register="registerTable"
28 :searchInfo="searchInfo" 16 :searchInfo="searchInfo"
@@ -99,8 +87,6 @@ @@ -99,8 +87,6 @@
99 import { useBatchDelete } from '/@/hooks/web/useBatchDelete'; 87 import { useBatchDelete } from '/@/hooks/web/useBatchDelete';
100 import { getAppEnvConfig, isDevMode } from '/@/utils/env'; 88 import { getAppEnvConfig, isDevMode } from '/@/utils/env';
101 import { Authority } from '/@/components/Authority'; 89 import { Authority } from '/@/components/Authority';
102 - import { MenuFoldOutlined, MenuUnfoldOutlined } from '@ant-design/icons-vue';  
103 - import { Tooltip } from 'ant-design-vue';  
104 90
105 export default defineComponent({ 91 export default defineComponent({
106 components: { 92 components: {
@@ -110,9 +96,6 @@ @@ -110,9 +96,6 @@
110 TableAction, 96 TableAction,
111 ContactDrawer, 97 ContactDrawer,
112 Authority, 98 Authority,
113 - MenuFoldOutlined,  
114 - MenuUnfoldOutlined,  
115 - Tooltip,  
116 }, 99 },
117 setup() { 100 setup() {
118 const isFold = ref(true); 101 const isFold = ref(true);
@@ -8,20 +8,8 @@ @@ -8,20 +8,8 @@
8 :class="[!isFold ? 'w-1/4 xl:w-1/1' : 'w-1/4 xl:w-1/5']" 8 :class="[!isFold ? 'w-1/4 xl:w-1/1' : 'w-1/4 xl:w-1/5']"
9 ref="organizationIdTreeRef" 9 ref="organizationIdTreeRef"
10 /> 10 />
11 - <div  
12 - style="position: absolute; top: 1.48rem; left: 6.5rem; cursor: pointer"  
13 - :style="[{ left: !isFold ? '0.5rem' : '6.5rem' }, { top: !isFold ? '0.8rem' : '1.48rem' }]"  
14 - >  
15 - <Tooltip v-if="isFold">  
16 - <template #title>隐藏组织</template>  
17 - <MenuFoldOutlined @click="changeWidth(true)" />  
18 - </Tooltip>  
19 - <Tooltip v-else>  
20 - <template #title>打开组织</template>  
21 - <MenuUnfoldOutlined @click="changeWidth(false)" />  
22 - </Tooltip>  
23 - </div>  
24 <BasicTable 11 <BasicTable
  12 + style="flex: auto"
25 @register="registerTable" 13 @register="registerTable"
26 class="w-5/6 xl:w-4/5" 14 class="w-5/6 xl:w-4/5"
27 :class="[!isFold ? 'w-423 xl:w-423' : 'w-5/6 xl:w-4/5']" 15 :class="[!isFold ? 'w-423 xl:w-423' : 'w-5/6 xl:w-4/5']"
@@ -201,11 +189,7 @@ @@ -201,11 +189,7 @@
201 import { authBtn } from '/@/enums/roleEnum'; 189 import { authBtn } from '/@/enums/roleEnum';
202 import { useBatchDelete } from '/@/hooks/web/useBatchDelete'; 190 import { useBatchDelete } from '/@/hooks/web/useBatchDelete';
203 import { useCopyToClipboard } from '/@/hooks/web/useCopyToClipboard'; 191 import { useCopyToClipboard } from '/@/hooks/web/useCopyToClipboard';
204 - import {  
205 - QuestionCircleOutlined,  
206 - MenuFoldOutlined,  
207 - MenuUnfoldOutlined,  
208 - } from '@ant-design/icons-vue'; 192 + import { QuestionCircleOutlined } from '@ant-design/icons-vue';
209 import { Authority } from '/@/components/Authority'; 193 import { Authority } from '/@/components/Authority';
210 194
211 export default defineComponent({ 195 export default defineComponent({
@@ -224,8 +208,6 @@ @@ -224,8 +208,6 @@
224 QuestionCircleOutlined, 208 QuestionCircleOutlined,
225 Popover, 209 Popover,
226 Authority, 210 Authority,
227 - MenuFoldOutlined,  
228 - MenuUnfoldOutlined,  
229 }, 211 },
230 setup(_) { 212 setup(_) {
231 const isFold = ref(true); 213 const isFold = ref(true);
@@ -9,20 +9,8 @@ @@ -9,20 +9,8 @@
9 :style="[{ width: !isFold ? '0rem' : '20rem' }]" 9 :style="[{ width: !isFold ? '0rem' : '20rem' }]"
10 :class="[!isFold ? 'w-1/4 xl:w-1/1' : 'w-1/4 xl:w-1/5']" 10 :class="[!isFold ? 'w-1/4 xl:w-1/1' : 'w-1/4 xl:w-1/5']"
11 /> 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>  
25 <BasicTable 12 <BasicTable
  13 + style="flex: auto"
26 :clickToRowSelect="false" 14 :clickToRowSelect="false"
27 @register="registerTable" 15 @register="registerTable"
28 class="w-3/4 xl:w-4/5" 16 class="w-3/4 xl:w-4/5"
@@ -113,8 +101,6 @@ @@ -113,8 +101,6 @@
113 import { useGo } from '/@/hooks/web/usePage'; 101 import { useGo } from '/@/hooks/web/usePage';
114 import { useBatchDelete } from '/@/hooks/web/useBatchDelete'; 102 import { useBatchDelete } from '/@/hooks/web/useBatchDelete';
115 import { Authority } from '/@/components/Authority'; 103 import { Authority } from '/@/components/Authority';
116 - import { MenuFoldOutlined, MenuUnfoldOutlined } from '@ant-design/icons-vue';  
117 - import { Tooltip } from 'ant-design-vue';  
118 104
119 export default defineComponent({ 105 export default defineComponent({
120 name: 'AccountManagement', 106 name: 'AccountManagement',
@@ -126,9 +112,6 @@ @@ -126,9 +112,6 @@
126 TableAction, 112 TableAction,
127 Tag, 113 Tag,
128 Authority, 114 Authority,
129 - MenuFoldOutlined,  
130 - MenuUnfoldOutlined,  
131 - Tooltip,  
132 }, 115 },
133 setup() { 116 setup() {
134 const isFold = ref(true); 117 const isFold = ref(true);