FinanceEditCheck.vue 4.72 KB
<template>
  <template>
    <BasicDrawer
      @register="register"
      v-bind="$attrs"
      title="编辑"
      width="30%"
      :isDetail="true"
      @ok="handleSubmit"
      :showDetailBack="false"
      okText="保存"
      showFooter
      :destroyOnClose="true"
    >
      <!-- <div>
        <BasicForm @register="registerForm" />
      </div> -->
      <div style="font-size: 15px">实际付款金额1¥</div>
      <a-input v-model:value="input1" placeholder="请输入" :disabled="status === 10 || status === 40" auto-size />
      <div style="margin: 16px 0"></div>
      <div style="font-size: 15px">实际付款金额2¥</div>
      <a-input v-model:value="input2" placeholder="请输入" :disabled="status === 10 || status === 40" auto-size />
      <div style="margin: 16px 0"></div>
      <div style="font-size: 15px">实际付款金额3¥</div>
      <a-input v-model:value="input3" placeholder="请输入" :disabled="status === 10 || status === 40" auto-size />
      <div style="margin: 16px 0"></div>

      <!-- <template #titleToolbar> <a-button type="primary"> 申请编辑权限 </a-button></template> -->
      <template #appendFooter>
        <!-- <a-button type="primary" @click="onGoCheckDetail"> 申请权限</a-button> -->
      </template>
    </BasicDrawer>
  </template>
</template>
<script lang="ts" setup>
  import { BasicDrawer, useDrawerInner } from '@/components/Drawer';
  import { BasicForm, FormSchema, useForm } from '@/components/Form';
  import { defineComponent, ref, computed, unref, toRaw, reactive } from 'vue';
  import { getEmailList } from '/@/api/sys/config';
  import { updateAmountInfo } from '@/api/project/invoice';
  import { useMessage } from '/@/hooks/web/useMessage';

  const emit = defineEmits(['success']);
  const schemas: FormSchema[] = [
    // {
    //   field: 'actualPayedAmount',
    //   component: 'InputNumber',
    //   labelWidth: 250,
    //   colProps: {
    //     span: 23,
    //   },
    //   label: '生产科实际应付金额',
    // },
    {
      field: 'actualPayedAmount1',
      component: 'InputNumber',
      labelWidth: 250,
      colProps: {
        span: 23,
      },
      label: '实际应付金额1¥',
      componentProps: () => ({
        disabled: status.value === 10,
      }),
    },
    {
      field: 'actualPayedAmount2',
      component: 'InputNumber',
      labelWidth: 250,
      colProps: {
        span: 23,
      },
      label: '实际应付金额2¥',
      componentProps: () => ({
        disabled: status.value === 10,
      }),
    },
    {
      field: 'actualPayedAmount3',
      component: 'InputNumber',
      labelWidth: 250,
      colProps: {
        span: 23,
      },
      label: '实际应付金额3¥',
      componentProps: () => ({
        disabled: status.value === 10,
      }),
    },
  ];
  const [registerForm, { setFieldsValue, resetFields, validate }] = useForm({
    labelWidth: 120,
    schemas,
    layout: 'vertical',
    showActionButtonGroup: false,
    actionColOptions: {
      span: 24,
    },
  });
  const { createMessage } = useMessage();
  const { error } = createMessage;
  const update = ref();
  const status = ref();
  const input1 = ref();
  const input2 = ref();
  const input3 = ref();
  const id = ref();
  const [register, { setDrawerProps, closeDrawer }] = useDrawerInner((data) => {
    // 方式1
    resetFields();
    status.value = data.data.checkPayStatus;
    id.value = data.data.checkId;
    input1.value = data.data.checkActualPayedAmount1;
    input2.value = data.data.checkActualPayedAmount2;
    input3.value = data.data.checkActualPayedAmount3;
    setDrawerProps({ confirmLoading: false });
    // 将金额格式化为两位小数
    // setFieldsValue({
    //   actualPayedAmount1:
    //     data.data.actualPayedAmount1 !== null ? data.data.actualPayedAmount1.toFixed(2) : undefined,
    //   actualPayedAmount2:
    //     data.data.actualPayedAmount2 !== null ? data.data.actualPayedAmount2.toFixed(2) : undefined,
    //   actualPayedAmount3:
    //     data.data.actualPayedAmount3 !== null ? data.data.actualPayedAmount3.toFixed(2) : undefined,
    //   ...toRaw(data.data), // 其他字段
    // });
    setFieldsValue({
      ...toRaw(data.data),
    });
    update.value = data;
  });
  //完成编辑
  async function handleSubmit() {
    // const values = await validate();
    // const updatedValues = {
    //   ...values,
    //   id: update.value.data.id,
    // };
    if (!input1.value || !input2.value || !input3.value) {
      error('选项不能为空');
    } else {
      await updateAmountInfo({
        id: id.value,
        actualPayedAmount1: input1.value,
        actualPayedAmount2: input2.value,
        actualPayedAmount3: input3.value,
      });
      emit('success');
      closeDrawer();
    }
  }
</script>