采购结算

src/views/contract/ContractPurPng/components/createForm.vue

@@ -1,6 +1,6 @@
 <template>
   <a-spin :spinning="spinning" tip="加载中...">
-    <div class="page-bg-wrap formViewStyle">
+    <div class="page-bg-wrap formViewStyle" :class="isViewForm ? 'viewPage':''">
       <a-form ref="formRef" :model="formState" :rules="rules" v-bind="layout">
         <Card title="合同档案" :bordered="false" >
           <a-row>
@@ -231,7 +231,7 @@
     const formId = ref(currentRoute.value?.params?.id);
     const pageType = ref(currentRoute.value.query?.type);
     const pageId = ref(currentRoute.value.query?.id)
-    
+    const isViewForm = currentRoute.value.path.includes('viewForm')
     const contractQty=ref()
     const spinning = ref(false);
     const curIdx = ref(null)
@@ -312,6 +312,9 @@
       getOption()
       if (pageId.value) {
         getInfo(pageId.value)
+        if (currentRoute.value.query?.disabled) {
+          isDisable.value = true 
+        }
       } else {
         formState.empName = userInfo.name
         formState.empId = userInfo.id
@@ -662,5 +665,8 @@
       padding: 10px;
       margin-bottom: 10px;
     }
+    .viewPage {
+      padding: 6px 12px !important;
+    }
     
 </style>

src/views/dayPlan/PngSettleHdr/components/createForm.vue

@@ -79,27 +79,7 @@
           </a-row>
         </Card>
         <Card>
-          <div class="btnBox">
-            <a-button v-if="!isDisable" type="primary" style="margin-bottom: 10px;margin-right: 10px;" @click="handleBtn('add')">新增</a-button>
-            <a-button v-if="!isDisable" @click="handleBtn('del')">删除</a-button>
-            <span>一次结算量吉焦：</span>
-            <span>二次结算量吉焦：</span>
-            <span>结算总量(吉焦)：</span>
-            <span>结算总金额：</span>
-          </div>
-          <a-table :columns="columns" :data-source="dataList" :scroll="{x: 1800}" rowKey="salesId" :pagination="false" :row-selection="{ selectedRowKeys: selectedKeys, onChange: onSelectChange }">
-            <template #bodyCell="{ column, record, index }">
-              <template v-if="column.dataIndex === 'operation'">
-                <a v-if="!isDisable" @click="btnCheck(record, index, 'delete')">删除</a>
-              </template>
-              <template v-if="column.dataIndex === 'priceDesc'">
-                <a @click="btnCheck(record, index, 'price')">{{record.priceDesc}}</a>
-              </template>
-              <template v-if="column.dataIndex === 'ksName'">
-                <a @click="btnCheck(record, index, 'ksName')">{{record.ksName}}</a>
-              </template>
-            </template>
-          </a-table>
+          <settleSalesPurList :list="dataList" :disabled="isDisable" pageType="customer" :formState="formState" @change="settleChange"></settleSalesPurList>
         </Card>
         <Card title="对账单" :bordered="false" >
           <UploadList :disabled="isDisable" btnTip="上传对账单" :list="dataFileAccount" :value="formState.filePath" :tableName="tableName" :columnName="columnName" @change="uploadChange"/>
@@ -110,8 +90,7 @@
       </a-form>
     </div>
     <customerListModal @register="registerCustomer" @success="handleSuccessCustomer" selectType="radio" />
-    <measureListModal @register="registerMeasure" @success="handleSuccessMeasure"></measureListModal>
-    <priceComposeListModal @register="registerPrice" @success="handleSuccessPrice"></priceComposeListModal>
+   
   </a-spin>
 </template>
 
@@ -133,8 +112,8 @@
     import { message } from 'ant-design-vue';
     import UploadList from '/@/components/Form/src/components/UploadList.vue';
     import customerListModal from '/@/components/common/customerListModal.vue';
-    import measureListModal from '/@/components/common/measureListModal.vue';
-    import priceComposeListModal from '/@/components/common/priceComposeListModal.vue';
+    import settleSalesPurList from '/@/components/common/settleSalesPurList.vue';
+   
     import { getAllCom} from '/@/api/contract/ContractPurInt';
     import { DataFormat, FormatOption, DATE_FORMAT, FormatType } from '/@/utils/dataFormat';
 
