<template>
  <Dialog
    :title="title"
    class="tableClass"
    :show.sync="visible"
    :width="'715px'"
    @close="close()"
  >
    <template slot="content">
      <lb-table
        ref="multipleTable"
        :pagination="false"
        :column="tableData.column"
        :data="tableData.data"
        @selection-change="handleSelectionChange"
      >
      </lb-table>
    </template>
    <template slot="footer">
      <el-button type="primary" class="save" @click="handleSaveMember()"
        >保存</el-button
      >
      <el-button class="cancel-button" @click="close()">取消</el-button>
    </template>
  </Dialog>
</template>

<script>
import Dialog from "@/components/Dialog/";
import { updateUser } from "@/api/quanxianmanagement";
export default {
  name: "",
  components: { Dialog },
  data() {
    return {
      title: "人员配置",
      visible: false,
      hasSelectList: [
        // {
        //   name: "管理员",
        //   loginName: "admin1",
        //   departmentName: "研发部",
        //   jobLevel: null,
        // },
        // {
        //   name: "测试账号",
        //   loginName: "admin2",
        //   departmentName: "研发部",
        //   jobLevel: null,
        // },
      ], //已经选择的id组成的数组
      tableData: {
        column: [
          {
            type: "selection",
          },
          {
            prop: "name",
            label: "姓名",
          },
          {
            prop: "loginName",
            label: "用户名",
          },
          {
            prop: "departmentName",
            label: "部门",
          },
          {
            prop: "jobLevel",
            label: "职务",
          },
        ],
        data: [],
        // 角色id
        roleId: "",
      },
      multipleSelection: [],
    };
  },
  computed: {},

  created() {},
  mounted() {},
  methods: {
    // 人员配置根据selectStatus字段确定已选人员
    adds(a, rid) {
      this.roleId = rid;
      this.visible = true;
      this.tableData.data = a;
      this.tableData.data.forEach((item, index) => {
        if (item.selectStatus === 0) {
          this.$nextTick(() => {
            this.$refs.multipleTable.toggleRowSelection(
              this.tableData.data[index],
              true
            );
          });
        }
      });
    },
    close() {
      this.visible = false;
    },
    // 保存
    handleSaveMember() {
      const idList = this.multipleSelection.map((item) => {
        return item.id;
      });
      updateUser(this.roleId, idList).then((res) => {
        if (res.status === 1) {
          this.$message.success({ message: "保存成功", showClose: true });
          this.visible = false;
          // this.$emit("setUsers", this.roleId);
          // this.resetMemberConfig();
        } else this.$message.error({ message: res.message, showClose: true });
      });
    },
    handleSelectionChange(val) {
      this.multipleSelection = val;
    },
  },
};
</script>
<style scoped lang="scss">
/deep/.el-dialog__header {
  text-align: center;
  margin-bottom: 10px;
  .el-dialog__title {
    color: white;
  }
}
</style>