<template>
  <zj-tab-page
    ref="tabPage"
    :defaultActives="[
      { key: 'list', label: $route.meta.title + '-列表', essential: true },
    ]"
  >
    <template slot-scope="{ activeKey, data }">
      <div
        :style="{
          width: '100%',
          height: activeKey == 'list' ? '100%' : '0px',
          overflow: activeKey == 'list' ? 'auto' : 'hidden',
        }"
      >
        <div class="app-container">
          <div class="setting_title">账户管理</div>
          <el-divider></el-divider>
          <div class="mymain-container">
            <div class="btn-group clearfix">
              <div class="fl">
                <el-button
                  size="small"
                  type="primary"
                  icon="el-icon-plus"
                  @click="addOrEdit('add')"
                  >新增账户</el-button
                >
              </div>
              <div class="fr">
                <el-select
                  v-model="screenForm.role"
                  placeholder="全部"
                  size="small"
                  style="width: 120px; margin-right: 10px"
                  @change="getListByScreen"
                >
                  <el-option label="全部角色" value=""></el-option>
                  <el-option
                    :label="item.name"
                    :value="item.adminRoleId"
                    v-for="(item, index) in roleList"
                    :key="index"
                  ></el-option>
                </el-select>
                <el-select
                  v-model="screenForm.status"
                  placeholder="全部"
                  size="small"
                  style="width: 120px; margin-right: 10px"
                  @change="getListByScreen"
                >
                  <el-option label="全部状态" value=""></el-option>
                  <el-option
                    :label="item.label"
                    :value="item.value"
                    v-for="(item, index) in select_status"
                    :key="index"
                  ></el-option>
                </el-select>
                <el-input
                  placeholder="商户名称"
                  v-model="screenForm.companyName"
                  size="small"
                  style="width: 180px"
                ></el-input>
                <el-input
                  placeholder="账号或用户名"
                  v-model="screenForm.keyword"
                  size="small"
                  style="width: 180px"
                >
                  <el-button
                    slot="append"
                    icon="el-icon-search"
                    size="small"
                    @click="getListByScreen"
                  ></el-button>
                </el-input>
                <el-button
                  size="small"
                  @click="
                    screenForm.companyName = '';
                    screenForm.keyword = '';
                    screenForm.role = '';
                    screenForm.status = '';
                    getListByScreen();
                  "
                  >清空</el-button
                >
              </div>
            </div>
            <div class="table">
              <el-table
                v-loading="listLoading"
                :data="dataList"
                element-loading-text="Loading"
                border
                fit
                highlight-current-row
                stripe
              >
                <el-table-column
                  align="center"
                  label="序号"
                  type="index"
                  width="50"
                ></el-table-column>
                <el-table-column
                  align="center"
                  label="商户"
                  prop="companyName"
                  min-width="160"
                ></el-table-column>
                <el-table-column
                  align="center"
                  label="账号"
                  prop="userName"
                  min-width="120"
                ></el-table-column>
                <el-table-column
                  align="center"
                  label="用户名"
                  prop="nickName"
                  min-width="160"
                ></el-table-column>
                <el-table-column
                  align="center"
                  label="角色"
                  prop="roleName"
                  min-width="100"
                ></el-table-column>
                <el-table-column
                  align="center"
                  label="创建时间"
                  prop="createTime"
                  min-width="160"
                ></el-table-column>
                <el-table-column
                  align="center"
                  label="最后登录时间"
                  prop="lastLoginTime"
                  min-width="160"
                ></el-table-column>
                <el-table-column
                  align="center"
                  label="状态"
                  class-name="status-col"
                >
                  <template slot-scope="scope">
                    <el-tag :type="scope.row.status ? 'success' : 'danger'">{{
                      scope.row.status ? "正常" : "冻结"
                    }}</el-tag>
                  </template>
                </el-table-column>
                <el-table-column align="center" label="操作" min-width="160">
                  <template slot-scope="scope">
                    <el-popconfirm
                      v-if="
                        scope.row.status &&
                        scope.row.adminUserId !== userData.adminUserId
                      "
                      style="margin-right: 10px"
                      title="确定冻结吗？"
                      @confirm="changeStatus(scope.row.adminUserId, 0)"
                    >
                      <el-button slot="reference" type="text">冻结</el-button>
                    </el-popconfirm>
                    <el-popconfirm
                      v-else
                      style="margin-right: 10px"
                      title="确定恢复吗？"
                      @confirm="changeStatus(scope.row.adminUserId, 1)"
                    >
                      <el-button slot="reference" type="text">恢复</el-button>
                    </el-popconfirm>
                    <el-button
                      type="text"
                      @click="addOrEdit('edit', scope.row.adminUserId)"
                      >编辑</el-button
                    >
                    <el-button
                      type="text"
                      @click="handleReset(scope.row.adminUserId)"
                      >重置密码</el-button
                    >
                    <!-- <el-button
                      v-if="userName == 'admin'"
                      type="text"
                      @click="dengluLogin(scope.row)"
                      >登入</el-button
                    > -->
                  </template>
                </el-table-column>
              </el-table>
            </div>
            <div class="pagination clearfix">
              <div class="fr">
                <el-pagination
                  @size-change="handleSizeChange"
                  @current-change="handleCurrentChange"
                  :current-page="currentPage"
                  :page-sizes="[10, 20, 30, 50]"
                  :page-size="10"
                  layout="total, sizes, prev, pager, next, jumper"
                  :total="listTotal"
                >
                </el-pagination>
              </div>
            </div>
          </div>
        </div>
      </div>
      <div
        v-if="~['add', 'edit'].indexOf(activeKey)"
        style="box-sizing: border-box; padding: 16px"
      >
        <el-form
          ref="addForm"
          :model="addForm"
          :rules="addFormRules"
          label-position="left"
          label-width="100px"
        >
          <el-row :gutter="20">
            <el-col :md="6">
              <el-form-item label="账号" prop="account">
                <el-input
                  v-model="addForm.account"
                  :disabled="addForm.adminUserId === userData.adminUserId"
                  autocomplete="off"
                  placeholder="请输入账号"
                ></el-input>
              </el-form-item>
            </el-col>
            <el-col :md="6">
              <el-form-item label="用户名" prop="nickName">
                <el-input
                  v-model="addForm.nickName"
                  :disabled="addForm.adminUserId === userData.adminUserId"
                  autocomplete="off"
                  placeholder="请输入用户名"
                ></el-input>
              </el-form-item>
            </el-col>
            <el-col :md="6">
              <el-form-item label="手机号" prop="linkPhone">
                <el-input
                  v-model="addForm.linkPhone"
                  autocomplete="off"
                  placeholder="请输入手机号"
                ></el-input>
              </el-form-item>
            </el-col>

            <el-col :md="6" v-if="!addForm.adminUserId">
              <el-form-item label="密码" prop="newPassword">
                <el-input
                  v-model="addForm.newPassword"
                  ref="password1"
                  autocomplete="off"
                  placeholder="请输入密码"
                  :type="passwordType1"
                ></el-input>
                <span class="show-pwd" @click="showPwd(1)">
                  <svg-icon
                    :icon-class="
                      passwordType1 === 'password' ? 'eye' : 'eye-open'
                    "
                  />
                </span>
              </el-form-item>
            </el-col>
            <el-col :md="6" v-if="!addForm.adminUserId">
              <el-form-item label="确认密码" prop="confirmPassword">
                <el-input
                  v-model="addForm.confirmPassword"
                  ref="password2"
                  autocomplete="off"
                  placeholder="请再次输入密码"
                  :type="passwordType2"
                ></el-input>
                <span class="show-pwd" @click="showPwd(2)">
                  <svg-icon
                    :icon-class="
                      passwordType2 === 'password' ? 'eye' : 'eye-open'
                    "
                  />
                </span>
              </el-form-item>
            </el-col>

            <el-col :md="6">
              <el-form-item label="账号类型" prop="role">
                <el-select
                  :disabled="[1, 2].includes(addForm.type)"
                  v-model="addForm.type"
                  placeholder="请选择"
                  style="width: 100%"
                  @change="
                    () => {
                      addForm.rwaide = [];
                      addForm.permissions = [];
                      addForm.role = '';
                      chonglaiqingq();
                    }
                  "
                >
                  <el-option
                    v-if="[0].includes(userData.type)"
                    label="平台账号"
                    :value="0"
                  ></el-option>
                  <el-option
                    v-if="[1].includes(addForm.type)"
                    label="商户主账号"
                    :value="1"
                  ></el-option>
                  <el-option
                    v-if="[2].includes(addForm.type)"
                    label="商家主账号"
                    :value="2"
                  ></el-option>
                  <el-option
                    v-if="[0, 1, 3].includes(userData.type)"
                    label="商户账号"
                    :value="3"
                  ></el-option>
                  <el-option label="网点账号" :value="4"></el-option>
                </el-select>
              </el-form-item>
            </el-col>

            <el-col :md="6" v-if="[1, 2, 3, 4].includes(addForm.type)">
              <el-form-item
                label="所属商户"
                prop="companyId"
                :rules="[
                  { required: true, message: '请选择', trigger: 'blur' },
                ]"
              >
                <el-select
                  v-model="addForm.companyId"
                  placeholder="商户"
                  style="width: 100%"
                  @change="
                    (v) => {
                      addForm.rwaide = [];
                      addForm.permissions = [];
                      addForm.role = '';
                      if (v) {
                        addForm.companyName = merchantList.find(
                          (item) => item.value == v
                        ).label;
                      } else {
                        addForm.companyName = '';
                      }
                    }
                  "
                >
                  <el-option
                    :label="item.label"
                    :value="item.value"
                    v-for="(item, index) in merchantList"
                    :key="index"
                  ></el-option>
                </el-select>
              </el-form-item>
            </el-col>

            <el-col :md="6" v-if="addForm.adminUserId !== userData.adminUserId">
              <el-form-item label="角色组" prop="role">
                <el-select
                  v-model="addForm.role"
                  placeholder="请选择角色组"
                  style="width: 100%"
                >
                  <el-option
                    :label="item.name"
                    :value="item.adminRoleId"
                    v-for="(item, index) in [1, 2, 3, 4].includes(addForm.type)
                      ? roleList.filter(
                          (item) =>
                            (item.companyId == addForm.companyId ||
                              item.companyId === '') &&
                            item.type ==
                              (addForm.type == 3
                                ? 1
                                : addForm.type == 4
                                ? 2
                                : addForm.type)
                        )
                      : roleList.filter(
                          (item) =>
                            item.type ==
                            (addForm.type == 3
                              ? 1
                              : addForm.type == 4
                              ? 2
                              : addForm.type)
                        )"
                    :key="index"
                  ></el-option>
                </el-select>
              </el-form-item>
            </el-col>

            <el-col :md="6" v-if="[0, 1, 3].includes(addForm.type)">
              <el-form-item
                label="部门"
                prop="rwaide"
                :rules="
                  [1, 3].includes(addForm.type)
                    ? [{ required: true, message: '请选择', trigger: 'blur' }]
                    : []
                "
              >
                <el-cascader
                  collapse-tags
                  style="width: 100%"
                  :options="
                    [1, 3].includes(addForm.type)
                      ? [1, 3].includes(userData.type)
                        ? departmentList.filter(
                            (item) => item.companyId == addForm.companyId
                          )
                        : departmentList[0].children.filter(
                            (item) => item.companyId == addForm.companyId
                          )
                      : departmentList
                  "
                  :props="{
                    checkStrictly: true,
                    emitPath: false,
                    multiple: true,
                    filterable: true,
                    value: 'adminDeptId',
                    label: 'deptName',
                  }"
                  filterable
                  v-model="addForm.rwaide"
                  clearable
                  :disabled="addForm.adminUserId === userData.type"
                  @change="shiqingyoubian"
                >
                  <template slot-scope="{ node, data }">
                    <span
                      >{{
                        data.pid == "0"
                          ? ""
                          : data.pid == "1"
                          ? "商户-"
                          : data.isWebsit
                          ? `网点-(${data.adminDeptId})`
                          : "部门-"
                      }}{{ data.deptName }}</span
                    >
                  </template>
                </el-cascader>
              </el-form-item>
            </el-col>

            <el-col :md="6">
              <el-form-item
                label="商家"
                prop="permissions"
                :rules="
                  [2, 4].includes(addForm.type)
                    ? [{ required: true, message: '请选择', trigger: 'blur' }]
                    : []
                "
              >
                <el-select
                  v-model="addForm.permissions"
                  multiple
                  placeholder="请选择商家"
                  style="width: 100%"
                >
                  <el-option
                    :label="item.name"
                    :value="item.websitId"
                    v-for="(item, index) in [1, 2, 3, 4].includes(addForm.type)
                      ? wangduainshu.filter(
                          (item) => item.companyId === addForm.companyId
                        )
                      : wangduainshu"
                    :key="index"
                  ></el-option>
                </el-select>
              </el-form-item>
            </el-col>
          </el-row>
        </el-form>
        <div slot="footer" class="dialog-footer">
          <el-button @click="data.removeTab()">取 消</el-button>
          <el-button type="primary" @click="submitAddForm(data.removeTab)"
            >确 定</el-button
          >
        </div>
      </div>
      <div
        v-if="~['resetpassword'].indexOf(activeKey)"
        style="box-sizing: border-box; padding: 16px"
      >
        <el-form
          ref="resetForm"
          :model="resetForm"
          :rules="resetFormRules"
          label-position="left"
          label-width="100px"
        >
          <el-form-item label="输入新密码" prop="newPassword">
            <el-input
              v-model="resetForm.newPassword"
              ref="password1"
              autocomplete="off"
              placeholder="请输入新密码"
              :type="passwordType1"
            ></el-input>
            <span class="show-pwd" @click="showPwd(1)">
              <svg-icon
                :icon-class="passwordType1 === 'password' ? 'eye' : 'eye-open'"
              />
            </span>
          </el-form-item>
          <el-form-item label="确认密码" prop="confirmPassword">
            <el-input
              v-model="resetForm.confirmPassword"
              ref="password2"
              autocomplete="off"
              placeholder="请再次输入新密码"
              :type="passwordType2"
            ></el-input>
            <span class="show-pwd" @click="showPwd(2)">
              <svg-icon
                :icon-class="passwordType2 === 'password' ? 'eye' : 'eye-open'"
              />
            </span>
          </el-form-item>
        </el-form>
        <div slot="footer" class="dialog-footer">
          <el-button @click="data.removeTab()">取 消</el-button>
          <el-button type="primary" @click="submitResetForm(data.removeTab)"
            >确 定</el-button
          >
        </div>
      </div>
    </template>
  </zj-tab-page>
