PersonGroupMover.vue

<template>
  <a-modal
      title="人员移动"
      v-if='isVisible'
      v-model:visible="isVisible"
      width="520px"
      height='50%'
      class="detail-modal"
  >
    <a-form :model="formData">
      <a-form-item label="分组">
        <a-select v-model:value="formData.personUnid" showSearch placeholder="请选择分组id">
          <a-select-option
              v-for="item in showDataList"
              :key="item"
              :value="item"
          >人id：{{item}}</a-select-option>
        </a-select>
      </a-form-item>
    </a-form>

    <template #footer>
      <a-button type="primary" @click="onSave">保存</a-button>
      <a-button @click="onCancel">关闭</a-button>
    </template>
  </a-modal>
</template>

<script>
import { ref } from "vue";
import { ElMessage } from "element-plus";
import clusterResultApi from './ClusterResultApi'

export default {
  name: 'PersonGroupEditor',
  props: {
    dataList: {
      type: Array,
      default: () => [],
    },
    dataParams: {
      type: Object,
      default: null,
    },
  },
  setup(props, { emit }) {
    const isVisible = ref(false);
    // 表单
    function getInitialFormData() {
      return {
        personUnid: '',
        unidList: [],
        countdate: '',
      }
    }
    const formData = ref(getInitialFormData())

    const initDialog = (data, selectedList) => {
      console.log('initDialog', data, selectedList)
      formData.value = getInitialFormData()
      formData.value.unidList = selectedList.map(item => item.unid)
      formData.value.countdate = data.perrsonList.length > 0 ? data.perrsonList[0].counttime : ''
      isVisible.value = true;

      getDataList()
    };

    const showDataList = ref([])
    const getDataList = () => {
      if (props.dataParams) {
        clusterResultApi.getClusterResultUidList(props.dataParams).then(r => {
          console.log('getClusterResultUidList', r)
          showDataList.value = r.data
        })
      } else {
        // 使用props.dataList
        showDataList.value = props.dataList.map(item => item.person_unid)
      }
    }

    const onCancel = () => {
      isVisible.value = false;
    };
    const onSave = () => {
      const params = {
        unid: formData.value.unidList.join(','),
        personUnid: formData.value.personUnid,
        countdate: formData.value.countdate,
      }
      clusterResultApi.updateRecognition(params).then(
          (r) => {
            if(r.msg_code==200){
              ElMessage({
                message: `保存成功`,
                type: 'success'
              })
              // 刷新列表
              emit('refresh')
              onCancel()
            } else {
              ElMessage({
                message: `保存失败`,
                type: 'error'
              })
            }
          }
      )
    };

    return {
      isVisible,
      formData,
      onSave,
      onCancel,
      initDialog,
      showDataList,
    };
  },
};
</script>

<style lang="less" scoped>
</style>