<!-- 组织机构管理一览 -->
<template>
    <div class="flex-class">
      <div class="treeClazz" v-cloak>
        <div @click="toggle" class="iconfont iconClass"
             :class="{iconzhankai: iconzhankai, iconshouqi: iconshouqi}"></div>
        <div :class="{treeClass: treeClass, treeClassHidden: treeClassHidden}">
          <div class="tree-width">
            <el-form @submit.native.prevent :model="organForm" label-width="80px" label-position="right" class="item-bottom-class">
              <el-row>
                <el-col :span="15" class="organ-class">
                  <div>
                    <exclude-special-input v-model="filterNodeLabel" class="inputwidth" size="mini" :showAppend="true" @search="searchTree"></exclude-special-input>
                  </div>
                </el-col>
                <el-col :span="9" class="buttonGroup">
                  <el-tooltip effect="dark" :content="$t('enterpriseInfoManage.organization.refresh')" placement="bottom">
                    <i class="iconfont iconshuaxin" @click="loadFirstTreeData"></i>
                  </el-tooltip>
                  <el-tooltip v-if="orgData.length === 0" effect="dark" :content="$t('enterpriseInfoManage.organization.createOrgan')"  placement="bottom">
                    <i class="el-icon-plus add-class checkbox-class" @click="addParent"></i>
                  </el-tooltip>
                  <el-tooltip effect="dark" :content="arrowTip" placement="bottom">
                    <i :class="getArrowIcon" @click="expandAllControl" class="expand-class"></i>
                  </el-tooltip>
                  <el-tooltip effect="dark" :content="$t('enterpriseInfoManage.organization.showChildInfo')" placement="bottom">
                    <el-checkbox v-model="organForm.showChild" @change="checkChange" class="checkbox-class"></el-checkbox>
                  </el-tooltip>
                </el-col>
              </el-row>
            </el-form>
            <el-tree :data="orgData" ref="treeX" :props="defaultProps" :highlight-current="highlightCurrent"
                     :default-expanded-keys="defaultExpandedKeys" :filter-node-method="filterNode"
                     :expand-on-click-node="expandOnClickNode" @node-click="handleNodeClick" node-key="keyId" class="org-class">
            <span slot-scope="{ node, data }">
              <span><i :class="getStyleClass(data)"></i></span>
                <el-tooltip v-if="node.label.length > 15" effect="dark" :content="node.label" placement="top">
                  <span class="tree-text-size">{{ getLabel(node.label) }}</span>
                </el-tooltip>
                <span v-else class="tree-text-size">{{ node.label }}</span>
              <span class="tree-btn-class">
                <el-tooltip effect="dark" :content="$t('enterpriseInfoManage.organization.edit')" placement="bottom">
                  <auth-button type="text" class="circle-btn-class" icon="iconfont iconbianji" label="" @click.stop.native="editNode(node, data)"></auth-button>
                </el-tooltip>
                <el-tooltip effect="dark" :content="$t('enterpriseInfoManage.organization.adjustPerson')" placement="bottom">
                  <auth-button type="text" class="circle-btn-class" icon="iconfont iconquyuzhuanyuanbeizhu" label="" @click.stop.native="showOrgPerson(node.data)"></auth-button>
                </el-tooltip>
                <el-tooltip effect="dark" :content="$t('enterpriseInfoManage.organization.create')" placement="bottom">
                  <auth-button type="text" class="circle-btn-class" icon="iconfont iconxinzeng" label="" @click.stop.native="addNode(node, data)"></auth-button>
                </el-tooltip>
                <el-tooltip effect="dark" :content="$t('enterpriseInfoManage.organization.del')" placement="bottom">
                  <auth-button type="text" class="circle-btn-class" icon="iconfont iconshanchu" label="" @click.stop.native="deleteNode(node, data)" v-if="deleteDisabled(node)"></auth-button>
                </el-tooltip>
              </span>
            </span>
            </el-tree>
          </div>
        </div>
      </div>
      <div class="table-class">
        <search-form :componentList="componentList" @handleFilter="loadPosition" :formValue.sync="positionParas"
                     @clearParam="clearParam">
        </search-form>
        <!-- 组织机构职位一览 -->
        <data-table :api="positionApi" :headTitle="$t('enterpriseInfoManage.organization.positionTitle')"
                    :operateBtnLayout="operateBtnLayout" :queryParas="positionParas"
                    :sourceData.sync="positionData" :loadCount.sync="positionCount"
                    :columns="positionColumns"
                    :menuFlag="menuFlag" @cell-click="cellClick" :pageSizes="pageSizes" ref="posTable">
          <template slot="positionDesc" slot-scope="scope">
            <div>
              <div v-if="scope.data.row.moreFlag">
                <div class="base_clomuns"
                     :class="{ 'more': !scope.data.row.moreBtnFlag}">{{scope.data.row.positionDesc}}</div>
                <div class="very_list">
                  <el-button type="text" v-show="scope.data.row.moreBtnFlag" @click.stop="zhankai(scope.data.$index)" class="el-icon-arrow-down">
                  </el-button>
                  <el-button type="text" v-show="!scope.data.row.moreBtnFlag" @click.stop="zhankai(scope.data.$index)" class="el-icon-arrow-up">
                  </el-button>
                </div>
              </div>
              <span v-else
                    class="base_clomuns">{{scope.data.row.positionDesc}}</span>
            </div>
          </template>
          <template slot="headButton">
            <div class="box-center">
              <span class="span-center">{{$t('enterpriseInfoManage.organization.positionTitle')}}</span>
              <auth-button type="primary" :label="$t('enterpriseInfoManage.supplierInfoManage.create')" icon="iconfont iconxinzeng" size="medium"
                           @click="showCreate" class="btn-right"></auth-button>
            </div>
          </template>
          <!-- 操作 -->
          <el-table-column :label="$t('common.operate')" align="center" width="210px">
            <template slot-scope="scope">
              <auth-button size="small" class="iconCircle" icon="iconfont iconchakan" @click="showPersonList(scope.row)"
                           :title="$t('enterpriseInfoManage.organization.personList')"></auth-button>
              <auth-button size="small" class="iconCircle" icon="iconfont iconquyuzhuanyuanbeizhu" @click="showAdjust(scope.$index, scope.row)"
                           :title="$t('enterpriseInfoManage.organization.adjustPerson')"></auth-button>
              <auth-button size="small" class="iconCircle" icon="iconfont iconbianji"
                           :title="$t('common.edit')" @click="showEdit(scope.$index, scope.row)"></auth-button>
              <auth-button size="small" class="iconCircle" icon="iconfont iconshanchu"
                           :title="$t('enterpriseInfoManage.supplierInfoManage.del')" @click="del(scope.$index, scope.row)"></auth-button>
            </template>
          </el-table-column>
        </data-table>
        <div v-show="showPerson">
          <div class="organ-divider">
            <el-divider></el-divider>
          </div>
          <!-- 组织机构人员一览 -->
          <div class="organ-item">
            <search-form :componentList="staffList" labelWidth="80px" :formValue.sync="staffParas" @handleFilter="loadStaff" @clearParam="clearStaffParam"></search-form>
          </div>
          <data-table :api="personApi" :headTitle="$t('enterpriseInfoManage.organization.personTitle')" :operateBtnLayout="operateBtnLayout" :pageSizes="pageSizes"
                      :queryParas="staffParas" :sourceData="staffData" :loadCount.sync="staffCount" :columns="staffColumns" :toolMenuFlag="toolMenuFlag" :headTitleFlag="headTitleFlag">
          </data-table>
        </div>
      </div>
      <!-- 组织机构树信息维护 -->
      <organization-edit :visible.sync="showOrgan" :form="item" :editModel="editModel" :regMsg="regMsg" @operateSuccess="operateSuccess"></organization-edit>
      <!-- 职位信息维护 -->
      <position-edit :visible.sync="showPosition" :form="positionForm" :editModel="positionModel" :regMsg="regMsg" @positionSuccess="positionSuccess"></position-edit>
      <!-- 职位人员调整 -->
      <adjust-person-edit :visible.sync="adjustFlag" :form="adjustForm" :editModel="adjustModel" :openModel="openModel" @refreshTable="refreshTable"></adjust-person-edit>
      <!-- 组织机构人员调整 -->
      <org-person-edit :visible.sync="orgPerson" :form="orgPersonItem" :editModel="orgPersonModel" @delRefresh="delRefresh" @organ-person="delRefresh"></org-person-edit>
    </div>
