基础UI调整

src/App.vue

@@ -13,7 +13,7 @@ export default {
   font-family: "Avenir", Helvetica, Arial, sans-serif;
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
-  color: #2c3e50;
-  background-color: #ecf0f5;
+  color: #383b4a;
+  background-color: #e1e7f7;
 }
 </style>

src/main.js

@@ -11,6 +11,7 @@ import "./plugins/vueAwesome";
 import "./directives/directives.js";
 import "./filters/filters.js";
 import "./styles/bootstrap.scss";
+import "./styles/base.scss";
 import "./styles/global.css";
 
 Vue.config.productionTip = process.env.NODE_ENV !== "production";

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

@@ -1,63 +1,39 @@
 <template>
-  <el-container>
-    <el-header style="padding: 0">
-      <el-menu class="el-menu" mode="horizontal">
-        <el-menu-item index="1" style="width: 200px">
-          <router-link
-            to="/questions/tips"
-            style="
-              display: inline-block;
-              font-size: 20px;
-              line-height: 48px;
-              width: 100%;
-              text-decoration-line: none;
-            "
-          >
-            <img
-              src="./icon.png"
-              style="
-                margin-bottom: 2px;
-                line-height: 48px;
-                display: inline-block;
-              "
-            />
-            题库
-          </router-link>
-        </el-menu-item>
-        <el-menu-item
-          index="4"
-          style="float: right"
+  <div class="home">
+    <HomeSide v-if="ifShowHomeSide" :key="sideKey" />
+
+    <div class="home-header">
+      <div v-if="ifShowHomeSide" class="header-breadcrumb">
+        <LinkTitles :key="Math.random()" />
+      </div>
+      <ul class="header-menu">
+        <li class="header-menu-item header-menu-org" title="机构名称">
+          <v-icon name="users" /> {{ user.rootOrgName }}
+        </li>
+        <li
+          class="header-menu-item header-menu-user"
+          title="个人信息管理"
+          @click="openUserDialog"
+        >
+          <i class="el-icon-user-solid"></i> {{ user.displayName }}
+        </li>
+        <li
+          class="header-menu-item header-menu-logout"
           title="退出系统"
           @click="logout"
         >
-          <v-icon name="sign-out-alt" />
-          <span style="cursor: pointer"> 退出 </span>
-        </el-menu-item>
-        <el-menu-item index="3" style="float: right" title="个人信息管理">
-          <v-icon name="user" />
-          <span style="cursor: pointer" @click="openUserDialog">
-            {{ user.displayName }}
-          </span>
-        </el-menu-item>
-        <el-menu-item
-          index="1"
-          class="navbar-group-item"
-          style="float: right"
-          title="机构名称"
-        >
-          <v-icon name="users" /> {{ user.rootOrgName }}
-        </el-menu-item>
-      </el-menu>
-    </el-header>
+          <i class="el-icon-switch-button"></i>
+        </li>
+      </ul>
+    </div>
 
-    <el-container>
-      <HomeSide v-if="ifShowHomeSide" :key="sideKey" />
-      <el-container class="main-body">
-        <LinkTitles v-if="ifShowHomeSide" :key="Math.random()" />
+    <div class="home-body">
+      <div class="home-main">
         <router-view class="main-content"></router-view>
-        <el-footer class="footer">&copy; 启明泰和 2019</el-footer>
-      </el-container>
-    </el-container>
+
+        <div class="home-footer">&copy; 启明泰和 2019</div>
+      </div>
+    </div>
     <!-- 添加用户信息弹出框 -->
     <el-dialog
       title="个人信息"
@@ -178,7 +154,7 @@
         </el-row>
       </el-form>
     </el-dialog>
-  </el-container>
+  </div>
 </template>
 
 <script>
