项目结构整合

src/components/LevelButton/index.vue

@@ -0,0 +1,76 @@
+<template>
+  <div v-if="hasPermission" class="level-button">
+    <el-button
+      :size="size"
+      :type="type"
+      :plain="plain"
+      :round="round"
+      :circle="circle"
+      :loading="loading"
+      :disabled="disabled"
+      :icon="icon"
+      :autofocus="autofocus"
+      :native-type="nativeType"
+      @click="$emit('click')"
+    ><slot /></el-button>
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'LevelButton',
+  props: {
+    permission: {
+      type: Array,
+      default: () => []
+    },
+    size: {
+      type: String,
+      default: 'medium',
+      validator: value => ['medium', 'small', 'mini'].indexOf(value) !== -1
+    },
+    type: {
+      type: String,
+      default: 'primary',
+      validator: value => ['primary', 'success', 'warning', 'danger', 'info', 'text'].indexOf(value) !== -1
+    },
+    plain: {
+      type: Boolean,
+      default: false
+    },
+    round: {
+      type: Boolean,
+      default: false
+    },
+    circle: {
+      type: Boolean,
+      default: false },
+    loading: {
+      type: Boolean,
+      default: false
+    },
+    disabled: {
+      type: Boolean,
+      default: false
+    },
+    icon: {
+      type: String,
+      default: ''
+    },
+    autofocus: {
+      type: Boolean,
+      default: false
+    },
+    nativeType: {
+      type: String,
+      default: 'button',
+      validator: value => ['button', 'submit', 'reset'].indexOf(value) !== -1
+    }
+  },
+  computed: {
+    hasPermission() {
+      return this.permission.length === 0
+    }
+  }
+}
+</script>

src/router/index.js

@@ -1,5 +1,6 @@
 import Vue from 'vue'
 import Router from 'vue-router'
+import Layout from '@/layout'
 
 Vue.use(Router)
 
@@ -33,22 +34,35 @@ export const constantRoutes = [
   },
   {
     path: '/login',
-    component: () => import(/* webpackChunkName: "login" */ '@/views/login/index'),
+    component: () => import(/* webpackChunkName: "common-page" */ '@/views/common/login'),
     hidden: true
   },
+  {
+    path: '/password',
+    component: Layout,
+    name: 'Password',
+    meta: { title: '密码管理' },
+    hidden: true,
+    children: [{
+      path: 'edit',
+      meta: { title: '修改密码' },
+      component: () => import(/* webpackChunkName: "common-page" */ '@/views/common/password'),
+      hidden: true
+    }]
+  },
   {
     path: '/proxy',
-    component: () => import(/* webpackChunkName: "proxy" */ '@/views/proxy'),
+    component: () => import(/* webpackChunkName: "common-page" */ '@/views/common/proxy'),
     hidden: true
   },
   {
     path: '/404',
-    component: () => import(/* webpackChunkName: "error-page" */ '@/views/error-page/404'),
+    component: () => import(/* webpackChunkName: "common-page" */ '@/views/common/error-page/404'),
     hidden: true
   },
   {
     path: '/401',
-    component: () => import(/* webpackChunkName: "error-page" */ '@/views/error-page/401'),
+    component: () => import(/* webpackChunkName: "common-page" */ '@/views/common/error-page/401'),
     hidden: true
   }
 ]

src/router/module/club.js

