index.vue 1.4 KB
<template>
  <div class="people-container">
    <el-transfer @left-check-change="handleLeftChange" @right-check-change="handleRightChange" v-loading="loading"
      :filterable="true" :titles="[leftTitle, rightTitle]" v-model="childrenItemValue" :data="data" />
  </div>
</template>

<script name="peopleAdd" setup>
import { getPeopleInfo } from '@/api/attendance/attendance';
import { onMounted } from 'vue';
const loading = ref(false)
const props = defineProps({
  peopleNowValue: {
    require: false
  },
  leftTitle: {
    require: false,
    default: "所有人员",
    type: String
  },
  rightTitle: {
    require: false,
    default: "需重新生成人员",
    type: String
  }
})



const data = ref([])
const childrenItemValue = ref([])

const generateData = (val) => {
  let data = [];
  val.forEach(element => {
    data.push({
      key: element.jobCode,
      label: element.jobCode + '/' + element.name
    })
  });
  return data
}




const handleLeftChange = (val) => {
  // console.log(val);
}

const handleRightChange = (val) => {
  // console.log(val);
}

onMounted(() => {
  loading.value = true;
  // 获取人员信息
  getPeopleInfo({ id: null }).then((res) => {
    loading.value = false;
    data.value = generateData(res.data);
  })
})

defineExpose({
  childrenItemValue
});

</script>
<style scoped>
.people-container {
  display: flex;
  justify-content: center;
  align-items: center;
}
</style>