系统管理菜单页面绘制，其它页面布局优化

src/router/index.js

@@ -15,6 +15,7 @@ import AuditRoutes from './module/audit'
 import MemberRoutes from './module/member'
 import vipRoutes from './module/vip'
 import personalRoutes from './module/personal'
+import settingRoutes from './module/settings'
 
 // 需要权限访问的路由列表
 export const asyncRoutes = [
@@ -25,6 +26,7 @@ export const asyncRoutes = [
   ...doctorRoutes,
   ...materialRoutes,
   ...feedbackRoutes,
+  ...settingRoutes,
   ...helperRoutes,
   ...vipRoutes,
   ...personalRoutes,

src/router/module/settings.js

@@ -0,0 +1,97 @@
+/* Layout */
+import Layout from '@/layout'
+
+const settingRoutes = [
+  {
+    path: '/settings',
+    component: Layout,
+    redirect: '/settings/menus',
+    name: 'Settings',
+    meta: { title: '系统设置', icon: 'el-icon-s-tools', roles: ['admin'], noCache: true },
+    children: [
+      {
+        path: 'menus',
+        name: 'SettingsMenus',
+        meta: { title: '菜单管理', roles: ['admin'], noCache: true },
+        component: () => import('@/views/admin/settings/menus')
+      },
+      {
+        path: 'menus/add',
+        name: 'SettingsMenusAdd',
+        hidden: true,
+        meta: { title: '添加菜单', roles: ['admin'], noCache: true },
+        component: () => import('@/views/admin/settings/menus/edit')
+      },
+      {
+        path: 'menus/edit',
+        name: 'SettingsMenusEdit',
+        hidden: true,
+        meta: { title: '修改菜单', roles: ['admin'], noCache: true },
+        component: () => import('@/views/admin/settings/menus/edit')
+      },
+      {
+        path: 'menus/children',
+        name: 'SettingsChildrenMenus',
+        hidden: true,
+        meta: { title: '子菜单管理', roles: ['admin'], noCache: true },
+        component: () => import('@/views/admin/settings/menus')
+      },
+      {
+        path: 'menus/children/add',
+        name: 'SettingsChildrenMenusAdd',
+        hidden: true,
+        meta: { title: '添加子菜单', roles: ['admin'], noCache: true },
+        component: () => import('@/views/admin/settings/menus/edit')
+      },
+      {
+        path: 'menus/children/edit',
+        name: 'SettingsChildrenMenusEdit',
+        hidden: true,
+        meta: { title: '修改子菜单', roles: ['admin'], noCache: true },
+        component: () => import('@/views/admin/settings/menus/edit')
+      },
+      {
+        path: 'roles',
+        name: 'SettingsRoles',
+        meta: { title: '角色管理', roles: ['admin'], noCache: true },
+        component: () => import('@/views/admin/settings/roles')
+      },
+      {
+        path: 'roles/add',
+        name: 'SettingsRolesAdd',
+        hidden: true,
+        meta: { title: '添加角色', roles: ['admin'], noCache: true },
+        component: () => import('@/views/admin/settings/roles/edit')
+      },
+      {
+        path: 'roles/edit',
+        name: 'SettingsRolesEdit',
+        hidden: true,
+        meta: { title: '修改角色', roles: ['admin'], noCache: true },
+        component: () => import('@/views/admin/settings/roles/edit')
+      },
+      {
+        path: 'accounts',
+        name: 'SettingsAccounts',
+        meta: { title: '用户管理', roles: ['admin'], noCache: true },
+        component: () => import('@/views/admin/settings/accounts')
+      },
+      {
+        path: 'accounts/add',
+        name: 'SettingsAccountsAdd',
+        hidden: true,
+        meta: { title: '添加用户', roles: ['admin'], noCache: true },
+        component: () => import('@/views/admin/settings/accounts/edit')
+      },
+      {
+        path: 'accounts/edit',
+        name: 'SettingsAccountsEdit',
+        hidden: true,
+        meta: { title: '修改用户', roles: ['admin'], noCache: true },
+        component: () => import('@/views/admin/settings/accounts/edit')
+      }
+    ]
+  }
+]
+
+export default settingRoutes

src/views/admin/audit/club/device/index.vue

@@ -32,6 +32,7 @@
       border
       fit
       highlight-current-row
+      header-row-class-name="tableHeader"
       cell-class-name="table-cell"
     >
       <el-table-column :index="indexMethod" label="序号" type="index" width="80" align="center" />

src/views/admin/audit/club/index.vue

@@ -43,6 +43,7 @@
       border
       fit
       highlight-current-row
+      header-row-class-name="tableHeader"
       cell-class-name="table-cell"
     >
       <el-table-column :index="indexMethod" label="序号" type="index" width="80" align="center" />

src/views/admin/audit/club/list.vue

@@ -36,6 +36,7 @@
       border
       fit
       highlight-current-row
+      header-row-class-name="tableHeader"
       cell-class-name="table-cell"
     >
       <el-table-column label="序号" :index="indexMethod" type="index" width="80" align="center" />

src/views/admin/audit/doctor/index.vue

@@ -43,6 +43,7 @@
       border
       fit
       highlight-current-row
+      header-row-class-name="tableHeader"
       cell-class-name="table-cell"
     >
       <el-table-column :index="indexMethod" label="序号" type="index" width="80" align="center" />

src/views/admin/audit/material/article/index.vue

@@ -28,6 +28,7 @@
       border
       fit
       highlight-current-row
+      header-row-class-name="tableHeader"
       cell-class-name="table-cell"
     >
       <el-table-column label="序号" :index="indexMethod" type="index" width="80" align="center" />

src/views/admin/audit/material/file/index.vue

@@ -37,6 +37,7 @@
       border
       fit
       highlight-current-row
+      header-row-class-name="tableHeader"
       cell-class-name="table-cell"
     >
       <el-table-column label="序号" :index="indexMethod" type="index" width="80" align="center" />

src/views/admin/audit/material/image/index.vue

@@ -29,6 +29,7 @@
       fit
       highlight-current-row
       cell-class-name="table-cell"
+      header-row-class-name="tableHeader"
     >
       <el-table-column label="序号" type="index" :index="indexMethod" width="80" align="center" />
       <el-table-column label="图片标题" prop="imageTitle" align="center" />

src/views/admin/audit/material/index.vue

@@ -43,6 +43,7 @@
       border
       fit
       highlight-current-row
+      header-row-class-name="tableHeader"
       cell-class-name="table-cell"
     >
       <el-table-column label="序号" :index="indexMethod" type="index" width="80" align="center" />

src/views/admin/audit/material/video/index.vue

@@ -29,6 +29,7 @@
       fit
       highlight-current-row
       cell-class-name="table-cell"
+      header-row-class-name="tableHeader"
     >
       <el-table-column label="序号" type="index" :index="indexMethod" width="80" align="center" />
       <el-table-column label="视频名称" prop="videoTitle" align="center" />

src/views/admin/member/handsel.vue

@@ -110,6 +110,7 @@
           style="overflow:auto"
           :infinite-scroll-delay="300"
           :infinite-scroll-immediate="false"
+          header-row-class-name="tableHeader"
         >
           <el-table-column label="序号" type="selection" width="55" align="center" />
           <el-table-column label="序号" type="index" width="80" align="center" />

src/views/admin/member/index.vue

@@ -39,6 +39,7 @@
       border
       fit
       highlight-current-row
+      header-row-class-name="tableHeader"
       class="table-cell"
     >
       <el-table-column :index="indexMethod" label="序号" type="index" width="80" align="center" />

src/views/admin/member/record.vue

@@ -60,6 +60,7 @@
       border
       fit
       class="table-cell"
+      header-row-class-name="tableHeader"
     >
       <el-table-column :index="indexMethod" label="序号" type="index" width="80" align="center" />
       <el-table-column prop="name" label="购买套餐" align="center">

src/views/admin/member/service.vue

@@ -13,7 +13,7 @@
       </div>
     </div>
     <!-- 表格区域 -->
-    <el-table :data="serviceList" border fit height="600">
+    <el-table :data="serviceList" border fit height="600" header-row-class-name="tableHeader">
       <el-table-column label="序号" type="index" width="80" align="center" />
       <el-table-column label="定制需求" prop="demand" align="center" />
       <el-table-column label="是否配置" align="center" width="120">

src/views/admin/settings/accounts/edit.vue

@@ -0,0 +1,74 @@
+<template>
+  <div class="app-container menus-edit">
+    <el-form label-width="100px">
+      <el-form-item label="用户头像：">
+        <el-input v-show="false" />
+        <upload-image tip="建议尺寸：60 * 60px" />
+      </el-form-item>
+      <el-form-item label="姓名：">
+        <el-input placeholder="姓名" />
+      </el-form-item>
+      <el-form-item label="登录名：">
+        <el-input placeholder="登录名" />
+      </el-form-item>
+      <el-form-item label="密码：">
+        <el-input placeholder="密码" />
+      </el-form-item>
+      <el-form-item label="手机号：">
+        <el-input placeholder="手机号" />
+      </el-form-item>
+      <el-form-item label="状态：">
+        <el-radio-group>
+          <el-radio>启用</el-radio>
+          <el-radio>停用</el-radio>
+        </el-radio-group>
+      </el-form-item>
+      <el-form-item label="用户角色：">
+        <el-checkbox-group v-model="checkList">
+          <el-checkbox label="管理员" />
+          <el-checkbox label="供应商" />
+          <el-checkbox label="系统开发者" />
+        </el-checkbox-group>
+      </el-form-item>
+      <el-form-item>
+        <!-- 确认 取消 -->
+        <div class="control-box">
+          <el-button type="primary">保存</el-button>
+          <el-button type="info">重置</el-button>
+          <el-button type="warning">返回</el-button>
+        </div>
+      </el-form-item>
+    </el-form>
+
+  </div>
+</template>
+
+<script>
+import UploadImage from '@/components/UploadImage'
+export default {
+  components: {
+    UploadImage
+  },
+  data() {
+    return {
+      checkList: []
+    }
+  }
+}
+</script>
+
+<style scoped lang="scss">
+.menus-edit{
+  width: 600px;
+  margin: 0 auto;
+  margin-top: 100px;
+}
+.control-box {
+  margin: 20px 0;
+  text-align: center;
+  .el-button {
+    width: 120px;
+    margin: 0 8px;
+  }
+}
+</style>

src/views/admin/settings/accounts/index.vue

@@ -0,0 +1,106 @@
+<template>
+  <div class="app-container">
+    <div class="filter-container">
+      <div class="filter-control">
+        <span>启用状态：</span>
+        <el-select
+          v-model="listQuery.status"
+          placeholder="启用状态"
+          clearable
+          style="width: 200px"
+          class="filter-item"
+          @change="getList()"
+        >
+          <el-option label="全部" value="" />
+          <el-option label="已启用" :value="0" />
+          <el-option label="未启用" :value="1" />
+        </el-select>
+      </div>
+      <div class="filter-control">
+        <el-button type="primary" @click="$_navigationTo('accounts/add')">添加用户</el-button>
+      </div>
+    </div>
+    <!-- 搜索区域END -->
+    <el-table
+      v-loading="listLoading"
+      :data="list"
+      style="width: 100%"
+      border
+      fit
+      class="table-cell"
+      header-row-class-name="tableHeader"
+    >
+      <el-table-column :index="indexMethod" label="序号" type="index" width="80" align="center" />
+      <el-table-column prop="title" label="头像" align="center" width="60">
+        <template slot-scope="{ row }">
+          <img :src="row.avatar" class="avatar" alt="">
+        </template>
+      </el-table-column>
+      <el-table-column prop="username" label="登录账号" align="center" />
+      <el-table-column prop="fullName" label="姓名" align="center" />
+      <el-table-column label="手机号" align="center">
+        <template slot-scope="{row}">
+          <span>{{ row.phone || '—' }}</span>
+        </template>
+      </el-table-column>
+      <el-table-column prop="roleDesc" label="角色描述" align="center" />
+      <el-table-column label="启用状态" align="center" width="100">
+        <template slot-scope="{ row }">
+          <el-switch v-model="row.loginFlag" :active-value="1" :inactive-value="0" />
+        </template>
+      </el-table-column>
+      <el-table-column label="操作" align="center" width="200">
+        <template>
+          <el-button type="primary" size="mini" @click="$_navigationTo('accounts/edit')">编辑</el-button>
+          <el-button type="danger" size="mini">删除</el-button>
+        </template>
+      </el-table-column>
+    </el-table>
+  </div>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      listLoading: false,
+      listQuery: {
+        status: '',
+        pageSize: 10,
+        pageNum: 1
+      },
+      list: [{
+        avatar: 'https://img.caimei365.com/group1/M00/03/ED/rB-lGGHpCyKAGi-aAAAYvvHB_HE522.gif',
+        createTime: '2021-12-27 16:48:21',
+        delFlag: 0,
+        fullName: '系统管理员',
+        id: 1,
+        loginFlag: 1,
+        menus: null,
+        password: null,
+        permissions: null,
+        phone: '',
+        roleDesc: '管理员 ',
+        roleIds: '1',
+        roles: ['admin'],
+        updateTime: '2022-02-07 04:00:50',
+        username: 'sysadmin'
+      }]
+    }
+  },
+  methods: {
+    indexMethod(index) {
+      return index + this.listQuery.pageSize * (this.listQuery.pageNum - 1) + 1
+    },
+    getList() {}
+  }
+}
+</script>
+
+<style scoped lang="scss">
+.avatar{
+  display: block;
+  width: 40px;
+  height: 40px;
+}
+</style>

