增加二级路由渲染和跳转,驾驶员列表移到系统管理下、新增用户管理模块和删除二次确认弹窗组件
2个文件已修改
2 文件已重命名
8个文件已添加
859 ■■■■■ 已修改文件
src/assets/notice@2x.png 补丁 | 查看 | 原始文档 | blame | 历史
src/components/ShowDelConfirm/index.vue 108 ●●●●● 补丁 | 查看 | 原始文档 | blame | 历史
src/layouts/index.vue 38 ●●●● 补丁 | 查看 | 原始文档 | blame | 历史
src/router/router.js 38 ●●●●● 补丁 | 查看 | 原始文档 | blame | 历史
src/view/systemManage/driver/component/detailModal.vue 补丁 | 查看 | 原始文档 | blame | 历史
src/view/systemManage/driver/index.vue 补丁 | 查看 | 原始文档 | blame | 历史
src/view/systemManage/user/components/addEdit.vue 111 ●●●●● 补丁 | 查看 | 原始文档 | blame | 历史
src/view/systemManage/user/components/disb.vue 69 ●●●●● 补丁 | 查看 | 原始文档 | blame | 历史
src/view/systemManage/user/components/resetPassWord.vue 84 ●●●●● 补丁 | 查看 | 原始文档 | blame | 历史
src/view/systemManage/user/components/viewData.vue 49 ●●●●● 补丁 | 查看 | 原始文档 | blame | 历史
src/view/systemManage/user/index.vue 326 ●●●●● 补丁 | 查看 | 原始文档 | blame | 历史
src/view/systemManage/user/service.js 36 ●●●●● 补丁 | 查看 | 原始文档 | blame | 历史
src/assets/notice@2x.png
src/components/ShowDelConfirm/index.vue
New file
@@ -0,0 +1,108 @@
<template>
  <div>
    <el-dialog top="40vh" :visible.sync="show" :show-close="false" :append-to-body="true" :close-on-click-modal="false"
      width="433px">
      <div class="top-con a-center" slot="title">
        <div class="left">
          <img src="@/assets/notice@2x.png" style="width: 24px;height: 24px;margin-right: 14px;" />
          <div class="title">{{ title }}</div>
        </div>
      </div>
      <div class="lh--32 fs--20">
        {{ tip }}
      </div>
      <span slot="footer" class="dialog-footer">
        <el-button @click="$emit('close')">取消</el-button>
        <el-button :type="btnType" @click="$emit('confirm')">{{ okText }}</el-button>
      </span>
    </el-dialog>
  </div>
