web/apps/web-baicai/src/views/system/job/term/components/edit.vue

<script lang="ts" setup>
import { computed, ref, unref } from 'vue';

import { alert, useVbenModal } from '@vben/common-ui';

import { useFormOptions, useVbenForm } from '#/adapter';
import { JobTermApi } from '#/api';

import { jobScriptCode, useSchema } from '../data.config';

defineOptions({
  name: 'RoleEdit',
});
const emit = defineEmits(['success']);
const modelRef = ref<Record<string, any>>({});
const isUpdate = ref(true);

const [Form, { validate, setValues, getValues, updateSchema }] = useVbenForm(
  useFormOptions({
    wrapperClass: 'grid-cols-2',
    schema: useSchema(),
  }),
);

const [Modal, { close, setState, getData, lock, unlock }] = useVbenModal({
  fullscreenButton: false,
  draggable: true,
  closeOnClickModal: false,
  onCancel() {
    close();
  },
  onConfirm: async () => {
    try {
      const { valid } = await validate();
      if (!valid) return;
      const values = await getValues();
      if (values.jobCreateType === 2) {
        values.scriptCode = '';
        const httpJob = Object.assign({}, values.httpJob, {
          ClientName: 'HttpJob',
          EnsureSuccessStatusCode: true,
          Timeout: 100_000,
        });
        delete values.httpJob;
        values.properties = JSON.stringify({
          HttpJob: JSON.stringify(httpJob),
        });
      }
      lock();
      const postParams = unref(modelRef);
      Object.assign(postParams, values);
      await (unref(isUpdate)
        ? JobTermApi.editDetail(postParams as JobTermApi.RecordItem)
        : JobTermApi.addDetail(postParams as JobTermApi.BasicRecordItem));
      alert('操作成功');

      emit('success');
      close();
    } finally {
      unlock();
    }
  },
  onOpenChange: async (isOpen: boolean) => {
    if (isOpen) {
      setState({ loading: true });
      const data = getData<Record<string, any>>();
      isUpdate.value = !!data.isUpdate;
      modelRef.value = { ...data.baseData };

      if (unref(isUpdate)) {
        const entity = await JobTermApi.getDetail(data.baseData.id);

        if (entity.jobCreateType === 2) {
          entity.httpJob = JSON.parse(JSON.parse(entity.properties).HttpJob);
        }

        modelRef.value = { ...entity };
        setValues(entity);
        updateSchema([
          { fieldName: 'jobId', componentProps: { disabled: true } },
          { fieldName: 'jobCreateType', componentProps: { disabled: true } },
        ]);
      } else {
        setValues({ scriptCode: jobScriptCode });
        updateSchema([
          { fieldName: 'jobId', componentProps: { disabled: false } },
          { fieldName: 'jobCreateType', componentProps: { disabled: false } },
        ]);
      }
      setState({ loading: false });
    }
  },
});

const getTitle = computed(() =>
  unref(isUpdate) ? '编辑任务调试' : '新增任务调试',
);
</script>
<template>
  <Modal class="w-[1000px]" :title="getTitle">
    <Form />
  </Modal>
</template>