style: 修改仓储管理中库位信息的新增/编辑弹框样式

main
zhongwenkai 2 weeks ago
parent 4f6bdec21d
commit e7ff7f128f

@ -1,113 +1,148 @@
<template>
<Dialog :title="dialogTitle" v-model="dialogVisible">
<el-form
ref="formRef"
:model="formData"
:rules="formRules"
label-width="120px"
v-loading="formLoading"
>
<el-form-item :label="t('ErpStock.WarehouseLocation.warehouseId')" prop="warehouseId">
<el-select
v-model="formData.warehouseId"
:placeholder="t('ErpStock.WarehouseLocation.placeholderWarehouseId')"
class="!w-1/1"
@change="handleWarehouseChange"
>
<el-option
v-for="item in warehouseList"
:key="item.id"
:label="item.name"
:value="item.id"
/>
</el-select>
</el-form-item>
<el-form-item :label="t('ErpStock.WarehouseLocation.areaId')" prop="areaId">
<el-select
v-model="formData.areaId"
:placeholder="t('ErpStock.WarehouseLocation.placeholderAreaId')"
class="!w-1/1"
>
<el-option
v-for="item in filteredAreaList"
:key="item.id"
:label="item.areaName"
:value="item.id"
/>
</el-select>
</el-form-item>
<el-form-item :label="t('ErpStock.WarehouseLocation.code')" prop="code">
<el-row :gutter="10" class="!w-full">
<el-col :xs="24" :sm="18" :md="16" :lg="14" :xl="12">
<el-input v-model="formData.code" :placeholder="t('ErpStock.WarehouseLocation.placeholderCode')" :disabled="formData.isCode == true || formType === 'update'" />
</el-col>
<el-col :xs="24" :sm="6" :md="4" :lg="3" :xl="2">
<div>
<el-switch v-model="formData.isCode" :disabled="formType === 'update'" />
</div>
</el-col>
</el-row>
</el-form-item>
<el-form-item :label="t('ErpStock.WarehouseLocation.name')" prop="name">
<el-input v-model="formData.name" :placeholder="t('ErpStock.WarehouseLocation.placeholderName')" />
</el-form-item>
<el-form-item :label="t('ErpStock.WarehouseLocation.areaSize')" prop="areaSize">
<el-input-number
v-model="formData.areaSize"
:placeholder="t('ErpStock.WarehouseLocation.placeholderAreaSize')"
:min="0"
:precision="2"
class="!w-1/1"
/>
</el-form-item>
<el-form-item :label="t('ErpStock.WarehouseLocation.maxLoadWeight')" prop="maxLoadWeight">
<el-input-number
v-model="formData.maxLoadWeight"
:placeholder="t('ErpStock.WarehouseLocation.placeholderMaxLoadWeight')"
:min="0"
:precision="2"
class="!w-1/1"
/>
</el-form-item>
<el-form-item :label="t('ErpStock.WarehouseLocation.positionX')" prop="positionX">
<el-input-number
v-model="formData.positionX"
:placeholder="t('ErpStock.WarehouseLocation.placeholderPositionX')"
:precision="0"
class="!w-1/1"
/>
</el-form-item>
<el-form-item :label="t('ErpStock.WarehouseLocation.positionY')" prop="positionY">
<el-input-number
v-model="formData.positionY"
:placeholder="t('ErpStock.WarehouseLocation.placeholderPositionY')"
:precision="0"
class="!w-1/1"
/>
</el-form-item>
<el-form-item :label="t('ErpStock.WarehouseLocation.positionZ')" prop="positionZ">
<el-input-number
v-model="formData.positionZ"
:placeholder="t('ErpStock.WarehouseLocation.placeholderPositionZ')"
:precision="0"
class="!w-1/1"
/>
</el-form-item>
<el-form-item :label="t('ErpStock.WarehouseLocation.allowProductMix')" prop="allowProductMix">
<el-switch v-model="formData.allowProductMix" />
</el-form-item>
<el-form-item :label="t('ErpStock.WarehouseLocation.allowBatchMix')" prop="allowBatchMix">
<el-switch v-model="formData.allowBatchMix" />
</el-form-item>
<el-form-item :label="t('ErpStock.WarehouseLocation.status')" prop="status">
<el-switch v-model="formData.status" :active-value="CommonStatusEnum.ENABLE" :inactive-value="CommonStatusEnum.DISABLE" />
</el-form-item>
</el-form>
<template #footer>
<div class="warehouse-location-panel">
<div class="warehouse-location-panel__header">
<div class="warehouse-location-panel__title">{{ dialogTitle }}</div>
<el-button text @click="closeForm">
<Icon icon="ep:close" />
</el-button>
</div>
<div class="warehouse-location-dialog" v-loading="formLoading">
<el-form ref="formRef" :model="formData" :rules="formRules" label-width="120px">
<section class="warehouse-location-section">
<div class="warehouse-location-section__title">基本信息</div>
<el-row :gutter="20">
<el-col :span="8">
<el-form-item :label="t('ErpStock.WarehouseLocation.warehouseId')" prop="warehouseId">
<el-select
v-model="formData.warehouseId"
:placeholder="t('ErpStock.WarehouseLocation.placeholderWarehouseId')"
class="!w-full"
@change="handleWarehouseChange"
>
<el-option
v-for="item in warehouseList"
:key="item.id"
:label="item.name"
:value="item.id"
/>
</el-select>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item :label="t('ErpStock.WarehouseLocation.areaId')" prop="areaId">
<el-select
v-model="formData.areaId"
:placeholder="t('ErpStock.WarehouseLocation.placeholderAreaId')"
class="!w-full"
>
<el-option
v-for="item in filteredAreaList"
:key="item.id"
:label="item.areaName"
:value="item.id"
/>
</el-select>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item :label="t('ErpStock.WarehouseLocation.code')" prop="code">
<el-row :gutter="10" class="!w-full">
<el-col :span="18">
<el-input v-model="formData.code" :placeholder="t('ErpStock.WarehouseLocation.placeholderCode')" :disabled="formData.isCode == true || formType === 'update'" />
</el-col>
<el-col :span="6">
<el-switch v-model="formData.isCode" :disabled="formType === 'update'" />
</el-col>
</el-row>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="8">
<el-form-item :label="t('ErpStock.WarehouseLocation.name')" prop="name">
<el-input v-model="formData.name" :placeholder="t('ErpStock.WarehouseLocation.placeholderName')" class="!w-full" />
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item :label="t('ErpStock.WarehouseLocation.areaSize')" prop="areaSize">
<el-input-number
v-model="formData.areaSize"
:placeholder="t('ErpStock.WarehouseLocation.placeholderAreaSize')"
:min="0"
:precision="2"
class="!w-full"
/>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item :label="t('ErpStock.WarehouseLocation.maxLoadWeight')" prop="maxLoadWeight">
<el-input-number
v-model="formData.maxLoadWeight"
:placeholder="t('ErpStock.WarehouseLocation.placeholderMaxLoadWeight')"
:min="0"
:precision="2"
class="!w-full"
/>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="8">
<el-form-item :label="t('ErpStock.WarehouseLocation.positionX')" prop="positionX">
<el-input-number
v-model="formData.positionX"
:placeholder="t('ErpStock.WarehouseLocation.placeholderPositionX')"
:precision="0"
class="!w-full"
/>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item :label="t('ErpStock.WarehouseLocation.positionY')" prop="positionY">
<el-input-number
v-model="formData.positionY"
:placeholder="t('ErpStock.WarehouseLocation.placeholderPositionY')"
:precision="0"
class="!w-full"
/>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item :label="t('ErpStock.WarehouseLocation.positionZ')" prop="positionZ">
<el-input-number
v-model="formData.positionZ"
:placeholder="t('ErpStock.WarehouseLocation.placeholderPositionZ')"
:precision="0"
class="!w-full"
/>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="8">
<el-form-item :label="t('ErpStock.WarehouseLocation.allowProductMix')" prop="allowProductMix">
<el-switch v-model="formData.allowProductMix" />
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item :label="t('ErpStock.WarehouseLocation.allowBatchMix')" prop="allowBatchMix">
<el-switch v-model="formData.allowBatchMix" />
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item :label="t('ErpStock.WarehouseLocation.status')" prop="status">
<el-switch v-model="formData.status" :active-value="CommonStatusEnum.ENABLE" :inactive-value="CommonStatusEnum.DISABLE" />
</el-form-item>
</el-col>
</el-row>
</section>
</el-form>
</div>
<div class="warehouse-location-footer">
<el-button @click="closeForm">{{ t('common.cancel') }}</el-button>
<el-button @click="submitForm" type="primary" :disabled="formLoading">{{ t('common.ok') }}</el-button>
<el-button @click="dialogVisible = false">{{ t('common.cancel') }}</el-button>
</template>
</Dialog>
</div>
</div>
</template>
<script setup lang="ts">
@ -122,7 +157,6 @@ defineOptions({ name: 'WarehouseLocationForm' })
const { t } = useI18n()
const message = useMessage()
const dialogVisible = ref(false)
const dialogTitle = ref('')
const formLoading = ref(false)
const formType = ref('')
@ -164,7 +198,6 @@ const handleWarehouseChange = () => {
}
const open = async (type: string, id?: number) => {
dialogVisible.value = true
dialogTitle.value = t('action.' + type)
formType.value = type
resetForm()
@ -182,7 +215,7 @@ const open = async (type: string, id?: number) => {
}
defineExpose({ open })
const emit = defineEmits(['success'])
const emit = defineEmits(['success', 'closed'])
const submitForm = async () => {
await formRef.value.validate()
formLoading.value = true
@ -198,13 +231,17 @@ const submitForm = async () => {
await WarehouseLocationApi.updateWarehouseLocation(data)
message.success(t('common.updateSuccess'))
}
dialogVisible.value = false
closeForm()
emit('success')
} finally {
formLoading.value = false
}
}
const closeForm = () => {
emit('closed')
}
const resetForm = () => {
formData.value = {
id: undefined,
@ -225,3 +262,93 @@ const resetForm = () => {
formRef.value?.resetFields()
}
</script>
<style lang="scss" scoped>
.warehouse-location-panel {
background: #fff;
border-radius: 12px;
box-shadow: var(--el-box-shadow-light);
}
.warehouse-location-panel__header {
display: flex;
align-items: center;
justify-content: space-between;
padding: 16px 20px;
border-bottom: 1px solid #ebeef5;
}
.warehouse-location-panel__title {
color: #1f2937;
font-size: 18px;
font-weight: 600;
}
.warehouse-location-dialog {
max-height: calc(100vh - 220px);
padding: 20px 20px 0;
padding-right: 16px;
overflow-y: auto;
}
.warehouse-location-section {
margin-bottom: 16px;
padding: 16px 18px 8px;
background: #fff;
border: 1px solid #ebeef5;
border-radius: 10px;
box-shadow: 0 4px 14px rgb(15 23 42 / 4%);
}
.warehouse-location-section__title {
position: relative;
margin-bottom: 16px;
padding-left: 10px;
color: #1f2937;
font-size: 15px;
font-weight: 600;
&::before {
position: absolute;
top: 2px;
left: 0;
width: 3px;
height: 16px;
background: var(--el-color-primary);
border-radius: 999px;
content: '';
}
}
.warehouse-location-footer {
display: flex;
justify-content: flex-end;
gap: 12px;
width: 100%;
padding: 16px 20px 20px;
border-top: 1px solid #ebeef5;
}
@media (max-width: 1200px) {
.warehouse-location-dialog :deep(.el-col) {
max-width: 100%;
flex: 0 0 100%;
}
}
@media (max-width: 768px) {
.warehouse-location-panel__header {
padding: 14px 16px;
}
.warehouse-location-dialog {
max-height: none;
padding: 16px 16px 0;
overflow-y: visible;
}
.warehouse-location-footer {
padding: 16px;
}
}
</style>

@ -1,175 +1,179 @@
<template>
<ContentWrap>
<el-form
class="-mb-15px"
:model="queryParams"
ref="queryFormRef"
:inline="true"
label-width="auto"
>
<el-form-item :label="t('ErpStock.WarehouseLocation.warehouseId')" prop="warehouseId">
<el-select
v-model="queryParams.warehouseId"
:placeholder="t('ErpStock.WarehouseLocation.placeholderWarehouseId')"
clearable
class="!w-240px"
@change="handleWarehouseChange"
<div class="warehouse-location-page">
<template v-if="!formVisible">
<ContentWrap>
<el-form
class="-mb-15px"
:model="queryParams"
ref="queryFormRef"
:inline="true"
label-width="auto"
>
<el-option
v-for="item in warehouseList"
:key="item.id"
:label="item.name"
:value="item.id"
/>
</el-select>
</el-form-item>
<el-form-item :label="t('ErpStock.WarehouseLocation.areaId')" prop="areaId">
<el-select
v-model="queryParams.areaId"
:placeholder="t('ErpStock.WarehouseLocation.placeholderAreaId')"
clearable
class="!w-240px"
<el-form-item :label="t('ErpStock.WarehouseLocation.warehouseId')" prop="warehouseId">
<el-select
v-model="queryParams.warehouseId"
:placeholder="t('ErpStock.WarehouseLocation.placeholderWarehouseId')"
clearable
class="!w-240px"
@change="handleWarehouseChange"
>
<el-option
v-for="item in warehouseList"
:key="item.id"
:label="item.name"
:value="item.id"
/>
</el-select>
</el-form-item>
<el-form-item :label="t('ErpStock.WarehouseLocation.areaId')" prop="areaId">
<el-select
v-model="queryParams.areaId"
:placeholder="t('ErpStock.WarehouseLocation.placeholderAreaId')"
clearable
class="!w-240px"
>
<el-option
v-for="item in filteredAreaList"
:key="item.id"
:label="item.areaName"
:value="item.id"
/>
</el-select>
</el-form-item>
<el-form-item :label="t('ErpStock.WarehouseLocation.code')" prop="code">
<el-input
v-model="queryParams.code"
:placeholder="t('ErpStock.WarehouseLocation.placeholderCode')"
clearable
@keyup.enter="handleQuery"
class="!w-240px"
/>
</el-form-item>
<el-form-item :label="t('ErpStock.WarehouseLocation.name')" prop="name" v-show="showAllFilters">
<el-input
v-model="queryParams.name"
:placeholder="t('ErpStock.WarehouseLocation.placeholderName')"
clearable
@keyup.enter="handleQuery"
class="!w-240px"
/>
</el-form-item>
<el-form-item :label="t('ErpStock.WarehouseLocation.status')" prop="status" v-show="showAllFilters">
<el-select
v-model="queryParams.status"
:placeholder="t('ErpStock.WarehouseLocation.placeholderStatus')"
clearable
class="!w-240px"
>
<el-option
v-for="dict in getIntDictOptions(DICT_TYPE.COMMON_STATUS)"
:key="dict.value"
:label="dict.label"
:value="dict.value"
/>
</el-select>
</el-form-item>
<el-form-item v-if="filterCount > 3">
<el-button type="text" class="text-primary" @click="toggleFilters">
<Icon :icon="showAllFilters ? 'ep:arrow-up' : 'ep:arrow-down'" class="mr-5px" />
{{ showAllFilters ? t('FactoryModeling.FactoryStructure.collapseText') :
t('FactoryModeling.FactoryStructure.expandText') }}
</el-button>
</el-form-item>
<el-form-item>
<el-button @click="handleQuery"><Icon icon="ep:search" class="mr-5px" /> {{ t('common.query') }}</el-button>
<el-button @click="resetQuery"><Icon icon="ep:refresh" class="mr-5px" /> {{ t('common.reset') }}</el-button>
<el-button
type="primary"
plain
@click="openForm('create')"
v-hasPermi="['erp:warehouse-location:create']"
>
<Icon icon="ep:plus" class="mr-5px" /> {{ t('action.add') }}
</el-button>
</el-form-item>
</el-form>
</ContentWrap>
<ContentWrap>
<el-table
v-loading="loading"
:data="list"
:stripe="true"
:show-overflow-tooltip="true"
row-key="id"
>
<el-option
v-for="item in filteredAreaList"
:key="item.id"
:label="item.areaName"
:value="item.id"
/>
</el-select>
</el-form-item>
<el-form-item :label="t('ErpStock.WarehouseLocation.code')" prop="code">
<el-input
v-model="queryParams.code"
:placeholder="t('ErpStock.WarehouseLocation.placeholderCode')"
clearable
@keyup.enter="handleQuery"
class="!w-240px"
/>
</el-form-item>
<el-form-item :label="t('ErpStock.WarehouseLocation.name')" prop="name" v-show="showAllFilters">
<el-input
v-model="queryParams.name"
:placeholder="t('ErpStock.WarehouseLocation.placeholderName')"
clearable
@keyup.enter="handleQuery"
class="!w-240px"
<el-table-column :label="t('ErpStock.WarehouseLocation.warehouseId')" align="center" prop="warehouseId" sortable>
<template #default="scope">
{{ getWarehouseName(scope.row.warehouseId) }}
</template>
</el-table-column>
<el-table-column :label="t('ErpStock.WarehouseLocation.areaId')" align="center" prop="areaId" sortable>
<template #default="scope">
{{ getAreaName(scope.row.areaId) }}
</template>
</el-table-column>
<el-table-column :label="t('ErpStock.WarehouseLocation.code')" align="center" prop="code" sortable />
<el-table-column :label="t('ErpStock.WarehouseLocation.name')" align="center" prop="name" sortable />
<el-table-column :label="t('ErpStock.WarehouseLocation.areaSize')" align="center" prop="areaSize" />
<el-table-column :label="t('ErpStock.WarehouseLocation.maxLoadWeight')" align="center" prop="maxLoadWeight" />
<el-table-column :label="t('ErpStock.WarehouseLocation.position')" align="center">
<template #default="scope">
{{ scope.row.positionX ?? '-' }}, {{ scope.row.positionY ?? '-' }}, {{ scope.row.positionZ ?? '-' }}
</template>
</el-table-column>
<el-table-column :label="t('ErpStock.WarehouseLocation.allowProductMix')" align="center" prop="allowProductMix">
<template #default="scope">
<el-tag :type="scope.row.allowProductMix ? 'success' : 'danger'" size="small">
{{ scope.row.allowProductMix ? t('common.yes') : t('common.no') }}
</el-tag>
</template>
</el-table-column>
<el-table-column :label="t('ErpStock.WarehouseLocation.allowBatchMix')" align="center" prop="allowBatchMix">
<template #default="scope">
<el-tag :type="scope.row.allowBatchMix ? 'success' : 'danger'" size="small">
{{ scope.row.allowBatchMix ? t('common.yes') : t('common.no') }}
</el-tag>
</template>
</el-table-column>
<el-table-column :label="t('ErpStock.WarehouseLocation.status')" align="center" prop="status" sortable>
<template #default="scope">
<dict-tag :type="DICT_TYPE.COMMON_STATUS" :value="scope.row.status" />
</template>
</el-table-column>
<el-table-column :label="t('ErpStock.WarehouseLocation.createTime')" align="center" prop="createTime" :formatter="dateFormatter" width="180px" sortable />
<el-table-column :label="t('common.operate')" align="center" width="150px">
<template #default="scope">
<el-button
link
type="primary"
@click="openForm('update', scope.row.id)"
v-hasPermi="['erp:warehouse-location:update']"
>
{{ t('action.edit') }}
</el-button>
<el-button
link
type="danger"
@click="handleDelete(scope.row.id)"
v-hasPermi="['erp:warehouse-location:delete']"
>
{{ t('action.del') }}
</el-button>
</template>
</el-table-column>
</el-table>
<Pagination
:total="total"
v-model:page="queryParams.pageNo"
v-model:limit="queryParams.pageSize"
@pagination="getList"
/>
</el-form-item>
<el-form-item :label="t('ErpStock.WarehouseLocation.status')" prop="status" v-show="showAllFilters">
<el-select
v-model="queryParams.status"
:placeholder="t('ErpStock.WarehouseLocation.placeholderStatus')"
clearable
class="!w-240px"
>
<el-option
v-for="dict in getIntDictOptions(DICT_TYPE.COMMON_STATUS)"
:key="dict.value"
:label="dict.label"
:value="dict.value"
/>
</el-select>
</el-form-item>
<el-form-item v-if="filterCount > 3">
<el-button type="text" class="text-primary" @click="toggleFilters">
<Icon :icon="showAllFilters ? 'ep:arrow-up' : 'ep:arrow-down'" class="mr-5px" />
{{ showAllFilters ? t('FactoryModeling.FactoryStructure.collapseText') :
t('FactoryModeling.FactoryStructure.expandText') }}
</el-button>
</el-form-item>
<el-form-item>
<el-button @click="handleQuery"><Icon icon="ep:search" class="mr-5px" /> {{ t('common.query') }}</el-button>
<el-button @click="resetQuery"><Icon icon="ep:refresh" class="mr-5px" /> {{ t('common.reset') }}</el-button>
<el-button
type="primary"
plain
@click="openForm('create')"
v-hasPermi="['erp:warehouse-location:create']"
>
<Icon icon="ep:plus" class="mr-5px" /> {{ t('action.add') }}
</el-button>
</el-form-item>
</el-form>
</ContentWrap>
<ContentWrap>
<el-table
v-loading="loading"
:data="list"
:stripe="true"
:show-overflow-tooltip="true"
row-key="id"
>
<el-table-column :label="t('ErpStock.WarehouseLocation.warehouseId')" align="center" prop="warehouseId" sortable>
<template #default="scope">
{{ getWarehouseName(scope.row.warehouseId) }}
</template>
</el-table-column>
<el-table-column :label="t('ErpStock.WarehouseLocation.areaId')" align="center" prop="areaId" sortable>
<template #default="scope">
{{ getAreaName(scope.row.areaId) }}
</template>
</el-table-column>
<el-table-column :label="t('ErpStock.WarehouseLocation.code')" align="center" prop="code" sortable />
<el-table-column :label="t('ErpStock.WarehouseLocation.name')" align="center" prop="name" sortable />
<el-table-column :label="t('ErpStock.WarehouseLocation.areaSize')" align="center" prop="areaSize" />
<el-table-column :label="t('ErpStock.WarehouseLocation.maxLoadWeight')" align="center" prop="maxLoadWeight" />
<el-table-column :label="t('ErpStock.WarehouseLocation.position')" align="center">
<template #default="scope">
{{ scope.row.positionX ?? '-' }}, {{ scope.row.positionY ?? '-' }}, {{ scope.row.positionZ ?? '-' }}
</template>
</el-table-column>
<el-table-column :label="t('ErpStock.WarehouseLocation.allowProductMix')" align="center" prop="allowProductMix">
<template #default="scope">
<el-tag :type="scope.row.allowProductMix ? 'success' : 'danger'" size="small">
{{ scope.row.allowProductMix ? t('common.yes') : t('common.no') }}
</el-tag>
</template>
</el-table-column>
<el-table-column :label="t('ErpStock.WarehouseLocation.allowBatchMix')" align="center" prop="allowBatchMix">
<template #default="scope">
<el-tag :type="scope.row.allowBatchMix ? 'success' : 'danger'" size="small">
{{ scope.row.allowBatchMix ? t('common.yes') : t('common.no') }}
</el-tag>
</template>
</el-table-column>
<el-table-column :label="t('ErpStock.WarehouseLocation.status')" align="center" prop="status" sortable>
<template #default="scope">
<dict-tag :type="DICT_TYPE.COMMON_STATUS" :value="scope.row.status" />
</template>
</el-table-column>
<el-table-column :label="t('ErpStock.WarehouseLocation.createTime')" align="center" prop="createTime" :formatter="dateFormatter" width="180px" sortable />
<el-table-column :label="t('common.operate')" align="center" width="150px">
<template #default="scope">
<el-button
link
type="primary"
@click="openForm('update', scope.row.id)"
v-hasPermi="['erp:warehouse-location:update']"
>
{{ t('action.edit') }}
</el-button>
<el-button
link
type="danger"
@click="handleDelete(scope.row.id)"
v-hasPermi="['erp:warehouse-location:delete']"
>
{{ t('action.del') }}
</el-button>
</template>
</el-table-column>
</el-table>
<Pagination
:total="total"
v-model:page="queryParams.pageNo"
v-model:limit="queryParams.pageSize"
@pagination="getList"
/>
</ContentWrap>
</ContentWrap>
</template>
<WarehouseLocationForm ref="formRef" @success="getList" />
<WarehouseLocationForm v-else ref="formRef" @success="getList" @closed="formVisible = false" />
</div>
</template>
<script setup lang="ts">
@ -206,6 +210,8 @@ const toggleFilters = () => {
const warehouseList = ref<any[]>([])
const areaList = ref<any[]>([])
const formVisible = ref(false)
const filteredAreaList = computed(() => {
if (!queryParams.warehouseId) return areaList.value
return areaList.value.filter((item) => item.warehouseId === queryParams.warehouseId)
@ -255,7 +261,10 @@ const resetQuery = () => {
const formRef = ref()
const openForm = (type: string, id?: number) => {
formRef.value.open(type, id)
formVisible.value = true
nextTick(() => {
formRef.value.open(type, id)
})
}
const handleDelete = async (id: number) => {

Loading…
Cancel
Save