src/views/admin/settings/menus/edit.vue

@@ -0,0 +1,79 @@
+<template>
+  <div class="app-container menus-edit">
+    <el-form label-width="100px">
+      <el-form-item label="上级菜单：">
+        <el-input placeholder="上级菜单" />
+      </el-form-item>
+      <el-form-item label="菜单名称：">
+        <el-input placeholder="菜单名称" />
+      </el-form-item>
+      <el-form-item label="路由名称：">
+        <el-input placeholder="路由名称" />
+      </el-form-item>
+      <el-form-item label="显示隐藏：">
+        <el-radio-group>
+          <el-radio>显示</el-radio>
+          <el-radio>隐藏</el-radio>
+        </el-radio-group>
+      </el-form-item>
+      <el-form-item label="前端图标：">
+        <el-input placeholder="前端图标" />
+      </el-form-item>
+      <el-form-item label="状态：">
+        <el-radio-group>
+          <el-radio>启用</el-radio>
+          <el-radio>停用</el-radio>
+        </el-radio-group>
+      </el-form-item>
+      <el-form-item label="排序：">
+        <el-input placeholder="排序" />
+      </el-form-item>
+      <el-form-item label="按钮权限：">
+        <template>
+          <el-table border>
+            <el-table-column label="按钮名称" align="center" />
+            <el-table-column label="权限标识" align="center" />
+            <el-table-column label="操作" align="center">
+              <template>
+                <el-button type="danger">删除按钮</el-button>
+              </template>
+            </el-table-column>
+          </el-table>
+          <div style="text-align:center;margin-top: 24px">
+            <el-button type="primary" size="mini">添加按钮</el-button>
+          </div>
+          <el-divider />
+        </template>
+      </el-form-item>
+      <el-form-item>
+        <!-- 确认 取消 -->
+        <div class="control-box">
+          <el-button type="primary">保存</el-button>
+          <el-button type="info">重置</el-button>
+          <el-button type="warning">返回</el-button>
+        </div>
+      </el-form-item>
+    </el-form>
+
+  </div>
+</template>
+
+<script>
+export default {}
+</script>
+
+<style scoped lang="scss">
+.menus-edit{
+  width: 600px;
+  margin: 0 auto;
+  margin-top: 40px;
+}
+.control-box {
+  margin: 20px 0;
+  text-align: center;
+  .el-button {
+    width: 120px;
+    margin: 0 8px;
+  }
+}
+</style>

