优化
This commit is contained in:
@@ -3,23 +3,15 @@ import { Maximize2, Minimize2 } from '@lucide/vue'
|
||||
import { ref, watch } from 'vue'
|
||||
import AppDialog from '@/shared/components/AppDialog.vue'
|
||||
import GlobalSmartLoadingView from '../pages/GlobalSmartLoadingView.vue'
|
||||
import { SMART_LOADING_WAREHOUSE_GROUPS } from '../smartLoadingChannelGroups'
|
||||
|
||||
const open = defineModel<boolean>({ default: false })
|
||||
const fullscreen = ref(false)
|
||||
const warehouseCode = ref('')
|
||||
const workbench = ref<InstanceType<typeof GlobalSmartLoadingView> | null>(null)
|
||||
|
||||
watch(open, (value) => {
|
||||
if (!value) {
|
||||
fullscreen.value = false
|
||||
warehouseCode.value = ''
|
||||
}
|
||||
})
|
||||
|
||||
function selectWarehouse(code: string) {
|
||||
void workbench.value?.selectWarehouse(code)
|
||||
}
|
||||
</script>
|
||||
|
||||
<template>
|
||||
@@ -37,9 +29,6 @@ function selectWarehouse(code: string) {
|
||||
<div class="smart-loading-dialog__header">
|
||||
<div class="smart-loading-dialog__heading">
|
||||
<span>智能装柜</span>
|
||||
<el-tabs :model-value="warehouseCode" class="smart-loading-dialog__warehouses" aria-label="装柜仓库" @tab-change="selectWarehouse(String($event))">
|
||||
<el-tab-pane v-for="warehouse in SMART_LOADING_WAREHOUSE_GROUPS" :key="warehouse.code" :label="warehouse.name" :name="warehouse.code" />
|
||||
</el-tabs>
|
||||
</div>
|
||||
<el-tooltip :content="fullscreen ? '退出全屏' : '展开全屏'" placement="bottom">
|
||||
<el-button text :aria-label="fullscreen ? '退出全屏' : '展开全屏'" @click="fullscreen = !fullscreen">
|
||||
@@ -49,25 +38,21 @@ function selectWarehouse(code: string) {
|
||||
</el-tooltip>
|
||||
</div>
|
||||
</template>
|
||||
<GlobalSmartLoadingView ref="workbench" v-model:warehouse-code="warehouseCode" embedded />
|
||||
<GlobalSmartLoadingView embedded />
|
||||
</AppDialog>
|
||||
</template>
|
||||
|
||||
<style scoped>
|
||||
:global(.smart-loading-dialog.app-dialog.el-dialog) { width: min(1600px, 98vw); max-height: 94vh; margin-block: 3vh !important; }
|
||||
:global(.smart-loading-dialog.app-dialog.el-dialog.is-fullscreen) { width: 100%; height: 100vh; max-height: 100vh; margin: 0 !important; border-radius: 0; }
|
||||
:global(.smart-loading-dialog .el-dialog__body) { padding: 0 16px 16px; }
|
||||
:global(.smart-loading-dialog .el-dialog__body) { padding: 0 }
|
||||
:global(.smart-loading-dialog .app-dialog__body) { min-width: 0; }
|
||||
.smart-loading-dialog__header { display: flex; align-items: center; justify-content: space-between; gap: 12px; width: 100%; color: var(--cc-text); font-size: 18px; font-weight: 600; line-height: 24px; }
|
||||
.smart-loading-dialog__heading { display: flex; min-width: 0; align-items: center; gap: 24px; }
|
||||
.smart-loading-dialog__heading > span { flex: 0 0 auto; }
|
||||
.smart-loading-dialog__warehouses { min-width: 0; }
|
||||
.smart-loading-dialog__warehouses :deep(.el-tabs__header) { margin: 0; }
|
||||
.smart-loading-dialog__warehouses :deep(.el-tabs__nav-wrap::after), .smart-loading-dialog__warehouses :deep(.el-tabs__content) { display: none; }
|
||||
.smart-loading-dialog__warehouses :deep(.el-tabs__item) { height: 38px; padding-inline: 16px; font-size: 14px; font-weight: 600; }
|
||||
.smart-loading-dialog__header :deep(.el-button) { flex: 0 0 auto; margin-right: 24px; color: var(--cc-muted); }
|
||||
@media (max-width: 720px) {
|
||||
:global(.smart-loading-dialog.app-dialog.el-dialog) { width: calc(100vw - 12px); max-height: calc(100svh - 12px); margin-block: 6px !important; }
|
||||
:global(.smart-loading-dialog .el-dialog__body) { padding: 0 8px 8px; }
|
||||
:global(.smart-loading-dialog .el-dialog__body) { padding: 0 }
|
||||
}
|
||||
</style>
|
||||
|
||||
Reference in New Issue
Block a user