zkPCproject/src/views/admin/user/index.vue

<template>
  <div class="user">
    <div style="background: #ffff; padding: 10px">
      <div class="tabcenbox" v-if="systemFlag" style="cursor: pointer;">
        <div
          :class="choseFlag ? 'ch1' : 'ch2'"
          style="border-right: 1px solid #ccc;"
          @click="choseFlag = true"
        >
          注册用户
        </div>
        <div :class="!choseFlag ? 'ch1' : 'ch2'" @click="choseFlag = false">
          组织用户
        </div>
      </div>
      <!-- 当他为注册用户的时候 -->
      <div class="top" style="margin-left: 10px" v-if="choseFlag">
        <el-form
          :inline="true"
          :model="searchMsg"
          class="demo-form-inline"
          ref="searchMsg"
        >
          <el-form-item label="身份" prop="flag">
            <el-input
              v-if="searchMsg.flag == 1"
              v-model="searchMsg.username"
              clearable
              placeholder="请输入"
              maxlength="15"
            >
              <el-select
                v-model="searchMsg.flag"
                slot="prepend"
                class="input-with-select"
                style="width: 140px"
                placeholder="请选择"
                @change="flagchange"
              >
                <el-option label="登陆手机" value="1"></el-option>
                <el-option label="用户名" value="2"></el-option>
              </el-select>
            </el-input>
            <el-input
              v-else
              v-model="searchMsg.name"
              clearable
              placeholder="请输入"
               maxlength="15"
            >
              <el-select
                v-model="searchMsg.flag"
                slot="prepend"
                class="input-with-select"
                style="width: 140px"
                placeholder="请选择"
                @change="flagchange"
              >
                <el-option label="登陆手机" value="1"></el-option>
                <el-option label="用户名" value="2"></el-option>
              </el-select>
            </el-input>
          </el-form-item>
          <!-- <el-form-item label="所属组织" prop="orgName">
            <el-input
              v-model="searchMsg.orgName"
              clearable
              placeholder="请输入所属组织名称"
            ></el-input>
          </el-form-item> -->
          <el-form-item>
            <el-button type="primary" @click="search">筛选</el-button>
            <el-button type="primary" @click="reset">清空筛选条件</el-button>
          </el-form-item>
        </el-form>
      </div>

      <!-- 当他为组织用户的时候 -->
      <div class="top" style="margin-left: 10px" v-else>
        <el-form
          :inline="true"
          :model="searchMsg1"
          class="demo-form-inline"
          ref="searchMsg1"
        >
          <el-form-item label="身份" prop="flag">
            <el-input
              v-if="searchMsg1.flag == 1"
              v-model="searchMsg1.username"
              clearable
              placeholder="请输入"
              maxlength="15"
            >
              <el-select
                v-model="searchMsg1.flag"
                slot="prepend"
                class="input-with-select"
                style="width: 140px"
                placeholder="请选择"
                @change="flagchange1"
              >
                <el-option label="登陆账号" value="1"></el-option>
                <el-option label="用户名" value="2"></el-option>
              </el-select>
            </el-input>
            <el-input
              v-else
              v-model="searchMsg1.name"
              clearable
              placeholder="请输入"
               maxlength="15"
            >
              <el-select
                v-model="searchMsg1.flag"
                slot="prepend"
                class="input-with-select"
                style="width: 140px"
                placeholder="请选择"
                @change="flagchange1"
              >
                <el-option label="登陆账号" value="1"></el-option>
                <el-option label="用户名" value="2"></el-option>
              </el-select>
            </el-input>
          </el-form-item>
          <el-form-item label="组织类型" v-if="losorgType==2" prop="queryOrgType">
            <el-select
              v-model="searchMsg1.queryOrgType"
              @change="queryOrgTypeChange"
              clearable
              placeholder="请选择"
            >
              <!-- <el-option label="平台用户" value="0"></el-option> -->
              <!-- <el-option label="代理商用户" value="1"></el-option> -->
              <el-option label="公司用户" value="2"></el-option>
              <el-option label="楼盘用户" value="3"></el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="用户身份" prop="userRoleType">
            <el-select
              v-model="searchMsg1.userRoleType"
              filterable
              clearable
              placeholder="请选择"
            >
              <!-- <el-option label="项目总" value="2"></el-option>
              <el-option label="客服" value="3"></el-option>
              <el-option label="策划" value="4"></el-option>
              <el-option label="经理" value="5"></el-option>
              <el-option label="置业顾问" value="6"></el-option> -->
              <el-option
                v-for="item in userRoleList"
                :key="item.dictValue"
                :label="item.dictName"
                :value="item.dictValue"
              >
              </el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="状态" prop="lockFlag">
            <el-select
              v-model="searchMsg1.lockFlag"
              clearable
              placeholder="请选择"
            >
              <el-option label="启用" value="0"></el-option>
              <el-option label="禁用" value="1"></el-option>
            </el-select>
          </el-form-item>
          <el-form-item>
            <el-button type="primary" @click="search1">筛选</el-button>
            <el-button type="primary" @click="reset1">清空筛选条件</el-button>
          </el-form-item>
        </el-form>
      </div>

      <div style="margin: 0 0 10px 10px" v-if="sys_user_add">
        <!-- <el-button type="primary" :disabled='checkRole.length==0' @click="delIds">批量删除</el-button> -->
        <el-button type="primary" @click="addRole">添加</el-button>
      </div>
    </div>

    <!-- 表格 -->
    <div class="con" style="margin-left: 10px">
      <el-table
        :data="tableData"
        v-if="choseFlag"
        border
        @selection-change="handleSelectionChange"
        style="width: 100%"
        :header-cell-style="{ textAlign: 'center' }"
        :cell-style="{ textAlign: 'center' }"
      >
        <el-table-column type="selection" width="55"> </el-table-column>
        <el-table-column prop="name" label="用户名"> </el-table-column>
        <el-table-column label="登录手机" prop="username"> </el-table-column>
        <el-table-column label="性别">
          <template slot-scope="{ row }">
            {{ row.sex == 0 ? "男" : "女" }}
          </template>
        </el-table-column>
        <!-- <el-table-column prop="orgName" label="所属组织"> </el-table-column> -->
        <el-table-column prop="createTime" label="注册时间"> </el-table-column>
        <el-table-column prop="address" label="操作">
          <template slot-scope="scope">
            <el-button
              v-if="resetPassword"
              @click="resetPwd(scope.row)"
              type="text"
              size="small"
              >密码重置</el-button
            >
            <el-button
              v-if="sys_user_edit"
              @click="editRole(scope.row, false)"
              type="text"
              size="small"
              >编辑</el-button
            >
            <!-- <el-tooltip
              style="font-size: 18px"
              effect="dark"
              content="密码重置"
              placement="top-start"
            >
              <i
                class="el-icon-unlock"
                style="color: #ff892a"
                @click="resetPwd(scope.row)"
              ></i>
            </el-tooltip>
            <el-tooltip
              style="font-size: 18px"
              effect="dark"
              content="查看"
              placement="top-start"
            >
              <i
                class="el-icon-zoom-in"
                style="color: #008ef2"
                @click="editRole(scope.row, true)"
              ></i>
            </el-tooltip>
            <el-tooltip
              style="font-size: 18px"
              effect="dark"
              content="编辑"
              placement="top-start"
            >
              <i
                class="el-icon-edit"
                style="color: red"
                @click="editRole(scope.row, false)"
              ></i>
            </el-tooltip>
            <el-tooltip
              style="font-size: 18px"
              effect="dark"
              content="删除"
              placement="top-start"
            >
              <i
                class="el-icon-close"
                style="color: #428bca"
                @click="deletes(scope.row)"
              ></i>
            </el-tooltip>
            <el-tooltip
              style="font-size: 18px"
              effect="dark"
              content="修改客户信息状态"
              placement="top-start"
            >
              <i
                class="el-icon-view"
                style="color: #428bca"
                @click="editStatus(scope.row)"
              ></i>
            </el-tooltip> -->
          </template>
        </el-table-column>
      </el-table>

      <el-table
        :data="tableData1"
        v-else
        border
        @selection-change="handleSelectionChange"
        style="width: 100%"
        :header-cell-style="{ textAlign: 'center' }"
        :cell-style="{ textAlign: 'center' }"
      >
        <el-table-column type="selection" width="55"> </el-table-column>
        <el-table-column prop="name" label="用户名"> </el-table-column>
        <el-table-column label="登录手机" prop="username"> </el-table-column>
        <el-table-column prop="orgName" label="所属组织"> </el-table-column>
        <!-- <el-table-column prop="orgType" label="组织类型">
          <template slot-scope="scope">
            {{
              scope.row.orgType == 0
                ? "系统用户"
                : scope.row.orgType == 1
                ? "代理商用户"
                : scope.row.orgType == 2
                ? "公司用户"
                :  scope.row.orgType == 3?'楼盘用户'
                : ""
            }}
          </template>
        </el-table-column> -->
        <el-table-column prop="orgTypeName" label="组织类型"> </el-table-column>
        <el-table-column prop="roleName" label="组织角色"> </el-table-column>
        <el-table-column prop="userRoleTypeName" label="用户身份">
        </el-table-column>
        <el-table-column label="状态">
          <template slot-scope="{ row }">
            {{ row.lockFlag == 0 ? "启用" : "禁用" }}
          </template>
        </el-table-column>
        <el-table-column prop="createTime" label="添加时间"> </el-table-column>
        <el-table-column prop="address" label="操作" fixed="right" width="150">
          <template slot-scope="scope" v-if="scope.row.userRoleType!=11&&scope.row.userRoleType!=12&&scope.row.userRoleType!=13">
            <el-button
              @click="editTwo(scope.row)"
              v-if="sys_user_edit1"
              type="text"
              size="small"
              >编辑</el-button
            >
            <el-button
              v-if="
                scope.row.orgType == 3 &&
                sys_user_choseHouse &&
                scope.row.userRoleType != 8 &&
                scope.row.userRoleType != 7
              "
              @click="gochosehouse(scope.row)"
              type="text"
              size="small"
              >楼盘选择</el-button
            >
            <el-button
              v-if="sys_user_bind"
              @click="startorg(scope.row)"
              type="text"
              size="small"
            >
              {{ scope.row.lockFlag == 0 ? "禁用" : "启用" }}</el-button
            >
            <el-button
              v-if="sys_user_del"
              @click="deletes(scope.row)"
              type="text"
              size="small"
              >移除</el-button
            >
          </template>
        </el-table-column>
      </el-table>
      <el-pagination
        style="text-align: center; margin-top: 18px"
        background
        @size-change="handleSizeChange"
        @current-change="handleCurrentChange"
        :current-page.sync="page.current"
        :page-sizes="[10, 30, 50]"
        :page-size="page.size"
        layout="total, sizes,prev, pager, next, jumper"
        :total="page.total"
      >
      </el-pagination>
    </div>

    <el-dialog
      :title="formTitle"
      :visible.sync="dialogFormVisible"
      @close="resetForm"
    >
      <el-form
        :model="form"
        label-width="120px"
        ref="form"
        :rules="rules"
        :disabled="editFlag"
      >
        <el-form-item label="登录手机" prop="username">
          <el-input
            v-model="form.username"
            onkeypress="return (/[\d]/.test(String.fromCharCode(event.keyCode)));"
            :disabled="phoneFlag"
            style="width: 370px"
          ></el-input>
        </el-form-item>
        <el-form-item label="用户名" prop="name">
          <el-input
            v-model="form.name"
            maxlength="10"
            clearable
            :disabled="phoneFlag"
            style="width: 370px"
          ></el-input>
        </el-form-item>
        <el-form-item label="性别" prop="sex">
          <el-radio-group v-model="form.sex">
            <el-radio label="0">男</el-radio>
            <el-radio label="1">女</el-radio>
          </el-radio-group>
        </el-form-item>
        <el-form-item label="手机号加密" prop="showPhoneStatus" v-if="addFlag">
          <el-radio-group v-model="form.showPhoneStatus">
            <el-radio :label="0">是</el-radio>
            <el-radio :label="1">否</el-radio>
          </el-radio-group>
        </el-form-item>
        <el-form-item
          label="登录密码"
          prop="password"
          v-if="!phoneFlag && addFlag"
        >
          <el-input
            v-model="form.password"
            style="width: 370px"
            show-password
          ></el-input>
        </el-form-item>
        <el-form-item label="组织类型:" prop="orgType" v-if="addFlag">
          <el-select
            v-model="form.orgType"
            placeholder="请选择组织类型"
            style="width: 370px"
            :disabled="losorgType != 2"
            @change="typeChange"
          >
            <el-option
              v-if="losorgType != 2"
              label="平台"
              :value="0"
            ></el-option>
            <el-option
              v-if="losorgType != 2"
              label="代理商"
              :value="1"
            ></el-option>
            <el-option label="公司" :value="2"></el-option>
            <el-option label="楼盘" :value="3"></el-option>
          </el-select>
        </el-form-item>
        <el-form-item
          label="身份"
          prop="userRoleType"
          v-if="identityFlag && addFlag"
        >
          <el-select
            v-model="form.userRoleType"
            value-key="key"
            style="width: 370px"
            clearable
            filterable
            placeholder="请选择身份"
          >
            <!-- <el-option label="项目总" value="2"></el-option>
            <el-option label="客服" value="3"></el-option>
            <el-option label="策划" value="4"></el-option>
            <el-option label="经理" value="5"></el-option>
            <el-option label="置业顾问" value="6"></el-option> -->
            <el-option
              v-for="item in identityList"
              :key="item.dictValue"
              :label="item.dictName"
              :value="item.dictValue"
            >
            </el-option>
          </el-select>
        </el-form-item>
        <!-- <el-form-item
          label="选择公司:"
          v-if="orgFlag && addFlag"
          prop="orgCode"
        >
          <el-select
            v-model="form.orgCode"
            filterable
            placeholder="请选择公司"
            style="width: 370px"
            @change="orgCodeChange($event, 0)"
          >
            <el-option
              v-for="item in orgList"
              :key="item.id"
              :label="item.name"
              :value="item.orgCode"
            >
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item
          label="选择代理商:"
          v-if="agentFlag && addFlag"
          prop="agentId"
        >
          <el-select
            v-model="form.agentId"
            filterable
            placeholder="请选择代理商"
            style="width: 370px"
            @change="orgCodeChange($event, 1)"
          >
            <el-option
              v-for="item in agentList"
              :key="item.id"
              :label="item.agentName"
              :value="item.id"
            >
            </el-option>
          </el-select>
        </el-form-item> -->
        <el-form-item label="角色:" v-if="roleFlag && addFlag" prop="roleId">
          <el-select
            v-model="form.roleId"
            filterable
            clearable
            value-key="key"
            style="width: 370px"
            placeholder="请选择角色"
          >
            <el-option
              v-for="item in userList"
              :key="item.roleId"
              :label="item.roleName"
              :value="item.roleId"
            >
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item
          label="部门:"
          v-if="orgFlag && addFlag && losorgType == 3"
          prop="deptId"
        >
          <el-select
            v-model="form.deptId"
            filterable
            clearable
            value-key="key"
            style="width: 370px"
            placeholder="请选择部门"
          >
            <el-option
              v-for="item in deptList"
              :key="item.deptId"
              :label="item.name"
              :value="item.deptId"
            >
            </el-option>
          </el-select>
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button @click="dialogFormVisible = false">取 消</el-button>
        <el-button type="primary" @click="add">确 定</el-button>
      </div>
    </el-dialog>

    <!-- 组织用户编辑 -->
    <el-dialog title="编辑用户" :visible.sync="dialogFormVisibleTwo">
      <el-form
        :model="formTwo"
        label-width="120px"
        ref="formTwo"
        :rules="rulesTwo"
      >
        <el-form-item label="登录手机" prop="username">
          <el-input
            v-model="formTwo.username"
            disabled
            style="width: 370px"
          ></el-input>
        </el-form-item>
        <el-form-item label="手机号加密" prop="showPhoneStatus">
          <el-radio-group v-model="formTwo.showPhoneStatus">
            <el-radio :label="0">是</el-radio>
            <el-radio :label="1">否</el-radio>
          </el-radio-group>
        </el-form-item>
        <el-form-item label="角色:" prop="newRoleId">
          <el-select
            v-model="formTwo.newRoleId"
            filterable
            clearable
            value-key="key"
            style="width: 370px"
            placeholder="请选择角色"
          >
            <el-option
              v-for="item in userList"
              :key="item.roleId"
              :label="item.roleName"
              :value="item.roleId"
            >
            </el-option>
          </el-select>
        </el-form-item>
        <!-- <el-form-item label="身份:"  prop="newRoleId" v-if="formTwo.userRoleType!=6&&formTwo.userRoleType!=7&&formTwo.userRoleType!=8"> -->
        <el-form-item label="身份:" v-if="orgFlag" prop="newRoleId">
          <el-select
            v-model="formTwo.userRoleType"
            filterable
            clearable
            :disabled="
              formTwo.userRoleType == 6 ||
              formTwo.userRoleType == 7 ||
              formTwo.userRoleType == 8
            "
            value-key="key"
            style="width: 370px"
            placeholder="请选择身份"
          >
            <el-option
              v-for="item in userRoleTypeList"
              :key="item.dictValue"
              :label="item.dictName"
              :value="item.dictValue"
            >
            </el-option>
          </el-select>
        </el-form-item>
        <!-- <el-form-item label="部门:"  prop="deptId" v-if="orgFlag">
          <el-select
            v-model="formTwo.deptId"
            filterable
            value-key="key"
            style="width: 370px"
            placeholder="请选择部门"
          >
            <el-option
              v-for="item in deptList"
              :key="item.deptId"
              :label="item.name"
              :value="item.deptId"
            >
            </el-option>
          </el-select>
        </el-form-item> -->
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button @click="dialogFormVisibleTwo = false">取 消</el-button>
        <el-button type="primary" @click="editSureTwo">确 定</el-button>
      </div>
    </el-dialog>

    <el-dialog
      title="手机号验证"
      :visible.sync="phoneVisible"
      @close="$refs.phoneForm.resetFields()"
      width="400px"
    >
      <el-form
        :model="phoneForm"
        label-width="100px"
        ref="phoneForm"
        :rules="phoneRules"
      >
        <el-form-item label="登陆手机:" prop="phone">
          <el-input
            style="width: 200px"
            type="tel"
            maxlength="11"
            v-model.number="phoneForm.phone"
            onkeypress="return (/[\d]/.test(String.fromCharCode(event.keyCode)));"
          ></el-input>
        </el-form-item>
      </el-form>
      <div style="display: flex; justify-content: space-around">
        <el-button @click="phoneVisible = false">取 消</el-button>
        <el-button type="primary" @click="nextshow">确 定</el-button>
      </div>
    </el-dialog>

    <el-dialog
      title="密码重置"
      :visible.sync="passwordVisible"
      @close="$refs.passwordForm.resetFields()"
      width="400px"
    >
      <el-form
        :model="passwordForm"
        label-width="100px"
        ref="passwordForm"
        :rules="passwordRules"
      >
        <el-form-item label="重置密码:" prop="password">
          <el-input v-model="passwordForm.password" show-password></el-input>
        </el-form-item>
      </el-form>
      <div style="display: flex; justify-content: space-around">
        <el-button @click="passwordVisible = false">取 消</el-button>
        <el-button type="primary" @click="editpwd">确 定</el-button>
      </div>
    </el-dialog>

    <el-dialog
      title="绑定楼盘"
      :visible.sync="houseVisible"
      width="800px"
      @close="houseClose"
    >
      <div class="bindchoice">
        <div style="line-height: 15px; margin-right: 10px">绑定方式</div>
        <el-radio-group v-model="bindFlag" @change="radioChange">
          <el-radio label="0">指定楼盘绑定</el-radio>
          <el-radio v-if="code.userRoleType!=6" label="1">按区域绑定</el-radio>
        </el-radio-group>
      </div>
      <div v-if="bindFlag == 0" class="con">
        <!-- 指定楼盘绑定 -->
        <el-form
          :inline="true"
          :model="searchhouseMsg"
          class="demo-form-inline"
          ref="searchhouseMsg"
        >
          <el-form-item label="楼盘名称" prop="orgName">
            <el-input
              v-model="searchhouseMsg.propertyName"
              maxlength="10"
              clearable
              placeholder="请输入楼盘名称"
            ></el-input>
          </el-form-item>
          <el-form-item label="省市" prop="">
            <el-cascader
              :props="props"
              @change="locationsChange"
              placeholder="省/市"
              size="small"
              separator="/"
              v-model="provice"
              clearable
            ></el-cascader>
          </el-form-item>
          <el-form-item label="绑定状态" prop="">
            <el-select
              v-model="searchhouseMsg.isSelected"
              clearable
              placeholder="请选择"
            >
              <el-option label="未绑定" value="1"></el-option>
              <el-option label="已绑定" value="0"></el-option>
            </el-select>
          </el-form-item>
          <el-form-item>
            <el-button type="primary" @click="searchHouse">查询</el-button>
            <el-button type="primary" @click="resetHouse">重置</el-button>
          </el-form-item>
        </el-form>
        <!-- table -->
        <div>
          <el-table
            :data="housedata"
            ref="multipleTable"
            @selection-change="handleSelectionChange1"
            border
            style="width: 100%"
            :header-cell-style="{ textAlign: 'center' }"
            :cell-style="{ textAlign: 'center' }"
          >
            <el-table-column type="selection" width="55"> </el-table-column>
            <el-table-column prop="propertyName" label="楼盘">
            </el-table-column>
            <el-table-column label="省市">
              <template slot-scope="{ row }">
                {{ row.provinceName || "--" }}-{{ row.cityName || "--" }}
              </template>
            </el-table-column>
            <el-table-column label="绑定">
              <template slot-scope="{ row }">
                {{ row.isSelected == 0 ? "已绑定" : "未绑定" }}
              </template>
            </el-table-column>
            <!-- <el-table-column
        prop="address"
        label="操作">
        <template slot-scope="scope">
          <el-button @click="bindhouse(scope.row)" type="text" size="small">{{scope.row.isSelected==0?'解绑':'绑定'}}</el-button>
        </template>
      </el-table-column> -->
          </el-table>
          <el-pagination
            style="text-align: center"
            background
            @size-change="handleSizeChange1"
            @current-change="handleCurrentChange1"
            :current-page.sync="page1.current"
            :page-size="page1.size"
            :total="page1.total"
          >
          </el-pagination>
        </div>
      </div>
      <div v-else class="cons">
        <!--区域楼盘绑定  -->
        <!-- 2 -->
        <div>
          <div class="area">
            <div style="line-height: 30px">选择大区：</div>
            <el-select
              v-model="managerStr"
              clearable
              collapse-tags
              multiple
              placeholder="请选择"
              @change="managerChange"
            >
              <!-- 选择大区 -->
              <el-option
                v-for="item1 in managerList"
                :key="item1.id"
                :label="item1.areaName"
                :value="item1.id"
                :disabled="item1.disabled"
              >
              </el-option>
            </el-select>
          </div>
          <div class="province" style="margin-top: 10px">
            <div class="left" style="line-height: 30px">选择城市：</div>
            <div class="right">
              <div v-for="(item, index) in firstList" :key="item.id">
                <div style="display: flex; margin: 5px">
                  <div style="line-height: 32px; margin-right: 10px">
                    {{ item.name }}
                  </div>
                  <el-select
                    v-model="item.cityIds"
                    clearable
                    multiple
                    placeholder="默认为全部"
                    style="width: 400px"
                  >
                    <el-option
                      v-for="item1 in item.cityAreaList"
                      :key="item1.id"
                      :label="item1.name"
                      :value="item1.id"
                    >
                    </el-option>
                  </el-select>
                  <div
                    style="line-height: 30px; margin-left: 10px; cursor: pointer;"
                    @click="delArea(index, 0)"
                  >
                    取消
                  </div>
                </div>
              </div>
              <div v-for="(item, index) in thirdList" :key="item.id">
                <div style="display: flex">
                  <div>
                    <el-select
                      v-model="item.areaId"
                      clearable
                      :disabled="item.disabled"
                      @change="areaChange(index, 0)"
                      placeholder="请选择"
                      style="width: 200px; margin-right: 20px"
                    >
                      <el-option
                        v-for="item1 in secondList"
                        :key="item1.id"
                        :label="item1.name"
                        :value="item1.id"
                        :disabled="item1.disabled"
                      >
                      </el-option>
                    </el-select>
                  </div>
                  <el-select
                    v-model="item.cityIds"
                    clearable
                    multiple
                    placeholder="默认为全部"
                    style="width: 400px"
                  >
                    <el-option
                      v-for="item1 in item.arr"
                      :key="item1.id"
                      :label="item1.name"
                      :value="item1.id"
                    >
                    </el-option>
                  </el-select>
                  <div
                    style="line-height: 30px; margin-left: 10px;cursor: pointer;"
                    @click="delArea(index, 1)"
                  >
                    取消
                  </div>
                </div>
              </div>
              <!-- 当没有选择区域的时候 -->
              <div v-if="managerStr.length == 0">
                <div v-for="(item, index) in fourthList" :key="item.id">
                  <div style="display: flex">
                    <div>
                      <el-select
                        v-if="!item.cityAreaList"
                        v-model="item.areaId"
                        clearable
                        :disabled="item.disabled"
                        @change="areaChange(index, 1)"
                        placeholder="请选择"
                        style="width: 200px; margin-right: 20px"
                      >
                        <el-option
                          v-for="item1 in allCityList"
                          :key="item1.id"
                          :label="item1.name"
                          :value="item1.id"
                          :disabled="item1.disabled"
                        >
                        </el-option>
                      </el-select>
                      <div v-else style="line-height: 32px; margin-right: 10px">
                        {{ item.name }}
                      </div>
                    </div>
                    <el-select
                      v-model="item.cityIds"
                      clearable
                      multiple
                      placeholder="默认为全部"
                      style="width: 400px"
                    >
                      <el-option
                        v-for="item1 in item.arr"
                        :key="item1.id"
                        :label="item1.name"
                        :value="item1.id"
                      >
                      </el-option>
                    </el-select>
                    <div
                      style="line-height: 30px; margin-left: 10px; cursor: pointer;"
                      @click="delArea(index, 1)"
                    >
                      取消
                    </div>
                  </div>
                </div>
              </div>
              <div style="line-height: 30px;  cursor: pointer;" @click="addArea">添加条件</div>
            </div>
          </div>
        </div>
      </div>
      <div style="display: flex; justify-content: space-around">
        <el-button @click="houseVisible = false">取 消</el-button>
        <el-button type="primary" @click="addHouse">确 定</el-button>
      </div>
    </el-dialog>
  </div>
