FinanceEdit.vue 6.85 KB
<template>
  <template>
    <BasicDrawer
      @register="register"
      v-bind="$attrs"
      title="编辑"
      width="30%"
      :isDetail="true"
      @ok="handleSubmit"
      :showDetailBack="false"
      okText="保存"
      @visible-change="handleShow"
      showFooter
      :destroyOnClose="true"
    >
      <!-- <div>
        <BasicForm @register="registerForm" />
      </div> -->
      <div style="font-size: 15px">研发复制费合计¥</div>
      <a-input
        v-model:value="input1"
        placeholder="请输入"
        :disabled="status1 === 'LOCKED'"
        auto-size
      />
      <div style="margin: 16px 0"></div>
      <div style="font-size: 15px">项目开始时间</div>
      <a-date-picker v-model:value="input3" :disabled="status3 === 'LOCKED'" auto-size />
      <div style="margin: 16px 0"></div>
      <div style="font-size: 15px">项目结束时间</div>
      <a-date-picker v-model:value="input4" :disabled="status4 === 'LOCKED'" auto-size />
      <div style="margin: 16px 0"></div>
      <div style="font-size: 15px">西班牙已发提成¥</div>
      <a-input
        v-model:value="input2"
        placeholder="请输入"
        :disabled="status2 === 'LOCKED'"
        auto-size
      />
      <div style="margin: 16px 0"></div>
      <div style="font-size: 15px">中国团队已发提成¥</div>
      <a-input
        v-model:value="input5"
        placeholder="请输入"
        :disabled="status5 === 'LOCKED'"
        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 { getServiceEdit } from '@/api/project/invoice';
  import { useMessage } from '/@/hooks/web/useMessage';
  import { ROLE } from './type.d';
  import type { Dayjs } from 'dayjs';
  import dayjs from 'dayjs';

  const emit = defineEmits(['success']);
  const role = computed(() => {
    return user?.roleSmallVO?.code;
  });
  const schemas: FormSchema[] = [
    // {
    //   field: 'totalPayAmount',
    //   component: 'InputNumber',
    //   labelWidth: 250,
    //   colProps: {
    //     span: 23,
    //   },
    //   label: '实际应收金额',
    // },
    {
      field: 'developmentCopyRmbTotalPrice',
      component: 'InputNumber',
      labelWidth: 250,
      colProps: {
        span: 23,
      },
      // componentProps: () => ({
      //   disabled: status.value === 10,
      // }),
      label: '研发复制费合计¥',
    },
    {
      field: 'actualPayedAmount2',
      component: 'InputNumber',
      labelWidth: 250,
      colProps: {
        span: 23,
      },

      label: '实际应收金额2$',
    },
    {
      field: 'actualPayedAmount3',
      component: 'InputNumber',
      labelWidth: 250,
      colProps: {
        span: 23,
      },

      label: '实际应收金额3$',
    },
    {
      field: 'otherAmount',
      component: 'InputNumber',
      labelWidth: 250,
      colProps: {
        span: 23,
      },

      label: '其他费用金额$',
    },
  ];
  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 status1 = ref();
  const status2 = ref();
  const status3 = ref();
  const status4 = ref();
  const status5 = ref();

  const input1 = ref();
  const input2 = ref();
  const input3 = ref();
  const input4 = ref();

  const input5 = ref();
  const id = ref();
  // function formatDate(dateStr: string): string {
  //   const date = new Date(dateStr);
  //   const year = date.getFullYear();
  //   const month = String(date.getMonth() + 1).padStart(2, '0'); // 月份从0开始,+1
  //   const day = String(date.getDate()).padStart(2, '0');
  //   const hours = String(date.getHours()).padStart(2, '0');
  //   const minutes = String(date.getMinutes()).padStart(2, '0');
  //   const seconds = String(date.getSeconds()).padStart(2, '0');

  //   // 返回格式化后的字符串:'YYYY-MM-DD HH:mm:ss'
  //   return `${year}-${month}-${day} ${hours}:${minutes}:${seconds}`;
  // }
  function formatDateToDateOnly(dateStr: string): string {
    const date = new Date(dateStr);
    const year = date.getFullYear();
    const month = String(date.getMonth() + 1).padStart(2, '0'); // 月份从0开始,+1
    const day = String(date.getDate()).padStart(2, '0');

    // 返回格式化后的日期字符串:'YYYY-MM-DD'
    return `${year}-${month}-${day}`;
  }
  const [register, { setDrawerProps, closeDrawer }] = useDrawerInner((data) => {
    // 方式1
    if (data.data.lockFields) {
      status1.value = data?.data?.lockFields?.developmentCopyRmbTotalPrice;
      status2.value = data?.data?.lockFields?.spainPaidRmbCommission;
      status3.value = data?.data?.lockFields?.projectStartTime;
      status4.value = data?.data?.lockFields?.projectEndTime;
      status5.value = data?.data?.lockFields?.paidRmbCommission;
    }
    id.value = data?.data?.projectNoPrefix;
    input1.value = data?.data?.developmentCopyRmbTotalPrice.toFixed(2);
    input2.value = data?.data?.spainPaidRmbCommission.toFixed(2);
    input3.value = dayjs(formatDateToDateOnly(data?.data?.projectStartTime));
    input4.value = dayjs(formatDateToDateOnly(data?.data?.projectEndTime));
    input5.value = data?.data?.paidRmbCommission.toFixed(2);

    resetFields();
    setDrawerProps({ confirmLoading: false });
    setFieldsValue({
      ...toRaw(data.data),
    });
    update.value = data;
  });
  //完成编辑
  async function handleSubmit() {
    // const values = await validate();
    // const updatedValues = {
    //   ...values,
    //   id: update.value.data.id,
    //   bgUrl: update.value.data.bgUrl,
    // };
    if (!input1.value || !input2.value || !input3.value || !input4.value) {
      error('选项不能为空');
    } else {
      await getServiceEdit({
        projectNoPrefix: id.value,
        developmentCopyRmbTotalPrice: input1.value,
        spainPaidRmbCommission: input2.value,
        projectStartTime: input3.value,
        projectEndTime: input4.value,
        paidRmbCommission: input5.value,
      });
      emit('success');
      closeDrawer();
    }
  }
  function handleShow(visible: boolean) {
    if (!visible) {
      input1.value = '';
      input2.value = '';
      input3.value = '';
      input4.value = '';
      input5.value = '';
    }
  }
</script>