@@ -172,9 +151,9 @@
       settleTypeCode: 'I',
       rpSign: 'Y'
     });
-    const [registerMeasure, { openModal:openModalMeasure}] = useModal();
+   
     const [registerCustomer, { openModal:openModalCustomer}] = useModal();
-    const [registerPrice, { openModal:openModalPrice}] = useModal();
+    
     const rules= reactive({
       settleMonth: [{ required: true, message: "该项为必填项", trigger: 'change' }],
       dateFrom: [{ required: true, message: "该项为必填项", trigger: 'change' }],
@@ -195,24 +174,7 @@
       comIdList: [],
       signList: []
     });
-    const selectedKeys = ref([])
-    const columns = ref([
-      { title: t('序号'), dataIndex: 'index', key: 'index',  customRender: (column) => `${column.index + 1}` ,width: 80},
-      { title: t('计划日期'), dataIndex: 'datePlan',  width:120},
-      { title: t('提气日期'), dataIndex: 'dateMea',  width: 120},
-      { title: t('合同名称'), dataIndex: 'ksName', width: 200},
-      { title: t('下载点'), dataIndex: 'pointDelyName',width: 150 },
-      { title: t('完成量(吉焦)'), dataIndex: 'qtyMeaGj', width: 150},
-      { title: t('完成量(方)'), dataIndex: 'qtyMeaM3', width: 120},
-      { title: t('结算量(吉焦)'), dataIndex: 'qtySettleGj', width: 140},
-      { title: t('结算量(方)'), dataIndex: 'qtySettleM3', width: 130},
-      { title: t('结算价格(元/吉焦)'), dataIndex: 'priceGj', width: 180},
-      { title: t('结算价格(元/方)'), dataIndex: 'priceM3', width: 170},
-      { title: t('结算金额(元)'), dataIndex: 'amount', width: 140},
-      { title: t('价格组成'), dataIndex: 'priceDesc', width: 180},
-      { title: t('结算次数'), dataIndex: 'settleTimes', width: 100},
-      { title: t('操作'), dataIndex: 'operation', width: 80},
-    ]);
+  
     watch(
       () => props.id,
       (val) => {
@@ -240,9 +202,7 @@
       }
    
     });
-    const onSelectChange = (rowKeys) => {
-      selectedKeys.value = rowKeys;
-    }
+    
     const uploadChange = (val) => {
       dataFileAccount.value = val
     }
@@ -291,6 +251,34 @@
       formState.qtySettleM3 = a.qtySettleM3
       formState.amount = a.amount
     }
+    const settleChange = (val) => {
+      dataList.value = val 
+      numClear()
+      tableCount()
+    }
+    const numClear = () => {
+      if (!dataList.value.length) {
+        formState.qtySettleGj = ''
+        formState.qtySettleM3 = ''
+        formState.amount = ''
+      }
+    }
+    const tableCount = () => {
+      let qtySettleGj = 0
+      let qtySettleM3 = 0
+      let amount = 0
+      dataList.value.forEach(v => {
+        if (Number(v.settleTimes) == 1){
+          qtySettleGj+=Number(v.qtySettleGj) || 0
+          qtySettleM3+=Number(v.qtySettleM3) || 0
+        }
+        amount+=Number(v.amount) || 0
+      })
+      formState.qtySettleGj = qtySettleGj.toFixed(3)
+      formState.qtySettleM3 = qtySettleM3.toFixed(3)
+      formState.amount = amount.toFixed(2)
+      numFormat()
+    }
     const comIdChange = (val) => {
       if (!val)return
       getDate()
@@ -328,115 +316,6 @@
       }
       return endValue.valueOf() <= startValue.valueOf();
     }