</template>

<script>
import { getAreaList } from "@/api/modules/api";
import {
  addObj,
  delObj,
  delObj1,
  del1Obj,
  fetchList,
  putObj,
} from "@/api/admin/user";
import { getStore, setStore } from "@/util/store";
import { deptRoleList } from "@/api/admin/role";
import { fetchTree } from "@/api/admin/dept";
import { tableOption } from "@/const/crud/admin/user";
import { mapGetters } from "vuex";
import sidebarItemVue from "../../../page/index/sidebar/sidebarItem.vue";

export default {
  name: "SysUser",
  data() {
    var validatePass = (rule, value, callback) => {
      if (value === "") {
        callback(new Error("请输入手机号"));
      } else {
        if (value) {
          if (!/^1[3456789]\d{9}$/.test(value)) {
            // alert("手机号码不合法，请重新输入");
            callback(new Error("手机号格式错误，请重新输入"));
          }
        }
        callback();
      }
    };
    return {
      props: {
        lazy: true,
        async lazyLoad(node, resolve) {
          const { level } = node;
          if (level == 0) {
            // console.log(23);
            const { data } = await getAreaList({ parentId: 0 }); //获取省接口
            var nodes = data.map((item) => {
              return {
                value: item.id,
                label: item.name,
                leaf: false,
              };
            });
            resolve(nodes);
          } else if (level == 1) {
            const { data } = await getAreaList({ parentId: node.data.value }); //获取市接口
            var nodes = data.map((item) => {
              return {
                value: item.id,
                label: item.name,
                leaf: true,
              };
            });
            resolve(nodes);
          }
        },
      },
      managerStr: [],
      identityList: [],
      choseFlag: true,
      // 获取的区域列表
      arealist: [],
      parentAndKidList: [],
      originalData: [],
      firstList: [],
      secondList: [],
      thirdList: [],
      fourthList: [],
      allCityList: [],
      managerList: [],
      houseUserRoleType: "",
      bindFlag: "0",
      treeClick: "", //点击样式
      keywork: "", //搜索关键字
      selectLabel: "", //下拉框显示名称
      selectValue: "",
      orgFlag: false,
      roleFlag: false,
      identityFlag: false,
      editVisible: false,
      agentFlag: false,
      treeProps: {
        children: "children",
        label: "label",
      }, //下拉框显示ID
      searchForm: {},
      housedata: [],
      treeOption: {
        nodeKey: "id",
        addBtn: false,
        menu: false,
        props: {
          label: "name",
          value: "id",
        },
      },
      defaultProps1: {
        label: "name",
        value: "aid",
      },
      treeData: [],
      option: tableOption,
      treeDeptData: [],
      checkedKeys: [],
      roleProps: {
        label: "roleName",
        value: "roleId",
      },
      defaultProps: {
        label: "name",
        value: "id",
      },
      page: {
        total: 0, // 总页数
        current: 1, // 当前页数
        size: 10, // 每页显示多少条,
        isAsc: false, // 是否倒序
      },
      page1: {
        total: 0, // 总页数
        current: 1, // 当前页数
        size: 10, // 每页显示多少条,
        isAsc: false, // 是否倒序
      },
      list: [],
      listLoading: true,
      role: [],
      houseIdList: [],
      agentList: [],
      codeOrg: "",
      form: {
        name: "", //用户名
        username: "", //手机号
        sex: "0", //性别
        password: "", //密码
        orgType: "", //组织类型
        roleId: "", //角色id
        agentId: "", //代理商id
        orgCode: "", //公司标识
        userRoleType: "", //身份
        deptId: "", //部门
        houseId: "",
        showPhoneStatus: 0, //手机号显隐
      },
      formTwo: {
        username: "", //手机号
        userRoleType: "", //身份
        deptId: "", //部门
        roleId: "", //角色
        newRoleId: "",
        showPhoneStatus: 0, //手机号显隐
        userRoleType: "",
      },
      userRoleTypeList: [],
      userRoleList: [],
      phoneFlag: false,
      rolesOptions: [],
      checkHouse: [],
      searchMsg: {
        flag: "1",
        name: "", //用户名
        username: "", //登录名
        orgName: "", //所属组织
      },
      searchMsg1: {
        flag: "1",
        name: "", //用户名
        username: "", //登录名
        orgName: "", //所属组织
        userRoleType: "", //用户身份
        lockFlag: "", //状态
        queryOrgType: "", //组织类型
      },
      searchhouseMsg: {
        propertyName: "",
        isSelected: "",
        provinceId: "",
        cityId: "",
      },
      sign: "", //用户标示，0系统用户，1公司用户 2运营用户
      roleNameList: [],
      editFlag: false,
      addFlag: true,
      userList: [],
      provice: [],
      orgNameList: [],
      RoleByOrgCodeList: [],
      tableData: [],
      tableData1: [],
      checkRole: [],
      code: {},
      formTitle: "新增",
      deptList: [],
      dialogFormVisible: false,
      houseVisible: false,
      deptTreeList: [], //部门树
      roelFlag: false,
      losorgType: localStorage.getItem("orgType"),
      systemFlag: true, //判断是否为系统用户
      accountId: "",
      passwordForm: {
        password: "",
        userId: null,
      },
      phoneForm: {
        phone: "",
      },
      phoneVisible: false, //验证手机号
      userRoleFlag: true,
      passwordVisible: false,
      dialogFormVisibleTwo: false,
      orgList: [],
      phoneRules: {
        phone: [
          { required: true, message: "请填写手机号", trigger: "blur" },
          { validator: validatePass, trigger: "blur" },
        ],
      },
      passwordRules: {
        password: [
          { required: true, message: "请填写密码", trigger: "blur" },
          { min: 6, max: 11, message: "长度在 6 到 11 位", trigger: "blur" },
        ],
      },
      rulesTwo: {
        newRoleId: [{ required: true, message: "请选择角色", trigger: "blur" }],
      },
      rules: {
        username: [
          { required: true, message: "请填写登录手机", trigger: "blur" },
        ],
        name: [{ required: true, message: "请填写用户名", trigger: "blur" }],
        password: [
          { required: true, message: "请填写密码", trigger: "blur" },
          { min: 6, max: 11, message: "长度在 6 到 11 位", trigger: "blur" },
        ],
        orgType: [
          { required: true, message: "请选择组织类型", trigger: "blur" },
        ],
        agentId: [{ required: true, message: "请选择代理商", trigger: "blur" }],
        orgCode: [{ required: true, message: "请选择公司", trigger: "blur" }],
        roleId: [{ required: true, message: "请选择角色", trigger: "blur" }],
        userRoleType: [
          { required: true, message: "请选择角色身份", trigger: "blur" },
        ],
      },
      // 数据权限
      // sys_user_add:true,
      // sys_user_edit:true,
      // sys_user_del:true,
      // resetPassword:true,
    };
  },
  computed: {
    ...mapGetters(["permissions"]),
  },
  watch: {
    choseFlag(newval, oldval) {
      console.log(newval, oldval);
      this.page.current = 1;
      this.roleList();
      if (newval) {
        // 注册用户
      } else {
        //组织用户
      }
    },
    role() {
      this.form.role = this.role;
    },
    keywork(val) {
      // console.log(val);
      this.$refs.tree.filter(val);
    },
  },
  created() {
    // 权限
    this.sys_user_add = this.permissions["sys_user_add"];
    this.sys_user_edit = this.permissions["sys_user_edit"];
    this.sys_user_edit1 = this.permissions["sys_user_edit1"];
    this.sys_user_del = this.permissions["sys_user_del"];
    this.resetPassword = this.permissions["resetPassword"];
    this.sys_user_choseHouse = this.permissions["sys_user_choseHouse"];
    this.sys_user_bind = this.permissions["sys_user_bind"];
    // return
    // 获取用户信息
    let info = getStore({ name: "userInfo" });
    // this.sign=info.sign
    // this.orgCode = info.orgCode;
    this.orgCode = localStorage.getItem('orgCode');

    // 权限判断
    // 当他是系统用户时，显示所有，除系统用户之外只显示组织用户
    if (localStorage.getItem("orgType") != 0) {
      this.systemFlag = false;
      this.choseFlag = false;
    } else {
      this.systemFlag = true;
    }
    // console.log(info);
    this.roleList(); //table 列表
    // this.userDeptTree()// 获取部门树
    this.deptGetOrgList(); //获取公司列表
    this.getAgentList(); //获取代理商列表
      this.userDict(
      {
        dictKey: localStorage.getItem('orgType'),
        dictType: 3,
      },
      "userRoleList"
    );
  },
  methods: {
    // 区域改变
    managerChange() {
      console.log(this.managerStr);
      // 初始化数据
      this.firstList = [];
      this.secondList = [];
      this.thirdList = [];
      this.fourthList = [];
      if (this.managerStr.length == 0) {
        return;
      }
      this.getParentAndKidList();
    },
    // 通过地区串获取省市
    getParentAndKidList() {
      this.$api.api
        .getParentAndKidList({
          areaIds: this.managerStr.join(","),
        })
        .then((res) => {
          // console.log(res)
          // 获取区域下的省数据，对数据进行处理，首先将数据分为三个数组，一个是用来存储没有多选框的，一个用来存储有多选的，一个原始数据
          // 原始数据，用来比对数据和添加使用
          this.originalData = res.data;
          // 渲染第一个是text的数组
          // 这里不考虑禁用
          res.data.map((item) => {
            item.cityIds = "";
          });
          this.firstList = res.data;
          // 初始化数据
          this.secondList = [];
          this.thirdList = [];
          this.fourthList = [];
        });
    },
    // 删除区域
    delArea(idx, flag) {
      console.log(flag, idx);
      // 第一个删除
      if (flag == 0) {
        // 先获取删除数组的内容，将其内容放到第三个数组里面
        let obj = this.firstList[idx];
        // obj.areaId=''
        // // 这里需要有禁用选项
        // obj.disabled=false
        // // 给定一个空数组，当他的选择时将数组内容改变
        // obj.children=[]
        this.secondList.push(obj);
        console.log(this.secondList);
        // 删除数组的指定项
        this.firstList.splice(idx, 1);
      } else {
        let obj = this.fourthList[idx];
        this.secondList.push(obj);
        //  console.log(this.fourthList);
        // 删除数组的指定项
        this.fourthList.splice(idx, 1);
        // console.log(this.fourthList);
      }
    },
    // 点击添加时的操作
    addArea() {
      // 这是第一种情况
      if (this.managerStr.length > 0) {
        // 先判断第二个数组里面是否有数据,有的时候就可以添加没的时候提示
        if (this.secondList.length == 0) {
          this.$message.warning("没有更多啦！");
          return;
        }
        let num = 0;
        this.secondList.map((item) => {
          if (item.disabled) {
            num++;
          }
        });
        if (num == this.secondList.length) {
          this.$message.warning("不能选择更多啦");
          return;
        }
        // 在判断最后一项是否选择如果没选择则返回
        if (
          this.thirdList.length > 0 &&
          this.thirdList[this.thirdList.length - 1].areaId == ""
        ) {
          this.$message.warning("请选择最后一项在说");
          return;
        }
        // 然后将所有的都变为禁用
        // this.secondList.map(item=>{
        //   item.disabled=true
        // })
        this.thirdList.map((item) => {
          item.disabled = true;
        });
        // 在数组里面放入一个对象
        let obj = {
          cityIds: "",
          areaId: "",
          arr: [],
          disabled: false,
        };
        this.thirdList.push(obj);
      } else {
        if (
          this.fourthList.length > 0 &&
          this.fourthList[this.fourthList.length - 1].areaId == ""
        ) {
          this.$message.warning("请选择最后一项在说");
          return;
        }
        this.fourthList.map((item) => {
          item.disabled = true;
        });
        // 第二种情况，当没选择的时候
        let obj = {
          cityIds: "",
          areaId: "",
          arr: [],
          disabled: false,
        };
        this.fourthList.push(obj);
      }
    },
    houseClose() {
      this.managerStr = [];
      this.firstList = [];
      this.secondList = [];
      this.thirdList = [];
      this.fourthList = [];
      this.bindFlag = "0";
      this.provice = [];
      this.searchhouseMsg = {
        orgName: "",
        isSelected: "",
        provinceId: "",
        cityId: "",
      };
    },
    // 选择的区域地区改变时给数组的arr赋值
    async areaChange(idx, flag) {
      console.log(idx);
      // 第一种情况
      if (flag == 0) {
        // this.thirdList[idx].areaId
        // 循环数组获取到当前区域id下的数据给定第三个数组
        let num = this.secondList.findIndex(
          (item) => item.id == this.thirdList[idx].areaId
        );
        if (num != -1) {
          this.thirdList[idx].arr = this.secondList[num].cityAreaList;
          // this.secondList.splice(num,1)
          this.secondList[num].disabled = true;
        }
      } else {
        // 获取选中的id并且赋值
        let num = this.allCityList.findIndex(
          (item) => item.id == this.fourthList[idx].areaId
        );
        if (num != -1) {
          this.fourthList[idx].arr = await this.getValueByCondition(
            this.fourthList[idx].areaId
          );
          // this.secondList.splice(num,1)
          this.allCityList[num].disabled = true;
        }
      }
    },
    // 获取所有省
    async getValueByCondition(e) {
      let res = await this.$api.api.getValueByCondition({ pid: e });
      // console.log(res)
      return res.data;
    },
    // 下一步
    nextshow() {
      let that = this;
      this.$refs.phoneForm.validate((valid) => {
        if (valid) {
          // 验证电话号码
          this.$api.api.verPhone(this.phoneForm.phone).then((res) => {
            console.log(res);
            // 判断数据是否已经有了
            if (res.data) {
              // 由用户
              this.$api.api
                .userVerify({
                  orgType: localStorage.getItem("orgType"),
                  accountId: res.data.sysUser.accountId,
                  username: res.data.sysUser.username,
                  agentId: localStorage.getItem("agentId"),
                  orgCode: localStorage.getItem("orgCode"),
                })
                .then((res1) => {
                  // console.log(res1);
                  this.phoneFlag = true;
                  // console.log(res.data.sysUser);
                  this.form.name = res.data.sysUser.name;
                  this.form.username = res.data.sysUser.username;
                  this.form.sex = res.data.sysUser.sex;
                  this.phoneVisible = false;
                  this.dialogFormVisible = true;
                })
                .catch((err) => {
                  console.log(err);
                });
            } else {
              // 没有用户
              console.log("没有用户");
              this.form.username = this.phoneForm.phone;
              this.phoneFlag = false;
              this.phoneVisible = false;
              this.dialogFormVisible = true;
            }
          });
          // return
        }
      });
    },
    search() {
      this.page.current=1;
      console.log(this.searchMsg, "搜索内容1");
      // return
      this.roleList();
    },
    search1() {
      this.page.current = 1;
      console.log(this.searchMsg1, "搜索内容2");
      // return
      this.roleList();
    },
    flagchange(val) {
      // if(val==1){

      // }
      this.searchMsg.name = "";
      this.searchMsg.username = "";
    },
    flagchange1() {
      this.searchMsg1.name = "";
      this.searchMsg1.username = "";
    },
    reset() {
       this.page.current=1;
      this.searchMsg = {
        flag: "1",
        name: "", //用户名
        username: "", //登录名
        orgName: "", //所属组织
      };
      this.roleList();
    },
    reset1() {
       this.page.current=1;
      this.searchMsg1 = {
        flag: "1",
        name: "", //用户名
        username: "", //登录名
        orgName: "", //所属组织
        userRoleType: "", //用户身份
        lockFlag: "", //状态
        queryOrgType: "", //组织类型
      };
      this.roleList();
    },
    // 绑定方式改变
    radioChange(e) {
      console.log(e);
      this.firstList = [];
      this.secondList = [];
      this.thirdList = [];
      this.fourthList = [];
      this.managerStr = [];
      this.provice = [];
      this.searchhouseMsg = {
        propertyName: "",
        isSelected: "",
        provinceId: "",
        cityId: "",
      };
    },
    // 查询楼盘
    searchHouse() {
      this.gethouseList();
    },
    // /清空楼盘
    resetHouse() {
      this.searchhouseMsg = {
        propertyName: "",
        isSelected: "",
        provinceId: "",
        cityId: "",
      };
      this.provice = [];
      this.gethouseList();
    },
    // 绑定楼盘
    addHouse() {
      // 楼盘
      if (this.bindFlag == 0) {
        if (this.checkHouse.length == 0) {
          this.houseVisible = false;
          return;
        }
        this.$api.api
          .saveHouse({
            accountId: this.accountId,
            houseIds: this.checkHouse.join(","),
            orgCode: this.code.orgCode,
          })
          .then((res) => {
            console.log(res);
            this.houseVisible = false;
            this.roleList();
          });
      } else {
        // 省市json串
        let areaJsonString = [];
        // 地区id拼成串
        let areaIds = this.managerStr.join(",");
        // 区域选择
        // 两种情况
        if (areaIds) {
          // 当选择的是区域的时候
          this.firstList.map((item) => {
            let obj = {
              // 省
              provinceList: item.id,
              // 市
              cityList: item.cityIds.join(","),
            };
            areaJsonString.push(obj);
          });
          this.thirdList.map((item) => {
            let obj = {
              // 省
              provinceList: item.areaId,
              // 市
              cityList: item.cityIds.join(","),
            };
            areaJsonString.push(obj);
          });
        } else {
          this.fourthList.map((item) => {
            let obj = {
              // 省
              provinceList: item.areaId,
              // 市
              cityList: item.cityIds.join(","),
            };
            areaJsonString.push(obj);
          });
        }
        if (areaJsonString.length == 0) {
          this.houseVisible = false;
          return;
        }
        // console.log(areaJsonString,areaIds,'数据')
        // return
        this.$api.api
          .areaAdd({
            accountId: this.accountId,
            areaJsonString: JSON.stringify(areaJsonString),
            orgCode: this.code.orgCode,
            areaIds,
          })
          .then((res) => {
            console.log(res);
            this.houseVisible = false;
            this.roleList();
          });
      }
    },
    // 楼盘绑定解绑
    // bindhouse(e){
    //   // if(e.isSelected)
    //    this.$api.api.saveHouse()
    //    .then(res=>{
    //    })
    // },
    // 获取用户列表
    roleList() {
      // console.log(this.searchMsg1);
      // return
      if (this.choseFlag) {
        let orgId = "";
        if (localStorage.getItem("orgType") == 0) {
          orgId = "";
        } else if (localStorage.getItem("orgType") == 1) {
          orgId = localStorage.getItem("agentId");
        } else {
          orgId = localStorage.getItem("orgCode");
        }
        // 注册用户列表
        this.$api.api
          .registerUserList({
            ...this.page,
            ...this.searchMsg,
            orgType: localStorage.getItem("orgType"),
            orgId,
          })
          .then((res) => {
            // console.log(res);
            if (res.code == 0) {
              this.tableData = res.data.records;
              this.page.total = res.data.total;
            } else {
              this.$message.waring(res.msg);
            }
          });
      } else {
        // 组织用户列表
        this.$api.api
          .orgUserList({
            ...this.page,
            ...this.searchMsg1,
            orgType: localStorage.getItem("orgType"),
            orgCode: localStorage.getItem("orgCode"),
            agentId: localStorage.getItem("agentId"),
            houseId: localStorage.getItem("houseId"),
          })
          .then((res) => {
            // console.log(res);
            if (res.code == 0) {
              this.tableData1 = res.data.records;
              this.page.total = res.data.total;
            } else {
              this.$message.waring(res.msg);
            }
          });
      }
    },
    // 获取部门树
    userDeptTree() {
      this.$api.api.userDeptTree().then((res) => {
        // console.log(res);
        if (res.code == 0) {
          this.deptTreeList = res.data;
          this.codeOrg = res.data[0].orgCode;
        }
      });
    },
    // 去楼盘管理
    async gochosehouse(row) {
      console.log(row);
      this.code = row;
      this.houseUserRoleType = row.userRoleType;
      this.accountId = row.accountId;
      this.houseVisible = true;
      // 判断是否有绑定以及绑定方式
      // console.log(row.selectHouseType)
      if (row.selectHouseType == 1) {
        console.log("这里是单个楼盘勾选");
        this.bindFlag = "0";
      }
      else if (row.selectHouseType == 2) {
        this.bindFlag = "1";
        console.log("这里是区域选择");
        this.userAreaFind(row.accountId, row.username);
      }else{
        this.bindFlag = "0";
      }
      this.gethouseList();
      // 获取区域列表
      this.areamanagerList(row.orgCode);
      // 获取所有省列表
      // console.log(await this.getValueByCondition(0))
      this.allCityList = await this.getValueByCondition(0);
    },
    userAreaFind(accountId, username) {
      this.$api.api
        .userAreaFind({
          accountId,
          username,
        })
        .then((res) => {
          console.log(res);
          if (res.data.flag == "true") {
            // 区域
            // 给区域多选赋值，同时列表渲染给第一个数组firstList
            this.managerStr = [];
            res.data.user.areaIds.split(",").map((item) => {
              this.managerStr.push(item / 1);
            });
            this.firstList = res.data.area;
            this.firstList.map((item) => {
              let arr = [];
              if (item.cityIds == "empty") {
                return;
              } else {
                item.cityIds = item.cityIds.split(",").map(Number);
              }

              // console.log(arr);
            });
          } else {
            // 当不是区域的时候
            // 数据由于最后的判断原因应该给fourthlist
            this.fourthList = res.data.area;
            this.fourthList.map((item) => {
              // let arr = [];
              item.areaId = item.id;
              if (item.cityIds == "empty") {
                // 为所有，不做任何操作
              } else {
                item.cityIds = item.cityIds.split(",").map(Number);
                console.log(item.cityIds);
                // item.arr = item.cityAreaList;
              }
              item.arr = item.cityAreaList;
              // 再次对数据allCityList数据进行禁用处理
              let num = this.allCityList.findIndex(
                (item1) => item1.id == item.areaId
              );
              if (num != -1) {
                // this.secondList.splice(num,1)
                this.allCityList[num].disabled = true;
              }
              // console.log(arr);
            });
          }
        });
    },
    // 获取区域
    areamanagerList(orgCode) {
      this.$api.api
        .areamanagerList({
          orgCode,
        })
        .then((res) => {
          // console.log(res)
          this.managerList = res.data.records;
        });
    },
    // 获取楼盘列表
    gethouseList() {
      this.$api.api
        .houseListWhenAddUser({
          orgType: localStorage.getItem("orgType"),
          accountId: this.accountId,
          orgCode: this.orgCode,
          current: this.page1.current,
          size: this.page1.size,
          ...this.searchhouseMsg,
        })
        .then((res) => {
          // console.log(res)
          this.page1.total = res.data.total;
          this.housedata = res.data.records;
          let arr = [];
          res.data.records.map((item) => {
            if (item.isSelected == 0) {
              arr.push(item);
            }
          });
          // console.log(arr,'123');
          if (arr.length != 0 && this.bindFlag == 0) {
            setTimeout(() => {
              arr.map((item) => {
                this.$refs.multipleTable.toggleRowSelection(item);
              });
            }, 50);
          }
        });
    },
    // 获取用户信息
    getUserMsg(userId) {
      this.$api.api.getUserMsg({ userId }).then((res) => {
        console.log(res);
      });
    },
    // 多选
    handleSelectionChange(e) {
      this.checkRole = [];
      console.log(e);
      e.map((item) => {
        this.checkRole.push(item.id);
      });
    },
    handleSelectionChange1(e) {
      this.checkHouse = [];
      console.log(e);
      if (this.houseUserRoleType == 6 && e.length > 1) {
        // 单选
        // this.$refs.multipleTable.clearSelection();
        let idx = this.housedata.findIndex((item) => item.id == e[0].id);
        if (idx != -1) {
          this.$refs.multipleTable.toggleRowSelection(this.housedata[idx]);
        }
        this.$message.warning("您只能选择一个楼盘");

        return;
      }
      e.map((item) => {
        this.checkHouse.push(item.id);
      });
    },
    delIds() {
      console.log(this.checkRole);
      this.$api.api
        .userDelByIds({ ids: this.checkRole.join(",") })
        .then((res) => {
          console.log(res);
          if (res.code == 0) {
            this.$message.success("批量删除成功");
            this.roleList();
          }
        });
    },
    addRole() {
      this.phoneVisible = true;
      // this.dialogFormVisible=true
      this.addFlag = true;
      this.editFlag = false;
      this.form.orgType = localStorage.getItem("orgType") / 1;
      this.typeChange(this.form.orgType);
      this.formTitle = "添加";
    },
    // 编辑
    editRole(row, flag) {
      this.getUserMsg(row.username);
      flag ? (this.formTitle = "查看") : (this.formTitle = "编辑");
      this.addFlag = false;
      this.editFlag = flag;
      this.dialogFormVisible = true;
    },
    // 查询用户信息
    getUserMsg(username) {
      this.userRoleFlag = false;
      this.$api.api.getUserMsg({ username }).then((res) => {
        console.log(res);
        this.form = res.data.user;
        // 公司id
        // this.form.orgId = res.data.role.orgId;
        // res.data.houseList.map((item) => {
        //   this.houseIdList.push(item.id);
        // });
        // console.log(this.houseIdList);
        // 更改类型
        // this.codeOrg = res.data.org.orgCode;
        // this.form.houseIdList = this.houseIdList.join(",");
        // this.form.userRoleId = res.data.role.roleId;
        this.form.userRoleType = res.data.user.userRoleType / 1;
        this.form.deptId = res.data.user.id;
        // this.form.deptName = res.data.org.name;
        // this.roleChange(res.data.org.orgCode)
        console.log(this.form);
        this.roelFlag = true;
      });
    },
    // 添加
    add() {
      if (this.editFlag) {
        this.dialogFormVisible = false;
        return;
      }
      //  console.log(this.form);
      if (this.addFlag) {
        this.$refs.form.validate((valid) => {
          if (valid) {
            if (
              localStorage.getItem("orgType") == 2 ||
              localStorage.getItem("orgType") == 3
            ) {
              // console.log(123);
              this.form.orgCode = localStorage.getItem("orgCode");
            }
            this.$api.api.addUser(this.form).then((res) => {
              console.log(res);
              this.roleList();
              this.dialogFormVisible = false;
              // this.phoneFlag = false;
            });
          } else {
            console.log("error submit!!");
            return false;
          }
        });
      } else {
        this.$refs.form.validate((valid) => {
          if (valid) {
            this.$api.api.editUserMsg(this.form).then((res) => {
              // console.log(res);
              this.roleList();
              this.dialogFormVisible = false;
              // this.phoneFlag = false;
            });
          } else {
            console.log("error submit!!");
            return false;
          }
        });
      }
    },
    resetForm() {
      this.$refs.form.resetFields();
      //  this.form.deptName=''
      //  this.form.deptId=''
      //  this.form.userRoleId=''
      this.form = {
        name: "", //用户名
        username: "", //手机号
        sex: "0", //性别
        password: "", //密码
        orgType: "", //组织类型
        houseId: "",
        roleId: "", //角色id
        agentId: "", //代理商id
        orgCode: "", //公司标识
        userRoleType: "", //身份
        deptId: "",
        showPhoneStatus: 0,
      };
      this.roelFlag = false;
      this.houseIdList = [];
      this.orgFlag = false;
      this.roleFlag = false;
      this.identityFlag = false;
      this.agentFlag = false;
      this.phoneFlag = false;
    },
    // 重置用户密码
    resetPwd(row) {
      // console.log(row);
      this.passwordForm.userId = row.userId;
      this.passwordVisible = true;
    },
    queryOrgTypeChange(e){
          this.userDict(
      {
        dictKey: e,
        dictType: 3,
      },
      "userRoleList"
    );
    },
    editpwd() {
      // console.log(this.passwordForm);
      // return
      this.$refs.passwordForm.validate((valid) => {
        if (valid) {
          this.$api.api.resetPassword(this.passwordForm).then((res) => {
            // console.log(res);
            if (res.code == 0) {
              this.$notify.success("修改成功");
            }
            this.roleList();
            this.passwordVisible = false;
          });
        }
      });
    },
    // 删除用户信息
    delRole(row) {
      console.log(row);
    },
    startorg(row) {
      this.$confirm(
        "确定修改客户信息状态为" +
          (row.lockFlag == 0 ? "禁用" : "启用") +
          ", 是否继续?",
        "提示",
        {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          type: "warning",
        }
      ).then(() => {
        let obj = {};
        obj.accountId = row.accountId;
        obj.orgType = row.orgType;
        obj.lockFlag = row.lockFlag == 0 ? 1 : 0;
        this.$api.api.updateLockFlag(obj).then((res) => {
          console.log(res);
          if (res.code == 0) {
            this.$notify.success("修改成功");
            this.roleList();
          }
        });
        // delObj(row.userId)
        //   .then(() => {
        //     this.list.splice(index, 1)
        //     this.$notify.success('删除成功')
        //   }).catch(() => {
        //   this.$notify.error('删除失败')
        // })
      });
    },
    // 修改客户信息状态
    editStatus(row) {
      // console.log(row);
      this.$confirm(
        "确定修改客户信息状态为" +
          (row.showPhoneStatus == 0 ? "隐藏" : "显示") +
          ", 是否继续?",
        "提示",
        {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          type: "warning",
        }
      ).then(() => {
        let obj = {};
        obj.userId = row.id;
        obj.showPhoneStatus = row.showPhoneStatus == 0 ? 1 : 0;
        this.$api.api.updateShowPhoneStatus(obj).then((res) => {
          console.log(res);
          if (res.code == 0) {
            this.$notify.success("修改成功");
            this.roleList();
          }
        });
        // delObj(row.userId)
        //   .then(() => {
        //     this.list.splice(index, 1)
        //     this.$notify.success('删除成功')
        //   }).catch(() => {
        //   this.$notify.error('删除失败')
        // })
      });
    },
    // 获取公司列表
    deptGetOrgList() {
      this.$api.api
        .findMyOrg({ orgType: localStorage.getItem("orgType") })
        .then((res) => {
          console.log(res);
          this.orgList = res.data;
        });
    },
    getAgentList() {
      // console.log(localStorage.getItem('orgType'))
      this.$api.api
        .findMyAgent({ orgType: localStorage.getItem("orgType") })
        .then((res) => {
          // console.log(res)
          this.agentList = res.data;
        });
    },
    //分页器
    handleSizeChange(val) {
      this.page.size = val;
      this.roleList();
      console.log(`每页 ${val} 条`);
    },
    handleCurrentChange(val) {
      console.log(`当前页: ${val}`);
      this.page.current = val;
      this.roleList();
    },
    //分页器
    handleSizeChange1(val) {
      this.page1.size = val;
      this.gethouseList();
      console.log(`每页 ${val} 条`);
    },
    handleCurrentChange1(val) {
      console.log(`当前页: ${val}`);
      this.page1.current = val;
      this.gethouseList();
    },
    roleChange(e = "") {
      this.roelFlag = true;
      this.$api.api
        .roleList({
          orgCode: e,
        })
        .then((res) => {
          console.log(res);
          if (res.code == 0) {
            this.RoleByOrgCodeList = res.data;
          }
        });
    },
    selectClear() {
      this.treeClick = "";
      this.form.deptName = "";
      this.form.deptId = "";
      this.roelFlag = false;
    },
    filterNode(value, data) {
      // console.log(value,data);
      if (!value) {
        return true;
      }
      return data.name.indexOf(value) !== -1;
    },
    radioBlur() {
      this.roleChange(this.codeOrg);
    },
    nodeClick(e) {
      // console.log('e改变');
      if (!e) return;
      if (this.userRoleFlag) {
        this.form.userRoleId = "";
      }
      if (!this.addFlag) {
        try {
          this.userRoleFlag = true;
          this.roleChange(this.$refs.tree.node[0].orgCode);
        } catch {
          this.roleChange(this.codeOrg);
        }
        console.log(this.codeOrg, 123);
      } else {
        // console.log('触发');
        console.log(this.$refs.tree.node[0]);
        this.codeOrg = this.$refs.tree.node[0].orgCode;
        this.roleChange(this.$refs.tree.node[0].orgCode);
      }
    },
    // nodeClick(e){
    //   if(e) return
    //   console.log(this.$refs.tree.node[0].orgCode);
    //   // return
    //   this.treeClick = obj.aid;
    //   this.form.deptName = obj.name;
    //   this.form.deptId = obj.aid;
    //   this.form.userRoleId=''
    //   this.roleChange(obj.orgCode)
    // },
    checkChange(obj, node) {
      console.log(obj, node);
    },
    orgCodeChange(e, idx) {
      // console.log(e);
      this.form.roleId = "";
      if (idx == 0) {
        this.$api.api
          .findRoleByOrgCode({
            orgType: this.form.orgType,
            orgCode: e,
          })
          .then((res) => {
            this.userList = res.data;
          });
      } else {
        this.$api.api
          .findRoleByOrgCode({
            orgType: this.form.orgType,
            agentId: e,
          })
          .then((res) => {
            this.userList = res.data;
          });
      }
      this.$forceUpdate();
    },
    editTwo(row) {
      this.formTwo.username = row.username;
      this.formTwo.showPhoneStatus = row.showPhoneStatus;
      this.formTwo.roleId = row.roleId;
      this.form.orgType = row.orgType;
      this.formTwo.accountId = row.accountId;
      this.formTwo.orgType = row.orgType;
      this.formTwo.houseId = row.houseId;
      this.formTwo.newRoleId = row.roleId;
      this.formTwo.deptId = row.deptId;
      this.formTwo.userRoleType = row.userRoleType + "";
      console.log(this.formTwo);
      // 获取角色列表
      this.typeChange1(row);
      let obj = {
        dictKey: row.orgType,
        dictType: 3,
      };
      if (row.userRoleType != 6) {
        obj.notInValue = 6;
      }
      this.userDict(obj, "userRoleTypeList");

      // 获取部门列表
      this.dialogFormVisibleTwo = true;
    },
    editSureTwo() {
      this.$refs.formTwo.validate((valid) => {
        if (valid) {
          console.log(this.formTwo);
          this.$api.api.editRoleAndDept(this.formTwo).then((res) => {
            this.$message.success("修改成功");
            this.dialogFormVisibleTwo = false;
            this.roleList();
          });
        }
      });
    },
    getDeptList(houseId) {
      this.$api.api
        .deptFindList({
          houseId,
        })
        .then((res) => {
          this.deptList = res.data;
        });
    },
    typeChange1(row) {
      console.log(row);
      this.userList = [];
      this.identityList = [];
      if (row.orgType == 0) {
        // 平台 只显示角色
        this.orgFlag = false;
        this.$api.api
          .findRoleByOrgCode({
            orgType: this.form.orgType,
            orgCode: null,
            agentId: null,
          })
          .then((res) => {
            this.userList = res.data;
          });
      } else if (row.orgType == 1) {
        // 代理商 选择代理商和角色
        this.orgFlag = false;
        this.orgCodeChange(row.agentId, 1);
      } else if (row.orgType == 2) {
        // 公司  选择公司和角色
        this.orgFlag = false;
        this.orgCodeChange(row.orgCode, 0);
      } else {
        // 楼盘  选择公司 角色 角色身份
        this.orgFlag = true;
        this.orgCodeChange(row.orgCode, 0);
        this.getDeptList(row.houseId);
      }
    },
    typeChange(e) {
      console.log(e);
      this.userList = [];
      this.form.userRoleType = "";
      this.identityList = [];
      if (e == 0) {
        // 平台 只显示角色
        // this.orgFlag = false;
        this.roleFlag = true;
        this.identityFlag = true;
        // this.agentFlag = false;
        this.$api.api
          .findRoleByOrgCode({
            orgType: this.form.orgType,
            orgCode: null,
            agentId: null,
          })
          .then((res) => {
            this.userList = res.data;
          });
      } else if (e == 1) {
        // 代理商 选择代理商和角色
        // this.orgFlag = false;
        this.roleFlag = true;
        this.identityFlag = true;
        // this.agentFlag = true;
        this.form.agentId = localStorage.getItem("agentId");
        this.orgCodeChange(localStorage.getItem("agentId"), 1);
      } else if (e == 2) {
        // 公司  选择公司和角色
        // this.orgFlag = true;
        this.roleFlag = true;
        this.identityFlag = true;
        // this.agentFlag = false;
        this.form.orgCode = localStorage.getItem("orgCode");
        this.orgCodeChange(localStorage.getItem("orgCode"), 0);
      } else {
        // 楼盘  选择公司 角色 角色身份
        this.orgFlag = true;
        this.roleFlag = true;
        this.identityFlag = true;
        // this.agentFlag = false;
        this.form.houseId = localStorage.getItem("houseId");
        this.orgCodeChange(localStorage.getItem("orgCode"), 0);
        this.getDeptList(localStorage.getItem("houseId"));
      }
      // 字典表接口
      this.userDict(
        {
          dictKey: e,
          dictType: 3,
        },
        "identityList"
      );
    },
    userDict(obj, str) {
      this.$api.api.userDict(obj).then((res) => {
        console.log(res);
        this[str] = res.data;
      });
    },
    getList(page, params) {
      this.listLoading = true;
      fetchList(
        Object.assign(
          {
            current: page.currentPage,
            size: page.size,
          },
          params,
          this.searchForm
        )
      ).then((response) => {
        console.log(response);
        this.list = response.data.records;
        this.page.total = response.data.total;
        this.listLoading = false;
      });
    },
    searchChange(param, done) {
      this.searchForm = param;
      this.page.currentPage = 1;
      this.getList(this.page, param);
      done();
    },
    sizeChange(size) {
      this.page.size = size;
    },
    currentChange(current) {
      this.page.currentPage = current;
    },
    refreshChange() {
      this.getList(this.page);
    },
    handleOpenBefore(show, type) {
      window.boxType = type;
      // 查询部门树
      fetchTree().then((response) => {
        this.treeDeptData = response.data;
      });
      // 查询角色列表
      deptRoleList().then((response) => {
        this.rolesOptions = response.data;
      });

      if (["edit", "views"].includes(type)) {
        this.role = [];
        for (let i = 0; i < this.form.roleList.length; i++) {
          this.role[i] = this.form.roleList[i].roleId;
        }
      } else if (type === "add") {
        this.role = [];
        this.form.username = undefined;
        this.form.phone = undefined;
        this.form.password = undefined;
      }
      show();
    },
    handleUpdate(row, index) {
      this.$refs.crud.rowEdit(row, index);
      this.form.password = undefined;
    },
    create(row, done, loading) {
      if (this.form.phone && this.form.phone.indexOf("*") > 0) {
        this.form.phone = undefined;
      }
      addObj(this.form)
        .then(() => {
          this.getList(this.page);
          done();
          this.$notify.success("创建成功");
        })
        .catch(() => {
          loading();
        });
    },
    update(row, index, done, loading) {
      if (this.form.phone && this.form.phone.indexOf("*") > 0) {
        this.form.phone = undefined;
      }
      putObj(this.form)
        .then(() => {
          this.getList(this.page);
          done();
          this.$notify.success("修改成功");
        })
        .catch(() => {
          loading();
        });
    },
    deletes(row) {
      this.$confirm(
        "此操作将永久删除该用户(用户名:" + row.username + "), 是否继续?",
        "提示",
        {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          type: "warning",
        }
      ).then(() => {
        console.log(row);
        console.log(row.userId, "123");
        if (this.choseFlag) {
          delObj(row.userId).then(() => {
            this.roleList();
            this.$notify.success("删除成功");
          });
        } else {
          delObj1({
            id: row.id,
            orgType: row.orgType,
            accountId: row.accountId,
          }).then(() => {
            this.roleList();
            this.$notify.success("删除成功");
          });
        }

        // .catch(() => {
        // this.$notify.error('删除失败')
        // })
      });
    },
    locationsChange(e) {
      console.log(e);
      if (!e) return;
      this.searchhouseMsg.provinceId = e[0];
      this.searchhouseMsg.cityId = e[1];
    },
  },
};
</script>
<style lang="scss" scoped>
.cons {
  margin-top: 10px;
}
.user {
  height: 100%;
  &__tree {
    padding-top: 3px;
    padding-right: 20px;
  }

  &__main {
    .el-card__body {
      padding-top: 0;
    }
  }
}
.tree-click {
  color: #4d74d6;
  font-weight: 600;
}
.tabcenbox {
  display: flex;
  width: 100%;
  height: 38px;
  text-align: center;
  margin: 10px;

  .ch1 {
    background: cornflowerblue;
    color: #fff;
  }
  .ch2 {
    color: #ccc;
  }
}
.tabcenbox div {
  width: 120px;
  border: 1px solid #ccc;
  text-align: center;
  line-height: 38px;
}
// .top{
//   /deep/ .el-form-item__content{
//     display: inline-flex ;
//   }
// }
.input-with-select .el-input-group__prepend {
  background-color: #fff;
}
.bindchoice {
  display: flex;
  margin-top: 20px;
}
.con {
  margin-top: 20px;
  padding: 20px;
  border-radius: 4px;
  background: #ffff;
}
.area {
  display: flex;
}
.province {
  display: flex;
  .right {
    // display: flex;
  }
}
</style>