基础信息：样式

src/App.vue

@@ -14,5 +14,6 @@ export default {
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
   color: #2c3e50;
+  background-color: #ecf0f5;
 }
 </style>

src/components/EcsFormSearch.vue

@@ -13,7 +13,7 @@
     </el-form>
 
     <div
-      style="width: 100%; border-bottom: 1px solid #eee; margin: 10px 0;"
+      style="width: 100%; border-bottom: 1px solid #ddd; margin: 10px 0;"
     ></div>
   </section>
 </template>

src/modules/basic/view/course.vue

@@ -5,7 +5,12 @@
         v-loading.body="fileLoading"
         element-loading-text="课程上传中,请稍后..."
       >
-        <el-form inline :model="formSearch" label-width="70px">
+        <el-form
+          inline
+          :model="formSearch"
+          label-width="70px"
+          ref="primaryForm"
+        >
           <el-form-item label="课程名称">
             <el-input
               class="input_width_lg"
@@ -74,34 +79,49 @@
             <el-button
               size="small"
               type="primary"
-              icon="search"
+              icon="el-icon-search"
               @click="searchForm"
               >查询</el-button
             >
-            <el-button size="small" type="primary" @click="impCourse">
-              <i class="fa fa-upload" aria-hidden="true"></i>导入
-            </el-button>
-            <el-button size="small" type="primary" @click="exportCourse">
-              <i class="fa fa-download" aria-hidden="true"></i>导出
-            </el-button>
+            <el-button size="small" @click="resetPrimaryForm"> 重置 </el-button>
             <el-button
               size="small"
               type="primary"
-              icon="plus"
+              icon="el-icon-plus"
               @click="insertCourse"
               >新增</el-button
             >
-            <el-button size="small" type="success" @click="enableByIds">
-              <i class="fa fa-check" aria-hidden="true"></i>启用
-            </el-button>
-            <el-button size="small" type="warning" @click="disableByIds">
-              <i class="fa fa-close" aria-hidden="true"></i>禁用
-            </el-button>
           </el-form-item>
         </el-form>
 
         <div class="block-seperator"></div>
 
+        <span>批量操作：</span>
+        <el-button
+          size="small"
+          type="success"
+          @click="enableByIds"
+          :disabled="noBatchSelected"
+        >
+          <i class="fa fa-check" aria-hidden="true"></i>启用
+        </el-button>
+        <el-button
+          size="small"
+          type="warning"
+          @click="disableByIds"
+          :disabled="noBatchSelected"
+        >
+          <i class="fa fa-close" aria-hidden="true"></i>禁用
+        </el-button>
+        <el-button size="small" type="primary" @click="impCourse">
+          <i class="fa fa-upload" aria-hidden="true"></i>导入
+        </el-button>
+        <el-button size="small" type="primary" @click="exportCourse">
+          <i class="fa fa-download" aria-hidden="true"></i>导出
+        </el-button>
+
+        <div style="width: 100%;margin-bottom: 10px;"></div>
+
         <!-- 添加或新增课程弹出框 -->
         <el-dialog title="课程" width="400px" :visible.sync="courseDialog">
           <el-form