-    const handleBtn = (type) => {
-      if (type === 'add') {
-        if (!formState.cpCode || !formState.comId) {
-          message.warn('请选择客户和交易主体')
-          return
-        }
-        let obj = {
-          cpCode: formState.cpCode,
-          comId: formState.comId
-        }
-        openModalMeasure(true,{isUpdate: false, searchParams: obj})
-      } else {
-        if (!selectedKeys.value.length) {
-          message.warn('请选择删除数据')
-          return
-        }
-        selectedKeys.value.forEach(i => {
-          let idx = dataList.value.findIndex(v=>v.salesId == i)
-          idx>-1&&dataList.value.splice(idx, 1)
-        });
-        setTimeout(() => {
-          selectedKeys.value = []
-          numClear()
-        }, 1000);
-      }
-    }
-    const numClear = () => {
-      if (!dataList.value.length) {
-        formState.qtySettleGj = ''
-        formState.qtySettleM3 = ''
-        formState.amount = ''
-      }
-    }
-    const handleSuccessMeasure = (val) => {
-      val.forEach(i =>{
-        delete i.lngFileUploadList
-      })
-      if (!dataList.value.length) {
-        dataList.value = val
-        return
-      }
-      val.forEach(v=> {
-        let idx = dataList.value.findIndex(k=>k.salesId==v.salesId)
-        idx<0&&dataList.value.push(v)
-      })
-    }
-    const btnCheck = (record, index, type) => {
-      if (type == 'delete') {
-        dataList.value.splice(index, 1)
-        numClear()
-      } 
-      if (type == 'price'){
-        openModalPrice(true,{isUpdate: false, record,isDisable: isDisable.value})
-      }
-      if (type == 'ksName'){
-        router.push({
-        path: '/contract/ContractSales/viewForm',
-         query: {
-          formPath: 'dayPlan/PngSettleHdr',
-          id: record.ksId,
-          disabled: true
-        }
-      });
-      }
-    }
-    const handleSuccessPrice = (arr, curRecord) => {
-      let qtySettleGj = 0
-      let qtySettleM3 = 0
-      let amount = 0
-      let idx = dataList.value.findIndex(v =>v.salesId == curRecord.salesId)
-      arr.forEach(v=> {
-        qtySettleGj+=Number(v.qtySettleGj) || 0
-        qtySettleM3+=Number(v.qtySettleM3) || 0
-        amount+=Number(v.amount) || 0
-        if (idx>-1&&!dataList.value[idx].id) {
-          v.id = ''
-        }
-      })
-      // price_gj=amount/qty_settle_gj，保留4位小数
-      // price_m3=amount/qty_settle_m3，保留4位小数
-      let priceGj = qtySettleGj ? Number(amount) / Number(qtySettleGj) : '0'
-      let priceM3 = qtySettleM3 ? Number(amount) / Number(qtySettleM3) : '0'
-      
-      if (idx > -1) {
-        dataList.value[idx].qtySettleGj = qtySettleGj.toFixed(3)
-        dataList.value[idx].qtySettleM3 = qtySettleM3.toFixed(3)
-        dataList.value[idx].amount = amount.toFixed(2)
-        dataList.value[idx].priceGj = priceGj.toFixed(4)
-        dataList.value[idx].priceM3 = priceM3.toFixed(4)
-        dataList.value[idx].lngPngSettleSalesDtlList = arr
-        tableCount()
-      }
-    }
-    const tableCount = () => {
-      let qtySettleGj = 0
-      let qtySettleM3 = 0
-      let amount = 0
-      dataList.value.forEach(v => {
-        if (Number(v.settleTimes) == 1){
-          qtySettleGj+=Number(v.qtySettleGj) || 0
-          qtySettleM3+=Number(v.qtySettleM3) || 0
-        }
-        amount+=Number(v.amount) || 0
-      })
-      formState.qtySettleGj = qtySettleGj.toFixed(3)
-      formState.qtySettleM3 = qtySettleM3.toFixed(3)
-      formState.amount = amount.toFixed(2)
-      numFormat()
-    }
     const onSearchCustomer = () => {
       openModalCustomer(true,{isUpdate: false})
     }
@@ -517,9 +396,4 @@
         margin-bottom: 12px;
         border-bottom: 1px solid #eee;
     }
-    .btnBox {
-      span {
-        margin: 0 30px;
-      }
-    }
 </style>

src/views/dayPlan/PngSettleHdrPur/components/config.ts