</template>
<script>
export default {
  components: {},
  props: {
    show: {
      type: Boolean,
      default: false,
    },
    title: {
      type: String,
      default: '确认要删除这条信息吗?',
    },
    tip: {
      type: String,
      default: '删除后信息将无法找回',
    },
    okText: {
      type: String,
      default: '确认',
    },
    btnType: {
      type: String,
      default: 'danger',
    }
  },
  data() {
    return {};
  },
  computed: {},
  watch: {},
  created() { },
  mounted() { },
  methods: {},
};
</script>
<style scoped lang="less">
.left {
  display: flex;
}
::v-deep .el-dialog {
  border-radius: 12px;
  .el-dialog__header {
    padding-top: 28px;
    padding-right: 27px;
    padding-left: 34px;
    padding-bottom: 11px;
  }
  .el-dialog__body {
    border-top: unset;
    padding: unset;
    padding-left: 73px;
    padding-right: 20px;
  }
  .el-dialog__footer {
    border-top: unset;
    padding-top: 18px;
    padding-right: 27px;
    padding-bottom: 29px;
  }
}
.bgcolor1 {
  background: rgba(22, 119, 255, 1);
}
.top-con {
  display: flex;
  justify-content: space-between;
  .title {
    font-family: PingFangSC, PingFang SC;
    font-weight: 600;
    font-size: 16px;
    color: rgba(0, 0, 0, 1);
    margin-bottom: 13px;
  }
}
.dialog-footer {
  display: flex;
  justify-content: flex-end;
}
</style>
src/layouts/index.vue
@@ -23,13 +23,32 @@
        </div>
        <div class="menu w100 bgColor1">
            <div v-for="(item, index) in routesList" :key="index" class="flex a-center h100">
                <div v-for="(item2, index2) in item.children" :key="index2" class="h100">
                    <div @click="$router.push(item2.path)" v-if="!item2.meta.hide"
                        class="flex a-center j-center h100 w--160 menuItemHover pointer"
                        :class="item2.path == $route.path && 'bgColor2'">
                        <img v-if="item2.meta.icon" :src="require(`@/assets/routerIcon/${item2.meta.icon}.png`)"
                <div v-if="!item.meta || !item.meta.title" class="h100">
                    <div v-for="(item2, index2) in item.children" :key="index2" class="h100">
                        <div @click="$router.push(item2.path)" v-if="!item2.meta.hide"
                            class="flex a-center j-center h100 w--160 menuItemHover pointer"
                            :class="item2.path == $route.path && 'bgColor2'">
                            <img v-if="item2.meta.icon" :src="require(`@/assets/routerIcon/${item2.meta.icon}.png`)"
                                class="w--15 h--15 mr--12 shrink0" />
                            <div class="color1">
                                {{ item2.meta.title }}
                            </div>
                        </div>
                    </div>
                </div>
                <div v-else :class="$route.path.includes('systemManage') && 'bgColor2'"
                    class="h100 w--160 menuItemHover dropdown" @mouseenter="routerDropdown(true)"
                    @mouseleave="routerDropdown(false)">
                    <div class="flex a-center j-center h100">
                        <img :src="require(`@/assets/routerIcon/${item.meta.icon}.png`)"
                            class="w--15 h--15 mr--12 shrink0" />
                        <div class="color1">
                            {{ item.meta.title }}
                        </div>
                    </div>
                    <div v-if="routerIsOpen" class="dropdown-menu positionTwo">
                        <div @click="$router.push(item.path + '/' + item2.path), routerIsOpen = false"
                            class="dropdown-item flex a-center" v-for="(item2, index2) in item.children" :key="index2">
                            {{ item2.meta.title }}
                        </div>
                    </div>