@@ -524,6 +544,9 @@ export default {
     ...mapState({
       user: state => state.user
     }),
+    noBatchSelected() {
+      return this.selectedCourseIds.length === 0;
+    },
     courseIds() {
       var courseIds = "";
       for (let courseId of this.selectedCourseIds) {
@@ -849,6 +872,16 @@ export default {
     resetForm() {
       this.$refs.courseForm.resetFields();
     },
+    resetPrimaryForm() {
+      this.formSearch = {
+        name: "",
+        code: "",
+        enable: "",
+        level: "",
+        specialtyId: ""
+      };
+      this.$refs.primaryForm.resetFields();
+    },
     //删除单个数据
     deleteById(row) {
       this.$confirm("是否删除该课程？", "提示", {

src/modules/basic/view/role_privilege_settings.vue

@@ -68,6 +68,7 @@
         <!-- 权限树 -->
         <div style="width: 50%;margin-left: 50px;">
           <el-tree
+            class="el-tree"
             :data="treeData"
             :props="defaultProps"
             show-checkbox
@@ -285,4 +286,8 @@ export default {
 };
 </script>
 
-<style scoped></style>
+<style scoped>
+.el-tree >>> label {
+  margin-bottom: 0;
+}
+</style>

src/modules/basic/view/specially.vue

@@ -1,332 +1,339 @@
 <template>
   <section class="content">
-    <div class="box box-info">
-      <div class="box-body">
+    <div class="box-body">
+      <el-form
+        :inline="true"
+        :model="formSearch"
+        label-position="right"
+        label-width="70px"
+        ref="primaryForm"
+      >
+        <el-row>
+          <el-form-item label="专业名称">
+            <el-input
+              class="input_width_lg"
+              placeholder="请输入专业名称"
+              v-model="formSearch.name"
+            />
+          </el-form-item>
+          <el-form-item label="专业代码">
+            <el-input
+              class="input_width_lg"
+              placeholder="请输入专业代码"
+              v-model="formSearch.code"
+            />
+          </el-form-item>
+          <el-form-item label="课程">
+            <el-select
+              class="input"
+              :remote-method="getCourses"
+              :loading="courseLoading"
+              remote
+              filterable
+              clearable
+              v-model="formSearch.courseId"
+              placeholder="请选择"
+            >
+              <el-option
+                v-for="item in courseList4SearchWrapper"
+                :label="item.name"
+                :value="item.id"
+                :key="item.id"
+              />
+            </el-select>
+          </el-form-item>
+          <el-form-item>
+            <el-button
+              size="small"
+              type="primary"
+              icon="el-icon-search"
+              @click="searchForm"
+            >
+              查询
+            </el-button>
+            <el-button size="small" @click="resetPrimaryForm"> 重置 </el-button>
+            <el-button
+              size="small"
+              type="primary"
+              icon="el-icon-plus"
+              @click="insert"
+            >
+              新增
+            </el-button>
+          </el-form-item>
+        </el-row>
+      </el-form>
+
+      <div class="block-seperator"></div>
+
+      <span>批量操作：</span>
+      <el-button
+        size="small"
+        type="danger"
+        @click="deleteIds"
+        :disabled="noBatchSelected"
+      >
+        <i class="el-icon-delete"></i> 删除
+      </el-button>
+      <el-button size="small" type="primary" @click="impSpecialty">
+        <i class="fa fa-upload" aria-hidden="true"></i>导入
+      </el-button>
+      <el-button size="small" type="primary" @click="exportSpeciatly">
+        <i class="fa fa-upload" aria-hidden="true"></i> 导出
+      </el-button>
+
+      <div style="width: 100%;margin-bottom: 10px;"></div>
+
+      <!-- 新增或修改弹出框 -->
+      <el-dialog title="专业信息" :visible.sync="speciallyDialog">
         <el-form
           :inline="true"
-          :model="formSearch"
+          :model="speciallyForm"
+          ref="speciallyForm"
+          :rules="rules"
+          label-position="right"
+          label-width="90px"
+        >
+          <el-row>
+            <el-form-item label="专业代码" label-width="120px" prop="code">
+              <el-input
+                :disabled="null != speciallyForm.id"
+                class="pull_length"
+                v-model="speciallyForm.code"
+                auto-complete="off"
+                placeholder="专业代码"
+              />
+            </el-form-item>
+          </el-row>
+          <el-row>
+            <el-form-item label="专业名称" label-width="120px" prop="name">
+              <el-input
+                class="pull_length"
+                v-model="speciallyForm.name"
+                auto-complete="off"
+                placeholder="专业名称"
+              />
+            </el-form-item>
+          </el-row>
+          <el-row class="pull_center">
+            <el-button type="primary" @click="submitForm('speciallyForm')">
+              保 存
+            </el-button>
+            <el-button type="danger" @click="close">取 消</el-button>
+          </el-row>
+        </el-form>
+      </el-dialog>
+
+      <!-- 关联课程弹出框 -->
+      <el-dialog :title="courseDialogTitle" :visible.sync="courseDialog">
+        <!-- 表单 -->
+        <el-form
+          :inline="true"
+          :model="courseSearchForm"
           label-position="right"
           label-width="100px"
         >
           <el-row>
-            <el-form-item label="专业名称" class="pull-left">
+            <el-form-item label="课程名称" class="pull-left">
               <el-input
                 class="input_width_lg"
-                placeholder="请输入专业名称"
-                v-model="formSearch.name"
+                placeholder="请输入课程名称"
+                v-model="courseSearchForm.name"
               />
             </el-form-item>
-            <el-form-item label="专业代码" class="pull-left">
+            <el-form-item label="课程代码" class="pull-left">
               <el-input
                 class="input_width_lg"
-                placeholder="请输入专业代码"
-                v-model="formSearch.code"
+                placeholder="请输入课程代码"
+                v-model="courseSearchForm.code"
               />
             </el-form-item>
-            <el-form-item label="课程" class="pull-left">
-              <el-select
-                class="input"
-                :remote-method="getCourses"
-                :loading="courseLoading"
-                remote
-                filterable
-                clearable
-                v-model="formSearch.courseId"
-                placeholder="请选择"
-              >
-                <el-option
-                  v-for="item in courseList4SearchWrapper"
-                  :label="item.name"
-                  :value="item.id"
-                  :key="item.id"
-                />
-              </el-select>
-            </el-form-item>
-            <el-form-item label="" class="pull-right">
+            <el-form-item class="pull-right">
               <el-button
                 size="small"
                 type="primary"
                 icon="search"
-                @click="searchForm"
+                @click="searchCoursePage"
               >
                 查询
               </el-button>
-              <el-button size="small" type="primary" @click="impSpecialty">
-                <i class="fa fa-upload" aria-hidden="true"></i>导入
-              </el-button>
               <el-button
                 size="small"
                 type="primary"
-                icon="plus"
-                @click="insert"
+                icon="search"
+                @click="addRelation"
               >
                 新增
               </el-button>
-              <el-button size="small" type="danger" @click="deleteIds">
-                <i class="el-icon-delete"></i> 删除
-              </el-button>
-              <el-button size="small" type="primary" @click="exportSpeciatly">
-                <i class="fa fa-upload" aria-hidden="true"></i> 导出
-              </el-button>
             </el-form-item>
           </el-row>
         </el-form>
 
-        <!-- 新增或修改弹出框 -->
-        <el-dialog title="专业信息" :visible.sync="speciallyDialog">
-          <el-form
-            :inline="true"
-            :model="speciallyForm"
-            ref="speciallyForm"
-            :rules="rules"
-            label-position="right"
-            label-width="90px"
-          >
-            <el-row>
-              <el-form-item label="专业代码" label-width="120px" prop="code">
-                <el-input
-                  :disabled="null != speciallyForm.id"
-                  class="pull_length"
-                  v-model="speciallyForm.code"
-                  auto-complete="off"
-                  placeholder="专业代码"
-                />
-              </el-form-item>
-            </el-row>
-            <el-row>
-              <el-form-item label="专业名称" label-width="120px" prop="name">
-                <el-input
-                  class="pull_length"
-                  v-model="speciallyForm.name"
-                  auto-complete="off"
-                  placeholder="专业名称"
-                />
-              </el-form-item>
-            </el-row>
-            <el-row class="pull_center">
-              <el-button type="primary" @click="submitForm('speciallyForm')">
-                保 存
-              </el-button>
-              <el-button type="danger" @click="close">取 消</el-button>
-            </el-row>
-          </el-form>
-        </el-dialog>
-
-        <!-- 关联课程弹出框 -->
-        <el-dialog :title="courseDialogTitle" :visible.sync="courseDialog">
-          <!-- 表单 -->
-          <el-form
-            :inline="true"
-            :model="courseSearchForm"
-            label-position="right"
-            label-width="100px"
-          >
-            <el-row>
-              <el-form-item label="课程名称" class="pull-left">
-                <el-input
-                  class="input_width_lg"
-                  placeholder="请输入课程名称"
-                  v-model="courseSearchForm.name"
-                />
-              </el-form-item>
-              <el-form-item label="课程代码" class="pull-left">
-                <el-input
-                  class="input_width_lg"
-                  placeholder="请输入课程代码"
-                  v-model="courseSearchForm.code"
-                />
-              </el-form-item>
-              <el-form-item class="pull-right">
-                <el-button
-                  size="small"
-                  type="primary"
-                  icon="search"
-                  @click="searchCoursePage"
-                >
-                  查询
-                </el-button>
-                <el-button
-                  size="small"
-                  type="primary"
-                  icon="search"
-                  @click="addRelation"
-                >
-                  新增
-                </el-button>
-              </el-form-item>
-            </el-row>
-          </el-form>
-
-          <!-- 课程列表 -->
-          <el-table :data="courseTableData" border resizable stripe>
-            <el-table-column prop="id" label="ID" width="150" />
-            <el-table-column prop="name" label="课程名称" width="250" />
-            <el-table-column prop="code" label="课程代码" />
-            <el-table-column prop="updateTime" label="更新时间" width="170" />
-            <el-table-column label="操作">
-              <span slot-scope="scope">
-                <el-button
-                  size="mini"
-                  type="info"
-                  @click="deleteRelation(scope.row)"
-                >
-                  <i class="el-icon-edit"></i> 取消关联
-                </el-button>
-              </span>
-            </el-table-column>
-          </el-table>
-          <div class="page pull-right">
-            <el-pagination
-              @current-change="handleCourseCurrentChange"
-              :current-page="currentCoursePage"
-              :page-size="10"
-              layout="total, prev, pager, next, jumper"
-              :total="courseTotal"
-            />
-          </div>
-        </el-dialog>
-
-        <!-- 添加关联 -->
-        <el-dialog title="添加关联课程" :visible.sync="addRelationDialog">
-          <el-form
-            :inline="true"
-            :model="addRelationForm"
-            ref="addRelationForm"
-            label-position="right"
-            label-width="100px"
-            :rules="addRelationRules"
-          >
-            <el-row>
-              <el-form-item label="课程" class="pull-left" prop="courseId">
-                <el-select
-                  class="input"
-                  :remote-method="getCourses4AddRelation"
-                  :loading="courseLoading4AddRelation"
-                  remote
-                  filterable
-                  clearable
-                  v-model="addRelationForm.courseId"
-                  placeholder="请选择"
-                >
-                  <el-option
-                    v-for="item in courseList4AddRelationWrapper"
-                    :label="item.name"
-                    :value="item.id"
-                    :key="item.id"
-                  />
-                </el-select>
-              </el-form-item>
-            </el-row>
-            <el-row class="pull_center">
-              <el-button type="primary" @click="submitAddRelationForm">
-                保 存
+        <!-- 课程列表 -->
+        <el-table :data="courseTableData" border resizable stripe>
+          <el-table-column prop="id" label="ID" width="150" />
+          <el-table-column prop="name" label="课程名称" width="250" />
+          <el-table-column prop="code" label="课程代码" />
+          <el-table-column prop="updateTime" label="更新时间" width="170" />
+          <el-table-column label="操作">
+            <span slot-scope="scope">
+              <el-button
+                size="mini"
+                type="info"
+                @click="deleteRelation(scope.row)"
+              >
+                <i class="el-icon-edit"></i> 取消关联
               </el-button>
-              <el-button @click="addRelationDialog = false">取 消</el-button>
-            </el-row>
-          </el-form>
-        </el-dialog>
-
-        <!-- 页面列表 -->
-        <el-table
-          :data="tableData"
-          border
-          @selection-change="handleSelectionChange"
-        >
-          <el-table-column type="selection" width="35"> </el-table-column>
-          <el-table-column prop="id" label="ID" width="60"> </el-table-column>
-          <el-table-column prop="code" label="专业代码"> </el-table-column>
-          <el-table-column prop="name" label="专业名称"> </el-table-column>
-          <el-table-column prop="updateTime" label="更新时间" width="170">
-          </el-table-column>
-          <el-table-column label="操作" width="250">
-            <template slot-scope="scope">
-              <div>
-                <el-button
-                  size="mini"
-                  type="primary"
-                  @click="relation(scope.row)"
-                >
-                  关联课程
-                </el-button>
-                <el-button size="mini" type="info" @click="edit(scope.row)">
-                  修改
-                </el-button>
-                <el-button
-                  size="mini"
-                  type="danger"
-                  @click="deleteId(scope.row)"
-                >
-                  删除
-                </el-button>
-              </div>
-            </template>
+            </span>
           </el-table-column>
         </el-table>
         <div class="page pull-right">
           <el-pagination
-            @current-change="handleCurrentChange"
-            :current-page="currentPage"
-            :page-size="pageSize"
-            :page-sizes="[10, 20, 50, 100]"
-            @size-change="handleSizeChange"
-            layout="total, sizes, prev, pager, next, jumper"
-            :total="total"
+            @current-change="handleCourseCurrentChange"
+            :current-page="currentCoursePage"
+            :page-size="10"
+            layout="total, prev, pager, next, jumper"
+            :total="courseTotal"
           />
         </div>
+      </el-dialog>
 
-        <!-- 导入弹窗 -->
-        <el-dialog title="导入窗口" :visible.sync="impDialog">
-          <el-form>
-            <el-row>
-              <el-form-item style="margin-left:20px">
-                <el-upload
-                  class="form_left"
-                  ref="upload"
-                  accept="application/vnd.openxmlformats-officedocument.spreadsheetml.sheet"
-                  :action="uploadAction"
-                  :headers="uploadHeaders"
-                  :data="uploadData"
-                  :before-upload="beforeUpload"
-                  :on-progress="uploadProgress"
-                  :on-success="uploadSuccess"
-                  :on-error="uploadError"
-                  :file-list="fileList"
-                  :auto-upload="false"
-                  :multiple="false"
-                >
-                  <el-button size="small" slot="trigger" type="primary">
-                    选择文件
-                  </el-button>
-                  <el-button size="small" type="success" @click="submitUpload">
-                    确认上传
-                  </el-button>
-                  <el-button size="small" type="danger" @click="removeFile">
-                    清空文件
-                  </el-button>
-                  <el-button size="small" type="info" @click="exportFile">
-                    下载模板
-                  </el-button>
-                  <div slot="tip" class="el-upload__tip">只能上传xlsx文件</div>
-                </el-upload>
-              </el-form-item>
-            </el-row>
-          </el-form>
-        </el-dialog>
+      <!-- 添加关联 -->
+      <el-dialog title="添加关联课程" :visible.sync="addRelationDialog">
+        <el-form
+          :inline="true"
+          :model="addRelationForm"
+          ref="addRelationForm"
+          label-position="right"
+          label-width="100px"
+          :rules="addRelationRules"
+        >
+          <el-row>
+            <el-form-item label="课程" class="pull-left" prop="courseId">
+              <el-select
+                class="input"
+                :remote-method="getCourses4AddRelation"
+                :loading="courseLoading4AddRelation"
+                remote
+                filterable
+                clearable
+                v-model="addRelationForm.courseId"
+                placeholder="请选择"
+              >
+                <el-option
+                  v-for="item in courseList4AddRelationWrapper"
+                  :label="item.name"
+                  :value="item.id"
+                  :key="item.id"
+                />
+              </el-select>
+            </el-form-item>
+          </el-row>
+          <el-row class="pull_center">
+            <el-button type="primary" @click="submitAddRelationForm">
+              保 存
+            </el-button>
+            <el-button @click="addRelationDialog = false">取 消</el-button>
+          </el-row>
+        </el-form>
+      </el-dialog>
 
-        <!-- 导入错误信息列表 -->
-        <el-dialog title="错误提示" :visible.sync="errDialog">
-          <div
-            class="text-danger"
-            v-for="errMessage in errMessages"
-            :key="errMessage.lineNum"
-          >
-            第{{ errMessage.lineNum }}行：{{ errMessage.msg }}
-          </div>
-          <span slot="footer" class="dialog-footer">
-            <el-button @click="errDialog = false">确定</el-button>
-          </span>
-        </el-dialog>
+      <!-- 页面列表 -->
+      <el-table
+        :data="tableData"
+        border
+        @selection-change="handleSelectionChange"
+      >
+        <el-table-column type="selection" width="35"> </el-table-column>
+        <el-table-column prop="id" label="ID" width="60"> </el-table-column>
+        <el-table-column prop="code" label="专业代码"> </el-table-column>
+        <el-table-column prop="name" label="专业名称"> </el-table-column>
+        <el-table-column prop="updateTime" label="更新时间" width="170">
+        </el-table-column>
+        <el-table-column label="操作" width="250">
+          <template slot-scope="scope">
+            <div>
+              <el-button
+                size="mini"
+                type="primary"
+                @click="relation(scope.row)"
+              >
+                关联课程
+              </el-button>
+              <el-button size="mini" type="info" @click="edit(scope.row)">
+                修改
+              </el-button>
+              <el-button size="mini" type="danger" @click="deleteId(scope.row)">
+                删除
+              </el-button>
+            </div>
+          </template>
+        </el-table-column>
+      </el-table>
+      <div class="page pull-right">
+        <el-pagination
+          @current-change="handleCurrentChange"
+          :current-page="currentPage"
+          :page-size="pageSize"
+          :page-sizes="[10, 20, 50, 100]"
+          @size-change="handleSizeChange"
+          layout="total, sizes, prev, pager, next, jumper"
+          :total="total"
+        />
       </div>
+
+      <!-- 导入弹窗 -->
+      <el-dialog title="导入窗口" :visible.sync="impDialog">
+        <el-form>
+          <el-row>
+            <el-form-item style="margin-left:20px">
+              <el-upload
+                class="form_left"
+                ref="upload"
+                accept="application/vnd.openxmlformats-officedocument.spreadsheetml.sheet"
+                :action="uploadAction"
+                :headers="uploadHeaders"
+                :data="uploadData"
+                :before-upload="beforeUpload"
+                :on-progress="uploadProgress"
+                :on-success="uploadSuccess"
+                :on-error="uploadError"
+                :file-list="fileList"
+                :auto-upload="false"
+                :multiple="false"
+              >
+                <el-button size="small" slot="trigger" type="primary">
+                  选择文件
+                </el-button>
+                <el-button size="small" type="success" @click="submitUpload">
+                  确认上传
+                </el-button>
+                <el-button size="small" type="danger" @click="removeFile">
+                  清空文件
+                </el-button>
+                <el-button size="small" type="info" @click="exportFile">
+                  下载模板
+                </el-button>
+                <div slot="tip" class="el-upload__tip">只能上传xlsx文件</div>
+              </el-upload>
+            </el-form-item>
+          </el-row>
+        </el-form>
+      </el-dialog>
+
+      <!-- 导入错误信息列表 -->
+      <el-dialog title="错误提示" :visible.sync="errDialog">
+        <div
+          class="text-danger"
+          v-for="errMessage in errMessages"
+          :key="errMessage.lineNum"
+        >
+          第{{ errMessage.lineNum }}行：{{ errMessage.msg }}
+        </div>
+        <span slot="footer" class="dialog-footer">
+          <el-button @click="errDialog = false">确定</el-button>
+        </span>
+      </el-dialog>
     </div>
   </section>
 </template>
@@ -410,6 +417,9 @@ export default {
     ...mapState({
       user: state => state.user
     }),
+    noBatchSelected() {
+      return this.multipleSelection.length === 0;
+    },
     courseAllListSelect() {
       let courseList = [];
       for (let course of this.courseAllList) {
@@ -442,6 +452,16 @@ export default {
       this.pageSize = val;
       this.searchForm();
     },
+    resetPrimaryForm() {
+      this.formSearch = {
+        name: "",
+        code: "",
+        enable: "",
+        level: "",
+        specialtyId: ""
+      };
+      this.$refs.primaryForm.resetFields();
+    },
     deleteRelation(row) {
       var courseId = row.id;
       var specialtyId = this.courseSearchForm.specialtyId;

src/modules/basic/view/user.vue

@@ -73,9 +73,7 @@
           </el-form-item>
         </el-form>
 
-        <div
-          style="width: 100%; border-bottom: 1px solid #eee; margin: 20px 0 ;"
-        ></div>
+        <div class="block-seperator"></div>
 
         <!-- 添加用户信息弹出框 -->
         <el-dialog title="新增用户" width="400px" :visible.sync="addingDialog">

src/modules/portal/views/home/Home.vue

@@ -1,7 +1,7 @@
 <template>
   <el-container>
-    <el-header style="padding: 0">
-      <el-menu class="el-menu-demo" mode="horizontal">
+    <el-header style="padding: 0;">
+      <el-menu class="el-menu" mode="horizontal">
         <el-menu-item index="1">
           <router-link
             to="/home/overview"
@@ -229,22 +229,32 @@ export default {
 </script>
 
 <style scoped>
-.fr {
-  float: right;
-}
-.el-header,
+.el-menu,
 .el-footer {
-  background-color: #f7f7f7;
-  color: #333;
+  background-color: #3c8dbd;
+  color: #ffffff;
   text-align: center;
   line-height: 60px;
 }
 .el-footer {
-  background-color: #f7f7f7;
+  color: #878e93;
+  background-color: white;
   line-height: 40px;
   height: 40px !important;
 }
 
+.el-menu.el-menu--horizontal {
+  border-bottom: none;
+}
+
+.el-menu >>> .el-menu-item {
+  color: white !important;
+}
+
+.el-menu >>> .el-menu-item:hover {
+  color: black !important;
+}
+
 body > .el-container {
   margin-bottom: 40px;
 }

src/modules/portal/views/home/HomeSide.vue

@@ -7,7 +7,7 @@
     </div>
     <el-menu
       class="el-menu-vertical-demo"
-      background-color="#304156"
+      background-color="#222c32"
       text-color="#fff"
       active-text-color="#409eff"
       router
@@ -164,7 +164,7 @@ export default {
   height: calc(100vh - 60px - 70px);
 }
 .el-aside {
-  background-color: #304156;
+  background: rgba(34, 44, 50, 1);
   color: #fff;
 }
 

src/styles/global.css

@@ -117,6 +117,6 @@ body {
 
 .block-seperator {
   width: 100%;
-  border-bottom: 1px solid #eee;
+  border-bottom: 1px solid #ddd;
   margin: 20px 0;
 }