@@ -53,7 +53,7 @@ export const columns: BasicColumn[] = [
   },
 
   {
-    dataIndex: 'cpName',
+    dataIndex: 'suSname',
     title: '供应商简称',
     componentType: 'input',
     align: 'left',

src/views/dayPlan/PngSettleHdrPur/components/createForm.vue

@@ -0,0 +1,399 @@
+<template>
+  <a-spin :spinning="spinning" tip="加载中...">
+    <div class="page-bg-wrap formViewStyle">
+      <a-form ref="formRef" :model="formState" :rules="rules" v-bind="layout">
+        <Card title="" :bordered="false" >
+          <a-row> 
+            <a-col :span="8">
+              <a-form-item label="结算月" name="settleMonth">
+                <a-date-picker v-model:value="formState.settleMonth" style="width: 100%" picker="month" :disabled="isDisable" placeholder="请选择结算月" />
+              </a-form-item>
+            </a-col>
+            <a-col :span="8">
+              <a-form-item label="结算月开始日期" name="dateFrom">
+                <a-date-picker v-model:value="formState.dateFrom" style="width: 100%" :disabled="isDisable" :disabled-date="disabledDateStart" placeholder="请选择开始日期" />
+              </a-form-item>
+            </a-col>
+            <a-col :span="8">
+              <a-form-item label="结算月结束日期" name="dateTo">
+                <a-date-picker v-model:value="formState.dateTo" style="width: 100%" :disabled="isDisable" :disabled-date="disabledDateEnd" placeholder="请选择结束日期" />
+              </a-form-item>
+            </a-col>
+            <a-col :span="8">
+              <a-form-item label="供应商" name="cpName">
+                <a-input-search v-model:value="formState.cpName" :disabled="isDisable || dataList.length" placeholder="请选择供应商"  readonly @search="onSearchCustomer"/>
+              </a-form-item>
+            </a-col>
+            <a-col :span="8">
+              <a-form-item label="交易主体" name="comId">
+                <a-select v-model:value="formState.comId" :disabled="isDisable || dataList.length" @change="comIdChange" placeholder="请选择" style="width: 100%" allow-clear>
+                  <a-select-option v-for="item in optionSelect.comIdList" :key="item.id" :value="item.id">
+                    {{ item.name }}
+                  </a-select-option>
+                </a-select>
+              </a-form-item>
+            </a-col>
+            <a-col :span="8">
+              <a-form-item label="账期内含预收付款" name="rpSign">
+                <a-select v-model:value="formState.rpSign" style="width: 100%" allow-clear :disabled="isDisable">
+                  <a-select-option v-for="item in optionSelect.signList" :key="item.code" :value="item.code">
+                      {{ item.name }}
+                  </a-select-option>
+                </a-select>
+              </a-form-item>
+            </a-col>
+            <a-col :span="8">
+              <a-form-item label="结算总数量(吉焦)" name="qtySettleGj">
+                <a-input v-model:value="formState.qtySettleGj" disabled/>
+              </a-form-item>
+            </a-col>
+             <a-col :span="8">
+              <a-form-item label="结算总数量(方)" name="qtySettleM3">
+                <a-input v-model:value="formState.qtySettleM3" disabled/>
+              </a-form-item>
+            </a-col>
+             <a-col :span="8">
+              <a-form-item label="结算总金额(元)" name="amount">
+                <a-input v-model:value="formState.amount" disabled/>
+              </a-form-item>
+            </a-col>
+            <a-col :span="8">
+              <a-form-item label="状态" name="approCode">
+                <a-select v-model:value="formState.approCode" disabled style="width: 100%" allow-clear>
+                  <a-select-option v-for="item in optionSelect.approCodeList" :key="item.code" :value="item.code">
+                      {{ item.name }}
+                  </a-select-option>
+                </a-select>
+              </a-form-item>
+            </a-col>
+            <a-col :span="24">
+              <a-form-item label="结算说明" name="settleDesc" :label-col="{ span: 3 }" :wrapper-col="{ span: 24 }">
+                <a-textarea  v-model:value="formState.settleDesc" :disabled="isDisable"  :auto-size="{ minRows: 2, maxRows: 5 }"/>
+              </a-form-item>
+            </a-col>
+            <a-col :span="24">
+              <a-form-item label="备注" name="note" :label-col="{ span: 3 }" :wrapper-col="{ span: 24 }">
+                <a-textarea  v-model:value="formState.note" :disabled="isDisable"  :auto-size="{ minRows: 2, maxRows: 5 }"/>
+              </a-form-item>
+            </a-col>
+          </a-row>
+        </Card>
+        <Card>
+          <settleSalesPurList :list="dataList" :disabled="isDisable" pageType="supplier" :formState="formState" @change="settleChange"></settleSalesPurList>
+        </Card>
+        <Card title="对账单" :bordered="false" >
+          <UploadList :disabled="isDisable" btnTip="上传对账单" :list="dataFileAccount" :value="formState.filePath" :tableName="tableName" :columnName="columnName" @change="uploadChange"/>
+        </Card>
+        <Card title="附件信息" :bordered="false" >
+          <UploadList :disabled="isDisable" :list="dataFile" :value="formState.filePath" :tableName="tableName" :columnName="columnName" @change="uploadListChange"/>
+        </Card>
+      </a-form>
+    </div>
+    <supplierListModal @register="registerSupplier" @success="handleSuccessSupplier" selectType="radio" />
+   
+  </a-spin>
+</template>
+
+<script lang="ts" setup>
+    import { Card } from 'ant-design-vue';
+    import { useRouter } from 'vue-router';
+    import { FromPageType, RecordType } from '/@/enums/workflowEnum';
+    import { ref, computed, onMounted, onBeforeMount, nextTick, defineAsyncComponent, reactive, defineComponent, watch} from 'vue';
+    import { useMessage } from '/@/hooks/web/useMessage';
+    import { useI18n } from '/@/hooks/web/useI18n';
+    import { useMultipleTabStore } from '/@/store/modules/multipleTab';
+    import useEventBus from '/@/hooks/event/useEventBus';
+    import type { Rule } from 'ant-design-vue/es/form';
+    import { getDictionary } from '/@/api/sales/Customer';
+    import { useModal } from '/@/components/Modal';
+    import { addLngPngSettleHdr,updateLngPngSettleHdr, getLngPngSettleHdr, getLngPngSettleHdrDate} from '/@/api/dayPlan/PngSettleHdrPur';
+    import dayjs from 'dayjs';
+    import { getAppEnvConfig } from '/@/utils/env';
+    import { message } from 'ant-design-vue';
+    import UploadList from '/@/components/Form/src/components/UploadList.vue';
+    import supplierListModal from '/@/components/common/supplierListModal.vue';
+    import settleSalesPurList from '/@/components/common/settleSalesPurList.vue';
+   
+    import { getAllCom} from '/@/api/contract/ContractPurInt';
+    import { DataFormat, FormatOption, DATE_FORMAT, FormatType } from '/@/utils/dataFormat';
+
+    const tableName = 'PngSettleHdr';
+    const columnName = 'PngSettleHdr'
+
+    const formType = ref('2'); // 0 新建 1 修改 2 查看
+    const formRef = ref();
+    const props = defineProps({
+      disabled: false,
+      id: ''
+    
+    });
+    const { bus, FORM_LIST_MODIFIED } = useEventBus();
+
+    const router = useRouter();
+    const { currentRoute } = router;
+    const isDisable = ref(false);
+    const { formPath } = currentRoute.value.query;
+    const pathArr = [];
+
+    const tabStore = useMultipleTabStore();
+    const formProps = ref(null);
+    const formId = ref(currentRoute.value?.params?.id);
+    const pageType = ref(currentRoute.value.query?.type);
+    const pageId = ref(currentRoute.value.query?.id)
+    
+    const spinning = ref(false);
+    const { notification } = useMessage();
+    const { t } = useI18n();
+
+    const formState = reactive({
+      approCode: 'WTJ',
+      settleMonth: dayjs(new Date()),
+      settleTypeCode: 'C',
+      rpSign: 'Y'
+    });
+   
+    const [registerSupplier, { openModal:openModalCustomer}] = useModal();
+    
+    const rules= reactive({
+      settleMonth: [{ required: true, message: "该项为必填项", trigger: 'change' }],
+      dateFrom: [{ required: true, message: "该项为必填项", trigger: 'change' }],
+      dateTo: [{ required: true, message: "该项为必填项", trigger: 'change' }],
+      cpName: [{ required: true, message: "该项为必填项", trigger: 'change' }],
+      rpSign: [{ required: true, message: "该项为必填项", trigger: 'change' }],
+      comId: [{ required: true, message: "该项为必填项", trigger: 'change' }],
+    });
+    const layout = {
+      labelCol: { span: 8 },
+      wrapperCol: { span: 16 },
+    }
+    const dataFile = ref([]);
+    const dataFileAccount = ref([])
+    const dataList = ref([])
+    let optionSelect= reactive({
+      approCodeList: [],
+      comIdList: [],
+      signList: []
+    });
+  
+    watch(
+      () => props.id,
+      (val) => {
+        if (val) {
+          getInfo(val)
+        }  
+      },
+      {
+        immediate: true
+      }
+    );
+    watch(
+      () => props.disabled,
+      (val) => {
+        isDisable.value = val
+      },
+      {
+        immediate: true
+      }
+    );
+    onMounted(() => {
+      getOption()
+      if (pageId.value) {
+        getInfo(pageId.value)
+      }
+   
+    });
+    
+    const uploadChange = (val) => {
+      dataFileAccount.value = val
+    }
+    const uploadListChange = (val) => {
+      dataFile.value = val
+    }
+    async function getInfo(id)  {
+      spinning.value = true
+      try {
+      let data = await getLngPngSettleHdr(id)
+      spinning.value = false
+      Object.assign(formState, {...data})
+      Object.assign(dataFile.value, formState.lngFileUploadList || [])
+      Object.assign(dataFileAccount.value, formState.billList || [])
+      Object.assign(dataList.value, formState.lngPngSettlePurList || [])
+      formState.settleMonth = formState.settleMonth ? dayjs(formState.settleMonth) : null
+      formState.dateFrom = formState.dateFrom ? dayjs(formState.dateFrom) : null
+      formState.dateTo = formState.dateTo ? dayjs(formState.dateTo) : null
+      numFormat()
+      } catch (error) {
+        console.log(error, 'error')
+        spinning.value = false
+      }
+    }
+    const numFormat = () => {
+      dataList.value = DataFormat.format(dataList.value, [
+        FormatOption.createQty('qtySettleGj'),
+        FormatOption.createQty('qtySettleM3'),
+        FormatOption.createQty('qtyMeaGj'),
+        FormatOption.createQty('qtyMeaM3'),
+        FormatOption.createAmt('amount'),
+        FormatOption.createQty('priceGj',4),
+        FormatOption.createQty('priceM3',4),
+      ]);
+      let obj = {
+        qtySettleGj: formState.qtySettleGj,
+        qtySettleM3: formState.qtySettleM3,
+        amount: formState.amount
+      }
+      let a =  DataFormat.format({...obj}, [
+        FormatOption.createQty('qtySettleGj'),
+        FormatOption.createQty('qtySettleM3'),
+        FormatOption.createAmt('amount'),
+      ]);
+      formState.qtySettleGj = a.qtySettleGj
+      formState.qtySettleM3 = a.qtySettleM3
+      formState.amount = a.amount
+    }
+    const settleChange = (val) => {
+      dataList.value = val 
+      numClear()
+      tableCount()
+    }
+    const numClear = () => {
+      if (!dataList.value.length) {
+        formState.qtySettleGj = ''
+        formState.qtySettleM3 = ''
+        formState.amount = ''
+      }
+    }
+    const tableCount = () => {
+      let qtySettleGj = 0
+      let qtySettleM3 = 0
+      let amount = 0
+      dataList.value.forEach(v => {
+        if (Number(v.settleTimes) == 1){
+          qtySettleGj+=Number((v.qtySettleGj || '').replace(/,/g, '')) || 0
+          qtySettleM3+=Number((v.qtySettleM3 || '').replace(/,/g, '')) || 0
+        }
+        amount+=Number((v.amount || '').replace(/,/g, '')) || 0
+      })
+      formState.qtySettleGj = qtySettleGj.toFixed(3)
+      formState.qtySettleM3 = qtySettleM3.toFixed(3)
+      formState.amount = amount.toFixed(2)
+      numFormat()
+    }
+    const comIdChange = (val) => {
+      if (!val)return
+      getDate()
+    }
+    const getDate=(async () => {
+      let obj = {
+        cpCode: formState.cpCode,
+        comId: formState.comId
+      }
+      if (!pageId.value && formState.cpCode && formState.comId && !formState.dateFrom) {
+        let data = await getLngPngSettleHdrDate(obj) || []
+        if (data.length) {
+          formState.dateFrom = data[0]?.dateTo ? dayjs(data[0]?.dateTo) : null
+          formState.dateTo = null
+        }
+      }
+    })
+    async function getOption() {
+      optionSelect.approCodeList = await getDictionary('LNG_APPRO')
+      optionSelect.comIdList = await getAllCom() || []
+      optionSelect.signList = await getDictionary('LNG_YN')
+
+    }
+    const disabledDateStart = (startValue) => {
+      const endValue = formState?.dateTo;
+      if (!startValue || !endValue) {
+        return false
+      }
+      return startValue.valueOf() >= endValue.valueOf();
+    }
+    const disabledDateEnd = (endValue) => {
+      const startValue = formState?.dateFrom;
+      if (!endValue || !startValue) {
+        return false
+      }
+      return endValue.valueOf() <= startValue.valueOf();
+    }
+    const onSearchCustomer = () => {
+      openModalCustomer(true,{isUpdate: false})
+    }
+    const handleSuccessSupplier = (val) => {
+      formState.cpCode = val[0].suCode
+      formState.cpName = val[0].suSname
+      getDate()
+    }
+    function close() {
+      tabStore.closeTab(currentRoute.value, router);
+    }
+    async function getFormValue() {
+      return formState
+    }
+    async function handleSubmit(type) {
+      try {
+        await formRef.value.validateFields();
+        dataList.value.forEach(v => {
+          v.settleTypeCode = 'C'
+        })
+        
+        let obj = {
+          ...formState,
+          lngFileUploadList: dataFile.value, 
+          billList: dataFileAccount.value,
+          lngPngSettlePurList: dataList.value,
+        }
+        spinning.value = true;
+        let request = !formState.id ? addLngPngSettleHdr :updateLngPngSettleHdr
+
+        try {
+          const data = await request(obj);
+          // 新增保存
+          if (data?.id) {
+            getInfo(data?.id)
+          }
+          // 同意保存不提示
+          if (!type) {
+            notification.success({
+                message: 'Tip',
+                description: data?.id ? t('新增成功！') : t('修改成功！')
+            }); //提示消息
+          }
+          return data?.id ? data : obj
+          
+        } finally {
+          spinning.value = false;
+        }
+
+      } catch (errorInfo) {
+        console.log(errorInfo, 'errorInfo')
+         spinning.value = false;
+         errorInfo?.errorFields?.length && notification.warning({
+          message: '提示',
+          description: '请完善信息'
+        });
+        return false
+      }
+    }
+
+      defineExpose({
+        handleSubmit,
+        getFormValue
+    });
+</script>
+
+<style lang="less" scoped>
+  :deep(.ant-form-item .ant-form-item-label) {
+    width: 135px !important;
+    max-width: 135px !important;
+  }
+    .page-bg-wrap {
+        background-color: #fff;
+    }
+
+    .top-toolbar {
+        min-height: 44px;
+        margin-bottom: 12px;
+        border-bottom: 1px solid #eee;
+    }
+</style>

src/views/dayPlan/PngSettleHdrPur/index.vue

@@ -34,7 +34,7 @@
   import { Modal } from 'ant-design-vue';
   import { ExclamationCircleOutlined } from '@ant-design/icons-vue';
   import { BasicTable, useTable, TableAction, ActionItem } from '/@/components/Table';
-  import { getLngPngSettleHdrPage, deleteLngPngSettleHdr} from '/@/api/dayPlan/PngSettleHdrPur';
+  import { getLngPngSettleHdrPage, deleteLngPngSettleHdr,cancelLngPngSettleHdr} from '/@/api/dayPlan/PngSettleHdrPur';
   import { PageWrapper } from '/@/components/Page';
   import { useMessage } from '/@/hooks/web/useMessage';
   import { useI18n } from '/@/hooks/web/useI18n';
@@ -299,7 +299,21 @@
     }
   }
   function handleCancel() {
-
+    if (!selectedKeys.value.length) {
+      notification.warning({
+        message: '提示',
+        description: t('请选择需要取消结算的数据'),
+      });
+      return
+    }
+    cancelLngPngSettleHdr(selectedKeys.value).then((_) => {
+      handleSuccess();
+      notification.success({
+        message: 'Tip',
+        description: t('取消成功！'),
+      });
+      clearSelectedRowKeys()
+    });
   }
   function handleDelete(record: Recordable) {
     deleteList([record.id]);

src/views/secondDev/customFormConfig.ts

@@ -11,6 +11,7 @@ export const customFormConfig = {
     'addContractSalesLng',
     'ContractPurInt',
     'ContractSalesInt',
-    'addDayPlanPngSettleSales'
+    'addDayPlanPngSettleSales',
+    'addDayPlanPngSettlePur'
   ],
 };