src/views/admin/settings/menus/index.vue

@@ -0,0 +1,107 @@
+<template>
+  <div class="app-container">
+    <div class="filter-container">
+      <div class="filter-control">
+        <span>菜单状态：</span>
+        <el-select
+          v-model="listQuery.status"
+          placeholder="启用状态"
+          clearable
+          style="width: 200px"
+          class="filter-item"
+          @change="getList()"
+        >
+          <el-option label="全部" value="" />
+          <el-option label="已启用" :value="0" />
+          <el-option label="未启用" :value="1" />
+        </el-select>
+      </div>
+      <div class="filter-control">
+        <el-button type="primary" @click="$_navigationTo('menus/add')">添加菜单</el-button>
+      </div>
+    </div>
+    <!-- 搜索区域END -->
+    <el-table
+      v-loading="listLoading"
+      :data="list"
+      style="width: 100%"
+      border
+      fit
+      header-row-class-name="tableHeader"
+      class="table-cell"
+    >
+      <el-table-column :index="indexMethod" label="序号" type="index" width="80" align="center" />
+      <!-- <el-table-column prop="title" label="菜单级别" align="center">
+        <template slot-scope="{ row }">{{ row.parentId ? '二级' : '一级' }}</template>
+      </el-table-column> -->
+      <el-table-column prop="title" label="菜单名称" align="center" />
+      <el-table-column prop="name" label="路由名称" align="center" />
+      <el-table-column label="展示图标" align="center" width="100">
+        <template slot-scope="{ row }">
+          <i v-if="row.icon" :class="row.icon" />
+          <span v-else>无</span>
+        </template>
+      </el-table-column>
+      <el-table-column label="启用状态" align="center" width="100">
+        <template slot-scope="{ row }">
+          <el-switch v-model="row.status" :active-value="1" :inactive-value="0" />
+        </template>
+      </el-table-column>
+      <el-table-column prop="sort" label="排序" align="center" width="100">
+        <template slot-scope="{ row }">
+          <el-input v-model="row.sort" />
+        </template>
+      </el-table-column>
+      <el-table-column label="子菜单管理" align="center" width="240">
+        <template>
+          <el-button size="mini" @click="$_navigationTo('/settings/menus/children/add')">添加子菜单</el-button>
+          <el-button size="mini" @click="$_navigationTo(`/settings/menus/children?id=${Math.random()}`)">查看子菜单</el-button>
+        </template>
+      </el-table-column>
+      <el-table-column label="操作" align="center" width="200">
+        <template>
+          <el-button type="primary" size="mini" @click="$_navigationTo('menus/edit')">编辑</el-button>
+          <el-button type="danger" size="mini">删除</el-button>
+        </template>
+      </el-table-column>
+    </el-table>
+  </div>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      listLoading: false,
+      listQuery: {
+        status: '',
+        pageSize: 10,
+        pageNum: 1
+      },
+      list: [{
+        childCount: 4,
+        createTime: '2021-12-27 16:49:41',
+        delFlag: 0,
+        hidden: 0,
+        icon: 'el-icon-s-tools',
+        id: 1,
+        name: 'SysSetting',
+        parentId: 0,
+        permissionJson: null,
+        permissions: null,
+        sort: 0,
+        status: 1,
+        title: '系统设置'
+      }]
+    }
+  },
+  methods: {
+    indexMethod(index) {
+      return index + this.listQuery.pageSize * (this.listQuery.pageNum - 1) + 1
+    },
+    getList() {}
+  }
+}
+</script>
+
+<style scoped></style>

src/views/admin/settings/roles/edit.vue

@@ -0,0 +1,118 @@
+<template>
+  <div class="app-container roles-edit">
+    <el-form label-width="100px">
+      <el-form-item label="角色名称：">
+        <el-input placeholder="角色名称" />
+      </el-form-item>
+      <el-form-item label="角色描述：">
+        <el-input placeholder="角色描述" />
+      </el-form-item>
+      <el-form-item label="角色授权：">
+        <el-tree
+          ref="tree"
+          :data="data"
+          show-checkbox
+          default-expand-all
+          node-key="id"
+          highlight-current
+          :props="defaultProps"
+        />
+      </el-form-item>
+      <el-form-item>
+        <!-- 确认 取消 -->
+        <div class="control-box">
+          <el-button type="primary">保存</el-button>
+          <el-button type="info">重置</el-button>
+          <el-button type="warning">返回</el-button>
+        </div>
+      </el-form-item>
+    </el-form>
+  </div>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      data: [{
+        id: 1,
+        label: '一级 1',
+        children: [{
+          id: 4,
+          label: '二级 1-1',
+          children: [{
+            id: 9,
+            label: '三级 1-1-1'
+          }, {
+            id: 10,
+            label: '三级 1-1-2'
+          }]
+        }]
+      }, {
+        id: 2,
+        label: '一级 2',
+        children: [{
+          id: 5,
+          label: '二级 2-1'
+        }, {
+          id: 6,
+          label: '二级 2-2'
+        }]
+      }, {
+        id: 3,
+        label: '一级 3',
+        children: [{
+          id: 7,
+          label: '二级 3-1'
+        }, {
+          id: 8,
+          label: '二级 3-2'
+        }]
+      }],
+      defaultProps: {
+        children: 'children',
+        label: 'label'
+      }
+    }
+  },
+  methods: {
+    getCheckedNodes() {
+      console.log(this.$refs.tree.getCheckedNodes())
+    },
+    getCheckedKeys() {
+      console.log(this.$refs.tree.getCheckedKeys())
+    },
+    setCheckedNodes() {
+      this.$refs.tree.setCheckedNodes([{
+        id: 5,
+        label: '二级 2-1'
+      }, {
+        id: 9,
+        label: '三级 1-1-1'
+      }])
+    },
+    setCheckedKeys() {
+      this.$refs.tree.setCheckedKeys([3])
+    },
+    resetChecked() {
+      this.$refs.tree.setCheckedKeys([])
+    }
+  }
+}
+</script>
+
+<style scoped lang="scss">
+.roles-edit {
+  width: 600px;
+  margin: 0 auto;
+  margin-top: 40px;
+}
+.control-box {
+  margin: 20px 0;
+  text-align: center;
+  .el-button {
+    width: 120px;
+    margin: 0 8px;
+  }
+}
+</style>

src/views/admin/settings/roles/index.vue

