TrackEditCheck.vue 4.41 KB
<template>
  <template>
    <BasicDrawer
      @register="register"
      v-bind="$attrs"
      title="跟单编辑"
      width="30%"
      :isDetail="true"
      @ok="handleSubmit"
      :showDetailBack="false"
      @visible-change="handleShow"
      okText="保存"
      showFooter
      :destroyOnClose="true"
    >
      <div>
        <div style="font-size: 15px">生产科扣款金额¥</div>
        <a-input v-model:value="input1" placeholder="请输入" :disabled="status === 10" auto-size />
        <div style="margin: 16px 0"></div>
        <div style="font-size: 15px">扣款责任部门</div>
        <a-input
          v-model:value="deductDept"
          placeholder="请输入"
          :disabled="status === 10"
          auto-size
        />
        <!-- <a-select
          ref="select"
          style="width: 60%"
          v-model:value="selectedProductionDepartment"
          :options="productionDepartmentOptions"
        /> -->
        <!-- <a-select
          ref="select"
          style="width: 100%"
          v-model:value="productionDepartment"
          :options="productDepartmentOptions"
        /> -->
        <div style="margin: 16px 0"></div>
        <div>上传扣款单</div
        ><a-space direction="vertical" style="width: 100%" size="large">
          <a-upload
            v-model:file-list="fileList"
            :beforeUpload="beforeUpload"
            list-type="picture"
            :max-count="1"
            :disabled="status === 10"
            :action="updateDeductUrl"
            @change="handleChange"
          >
            <a-button> 上传扣款单 </a-button>
          </a-upload>
        </a-space>
      </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 { defineComponent, ref, computed, unref, toRaw, reactive, onMounted } from 'vue';
  import { getEmailList } from '/@/api/sys/config';
  import { UploadOutlined } from '@ant-design/icons-vue';
  import type { UploadProps } from 'ant-design-vue';
  import { updateDeductInfo } from '@/api/project/invoice';
  import { useMessage } from '/@/hooks/web/useMessage';

  const emit = defineEmits(['success']);
  const fileList = ref<UploadProps['fileList']>([]);
  const input1 = ref(0);
  const deductUrl = ref();
  const id = ref();
  const checkNo = ref();
  const deductDept = ref();
  const uploadUrl = ref('http://47.104.8.35:80/api/localStorage/upload_file_oss?name=');
  const updateDeductUrl = ref('http://47.104.8.35:80/api/localStorage/upload_file_oss?name=');
  // const uploadUrl = ref('');
  // const updateDeductUrl = ref('');
  const deductUrlOld = ref();
  const { createMessage } = useMessage();
  const { error } = createMessage;
  const status = ref();

  const [register, { setDrawerProps, closeDrawer }] = useDrawerInner((data) => {
    status.value = data.data.checkPayStatus;
    id.value = data.data.checkId;
    checkNo.value = data.data.checkNo;
    input1.value = data.data.checkDeductAmount;
    deductDept.value = data.data.checkDeductDept;
    deductUrl.value = data.data.checkDeductUrl;
    deductUrlOld.value = data.data.checkDeductUrl;
  });
  function handleChange(info) {
    if (info.file.status == 'done') {
      updateDeductUrl.value = info.file.response.data.fileUrl;
      deductUrl.value = updateDeductUrl.value;
    }
    if (info.fileList.length == 0) {
      info.file = null;
      deductUrl.value = '';
    }
  }
  function beforeUpload(info) {
    updateDeductUrl.value = uploadUrl.value + info.name;
  }
  function handleShow() {
    // input1.value = '';
    // deductUrl.value = '';
    // deductDept.value = '';
    // updateDeductUrl.value = '';
    // fileList.value = [];
  }
  //完成编辑
  async function handleSubmit() {
    if (!input1.value || !deductDept.value) {
      error('选项不能为空');
    } else {
      await updateDeductInfo({
        id: id.value,
        checkNo: checkNo.value,
        deductAmount: input1.value,
        deductDept: deductDept.value,
        deductUrl: deductUrl.value,
      });
      // productionDepartment: selectedProductionDepartment.value,
      fileList.value = [];
      emit('success');
      closeDrawer();
    }
  }
</script>