Commit d29129b7d480fd957d1b2dc3e6589956e542a04a
1 parent
75d71b6d
perf: switch column layout container width
Showing
1 changed file
with
11 additions
and
7 deletions
@@ -140,8 +140,10 @@ | @@ -140,8 +140,10 @@ | ||
140 | onMounted(() => { | 140 | onMounted(() => { |
141 | const clientHeight = document.documentElement.clientHeight; | 141 | const clientHeight = document.documentElement.clientHeight; |
142 | const rect = getBoundingClientRect(unref(listEl)!.$el!) as DOMRect; | 142 | const rect = getBoundingClientRect(unref(listEl)!.$el!) as DOMRect; |
143 | - const paginationHeight = 24 + 24; | ||
144 | - const listContainerMarginBottom = 16 + 8 + 32 + 20; | 143 | + // margin-top 24 height 24 |
144 | + const paginationHeight = 24 + 24 + 8; | ||
145 | + // list pading top 8 maring-top 8 extra slot 56 | ||
146 | + const listContainerMarginBottom = 8 + 8 + 56; | ||
145 | const listContainerHeight = | 147 | const listContainerHeight = |
146 | clientHeight - rect.top - paginationHeight - listContainerMarginBottom; | 148 | clientHeight - rect.top - paginationHeight - listContainerMarginBottom; |
147 | const listContainerEl = (unref(listEl)!.$el as HTMLElement).querySelector( | 149 | const listContainerEl = (unref(listEl)!.$el as HTMLElement).querySelector( |
@@ -175,7 +177,8 @@ | @@ -175,7 +177,8 @@ | ||
175 | <Button type="primary" @click="handleCreateOrUpdate()">新增组态</Button> | 177 | <Button type="primary" @click="handleCreateOrUpdate()">新增组态</Button> |
176 | <Popover :trigger="['hover']"> | 178 | <Popover :trigger="['hover']"> |
177 | <template #content> | 179 | <template #content> |
178 | - <div class="w-40"> | 180 | + <div class="w-50"> |
181 | + <div>每行显示数量</div> | ||
179 | <Slider | 182 | <Slider |
180 | v-model:value="listColumn" | 183 | v-model:value="listColumn" |
181 | :max="12" | 184 | :max="12" |
@@ -189,9 +192,11 @@ | @@ -189,9 +192,11 @@ | ||
189 | <AppstoreOutlined /> | 192 | <AppstoreOutlined /> |
190 | </Button> | 193 | </Button> |
191 | </Popover> | 194 | </Popover> |
192 | - <Button type="primary" @click="getListData"> | ||
193 | - <ReloadOutlined @click="getListData" /> | ||
194 | - </Button> | 195 | + <Tooltip title="刷新"> |
196 | + <Button type="primary" @click="getListData"> | ||
197 | + <ReloadOutlined @click="getListData" /> | ||
198 | + </Button> | ||
199 | + </Tooltip> | ||
195 | </div> | 200 | </div> |
196 | </template> | 201 | </template> |
197 | <template #renderItem="{ item }"> | 202 | <template #renderItem="{ item }"> |
@@ -257,6 +262,5 @@ | @@ -257,6 +262,5 @@ | ||
257 | 262 | ||
258 | .configuration-list:deep(.ant-list-pagination) { | 263 | .configuration-list:deep(.ant-list-pagination) { |
259 | height: 24px; | 264 | height: 24px; |
260 | - background-color: #fff; | ||
261 | } | 265 | } |
262 | </style> | 266 | </style> |