<template>
  <div class="testdiv">
    <div class="divborder newSearchDiv">
      <div class="filter">
        <label>{{ $t("100000") }}：</label>
        <Select
          v-model="department"
          label-in-value
          clearable
          class="searchSelect"
        >
          <Option
            v-for="item in departmentlist"
            :value="item.id"
            :key="item.id"
            >{{ item.title }}</Option
          >
        </Select>
      </div>
      <div class="searchBtn">
        <Button
          type="primary"
          class="twoWord"
          icon="ios-search"
          @click="search(1, 10)"
          >{{ $t("1001") }}</Button
        >
        <Button
          type="success"
          class="twoWord"
          icon="md-add-circle"
          @click="add()"
          >{{ $t("1002") }}</Button
        >
        <Button
          type="warning"
          class="twoWord"
          icon="ios-build"
          @click="edit()"
          >{{ $t("1003") }}</Button
        >
        <Button
          type="error"
          class="twoWord"
          icon="md-close-circle"
          @click="dele()"
          >{{ $t("1004") }}</Button
        >
      </div>
    </div>
    <div class="divborder newTableDiv">
      <Table
        class="tableClass"
        @on-current-change="handleRowChange"
        highlight-row
        :data="tableData1"
        :columns="tableColumns1"
      ></Table>
      <div class="pageDiv">
        <div class="pageDirection">
          <Page
            :total="total"
            :current="page"
            @on-change="changePage"
            show-elevator
            show-sizer
            show-total
            @on-page-size-change="handlePageSize"
            :page-size-opts="[10, 20, 30, 40, 100]"
          ></Page>
        </div>
      </div>
    </div>
    <Modal v-model="addmodel" :width="600" class="newModalClass">
      <p slot="header">
        <span v-show="type == 1">添加</span>
        <span v-show="type == 2">修改</span>
      </p>
      <div class="modal_body">
        <div class="filter">
          <label>
            <i>*</i>
            所属部门：
          </label>
          <Select
            v-model="addformValidate.department"
            clearable
            class="searchSelect"
            @on-change="getuserlist"
            v-show="type == 1"
          >
            <Option
              v-for="item in departmentlist"
              :value="item.id"
              :key="item.id"
              >{{ item.title }}</Option
            >
          </Select>
          <p style="display: inline-block" v-show="type == 2">
            {{ obj.epartment }}
          </p>
        </div>
        <div class="filter">
          <label>
            <i>*</i>
            人员姓名：
          </label>
          <Select
            v-model="addformValidate.people"
            label-in-value
            clearable
            class="searchSelect"
            v-show="type == 1"
          >
            <Option
              v-for="item in userlist"
              :value="item.mid"
              :key="item.mid"
              >{{ item.name }}</Option
            >
          </Select>
          <p style="display: inline-block" v-show="type == 2">
            {{ obj.name }}
          </p>
        </div>
        <div class="filter">
          <label>
            <i>*</i>
            权限分配：
          </label>
          <Checkbox class="powerCheckbox" v-model="add_power">
            创建权限
          </Checkbox>
          <Checkbox class="powerCheckbox" v-model="del_power">
            删除权限
          </Checkbox>
          <Checkbox class="powerCheckbox" v-model="check_power">
            审核权限
          </Checkbox>
          <Checkbox class="powerCheckbox" v-model="all_power">
            超级管理员
          </Checkbox>
        </div>
        <div class="filter" style="display: flex; margin-bottom: 30px">
          <label>备注：</label>
          <Input
            type="textarea"
            v-model="addformValidate.remark"
            class="searchInput MaxWidth"
            :autosize="{ minRows: 2, maxRows: 2 }"
          />
        </div>
      </div>
      <div slot="footer">
        <Button type="text" size="large" @click="addmodel = false">取消</Button>
        <Button type="primary" size="large" @click="adddata()">确定</Button>
      </div>
    </Modal>
  </div>
