form.vue 3.53 KB
<template>
  <div>
    <BasicDrawer
      destroyOnClose
      showFooter
      v-bind="$attrs"
      @register="registerDrawer"
      width="50%"
      @ok="handleSubmit"
    >
      <BasicForm @register="registerForm">

      </BasicForm>
    </BasicDrawer>
  </div>
</template>
<script lang="ts" setup name="sqlApi">
import {
  getBigViewSql,
  saveDataViewSql
} from "/@/api/bigscreen/center/bigscreenCenter";
import {BasicDrawer, useDrawerInner} from "/@/components/Drawer";
import {BasicForm, useForm} from "/@/components/Form";
import {schemas} from "/@/views/dataview/sqlApi/config/config";
import {nextTick, ref} from "vue";
import {useUtils} from "/@/views/dataview/publicApi/hooks/useUtils";
import {useI18n} from "/@/hooks/web/useI18n";
import {useMessage} from "/@/hooks/web/useMessage";
import {buildUUID} from "/@/utils/uuid";
const { t } = useI18n();
const isUpdate = ref(false);
const { createMessage } = useMessage();
const emits = defineEmits(['success', 'register']);
const putId = ref('');
const sshId = ref('');
const sslId = ref('');
const {
  resetReqHttpType,
  resetUpdateSchema,
} = useUtils();

const [registerDrawer, { setDrawerProps, closeDrawer }] = useDrawerInner(async (data) => {
  await resetFields();
  await nextTick();
  setFieldsValue(resetReqHttpType);
  const title = `${
    !data.isUpdate ? t('visual.dataview.addtext') : t('visual.dataview.editText')
  }${t('visual.dataview.publicInterface')}`;
  setDrawerProps({ title });
  updateSchema(resetUpdateSchema);
  isUpdate.value = data.isUpdate;
  !isUpdate.value ? (putId.value = '') : (putId.value = data.record?.id);
  if (isUpdate.value) {
    const _data = await getBigViewSql(data?.record?.id)
    !isUpdate.value ? (sshId.value = '') : (sshId.value = _data?.ssh?.id);
    !isUpdate.value ? (sslId.value = '') : (sslId.value = _data?.ssl?.id);
    console.log(_data,'_data')
    await setFieldsValue({
      ..._data,
      ssh_ip: _data?.ssh?.ip,
      ssh_port: _data?.ssh?.port,
      ssh_sshName: _data?.ssh?.sshName,
      ssh_privateKey: _data?.ssh?.privateKey ? [{ uid: buildUUID(), name: '公钥文件', url: _data?.ssh?.privateKey }] : [],
      ssh_sshPassword: _data?.ssh?.sshPassword,
      ssh_verifyMethod: _data?.ssh?.verifyMethod
    });
  }
  });

const [registerForm, { resetFields, validate, setFieldsValue, updateSchema }] = useForm({
  labelWidth: 160,
  schemas: schemas(),
  showActionButtonGroup: false,
});

const handleSubmit = async () => {
  try {
    setDrawerProps({ loading: true });
    const values = await validate();
    if (!values) return;
    const processedData = {
      ...values,
      id: !putId.value ? null : putId.value,
      ssl: !sslId.value ? null : {id: sslId.value},
      ssh: {
        id: !sshId.value ? null : sshId.value,
        ip: values.ssh_ip,
        port: values.ssh_port,
        sshName: values.ssh_sshName,
        privateKey: values.ssh_privateKey?.[0]?.url || '',
        privateKeyFileName: values.ssh_privateKey?.[0]?.name || '',
        sshPassword: values.ssh_sshPassword,
        verifyMethod: values.ssh_verifyMethod
      }
    }
    delete processedData.ssh_ip
    delete processedData.ssh_port
    delete processedData.ssh_privateKey
    delete processedData.ssh_sshPassword
    delete processedData.ssh_verifyMethod
    const res = await saveDataViewSql(processedData);
    if (res?.id) {
      createMessage.success(t('common.createSuccessText'));
      closeDrawer();
      emits('success');
    }else {
      createMessage.error(t('common.createFailedText'))
    }
  } finally {
    setDrawerProps({ loading: false });
  }
}
</script>