</template>

<script>
import BasePage from '@/pages/basePage'
import Treeselect from '@riophae/vue-treeselect'
import ExcludeSpecialInput from '@/components/element/cyjg/ExcludeSpecialInput.vue'
import SelectOrganization from '@/components/element/enterpriseInfoManage/SelectOrganization.vue'
import { upDownLayout, searchForm, DataTable, authButton } from 'newepoch-components'
import OrganizationEdit from '@/pages/enterpriseInfoManage/organization/organizationEdit.vue'
import PositionEdit from '@/pages/enterpriseInfoManage/organization/positionEdit.vue'
import AdjustPersonEdit from '@/pages/enterpriseInfoManage/organization/adjustPersonEdit.vue'
import organizationApi from '@/api/enterpriseInfoManage/organizationApi.js'
import OrgPersonEdit from '@/pages/enterpriseInfoManage/organization/orgPersonEdit.vue'
import tirmInput from '@/components/element/tirmInput.vue'
import * as format from '@/filters/index'
export default {
  extends: new BasePage(),
  name: 'organizationList',
  components: {
    upDownLayout,
    searchForm,
    DataTable,
    authButton,
    SelectOrganization,
    OrganizationEdit,
    PositionEdit,
    AdjustPersonEdit,
    OrgPersonEdit,
    Treeselect,
    ExcludeSpecialInput
  },
  data () {
    return {
      index: 1,
      organizationId: '',
      filterNodeLabel: '',
      defaultExpandedKeys: [],
      componentList: [
        {
          value: 'orgId',
          disabled: false,
          componentName: Treeselect,
          options: [],
          clearable: false,
          normalizer: this.normalizer,
          noResultsText: this.$i18n.messages[this.$i18n.locale].enterpriseInfoManage.organization.noResultsText,
          label: this.$i18n.messages[this.$i18n.locale].enterpriseInfoManage.organization.organName,
          prop: 'orgId'
        },
        {
          value: 'positionName',
          disabled: false,
          componentName: tirmInput,
          label: this.$i18n.messages[this.$i18n.locale].enterpriseInfoManage.organization.positionName,
          placeholder: this.$i18n.messages[this.$i18n.locale].common.pleaseInput,
          prop: 'positionName'
        },
        {
          value: 'positionDescribe',
          disabled: false,
          componentName: tirmInput,
          label: this.$i18n.messages[this.$i18n.locale].enterpriseInfoManage.organization.positionDesc,
          placeholder: this.$i18n.messages[this.$i18n.locale].common.pleaseInput,
          prop: 'positionDescribe'
        }
      ],
      clearable: true,
      options: [],
      disabled: false,
      toggleFlag: false,
      node: '',
      data: '',
      iconzhankai: false,
      iconshouqi: true,
      treeClass: true,
      treeClassHidden: false,
      headTitleFlag: true,
      organForm: {
        organId: '',
        showChild: true
      },
      defaultExpandAll: true,
      operateBtnLayout: '',
      staffCount: 0,
      staffList: [
        // 登录账号
        {
          label: this.$i18n.messages[this.$i18n.locale].enterpriseInfoManage.organization.loginAccount,
          disabled: false,
          value: 'account',
          maxlength: 128,
          placeholder: this.$i18n.messages[this.$i18n.locale].common.pleaseInput,
          labelWidth: '80px',
          componentName: tirmInput
        },
        // 姓名
        {
          label: this.$i18n.messages[this.$i18n.locale].enterpriseInfoManage.organization.name,
          disabled: false,
          value: 'name',
          maxlength: 255,
          placeholder: this.$i18n.messages[this.$i18n.locale].common.pleaseInput,
          labelWidth: '80px',
          componentName: tirmInput
        }
      ],
      staffParas: {
        pageIndex: 1,
        pageSize: 5,
        account: '',
        positionId: '',
        name: '',
        orgId: ''
      },
      staffData: [],
      staffColumns: [
        // 组织机构名称
        /* {
          prop: 'orgName',
          align: 'left',
          label: this.$i18n.messages[this.$i18n.locale].enterpriseInfoManage.organization.organizationName,
          width: ''
        }, */
        // 职位名称
        {
          prop: 'positionName',
          align: 'left',
          label: this.$i18n.messages[this.$i18n.locale].enterpriseInfoManage.organization.positionName,
          width: ''
        },
        // 登录账号
        {
          prop: 'account',
          align: 'left',
          label: this.$i18n.messages[this.$i18n.locale].enterpriseInfoManage.organization.loginAccount,
          width: ''
        },
        // 人员姓名
        {
          prop: 'nickName',
          align: 'left',
          label: this.$i18n.messages[this.$i18n.locale].enterpriseInfoManage.organization.personName,
          width: ''
        }
        // 职位
        // {
        //   prop: 'position',
        //   align: 'center',
        //   label: this.$i18n.messages[this.$i18n.locale].enterpriseInfoManage.organization.position,
        //   width: ''
        // }
      ],
      positionCount: 0,
      pageSizes: [5, 10, 15, 20, 25],
      positionParas: {
        pageIndex: 1,
        pageSize: 5,
        positionName: '',
        orgId: null,
        orgName: '',
        isAll: '1',
        positionDescribe: ''
      },
      positionData: [],
      positionColumns: [
        // 组织机构名称
        {
          prop: 'orgNameIndex',
          align: 'left',
          label: this.$i18n.messages[this.$i18n.locale].enterpriseInfoManage.organization.organName,
          width: '150px'
        },
        // 职位名称
        {
          prop: 'positionName',
          align: 'left',
          label: this.$i18n.messages[this.$i18n.locale].enterpriseInfoManage.organization.positionName,
          width: '100px'
        },
        // 职级编号
        {
          prop: 'positionCode',
          align: 'center',
          label: this.$i18n.messages[this.$i18n.locale].enterpriseInfoManage.organization.positionNumber,
          width: '60px',
          format: (row) => {
            return format.formatDict(row.positionCode, 'ZDORGP01')
          }
        },
        // 职位描述
        {
          prop: 'positionDesc',
          align: 'left',
          slot: true,
          label: this.$i18n.messages[this.$i18n.locale].enterpriseInfoManage.organization.positionDesc,
          width: '300px'
        }
      ],
      highlightCurrent: true,
      expandOnClickNode: false,
      orgData: [],
      defaultProps: {
        children: 'deptList',
        label: 'orgName',
        isLeaf: 'leaf'
      },
      item: {},
      currentNode: {},
      showOrgan: false,
      addForm: {
        enterpriseId: '',
        keyId: '',
        orgDescribe: '',
        orgName: '',
        orgSeq: '',
        parentOrgId: '',
        parentOrgName: ''
      },
      showPosition: false,
      positionForm: {},
      positionModel: '',
      adjustFlag: false,
      adjustForm: {},
      adjustModel: '',
      menuFlag: true,
      toolMenuFlag: true,
      expandAll: true,
      showPerson: false,
      orgPersonModel: '',
      orgPersonItem: {},
      orgPerson: false,
      openModel: ''
    }
  },
  mounted () {
    let $this = this
    $this.$nextTick(() => {
      $this.loadFirstTreeData()
    })
    // window.addEventListener('resize', () => {
    //   console.log('treeItem', this.$refs.treeItem.offsetWidth)
    //   console.log('treeX', this.$refs.tree.offsetWidth)
    // })
  },
  computed: {
    treeApi () {
      return organizationApi.organTree
    },
    api () {
      return organizationApi.organTree
    },
    personApi () {
      return organizationApi.posPerson
    },
    positionApi () {
      return organizationApi.position
    },
    getArrowIcon () {
      if (this.expandAll) {
        return 'el-icon-arrow-up'
      } else {
        return 'el-icon-arrow-down'
      }
    },
    arrowTip () {
      let organ = this.$i18n.messages[this.$i18n.locale].enterpriseInfoManage.organization
      if (this.expandAll) {
        return organ.fold
      } else {
        return organ.expand
      }
    }
  },
  beforeUpdate () {
    this.searchTree()
  },
  methods: {
    // refreshMethod () {
    //   if (this.filterNodeLabel === '') {
    //     this.loadFirstTreeData()
    //   } else {
    //     this.searchTree()
    //   }
    // },
    // nodeExpandMethod (data, node, val) {
    //   this.defaultExpandedKeys.push(data.keyId)
    // },
    // nodeCollapseMethod (data, node, val) {
    //   this.defaultExpandedKeys = this.defaultExpandedKeys.filter(item => {
    //     return item !== data.keyId
    //   })
    // },
    filterNode (value, data) {
      if (this.UtilJs.isEmpty(value)) {
        return true
      }
      if (data.orgName.indexOf(value) !== -1) {
        return true
      }
    },
    searchTree () {
      this.$refs.treeX.filter(this.filterNodeLabel)
    },
    getLabel (val) {
      return val.slice(0, 15) + '...'
    },
    clearParam () {
      this.positionParas.orgId = this.organizationId
      this.positionParas.pageIndex = 1
      this.positionParas.pageSize = 5
      this.positionParas.positionName = ''
      this.positionParas.orgName = ''
      this.positionParas.positionDescribe = ''
    },
    // 加载下拉组织机构树组件 数据
    loadTreeSelect (orgId) {
      let $this = this
      $this.treeApi.getChild({ keyId: orgId }).then(res => {
        if (res && res.data) {
          $this.options = res.data
          $this.$set($this.componentList[0], 'options', $this.options)
        }
      })
    },
    deleteAttribute (data) {
      data.forEach()
    },
    normalizer (node) {
      return {
        id: node.keyId,
        label: node.orgName,
        children: node.deptList
      }
    },
    treeSelect (node) {
      let $this = this
      $this.form.orgName = node.orgName
    },
    zhankai (index) {
      this.toggleFlag = true
      this.positionData[index].moreBtnFlag = !this.positionData[index].moreBtnFlag
    },
    countLines (index) {
      let dom = document.getElementsByClassName('base_clomuns')[index]
      if (this.UtilJs.isEmpty(dom)) {
        return
      }
      let height = dom.offsetHeight
      let height1 = dom.scrollHeight
      if (height < height1) {
        return true
      }
      let e = window.getComputedStyle(dom, null)
      let lh = parseInt(e.lineHeight, 10)
      let h = parseInt(height, 10)
      let lc = Math.round(h / lh)
      return lc > 3
    },
    toggle () {
      if (this.iconzhankai) {
        this.iconzhankai = false
        this.iconshouqi = true

        this.treeClassHidden = false
        this.treeClass = true
      } else {
        this.iconzhankai = true
        this.iconshouqi = false
        this.treeClass = false
        this.treeClassHidden = true
      }
    },
    // 展示职位人员列表
    showPersonList (row) {
      this.staffParas.positionId = row.keyId
      this.staffParas.orgId = row.orgId
      this.showPerson = true
      this.loadStaff()
    },
    // 表格单元格点击事件
    cellClick (row, column, cell, event) {
      let common = this.$i18n.messages[this.$i18n.locale].common
      // 点击操作列时不进行任何操作
      if (column.label !== common.operate) {
        this.staffParas.positionId = row.keyId
        this.staffParas.orgId = row.orgId
        this.showPerson = true
        this.loadStaff()
        this.loadTreeSelect(row.orgId)
      }
    },
    // 展开 收起
    expandAllControl () {
      if (this.expandAll) {
        this.expandAll = false
        for (let i = 0; i < this.$refs.treeX.store._getAllNodes().length; i++) {
          this.$refs.treeX.store._getAllNodes()[i].expanded = this.expandAll
        }
      } else {
        this.expandAll = true
        for (let j = 0; j < this.$refs.treeX.store._getAllNodes().length; j++) {
          this.$refs.treeX.store._getAllNodes()[j].expanded = this.expandAll
        }
      }
    },
    // 复选框change
    checkChange (val) {
      let $this = this
      if (!val) {
        $this.showPerson = val
      }
      if (!$this.UtilJs.isEmpty($this.positionParas.orgId)) {
        if (val) {
          $this.$set($this.componentList[0], 'disabled', false)
          $this.positionParas.isAll = '1'
        } else {
          $this.positionParas.isAll = '0'
          $this.$set($this.componentList[0], 'disabled', true)
        }
        $this.loadPosition()
      }
    },
    // 切换节点图标
    getStyleClass (data) {
      if (this.UtilJs.isEmpty(data.deptList)) {
        return 'iconfont iconzijiedian icon-color'
      } else {
        return 'iconfont iconzhujiedian icon-color'
      }
    },
    // 节点 点击事件
    handleNodeClick (data) {
      let $this = this
      // if (!this.organForm.showChild) {
      //   $this.$set($this.componentList[0], 'disabled', true)
      // } else {
      //   $this.$set($this.componentList[0], 'disabled', false)
      // }
      this.clearParam()
      $this.organizationId = data.keyId
      $this.positionParas.orgId = data.keyId
      $this.positionParas.orgName = data.orgName
      // console.log(this.positionParas)
      // 点击 树节点后加载职位数据
      $this.loadPosition()
      $this.loadTreeSelect($this.positionParas.orgId)
      $this.showPerson = false
    },
    // 添加父节点机构
    addParent () {
      this.editModel = 'C'
      this.addForm.keyId = ''
      this.addForm.enterpriseId = '0'
      this.addForm.parentOrgId = '0'
      this.addForm.parentOrgName = ''
      this.addForm.orgName = ''
      this.addForm.orgSeq = ''
      this.addForm.orgDescribe = ''
      this.item = Object.assign({}, this.addForm)
      this.showOrgan = true
    },
    // 添加新节点
    addNode (node, data) {
      this.node = node
      this.data = data
      this.editModel = 'C'
      this.addForm.keyId = ''
      this.addForm.enterpriseId = data.enterpriseId
      this.addForm.parentOrgId = data.keyId
      this.addForm.parentOrgName = data.orgName
      this.addForm.orgName = ''
      this.addForm.orgSeq = ''
      this.addForm.orgDescribe = ''
      this.item = Object.assign({}, this.addForm)
      this.showOrgan = true
    },
    // 编辑当前节点
    editNode (node, data) {
      this.node = node
      this.data = data
      this.editModel = 'E'
      this.item = Object.assign({}, data)
      this.showOrgan = true
    },
    // 删除该节点及子节点
    deleteNode (node, data) {
      let parent = node.parent
      let dataChildren = parent.data.deptList
      let children = parent.childNodes
      let index = children.findIndex(item => {
        return item.data.keyId === data.keyId
      })
      let dataIndex = dataChildren.findIndex(item => {
        return item.keyId === data.keyId
      })
      let $this = this
      $this.$confirm(this.$i18n.messages[this.$i18n.locale].enterpriseInfoManage.organization.deleteNode,
        this.$i18n.messages[this.$i18n.locale].common.tip, {
          type: 'warning'
        }).then(() => {
        $this.api.dels({ keyId: data.keyId }).then(res => {
          if (res && res.data) {
            $this.success(this.$i18n.messages[this.$i18n.locale].common.delSuccess)
            dataChildren.splice(dataIndex, 1)
            node.parent.childNodes.splice(index, 1)
            // this.positionData = []
            // this.$refs['posTable'].currentTotal = 0
            // this.showPerson = false
            this.handleNodeClick(parent.data)
          } else {
            $this.error(this.$i18n.messages[this.$i18n.locale].common.delFailure)
          }
        })
      }).catch(() => {})
    },
    // 第一层数据--禁用删除
    deleteDisabled (node) {
      if (node.data.parentOrgId === '0') { return false }
      return !(node.data.deptList && node.data.deptList.length > 0)
    },
    showOrgPerson (node) {
      this.orgPersonModel = 'V'
      this.orgPersonItem = Object.assign({}, node)
      this.orgPerson = true
    },
    // 调整人员
    showAdjust (index, data) {
      this.adjustForm = Object.assign({}, data)
      this.adjustModel = 'E'
      this.openModel = 'position'
      this.adjustFlag = true
    },
    // 新增-职位
    showCreate () {
      if (!this.UtilJs.isEmpty(this.positionParas.orgId)) {
        this.positionForm = {}
        this.$set(this.positionForm, 'firstOrgId', this.positionParas.orgId)
        this.$set(this.positionForm, 'orgName', this.positionParas.orgName)
        this.$set(this.positionForm, 'showChild', this.organForm.showChild)
        this.positionModel = 'C'
        this.showPosition = true
      } else {
        this.warning(this.$i18n.messages[this.$i18n.locale].enterpriseInfoManage.organization.selectOrg)
      }
    },
    // 编辑-职位
    showEdit (index, data) {
      this.positionForm = Object.assign({ firstOrgId: this.positionParas.orgId, orgName: this.positionParas.orgName }, data)
      this.positionModel = 'E'
      this.showPosition = true
    },
    // 删除-职位
    del (index, data) {
      let $this = this
      $this.$confirm(this.$i18n.messages[this.$i18n.locale].enterpriseInfoManage.organization.deleteNode,
        this.$i18n.messages[this.$i18n.locale].common.tip, {
          type: 'warning'
        }).then(() => {
        organizationApi.position.dels({ keyId: data.keyId }).then(res => {
          if (res && res.data) {
            $this.success(this.$i18n.messages[this.$i18n.locale].common.delSuccess)
            $this.loadPosition()
            $this.showPerson = false
          } else {
            $this.error(this.$i18n.messages[this.$i18n.locale].common.delFailure)
          }
        })
      }).catch(() => {})
    },
    // 组织机构信息维护成功 刷新页面
    operateSuccess (val) {
      let $this = this
      // $this.loadFirstTreeData()
      if ($this.editModel === 'E') {
        let parent = $this.node.parent
        let dataChildren = parent.data.deptList
        let children = parent.childNodes
        let index = children.findIndex(item => {
          return item.data.keyId === val.keyId
        })
        let dataIndex = dataChildren.findIndex(item => {
          return item.keyId === val.keyId
        })
        children[index].orgDescribe = val.orgDescribe
        children[index].orgName = val.orgName
        children[index].orgSeq = val.orgSeq
        dataChildren[dataIndex].orgDescribe = val.orgDescribe
        dataChildren[dataIndex].orgName = val.orgName
        dataChildren[dataIndex].orgSeq = val.orgSeq
        if (!$this.UtilJs.isEmpty($this.positionParas.orgId)) {
          $this.loadPosition()
          if ($this.showPerson) {
            $this.loadStaff()
          }
        }
      } else if ($this.editModel === 'C') {
        if (!this.data.deptList) {
          this.$set(this.data, 'deptList', [])
        }
        val.NODE_KEY = val.keyId
        this.data.deptList.push(val)
      }
    },
    // 职位信息维护 列表刷新
    positionSuccess () {
      let $this = this
      $this.loadPosition()
      if ($this.positionModel === 'E') {
        if ($this.showPerson) {
          $this.loadStaff()
        }
      }
    },
    // 机构人员删除  刷新页面
    delRefresh () {
      let $this = this
      if (!$this.UtilJs.isEmpty($this.positionParas.orgId)) {
        $this.loadPosition()
        if ($this.showPerson) {
          $this.loadStaff()
        }
      }
    },
    // 加载员工数据
    loadStaff () {
      let $this = this
      $this.staffCount = $this.staffCount + 1
    },
    refreshTable () {
      let $this = this
      $this.positionCount = $this.positionCount + 1
      this.toggleFlag = false
      if ($this.showPerson) {
        $this.staffCount = $this.staffCount + 1
      }
    },
    // 重置员工查询条件
    clearStaffParam () {
      this.staffParas.pageIndex = 1
      this.staffParas.pageSize = 5
      this.staffParas.account = ''
      this.staffParas.name = ''
    },
    // 加载职位数据
    loadPosition () {
      let $this = this
      if ($this.UtilJs.isEmpty($this.positionParas.orgId)) {
        $this.warning(this.$i18n.messages[this.$i18n.locale].enterpriseInfoManage.organization.selectOrg)
      } else {
        $this.positionCount = $this.positionCount + 1
        this.toggleFlag = false
      }
    },
    // 第一次加载组织机构第一层数据
    loadFirstTreeData () {
      let $this = this
      $this.api.getTreeByTenant().then(res => {
        if (res && res.success && res.data) {
          if (res.data.length > 0) {
            $this.orgData = res.data
            let str = JSON.stringify($this.defaultExpandedKeys)
            res.data.forEach(item => {
              if (str.indexOf(item.keyId) === -1) {
                $this.defaultExpandedKeys.push(item.keyId)
              }
            })
            // this.$nextTick(() => {
            //   $this.searchTree()
            //   // setTimeout(function () {
            //   //   $this.searchTree()
            //   // }, 500)
            // })
            $this.handleNodeClick($this.orgData[0])
          }
        }
      })
    }
    // 节点 懒加载
    /* lazyLoadNode (node) {
      let $this = this
      if (node.level === 0) {
        $this.loadFirstTreeData()
      }
      if (node.level >= 1) {
        let paras = {
          keyId: ''
        }
        paras.keyId = node.data.keyId
        $this.loadChildData(paras)
      }
    }, */
    // 加载组织机构子节点数据
    /* loadChildData (paras) {
      let $this = this
      $this.api.getChild(paras).then(res => {
        if (res && res.success && res.data) {
          if (res.data.length > 0) {
            $this.orgData = res.data
          }
        }
      })
    } */
  },
  watch: {
    positionData: {
      handler () {
        if (!this.toggleFlag) {
          this.$nextTick(() => {
            this.positionData.forEach((item, index) => {
              this.$set(item, 'moreFlag', this.countLines(index))
              this.$set(item, 'moreBtnFlag', this.countLines(index))
            })
          })
        }
      },
      deep: true
    }
  }
}
</script>

<style scoped lang="scss" src="@/styles/enterpriseInfoManage/supplierInfoManage/organizationList.scss">
  [v-cloak] {
    display: none;
  }
</style>
