style(views): 调整抽屉组件和表单的样式间距
统一调整抽屉组件的标题和内容间距,优化表单项和分页组件的边距,提升界面一致性
This commit is contained in:
parent
fc6889cd10
commit
adddd98d7d
|
@ -421,17 +421,21 @@ onMounted(() => {
|
||||||
<ShopConfigModal v-model="shopConfigVisible" :cabinet-id="cabinetId" @refresh="fetchCabinetDetail" />
|
<ShopConfigModal v-model="shopConfigVisible" :cabinet-id="cabinetId" @refresh="fetchCabinetDetail" />
|
||||||
<MainCabinetConfigModal v-model="mainCabinetConfigVisible" :cabinet-id="cabinetId"
|
<MainCabinetConfigModal v-model="mainCabinetConfigVisible" :cabinet-id="cabinetId"
|
||||||
@refresh="fetchCabinetDetail" />
|
@refresh="fetchCabinetDetail" />
|
||||||
<el-drawer v-model="editCabinetDrawerVisible" title="编辑柜体" size="30%" direction="rtl">
|
<el-drawer v-model="editCabinetDrawerVisible"
|
||||||
|
title="编辑柜体" size="30%" direction="rtl">
|
||||||
<EditCabinetDrawer v-model="editCabinetDrawerVisible" :cabinet-info="cabinetInfo"
|
<EditCabinetDrawer v-model="editCabinetDrawerVisible" :cabinet-info="cabinetInfo"
|
||||||
@refresh="fetchCabinetDetail" />
|
@refresh="fetchCabinetDetail" />
|
||||||
</el-drawer>
|
</el-drawer>
|
||||||
<el-drawer v-model="goodsConfigVisible" title="配置商品" size="50%" direction="rtl">
|
<el-drawer v-model="goodsConfigVisible" title="配置商品"
|
||||||
|
size="50%" direction="rtl">
|
||||||
<CabinetGoodsConfigModal v-model="goodsConfigVisible" :cell-id="currentCellId" @refresh="fetchCellList" />
|
<CabinetGoodsConfigModal v-model="goodsConfigVisible" :cell-id="currentCellId" @refresh="fetchCellList" />
|
||||||
</el-drawer>
|
</el-drawer>
|
||||||
<el-drawer v-model="cellFormVisible" title="新增格口" size="30%" direction="rtl">
|
<el-drawer v-model="cellFormVisible" title="新增格口"
|
||||||
|
size="30%" direction="rtl">
|
||||||
<CellFormModal v-model="cellFormVisible" :initial-cabinet-id="cabinetId" @refresh="fetchCellList" />
|
<CellFormModal v-model="cellFormVisible" :initial-cabinet-id="cabinetId" @refresh="fetchCellList" />
|
||||||
</el-drawer>
|
</el-drawer>
|
||||||
<el-drawer v-model="cellEditVisible" title="编辑格口" size="30%" direction="rtl">
|
<el-drawer v-model="cellEditVisible" title="编辑格口"
|
||||||
|
size="30%" direction="rtl">
|
||||||
<CellEditModal v-model="cellEditVisible" :row="currentCell" @refresh="fetchCellList" />
|
<CellEditModal v-model="cellEditVisible" :row="currentCell" @refresh="fetchCellList" />
|
||||||
</el-drawer>
|
</el-drawer>
|
||||||
</div>
|
</div>
|
||||||
|
@ -442,6 +446,15 @@ onMounted(() => {
|
||||||
:deep(.el-tabs__header) {
|
:deep(.el-tabs__header) {
|
||||||
margin-bottom: 8px;
|
margin-bottom: 8px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
:deep(.el-drawer__header) {
|
||||||
|
margin: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
:deep(.el-drawer__body) {
|
||||||
|
padding: 4px;
|
||||||
|
}
|
||||||
|
|
||||||
.el-form-item {
|
.el-form-item {
|
||||||
margin-bottom: 8px;
|
margin-bottom: 8px;
|
||||||
}
|
}
|
||||||
|
|
|
@ -106,10 +106,6 @@ defineExpose({ getList });
|
||||||
<el-button type="primary" :icon="useRenderIcon(Search)" @click="getList">
|
<el-button type="primary" :icon="useRenderIcon(Search)" @click="getList">
|
||||||
搜索
|
搜索
|
||||||
</el-button>
|
</el-button>
|
||||||
<el-button :icon="useRenderIcon(Refresh)"
|
|
||||||
@click="searchFormParams = { goodsName: '', status: null }; getList()">
|
|
||||||
重置
|
|
||||||
</el-button>
|
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
</el-form>
|
</el-form>
|
||||||
|
|
||||||
|
@ -141,16 +137,24 @@ defineExpose({ getList });
|
||||||
|
|
||||||
<el-pagination v-model:current-page="pagination.currentPage" v-model:page-size="pagination.pageSize"
|
<el-pagination v-model:current-page="pagination.currentPage" v-model:page-size="pagination.pageSize"
|
||||||
:page-sizes="[10, 20, 50]" layout="total, sizes, prev, pager, next" :total="pagination.total"
|
:page-sizes="[10, 20, 50]" layout="total, sizes, prev, pager, next" :total="pagination.total"
|
||||||
@size-change="getList" @current-change="getList" />
|
@size-change="getList" @current-change="getList" class="pagination" />
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<style scoped>
|
<style scoped lang="scss">
|
||||||
.config-modal {
|
.config-modal {
|
||||||
padding: 20px;
|
padding: 20px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.search-form {
|
.search-form {
|
||||||
margin-bottom: 20px;
|
margin-bottom: 8px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.el-form-item {
|
||||||
|
margin-bottom: 8px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.pagination {
|
||||||
|
margin-top: 10px;
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
Loading…
Reference in New Issue