@@ -0,0 +1,88 @@
+<template>
+  <div class="app-container">
+    <div class="filter-container">
+      <div class="filter-control">
+        <el-button type="primary" @click="$_navigationTo('roles/add')">添加角色</el-button>
+      </div>
+    </div>
+    <!-- 搜索区域END -->
+    <el-table
+      v-loading="listLoading"
+      :data="list"
+      style="width: 100%"
+      border
+      fit
+      class="table-cell"
+      header-row-class-name="tableHeader"
+    >
+      <el-table-column :index="indexMethod" label="序号" type="index" width="80" align="center" />
+      <el-table-column prop="roleName" label="角色名" align="center" />
+      <el-table-column prop="roleDesc" label="角色描述" align="center" />
+      <el-table-column label="创建时间" align="center">
+        <template slot-scope="{ row }">
+          <span>{{ row.createTime | formatTime }}</span>
+        </template>
+      </el-table-column>
+      <el-table-column label="更新时间" align="center">
+        <template slot-scope="{ row }">
+          <span>{{ row.updateTime | formatTime }}</span>
+        </template>
+      </el-table-column>
+      <el-table-column label="操作" align="center" width="200">
+        <template>
+          <el-button type="primary" size="mini" @click="$_navigationTo('roles/edit')">编辑</el-button>
+          <el-button type="danger" size="mini">删除</el-button>
+        </template>
+      </el-table-column>
+    </el-table>
+  </div>
+</template>
+
+<script>
+import { formatDate } from '@/utils'
+export default {
+  filters: {
+    formatTime(time) {
+      if (!time) {
+        return ''
+      }
+      return formatDate(time, 'yyyy-MM-DD HH:mm:ss')
+    }
+  },
+  data() {
+    return {
+      listLoading: false,
+      listQuery: {
+        status: '',
+        pageSize: 10,
+        pageNum: 1
+      },
+      list: [
+        {
+          createTime: '2021-12-27 16:45:33',
+          delFlag: 0,
+          id: 1,
+          menuIds: null,
+          roleDesc: '管理员',
+          roleName: 'admin',
+          updateTime: '2022-02-09 04:19:51'
+        }
+      ]
+    }
+  },
+  methods: {
+    indexMethod(index) {
+      return index + this.listQuery.pageSize * (this.listQuery.pageNum - 1) + 1
+    },
+    getList() {}
+  }
+}
+</script>
+
+<style scoped lang="scss">
+.avatar {
+  display: block;
+  width: 40px;
+  height: 40px;
+}
+</style>

src/views/admin/supplier/club/device/index.vue

@@ -1,39 +1,61 @@
 <template>
   <div class="app-container">
     <div class="filter-container">
-      <span>设备名称:</span>
-      <el-input v-model="listQuery.productName" placeholder="商品名称" style="width: 200px;" class="filter-item" @keyup.enter.native="handleFilter" />
-      <span>设备SN码:</span>
-      <el-input v-model="listQuery.snCode" placeholder="商品SN码" style="width: 200px;" class="filter-item" @keyup.enter.native="handleFilter" />
-      <span>审核状态:</span>
-      <el-select
-        v-model="listQuery.auditStatus"
-        placeholder="审核状态"
-        clearable
-        style="width: 200px"
-        class="filter-item"
-        @change="getList"
-      >
-        <el-option label="全部" value="" />
-        <el-option label="待审核" :value="2" />
-        <el-option label="审核通过" :value="1" />
-        <el-option label="审核未通过" :value="0" />
-      </el-select>
-      <span>上线状态:</span>
-      <el-select
-        v-model="listQuery.status"
-        placeholder="上线状态"
-        clearable
-        style="width: 200px"
-        class="filter-item"
-        @change="getList"
-      >
-        <el-option label="全部" value="" />
-        <el-option label="已上线" :value="1" />
-        <el-option label="待上线" :value="2" />
-        <el-option label="未上线" :value="0" />
-      </el-select>
-      <el-button type="primary" icon="el-icon-search" @click="handleFilter">查询</el-button>
+      <div class="filter-control">
+        <span>设备名称:</span>
+        <el-input
+          v-model="listQuery.productName"
+          placeholder="商品名称"
+          style="width: 200px;"
+          class="filter-item"
+          @keyup.enter.native="handleFilter"
+        />
+      </div>
+      <div class="filter-control">
+        <span>设备SN码:</span>
+        <el-input
+          v-model="listQuery.snCode"
+          placeholder="商品SN码"
+          style="width: 200px;"
+          class="filter-item"
+          @keyup.enter.native="handleFilter"
+        />
+      </div>
+      <div class="filter-control">
+        <span>审核状态:</span>
+        <el-select
+          v-model="listQuery.auditStatus"
+          placeholder="审核状态"
+          clearable
+          style="width: 200px"
+          class="filter-item"
+          @change="getList"
+        >
+          <el-option label="全部" value="" />
+          <el-option label="待审核" :value="2" />
+          <el-option label="审核通过" :value="1" />
+          <el-option label="审核未通过" :value="0" />
+        </el-select>
+      </div>
+      <div class="filter-control">
+        <span>上线状态:</span>
+        <el-select
+          v-model="listQuery.status"
+          placeholder="上线状态"
+          clearable
+          style="width: 200px"
+          class="filter-item"
+          @change="getList"
+        >
+          <el-option label="全部" value="" />
+          <el-option label="已上线" :value="1" />
+          <el-option label="待上线" :value="2" />
+          <el-option label="未上线" :value="0" />
+        </el-select>
+      </div>
+      <div class="filter-control">
+        <el-button type="primary" icon="el-icon-search" @click="handleFilter">查询</el-button>
+      </div>
     </div>
     <!-- 表格区域 -->
     <el-table
@@ -57,13 +79,7 @@
           <!-- 未通过原因展示 -->
           <template v-if="row.auditStatus === 0">
             <!-- <span class="status danger">审核未通过&nbsp;</span> -->
-            <el-popover
-              placement="top-start"
-              title="审核说明"
-              width="400"
-              trigger="hover"
-              :content="row.invalidReason"
-            >
+            <el-popover placement="top-start" title="审核说明" width="400" trigger="hover" :content="row.invalidReason">
               <el-tag slot="reference" size="small" type="danger" class="reason">
                 <span>审核未通过</span>
                 <span class="el-icon-question status danger " />
@@ -75,16 +91,27 @@
       </el-table-column>
 
       <el-table-column label="上线状态" width="140px" align="center">
-        <template slot-scope="{row}">
+        <template slot-scope="{ row }">
           <!-- 只有审核通过了才能操作上下线 auditStatus ：审核状态 -->
           <template v-if="row.auditStatus === 1">
             <template v-if="row.status === 0">
               <span style="margin-right:10px;" class="status danger">已下线</span>
-              <el-button v-if="userIdentity===2 || proxyInfo !== null" type="primary" size="mini" @click="handleChangeStatus(row)">上线</el-button>
+              <el-button
+                v-if="userIdentity === 2 || proxyInfo !== null"
+                type="primary"
+                size="mini"
+                @click="handleChangeStatus(row)"
+              >上线</el-button>
             </template>
             <template v-else>
               <span style="margin-right:10px;" class="status success ">已上线</span>
-              <el-button v-if="userIdentity===2 || proxyInfo !== null" type="info" size="mini" plain @click="handleChangeStatus(row)">下线</el-button>
+              <el-button
+                v-if="userIdentity === 2 || proxyInfo !== null"
+                type="info"
+                size="mini"
+                plain
+                @click="handleChangeStatus(row)"
+              >下线</el-button>
             </template>
           </template>
           <template v-else>