@@ -47,6 +66,7 @@
        return {
            routesList: routes,
            isOpen: false,
            routerIsOpen: false,
            menuItems: [
                { text: '密码设置' },
                { text: '退出登录' },
@@ -58,6 +78,9 @@
    methods: {
        toggleDropdown(state) {
            this.isOpen = state;
        },
        routerDropdown(state) {
            this.routerIsOpen = state;
        }
    }
}
@@ -124,6 +147,11 @@
    cursor: pointer;
}
.positionTwo {
    transform: unset !important;
    width: 160px !important;
}
.dropdown-menu {
    position: absolute;
    top: 100%;
src/router/router.js
@@ -47,20 +47,6 @@
        ]
    },
    {
        path: '/driver',
        component: Layout,
        children: [
            {
                path: '/driver',
                component: () => import('@/view/driver'),
                meta: {
                    title: '驾驶员管理',
                    icon: 'driver'
                }
            }
        ]
    },
    {
        path: '/car',
        component: Layout,
        children: [
@@ -124,6 +110,30 @@
                }
            }
        ]
    },
    {
        path: '/systemManage',
        meta: {
            title: "系统管理",
            icon: 'sys',
        },
        component: Layout,
        children: [
            {
                path: 'driver',
                component: () => import('@/view/systemManage/driver'),
                meta: {
                    title: '驾驶员列表',
                }
            },
            {
                path: 'user',
                component: () => import('@/view/systemManage/user'),
                meta: {
                    title: '用户管理',
                }
            },
        ]
    }
]
src/view/systemManage/driver/component/detailModal.vue
src/view/systemManage/driver/index.vue
src/view/systemManage/user/components/addEdit.vue
New file
@@ -0,0 +1,111 @@
<template>
    <div>
        <el-dialog :visible.sync="dialogVisible" @close="$emit('close')" :title="row.deptId ? '编辑人员' : '添加人员'"
            width="30%">
            <el-form ref="form" :model="form" :rules="rules" label-width="80px">
                <el-form-item label="姓名" prop="nickName">
                    <el-input v-model="form.nickName" placeholder="请输入" style="width: 50%;"></el-input>
                </el-form-item>
                <el-form-item label="联系电话" prop="phonenumber">
                    <el-input v-model="form.phonenumber" placeholder="请输入" style="width: 50%;"></el-input>
                </el-form-item>
                <el-form-item label="登陆账号" prop="userName">
                    <el-input v-model="form.userName" :disabled="form.userId" placeholder="请输入"
                        style="width: 50%;"></el-input>
                </el-form-item>
                <el-form-item label="所属部门" prop="deptId">
                    <el-select v-model="form.deptId" placeholder="请选择">
                        <el-option v-for="item in deptList" :key="item.deptId" :label="item.deptName"
                            :value="item.deptId">
                        </el-option>
                    </el-select>
                </el-form-item>
                <el-form-item label="角色" prop="roleId">
                    <el-select v-model="form.roleId" placeholder="请选择">
                        <el-option v-for="item in roleList" :key="item.roleId" :label="item.roleName"
                            :value="item.roleId">
                        </el-option>
                    </el-select>
                </el-form-item>
                <el-form-item label="登录状态" prop="status">
                    <el-switch v-model="form.status"></el-switch>
                </el-form-item>
                <el-form-item label="备注" prop="remark">
                    <el-input type="textarea" v-model="form.remark" placeholder="请输入" style="width: 50%;"></el-input>
                </el-form-item>
            </el-form>
            <div slot="footer">
                <el-button @click="$emit('close')">关闭</el-button>
                <el-button type="primary" @click="submit">保存</el-button>
            </div>
        </el-dialog>
    </div>
</template>
<script>
export default {
    props: {
        dialogVisible: {
            type: Boolean,
            default: false
        },
        row: {
            type: Object,
            default: () => { }
        },
        deptList: {
            type: Array,
            default: () => []
        },
        roleList: {
            type: Array,
            default: () => []
        }
    },
    data() {
        return {
            form: { status: true },
            rules: {
                nickName: [{ required: true, message: '请输入姓名', trigger: 'blur' }],
                phonenumber: [{ required: true, message: '请输入联系电话', trigger: 'blur' }],
                deptId: [{ required: true, message: '请选择所属部门', trigger: 'blur' }],
                roleId: [{ required: true, message: '请选择角色', trigger: 'blur' }],
                userName: [{ required: true, message: '请输入登陆账号', trigger: 'blur' }],
            }
        };
    },
    created() {
        this.form = { status: true }
        if (Object.keys(this.row).length) {
            this.form = {
                userId: this.row.userId,
                nickName: this.row.nickName,
                phonenumber: this.row.phonenumber,
                deptId: this.row.deptId,
                roleId: this.row.roleId,
                userName: this.row.userName,
                remark: this.row.remark,
                status: this.row.status == 0 ? true : false,
            }
        } else {
            this.form = {}
        }
    },
    mounted() { },
    methods: {
        submit() {
            this.$refs['form'].validate((valid) => {
                if (valid) {
                    let obj = {
                        ...this.form,
                        status: this.form.status ? 0 : 1
                    }
                    this.$emit('confirm', obj)
                }
            })
        }
    },
};
</script>
<style scoped></style>
src/view/systemManage/user/components/disb.vue
New file
@@ -0,0 +1,69 @@
<template>
    <div>
        <el-dialog :visible.sync="dialogVisible" @close="$emit('close')" title="禁用人员" width="30%">
            <el-form ref="form" :model="form" label-width="80px">
                <el-form-item label="姓名" prop="nickName">
                    {{ form.nickName }}
                </el-form-item>
                <el-form-item label="登陆账号" prop="userName">
                    {{ form.userName }}
                </el-form-item>
                <el-form-item label="禁用备注" prop="disableRemark">
                    <el-input type="textarea" v-model="form.disableRemark" placeholder="请输入备注"></el-input>
                </el-form-item>
            </el-form>
            <div slot="footer">
                <el-button @click="$emit('close')">关闭</el-button>
                <el-button type="primary" @click="submit">确定</el-button>
            </div>
        </el-dialog>
    </div>
