zdqy_firm_former/src/views/component/selectPositions.vue

<template>
  <el-cascader
    ref="cascader"
    v-model="selection"
    :options="options"
    :props="props"
    collapse-tags
    class="cascader"
    :clearable="false"
  />
</template>

<script>
import TreeUtils from '@/utils/tree'

export default {
  props: {
    filterGroup: {
      type: Boolean,
      default: false
    }
  },
  data() {
    const { level } = this.$store.getters
    return {
      level,
      props: {
        children: 'children',
        label: 'positionName',
        value: 'positionId',
        multiple: false,
        expandTrigger: 'hover',
        checkStrictly: true,
        emitPath: false
      },
      options: [],
      selection: '',
      selectionDept: {},
      filterDept: []
    }
  },
  watch: {
    selection(val) {
      if (!val) {
        return
      }
      this.$emit('handleFunc', {
        selection: this.selection,
        selectionDept: this.selectionDept,
        filterDept: this.filterDept
      })
    }
  },
  mounted() {
    this.getPositionList()
  },
  methods: {
    // 获取本账户所在的部门
    getPositionList() {
      // 直接获取store部门数据，无需调用接口
      // this.$common.request('query', {
      //     key: 'empManageBoard0',
      //     params: [this.level.first]
      // }).then(({ state, variables: { data } }) => {
      const {
        deptList = [],
        mainPosition,
        position
      } = this.$store.getters || {}
      const mainPos = mainPosition ? mainPosition.id : position.split(',')[0]
      this.selection = mainPos
      this.selectionDept = deptList.find((i) => i.positionId === mainPos)
      const deptEntity = deptList.filter((i) => i.depth >= 3)
      const filterLetter = [
        '综合',
        '质量',
        '科研',
        '教学',
        '医疗',
        '样品',
        '助理',
        '急诊'
      ]
      this.filterDept = this.filterGroup
        ? deptEntity.filter(
            (d) => !filterLetter.some((i) => d.positionName.includes(i))
          )
        : deptEntity
      this.options = this.toTree(this.filterDept)
      console.log(mainPosition, position, 'this.optionsthis.options')
    },
    toTree(data) {
      return TreeUtils.transformToTreeFormat(data, {
        idKey: 'positionId',
        pIdKey: 'parentId',
        childrenKey: 'children'
      })
    }
  }
}
</script>
<style lang="less" scoped>
/deep/ .el-tag--info {
  color: #fcfcfc;
  background-color: #00083e;
}
/deep/.el-input__inner {
  background-color: #00083e;
  border: 1px solid #4ea5d6;
  color: #fff;
}
</style>