xg_total_process_master_cloud_vue/src/views/utils/UserTreeSelectToResign.vue

<template>
  <div>
    <el-dialog :title="title" :close-on-click-modal="false" draggable width="500px" height="700px" @close="close"
      append-to-body v-model="visible">
      <div style="height: calc(100% - 80px);">
        <el-form :inline="true" class="query-form" ref="searchForm" :model="searchForm"
          @keyup.enter.native="refreshList()" @submit.native.prevent>
          <!-- 搜索框-->
          <el-form-item label="" prop="name">
            <el-input v-model="searchForm.name" placeholder="请输入用户名称" clearable></el-input>
          </el-form-item>

          <el-form-item>
            <el-button type="primary" @click="list()" size="medium" icon="el-icon-search">查询</el-button>
            <el-button @click="resetSearch()" size="medium" icon="el-icon-refresh-right">重置</el-button>
          </el-form-item>
        </el-form>
        <vxe-table border="inner" auto-resize resizable height="400px" :loading="loading" size="small" ref="userTable"
          show-header-overflow show-overflow highlight-hover-row :menu-config="{}" :sort-config="{ remote: true }"
          :data="dataList" :row-config="{ isCurrent: true }" :radio-config="{ trigger: 'row' }"
          :tree-config="{ transform: true, rowField: 'id', parentField: 'parentId', expandAll: false }"
          :checkbox-config="{}">
          <!--          <vxe-column type="seq" width="60" title="序号"></vxe-column>-->
          <vxe-column type="radio" width="50"></vxe-column>

          <vxe-column title="姓名" min-width="180" field="name" align="left" tree-node></vxe-column>
        </vxe-table>
      </div>
      <template #footer>
        <span class="dialog-footer">
          <el-button @click="close()" size="medium" icon="el-icon-circle-close">关闭</el-button>
          <el-button type="primary" size="medium" v-if="method != 'view'" @click="getProgramForUser()"
            icon="el-icon-circle-check" v-noMoreClick>确定</el-button>
        </span>
      </template>

    </el-dialog>
  </div>
</template>

<script>
import ReimbursementService from '@/api/cw/reimbursementApproval/ReimbursementApprovalService.js'
import userService from "@/api/sys/userService";
import officeService from "@/api/sys/officeService";
export default {
  data() {
    return {
      title: '',
      method: '',
      visible: false,
      loading: false,
      dataList: [],
      searchForm: {
        name: ''
      }
    }
  },
  reimbursementService: null,
  created() {
    this.reimbursementService = new ReimbursementService()
  },
  components: {
  },
  methods: {
    init() {
      this.title = '人员选择'
      this.visible = true
      this.list()
    },
    // 表单提交
    getProgramForUser() {
      let rows = []
      if (this.commonJS.isEmpty(this.$refs.userTable.getRadioRecord())) {
        this.$message.error('请选择一条数据')
        return
      }
      // if (this.$refs.userTable.getCheckboxRecords().length > 1) {
      //   this.$message.error('最多选择一条数据')
      //   return
      // }
      let row = this.$refs.userTable.getRadioRecord()
      if (!row.isUser) {
        this.$message.error('请选择人员数据')
        return
      }
      this.close()
      rows.push(row)
      this.$emit('doSubmit', rows)
    },
    list() {
      this.loading = true
      this.reimbursementService.userTreeByTenantId(this.searchForm.name).then((data) => {
        this.dataList = data
        this.loading = false
        this.$nextTick(() => {
          this.$refs.userTable.setAllTreeExpand(true)
        })
        officeService.treeData({ tenantId: this.tenantId }).then(data1 => {
          userService
            .list({
              current: 1,
              size: 10,
              companyDTO: {
                id: data1[0].id
              },
            })
            .then((data2) => {
              let manager = data.filter(item => {
                return data2.records[0].id == item.id
              })
              this.$refs.userTable.setRadioRow(manager[0])
            });
        });

      })
    },
    // 当前页
    currentChangeHandle({ currentPage, pageSize }) {
      this.tablePage.currentPage = currentPage
      this.tablePage.pageSize = pageSize
      this.list()
    },
    resetSearch() {
      this.$refs.searchForm.resetFields()
      this.list()
    },
    close() {
      this.detail = ''
      this.visible = false
    }
  }
}
</script>
<style>
.messageZindex {
  z-index: 9999 !important;
}
</style>
<style scoped>
/deep/ .el-dialog__body {
  padding-top: 0px;
}
</style>