boss/pages/main/index/admin_user.vue

<template>
  <div>

    <el-button type="primary" @click="addGroup()" style="margin-top: 15px;margin-right: 30px;float: left">添加用户</el-button>
    <div style="clear: both;"></div>
    <div style="margin-bottom: 15px"></div>
    <div>
      <el-table :data="list" border style="width: 100%"  v-loading="loading">
        <el-table-column prop="uid" label="用户UID" width="220px"></el-table-column>
        <el-table-column prop="group_name" label="所属角色" width="220px"></el-table-column>
        <el-table-column prop="uid" label="操作" width="320px">
          <template slot-scope="scope">
            <el-button type="text" @click="delData(scope.row)">删除用户</el-button>
            <el-button type="text" @click="editGroup(scope.row)">编辑用户</el-button>
          </template>
        </el-table-column>
      </el-table>
    </div>

    <el-dialog title="用户管理" :visible.sync="addDialog" width="400px">
      <el-form :model="add_form"  label-width="70px">
        <el-form-item label="用户角色">
          <el-select v-model="groupValue" clearable placeholder="请选择">
            <el-option
              v-for="item in groupData"
              :key="item.id"
              :label="item.name"
              :value="item.id">
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="用户UID">
          <el-input v-model="add_form.uid" autocomplete="off"></el-input>
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button size="medium" @click="addDialog = false">取消</el-button>
        <el-button size="medium" type="primary" @click="formAdd">确定</el-button>
      </div>
    </el-dialog>

  </div>
</template>
<script src="./js/admin_user.js"></script>
<style scoped>
.count-list {
  padding-bottom: 10px;
  display: flex;
  align-items: center;
}
/deep/ .mall_list .el-dialog {
  margin: 5vh auto !important;
}

/deep/ .mall_list .el-dialog__body {
  height: 70vh;
  overflow: auto;
}

/deep/ .el-dialog{
  display: flex;
  flex-direction: column;
  margin:0 !important;
  position:absolute;
  top:50%;
  left:50%;
  transform:translate(-50%,-50%);
}

h3 {
  margin: 20px 0 20px;
}
</style>