<template>
  <div class="mod-user">
    <el-form :inline="true" :model="dataForm" @keyup.enter.native="getDataList()">
      <el-form-item>
        <el-input v-model="dataForm.userName" placeholder="用户账号" clearable></el-input>
      </el-form-item>
      <el-form-item>
        <el-input v-model="dataForm.userDisplay" placeholder="用户名" clearable></el-input>
      </el-form-item>
      <el-form-item>
        <el-button @click="getDataList" type="primary">{{ buttons.search || '查询' }}</el-button>
        <el-button v-if="isAuth('sys:user:save')" type="primary" @click="addOrUpdateHandle()">{{ buttons.add || '新增' }}</el-button>
        <el-button v-if="isAuth('sys:user:save')" :disabled="this.showButton" type="primary" @click="siteAuthorize()">{{ buttons.factoryAuthorization || '工厂授权' }}</el-button>
        <el-button v-if="isAuth('sys:user:save')" :disabled="this.showButton" type="primary" @click="buAuthorize()">{{ buttons.buAuthorization || 'BU授权' }}</el-button>
        <el-button v-if="isAuth('sys:user:save')" :disabled="this.showButton" type="primary" @click="viewUserDept()">{{ buttons.viewUserDept || '查看部门' }}</el-button>
        <el-button v-if="isAuth('sys:user:save')" :disabled="this.showButton" type="primary" @click="deptAuthorize()">{{ buttons.deptAuthorization || '部门授权' }}</el-button>
        <el-button v-if="isAuth('sys:user:save')" :disabled="this.showButton" type="primary" @click="businessRoleAuthorize()">{{ buttons.businessRoleAuthorization || '岗位' }}
        </el-button>
      </el-form-item>
    </el-form>
    <el-table
      :data="dataList"
      border
      :height="height"
      v-loading="dataListLoading"
      @selection-change="selectionChangeHandle"
      highlight-current-row
      @current-change="handleCurrentChange"
      style="width: 100%;">
      <el-table-column
        prop="username"
        header-align="center"
        align="center"
        :label="buttons.username||'用户账号'">
      </el-table-column>
      <el-table-column
        prop="userDisplay"
        header-align="center"
        align="center"
        :label="buttons.userDisplay||'用户名'">
      </el-table-column>
      <el-table-column
        prop="email"
        header-align="center"
        align="center"
        :label="buttons.email||'邮箱'">
      </el-table-column>
      <el-table-column
        prop="mobile"
        header-align="center"
        align="center"
        :label="buttons.mobile||'手机号'">
      </el-table-column>
      <el-table-column
        prop="status"
        header-align="center"
        align="center"
        :label="buttons.status||'状态'">
        <template slot-scope="scope">
          <el-link v-if="scope.row.status === 0" type="success">{{ buttons.disable || '禁用' }}</el-link>
          <el-link v-else type="danger">{{ buttons.normal || '正常' }}</el-link>
        </template>
      </el-table-column>
      <el-table-column
        prop="createTime"
        header-align="center"
        align="center"
        width="180"
        :label="buttons.createTime||'创建时间'">
      </el-table-column>
      <el-table-column
        prop="workShopName"
        header-align="center"
        align="center"
        :label="'车间'">
      </el-table-column>
      <el-table-column
        prop="supplierNo"
        header-align="center"
        align="left"
        :label="'供应商编码'">
      </el-table-column>
      <el-table-column
        fixed="right"
        header-align="center"
        align="center"
        width="150"
        :label="buttons.cz||'操作'">
        <template slot-scope="scope">
          <a v-if="!adminUser && scope.row.userId === 1" type="text" size="small" style="pointer-events:none;color: #8a979e">{{ buttons.edit || '修改' }}</a>
          <a v-if="!adminUser && scope.row.userId !== 1" type="text" size="small" @click="addOrUpdateHandle(scope.row.userId)">{{ buttons.edit || '修改' }}</a>
          <a v-if="adminUser" type="text" size="small" @click="addOrUpdateHandle(scope.row.userId)">{{ buttons.edit || '修改' }}</a>
          <a v-if="!adminUser && scope.row.userId === 1" type="text" size="small" style="pointer-events:none;color: #8a979e">{{ buttons.delete || '删除' }}</a>
          <a v-if="!adminUser && scope.row.userId !== 1" type="text" size="small" @click="deleteHandle(scope.row.userId)">{{ buttons.delete || '删除' }}</a>
          <a v-if="adminUser" type="text" size="small" @click="deleteHandle(scope.row.userId)">{{ buttons.delete || '删除' }}</a>
        </template>
      </el-table-column>
    </el-table>

    <el-pagination
      @size-change="sizeChangeHandle"
      @current-change="currentChangeHandle"
      :current-page="pageIndex"
      :page-sizes="[20, 50, 100, 200,500]"
      :page-size="pageSize"
      :total="totalPage"
      layout="total, sizes, prev, pager, next, jumper">
    </el-pagination>

    <!-- 弹窗, 新增 / 修改 -->
    <add-or-update v-if="addOrUpdateVisible" ref="addOrUpdate" @refreshDataList="getDataList" @close="closeDialog"></add-or-update>
    <!--  审核权限   -->
    <el-dialog :close-on-click-modal="false" :close-on-press-escape="false" v-drag :title="inputSearch1" :visible.sync="setUp.reviewFlag" width="518px">
      <template>
        <el-transfer v-model="checked" :data="transferData" :titles="[buttons.allAuth || '所有权限', buttons.currentAuth || '当前权限']"></el-transfer>
      </template>
      <span slot="footer" class="dialog-footer">
         <div style="margin-top: 5px">
            <el-button type="primary" :disabled="setUp.saveButton" @click="saveUserRoleFlag()">确定</el-button>
            <el-button type="primary" @click="setUp.reviewFlag = false">取消</el-button>
         </div>
      </span>
    </el-dialog>
    <!--  特殊权限  -->
    <el-dialog
      v-drag
      :title="'特殊性权限'"
      :visible.sync="specialVisible"
      width="820px"
      :append-to-body="true">
      <el-table
        :data="securityList"
        border
        :height="securityHeight"
        v-loading="dataListLoading"
        style="width: 100%;">
        <el-table-column
          v-for="(item,index) in columnList" :key="index"
          :sortable="item.columnSortable"
          :prop="item.columnProp"
          :header-align="item.headerAlign"
          :show-overflow-tooltip="item.showOverflowTooltip"
          :align="item.align"
          :fixed="item.fixed==''?false:item.fixed"
          :min-width="item.columnWidth"
          :label="item.columnLabel">
          <template slot-scope="scope">
            <span v-if="!item.columnHidden"> {{ scope.row[item.columnProp] }}</span>
            <span v-if="item.columnHidden">
              <el-checkbox v-model="scope.row[item.columnProp] "></el-checkbox>
            </span>
            <span v-if="item.columnImage"><img :src="scope.row[item.columnProp]" style="width: 100px; height: 80px"/></span>
          </template>
        </el-table-column>
      </el-table>
      <span slot="footer" class="dialog-footer">
        <el-button type="primary" @click="saveUserSecurity()">确定</el-button>
        <el-button @click="specialVisible = false" type="primary">取消</el-button>
    </span>
    </el-dialog>


    <!--  BU授权  -->
    <el-dialog
      style="font-size: 12px"
      v-drag
      :title="'BU授权'"
      :visible.sync="buVisible"
      width="518px"
      :append-to-body="true">
      <el-transfer
        class="rq"
        filterable
        v-model="selectBUList"
        :props="{key: 'buNo', label: 'buDesc'}" :data="buList" :titles="['未授权BU', '已授权BU']">
      </el-transfer>
      <span slot="footer" class="dialog-footer">
        <div style="margin-top: 5px">
          <el-button type="primary" @click="saveBuAssessSite()">确定</el-button>
          <el-button @click="buVisible = false" type="primary">取消</el-button>
        </div>
      </span>
    </el-dialog>
    <!--  查看用户部门（Access_dept）  -->
    <el-dialog
      :title="'用户部门 — ' + (selectUser && selectUser.username ? selectUser.username : '')"
      :close-on-click-modal="false"
      v-drag
      :visible.sync="userDeptModalVisible"
      width="900px"
      append-to-body>
      <el-table
        :data="userDeptList"
        border
        v-loading="userDeptLoading"
        height="400"
        style="width: 100%">
        <el-table-column prop="site" header-align="center" align="center" min-width="70" label="工厂"></el-table-column>
        <el-table-column prop="buNo" header-align="center" align="center" min-width="80" label="BU"></el-table-column>
        <el-table-column prop="buDesc" header-align="center" align="left" min-width="100" label="BU名称" show-overflow-tooltip></el-table-column>
        <el-table-column prop="departmentId" header-align="center" align="center" min-width="90" label="部门编码"></el-table-column>
        <el-table-column prop="departmentName" header-align="center" align="left" min-width="100" label="部门名称" show-overflow-tooltip></el-table-column>
        <el-table-column prop="jobTitle" header-align="center" align="left" min-width="90" label="职称" show-overflow-tooltip></el-table-column>
        <el-table-column prop="deptManagerFlag" header-align="center" align="center" width="90" label="部门经理"></el-table-column>
        <el-table-column prop="superiorUsername" header-align="center" align="center" min-width="90" label="上级"></el-table-column>
      </el-table>
      <el-footer style="height:40px;margin-top: 16px;text-align:center">
        <el-button type="primary" @click="userDeptModalVisible = false">关闭</el-button>
      </el-footer>
    </el-dialog>

    <!--  岗位  -->
    <el-dialog
      style="font-size: 12px"
      v-drag
      :title="'岗位'"
      :visible.sync="businessRoleVisible"
      width="518px"
      :append-to-body="true">
      <el-transfer
        class="rq"
        filterable
        v-model="selectBusinessRoleList"
        :props="{key: 'roleNo', label: 'roleDesc'}" :data="businessRoleList" :titles="['未授权角色', '已授权角色']">
      </el-transfer>
      <span slot="footer" class="dialog-footer">
        <div style="margin-top: 5px">
          <el-button type="primary" @click="saveBusinessRoleSite()">确定</el-button>
          <el-button @click="businessRoleVisible = false" type="primary">取消</el-button>
        </div>
      </span>
    </el-dialog>

    <!-- 新增用户site -->
    <el-dialog title="工厂" :close-on-click-modal="false" v-drag :visible.sync="siteAddModal" width="900px">
      <div style="font-size: 12px">
        <el-form :inline="true" label-position="top" :model="siteData">
          <el-form-item :label="'工厂编码'">
            <el-input v-model="siteData.siteid" clearable style="width: 120px"></el-input>
          </el-form-item>
          <el-form-item :label="'工厂名称'">
            <el-input v-model="siteData.sitename" clearable style="width: 200px"></el-input>
          </el-form-item>
          <el-form-item :label="' '">
            <el-button type="primary" @click="getSite()">查询</el-button>
          </el-form-item>
        </el-form>
      </div>
      <el-container style="margin-top: 0px;">
        <el-main style="width: 400px; padding: 1px">
          <span style="font-size: 12px" >可选工厂</span>
          <el-table
            height="400px"
            :data="siteList1"
            border
            ref="siteTable1"
            @row-click="siteClickRow1"
            @selection-change="selectionSite1"
            highlight-current-row
            style="width: 100%">
            <el-table-column
              type="selection"
              header-align="center"
              align="center"
              :selectable="selectFlag"
              width="50">
            </el-table-column>
            <el-table-column
              prop="siteid"
              header-align="center"
              align="center"
              min-width="80"
              label="工厂编码">
            </el-table-column>
            <el-table-column
              prop="sitename"
              header-align="center"
              align="center"
              min-width="120"
              label="工厂名称">
            </el-table-column>
          </el-table>
        </el-main>
        <el-main style="width: 111px;padding: 1px">
          <div style="margin-top: 182px;margin-left: 18px">
            <el-button type="primary" @click="addSite()">添加>></el-button>
          </div>
          <div style="margin-top: 15px;margin-left: 18px">
            <el-button type="primary" @click="deleteSite()">删除<<</el-button>
          </div>
        </el-main>
        <el-main style="width: 400px;padding: 1px">
          <span style="font-size: 12px" >已有工厂</span>
          <el-table
            height="400px"
            :data="siteList2"
            border
            ref="siteTable2"
            @row-click="siteClickRow2"
            @selection-change="selectionSite2"
            highlight-current-row
            style="width: 100%">
            <el-table-column
              type="selection"
              header-align="center"
              align="center"
              :selectable="selectFlag"
              width="50">
            </el-table-column>
            <el-table-column
              prop="siteid"
              header-align="center"
              align="center"
              min-width="80"
              label="工厂编码">
            </el-table-column>
            <el-table-column
              prop="sitename"
              header-align="center"
              align="center"
              min-width="120"
              label="工厂名称">
            </el-table-column>
          </el-table>
        </el-main>
      </el-container>
      <el-footer style="height:40px;margin-top: 20px;text-align:center">
        <el-button type="primary" @click="siteAddModal = false">关闭</el-button>
      </el-footer>
    </el-dialog>

    <!-- 新增用户bu -->
    <el-dialog title="BU" :close-on-click-modal="false" v-drag :visible.sync="buAddModal" width="900px">
      <div style="font-size: 12px">
        <el-form :inline="true" label-position="top" :model="buData">
          <el-form-item :label="'工厂编码'">
            <el-input v-model="buData.site" clearable style="width: 120px"></el-input>
          </el-form-item>
          <el-form-item :label="'BU编码'">
            <el-input v-model="buData.buNo" clearable style="width: 120px"></el-input>
          </el-form-item>
          <el-form-item :label="'BU名称'">
            <el-input v-model="buData.buDesc" clearable style="width: 200px"></el-input>
          </el-form-item>
          <el-form-item :label="' '">
            <el-button type="primary" @click="getBu()">查询</el-button>
          </el-form-item>
        </el-form>
      </div>
      <el-container style="margin-top: 0px;">
        <el-main style="width: 400px; padding: 1px">
          <span style="font-size: 12px" >可选BU</span>
          <el-table
            height="400px"
            :data="buList1"
            border
            ref="buTable1"
            @row-click="buClickRow1"
            @selection-change="selectionBu1"
            highlight-current-row
            style="width: 100%">
            <el-table-column
              type="selection"
              header-align="center"
              align="center"
              :selectable="selectFlag"
              width="50">
            </el-table-column>
            <el-table-column
              prop="site"
              header-align="center"
              align="center"
              min-width="80"
              label="工厂编码">
            </el-table-column>
            <el-table-column
              prop="buNo"
              header-align="center"
              align="center"
              min-width="80"
              label="BU编码">
            </el-table-column>
            <el-table-column
              prop="buDesc"
              header-align="center"
              align="center"
              min-width="120"
              label="BU名称">
            </el-table-column>
          </el-table>
        </el-main>
        <el-main style="width: 111px;padding: 1px">
          <div style="margin-top: 182px;margin-left: 18px">
            <el-button type="primary" @click="addBu()">添加>></el-button>
          </div>
          <div style="margin-top: 15px;margin-left: 18px">
            <el-button type="primary" @click="deleteBu()">删除<<</el-button>
          </div>
        </el-main>
        <el-main style="width: 400px;padding: 1px">
          <span style="font-size: 12px" >已有BU</span>
          <el-table
            height="400px"
            :data="buList2"
            border
            ref="buTable2"
            @row-click="buClickRow2"
            @selection-change="selectionBu2"
            highlight-current-row
            style="width: 100%">
            <el-table-column
              type="selection"
              header-align="center"
              align="center"
              :selectable="selectFlag"
              width="50">
            </el-table-column>
            <el-table-column
              prop="site"
              header-align="center"
              align="center"
              min-width="80"
              label="工厂编码">
            </el-table-column>
            <el-table-column
              prop="buNo"
              header-align="center"
              align="center"
              min-width="80"
              label="BU编码">
            </el-table-column>
            <el-table-column
              prop="buDesc"
              header-align="center"
              align="center"
              min-width="120"
              label="BU名称">
            </el-table-column>
          </el-table>
        </el-main>
      </el-container>
      <el-footer style="height:40px;margin-top: 20px;text-align:center">
        <el-button type="primary" @click="buAddModal = false">关闭</el-button>
      </el-footer>
    </el-dialog>

    <!-- 新增用户部门 -->
    <el-dialog title="部门" :close-on-click-modal="false" v-drag :visible.sync="deptAddModal" width="900px">
      <div style="font-size: 12px">
        <el-form :inline="true" label-position="top" :model="deptData">
          <el-form-item :label="'部门编码'">
            <el-input v-model="deptData.departmentId" clearable style="width: 120px"></el-input>
          </el-form-item>
          <el-form-item :label="'部门名称'">
            <el-input v-model="deptData.departmentName" clearable style="width: 200px"></el-input>
          </el-form-item>
          <el-form-item :label="' '">
            <el-button type="primary" @click="getDept()">查询</el-button>
          </el-form-item>
        </el-form>
      </div>
      <el-container style="margin-top: 0px;">
        <el-main style="width: 400px; padding: 1px">
          <span style="font-size: 12px" >可选部门</span>
          <el-table
            height="400px"
            :data="deptList1"
            border
            ref="deptTable1"
            @row-click="deptClickRow1"
            @selection-change="selectionDept1"
            highlight-current-row
            style="width: 100%">
            <el-table-column
              type="selection"
              header-align="center"
              align="center"
              :selectable="selectFlag"
              width="50">
            </el-table-column>
            <el-table-column
              prop="buDesc"
              header-align="center"
              align="center"
              min-width="80"
              label="BU">
            </el-table-column>
            <el-table-column
              prop="departmentId"
              header-align="center"
              align="center"
              min-width="80"
              label="部门编码">
            </el-table-column>
            <el-table-column
              prop="departmentName"
              header-align="center"
              align="center"
              min-width="120"
              label="部门名称">
            </el-table-column>
          </el-table>
        </el-main>
        <el-main style="width: 111px;padding: 1px">
          <div style="margin-top: 182px;margin-left: 18px">
            <el-button type="primary" @click="addDept()">添加>></el-button>
          </div>
          <div style="margin-top: 15px;margin-left: 18px">
            <el-button type="primary" @click="deleteDept()">删除<<</el-button>
          </div>
        </el-main>
        <el-main style="width: 400px;padding: 1px">
          <span style="font-size: 12px" >已有部门</span>
          <el-table
            height="400px"
            :data="deptList2"
            border
            ref="deptTable2"
            @row-click="deptClickRow2"
            @selection-change="selectionDept2"
            highlight-current-row
            style="width: 100%">
            <el-table-column
              type="selection"
              header-align="center"
              align="center"
              :selectable="selectFlag"
              width="50">
            </el-table-column>
            <el-table-column
              prop="buDesc"
              header-align="center"
              align="center"
              min-width="80"
              label="BU">
            </el-table-column>
            <el-table-column
              prop="departmentId"
              header-align="center"
              align="center"
              min-width="80"
              label="部门编码">
            </el-table-column>
            <el-table-column
              prop="departmentName"
              header-align="center"
              align="center"
              min-width="120"
              label="部门名称">
            </el-table-column>
          </el-table>
        </el-main>
      </el-container>
      <el-footer style="height:40px;margin-top: 20px;text-align:center">
        <el-button type="primary" @click="deptAddModal = false">关闭</el-button>
      </el-footer>
    </el-dialog>

    <!--  新增用户角色  -->
    <el-dialog title="角色" :close-on-click-modal="false" v-drag :visible.sync="businessRoleAddModal" width="900px">
      <div style="font-size: 12px">
        <el-form :inline="true" label-position="top" :model="businessRoleData">
          <el-form-item :label="'角色编码'">
            <el-input v-model="businessRoleData.roleNo" clearable style="width: 120px"></el-input>
          </el-form-item>
          <el-form-item :label="'角色名称'">
            <el-input v-model="businessRoleData.roleDesc" clearable style="width: 200px"></el-input>
          </el-form-item>
          <el-form-item :label="' '">
            <el-button type="primary" @click="getBusinessRole()">查询</el-button>
          </el-form-item>
        </el-form>
      </div>
      <el-container style="margin-top: 0px;">
        <el-main style="width: 400px; padding: 1px">
          <span style="font-size: 12px" >可选角色</span>
          <el-table
            height="400px"
            :data="businessRoleList1"
            border
            ref="businessRoleTable1"
            @row-click="businessRoleClickRow1"
            @selection-change="selectionBusinessRole1"
            highlight-current-row
            style="width: 100%">
            <el-table-column
              type="selection"
              header-align="center"
              align="center"
              :selectable="selectFlag"
              width="50">
            </el-table-column>
            <el-table-column
              prop="roleNo"
              header-align="center"
              align="center"
              min-width="80"
              label="角色编码">
            </el-table-column>
            <el-table-column
              prop="roleDesc"
              header-align="center"
              align="center"
              min-width="120"
              label="角色名称">
            </el-table-column>
          </el-table>
        </el-main>
        <el-main style="width: 111px;padding: 1px">
          <div style="margin-top: 182px;margin-left: 18px">
            <el-button type="primary" @click="addBusinessRole()">添加>></el-button>
          </div>
          <div style="margin-top: 15px;margin-left: 18px">
            <el-button type="primary" @click="deleteBusinessRole()">删除<<</el-button>
          </div>
        </el-main>
        <el-main style="width: 400px;padding: 1px">
          <span style="font-size: 12px" >已有角色</span>
          <el-table
            height="400px"
            :data="businessRoleList2"
            border
            ref="businessRoleTable2"
            @row-click="businessRoleClickRow2"
            @selection-change="selectionBusinessRole2"
            highlight-current-row
            style="width: 100%">
            <el-table-column
              type="selection"
              header-align="center"
              align="center"
              :selectable="selectFlag"
              width="50">
            </el-table-column>
            <el-table-column
              prop="roleNo"
              header-align="center"
              align="center"
              min-width="80"
              label="角色编码">
            </el-table-column>
            <el-table-column
              prop="roleDesc"
              header-align="center"
              align="center"
              min-width="120"
              label="角色名称">
            </el-table-column>
          </el-table>
        </el-main>
      </el-container>
      <el-footer style="height:40px;margin-top: 20px;text-align:center">
        <el-button type="primary" @click="businessRoleAddModal = false">关闭</el-button>
      </el-footer>
    </el-dialog>

  </div>