</template>
<script>
export default {
    props: {
        dialogVisible: {
            type: Boolean,
            default: false
        },
        row: {
            type: Object,
            default: () => { }
        }
    },
    data() {
        return {
            form: { status: false },
        };
    },
    created() {
        this.form = { status: false }
        if (Object.keys(this.row).length) {
            this.form = {
                ...this.row,
                userId: this.row.userId,
                nickName: this.row.nickName,
                userName: this.row.userName,
                status: 1,
                disableRemark: this.row.disableRemark
            }
        }
    },
    mounted() { },
    methods: {
        submit() {
            this.$refs['form'].validate((valid) => {
                if (valid) {
                    this.form.deptId = this.row.deptId
                    this.form.orderNum = 0
                    this.form.ancestors = 0
                    this.form.parentId = 100
                    this.$emit('confirm', this.form)
                }
            })
        }
    },
};
</script>
<style scoped></style>
src/view/systemManage/user/components/resetPassWord.vue
New file
@@ -0,0 +1,84 @@
<template>
    <div>
        <el-dialog :visible.sync="dialogVisible" @close="$emit('close')" title="重置密码"
            width="30%">
            <el-form ref="form" :model="form" :rules="rules" label-width="80px">
                <el-form-item label="姓名" prop="nickName">
                    <el-input :disabled="true" v-model="form.nickName" placeholder="请输入" style="width: 50%;"></el-input>
                </el-form-item>
                <el-form-item label="登陆账号" prop="account">
                    <el-input :disabled="true" v-model="form.account" placeholder="请输入" style="width: 50%;"></el-input>
                </el-form-item>
                <el-form-item label="新密码" prop="password">
                    <el-input v-model="form.password" placeholder="请输入" style="width: 50%;"></el-input>
                </el-form-item>
                <el-form-item label="确认密码" prop="confirmPassword">
                    <el-input v-model="form.confirmPassword" placeholder="请输入" style="width: 50%;"></el-input>
                </el-form-item>
            </el-form>
            <div slot="footer">
                <el-button @click="$emit('close')">关闭</el-button>
                <el-button type="primary" @click="submit">保存</el-button>
            </div>
        </el-dialog>
    </div>
</template>
<script>
export default {
    props: {
        dialogVisible: {
            type: Boolean,
            default: false
        },
        row: {
            type: Object,
            default: () => { }
        }
    },
    data() {
        return {
            form: { status: true },
            rules: {
                password: [{ required: true, message: '请新密码', trigger: 'blur' }],
                confirmPassword: [{ required: true, message: '请确认密码', trigger: 'blur' },{
                    validator: (rule, value, callback) => {
                        if (value !== this.form.password) {
                            callback(new Error('两次输入密码不一致!'));
                        } else {
                            callback();
                        }
                }}],
            }
        };
    },
    created() {
        this.form = { status: true }
        if (Object.keys(this.row).length) {
            this.form = {
                userId: this.row.userId,
                nickName: this.row.nickName,
                account: this.row.userName,
            }
        }
    },
    mounted() { },
    methods: {
        submit() {
            this.$refs['form'].validate((valid) => {
                if (valid) {
                    if (this.row.deptId) {
                        this.form.deptId = this.row.deptId
                    }
                    this.form.orderNum = 0
                    this.form.ancestors = 0
                    this.form.parentId = 100
                    this.$emit('confirm', this.form)
                }
            })
        }
    },
};
</script>
<style scoped></style>
src/view/systemManage/user/components/viewData.vue
New file
@@ -0,0 +1,49 @@
<template>
    <div>
        <el-dialog :visible.sync="dialogVisible" @close="$emit('close')" title="禁用信息" width="30%">
            <el-form ref="form" label-width="80px">
                <el-form-item label="禁用原因" prop="disableRemark">
                    {{form.disableRemark}}
                </el-form-item>
                <el-form-item label="操作时间" prop="updateTime">
                    {{form.updateTime}}
                </el-form-item>
                <el-form-item label="操作人" prop="updateBy">
                    {{form.updateName }}
                </el-form-item>
            </el-form>
            <div slot="footer">
                <el-button @click="$emit('close')">关闭</el-button>
            </div>
        </el-dialog>
    </div>