</template>
<script>
import axios from "@/libs/api.request";
export default {
  data() {
    return {
      department: "",
      departmentlist: [],
      userlist: [],
      tableData1: [],
      total: 0,
      page: 1,
      pagesize: 10,
      obj: {},
      addmodel: false,
      addloading: true,
      add_department: "",
      addformValidate: {
        department: "",
        people: "",
        Jurisdiction: [],
        remark: "",
      },
      add_power: false,
      del_power: false,
      check_power: false,
      all_power: false,
      type: 0,
      tableColumns1: [
        {
          type: "index2",
          title: "序号",
          key: "xuhao",
          render: (h, params) => {
            return h(
              "span",
              params.index + (this.page - 1) * this.pagesize + 1
            );
          },
          width: 60,
        },
        {
          title: "部门",
          key: "epartment",
        },
        {
          title: "姓名",
          key: "name",
        },
        {
          title: "工号",
          key: "Job_number",
        },
        {
          title: "创建权限",
          key: "create_power",
        },
        {
          title: "删除权限",
          key: "dele_power",
        },
        {
          title: "审核权限",
          key: "audit_power",
        },
        {
          title: "超级管理员",
          key: "super_power",
        },
        {
          title: "创建时间",
          key: "create_time",
        },
        {
          title: "创建人",
          key: "creater",
        },
        {
          title: "备注",
          key: "remark",
        },
      ],
    };
  },
  created() {
    this.getdepartmentlist();
    // this.getuserlist();
    this.search(1, 10);
    // 格式化表格样式
    this.tableColumns1 = this.$time.initTableTitle(this.tableColumns1);
  },
  methods: {
    getdepartmentlist() {
      axios
        .request({
          url: "/dnc/DncPgCreate/GetsectionLists",
          method: "get",
        })
        .then((res) => {
          this.departmentlist = res.data.data;
        });
    },
    getuserlist(value) {
      let section = 0;
      if (value) {
        section = value;
      } else {
        section = 0;
      }
      axios
        .request({
          url: "/dnc/DncPgCreate/GetUsers?sectionid=" + section,
          method: "get",
        })
        .then((res) => {
          this.userlist = res.data.data;
        });
    },
    search(page, pagesize) {
      var params = {
        sectionid: this.department,
        page: page,
        pagesize: pagesize,
      };
      axios
        .request({
          url: "/dnc/DncPgCreate/GetPowerLists",
          params,
          method: "get",
        })
        .then((res) => {
          if (res.data.ret === 1) {
            this.total = res.data.total;
            this.mockTableData1(res.data.data);
            this.page = res.data.page;
          } else {
            this.$Message.error("获取列表数据出错");
          }
        });
    },
    mockTableData1(tablelist) {
      let data = [];
      tablelist.forEach((item) => {
        if (item) {
          data.push({
            epartment: item.sectiontitle,
            name: item.powername,
            Job_number: item.work_code,
            create_power: item.add_power_str,
            add_power: item.add_power,
            del_power: item.del_power,
            check_power: item.check_power,
            all_power: item.all_power,
            dele_power: item.del_power_str,
            audit_power: item.check_power_str,
            super_power: item.all_power_str,
            create_time: item.create_time,
            creater: item.create_name,
            id: item.id,
            remark: item.remark,
          });
        }
      });
      this.tableData1 = data;
    },
    add() {
      this.addformValidate.department = "";
      this.addformValidate.people = "";
      this.addformValidate.remark = "";
      this.add_power = false;
      this.del_power = false;
      this.check_power = false;
      this.all_power = false;
      this.type = 1;
      this.addmodel = true;
    },
    adddata() {
      let data = {},
        url = "",
        msg = "";
      if (this.type == 1) {
        if (
          this.addformValidate.department == 0 ||
          this.addformValidate.department == undefined
        ) {
          this.$Message.error("请选择部门");
          return false;
        }
        if (
          this.addformValidate.people == 0 ||
          this.addformValidate.people == undefined
        ) {
          this.$Message.error("请选择人员");
          return false;
        }
        if (
          this.add_power == false &&
          this.del_power == false &&
          this.check_power == false &&
          this.all_power == false
        ) {
          this.$Message.error("请选择权限");
          return false;
        }
        data = {
          mid: this.addformValidate.people,
          add_power: this.add_power == true ? 1 : 0,
          del_power: this.del_power == true ? 1 : 0,
          check_power: this.check_power == true ? 1 : 0,
          all_power: this.all_power == true ? 1 : 0,
          remark: this.addformValidate.remark,
        };
        url = "/dnc/DncPgCreate/addPower";
        msg = "添加成功";
      }
      if (this.type == 2) {
        if (
          this.add_power == false &&
          this.del_power == false &&
          this.check_power == false &&
          this.all_power == false
        ) {
          this.$Message.error("请选择权限");
          return false;
        }
        data = {
          powerid: this.obj.id,
          add_power: this.add_power == true ? 1 : 0,
          del_power: this.del_power == true ? 1 : 0,
          check_power: this.check_power == true ? 1 : 0,
          all_power: this.all_power == true ? 1 : 0,
          remark: this.addformValidate.remark,
        };
        url = "/dnc/DncPgCreate/editPower";
        msg = "修改成功";
      }

      this.request(url, data, "post").then((res) => {
        if (res.data.ret == 1) {
          this.$Message.success(msg);
          this.search(1, 10);
          this.addmodel = false;
          this.obj = {};
        } else {
          this.$Message.error(this.$t(res.data.msg));
        }
      });
    },
    handleSubmit(name) {
      this.$refs[name].validate((valid) => {
        if (valid) {
          // this.$Message.success('Success!');
        } else {
          this.$Message.error("请完善必填项");
          this.addloading = true;
        }
      });
    },
    edit() {
      if (this.obj.id) {
        // this.addformValidate.department = this.obj.epartment;
        this.add_power = this.obj.add_power == 1;
        this.del_power = this.obj.del_power == 1;
        this.check_power = this.obj.check_power == 1;
        this.all_power = this.obj.all_power == 1;
        this.type = 2;
        this.addmodel = true;
      } else {
        this.$Message.error("请选择数据");
      }
    },
    dele() {
      if (this.obj.id == "" || this.obj.id == undefined) {
        this.$Message.error("请选择数据");
        return false;
      }
      let content = "";
      content =
        "<p>人员姓名：" +
        this.obj.name +
        "</p><p>所属部门：" +
        this.obj.epartment +
        "</p>";
      this.$Modal.confirm({
        title: "确认删除该人员的DNC管理权限？",
        content: content,
        okText: "删除",
        onOk: () => {
          let data = {
            powerid: this.obj.id,
          };
          this.request("/dnc/DncPgCreate/delPower", data, "post").then(
            (res) => {
              if (res.data.ret == 1) {
                this.$Message.success(this.$t("1058"));
                this.tableData1 = this.search(1, this.pagesize);
                this.show = false;
                this.detailobj = {};
                this.search(this.page, this.pagesize);
              } else {
                this.$Message.error(this.$t(res.data.msg));
              }
            }
          );
        },
      });
    },
    changePage(value) {
      // 页码发生改变时
      this.page = value;
      this.tableData1 = this.search(this.page, this.pagesize);
    },
    handlePageSize(value) {
      this.pagesize = value;
      this.tableData1 = this.search(this.page, this.pagesize);
    },
    handleRowChange(currentRow, oldCurrentRow) {
      this.obj = currentRow;
    },
    request(url, data, type) {
      if (type == "get") {
        return this.axios
          .request({
            url: url,
            params: data,
            method: type,
          })
          .then((res) => {
            return res;
          })
          .catch((error) => error);
      } else {
        return this.axios
          .request({
            url: url,
            data,
            method: type,
          })
          .then((res) => {
            return res;
          })
          .catch((error) => error);
      }
    },
  },
};
</script>
<style scoped>
.powerCheckbox {
  width: 100px !important;
}
</style>
