ruoyi实用性美化记录

一、将tab页中操作区的底色变为亮灰色

ruoyi-ui/src/layout/index.vue 中

<app-main/>改为<app-main style="background: #EEE"/>

二、对应的将form加上底色加边角弧度

ruoyi-ui/src/assets/styles/ruoyi.scss

.el-form{border-radius: 3px;padding:10px;background:#FFF;margin-bottom: 10px;
}
.el-table {}中添加以下：border-radius: 3px;padding:0px;background:#FFF;

三、对应的将表格加上底色加边角弧度

先将src/main/resources/vm/vue/index.vue.vm中表格对应的操作区、表格、分页操作区合入一个div，再对 div 美化。

<div style="padding: 0px;background: #FFF;border-radius: 3px;">．．．<div/>

四、将表格附属按纽添加左空间和顶空间

<el-row :gutter="10" class="mb8" style="padding-left: 10px">

顶空间由上面的form中实现：margin-bottom: 10px;

五、分页底色修正

.pagination-container {position: relative;height: 46px;margin-bottom: 10px;margin-top: 2px;padding: 10px 20px !important;
}