</template>
<script>
export default {
    props: {
        dialogVisible: {
            type: Boolean,
            default: false
        },
        row: {
            type: Object,
            default: () => { }
        }
    },
    data() {
        return {
            form: {},
        };
    },
    created() {
        if (Object.keys(this.row).length) {
            this.form = {...this.row}
        }
    },
    mounted() { },
    methods: {
    },
};
</script>
<style scoped></style>
src/view/systemManage/user/index.vue
New file
@@ -0,0 +1,326 @@
<template>
  <div>
    <el-card>
      <el-form :inline="true" class="demo-form-inline">
        <div style="display: flex;justify-content: space-between;">
          <el-form-item label="人员搜索">
            <el-input v-model="nickNameOrPhone" placeholder="请输入姓名/联系电话"></el-input>
          </el-form-item>
          <el-form-item label="所属部门">
            <el-select v-model="deptId" placeholder="请选择(多选)" multiple>
              <el-option v-for="item in deptList" :key="item.deptId" :label="item.deptName" :value="item.deptId">
              </el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="人员角色">
            <el-select v-model="roleId" placeholder="请选择(多选)" multiple>
              <el-option v-for="item in roleList" :key="item.roleId" :label="item.roleName" :value="item.roleId">
              </el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="登陆状态">
            <el-select v-model="status" placeholder="请选择(多选)">
              <el-option
                v-for="item in [{ label: '全部', value: '' }, { label: '启用', value: 0 }, { label: '禁用', value: 1 }]"
                :key="item.value" :label="item.label" :value="item.value">
              </el-option>
            </el-select>
          </el-form-item>
        </div>
        <div style="text-align: right;">
          <el-form-item>
            <el-button @click="reset">重置</el-button>
            <el-button type="primary" @click="onSubmit">查询</el-button>
          </el-form-item>
        </div>
      </el-form>
    </el-card>
    <el-card style="margin-top: 20px;">
      <div class="add_btn">
        <el-button @click="dialogVisible = true" type="primary">添加人员</el-button>
      </div>
      <el-table border stripe :data="data">
        <el-table-column label="序号" type="index" width="50">
        </el-table-column>
        <el-table-column prop="nickName" label="姓名"></el-table-column>
        <el-table-column prop="phonenumber" label="联系电话">
        </el-table-column>
        <el-table-column prop="deptName" label="所属部门">
          <!-- <template slot-scope="{row}">
            <div>{{ row.children.length }}</div>
          </template> -->
        </el-table-column>
        <el-table-column prop="roleName" label="角色">
          <!-- <template slot-scope="{row}">
            <div>{{ row.children.length }}</div>
          </template> -->
        </el-table-column>
        <el-table-column prop="userName" label="登陆账号">
        </el-table-column>
        <el-table-column prop="remark" label="备注">
        </el-table-column>
        <el-table-column prop="status" label="登录状态">
          <template slot-scope="{row}">
            <div class="status_class">
              <div :class="row.status == 0 ? 'green' : 'red'"></div>
              <div>{{ row.status == 0 ? '正常' : '停用' }}</div>
              <div v-if="row.status == 1" style="cursor: pointer;" @click="dialogVisibleView = true, rowView = row">
                <i class="el-icon-warning"></i>
              </div>
            </div>
          </template>
        </el-table-column>
        <el-table-column prop="createTime" label="创建时间"></el-table-column>
        <el-table-column label="操作" width="300">
          <template slot-scope="{row}">
            <div>
              <el-button type="text" @click="edit(row)">编辑</el-button>
              <el-button v-if="row.status != 0" type="text" @click="updateStatus(row, true)">启用</el-button>
              <el-button v-if="row.status == 0" type="text" @click="updateStatus(row, false)">禁用</el-button>
              <el-button type="text" @click="detail(row)">重置密码</el-button>
              <el-button type="text" @click="del(row)">删除</el-button>
            </div>
          </template>
        </el-table-column>
      </el-table>
      <div class="pagination">
        <el-pagination layout="slot,sizes,prev,pager,next,jumper" :page-size="pagination.pageSize"
          :current-page="pagination.pageNum" @current-change="handleCurrentChange" @size-change="handleSizeChange"
          :total="pagination.total">
          <span>共{{ pagination.total }}条</span>
        </el-pagination>
      </div>
    </el-card>
    <AddEdit v-if="dialogVisible" :row="row" :deptList="deptList" :roleList="roleList" :dialogVisible="dialogVisible"
      @close="dialogVisible = false, row = {}" @confirm="confirm" />
    <ResetPassword v-if="passwordVisible" :row="row" :dialogVisible="passwordVisible"
      @close="passwordVisible = false, row = {}" @confirm="passwordConfirm" />
    <ViewData v-if="dialogVisibleView" :row="rowView" :dialogVisible="dialogVisibleView"
      @close="dialogVisibleView = false, rowView = {}" />
    <Disb v-if="disbDialogVisible" :row="disbRow" :dialogVisible="disbDialogVisible"
      @close="disbDialogVisible = false, disbRow = {}" @confirm="disbConfirm" />
    <ShowDelConfirm :show="delShow" @close="delShow = false" @confirm="delConfirm" title="确认要删除该人员吗?"
      tip="删除人员后,该人员不可登录。如非必要,系统建议您使用禁用功能。" okText="确定删除" />
  </div>
