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> |