Vue_New/src/xt_pages/role/components/UserManagement.vue

<template>
  <div>
  <el-dialog class="userDialog" title="用户管理" width="660px" :visible.sync="visible">
    <div class="userManagement">
      <el-table
        v-loading="loading"
        :row-style="{ color: '#303133' }"
        :header-cell-style="{
          backgroundColor: 'rgb(245, 247, 250)',
          color: '#606266'
        }"
        style="width:100%;"
        ref="table"
        border
        :data="admin_user"
      >
        <el-table-column prop="name" label="员工姓名" width="120">
          <template slot-scope="scope">
            {{scope.row.user_name}}
          </template>
        </el-table-column>
        <!--<el-table-column prop="date" label="登录账号" width="120">-->
          <!--<template slot-scope="scope">-->
            <!--{{}}-->
          <!--</template>-->
        <!--</el-table-column>-->
        <el-table-column prop="date" label="最后登录时间" width="180">
          <template slot-scope="scope">
             <span>{{
              scope.row.last_login_time == 0
                ? ""
                : _parseTime(scope.row.last_login_time, "{y}-{m}-{d} {h}:{i}")
            }}</span>
          </template>

        </el-table-column>
        <el-table-column label="操作" >
          <template slot-scope="scope" style="text-align: center">
            <el-tooltip class="item" effect="dark" content="编辑" placement="top">
              <el-button  type="primary" icon="el-icon-edit-outline" size="small"
                         v-if="org.creator != scope.row.user_id && (scope.row.user_id != local_user_id) && !scope.row.is_sub_super_admin"
                         @click="openForm(scope.row.user_id, role_id)" ></el-button>
            </el-tooltip>

            <el-tooltip
              class="item"
              effect="dark"
              content="移除"
              placement="top"
            >
              <el-button
                type="danger"
                size="small"
                icon="el-icon-delete"
                v-if="scope.row.status == 1 && org.creator != scope.row.user_id && (scope.row.user_id != local_user_id) && !scope.row.is_sub_super_admin"
                @click="disableAdminAction(scope.row)"
              ></el-button>
            </el-tooltip>

            <el-tooltip
              class="item"
              effect="dark"
              content="恢复"
              placement="top"
            >
              <el-button
                size="small"
                type="info"
                icon="el-icon-refresh"
                v-if="scope.row.status == 0 && org.creator != scope.row.user_id  && (scope.row.user_id != local_user_id ) && !scope.row.is_sub_super_admin"
                @click="recoverAdminAction(scope.row)"
              ></el-button>
            </el-tooltip>

          </template>
        </el-table-column>
      </el-table>
    </div>
  </el-dialog>
  <!--<admin-info-form ref="admininfoform"></admin-info-form>-->
    <admin-role-info-form ref="admininfoform"  @did-edit-admin="didModifyAdmin"></admin-role-info-form>
  </div>
</template>


<script>
  import { getRoleStaff } from '@/api/role/role'
  import { parseTime } from "@/utils";
  import { setAdminStatus } from "@/api/role/admin";
  // import AdminInfoForm from './AdminInfoForm'
  import AdminRoleInfoForm from './AdminRoleInfoForm'

  export default {
    components: { AdminRoleInfoForm },
    data() {
      return {
        visible: false,
        role_id: 0,
        admin_user: [],
        local_user_id: 0,
        org:null,
        loading:false,

      }
    },
    methods: {
      didModifyAdmin(){
        this.GetAllStaff()
        this.$refs["admininfoform"].close();

      },
      openForm(adminId,role_id) {
        this.$refs["admininfoform"].open(adminId,role_id);
      },
      disableAdminAction: function(row) {
        this.$msgbox({
          title: "提示",
          message: "是否确定要移除该用户",
          showCancelButton: true,
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          type: "warning",
          beforeClose: (action, instance, done) => {
            if (action === "confirm") {
              instance.confirmButtonLoading = true;
              instance.confirmButtonText = "删除中...";

              setAdminStatus(row.user_id, false)
                .then(rs => {
                  done();
                  instance.confirmButtonLoading = false;

                  const resp = rs.data;
                  if (resp.state === 1) {
                    row.status = 0;
                  } else {
                    this.$message.error(resp.msg);
                  }
                })
                .catch(err => {
                  done();
                  instance.confirmButtonLoading = false;
                  this.$message.error(err);
                });
            } else {
              done();
            }
          }
        });
      },
      recoverAdminAction: function(row) {
        const loading = this.$loading({
          lock: true,
          text: "正在恢复管理员...",
          spinner: "el-icon-loading",
          background: "rgba(0, 0, 0, 0.7)"
        });

        setAdminStatus(row.user_id, true)
          .then(rs => {
            loading.close();

            const resp = rs.data;
            if (resp.state === 1) {
              row.status = 1;
            } else {
              this.$message.error(resp.msg);
            }
          })
          .catch(err => {
            loading.close();
            this.$message.error(err);
          });
      },
      _parseTime(time, format) {
        return parseTime(time, format);
      },
      GetAllStaff: function() {
        this.loading = true

        getRoleStaff().then(response => {
          this.loading = false

          if (response.data.state === 1) {
            this.admin_user = response.data.data.admins
            this.org = response.data.data.org

            for (let i = 0; i < this.admin_user.length; i++) {
              if (this.admin_user[i].role_ids.length > 0) {
                let isExist = -1
                let ids = this.admin_user[i].role_ids.split(',')
                isExist = ids.indexOf(this.role_id.toString())
                if (isExist < 0) {
                  this.admin_user.splice(i, 1)
                  i = i - 1
                }
              }
            }
          } else {

            this.$toast({
              message: response.data.msg
            })
          }
        }).catch(err => {
          this.loading = false
          this.$message.error(err)
        })
      },

      show(role_id) {
        this.visible = true
        this.role_id = role_id
        this.admin_user = []
        this.local_user_id = this.$store.getters.xt_user.user.id
        this.local_user_id = 597
        this.GetAllStaff()
      }
    }
  }
</script>

<style lang="scss" scoped>
  .userManagement {

  .cell {
    text-align: center;
  }

  }
</style>


<style lang="scss">
  .userManagement {

  .cell {
    text-align: center;
  }

  }
</style>