FinanceEdit.vue 5.55 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">包装费用实际金额¥</div>
      <a-input
        v-model:value="input1"
        placeholder="请输入"
        :disabled="status === 'LOCKED'"
        auto-size
      />
      <div style="margin: 16px 0"></div>
      <div style="font-size: 15px">跟单评分</div>
      <a-input
        v-model:value="input2"
        placeholder="请输入"
        :disabled="status_score === 'LOCKED'"
        auto-size
      />
      <div style="margin: 16px 0"></div>
      <div style="font-size: 15px">已发提成</div>
      <a-input
        v-model:value="input_issuedCommission"
        placeholder="请输入"
        :disabled="status_issuedCommission === 'LOCKED'"
        auto-size
      />
      <div style="margin: 16px 0"></div>
      <div style="font-size: 15px">备注</div>
      <a-textarea
        v-model:value="packNotes"
        placeholder="请输入"
        rows="4"
      />
      <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 { getPackageEdit } from '@/api/project/invoice';
  import { useMessage } from '/@/hooks/web/useMessage';
  import { ROLE } from './type.d';


  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: 'actualPayedAmount1',
      component: 'InputNumber',
      labelWidth: 250,
      colProps: {
        span: 23,
      },
      componentProps: () => ({
        disabled: status.value === 10,
      }),
      label: '实际应收金额1$',
    },
    {
      field: 'actualPayedAmount2',
      component: 'InputNumber',
      labelWidth: 250,
      colProps: {
        span: 23,
      },
      componentProps: () => ({
        disabled: status.value === 10,
      }),
      label: '实际应收金额2$',
    },
    {
      field: 'actualPayedAmount3',
      component: 'InputNumber',
      labelWidth: 250,
      colProps: {
        span: 23,
      },
      componentProps: () => ({
        disabled: status.value === 10,
      }),
      label: '实际应收金额3$',
    },
    {
      field: 'otherAmount',
      component: 'InputNumber',
      labelWidth: 250,
      colProps: {
        span: 23,
      },
      componentProps: () => ({
        disabled: status.value === 10,
      }),
      label: '其他费用金额$',
    },
  ];
  const [registerForm, { setFieldsValue, resetFields, validate }] = useForm({
    labelWidth: 120,
    schemas,
    layout: 'vertical',
    showActionButtonGroup: false,
    actionColOptions: {
      span: 24,
    },
  });
  const { createMessage } = useMessage();
  const { error } = createMessage;

  const packNotes = ref();
  const update = ref();
  const status = ref();
  const status_score = ref();
  const status_issuedCommission = ref();
  const input1 = ref();
  const input2 = ref();
  const input_issuedCommission = ref();
  const id = ref();
  const loading = ref(false);
  const [register, { setDrawerProps, closeDrawer }] = useDrawerInner((data) => {
    // 方式1
    if (data.data.lockFields) {
      status.value = data.data.lockFields?.packetActualRmbTotalPrice;
      status_score.value = data.data.lockFields?.orderScore;
      status_issuedCommission.value = data.data.lockFields?.issuedCommission;
    }
    id.value = data.data.orderId;
    input1.value = data.data?.packetActualRmbTotalPrice;
    input2.value = data.data?.orderScore;
    input_issuedCommission.value = data.data?.issuedCommission;
    packNotes.value = data.data?.packNotes;
    resetFields();
    setDrawerProps({ confirmLoading: false });
    setFieldsValue({
      ...toRaw(data.data),
    });
    update.value = data;
  });
  //完成编辑
  async function handleSubmit() {
    if (loading.value) return;
    loading.value = true;
    setDrawerProps({ confirmLoading: true });
    if (!input1.value) {
      error('包装费用实际金额不能为空');
      loading.value = false;
      setDrawerProps({ confirmLoading: false });
    } else {
      try {
        const params = {
          orderId: id.value,
          packetActualRmbTotalPrice: Number(input1.value),
          ...(input2.value ? { orderScore: Number(input2.value) } : {}),
          ...(input_issuedCommission.value ? { issuedCommission: Number(input_issuedCommission.value) } : {}),
          ...(packNotes.value ? { packNotes: packNotes.value } : {}),
        };
        await getPackageEdit(params);
        emit('success');
      } finally {
        loading.value = false;
        setDrawerProps({ confirmLoading: false });
        closeDrawer();
      }
    }
  }
</script>