@@ -15,7 +15,7 @@ const clubRoutes = [
         path: 'list',
         component: () => import('@/views/normal/club'),
         name: 'ClubList',
-        meta: { title: '机构列表', roles: ['admin', 'normal'], affix: true, noCache: true, proxy: true }
+        meta: { title: '机构列表', roles: ['normal'], affix: true, noCache: true, proxy: true }
       },
       {
         path: 'club-add',

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

@@ -114,32 +114,10 @@
 
     <!-- 页码 -->
     <pagination v-show="total>0" :total="total" :page.sync="listQuery.pageNum" :limit.sync="listQuery.pageSize" @pagination="getList" />
-
-    <!-- 导入对话框 -->
-    <!-- dialog Start -->
-    <el-dialog
-      title="导入"
-      :visible.sync="improtDialogVisible"
-      width="30%"
-      @close="improtDialogClose"
-    >
-      <el-form ref="dialogForm" :model="improtDialogFormData" label-width="86px" :rules="improtDialogFormRules">
-        <el-form-item label="文件路径:" prop="fileUrl">
-          <file-upload ref="fileUpload" :file-list="uploadFileList" @change="fileUploadChange" />
-          <el-input v-show="false" v-model="improtDialogFormData.fileUrl" />
-        </el-form-item>
-      </el-form>
-      <span slot="footer" class="dialog-footer">
-        <el-button @click="improtDialogVisible = false">取 消</el-button>
-        <el-button type="primary" :disabled="!saveBtnClickable" :loading="requestLoading" @click="submitUpload">确 定</el-button>
-      </span>
-    </el-dialog>
-    <!-- dialog END -->
   </div>
 </template>
 
 <script>
-import FileUpload from '@/components/FileUpload'
 import { fecthAuthList, authImportExcel } from '@/api/auth'
 import Pagination from '@/components/Pagination' // secondary package based on el-pagination
 import { mapGetters } from 'vuex'
@@ -147,7 +125,7 @@ import { formatDate } from '@/utils'
 import { debounce, downLoadWithATag } from '@/utils/tools'
 export default {
   name: 'ComplexTable',
-  components: { Pagination, FileUpload },
+  components: { Pagination },
   filters: {
     formatTime(time) {
       if (!time) {
@@ -206,27 +184,6 @@ export default {
     this.getList()
   },
   methods: {
-    // 上传文件
-    submitUpload() {
-      this.$refs.dialogForm.validate(valid => {
-        console.log(valid)
-        if (!valid) return
-        this.requestLoading = true // 上传文件
-        // this.$refs.fileUpload.submit()
-        this.handleSave()
-      })
-    },
-    // 监听上传文件的状态变化
-    async fileUploadChange(fileList) {
-      this.uploadFileList = fileList
-      try {
-        await this.handleFileUploadStatus(fileList)
-        this.handleSave.apply(this)
-      } catch (error) {
-        console.log(error)
-      }
-    },
-
     // 下载模板
     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`)
@@ -269,35 +226,6 @@ export default {
           this.requestLoading = false
         })
     }, 200),
-
-    // 处理文件上传状态
-    handleFileUploadStatus(fileList) {
-      console.log(fileList)
-      this.chooseFile = fileList[0].raw
-      // 文件列表为空
-      if (fileList.length <= 0) {
-        this.improtDialogFormData.fileUrl = ''
-        return Promise.reject('faild')
-      }
-      // 取第一个文件
-      const { response, status } = fileList[0]
-      // 文件已选择但未上传
-      if (status === 'ready') {
-        this.improtDialogFormData.fileUrl = status
-        return Promise.reject('faild')
-      }
-      // 文件已上传
-      if (status === 'success') {
-        this.improtDialogFormData.fileUrl = response.previewUrl
-        return Promise.resolve('success')
-      }
-    },
-    improtDialogClose() {
-      console.log(123)
-      // this.uploadFileList = []
-      this.$refs.fileUpload.clearAllFiles()
-      this.$refs.dialogForm.resetFields()
-    },
     // 获取授权列表
     getList() {
       this.listLoading = true
@@ -315,12 +243,6 @@ export default {
         this.listLoading = false
       })
     },
-    // 格式化列表数据
-    formatList(list = []) {
-      list.forEach(i => {
-        i.status = i.status === 1
-      })
-    },
     // 过滤列表
     handleFilter() {
       this.listQuery.page = 1

src/views/admin/supplier/index.vue

@@ -60,7 +60,7 @@
       <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}">
-          <el-button size="mini" type="primary" @click="$_navigationTo(`supplier-edit?id=${row.authUserId}&type=edit`)">
+          <el-button v-permission="['admin']" size="mini" type="primary" @click="$_navigationTo(`supplier-edit?id=${row.authUserId}&type=edit`)">
             编辑
           </el-button>
           <el-button size="mini" type="primary" @click="handleProxy(row)">
@@ -89,9 +89,12 @@ import { resetPassword } from '@/api/user'
 import { fetchBrandList } from '@/api/brand'
 import { formatDate } from '@/utils'
 
+import permission from '@/directive/permission/index.js' // 权限判断指令
+
 export default {
   name: 'ComplexTable',
   components: { Pagination },
+  directives: { permission },
   filters: {
     formatTime(time) {
       if (!time) {

src/views/error-page/401.vue → src/views/common/error-page/401.vue

@@ -14,7 +14,7 @@
         <ul class="list-unstyled">
           <li>或者你可以去:</li>
           <li class="link-type">
-            <router-link to="/dashboard">
+            <router-link to="/">
               回首页
             </router-link>
           </li>

src/views/error-page/404.vue → src/views/common/error-page/404.vue

@@ -8,13 +8,10 @@
         <img class="pic-404__child right" src="@/assets/404_images/404_cloud.png" alt="404">
       </div>
       <div class="bullshit">
-        <div class="bullshit__oops">NO RIGHTS!</div>
-        <!-- <div class="bullshit__info">All rights reserved
-          <a style="color:#20a0ff" href="https://wallstreetcn.com" target="_blank">wallstreetcn</a>
-        </div> -->
+        <div class="bullshit__oops">NOT FOUND</div>
         <div class="bullshit__headline">{{ message }}</div>
         <div class="bullshit__info">Please check that the URL you entered is correct, or click the button below to return to the homepage.</div>
-        <a href="javascript:void(0)" class="bullshit__return-home" @click="$_back()">返回首页</a>
+        <a href="/" class="bullshit__return-home">返回首页</a>
       </div>
     </div>
   </div>

src/views/proxy/index.vue → src/views/common/proxy/index.vue

@@ -9,7 +9,6 @@ export default {
   },
   created() {
     const path = this.proxyState ? '/club' : '/supplier'
-    console.log(this.$store.getters)
     this.$router.push(path)
   }
 }

src/views/password/index.vue

@@ -1,102 +0,0 @@
-<template>
-  <div>
-    <el-form ref="form" :model="formData" :rules="formRules" label-width="80px" class="form">
-      <el-form-item label="旧密码" prop="oldPassword">
-        <el-input v-model="formData.oldPassword" type="password" placeholder="请输入旧密码" />
-      </el-form-item>
-      <el-form-item label="新密码" prop="newPassword">
-        <el-input v-model="formData.newPassword" type="password" placeholder="请输入新密码" />
-      </el-form-item>
-      <el-form-item label="确认密码" prop="confirmPwd">
-        <el-input v-model="formData.confirmPwd" type="password" placeholder="请再次输入密码" />
-      </el-form-item>
-      <el-form-item>
-        <el-button type="primary" @click="submit()">确认</el-button>
-        <el-button type="warning" @click="$_back()">返回</el-button>
-      </el-form-item>
-    </el-form>
-  </div>
-</template>
-
-<script>
-import { modifyPassword } from '@/api/user'
-import { validPassword } from '@/utils/validate'
-export default {
-  data() {
-    var confirmPassword = (rule, value, callback) => {
-      if (value === '') {
-        callback(new Error('请再次输入密码'))
-      } else if (value !== this.formData.newPassword) {
-        callback(new Error('两次输入密码不一致!'))
-      } else {
-        callback()
-      }
-    }
-    var validPwd = (rule, value, callback) => {
-      if (this.formData.oldPassword === value) {
-        callback(new Error('新密码与旧密码相同'))
-      } else if (!validPassword(value)) {
-        callback(new Error('请输入字母与数字组合的8-12位密码'))
-      } else {
-        callback()
-      }
-    }
-    return {
-      formData: {
-        oldPassword: '',
-        newPassword: '',
-        confirmPwd: ''
-      },
-      formRules: {
-        oldPassword: [
-          { required: true, message: '请输入原来的密码', trigger: 'blur' }
-        ],
-        newPassword: [
-          { required: true, trigger: ['change', 'blur'], validator: validPwd }
-        ],
-        confirmPwd: [
-          { required: true, message: '请再次输入密码' },
-          { validator: confirmPassword, trigger: 'change' }
-        ]
-      }
-    }
-  },
-  methods: {
-    submit() {
-      const that = this
-      this.$refs.form.validate(valide => {
-        if (!valide) return
-        const authUserId = this.$store.getters.authUserId
-        modifyPassword({ authUserId, ...that.formData }).then(res => {
-          if (res.code === 0) {
-            this.$refs.form.resetFields()
-            this.$message.success('密码修改成功,请重新登录')
-            this.logout()
-          }
-        }).catch(err => {
-          console.log(err)
-        })
-      })
-    },
-    async logout() {
-      setTimeout(() => {
-        // 退出登录重置用户信息
-        this.$store.dispatch('user/logout')
-        // 重置相关state
-        this.$store.dispatch('resetState')
-        this.$router.replace('/login')
-      }, 500)
-    }
-  }
-}
-</script>
-
-<style lang="scss" scoped>
-  .form{
-    width: 600px;
-    margin: 80px auto;
-    .el-button{
-      width: 120px;
-    }
-  }
-</style>