PersonGroupEditor.vue 3.12 KB
<template>
  <a-modal
      title="类型修正"
      v-if='isVisible'
      v-model:visible="isVisible"
      width="400px"
      height='50%'
      class="detail-modal"
  >
    <a-form :model="formData">
      <a-form-item label="年龄">
        <a-input-number
            v-model:value="formData.age"
            :min="1"
            :max="200"
            style="width: 100%;"
        />
      </a-form-item>
      <a-form-item label="年龄段">
        <a-select v-model:value="formData.ageGroup">
          <a-select-option :value="0">儿童</a-select-option>
          <a-select-option :value="1">成人</a-select-option>
        </a-select>
      </a-form-item>
      <a-form-item label="性别">
        <a-select v-model:value="formData.gender">
          <a-select-option :value="0"></a-select-option>
          <a-select-option :value="1"></a-select-option>
        </a-select>
      </a-form-item>
      <a-form-item label="类型">
        <a-select v-model:value="formData.type">
          <a-select-option :value="0">顾客</a-select-option>
          <a-select-option :value="1">员工</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 clusterResultApi from '@/views/SnapshotCluster/ClusterResult/ClusterResultApi'
import { ElMessage } from "element-plus";

export default {
  name: 'PersonGroupEditor',
  setup(props, { emit }) {
    const isVisible = ref(false);
    // 表单
    function getInitialFormData() {
      return {
        personUnid: '',
        age: 1,
        ageGroup: 1,
        gender: 0,
        type: 0,
        countdate: '',
      }
    }
    const formData = ref(getInitialFormData())

    const initDialog = (data) => {
      console.log('initDialog', data)
      formData.value = getInitialFormData()
      formData.value.personUnid = data.person_unids
      if (data.perrsonList.length > 0) {
        formData.value.age = data.perrsonList[0].age
        formData.value.gender = data.perrsonList[0].gender
        formData.value.type = data.perrsonList[0].person_type
        formData.value.countdate = data.perrsonList[0].counttime

        formData.value.ageGroup = data.perrsonList[0].childAdult || 1
      }
      isVisible.value = true;
    };

    const onCancel = () => {
      isVisible.value = false;
    };
    const onSave = () => {
      clusterResultApi.updatePerson(formData.value).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,
    };
  },
};
</script>

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