- 新增全局弹窗灰底背景色,提升视觉一致性 - 新增通用分组白卡组件 section-card,标题融入卡头,支持额外插槽 - 统一 Avue 弹窗表单及分组为白卡样式 - 调整 common-route.vue 弹窗,使用 section-card 分组包裹查询条件与常用地址 - 改造 loading-manage.vue 弹窗所有分区,采用 section-card 统一风格 - 全局样式调整弹窗内容区表单项间距及两列表单布局工具类 - 在 main.js 全局注册 section-card 组件,便于项目统一复用
29 lines
580 B
Vue
29 lines
580 B
Vue
<template>
|
|
<div class="section-card">
|
|
<div v-if="title || $slots.title || $slots.extra" class="section-card__header">
|
|
<span class="section-card__bar" />
|
|
<span class="section-card__title">
|
|
<slot name="title">{{ title }}</slot>
|
|
</span>
|
|
<span class="section-card__extra">
|
|
<slot name="extra" />
|
|
</span>
|
|
</div>
|
|
<div class="section-card__body">
|
|
<slot />
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
export default {
|
|
name: 'SectionCard',
|
|
props: {
|
|
title: {
|
|
type: String,
|
|
default: ''
|
|
}
|
|
}
|
|
}
|
|
</script>
|