@@ -251,6 +227,7 @@ export default {
   },
   computed: {
     ...mapState({ user: (state) => state.user }),
+    ...mapState(["currentPaths"]),
     ifShowHomeSide() {
       return this.$route.fullPath.startsWith("/home") === false;
     },
@@ -360,72 +337,86 @@ export default {
 </script>
 
 <style scoped>
-.el-menu,
-.el-footer {
-  background-color: #3c8dbd;
-  color: #ffffff;
-  text-align: center;
-  line-height: 60px;
-}
-.el-footer {
-  color: #878e93;
-  background-color: #ecf0f5;
-  line-height: 40px;
-  height: 40px !important;
+.home {
+  position: absolute;
+  width: 100%;
+  height: 100%;
+  z-index: auto;
 }
-
-.el-menu.el-menu--horizontal {
-  border-bottom: none;
+.home::before {
+  content: "";
+  display: block;
+  position: absolute;
+  width: 700px;
+  height: 200px;
+  left: 200px;
+  z-index: 1;
+  background: #705eff;
+  border-bottom-left-radius: 140px;
+  border-top-right-radius: 80px;
+  transform: skew(15deg, 0);
 }
-
-.el-menu >>> .el-menu-item {
-  color: white !important;
+.home-body {
+  position: absolute;
+  left: 0;
+  top: 70px;
+  right: 0;
+  bottom: 0;
+  overflow: auto;
+  z-index: 8;
 }
-
-.el-menu >>> .el-menu-item:hover,
-.el-menu >>> .el-menu-item:focus {
-  color: white !important;
-  background-color: rgba(40, 121, 169) !important;
+.home-main {
+  position: relative;
+  padding: 0 20px 50px 260px;
+  min-height: 100%;
 }
+.home-header {
+  position: absolute;
+  height: 70px;
+  top: 0;
+  left: 240px;
+  right: 0;
+  z-index: 99;
+  overflow: hidden;
+  padding: 19px 20px;
 
-.el-menu >>> .is-active.el-menu-item:focus {
-  color: white !important;
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
 }
 
-.el-menu >>> .navbar-group-item.is-active.el-menu-item:focus {
-  color: none !important;
+.header-menu {
+  font-size: 0;
+  margin: 0;
 }
-
-.el-menu >>> .navbar-group-item.el-menu-item:hover,
-.el-menu >>> .navbar-group-item.el-menu-item:focus {
-  color: white !important;
-  background-color: transparent !important;
-  cursor: unset;
-  border-bottom: none;
+.header-menu-item {
+  list-style: none;
+  display: inline-block;
+  vertical-align: top;
+  font-size: 14px;
+  background: #fff;
+  line-height: 32px;
+  height: 32px;
+  min-width: 32px;
+  border-radius: 16px;
+  margin: 0 5px;
+  padding: 0 16px;
+  color: #6e7080;
+  text-align: center;
+  cursor: pointer;
 }
-
-body > .el-container {
-  margin-bottom: 40px;
+.header-menu-item:hover {
+  color: #383b4a;
+  background-color: #fcfcfd;
 }
-
-.main-body {
-  min-height: calc(100vh - 100px);
-  display: flex;
-  flex-direction: column;
-  justify-content: space-between;
-  margin-top: 20px;
-  margin-left: 20px;
+.header-menu-org {
+  cursor: default;
 }
-
-.main-content {
-  min-height: calc(100vh - 60px - 60px - 40px);
-  margin-top: 20px;
-  margin-right: 20px;
+.header-menu-org:hover {
+  background-color: #fff;
 }
-
-.footer {
-  justify-self: flex-end;
-  margin-left: -20px;
+.header-menu-logout {
+  padding: 0;
 }
 .passWeakInfo {
   color: blue !important;
@@ -433,4 +424,18 @@ body > .el-container {
 .passWeakErr {
   color: red !important;
 }
+
+.home-footer {
+  position: absolute;
+  width: 100%;
+  height: 50px;
+  bottom: 0;
+  left: 0;
+  z-index: auto;
+  padding: 15px 0;
+  line-height: 20px;
+  text-align: center;
+  font-size: 13px;
+  color: #aaa;
+}
 </style>

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

@@ -1,13 +1,16 @@
 <template>
-  <el-aside v-if="menuList.length > 0" width="">
+  <div v-if="menuList.length > 0" class="home-side" width="240px">
+    <div class="home-logo">
+      <router-link to="/questions/tips">
+        <img src="./icon.png" />
+      </router-link>
+    </div>
     <el-menu
       class="el-menu-vertical-demo"
-      background-color="#222c32"
-      text-color="#fff"
-      active-text-color="#409eff"
+      active-text-color="#705eff"
+      text-color="#383b4a"
       router
       :default-active="$route.path"
-      :collapse="isCollapse"
     >
       <el-submenu
         v-for="menu1 in menuList1"
@@ -28,7 +31,7 @@
         </el-menu-item>
       </el-submenu>
     </el-menu>
-  </el-aside>
+  </div>
 </template>
 
 <script>
@@ -149,23 +152,52 @@ export default {
 </script>
 
 <style scoped>
+.home-side {
+  position: fixed;
+  width: 240px;
+  left: 0;
+  top: 0;
+  bottom: 0;
+  z-index: 99;
+  overflow-y: auto;
+  overflow-x: hidden;
+  background: #fff;
+  border-top-right-radius: 32px;
+  border-bottom-right-radius: 32px;
+}
+.home-logo {
+  padding: 0 40px;
+  font-size: 20px;
+  line-height: 40px;
+  text-align: center;
+}
+.home-logo a {
+  display: block;
+  padding: 30px 0;
+  border-bottom: 1px solid #eff0f5;
+}
+.home-logo img {
+  display: block;
+  max-width: 160px;
+  height: 40px;
+}
 .el-menu-vertical-demo {
-  height: calc(100vh - 60px - 70px);
-  border-right: none;
+  padding-top: 20px;
 }
-
-.el-menu-vertical-demo:not(.el-menu--collapse) {
-  width: 200px;
-  min-height: 400px;
+.el-menu-vertical-demo >>> .el-submenu {
+  margin-bottom: 10px;
 }
-
-.el-aside {
-  background: rgba(34, 44, 50, 1);
-  color: #fff;
+.el-menu-vertical-demo >>> .el-submenu__title {
+  padding: 0 40px !important;
+  height: 50px;
+  line-height: 50px;
 }
-
-.router-link-active {
-  color: #409eff !important;
-  font-weight: bold;
+.el-menu-vertical-demo >>> .el-submenu .el-menu-item {
+  padding-left: 64px !important;
+  height: 40px;
+  line-height: 40px;
+}
+.el-menu-vertical-demo >>> .el-submenu__icon-arrow {
+  right: 30px;
 }
 </style>

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

@@ -1,19 +1,21 @@
 <template>
-  <el-breadcrumb
-    v-if="currentPaths.length > 0"
-    separator-class="el-icon-arrow-right"
-    style="border-bottom: 1px solid #ddd; padding-bottom: 5px"
-  >
-    <el-breadcrumb-item :to="{ path: '/home/overview' }"
-      >首页</el-breadcrumb-item
-    >
-    <el-breadcrumb-item
-      v-for="(item, index) in currentPaths"
-      :key="item + index"
-    >
-      {{ item }}
-    </el-breadcrumb-item>
-  </el-breadcrumb>
+  <div v-if="currentPaths.length > 0" class="link-titles">
+    <span class="breadcrumb-tips">
+      <i class="icon icon-location"></i>
+      <span>当前所在位置：</span>
+    </span>
+    <el-breadcrumb class="breadcrumb-list">
+      <el-breadcrumb-item :to="{ path: '/home/overview' }"
+        >首页</el-breadcrumb-item
+      >
+      <el-breadcrumb-item
+        v-for="(item, index) in currentPaths"
+        :key="item + index"
+      >
+        {{ item }}
+      </el-breadcrumb-item>
+    </el-breadcrumb>
+  </div>
 </template>
 
 <script>
@@ -26,3 +28,22 @@ export default {
   },
 };
 </script>
+
+<style scoped>
+.breadcrumb-tips,
+.el-breadcrumb {
+  display: inline-block;
+  vertical-align: middle;
+  color: #fff;
+}
+.breadcrumb-tips > i {
+  margin-top: -2px;
+  margin-right: 8px;
+}
+.breadcrumb-list >>> .el-breadcrumb__inner,
+.breadcrumb-list >>> .el-breadcrumb__inner a,
+.breadcrumb-list >>> .el-breadcrumb__inner.is-link,
+.breadcrumb-list >>> .el-breadcrumb__item:last-child .el-breadcrumb__inner {
+  color: #fff;
+}
+</style>

src/modules/questions/views/ExportTemplate.vue

@@ -1,94 +1,71 @@
 <template>
   <section class="content">
-    <div class="box-body">
+    <div class="part-box">
+      <h2 class="part-box-title">模板管理</h2>
+
       <!-- 表单 -->
-      <el-form
-        :inline="true"
-        :model="formSearch"
-        label-width="70px"
-        label-position="right"
-      >
-        <el-row>
-          <el-col :span="6">
-            <el-form-item v-if="isSuperAdmin" label="学校">
-              <el-select
-                v-model="formSearch.rootOrgId"
-                clearable
-                filterable
-                placeholder="请选择"
-                class="search_width"
-                size="small"
-              >
-                <el-option
-                  v-for="item in rootOrgList"
-                  :key="item.id"
-                  :label="item.name"
-                  :value="item.id"
-                />
-              </el-select>
-            </el-form-item>
-          </el-col>
-          <el-col :span="6">
-            <el-form-item label="模板名称">
-              <el-input
-                v-model="formSearch.fileName"
-                placeholder="请输入模板名称"
-                class="search_width"
-                size="small"
-              ></el-input>
-            </el-form-item>
-          </el-col>
-          <el-col :span="6">
-            <el-form-item label="模板类型" prop="type" class="form-item">
-              <el-select
-                v-model="formSearch.type"
-                class="search_width"
-                :clearable="true"
-                size="small"
-              >
-                <el-option label="试卷导出" value="PAPER_EXPORT"> </el-option>
-                <el-option label="答案导出" value="ANWSER_EXPORT"> </el-option>
-                <el-option label="离线试卷" value="OUTLINE_PAPER_EXPORT">
-                </el-option>
-                <el-option label="试卷预览" value="PAPER_VIEW"> </el-option>
-                <el-option label="答案预览" value="ANWSER_VIEW"> </el-option>
-              </el-select>
-            </el-form-item>
-          </el-col>
-          <el-col :span="6">
-            <div class="search_down">
-              <el-button
-                size="small"
-                type="primary"
-                icon="el-icon-search"
-                @click="handleSearchBtn"
-              >
-                查询
-              </el-button>
-              <el-button
-                size="small"
-                type="primary"
-                icon="el-icon-plus"
-                @click="addFile"
-              >
-                新增
-              </el-button>
-              <el-button
-                size="small"
-                type="primary"
-                icon="el-icon-edit"
-                @click="operConfig"
-              >
-                配置
-              </el-button>
-            </div>
-          </el-col>
-        </el-row>
-      </el-form>
+      <el-form class="part-filter-form" inline :model="formSearch">
+        <el-form-item v-if="isSuperAdmin" label="学校">
+          <el-select
+            v-model="formSearch.rootOrgId"
+            clearable
+            filterable
+            placeholder="请选择"
+            class="search_width"
+          >
+            <el-option
+              v-for="item in rootOrgList"
+              :key="item.id"
+              :label="item.name"
+              :value="item.id"
+            />
+          </el-select>
+        </el-form-item>
 
-      <div class="block-seperator"></div>
+        <el-form-item label="模板名称">
+          <el-input
+            v-model="formSearch.fileName"
+            placeholder="请输入模板名称"
+            class="search_width"
+          ></el-input>
+        </el-form-item>
+
+        <el-form-item label="模板类型" prop="type" class="form-item">
+          <el-select
+            v-model="formSearch.type"
+            class="search_width"
+            :clearable="true"
+          >
+            <el-option label="试卷导出" value="PAPER_EXPORT"> </el-option>
+            <el-option label="答案导出" value="ANWSER_EXPORT"> </el-option>
+            <el-option label="离线试卷" value="OUTLINE_PAPER_EXPORT">
+            </el-option>
+            <el-option label="试卷预览" value="PAPER_VIEW"> </el-option>
+            <el-option label="答案预览" value="ANWSER_VIEW"> </el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item>
+          <el-button
+            type="primary"
+            icon="el-icon-search"
+            @click="handleSearchBtn"
+          >
+            查询
+          </el-button>
+        </el-form-item>
+      </el-form>
+      <div class="part-box-action">
+        <el-button type="primary" icon="el-icon-edit" @click="operConfig">
+          配置
+        </el-button>
+        <el-button type="primary" icon="el-icon-plus" @click="addFile">
+          新增
+        </el-button>
+      </div>
+    </div>
+    <div class="part-box">
       <!-- 页面列表 -->
-      <el-table :data="tableData" border resizable stripe style="width: 100%">
+      <el-table :data="tableData" resizable>
         <el-table-column prop="fileName" label="模板名称"> </el-table-column>
         <el-table-column prop="suffix" width="100" label="文件类型">
         </el-table-column>
@@ -162,7 +139,7 @@
           </div>
         </el-table-column>
       </el-table>
-      <div class="page pull-right">
+      <div class="part-page">
         <el-pagination
           v-if="paginationShow"
           :current-page="currentPage"
@@ -175,11 +152,15 @@
         />
       </div>
     </div>
+
     <el-dialog
       title="新增模板"
       width="550px"
       :visible.sync="fileModel"
       :close-on-click-modal="false"
+      :modal="false"
+      append-to-body
+      custom-class="side-dialog"
       @close="closeFileModel"
     >
       <el-form
@@ -190,64 +171,62 @@
         :rules="fileRules"
         label-width="90px"
       >
-        <el-row class="form-row">
-          <el-form-item label="模板名称" prop="templateName">
-            <el-input
-              v-model="fileForm.templateName"
-              class="pull-length"
-              placeholder="请输入模板名称"
-            ></el-input>
-          </el-form-item>
-        </el-row>
-        <el-row class="form-row">
-          <el-form-item label="模板类型" prop="type" class="form-item">
-            <el-select v-model="fileForm.type" :clearable="true" class="input">
-              <el-option label="试卷导出" value="PAPER_EXPORT"> </el-option>
-              <el-option label="答案导出" value="ANWSER_EXPORT"> </el-option>
-              <el-option label="离线试卷" value="OUTLINE_PAPER_EXPORT">
-              </el-option>
-              <el-option label="试卷预览" value="PAPER_VIEW"> </el-option>
-              <el-option label="答案预览" value="ANWSER_VIEW"> </el-option>
-            </el-select>
-          </el-form-item>
-        </el-row>
-        <el-row class="form-row">
-          <el-form-item label="文件" prop="dataFile">
-            <el-input
-              v-model="fileForm.fileName"
-              class="pull-length"
-              :readonly="true"
-              placeholder="文件最大限制10M"
-            />
-          </el-form-item>
-          <el-form-item>
-            <el-upload
-              :before-upload="handleUploadFile"
-              accept=".ftl,.zip"
-              action="/upload"
-            >
-              <el-button
-                type="primary"
-                size="small"
-                icon="ios-cloud-upload-outline"
-                >请选择文件
-              </el-button>
-            </el-upload>
-          </el-form-item>
-        </el-row>
-        <el-row class="pull-center">
-          <el-button type="primary" :loading="fileForm.loading" @click="subFile"
-            >确定</el-button
+        <el-form-item label="模板名称" prop="templateName">
+          <el-input
+            v-model="fileForm.templateName"
+            class="pull-length"
+            placeholder="请输入模板名称"
+          ></el-input>
+        </el-form-item>
+        <el-form-item label="模板类型" prop="type" class="form-item">
+          <el-select v-model="fileForm.type" :clearable="true" class="input">
+            <el-option label="试卷导出" value="PAPER_EXPORT"> </el-option>
+            <el-option label="答案导出" value="ANWSER_EXPORT"> </el-option>
+            <el-option label="离线试卷" value="OUTLINE_PAPER_EXPORT">
+            </el-option>
+            <el-option label="试卷预览" value="PAPER_VIEW"> </el-option>
+            <el-option label="答案预览" value="ANWSER_VIEW"> </el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item label="文件" prop="dataFile">
+          <el-input
+            v-model="fileForm.fileName"
+            class="pull-length"
+            :readonly="true"
+            placeholder="文件最大限制10M"
+          />
+        </el-form-item>
+        <el-form-item>
+          <el-upload
+            :before-upload="handleUploadFile"
+            accept=".ftl,.zip"
+            action="/upload"
           >
-          <el-button @click="closeFileModel">取消</el-button>
-        </el-row>
+            <el-button
+              type="primary"
+              size="small"
+              icon="ios-cloud-upload-outline"
+              >请选择文件
+            </el-button>
+          </el-upload>
+        </el-form-item>
       </el-form>
+      <div slot="footer">
+        <el-button type="primary" :loading="fileForm.loading" @click="subFile"
+          >确定</el-button
+        >
+        <el-button @click="closeFileModel">取消</el-button>
+      </div>
     </el-dialog>
+
     <el-dialog
       title="配置信息"
       width="550px"
       :visible.sync="configModel"
       :close-on-click-modal="false"
+      :modal="false"
+      append-to-body
+      custom-class="side-dialog"
       @close="closeConfigModel"
     >
       <el-form
@@ -258,34 +237,30 @@
         :rules="configRules"
         label-width="90px"
       >
-        <el-row v-if="isSuperAdmin" class="form-row">
-          <el-form-item label="学校名称">
-            <el-input
-              v-model="configForm.orgName"
-              disabled="true"
-              class="pull-length"
-            ></el-input>
-          </el-form-item>
-        </el-row>
-        <el-row class="form-row">
-          <el-form-item label="配置名称" prop="serviceName">
-            <el-input
-              v-model="configForm.serviceName"
-              class="pull-length"
-              placeholder="请输入serviceName"
-            ></el-input>
-          </el-form-item>
-        </el-row>
-        <el-row class="pull-center">
-          <el-button
-            type="primary"
-            :loading="configForm.loading"
-            @click="subConfig"
-            >确定</el-button
-          >
-          <el-button @click="closeConfigModel">取消</el-button>
-        </el-row>
+        <el-form-item v-if="isSuperAdmin" label="学校名称">
+          <el-input
+            v-model="configForm.orgName"
+            disabled="true"
+            class="pull-length"
+          ></el-input>
+        </el-form-item>
+        <el-form-item label="配置名称" prop="serviceName">
+          <el-input
+            v-model="configForm.serviceName"
+            class="pull-length"
+            placeholder="请输入serviceName"
+          ></el-input>
+        </el-form-item>
       </el-form>
+      <div slot="footer">
+        <el-button
+          type="primary"
+          :loading="configForm.loading"
+          @click="subConfig"
+          >确定</el-button
+        >
+        <el-button @click="closeConfigModel">取消</el-button>
+      </div>
     </el-dialog>
   </section>
 </template>

src/modules/questions/views/user.vue

@@ -1,571 +1,577 @@
 <template>
   <section class="content">
-    <div class="box box-info">
-      <div
-        v-loading.fullscreen="loading"
-        class="box-body"
-        element-loading-text="请稍后..."
+    <div
+      v-loading.fullscreen="loading"
+      class="box-body"
+      element-loading-text="请稍后..."
+    ></div>
+
+    <div class="part-box">
+      <h2 class="part-box-title">用户管理</h2>
+      <!-- 搜索 -->
+      <el-form class="part-filter-form" inline :model="searchForm">
+        <el-form-item v-if="isSuperAdmin" label="学校">
+          <el-select
+            v-model="searchForm.rootOrgId"
+            placeholder="请选择"
+            :disabled="!isSuperAdmin"
+            class="input_width"
+            filterable
+            @change="rootOrgChanged4Search"
+          >
+            <el-option
+              v-for="item in rootSchoolSelect"
+              :key="item.id"
+              :label="item.name"
+              :value="item.id"
+            />
+          </el-select>
+        </el-form-item>
+        <el-form-item v-if="!onlySubjectTeacher" label="角色">
+          <el-select
+            v-model="searchForm.roleId"
+            clearable
+            placeholder="请选择"
+            class="input_width"
+          >
+            <el-option
+              v-for="item in roleList4Search"
+              :key="item.roleId"
+              :label="item.roleName"
+              :value="item.roleId"
+            />
+          </el-select>
+        </el-form-item>
+        <el-form-item label="课程">
+          <el-select
+            v-model="searchForm.courseId"
+            class="input"
+            :remote-method="getCourses4Search"
+            :loading="courseLoading4Search"
+            remote
+            filterable
+            clearable
+            placeholder="请选择"
+          >
+            <el-option
+              v-for="item in courseList4Search"
+              :key="item.id"
+              :label="item.name + ' - ' + item.code"
+              :value="item.id"
+            ></el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item label="登录名">
+          <el-input
+            v-model="searchForm.loginName"
+            placeholder="请输入登录名"
+            maxlength="20"
+            class="input_width"
+          />
+        </el-form-item>
+        <el-form-item label="姓名">
+          <el-input
+            v-model="searchForm.name"
+            placeholder="请输入姓名"
+            maxlength="20"
+            class="input_width"
+          />
+        </el-form-item>
+
+        <el-form-item label="状态">
+          <el-select v-model="searchForm.enable" class="input">
+            <el-option label="未选择" value=""></el-option>
+            <el-option label="已启用" value="true"></el-option>
+            <el-option label="已禁用" value="false"></el-option>
+          </el-select>
+        </el-form-item>
+
+        <el-form-item>
+          <el-button
+            type="primary"
+            icon="el-icon-search"
+            @click="handleSearchBtn"
+          >
+            查询
+          </el-button>
+
+          <el-button icon="el-icon-refresh" @click="resetEcsFormSearch">
+            重置
+          </el-button>
+        </el-form-item>
+      </el-form>
+
+      <div class="part-box-action">
+        <div>
+          <el-button
+            type="success"
+            icon="el-icon-check"
+            :disabled="noBatchSelected"
+            @click="enableByIds"
+            >启用
+          </el-button>
+          <el-button
+            type="danger"
+            icon="el-icon-close"
+            :disabled="noBatchSelected"
+            @click="disableByIds"
+            >禁用
+          </el-button>
+        </div>
+        <div>
+          <el-button
+            size="small"
+            type="primary"
+            icon="el-icon-plus"
+            @click="openAddingDialog"
+          >
+            新增
+          </el-button>
+          <el-button
+            size="small"
+            type="primary"
+            icon="el-icon-upload2"
+            @click="impUser"
+          >
+            导入
+          </el-button>
+        </div>
+      </div>
+    </div>
+
+    <div class="part-box">
+      <!-- 页面列表 -->
+      <el-table
+        ref="table"
+        :data="tableData"
+        resizable
+        @selection-change="selectChange"
       >
-        <!-- 搜索 -->
-        <el-form inline :model="searchForm">
-          <el-form-item v-if="isSuperAdmin" label="学校">
+        <el-table-column
+          type="selection"
+          width="50"
+          align="center"
+        ></el-table-column>
+        <el-table-column prop="id" width="80" label="ID" />
+        <el-table-column prop="name" width="120" label="姓名" />
+        <el-table-column prop="loginName" width="100" label="登录名" />
+        <el-table-column prop="rootOrgName" label="顶级机构" />
+        <!-- <el-table-column prop="roleNamesStr" width="110" label="角色" /> -->
+        <el-table-column width="120" label="角色">
+          <span
+            slot-scope="scope"
+            v-html="scope.row.roleNamesStr.replace(/,/g, '<br />')"
+          >
+          </span>
+        </el-table-column>
+        <el-table-column width="100" label="审核权限">
+          <span slot-scope="scope">{{
+            scope.row.auditAuthority | auditAuthorityFilter
+          }}</span>
+        </el-table-column>
+        <el-table-column width="120" label="关联课程">
+          <span
+            slot-scope="scope"
+            v-html="
+              scope.row.courseNamesStr &&
+              scope.row.courseNamesStr.replace(/,/g, '<br />')
+            "
+          >
+          </span>
+        </el-table-column>
+        <el-table-column
+          sortable
+          prop="updateTime"
+          width="160"
+          label="更新时间"
+        />
+        <el-table-column width="50" label="状态">
+          <span slot-scope="scope">
+            <span v-if="scope.row.enable">
+              <el-tooltip
+                class="item"
+                effect="dark"
+                content="启用"
+                placement="left"
+              >
+                <i class="el-icon-success" style="color: green"></i>
+              </el-tooltip>
+            </span>
+            <span v-else>
+              <el-tooltip
+                class="item"
+                effect="dark"
+                content="禁用"
+                placement="left"
+              >
+                <i class="el-icon-error" style="color: red"></i>
+              </el-tooltip>
+            </span>
+          </span>
+        </el-table-column>
+        <el-table-column width="190" label="操作">
+          <div slot-scope="scope">
+            <div v-if="showBtn(scope.row)">
+              <el-button
+                v-if="!scope.row.enable"
+                size="mini"
+                type="primary"
+                plain
+                icon="el-icon-check"
+                @click="enableById(scope.row)"
+              >
+                启用
+              </el-button>
+              <el-button
+                v-if="scope.row.enable"
+                size="mini"
+                type="danger"
+                icon="el-icon-close"
+                @click="disableById(scope.row)"
+              >
+                禁用
+              </el-button>
+              &nbsp;
+              <el-dropdown>
+                <el-button type="primary" plain size="mini">
+                  更多<i class="el-icon-arrow-down el-icon--right"></i>
+                </el-button>
+                <el-dropdown-menu slot="dropdown">
+                  <el-dropdown-item>
+                    <el-button
+                      v-if="showUserDataRuleSetting(scope.row)"
+                      size="mini"
+                      type="primary"
+                      plain
+                      icon="el-icon-edit"
+                      @click="
+                        () =>
+                          $router.push(
+                            `./user/data_previllege/${scope.row.rootOrgId}/${scope.row.id}`
+                          )
+                      "
+                      >权限设置
+                    </el-button>
+                  </el-dropdown-item>
+                  <el-dropdown-item>
+                    <el-button
+                      size="mini"
+                      type="primary"
+                      plain
+                      icon="el-icon-edit"
+                      @click="openUpdateDialog(scope.row)"
+                      >编辑
+                    </el-button>
+                  </el-dropdown-item>
+                  <el-dropdown-item>
+                    <el-button
+                      v-if="false"
+                      size="mini"
+                      type="danger"
+                      icon="el-icon-delete"
+                      @click="deleteById(scope.row)"
+                      >删除
+                    </el-button>
+                  </el-dropdown-item>
+                  <el-dropdown-item>
+                    <el-button
+                      size="mini"
+                      type="danger"
+                      @click="resetPass(scope.row)"
+                    >
+                      <v-icon name="lock" scale="0.7" /> 重置密码
+                    </el-button>
+                  </el-dropdown-item>
+                </el-dropdown-menu>
+              </el-dropdown>
+            </div>
+          </div>
+        </el-table-column>
+      </el-table>
+      <div class="part-page">
+        <el-pagination
+          :current-page="currentPage"
+          :page-size="10"
+          :page-sizes="[10, 20, 50, 100, 200, 300]"
+          layout="total, sizes, prev, pager, next, jumper"
+          :total="total"
+          @current-change="handleCurrentChange"
+          @size-change="handleSizeChange"
+        />
+      </div>
+    </div>
+
+    <!-- 添加用户信息弹出框 -->
+    <el-dialog
+      title="新增用户"
+      width="450px"
+      :visible.sync="addingDialog"
+      :modal="false"
+      append-to-body
+      custom-class="side-dialog"
+    >
+      <el-form
+        ref="addingForm"
+        :inline="true"
+        inline-message
+        :model="userForm"
+        :rules="rules"
+        label-position="right"
+        label-width="80px"
+      >
+        <el-row>
+          <el-form-item label="姓名" prop="name">
+            <el-input
+              v-model="userForm.name"
+              class="input_width_lg"
+              auto-complete="off"
+              placeholder="请输入姓名"
+              maxlength="20"
+            />
+          </el-form-item>
+        </el-row>
+        <el-row>
+          <el-form-item label="登录名" prop="loginName">
+            <el-input
+              v-model="userForm.loginName"
+              class="input_width_lg"
+              auto-complete="off"
+              placeholder="请输入登录名"
+              maxlength="20"
+            />
+          </el-form-item>
+        </el-row>
+        <el-row>
+          <el-form-item label="密码" prop="password">
+            <el-input
+              v-model="userForm.password"
+              class="input_width_lg"
+              auto-complete="off"
+              placeholder="请输入密码"
+            />
+          </el-form-item>
+        </el-row>
+        <el-row>
+          <el-form-item v-if="isSuperAdmin" label="学校" prop="rootOrgId">
             <el-select
-              v-model="searchForm.rootOrgId"
+              v-model="userForm.rootOrgId"
+              class="input_width_lg"
               placeholder="请选择"
               :disabled="!isSuperAdmin"
-              class="input_width"
               filterable
-              @change="rootOrgChanged4Search"
+              @change="rootOrgChanged4InsertOrUpdate"
             >
               <el-option
                 v-for="item in rootSchoolSelect"
                 :key="item.id"
                 :label="item.name"
                 :value="item.id"
-              />
+              >
+              </el-option>
             </el-select>
           </el-form-item>
-          <el-form-item v-if="!onlySubjectTeacher" label="角色">
+        </el-row>
+        <el-row>
+          <el-form-item label="角色" prop="roleId">
             <el-select
-              v-model="searchForm.roleId"
-              clearable
+              v-model="userForm.roleId"
+              class="input_width_lg"
               placeholder="请选择"
-              class="input_width"
             >
               <el-option
-                v-for="item in roleList4Search"
+                v-for="item in roleList4InsertOrUpdateWithoutSuperAdmin"
                 :key="item.roleId"
                 :label="item.roleName"
                 :value="item.roleId"
-              />
-            </el-select>
-          </el-form-item>
-          <el-form-item label="课程">
-            <el-select
-              v-model="searchForm.courseId"
-              class="input"
-              :remote-method="getCourses4Search"
-              :loading="courseLoading4Search"
-              remote
-              filterable
-              clearable
-              placeholder="请选择"
-            >
-              <el-option
-                v-for="item in courseList4Search"
-                :key="item.id"
-                :label="item.name + ' - ' + item.code"
-                :value="item.id"
-              ></el-option>
+                :disabled="roleDis(item.roleCode)"
+              >
+              </el-option>
             </el-select>
           </el-form-item>
-          <el-form-item label="登录名">
-            <el-input
-              v-model="searchForm.loginName"
-              placeholder="请输入登录名"
-              maxlength="20"
-              class="input_width"
-            />
-          </el-form-item>
-          <el-form-item label="姓名">
-            <el-input
-              v-model="searchForm.name"
-              placeholder="请输入姓名"
-              maxlength="20"
-              class="input_width"
-            />
-          </el-form-item>
-
+        </el-row>
+        <el-row>
           <el-form-item label="状态">
-            <el-select v-model="searchForm.enable" class="input">
-              <el-option label="未选择" value=""></el-option>
-              <el-option label="已启用" value="true"></el-option>
-              <el-option label="已禁用" value="false"></el-option>
-            </el-select>
+            <el-radio-group v-model="enableStr" class="pull_right_sm">
+              <el-radio label="true">启用</el-radio>
+              <el-radio label="false">禁用</el-radio>
+            </el-radio-group>
           </el-form-item>
+        </el-row>
+      </el-form>
+      <div slot="footer">
+        <el-button type="primary" @click="add">保 存</el-button>
+        <el-button @click="addingDialog = false">取 消</el-button>
+      </div>
+    </el-dialog>
 
-          <el-form-item>
+    <!-- 修改用户信息弹出框 -->
+    <el-dialog
+      title="编辑用户"
+      width="450px"
+      :visible.sync="updateDialog"
+      :modal="false"
+      append-to-body
+      custom-class="side-dialog"
+    >
+      <el-form
+        ref="updateForm"
+        :inline="true"
+        inline-message
+        :model="userForm"
+        :rules="rules"
+        label-position="right"
+        label-width="120px"
+      >
+        <el-form-item label="ID">
+          <el-input
+            v-model="userForm.id"
+            class="input_width_lg"
+            :disabled="true"
+          />
+        </el-form-item>
+        <el-form-item label="姓名" prop="name">
+          <el-input
+            v-model="userForm.name"
+            class="input_width_lg"
+            auto-complete="off"
+            placeholder="请输入姓名"
+            maxlength="20"
+          />
+        </el-form-item>
+        <el-form-item label="登录名" prop="loginName">
+          <el-input
+            v-model="userForm.loginName"
+            class="input_width_lg"
+            auto-complete="off"
+            placeholder="请输入登录名"
+            maxlength="20"
+          />
+        </el-form-item>
+        <el-form-item v-if="isSuperAdmin" label="学校" prop="rootOrgId">
+          <el-select
+            v-model="userForm.rootOrgId"
+            class="input_width_lg"
+            placeholder="请选择"
+            :disabled="true"
+          >
+            <el-option
+              v-for="item in rootSchoolSelect"
+              :key="item.id"
+              :label="item.name"
+              :value="item.id"
+            >
+            </el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item label="角色" prop="roleId">
+          <el-select
+            v-model="userForm.roleId"
+            class="input_width_lg"
+            placeholder="请选择"
+            :disabled="rowIsSuperAdmin"
+          >
+            <el-option
+              v-for="item in roleList4InsertOrUpdate"
+              :key="item.roleId"
+              :label="item.roleName"
+              :disabled="roleDis(item.roleCode)"
+              :value="item.roleId"
+            >
+            </el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item label="状态">
+          <el-radio-group
+            v-model="enableStr"
+            class="pull_right_sm"
+            :disabled="rowIsSuperAdmin"
+          >
+            <el-radio label="true">启用</el-radio>
+            <el-radio label="false">禁用</el-radio>
+          </el-radio-group>
+        </el-form-item>
+      </el-form>
+      <div slot="footer">
+        <el-button type="primary" @click="update">保 存</el-button>
+        <el-button @click="updateDialog = false">取 消</el-button>
+      </div>
+    </el-dialog>
+    <!-- 导入弹窗 -->
+    <el-dialog
+      title="导入窗口"
+      width="520px"
+      :visible.sync="impDialog"
+      :modal="false"
+      append-to-body
+      custom-class="side-dialog"
+    >
+      <el-form>
+        <el-form-item style="margin-left: 20px">
+          <el-upload
+            ref="upload"
+            class="form_left"
+            accept="application/vnd.openxmlformats-officedocument.spreadsheetml.sheet"
+            :action="uploadAction"
+            :headers="uploadHeaders"
+            :data="uploadData"
+            :on-success="uploadSuccess"
+            :on-error="uploadError"
+            :file-list="fileList"
+            :auto-upload="false"
+            :multiple="false"
+          >
             <el-button
+              slot="trigger"
               size="small"
               type="primary"
               icon="el-icon-search"
-              @click="handleSearchBtn"
             >
-              查询
+              选择文件
             </el-button>
-
+            &nbsp;
             <el-button
               size="small"
-              icon="el-icon-refresh"
-              @click="resetEcsFormSearch"
+              type="primary"
+              icon="el-icon-check"
+              @click="submitUpload"
             >
-              重置
+              确认上传
             </el-button>
-
             <el-button
               size="small"
               type="primary"
-              icon="el-icon-plus"
-              @click="openAddingDialog"
+              icon="el-icon-refresh"
+              @click="removeFile"
             >
-              新增
+              清空文件
             </el-button>
             <el-button
               size="small"
               type="primary"
-              icon="el-icon-upload2"
-              @click="impUser"
+              icon="el-icon-download"
+              @click="exportFile"
             >
-              导入
+              下载模板
             </el-button>
-          </el-form-item>
-        </el-form>
-
-        <div class="block-seperator"></div>
-        <span>批量操作：</span>
-
-        <el-button
-          size="small"
-          type="success"
-          icon="el-icon-check"
-          :disabled="noBatchSelected"
-          @click="enableByIds"
-          >启用
-        </el-button>
-        <el-button
-          size="small"
-          type="danger"
-          icon="el-icon-close"
-          :disabled="noBatchSelected"
-          @click="disableByIds"
-          >禁用
-        </el-button>
-
-        <div class="block-seperator"></div>
-        <!-- 添加用户信息弹出框 -->
-        <el-dialog title="新增用户" width="450px" :visible.sync="addingDialog">
-          <el-form
-            ref="addingForm"
-            :inline="true"
-            inline-message
-            :model="userForm"
-            :rules="rules"
-            label-position="right"
-            label-width="120px"
-          >
-            <el-row>
-              <el-form-item label="姓名" prop="name">
-                <el-input
-                  v-model="userForm.name"
-                  class="input_width_lg"
-                  auto-complete="off"
-                  placeholder="请输入姓名"
-                  maxlength="20"
-                />
-              </el-form-item>
-            </el-row>
-            <el-row>
-              <el-form-item label="登录名" prop="loginName">
-                <el-input
-                  v-model="userForm.loginName"
-                  class="input_width_lg"
-                  auto-complete="off"
-                  placeholder="请输入登录名"
-                  maxlength="20"
-                />
-              </el-form-item>
-            </el-row>
-            <el-row>
-              <el-form-item label="密码" prop="password">
-                <el-input
-                  v-model="userForm.password"
-                  class="input_width_lg"
-                  auto-complete="off"
-                  placeholder="请输入密码"
-                />
-              </el-form-item>
-            </el-row>
-            <el-row>
-              <el-form-item v-if="isSuperAdmin" label="学校" prop="rootOrgId">
-                <el-select
-                  v-model="userForm.rootOrgId"
-                  class="input_width_lg"
-                  placeholder="请选择"
-                  :disabled="!isSuperAdmin"
-                  filterable
-                  @change="rootOrgChanged4InsertOrUpdate"
-                >
-                  <el-option
-                    v-for="item in rootSchoolSelect"
-                    :key="item.id"
-                    :label="item.name"
-                    :value="item.id"
-                  >
-                  </el-option>
-                </el-select>
-              </el-form-item>
-            </el-row>
-            <el-row>
-              <el-form-item label="角色" prop="roleId">
-                <el-select
-                  v-model="userForm.roleId"
-                  class="input_width_lg"
-                  placeholder="请选择"
-                >
-                  <el-option
-                    v-for="item in roleList4InsertOrUpdateWithoutSuperAdmin"
-                    :key="item.roleId"
-                    :label="item.roleName"
-                    :value="item.roleId"
-                    :disabled="roleDis(item.roleCode)"
-                  >
-                  </el-option>
-                </el-select>
-              </el-form-item>
-            </el-row>
-            <el-row>
-              <el-form-item label="状态">
-                <el-radio-group v-model="enableStr" class="pull_right_sm">
-                  <el-radio label="true">启用</el-radio>
-                  <el-radio label="false">禁用</el-radio>
-                </el-radio-group>
-              </el-form-item>
-            </el-row>
-            <el-row class="d-flex justify-content-center">
-              <el-button type="primary" @click="add">保 存</el-button>
-              <el-button @click="addingDialog = false">取 消</el-button>
-            </el-row>
-          </el-form>
-        </el-dialog>
-
-        <!-- 修改用户信息弹出框 -->
-        <el-dialog title="编辑用户" width="450px" :visible.sync="updateDialog">
-          <el-form
-            ref="updateForm"
-            :inline="true"
-            inline-message
-            :model="userForm"
-            :rules="rules"
-            label-position="right"
-            label-width="120px"
-          >
-            <el-row>
-              <el-form-item label="ID">
-                <el-input
-                  v-model="userForm.id"
-                  class="input_width_lg"
-                  :disabled="true"
-                />
-              </el-form-item>
-            </el-row>
-            <el-row>
-              <el-form-item label="姓名" prop="name">
-                <el-input
-                  v-model="userForm.name"
-                  class="input_width_lg"
-                  auto-complete="off"
-                  placeholder="请输入姓名"
-                  maxlength="20"
-                />
-              </el-form-item>
-            </el-row>
-            <el-row>
-              <el-form-item label="登录名" prop="loginName">
-                <el-input
-                  v-model="userForm.loginName"
-                  class="input_width_lg"
-                  auto-complete="off"
-                  placeholder="请输入登录名"
-                  maxlength="20"
-                />
-              </el-form-item>
-            </el-row>
-            <el-row>
-              <el-form-item v-if="isSuperAdmin" label="学校" prop="rootOrgId">
-                <el-select
-                  v-model="userForm.rootOrgId"
-                  class="input_width_lg"
-                  placeholder="请选择"
-                  :disabled="true"
-                >
-                  <el-option
-                    v-for="item in rootSchoolSelect"
-                    :key="item.id"
-                    :label="item.name"
-                    :value="item.id"
-                  >
-                  </el-option>
-                </el-select>
-              </el-form-item>
-            </el-row>
-            <el-row>
-              <el-form-item label="角色" prop="roleId">
-                <el-select
-                  v-model="userForm.roleId"
-                  class="input_width_lg"
-                  placeholder="请选择"
-                  :disabled="rowIsSuperAdmin"
-                >
-                  <el-option
-                    v-for="item in roleList4InsertOrUpdate"
-                    :key="item.roleId"
-                    :label="item.roleName"
-                    :disabled="roleDis(item.roleCode)"
-                    :value="item.roleId"
-                  >
-                  </el-option>
-                </el-select>
-              </el-form-item>
-            </el-row>
-            <el-row>
-              <el-form-item label="状态">
-                <el-radio-group
-                  v-model="enableStr"
-                  class="pull_right_sm"
-                  :disabled="rowIsSuperAdmin"
-                >
-                  <el-radio label="true">启用</el-radio>
-                  <el-radio label="false">禁用</el-radio>
-                </el-radio-group>
-              </el-form-item>
-            </el-row>
-            <el-row class="d-flex justify-content-center">
-              <el-button type="primary" @click="update">保 存</el-button>
-              <el-button @click="updateDialog = false">取 消</el-button>
-            </el-row>
-          </el-form>
-        </el-dialog>
-        <!-- 导入弹窗 -->
-        <el-dialog title="导入窗口" width="520px" :visible.sync="impDialog">
-          <el-form>
-            <el-row>
-              <el-form-item style="margin-left: 20px">
-                <el-upload
-                  ref="upload"
-                  class="form_left"
-                  accept="application/vnd.openxmlformats-officedocument.spreadsheetml.sheet"
-                  :action="uploadAction"
-                  :headers="uploadHeaders"
-                  :data="uploadData"
-                  :on-success="uploadSuccess"
-                  :on-error="uploadError"
-                  :file-list="fileList"
-                  :auto-upload="false"
-                  :multiple="false"
-                >
-                  <el-button
-                    slot="trigger"
-                    size="small"
-                    type="primary"
-                    icon="el-icon-search"
-                  >
-                    选择文件
-                  </el-button>
-                  &nbsp;
-                  <el-button
-                    size="small"
-                    type="primary"
-                    icon="el-icon-check"
-                    @click="submitUpload"
-                  >
-                    确认上传
-                  </el-button>
-                  <el-button
-                    size="small"
-                    type="primary"
-                    icon="el-icon-refresh"
-                    @click="removeFile"
-                  >
-                    清空文件
-                  </el-button>
-                  <el-button
-                    size="small"
-                    type="primary"
-                    icon="el-icon-download"
-                    @click="exportFile"
-                  >
-                    下载模板
-                  </el-button>
-                  <div slot="tip" class="el-upload__tip">只能上传xlsx文件</div>
-                </el-upload>
-              </el-form-item>
-            </el-row>
-          </el-form>
-        </el-dialog>
+            <div slot="tip" class="el-upload__tip">只能上传xlsx文件</div>
+          </el-upload>
+        </el-form-item>
+      </el-form>
+    </el-dialog>
 
-        <!-- 导入错误信息列表 -->
-        <el-dialog title="错误提示" :visible.sync="errDialog">
-          <div
-            v-for="errMessage in errMessages"
-            :key="errMessage.lineNum"
-            class="text-danger"
-          >
-            第{{ errMessage.lineNum }}行：{{ errMessage.msg }}
-          </div>
-          <span slot="footer" class="dialog-footer">
-            <el-button @click="errDialog = false">确定</el-button>
-          </span>
-        </el-dialog>
-        <!-- 页面列表 -->
-        <el-table
-          ref="table"
-          :data="tableData"
-          border
-          resizable
-          stripe
-          style="width: 100%"
-          @selection-change="selectChange"
-        >
-          <el-table-column type="selection" width="50"></el-table-column>
-          <el-table-column prop="id" width="80" label="ID" />
-          <el-table-column prop="name" width="120" label="姓名" />
-          <el-table-column prop="loginName" width="100" label="登录名" />
-          <el-table-column prop="rootOrgName" label="顶级机构" />
-          <!-- <el-table-column prop="roleNamesStr" width="110" label="角色" /> -->
-          <el-table-column width="120" label="角色">
-            <span
-              slot-scope="scope"
-              v-html="scope.row.roleNamesStr.replace(/,/g, '<br />')"
-            >
-            </span>
-          </el-table-column>
-          <el-table-column width="100" label="审核权限">
-            <span slot-scope="scope">{{
-              scope.row.auditAuthority | auditAuthorityFilter
-            }}</span>
-          </el-table-column>
-          <el-table-column width="120" label="关联课程">
-            <span
-              slot-scope="scope"
-              v-html="
-                scope.row.courseNamesStr &&
-                scope.row.courseNamesStr.replace(/,/g, '<br />')
-              "
-            >
-            </span>
-          </el-table-column>
-          <el-table-column
-            sortable
-            prop="updateTime"
-            width="160"
-            label="更新时间"
-          />
-          <el-table-column width="50" label="状态">
-            <span slot-scope="scope">
-              <span v-if="scope.row.enable">
-                <el-tooltip
-                  class="item"
-                  effect="dark"
-                  content="启用"
-                  placement="left"
-                >
-                  <i class="el-icon-success" style="color: green"></i>
-                </el-tooltip>
-              </span>
-              <span v-else>
-                <el-tooltip
-                  class="item"
-                  effect="dark"
-                  content="禁用"
-                  placement="left"
-                >
-                  <i class="el-icon-error" style="color: red"></i>
-                </el-tooltip>
-              </span>
-            </span>
-          </el-table-column>
-          <el-table-column width="190" label="操作">
-            <div slot-scope="scope">
-              <div v-if="showBtn(scope.row)">
-                <el-button
-                  v-if="!scope.row.enable"
-                  size="mini"
-                  type="primary"
-                  plain
-                  icon="el-icon-check"
-                  @click="enableById(scope.row)"
-                >
-                  启用
-                </el-button>
-                <el-button
-                  v-if="scope.row.enable"
-                  size="mini"
-                  type="danger"
-                  icon="el-icon-close"
-                  @click="disableById(scope.row)"
-                >
-                  禁用
-                </el-button>
-                &nbsp;
-                <el-dropdown>
-                  <el-button type="primary" plain size="mini">
-                    更多<i class="el-icon-arrow-down el-icon--right"></i>
-                  </el-button>
-                  <el-dropdown-menu slot="dropdown">
-                    <el-dropdown-item>
-                      <el-button
-                        v-if="showUserDataRuleSetting(scope.row)"
-                        size="mini"
-                        type="primary"
-                        plain
-                        icon="el-icon-edit"
-                        @click="
-                          () =>
-                            $router.push(
-                              `./user/data_previllege/${scope.row.rootOrgId}/${scope.row.id}`
-                            )
-                        "
-                        >权限设置
-                      </el-button>
-                    </el-dropdown-item>
-                    <el-dropdown-item>
-                      <el-button
-                        size="mini"
-                        type="primary"
-                        plain
-                        icon="el-icon-edit"
-                        @click="openUpdateDialog(scope.row)"
-                        >编辑
-                      </el-button>
-                    </el-dropdown-item>
-                    <el-dropdown-item>
-                      <el-button
-                        v-if="false"
-                        size="mini"
-                        type="danger"
-                        icon="el-icon-delete"
-                        @click="deleteById(scope.row)"
-                        >删除
-                      </el-button>
-                    </el-dropdown-item>
-                    <el-dropdown-item>
-                      <el-button
-                        size="mini"
-                        type="danger"
-                        @click="resetPass(scope.row)"
-                      >
-                        <v-icon name="lock" scale="0.7" /> 重置密码
-                      </el-button>
-                    </el-dropdown-item>
-                  </el-dropdown-menu>
-                </el-dropdown>
-              </div>
-            </div>
-          </el-table-column>
-        </el-table>
-        <div class="page pull-right">
-          <el-pagination
-            :current-page="currentPage"
-            :page-size="10"
-            :page-sizes="[10, 20, 50, 100, 200, 300]"
-            layout="total, sizes, prev, pager, next, jumper"
-            :total="total"
-            @current-change="handleCurrentChange"
-            @size-change="handleSizeChange"
-          />
-        </div>
+    <!-- 导入错误信息列表 -->
+    <el-dialog title="错误提示" :visible.sync="errDialog" append-to-body>
+      <div
+        v-for="errMessage in errMessages"
+        :key="errMessage.lineNum"
+        class="text-danger"
+      >
+        第{{ errMessage.lineNum }}行：{{ errMessage.msg }}
       </div>
-    </div>
+      <span slot="footer" class="dialog-footer">
+        <el-button @click="errDialog = false">确定</el-button>
+      </span>
+    </el-dialog>
   </section>
 </template>
 

src/plugins/element.js

@@ -2,4 +2,4 @@ import Vue from "vue";
 import Element from "element-ui";
 import "element-ui/lib/theme-chalk/index.css";
 
-Vue.use(Element);
+Vue.use(Element, { size: "medium" });

src/styles/base.scss

@@ -0,0 +1,116 @@
+/* common */
+/* part */
+.part-box {
+  margin-bottom: 20px;
+  background-color: #fff;
+  border-radius: 20px;
+  padding: 30px;
+}
+.part-box-border {
+  border: 1px solid #eff0f5;
+}
+
+.el-form.part-filter-form {
+  padding: 20px 0 5px;
+
+  /* element-ui*/
+  .el-form-item {
+    margin-bottom: 15px;
+    border: 1px solid #dcdfe6;
+    border-radius: 5px;
+
+    &:last-child {
+      border: none;
+    }
+  }
+  .el-form-item__label {
+    margin: 0;
+    padding: 0 20px 0 15px;
+    position: relative;
+
+    &::after {
+      content: "";
+      position: absolute;
+      top: 5px;
+      bottom: 5px;
+      width: 3px;
+      right: 0;
+      background-color: #eff0f5;
+    }
+  }
+  .el-input__inner {
+    border: none;
+  }
+}
+
+.part-box-title {
+  font-size: 20px;
+  line-height: 1;
+  padding-bottom: 20px;
+  border-bottom: 1px solid #eff0f5;
+  margin: 0;
+}
+.part-box-action {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  border-top: 1px solid #eff0f5;
+  padding-top: 20px;
+}
+.part-page {
+  margin-top: 15px;
+  text-align: right;
+}
+.part-none {
+  padding: 100px;
+  font-size: 20px;
+  color: #aaa;
+  text-align: center;
+}
+// other
+.box-justify {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+}
+
+// customize element-ui
+.side-dialog {
+  position: absolute;
+  margin: 0 !important;
+  top: 0;
+  right: 0;
+  height: 100%;
+  box-shadow: 0 0 30px #ccdaec;
+  .el-dialog__header {
+    position: absolute;
+    top: 0;
+    left: 0;
+    right: 0;
+    padding: 20px;
+    &::after {
+      content: "";
+      position: absolute;
+      left: 20px;
+      right: 20px;
+      bottom: 0;
+      border-bottom: 1px solid #eff0f5;
+    }
+  }
+  .el-dialog__body {
+    position: absolute;
+    left: 0;
+    right: 0;
+    top: 70px;
+    bottom: 80px;
+    padding: 20px;
+    overflow: auto;
+  }
+  .el-dialog__footer {
+    position: absolute;
+    bottom: 0;
+    left: 0;
+    right: 0;
+    padding: 20px;
+  }
+}

src/styles/global.css

@@ -1,7 +1,37 @@
 @import "./elementuiCustomize.css";
 @import "./nprogress.css";
 
+/* browse style */
+::-webkit-scrollbar {
+  width: 8px;
+  height: 8px;
+  background: transparent;
+}
+::-webkit-scrollbar-button {
+  display: none;
+}
+::-webkit-scrollbar-track {
+  background: transparent;
+}
+::-webkit-scrollbar-thumb {
+  border-radius: 8px;
+  background: #8c94ac;
+}
+::-webkit-scrollbar-corner {
+  background: transparent;
+}
+::-webkit-scrollbar-resizer {
+  background: transparent;
+}
+
 body {
+  font-family: "Helvetica Neue", Helvetica, "PingFang SC", "Hiragino Sans GB",
+    "Microsoft YaHei", "微软雅黑", Arial, sans-serif;
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+  font-size: 14px;
+  color: #383b4a;
+  background-color: #e1e7f7;
   margin: 0;
   min-width: 1260px;
 }