</template>

<script>
import {
  getAccountList,
  getRoleList,
  changeAccountStatus,
  resetPassword,
  addAccount,
  editAccount,
  getUserInfo,
  getDepartmentList,
  getMerchantList,
} from "@/api/setting";
import { adminWebsitList } from "@/api/merchantManagement.js";
import { adminDeptTree } from "@/api/departmentManagement.js";
import {
  required,
  mobileRequired,
} from "@/components/template/rules_verify.js";
import { adminCompanyList } from "@/api/payingMerchant.js";
export default {
  data() {
    var validatePass = (rule, value, callback) => {
      if (value === "") {
        callback(new Error("请输入新密码"));
      } else if (value && value.length < 6) {
        callback(new Error("密码长度至少6位"));
      } else {
        if (this.resetForm.confirmPassword !== "") {
          this.$refs.resetForm.validateField("confirmPassword");
        }
        callback();
      }
    };
    var validatePass2 = (rule, value, callback) => {
      if (value === "") {
        callback(new Error("请再次输入密码"));
      } else if (value !== this.resetForm.newPassword) {
        callback(new Error("两次输入密码不一致"));
      } else {
        callback();
      }
    };
    var validatePass3 = (rule, value, callback) => {
      if (!value) {
        callback(new Error("请输入新密码"));
      } else if (value && value.length < 6) {
        callback(new Error("密码长度至少6位"));
      } else {
        if (this.addForm.confirmPassword !== "") {
          this.$refs.addForm.validateField("confirmPassword");
        }
        callback();
      }
    };
    var validatePass4 = (rule, value, callback) => {
      if (!value) {
        callback(new Error("请再次输入密码"));
      } else if (value !== this.addForm.newPassword) {
        callback(new Error("两次输入密码不一致"));
      } else {
        callback();
      }
    };
    return {
      venderList: [],
      userName: JSON.parse(localStorage.getItem("greemall_user")).userName,
      userInfoData: JSON.parse(localStorage.getItem("greemall_user")),
      dataList: null, // 列表数据
      listLoading: true, // 列表加载loading
      screenForm: {
        // 筛选表单数据
        role: "", // 角色
        status: "", // 状态
        keyword: "", // 关键词
        companyName: "", //商户名
      },
      select_status: [
        // 筛选字段 - 状态
        { label: "正常", value: true },
        { label: "冻结", value: false },
      ],
      currentPage: 1, // 当前页码
      pageSize: 10, // 每页数量
      listTotal: 0, // 列表总数
      roleList: [], // 角色列表
      departmentList: [], // 部门列表

      merchantList: [], // 商户列表
      resetId: null,
      resetForm: {
        newPassword: "", // 新密码
        confirmPassword: "", // 确认密码
      },
      resetFormRules: {
        newPassword: [
          { required: true, validator: validatePass, trigger: "blur" },
        ],
        confirmPassword: [
          { required: true, validator: validatePass2, trigger: "blur" },
        ],
      },
      editId: null,
      addFormType: "add",
      addForm: {
        companyId: "",
        companyName: "",
        account: "", // 账号
        nickName: "", // 用户名
        role: "", // 角色组
        adminWebsitId: [],
        adminDeptId: [],
        newPassword: "", // 新密码
        confirmPassword: "", // 确认密码
        type: "",
        linkPhone: "",
        rwaide: [],
        deptList: [],
        permissions: [],
      },
      addFormRules: {
        account: [{ required: true, message: "请输入账号", trigger: "blur" }],
        nickName: [
          { required: true, message: "请输入用户名", trigger: "blur" },
        ],
        linkPhone: mobileRequired,
        role: [{ required: true, message: "请选择角色组", trigger: "blur" }],
        permissions: [{ required: true, message: "请选择", trigger: "blur" }],
        type: [{ required: true, message: "请选择账号类型", trigger: "blur" }],
        newPassword: [{ validator: validatePass3, trigger: "blur" }],
        confirmPassword: [{ validator: validatePass4, trigger: "blur" }],
      },
      passwordType1: "password",
      passwordType2: "password",
      wangduainshu: [],
    };
  },
  async created() {
    await this.getRoleList();
    if (this.$route.query.type) {
      let index = this.$findElem(this.roleList, "name", "企业负责人");
      this.screenForm.role = this.roleList[index].adminRoleId;
    }
    this.getList();

    adminWebsitList({
      pageNum: 1,
      pageSize: -1,
      params: [{ param: "status", compare: "=", value: "ON" }],
    }).then((res) => {
      this.wangduainshu = res.data.records;
      console.log(res.data.records, "p-p-ppp");
    });
  },
  watch: {
    "addForm.role"() {
      if (this.addForm.role) {
        let index = this.$findElem(
          this.roleList,
          "adminRoleId",
          this.addForm.role
        );
      }
    },
  },
  computed: {
    userData() {
      return JSON.parse(localStorage.getItem("greemall_user"));
    },
  },
  methods: {
    getList() {
      this.listLoading = true;
      let params = {
        roleId: this.screenForm.role,
        status: this.screenForm.status,
        userName: this.screenForm.keyword,
        companyName: this.screenForm.companyName,
        pageNum: this.currentPage,
        pageSize: this.pageSize,
        ...(() => {
          if (this.$route.query.companyWechatId) {
            return {
              companyWechatId: this.$route.query.companyWechatId,
            };
          }
          return {};
        })(),
      };

      getAccountList(params).then((res) => {
        this.dataList = res.data.records;
        this.listTotal = res.data.total;
        this.listLoading = false;
      });
    },

    // 筛选后重新获取列表
    getListByScreen() {
      this.currentPage = 1;
      this.getList();
    },

    // 获取角色列表
    async getRoleList() {
      const result = await new Promise((resolve, reject) => {
        getRoleList({ pageNum: 1, pageSize: 1000, canShow: true })
          .then((res) => {
            this.roleList = res.data.records;
            console.log(this.roleList, "----------kkk");
            resolve(res.data);
          })
          .catch((res) => {
            resolve([]);
          });
      });
      return result;
    },
    async shiqingyoubian() {
      this.departmentList = await this.getDepartmentList();
    },
    // 获取部门列表
    async getDepartmentList() {
      if (this.addForm.type !== undefined && this.addForm.type !== "") {
        var accountType = this.addForm.type;
        var this_ = this;
        function digui(list) {
          for (var item of list) {
            if (item.adminDeptId == 1 && ![0].includes(accountType)) {
              item.disabled = true;
            } else if (
              item.adminDeptId != 1 &&
              ![0, 1, 3].includes(accountType) &&
              !item.isWebsit
            ) {
              item.disabled = true;
            }
            if (
              item.children &&
              item.children.length &&
              this_.addForm.rwaide.includes(item.adminDeptId)
            ) {
              buyiydigui(item.children);
            } else if (item.children && item.children.length) {
              digui(item.children);
            } else {
              delete item.children;
            }
          }
          return list;
        }

        function buyiydigui(list) {
          for (var item of list) {
            if (this_.addForm.rwaide.includes(item.adminDeptId)) {
              this_.addForm.rwaide.splice(
                this_.addForm.rwaide.indexOf(item.adminDeptId),
                1
              );
            }
            item.disabled = true;
            if (item.children && item.children.length) {
              buyiydigui(item.children);
            }
          }
          return list;
        }

        const result = await new Promise((resolve, reject) => {
          adminDeptTree()
            .then((res) => {
              var list = res.data;
              if (
                JSON.parse(localStorage.getItem("greemall_user"))?.type == 1
              ) {
                list = list?.[0]?.children;
              }
              resolve(digui(list));
            })
            .catch((res) => {
              resolve([]);
            });
        });
        return result;
      } else {
        return [];
      }
    },

    // 更改每页数量
    handleSizeChange(val) {
      this.pageSize = val;
      this.currentPage = 1;
      this.getList();
    },

    // 更改当前页
    handleCurrentChange(val) {
      this.currentPage = val;
      this.getList();
    },

    // 操作 - 更改状态(type: 禁用0，启用1)
    changeStatus(id, type) {
      type = type ? true : false;
      changeAccountStatus({ adminUserId: id, status: type }).then((res) => {
        this.getList();
        this.$successMsg();
      });
    },

    // 显示隐藏密码
    showPwd(num) {
      if (num == 1) {
        if (this.passwordType1 === "password") {
          this.passwordType1 = "";
        } else {
          this.passwordType1 = "password";
        }
        this.$nextTick(() => {
          this.$refs.password1.focus();
        });
      }
      if (num == 2) {
        if (this.passwordType2 === "password") {
          this.passwordType2 = "";
        } else {
          this.passwordType2 = "password";
        }
        this.$nextTick(() => {
          this.$refs.password2.focus();
        });
      }
    },

    // 重置密码
    handleReset(id) {
      this.$refs.tabPage.addTab({
        activeKey: "resetpassword",
        key: "resetpassword",
        label: "重置密码",
        triggerEvent: () => {
          this.cancelResetForm();
          this.$nextTick(() => {
            this.resetId = id;
          });
        },
        closeEvent: () => {
          this.cancelResetForm();
        },
      });
    },

    // 取消重置密码
    cancelResetForm() {
      this.passwordType1 = "password";
      this.passwordType2 = "password";
      this.$refs?.resetForm?.resetFields();
    },

    // 提交重置密码
    submitResetForm(removeTab) {
      this.$refs.resetForm.validate((valid) => {
        if (valid) {
          let params = {
            password: this.resetForm.newPassword,
            adminUserId: this.resetId,
          };
          resetPassword(params).then((res) => {
            removeTab("list");
            this.getList();
            this.$successMsg();
          });
        }
      });
    },

    async chonglaiqingq() {
      this.departmentList = [];
      this.merchantList = [];
      adminCompanyList({
        pageNum: 1,
        pageSize: -1,
        params: [],
      }).then((res) => {
        this.merchantList = res.data.records.map((item) => ({
          label: item.adminCompanyName,
          value: item.adminCompanyId,
        }));
      });
      this.departmentList = await this.getDepartmentList();
    },

    // 新增编辑 账户
    async addOrEdit(type, id) {
      this.$refs.tabPage.addTab({
        activeKey: type,
        key: type,
        label: { add: "新增", edit: "编辑" }[type],
        triggerEvent: async () => {
          this.cancelAddForm();
          this.addFormType = type;
          if (type == "edit") {
            this.editId = id;
            getUserInfo({ adminUserId: id }).then((res) => {
              this.addForm = {
                adminUserId: res.data.adminUserId || id,
                roleName: res.data.roleName,
                companyId: res.data.companyId,
                companyName: res.data.companyName,
                account: res.data.userName,
                role: res.data.roleId,
                nickName: res.data.nickName,
                type: res.data.type,
                adminWebsitId: res.data.adminWebsitId,
                adminDeptId: res.data.adminDeptId,
                linkPhone: res.data.linkPhone,
                rwaide: res.data.adminDeptIds,
                permissions: [
                  ...(res.data.permissions?.map(
                    (item) => item.adminUserPermissionsId
                  ) || []),
                ],
              };

              console.log(this.addForm);
              this.chonglaiqingq();
            });
          }
        },
        closeEvent: () => {},
      });
    },

    // 取消 新增编辑账户
    cancelAddForm() {
      this.passwordType1 = "password";
      this.passwordType2 = "password";
      this.$refs?.addForm?.resetFields();
      this.$data.addForm = this.$options.data().addForm;
    },

    // 提交 新增编辑账户
    submitAddForm(removeTab) {
      this.$refs.addForm.validate((valid) => {
        if (valid) {
          let rwaideObjs = (function (node, ids) {
            const result = [];
            function recurse(currentNode) {
              if (ids.has(currentNode.adminDeptId)) {
                result.push(currentNode);
              } else if (currentNode.children) {
                currentNode.children.forEach((child) => recurse(child));
              }
            }
            for (var item of node) {
              recurse(item);
            }
            return result;
          })(this.departmentList, new Set([...this.addForm.rwaide]));
          let params = {
            companyId: this.addForm.companyId,
            companyName: this.addForm.companyName,
            userName: this.addForm.account,
            nickName: this.addForm.nickName,
            roleId: this.addForm.role,
            password: this.addForm.newPassword,
            type: this.addForm.type,
            linkPhone: this.addForm.linkPhone,
            permissions: this.addForm.permissions.map((id) => ({
              isDept: true,
              adminUserPermissionsId: id,
            })),
            deptList: [
              ...rwaideObjs
                .filter((item) => !item.isWebsit)
                .map((item) => item.adminDeptId)
                .map((id) => ({
                  isDept: true,
                  adminUserPermissionsId: id,
                })),
              ...rwaideObjs
                .filter((item) => item.isWebsit)
                .map((item) => item.adminDeptId)
                .map((id) => ({
                  isDept: false,
                  adminUserPermissionsId: id,
                })),
            ],
          };
          console.log(params);
          if (this.addFormType == "edit") {
            params.adminUserId = this.editId;
            editAccount(params).then((res) => {
              removeTab("list");
              this.getList();
              this.$successMsg("编辑成功");
            });
          } else {
            addAccount(params).then((res) => {
              removeTab("list");
              this.getList();
              this.$successMsg("新增成功");
            });
          }
        }
      });
    },
  },
};
</script>

<style scoped lang="scss">
.show-pwd {
  position: absolute;
  right: 15px;
  top: 0;
  font-size: 16px;
  cursor: pointer;
  user-select: none;
}
</style>