</template>

<script>
import {getSiteList, addUserSite, delUserSite, getSite, getBuList, addUserBu, delUserBu, getBu, getDeptList, addUserDept, delUserDept, getDept, getBusinessRole, getBusinessRoleList, addUserBusinessRole, delUserBusinessRole} from '@/api/factory/site.js'
import { listAccessDeptByUsername } from '@/api/factory/accessDept.js'
import {saveAccessBU, saveBusinessRole} from '@/api/base/site.js'
import AddOrUpdate from './user-add-or-update'
import {saveUserBusinessRole} from '@/api/auditManagement/auditType.js'
import {updateUserSpecialSecurity} from '@/api/factory/userSpecialSecurity.js'
import {throttle} from '../../../utils/common'
import {searchFunctionButtonList} from '@/api/sysLanguage.js'
import {userFavoriteList, saveUserFavorite, removeUserFavorite} from '@/api/userFavorite.js'

export default {
  data () {
    return {
      // 是否收藏
      favorite: false,
      showButton: true,
      height: 200,
      securityHeight: 300,
      specialVisible: false,
      buVisible: false,
      businessRoleVisible: false,
      currentData: {},
      userId: this.$store.state.user.name,
      transferData: [],
      checked: [],
      inputSearch1: '审核权限',
      // 设置
      setUp: {
        reviewFlag: false,
        saveButton: false
      },
      dataForm: {
        userName: '',
        userDisplay: ''
      },
      columnList: [
        {
          userId: this.$store.state.user.name,
          serialNumber: 'security' + this.$route.meta.menuId + 'securitydesc',
          tableId: this.$route.meta.menuId + 'security',
          tableName: 'securityTable',
          columnProp: 'securitydesc',
          headerAlign: 'center',
          align: 'left',
          columnLabel: '参数描述',
          columnHidden: false,
          columnImage: false,
          columnWidth: 70,
          columnSortable: false,
          sortLv: 0,
          status: true,
          fixed: ''
        },
        {
          userId: this.$store.state.user.name,
          serialNumber: 'security' + this.$route.meta.menuId + 'securitydesc',
          tableId: this.$route.meta.menuId + 'security',
          tableName: 'securityTable',
          columnProp: 'module',
          headerAlign: 'center',
          align: 'left',
          columnLabel: '模块',
          columnHidden: false,
          columnImage: false,
          columnSortable: false,
          columnWidth: 20,
          sortLv: 0,
          status: true,
          fixed: ''
        },
        {
          userId: this.$store.state.user.name,
          serialNumber: 'security' + this.$route.meta.menuId + 'securitydesc',
          tableId: this.$route.meta.menuId + 'security',
          tableName: 'securityTable',
          columnProp: 'itemvalue',
          headerAlign: 'center',
          align: 'center',
          columnLabel: '参数值',
          columnHidden: true,
          columnImage: false,
          columnSortable: false,
          columnWidth: 10,
          sortLv: 0,
          status: true,
          fixed: ''
        }
      ],
      buttons: {
        cz: '操作',
        search: '查询',
        add: '添加',
        edit: '编辑',
        delete: '删除',
        specialCompetencies: '特殊权限',
        factoryAuthorization: '工厂授权',
        buAuthorization: 'BU授权',
        deptAuthorization: '部门授权',
        viewUserDept: '查看部门',
        businessRoleAuthorization: '岗位',
        createTime: '创建时间',
        username: '用户账号',
        userDisplay: '用户名',
        email: '邮箱',
        mobile: '手机号',
        status: '状态',
        disable: '禁用',
        normal: '正常',
        auth: '审核',
        allAuth: '所有权限',
        currentAuth: '当前权限'
      },
      dataList: [],
      securityList: [],
      selectSpecialList: [],
      siteList: [],
      selectSitList: [],
      selectUser: {},
      pageIndex: 1,
      pageSize: 20,
      totalPage: 0,
      dataListLoading: false,
      dataListSelections: [],
      addOrUpdateVisible: false,
      selectBUList: [],
      buList: [],
      siteList1: [],
      siteList2: [],
      siteSelections1: [],
      siteSelections2: [],
      siteAddModal: false,
      siteData: {
        username: '',
        siteid: '',
        sitename: '',
        active: ''
      },
      buList1: [],
      buList2: [],
      buSelections1: [],
      buSelections2: [],
      buAddModal: false,
      buData: {
        site: '',
        buNo: '',
        buDesc: '',
        active: '',
        username: ''
      },
      userDeptModalVisible: false,
      userDeptList: [],
      userDeptLoading: false,
      deptData: {
        site: '',
        buNo: '',
        departmentId: '',
        departmentName: '',
        active: '',
        username: ''
      },
      deptList1: [],
      deptList2: [],
      deptSelections1: [],
      deptSelections2: [],
      deptAddModal: false,
      selectBusinessRoleList: [],
      businessRoleList: [],
      businessRoleList1: [],
      businessRoleList2: [],
      businessRoleSelections1: [],
      businessRoleSelections2: [],
      businessRoleAddModal: false,
      businessRoleData: {
        site: '',
        buNo: '',
        roleNo: '',
        roleDesc: '',
        active: '',
        username: ''
      }
    }
  },
  components: {
    AddOrUpdate
  },
  activated () {
    this.getDataList()
  },
  mounted () {
    this.favoriteIsOk()
    this.$nextTick(() => {
      this.securityHeight = window.innerHeight - 300
      this.height = window.innerHeight - 200
    })
  },
  computed: {
    adminUser () {
      return this.$store.state.user.id === 1
    }
  },
  methods: {
    // 校验用户是否收藏
    favoriteIsOk () {
      let userFavorite = {
        userId: this.$store.state.user.id,
        languageCode: this.$i18n.locale
      }
      userFavoriteList(userFavorite).then(({data}) => {
        for (let i = 0; i < data.list.length; i++) {
          if (this.$route.meta.menuId == data.list[i].menuId) {
            this.favorite = true
          }
        }
      })
    },
    // 收藏 OR 取消收藏
    favoriteFunction () {
      let userFavorite = {
        userId: this.$store.state.user.id,
        functionId: this.$route.meta.menuId
      }
      if (this.favorite) {
        // 取消收藏
        this.$confirm(`确定取消收藏`, '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        }).then(() => {
          removeUserFavorite(userFavorite).then(({data}) => {
            this.$message.success(data.msg)
            this.favorite = false
          })
        })
      } else {
        // 收藏
        saveUserFavorite(userFavorite).then(({data}) => {
          this.$message.success(data.msg)
          this.favorite = true
        })
      }
    },

    // 获取button的词典
    getFunctionButtonList () {
      let queryButton = {
        functionId: this.$route.meta.menuId,
        tableId: '*',
        languageCode: this.$i18n.locale,
        objectType: 'button'
      }
      searchFunctionButtonList(queryButton).then(({data}) => {
        if (data.code == 0 && data.data) {
          this.buttons = data.data
        }
      })
    },

    // 保存用户权限
    saveUserSecurity () {
      let securityList = JSON.parse(JSON.stringify(this.securityList)).map(item => {
        item.itemvalue = item.itemvalue === true ? 'Y' : 'N'
        return item
      })
      updateUserSpecialSecurity(securityList).then(({data}) => {
        if (data.code === 0) {
          this.$message.success(data.msg)
          this.specialVisible = false
        } else {
          this.$message.success(data.msg)
        }
      })
    },

    // 授权工厂
    siteAuthorize () {
      this.siteData = {
        siteid: '',
        sitename: '',
        active: ''
      }
      this.siteSelections1 = null
      this.siteSelections2 = null
      getSiteList(this.selectUser).then(({data}) => {
        this.siteList1 = data.row1
        this.siteList2 = data.row2
      })
      this.siteAddModal = true
      // this.searchSiteList()
    },

    /**
     * 查询可用site
     */
    getSite () {
      this.siteData.username = this.selectUser.username
      getSite(this.siteData).then(({data}) => {
        if (data.code === 0) {
          this.siteList1 = data.rows
        }
      })
    },

    selectFlag () {
      return true
    },

    // 可选site
    siteClickRow1 (row) {
      this.$refs.siteTable1.toggleRowSelection(row)
    },

    // 已有site
    siteClickRow2 (row) {
      this.$refs.siteTable2.toggleRowSelection(row)
    },

    selectionSite1 (val) {
      this.siteSelections1 = val
    },

    selectionSite2 (val) {
      this.siteSelections2 = val
    },

    // 添加site
    addSite () {
      if (this.siteSelections1 == null || this.siteSelections1.length === 0) {
        this.$message.warning('请选择可选工厂！')
        return
      }
      let inData = {
        username: this.selectUser.username,
        siteList: this.siteSelections1
      }
      addUserSite(inData).then(({data}) => {
        if (data && data.code === 0) {
          getSiteList(this.selectUser).then(({data}) => {
            this.siteList1 = data.row1
            this.siteList2 = data.row2
          })
          this.siteSelections1 = []
        } else {
          this.$alert(data.msg, '错误', {
            confirmButtonText: '确定'
          })
        }
      })
    },

    // 删除site
    deleteSite () {
      if (this.siteSelections2 == null || this.siteSelections2.length === 0) {
        this.$message.warning('请选择已有工厂！')
        return
      }
      let inData = {
        username: this.selectUser.username,
        siteList: this.siteSelections2
      }
      delUserSite(inData).then(({data}) => {
        if (data && data.code === 0) {
          getSiteList(this.selectUser).then(({data}) => {
            this.siteList1 = data.row1
            this.siteList2 = data.row2
          })
          this.siteSelections2 = []
        } else {
          this.$alert(data.msg, '错误', {
            confirmButtonText: '确定'
          })
        }
      })
    },

    // // 关闭后刷新列表
    // refreshDetailList(){
    //   this.getDataList()
    // },

    // 授权BU
    buAuthorize () {
      this.buData = {
        site: '',
        buNo: '',
        buDesc: '',
        active: '',
        username: ''
      }
      this.buSelections1 = null
      this.buSelections2 = null
      getBuList(this.selectUser).then(({data}) => {
        this.buList1 = data.row1
        this.buList2 = data.row2
      })
      this.buAddModal = true
      // this.buVisible = true
      // this.searchBuList()
    },

    /**
     * 查询可用bu
     */
    getBu () {
      this.buData.username = this.selectUser.username
      getBu(this.buData).then(({data}) => {
        if (data.code === 0) {
          this.buList1 = data.rows
        }
      })
    },

    // 可选bu
    buClickRow1 (row) {
      this.$refs.buTable1.toggleRowSelection(row)
    },

    // 已有bu
    buClickRow2 (row) {
      this.$refs.buTable2.toggleRowSelection(row)
    },

    selectionBu1 (val) {
      this.buSelections1 = val
    },

    selectionBu2 (val) {
      this.buSelections2 = val
    },

    // 添加bu
    addBu () {
      if (this.buSelections1 == null || this.buSelections1.length === 0) {
        this.$message.warning('请选择可选BU！')
        return
      }
      let inData = {
        username: this.selectUser.username,
        buList: this.buSelections1
      }
      addUserBu(inData).then(({data}) => {
        if (data && data.code === 0) {
          getBuList(this.selectUser).then(({data}) => {
            this.buList1 = data.row1
            this.buList2 = data.row2
          })
          this.buSelections1 = []
        } else {
          this.$alert(data.msg, '错误', {
            confirmButtonText: '确定'
          })
        }
      })
    },

    // 删除bu
    deleteBu () {
      if (this.buSelections2 == null || this.buSelections2.length === 0) {
        this.$message.warning('请选择已有BU！')
        return
      }
      let inData = {
        username: this.selectUser.username,
        buList: this.buSelections2
      }
      delUserBu(inData).then(({data}) => {
        if (data && data.code === 0) {
          getBuList(this.selectUser).then(({data}) => {
            this.buList1 = data.row1
            this.buList2 = data.row2
          })
          this.buSelections2 = []
        } else {
          this.$alert(data.msg, '错误', {
            confirmButtonText: '确定'
          })
        }
      })
    },
    viewUserDept () {
      if (!this.selectUser || !this.selectUser.username) {
        this.$message.warning('请先在列表中选中用户')
        return
      }
      this.userDeptLoading = true
      this.userDeptList = []
      this.userDeptModalVisible = true
      listAccessDeptByUsername({ username: this.selectUser.username }).then(({ data }) => {
        this.userDeptLoading = false
        if (data && data.code === 0) {
          this.userDeptList = data.list || []
        } else {
          this.userDeptList = []
          if (data && data.msg) {
            this.$message.error(data.msg)
          }
        }
      }).catch(() => {
        this.userDeptLoading = false
        this.userDeptList = []
      })
    },

    // 授权部门
    deptAuthorize () {
      this.deptData = {
        site: '',
        buNo: '',
        departmentId: '',
        departmentName: '',
        active: '',
        username: ''
      }
      this.deptSelections1 = null
      this.deptSelections2 = null
      getDeptList(this.selectUser).then(({data}) => {
        this.deptList1 = data.row1
        this.deptList2 = data.row2
      })
      this.deptAddModal = true
    },
    /**
     * 查询可用部门
     */
    getDept () {
      this.deptData.username = this.selectUser.username
      getDept(this.deptData).then(({data}) => {
        if (data.code === 0) {
          this.deptList1 = data.rows
        }
      })
    },

    // 可选部门
    deptClickRow1 (row) {
      this.$refs.deptTable1.toggleRowSelection(row)
    },

    // 已有部门
    deptClickRow2 (row) {
      this.$refs.deptTable2.toggleRowSelection(row)
    },

    selectionDept1 (val) {
      this.deptSelections1 = val
    },

    selectionDept2 (val) {
      this.deptSelections2 = val
    },

    // 添加部门
    addDept () {
      if (this.deptSelections1 == null || this.deptSelections1.length === 0) {
        this.$message.warning('请选择可选部门！')
        return
      }
      let inData = {
        username: this.selectUser.username,
        deptList: this.deptSelections1
      }
      addUserDept(inData).then(({data}) => {
        if (data && data.code === 0) {
          getDeptList(this.selectUser).then(({data}) => {
            this.deptList1 = data.row1
            this.deptList2 = data.row2
          })
          this.deptSelections1 = []
        } else {
          this.$alert(data.msg, '错误', {
            confirmButtonText: '确定'
          })
        }
      })
    },

    // 删除部门
    deleteDept () {
      if (this.deptSelections2 == null || this.deptSelections2.length === 0) {
        this.$message.warning('请选择已有部门！')
        return
      }
      let inData = {
        username: this.selectUser.username,
        deptList: this.deptSelections2
      }
      delUserDept(inData).then(({data}) => {
        if (data && data.code === 0) {
          getDeptList(this.selectUser).then(({data}) => {
            this.deptList1 = data.row1
            this.deptList2 = data.row2
          })
          this.deptSelections2 = []
        } else {
          this.$alert(data.msg, '错误', {
            confirmButtonText: '确定'
          })
        }
      })
    },
// 岗位
    businessRoleAuthorize () {
      this.businessRoleData = {
        site: '',
        roleNo: '',
        roleDesc: '',
        active: '',
        username: ''
      }
      this.businessRoleSelections1 = null
      this.businessRoleSelections2 = null
      getBusinessRoleList(this.selectUser).then(({data}) => {
        this.businessRoleList1 = data.row1
        this.businessRoleList2 = data.row2
      })
      this.businessRoleAddModal = true
    },
    /**
     * 查询可用角色
     */
    getBusinessRole () {
      this.businessRoleData.username = this.selectUser.username
      getBusinessRole(this.businessRoleData).then(({data}) => {
        if (data.code === 0) {
          this.businessRoleList1 = data.rows
        }
      })
    },
    // 可选角色
    businessRoleClickRow1 (row) {
      this.$refs.businessRoleTable1.toggleRowSelection(row)
    },
    // 已有角色
    businessRoleClickRow2 (row) {
      this.$refs.businessRoleTable2.toggleRowSelection(row)
    },
    selectionBusinessRole1 (val) {
      this.businessRoleSelections1 = val
    },
    selectionBusinessRole2 (val) {
      this.businessRoleSelections2 = val
    },
    // 添加角色
    addBusinessRole () {
      if (this.businessRoleSelections1 == null || this.businessRoleSelections1.length === 0) {
        this.$message.warning('请选择可选角色！')
        return
      }
      let inData = {
        username: this.selectUser.username,
        businessRoleList: this.businessRoleSelections1
      }
      addUserBusinessRole(inData).then(({data}) => {
        if (data && data.code === 0) {
          getBusinessRoleList(this.selectUser).then(({data}) => {
            this.businessRoleList1 = data.row1
            this.businessRoleList2 = data.row2
          })
          this.businessRoleSelections1 = []
        } else {
          this.$alert(data.msg, '错误', {
            confirmButtonText: '确定'
          })
        }
      })
    },
    // 删除角色
    deleteBusinessRole () {
      if (this.businessRoleSelections2 == null || this.businessRoleSelections2.length === 0) {
        this.$message.warning('请选择已有角色！')
        return
      }
      let inData = {
        username: this.selectUser.username,
        businessRoleList: this.businessRoleSelections2
      }
      delUserBusinessRole(inData).then(({data}) => {
        if (data && data.code === 0) {
          getBusinessRoleList(this.selectUser).then(({data}) => {
            this.businessRoleList1 = data.row1
            this.businessRoleList2 = data.row2
          })
          this.businessRoleSelections2 = []
        } else {
          this.$alert(data.msg, '错误', {
            confirmButtonText: '确定'
          })
        }
      })
    },

    saveBuAssessSite () {
      if (this.selectBUList.length == 0) {
        this.$message.warning('请选择BU')
        return false
      }
      let inList = []
      for (let i = 0; i < this.selectBUList.length; i++) {
        let inData = {
          site: this.$store.state.user.site,
          username: this.selectUser.username,
          buNo: this.selectBUList[i]
        }
        inList.push(inData)
      }
      saveAccessBU(inList).then(({data}) => {
        if (data && data.code === 0) {
          this.$message.success('操作成功')
          this.buVisible = false
        } else {
          this.$message.error(data.msg)
        }
      })
    },

    // 保存选中的授权角色
    saveBusinessRoleSite () {
      if (this.selectBusinessRoleList.length == 0) {
        this.$message.warning('请选择角色')
        return false
      }
      let businessRole = []
      for (let i = 0; i < this.selectBusinessRoleList.length; i++) {
        let inData = {
          site: this.$store.state.user.site,
          username: this.selectUser.username,
          roleNo: this.selectBusinessRoleList[i]
        }
        businessRole.push(inData)
      }
      saveBusinessRole(businessRole).then(({data}) => {
        if (data && data.code === 0) {
          this.$message.success('操作成功')
          this.roleVisible = false
        } else {
          this.$message.error(data.msg)
        }
      })
    },

    // 选中行
    handleCurrentChange (val) {
      this.selectUser = val
      this.showButton = false
    },

    saveUserRoleFlag () {
      let saveList = []
      let currentList = this.checked
      // 当前未选择记录
      if (currentList.length == 0) {
        this.$confirm('当前未选择记录,是否继续？', '删除提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消'
        }).then(() => {
          let data = {
            userId: this.currentData.userId
          }
          saveList.push(data)
          this.saveUserBusinessRole(saveList)
        }).catch(() => {

        })
      } else {
        for (let i = 0; i < currentList.length; i++) {
          let data = {
            userId: this.currentData.userId,
            roleItemNo: currentList[i],
            selectFlag: 'Y'
          }
          saveList.push(data)
        }
        this.saveUserBusinessRole(saveList)
      }
    },

    saveUserBusinessRole (saveList) {
      saveUserBusinessRole(saveList).then(({data}) => {
        this.$alert(data.msg, '操作提示', {
          confirmButtonText: '确定',
          callback: action => {
            if (data.code == 0) {
              this.setUp.reviewFlag = false
            }
            this.setUp.saveButton = false
          }
        })
      })
    },

    // 获取数据列表
    getDataList: throttle(function () {
      this.dataListLoading = true
      this.$http({
        url: this.$http.adornUrl('/sys/user/list'),
        method: 'get',
        params: this.$http.adornParams({
          'page': this.pageIndex,
          'limit': this.pageSize,
          'username': this.dataForm.userName,
          'userDisplay': this.dataForm.userDisplay
        })
      }).then(({data}) => {
        if (data && data.code === 0) {
          this.dataList = data.page.list
          this.totalPage = data.page.totalCount
        } else {
          this.dataList = []
          this.totalPage = 0
        }
        this.dataListLoading = false
      })
    }, 1000),

    // 每页数
    sizeChangeHandle (val) {
      this.pageSize = val
      this.pageIndex = 1
      this.getDataList()
    },

    // 当前页
    currentChangeHandle (val) {
      this.pageIndex = val
      this.getDataList()
    },

    // 多选
    selectionChangeHandle (val) {
      this.dataListSelections = val
    },

    // 新增 / 修改
    addOrUpdateHandle (id) {
      this.addOrUpdateVisible = true
      this.$nextTick(() => {
        this.$refs.addOrUpdate.init(id)
      })
    },

    // 删除
    deleteHandle (id) {
      let userIds = id ? [id] : this.dataListSelections.map(item => {
        return item.userId
      })
      this.$confirm(`确定对[id=${userIds.join(',')}]进行[${id ? '删除' : '批量删除'}]操作?`, '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        this.$http({
          url: this.$http.adornUrl('/sys/user/delete'),
          method: 'post',
          data: this.$http.adornData(userIds, false)
        }).then(({data}) => {
          if (data && data.code === 0) {
            this.$message.success('操作成功')
            this.getDataList()
          } else {
            this.$message.error(data.msg)
          }
        })
      }).catch(() => {
      })
    },

    test () {
      let dto = {
        qty: 100,
        name: '张三'
      }
      this.$http({
        url: this.$http.adornUrl('/pms/test/getTdo1'),
        method: 'get'
      }).then(({data}) => {
        if (data && data.code === 0) {
        } else {
          this.$message.error(data.msg)
        }
      })
      this.$http({
        url: this.$http.adornUrl('/qm/test/list'),
        method: 'get'
      }).then(({data}) => {
        if (data && data.code === 0) {
        } else {
          this.$message.error(data.msg)
        }
      })
    },
    closeDialog () {
      this.$refs.addOrUpdate.closeDialog()
    }
  },
  created () {
    this.getFunctionButtonList()
  }
}
</script>

<style>
.el-transfer-panel {
  border: 2px solid #17b3a3;
  border-radius: 4px;
  overflow: hidden;
  background: #fff;
  display: inline-block;
  vertical-align: middle;
  width: 200px;
  max-height: 100%;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  position: relative;
}

.el-transfer-panel .el-transfer-panel__header {
  height: 40px;
  line-height: 40px;
  background: #17b3a3;
  margin: 0;
  padding-left: 15px;
  border-bottom: 1px solid #17b3a3;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  color: #000;
}

.el-transfer-panel .el-transfer-panel__header .el-checkbox .el-checkbox__label {
  font-size: 14px;
  color: #303133;
  font-weight: 400;
}

.el-dialog__title {
  line-height: 24px;
  font-size: 16px;
  color: #303133;
}
</style>