@@ -94,13 +121,17 @@
         </template>
       </el-table-column>
       <el-table-column label="创建时间" class-name="status-col" width="300px" align="center">
-        <template slot-scope="{row}">
+        <template slot-scope="{ row }">
           <span>{{ row.createTime | formatTime }}</span>
         </template>
       </el-table-column>
       <el-table-column label="操作" align="center" width="240px" class-name="small-padding fixed-width">
-        <template slot-scope="{row}">
-          <el-button type="primary" size="mini" @click="$_navigationTo(`club-device-detail?id=${row.productId}`)">查看</el-button>
+        <template slot-scope="{ row }">
+          <el-button
+            type="primary"
+            size="mini"
+            @click="$_navigationTo(`club-device-detail?id=${row.productId}`)"
+          >查看</el-button>
           <el-button type="primary" size="mini" :disabled="row.auditStatus !== 1" @click="handleShowQRcode(row)">
             二维码
           </el-button>
@@ -109,7 +140,13 @@
     </el-table>
 
     <!-- 页码 -->
-    <pagination v-show="total>0" :total="total" :page.sync="listQuery.pageNum" :limit.sync="listQuery.pageSize" @pagination="getList" />
+    <pagination
+      v-show="total > 0"
+      :total="total"
+      :page.sync="listQuery.pageNum"
+      :limit.sync="listQuery.pageSize"
+      @pagination="getList"
+    />
 
     <!-- 二维码 -->
     <transition name="fade">