</template>
<script>
import { getList, add, edit, delDept, deptList, roleList, updatePwd } from './service'
import AddEdit from './components/addEdit.vue'
import ViewData from './components/viewData.vue'
import Disb from './components/disb.vue'
import ResetPassword from './components/resetPassWord.vue'
import ShowDelConfirm from '@/components/ShowDelConfirm'
export default {
  components: {
    AddEdit,
    ViewData,
    Disb,
    ResetPassword,
    ShowDelConfirm,
  },
  data() {
    return {
      dialogVisible: false,
      passwordVisible: false,
      dialogVisibleView: false,
      disbDialogVisible: false,
      delShow: false,
      data: [],
      nickNameOrPhone: '',
      deptId: [],
      roleId: [],
      status: '',
      roleList: [],
      deptList: [],
      pagination: {
        total: 10,
        pageNum: 1,
        pageSize: 10,
      },
      row: {},
      rowView: {},
      disbRow: {},
      delId: '',
    };
  },
  computed: {},
  watch: {},
  created() {
    // this.getRoleList()
    // this.getListData()
    // this.getdeptList()
  },
  mounted() { },
  methods: {
    getdeptList() {
      deptList({ status: 0 }).then((res) => {
        this.deptList = res
      })
    },
    getRoleList() {
      roleList().then((res) => {
        this.roleList = res
      })
    },
    delConfirm() {
      delDept(this.delId).then(() => {
        this.delShow = false
        this.disbRow = {}
        this.getListData()
        this.msgsuccess('删除成功')
      })
    },
    disbConfirm(form) {
      edit(form).then(() => {
        this.disbDialogVisible = false
        this.msgsuccess('禁用成功')
        this.getListData()
      })
    },
    confirm(form) {
      console.log('confirm confirmform form', form);
      if (form.userId) {
        edit(form).then(() => {
          this.row = {}
          this.dialogVisible = false
          this.msgsuccess('修改成功')
          this.getListData()
        })
      } else {
        add(form).then(() => {
          this.row = {}
          this.dialogVisible = false
          this.msgsuccess('添加成功')
          this.getListData()
        })
      }
    },
    passwordConfirm(form) {
      console.log('form form', form);
      updatePwd(form).then(() => {
        this.row = {}
        this.passwordVisible = false
        this.msgsuccess('修改密码成功')
        this.getListData()
      })
    },
    detail(row) {
      console.log('row row', row);
      this.passwordVisible = true
      this.row = row
      // this.$router.push(`/info/type?deptId=${row.deptId}`)
    },
    edit(row) {
      this.row = row
      this.dialogVisible = true
    },
    updateStatus(row, type) {
      console.log('row row', row, 'type', type);
      if (type == true) {
        edit({ ...row, status: 0 }).then(() => {
          this.msgsuccess('启用成功')
          this.getListData()
        })
      } else {
        this.disbRow = row
        this.disbDialogVisible = true
      }
    },
    del(row) {
      this.delShow = true
      this.delId = row.userId
    },
    getListData() {
      let obj = {
        ...this.pagination,
        nickNameOrPhone: this.nickNameOrPhone,
        deptId: this.deptId,
        roleIds: this.roleId,
        status: this.status,
      }
      getList(obj).then((res) => {
        this.pagination.total = res.total
        this.data = res.records
        console.log('data data', this.data);
      })
    },
    reset() {
      this.nickNameOrPhone = ''
      this.roleId = []
      this.deptId = []
      this.status = ''
      this.pagination.pageNum = 1
      this.getListData()
    },
    onSubmit() {
      this.pagination.pageNum = 1
      this.getListData()
    },
    handleCurrentChange(e) {
      this.pagination.pageNum = e;
      this.getListData()
    },
    handleSizeChange(e) {
      this.pagination.pageSize = e
      this.getListData()
    },
    // paginate(data, pageSize, currentPage) {
    //   if (data.length === 0) {
    //     return [];
    //   }
    //   const start = (currentPage - 1) * pageSize;
    //   const end = start + pageSize;
    //   return data.slice(start, end);
    // }
  },
};
</script>
<style lang="less" scoped>
.green {
  background-color: green;
}
.red {
  background-color: red;
}
.demo-form-inline {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}
.add_btn {
  display: flex;
  justify-content: flex-end;
  margin-bottom: 20px;
}
.pagination {
  display: flex;
  justify-content: flex-end;
  margin-top: 20px;
}
.status_class {
  display: flex;
  align-items: center;
  div:nth-child(1) {
    width: 9px;
    height: 9px;
    border-radius: 50%;
    margin-right: 5px;
  }
  div:nth-child(2) {
    margin-right: 8px;
  }
}
</style>
src/view/systemManage/user/service.js
New file
@@ -0,0 +1,36 @@
import axios from '@/utils/request';
// 列表
export const getList = (data) => {
    return axios.post('/system/user/list', { ...data })
}
// 添加
export const add = (data) => {
    return axios.post('/system/user/add', { ...data })
}
// 编辑
export const edit = (data) => {
    return axios.post('/system/user/edit', { ...data })
}
// 删除
export const delDept = (id) => {
    return axios.delete(`/system/user/deleteById/${id}`)
}
// 部门
export const deptList = (data) => {
    return axios.get(`/system/dept/list?status=${data.status}`,{...data})
}
export const roleList = () => {
    return axios.post(`/system/role/listNotPage`)
}
//
export const changeStatus = (data) => {
    return axios.put(`/system/user/changeStatus`,{...data})
}
export const updatePwd = (data) => {
    return axios.post(`/system/user/updatePwd`,{...data})
}