@@ -168,14 +205,16 @@ export default {
   methods: {
     // 获取列表信息
     getList() {
-      getProdList(this.listQuery).then(res => {
-        const { total, list } = res.data
-        this.total = total
-        this.list = list
-        // this.checkAuditFailedList(list)
-      }).finally(() => {
-        this.listLoading = false
-      })
+      getProdList(this.listQuery)
+        .then(res => {
+          const { total, list } = res.data
+          this.total = total
+          this.list = list
+          // this.checkAuditFailedList(list)
+        })
+        .finally(() => {
+          this.listLoading = false
+        })
     },
     // 过滤列表
     handleFilter() {
@@ -196,19 +235,20 @@ export default {
 </script>
 
 <style lang="scss" scoped>
-.filter-container{
-  span{
+.filter-container {
+  span {
     display: inline-block;
     margin-bottom: 10px;
     vertical-align: middle;
     font-size: 14px;
   }
-  .el-button{
+  .el-button {
     display: inline-block;
     margin-bottom: 10px;
     vertical-align: middle;
   }
-  .el-input,.el-select{
+  .el-input,
+  .el-select {
     margin-right: 10px;
     margin-left: 10px;
   }

src/views/admin/supplier/club/index.vue

@@ -1,40 +1,54 @@
 <template>
   <div class="app-container">
     <div class="filter-container">
-      <span>机构名称:</span>
-      <el-input v-model="listQuery.authParty" placeholder="授权机构" style="width: 280px;" class="filter-item" @keyup.enter.native="handleFilter" />
-      <span>审核状态:</span>
-      <el-select
-        v-model="listQuery.auditStatus"
-        placeholder="审核状态"
-        clearable
-        style="width: 200px"
-        class="filter-item"
-        @change="getList"
-      >
-        <el-option label="全部" value="" />
-        <el-option label="待审核" :value="2" />
-        <el-option label="审核通过" :value="1" />
-        <el-option label="审核未通过" :value="0" />
-      </el-select>
-      <span>上线状态:</span>
-      <el-select
-        v-model="listQuery.status"
-        placeholder="上线状态"
-        clearable
-        style="width: 200px"
-        class="filter-item"
-        @change="getList"
-      >
-        <el-option label="全部" value="" />
-        <el-option label="已上线" :value="1" />
-        <el-option label="待上线" :value="2" />
-        <el-option label="未上线" :value="0" />
-      </el-select>
-      <el-button icon="el-icon-search" type="primary" @click="getList">查询</el-button>
-      <!-- <el-button icon="el-icon-upload" type="primary" @click="improtDialogVisible = true">导入</el-button> -->
-      <el-button icon="el-icon-document" type="primary" @click="handleExportExcel">导出</el-button>
-      <!-- <el-button icon="el-icon-document-copy" type="primary" @click="downLoadExportExcel">获取导入模板</el-button> -->
+      <div class="filter-control">
+        <span>机构名称:</span>
+        <el-input
+          v-model="listQuery.authParty"
+          placeholder="授权机构"
+          style="width: 280px;"
+          class="filter-item"
+          @keyup.enter.native="handleFilter"
+        />
+      </div>
+      <div class="filter-control">
+        <span>审核状态:</span>
+        <el-select
+          v-model="listQuery.auditStatus"
+          placeholder="审核状态"
+          clearable
+          style="width: 200px"
+          class="filter-item"
+          @change="getList"
+        >
+          <el-option label="全部" value="" />
+          <el-option label="待审核" :value="2" />
+          <el-option label="审核通过" :value="1" />
+          <el-option label="审核未通过" :value="0" />
+        </el-select>
+      </div>
+      <div class="filter-control">
+        <span>上线状态:</span>
+        <el-select
+          v-model="listQuery.status"
+          placeholder="上线状态"
+          clearable
+          style="width: 200px"
+          class="filter-item"
+          @change="getList"
+        >
+          <el-option label="全部" value="" />
+          <el-option label="已上线" :value="1" />
+          <el-option label="待上线" :value="2" />
+          <el-option label="未上线" :value="0" />
+        </el-select>
+      </div>
+      <div class="filter-control">
+        <el-button icon="el-icon-search" type="primary" @click="getList">查询</el-button>
+        <!-- <el-button icon="el-icon-upload" type="primary" @click="improtDialogVisible = true">导入</el-button> -->
+        <el-button icon="el-icon-document" type="primary" @click="handleExportExcel">导出</el-button>
+        <!-- <el-button icon="el-icon-document-copy" type="primary" @click="downLoadExportExcel">获取导入模板</el-button> -->
+      </div>
     </div>
     <!-- 表格区域 -->
     <el-table
@@ -58,13 +72,7 @@
           <!-- 未通过原因展示 -->
           <template v-if="row.auditStatus === 0">
             <!-- <span class="status danger">审核未通过&nbsp;</span> -->
-            <el-popover
-              placement="top-start"
-              title="审核说明"
-              width="400"
-              trigger="hover"
-              :content="row.invalidReason"
-            >
+            <el-popover placement="top-start" title="审核说明" width="400" trigger="hover" :content="row.invalidReason">
               <el-tag slot="reference" size="small" type="danger" class="reason">
                 <span>审核未通过</span>
                 <span class="el-icon-question status danger " />
@@ -76,7 +84,7 @@
       </el-table-column>
 
       <el-table-column label="上线状态" width="140px" align="center">
-        <template slot-scope="{row}">
+        <template slot-scope="{ row }">
           <!-- 只有审核通过了才能操作上下线 auditStatus ：审核状态 -->
           <template v-if="row.auditStatus === 1">
             <template v-if="row.status === 0">
@@ -94,18 +102,26 @@
       </el-table-column>
 
       <el-table-column label="创建时间" class-name="status-col" width="360px">
-        <template slot-scope="{row}">
+        <template slot-scope="{ row }">
           <span>{{ row.createTime | formatTime }}</span>
         </template>
       </el-table-column>
 
       <!-- <el-table-column label="创建人" class-name="status-col" width="160px" prop="createBy" /> -->
       <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
-        <template slot-scope="{row}">
-          <el-button type="primary" size="mini" @click="$_navigationTo(`club-detail?id=${row.authId}&authParty=${row.authParty}`)">
+        <template slot-scope="{ row }">
+          <el-button
+            type="primary"
+            size="mini"
+            @click="$_navigationTo(`club-detail?id=${row.authId}&authParty=${row.authParty}`)"
+          >
             查看
           </el-button>
-          <el-button type="primary" size="mini" @click="$_navigationTo(`club-device-list?id=${row.authId}&authParty=${row.authParty}`)">
+          <el-button
+            type="primary"
+            size="mini"
+            @click="$_navigationTo(`club-device-list?id=${row.authId}&authParty=${row.authParty}`)"
+          >
             查看设备认证
           </el-button>
         </template>
@@ -113,7 +129,13 @@
     </el-table>
 
     <!-- 页码 -->
-    <pagination v-show="total>0" :total="total" :page.sync="listQuery.pageNum" :limit.sync="listQuery.pageSize" @pagination="getList" />
+    <pagination
+      v-show="total > 0"
+      :total="total"
+      :page.sync="listQuery.pageNum"
+      :limit.sync="listQuery.pageSize"
+      @pagination="getList"
+    />
   </div>
 </template>
 
@@ -161,7 +183,8 @@ export default {
         fileUrl: [
           {
             required: true,
-            message: '请选择文件', trigger: 'change'
+            message: '请选择文件',
+            trigger: 'change'
           }
         ]
       },
@@ -186,7 +209,9 @@ export default {
   methods: {
     // 下载模板
     downLoadExportExcel() {
-      downLoadWithATag(`${process.env.VUE_APP_BASE_API}/download/file?ossName=%E6%AD%A3%E5%93%81%E8%81%94%E7%9B%9F%E6%9C%BA%E6%9E%84%E3%80%81%E5%95%86%E5%93%81%E5%AF%BC%E5%85%A5%E6%A8%A1%E6%9D%BF.xlsx&fileName=%E6%AD%A3%E5%93%81%E8%81%94%E7%9B%9F%E6%9C%BA%E6%9E%84%E3%80%81%E5%95%86%E5%93%81%E5%AF%BC%E5%85%A5%E6%A8%A1%E6%9D%BF.xlsx`)
+      downLoadWithATag(
+        `${process.env.VUE_APP_BASE_API}/download/file?ossName=%E6%AD%A3%E5%93%81%E8%81%94%E7%9B%9F%E6%9C%BA%E6%9E%84%E3%80%81%E5%95%86%E5%93%81%E5%AF%BC%E5%85%A5%E6%A8%A1%E6%9D%BF.xlsx&fileName=%E6%AD%A3%E5%93%81%E8%81%94%E7%9B%9F%E6%9C%BA%E6%9E%84%E3%80%81%E5%95%86%E5%93%81%E5%AF%BC%E5%85%A5%E6%A8%A1%E6%9D%BF.xlsx`
+      )
     },
 
     // 导出为Excel
@@ -221,7 +246,9 @@ export default {
           this.improtDialogVisible = false
           this.getList()
         })
-        .catch(err => { console.log(err) })
+        .catch(err => {
+          console.log(err)
+        })
         .finally(() => {
           this.requestLoading = false
         })
@@ -229,19 +256,22 @@ export default {
     // 获取授权列表
     getList() {
       this.listLoading = true
-      fecthAuthList(this.listQuery).then(response => {
-        if (response.code !== 0) {
+      fecthAuthList(this.listQuery)
+        .then(response => {
+          if (response.code !== 0) {
+            return this.$message.error('授权列表信息获取失败')
+          }
+          const { list, total } = response.data
+          this.list = list
+          this.total = total
+        })
+        .catch(err => {
+          console.log(err)
           return this.$message.error('授权列表信息获取失败')
-        }
-        const { list, total } = response.data
-        this.list = list
-        this.total = total
-      }).catch(err => {
-        console.log(err)
-        return this.$message.error('授权列表信息获取失败')
-      }).finally(() => {
-        this.listLoading = false
-      })
+        })
+        .finally(() => {
+          this.listLoading = false
+        })
     },
     // 过滤列表
     handleFilter() {
@@ -257,21 +287,5 @@ export default {
 </script>
 
 <style lang="scss" scoped>
-.filter-container{
-  span{
-    display: inline-block;
-    margin-bottom: 10px;
-    vertical-align: middle;
-    font-size: 14px;
-  }
-  .el-button{
-    display: inline-block;
-    margin-bottom: 10px;
-    vertical-align: middle;
-  }
-  .el-input,.el-select{
-    margin-right: 10px;
-    margin-left: 10px;
-  }
-}
+
 </style>

src/views/admin/supplier/index.vue

@@ -1,30 +1,66 @@
 <template>
   <div class="app-container">
     <div class="filter-container">
-      <span>供应商名称:</span>
-      <el-input v-model="listQuery.shopName" placeholder="供应商名称" style="width: 200px;" class="filter-item" @keyup.enter.native="handleFilter" />
-      <span>供应商类型:</span>
-      <el-select v-model="listQuery.shopType" placeholder="供应商类型" clearable style="width: 200px" class="filter-item" @change="getList()">
-        <el-option label="所有类型" value="" />
-        <el-option label="代理商" :value="2" />
-        <el-option label="品牌方" :value="1" />
-      </el-select>
-      <span>所属品牌:</span>
-      <el-select v-model="listQuery.brandId" placeholder="所属品牌" clearable class="filter-item" style="width: 200px" filterable @change="getList()">
-        <el-option label="所有品牌" value="" />
-        <el-option
-          v-for="item in brandList"
-          :key="item.id"
-          :label="item.name"
-          :value="item.id"
+      <div class="filter-control">
+        <span>供应商名称:</span>
+        <el-input v-model="listQuery.shopName" placeholder="供应商名称" @keyup.enter.native="handleFilter" />
+      </div>
+
+      <div class="filter-control">
+        <span>供应商类型:</span>
+        <el-select
+          v-model="listQuery.shopType"
+          placeholder="供应商类型"
+          clearable
+          style="width: 200px"
+          class="filter-item"
+          @change="getList()"
+        >
+          <el-option label="所有类型" value="" />
+          <el-option label="代理商" :value="2" />
+          <el-option label="品牌方" :value="1" />
+        </el-select>
+      </div>
+      <div class="filter-control">
+        <span>所属品牌:</span>
+        <el-select
+          v-model="listQuery.brandId"
+          placeholder="所属品牌"
+          clearable
+          class="filter-item"
+          style="width: 200px"
+          filterable
+          @change="getList()"
+        >
+          <el-option label="所有品牌" value="" />
+          <el-option v-for="item in brandList" :key="item.id" :label="item.name" :value="item.id" />
+        </el-select>
+      </div>
+      <div class="filter-control">
+        <span>手机号:</span>
+        <el-input
+          v-model="listQuery.mobile"
+          placeholder="手机号"
+          style="width: 200px;"
+          class="filter-item"
+          @keyup.enter.native="handleFilter"
+        />
+      </div>
+      <div class="filter-control">
+        <span>联系人:</span>
+        <el-input
+          v-model="listQuery.linkMan"
+          placeholder="联系人"
+          style="width: 200px;"
+          class="filter-item"
+          @keyup.enter.native="handleFilter"
         />
-      </el-select>
-      <span>手机号:</span>
-      <el-input v-model="listQuery.mobile" placeholder="手机号" style="width: 200px;" class="filter-item" @keyup.enter.native="handleFilter" />
-      <span>联系人:</span>
-      <el-input v-model="listQuery.linkMan" placeholder="联系人" style="width: 200px;" class="filter-item" @keyup.enter.native="handleFilter" />
-      <el-button type="primary" icon="el-icon-search" @click="getList(listQuery)">查询</el-button>
-      <el-button type="primary" icon="el-icon-edit" @click="$_navigationTo('supplier-add')">添加供应商</el-button>
+      </div>
+
+      <div class="filter-control">
+        <el-button type="primary" icon="el-icon-search" @click="getList(listQuery)">查询</el-button>
+        <el-button type="primary" icon="el-icon-edit" @click="$_navigationTo('supplier-add')">添加供应商</el-button>
+      </div>
     </div>
     <!-- 表格区域 -->
     <el-table
@@ -40,7 +76,7 @@
       <el-table-column label="序号" :index="indexMethod" type="index" sortable="custom" align="center" width="80" />
       <el-table-column label="供应商名称" align="center" prop="name" />
       <el-table-column label="供应商类型" width="150px" align="center">
-        <template v-slot="{row}">
+        <template v-slot="{ row }">
           <span v-if="row.shopType === 1">品牌方</span>
           <span v-if="row.shopType === 2">代理商</span>
         </template>
@@ -48,18 +84,18 @@
       <el-table-column label="手机号" width="120px" align="center" prop="mobile" />
       <el-table-column label="联系人" width="100px" align="center" prop="linkMan" />
       <el-table-column label="供应商状态" align="center" width="140px">
-        <template v-slot="{row}">
+        <template v-slot="{ row }">
           <el-switch v-model="row.shopStatus" @change="handleChangeStatus(row)" />
         </template>
       </el-table-column>
       <el-table-column label="创建时间" class-name="status-col" width="200px">
-        <template slot-scope="{row}">
+        <template slot-scope="{ row }">
           <span>{{ row.createTime | formatTime }}</span>
         </template>
       </el-table-column>
       <el-table-column label="创建人" class-name="status-col" width="100px" prop="createBy" />
       <el-table-column label="操作" align="center" width="360" class-name="small-padding fixed-width">
-        <template slot-scope="{row}">
+        <template slot-scope="{ row }">
           <el-button size="mini" type="primary" @click="$_navigationTo(`supplier-edit?id=${row.authUserId}&type=edit`)">
             编辑
           </el-button>
@@ -77,8 +113,13 @@
     </el-table>
 
     <!-- 页码 -->
-    <pagination v-show="total>0" :total="total" :page.sync="listQuery.pageNum" :limit.sync="listQuery.pageSize" @pagination="getList(listQuery)" />
-
+    <pagination
+      v-show="total > 0"
+      :total="total"
+      :page.sync="listQuery.pageNum"
+      :limit.sync="listQuery.pageSize"
+      @pagination="getList(listQuery)"
+    />
   </div>
 </template>
 
@@ -114,7 +155,7 @@ export default {
         pageNum: 0, // 页码
         pageSize: 10, // 分页大小
         shopName: '', // 供应商名称
-        shopType: ''// 供应商类型
+        shopType: '' // 供应商类型
       },
       list: [],
       brandList: [], // 品牌列表
@@ -129,18 +170,23 @@ export default {
     // 获取列表数据
     getList() {
       this.listLoading = true
-      fetchSupplierList(this.listQuery).then(res => {
-        if (res.code !== 0) {
-          return this.$message.error('获取数据失败~')
-        }
-        const { total, list } = res.data
-        this.total = total
-        this.formatList(list)
-        this.list = list
-        console.log(this.list)
-      }).catch(err => { console.log(err) }).finally(() => {
-        this.listLoading = false
-      })
+      fetchSupplierList(this.listQuery)
+        .then(res => {
+          if (res.code !== 0) {
+            return this.$message.error('获取数据失败~')
+          }
+          const { total, list } = res.data
+          this.total = total
+          this.formatList(list)
+          this.list = list
+          console.log(this.list)
+        })
+        .catch(err => {
+          console.log(err)
+        })
+        .finally(() => {
+          this.listLoading = false
+        })
     },
     // 格式化数组
     formatList(list = []) {
@@ -151,11 +197,13 @@ export default {
     // 获取品牌列表
     getBrandList() {
       // 获取品牌列表
-      fetchBrandList().then(res => {
-        if (res.code === 0) {
-          this.brandList = res.data
-        }
-      }).catch(err => console.log(err))
+      fetchBrandList()
+        .then(res => {
+          if (res.code === 0) {
+            this.brandList = res.data
+          }
+        })
+        .catch(err => console.log(err))
     },
     // 供应商状态改变
     handleChangeStatus(item) {
@@ -173,7 +221,8 @@ export default {
               type: 'success'
             })
           }
-        }).catch(() => {
+        })
+        .catch(() => {
           this.getList()
           this.$message({
             message: '操作失败',
@@ -231,22 +280,5 @@ export default {
 </script>
 
 <style lang="scss" scoped>
-.filter-container{
-  span{
-    display: inline-block;
-    margin-bottom: 10px;
-    vertical-align: middle;
-    font-size: 14px;
-  }
-  .el-button{
-    display: inline-block;
-    margin-bottom: 10px;
-    vertical-align: middle;
-  }
-  .el-input,.el-select{
-    margin-right: 10px;
-    margin-left: 10px;
-  }
-}
 
 </style>

src/views/common/helper/document/index.vue

@@ -36,54 +36,46 @@
       fit
       highlight-current-row
       cell-class-name="table-cell"
+      header-row-class-name="tableHeader"
     >
-      <el-table-column
-        v-loading="listLoading"
-        :data="list"
-        style="width: 100%"
-        border
-        fit
-        highlight-current-row
-        cell-class-name="table-cell"
-      >
-        <el-table-column label="序号" :index="indexMethod" type="index" width="80" align="center" />
-        <el-table-column label="标题" prop="fileTitle" align="center" />
-        <el-table-column label="所属模块" align="center" prop="fileModuleType" />
-        <el-table-column label="创建时间" width="240px" align="center">
-          <template slot-scope="{ row }">
-            {{ row.createTime | formatTime }}
-          </template>
-        </el-table-column>
-        <el-table-column label="操作" align="center">
-          <template slot-scope="{ row }">
-            <el-button
-              v-if="userIdentity === 1"
-              type="primary"
-              size="mini"
-              style="margin-right:5px"
-              icon="el-icon-edit"
-              @click="handleEditFile(row)"
-            >编辑</el-button>
+      <el-table-column label="序号" :index="indexMethod" type="index" width="80" align="center" />
+      <el-table-column label="标题" prop="fileTitle" align="center" />
+      <el-table-column label="所属模块" align="center" prop="fileModuleType" />
+      <el-table-column label="创建时间" width="240px" align="center">
+        <template slot-scope="{ row }">
+          {{ row.createTime | formatTime }}
+        </template>
+      </el-table-column>
+      <el-table-column label="操作" align="center">
+        <template slot-scope="{ row }">
+          <el-button
+            v-if="userIdentity === 1"
+            type="primary"
+            size="mini"
+            style="margin-right: 5px"
+            icon="el-icon-edit"
+            @click="handleEditFile(row)"
+          >编辑</el-button>
 
-            <el-button
-              type="success"
-              size="mini"
-              style="margin-right:5px"
-              icon="el-icon-document"
-              @click="handlePreview(row)"
-            >查看</el-button>
+          <el-button
+            type="success"
+            size="mini"
+            style="margin-right: 5px"
+            icon="el-icon-document"
+            @click="handlePreview(row)"
+          >查看</el-button>
 
-            <el-button
-              v-if="userIdentity === 1"
-              type="danger"
-              size="mini"
-              style="margin-right:5px"
-              icon="el-icon-s-check"
-              @click="handleRemove(row)"
-            >删除</el-button>
-          </template>
-        </el-table-column>
-      </el-table-column></el-table>
+          <el-button
+            v-if="userIdentity === 1"
+            type="danger"
+            size="mini"
+            style="margin-right: 5px"
+            icon="el-icon-s-check"
+            @click="handleRemove(row)"
+          >删除</el-button>
+        </template>
+      </el-table-column>
+    </el-table>
     <!-- 表格区域END -->
     <pagination
       v-show="total > 0"
@@ -221,7 +213,7 @@ export default {
     // 上传文件
     submitUpload() {
       if (this.userIdentity !== 1) return
-      this.$refs.dialogForm.validate(valid => {
+      this.$refs.dialogForm.validate((valid) => {
         console.log(valid)
         if (!valid) return
         this.requestLoading = true // 上传文件 保存 loading
@@ -258,12 +250,12 @@ export default {
         fileModule: this.dialogFormData.fileModule.join('-')
       }
       saveCourse(params)
-        .then(res => {
+        .then((res) => {
           this.$message.success('保存成功')
           this.dialogVisible = false
           this.getList()
         })
-        .catch(err => {
+        .catch((err) => {
           console.log(err)
         })
         .finally(() => {
@@ -321,7 +313,7 @@ export default {
         fileModule: this.listQuery.fileModule.join('-')
       }
       fetchCourseList(params)
-        .then(res => {
+        .then((res) => {
           if (res.code !== 0) return
           this.list = this.formatFileModuleType(res.data.list)
           this.total = res.data.total
@@ -341,7 +333,7 @@ export default {
         this.$message.info('已取消操作')
       })
       if (text !== 'confirm') return
-      removeCourse({ fileId: row.fileId }).then(res => {
+      removeCourse({ fileId: row.fileId }).then((res) => {
         if (res.code !== 0) return
         this.$message.success('删除成功')
         this.getList(this.listQuery)
@@ -365,7 +357,7 @@ export default {
     },
     // 获取模块文本
     formatFileModuleType(list) {
-      return list.filter(item => {
+      return list.filter((item) => {
         item.fileModuleType = getModuleType(item.fileModule)
         return item.fileModuleType !== ''
       })

src/views/common/helper/video/index.vue

@@ -36,54 +36,47 @@
       fit
       highlight-current-row
       cell-class-name="table-cell"
+      header-row-class-name="tableHeader"
     >
-      <el-table-column
-        v-loading="listLoading"
-        :data="list"
-        style="width: 100%"
-        border
-        fit
-        highlight-current-row
-        cell-class-name="table-cell"
-      >
-        <el-table-column label="序号" :index="indexMethod" type="index" width="80" align="center" />
-        <el-table-column label="标题" prop="fileTitle" align="center" />
-        <el-table-column label="所属模块" align="center" prop="fileModuleType" />
-        <el-table-column label="创建时间" width="240px" align="center">
-          <template slot-scope="{ row }">
-            {{ row.createTime | formatTime }}
-          </template>
-        </el-table-column>
-        <el-table-column label="操作" align="center">
-          <template slot-scope="{ row }">
-            <el-button
-              v-if="userIdentity === 1"
-              type="primary"
-              size="mini"
-              style="margin-right:5px"
-              icon="el-icon-edit"
-              @click="handleEditFile(row)"
-            >编辑</el-button>
 
-            <el-button
-              type="success"
-              size="mini"
-              style="margin-right:5px"
-              icon="el-icon-film"
-              @click="handlePreview(row)"
-            >播放</el-button>
+      <el-table-column label="序号" :index="indexMethod" type="index" width="80" align="center" />
+      <el-table-column label="标题" prop="fileTitle" align="center" />
+      <el-table-column label="所属模块" align="center" prop="fileModuleType" />
+      <el-table-column label="创建时间" width="240px" align="center">
+        <template slot-scope="{ row }">
+          {{ row.createTime | formatTime }}
+        </template>
+      </el-table-column>
+      <el-table-column label="操作" align="center">
+        <template slot-scope="{ row }">
+          <el-button
+            v-if="userIdentity === 1"
+            type="primary"
+            size="mini"
+            style="margin-right:5px"
+            icon="el-icon-edit"
+            @click="handleEditFile(row)"
+          >编辑</el-button>
 
-            <el-button
-              v-if="userIdentity === 1"
-              type="danger"
-              size="mini"
-              style="margin-right:5px"
-              icon="el-icon-s-check"
-              @click="handleRemove(row)"
-            >删除</el-button>
-          </template>
-        </el-table-column>
-      </el-table-column></el-table>
+          <el-button
+            type="success"
+            size="mini"
+            style="margin-right:5px"
+            icon="el-icon-film"
+            @click="handlePreview(row)"
+          >播放</el-button>
+
+          <el-button
+            v-if="userIdentity === 1"
+            type="danger"
+            size="mini"
+            style="margin-right:5px"
+            icon="el-icon-s-check"
+            @click="handleRemove(row)"
+          >删除</el-button>
+        </template>
+      </el-table-column>
+    </el-table>
     <!-- 表格区域END -->
     <pagination
       v-show="total > 0"

src/views/normal/club/user/index.vue

@@ -39,6 +39,7 @@
       fit
       highlight-current-row
       cell-class-name="table-cell"
+      header-row-class-name="tableHeader"
     >
       <el-table-column label="序号" :index="indexMethod" type="index" width="80px" align="center" />
       <el-table-column label="邀请码" prop="invitationCode" width="100px" align="center" />

src/views/normal/feedback/index.vue

@@ -32,6 +32,7 @@
       fit
       highlight-current-row
       cell-class-name="table-cell"
+      header-row-class-name="tableHeader"
     >
       <el-table-column label="序号" :index="indexMethod" type="index" width="80" align="center" />
       <el-table-column type="expand" width="50">

src/views/normal/material/article/index.vue

@@ -43,6 +43,7 @@
       fit
       highlight-current-row
       cell-class-name="table-cell"
+      header-row-class-name="tableHeader"
     >
       <el-table-column label="序号" :index="indexMethod" type="index" width="80" align="center" />
       <el-table-column label="文章标题" prop="articleTitle" align="center" />

src/views/normal/material/file/index.vue

@@ -57,6 +57,7 @@
       fit
       highlight-current-row
       cell-class-name="table-cell"
+      header-row-class-name="tableHeader"
     >
       <el-table-column label="序号" :index="indexMethod" type="index" width="80" align="center" />
       <el-table-column label="文件标题" prop="fileTitle" align="center" />

src/views/normal/material/image/index.vue

@@ -57,6 +57,7 @@
       fit
       highlight-current-row
       cell-class-name="table-cell"
+      header-row-class-name="tableHeader"
     >
       <el-table-column label="序号" :index="indexMethod" type="index" width="80" align="center" />
       <el-table-column label="图片标题" prop="imageTitle" align="center" />

src/views/normal/material/video/index.vue

@@ -53,6 +53,7 @@
       fit
       highlight-current-row
       cell-class-name="table-cell"
+      header-row-class-name="tableHeader"
     >
       <el-table-column label="序号" :index="indexMethod" type="index" width="80" align="center" />
       <el-table-column label="视频标题" prop="videoTitle" align="center" />