调整

src/views/tower/settle/components/editTable/table0.vue

@@ -22,27 +22,60 @@
           @ok="changeDate($event, index)"
         />
       </template>
+      <template v-if="column.key === 'inDate'">
+        <a-date-picker
+          class="ele-fluid"
+          placeholder="请选择实际进场日期"
+          v-model:value="record.inDate"
+          valueFormat="YYYY-MM-DD"
+        />
+      </template>
+      <template v-if="column.key === 'outDate'">
+        <a-date-picker
+          class="ele-fluid"
+          placeholder="请选择实际出场日期"
+          v-model:value="record.outDate"
+          valueFormat="YYYY-MM-DD"
+        />
+      </template>
       <template v-if="column.key === 'settleCycle'">
-        <span v-if="record.startDate && record.endDate">
-          {{ Math.floor(record.days / 30)  }}月
-          {{ record.days - (Math.floor(record.days / 30) * 30) }}天
-        </span>
+        <a-row :gutter="16">
+          <a-col :span="12">
+            <a-input v-model:value="record.month" type="number">
+              <template #addonAfter>月</template>
+            </a-input>
+          </a-col>
+          <a-col :span="12">
+            <a-input v-model:value="record.day" type="number">
+              <template #addonAfter>日</template>
+            </a-input>
+          </a-col>
+        </a-row>
       </template>
       <template v-if="column.key === 'monthAmount'">
         <a-input v-model:value="record.monthAmount" type="number" @change="changeDate($event, index)" />
       </template>
       <template v-if="column.key === 'dailyAmount'">
-        <span v-if="record.monthAmount">{{ record.dailyAmount }}</span>
+        <a-input v-model:value="record.dailyAmount" type="number" />
+      </template>
+      <template v-if="column.key === 'payRate'">
+        <a-input v-model:value="record.payRate" type="number">
+          <template #addonAfter>%</template>
+        </a-input>
       </template>
       <template v-if="column.key === 'amountWithTax'">
-        <span v-if="record.monthAmount">{{ (record.dailyAmount * record.days).toFixed(2) }}</span>
+        <span
+          v-if="record.monthAmount">{{ ((record.dailyAmount * record.day + record.monthAmount * record.month) * record.payRate / 100).toFixed(2)
+          }}</span>
       </template>
       <template v-if="column.key === 'tax'">
-        <span v-if="record.monthAmount">{{ (record.dailyAmount * record.days * (record.taxRate / 100)).toFixed(2) }}</span>
+        <span
+          v-if="record.monthAmount">{{ (((record.dailyAmount * record.day + record.monthAmount * record.month)  * record.payRate / 100) * (record.taxRate / 100)).toFixed(2)
+          }}</span>
       </template>
       <template v-if="column.key === 'amountWithoutTax'">
         <span
-          v-if="record.monthAmount">{{ ((record.dailyAmount * record.days) - (record.dailyAmount * record.days * (record.taxRate / 100))).toFixed(2)
+          v-if="record.monthAmount">{{ ((1 - (record.taxRate / 100)) * ((record.dailyAmount * record.day + record.monthAmount * record.month) * record.payRate / 100)).toFixed(2)
           }}</span>
       </template>
       <template v-if="column.key === 'remark'">
@@ -55,11 +88,38 @@
         </div>
       </template>
     </template>
+    <template #summary>
+      <a-table-summary-row>
+        <a-table-summary-cell>合计</a-table-summary-cell>
+        <a-table-summary-cell />
+        <a-table-summary-cell />
+        <a-table-summary-cell />
+        <a-table-summary-cell />
+        <a-table-summary-cell />
+        <a-table-summary-cell />
+        <a-table-summary-cell />
+        <a-table-summary-cell />
+        <a-table-summary-cell />
+        <a-table-summary-cell />
+        <a-table-summary-cell />
+        <a-table-summary-cell>
+          {{ totals.amountWithTax }}
+        </a-table-summary-cell>
+        <a-table-summary-cell>
+          {{ totals.tax }}
+        </a-table-summary-cell>
+        <a-table-summary-cell>
+          {{ totals.amountWithoutTax }}
+        </a-table-summary-cell>
+        <a-table-summary-cell />
+        <a-table-summary-cell />
+      </a-table-summary-row>
+    </template>
   </a-table>
 </template>
 
 <script setup lang="ts">
-import { onMounted, ref, watch } from "vue";
+import { computed, onMounted, ref, watch } from "vue";
 import { SettleDetail } from "@/api/tower/settleDetail/model";
 import { ColumnItem } from "ele-admin-pro/es/ele-pro-table/types";
 import { assignObject, EleProTable } from "ele-admin-pro";
@@ -108,6 +168,16 @@ const columns = ref<ColumnItem[]>([
     dataIndex: "endDate",
     key: "endDate"
   },
+  // {
+  //   title: "实际进场日期",
+  //   dataIndex: "inDate",
+  //   key: "inDate"
+  // },
+  // {
+  //   title: "实际出场日期",
+  //   dataIndex: "outDate",
+  //   key: "outDate"
+  // },
   {
     title: "实际结算周期",
     dataIndex: "settleCycle",
@@ -124,7 +194,12 @@ const columns = ref<ColumnItem[]>([
     key: "dailyAmount"
   },
   {
-    title: "本期租金含税金额(元)",
+    title: "支付比例",
+    dataIndex: "payRate",
+    key: "payRate"
+  },
+  {
+    title: "含税应付(元)",
     dataIndex: "amountWithTax",
     key: "amountWithTax"
   },
@@ -154,8 +229,12 @@ const dataList = ref<SettleDetail[]>([]);
 
 const changeDate = (data, index) => {
   if (dataList.value[index].startDate && dataList.value[index].endDate) {
-    dataList.value[index].days = dayjs(dataList.value[index].endDate).diff(dayjs(dataList.value[index].startDate), "day");
-    if (dataList.value[index].monthAmount) dataList.value[index].dailyAmount = (dataList.value[index].monthAmount / 30).toFixed(8);
+    dataList.value[index].days = dayjs(dataList.value[index].endDate).diff(dayjs(dataList.value[index].startDate), "day") + 1;
+    dataList.value[index].month = Math.floor(dataList.value[index].days / 30);
+    dataList.value[index].day = dataList.value[index].days - (Math.floor(dataList.value[index].days / 30) * 30);
+    if (dataList.value[index].monthAmount) {
+      dataList.value[index].dailyAmount = (dataList.value[index].monthAmount / 30).toFixed(8);
+    }
   }
 };
 
@@ -163,13 +242,38 @@ const del = (index: number) => {
   dataList.value.splice(index, 1);
 };
 
+onMounted(() => {
+  dataList.value = props.dataSource;
+  calTotals();
+});
+
 watch(
   () => props.dataSource,
   (dataSource) => {
     dataList.value = dataSource;
+    calTotals();
   },
   { deep: true }
 );
 
-defineExpose({ dataList })
+const totals = ref({ amountWithTax: 0, tax: 0, amountWithoutTax: 0 });
+const calTotals = () => {
+  let amountWithTax: number = 0;
+  let tax = 0;
+  let amountWithoutTax = 0;
+  if (dataList.value && dataList.value.length > 0 && (dataList.value[0].taxRate !== undefined)) {
+    const taxRate = dataList.value[0].taxRate;
+    dataList.value.forEach(({ month, monthAmount, day, dailyAmount, payRate }) => {
+      amountWithTax += (month * monthAmount + day * dailyAmount) * payRate / 100;
+    });
+    amountWithTax = Number(amountWithTax.toFixed(2));
+    tax = amountWithTax * (taxRate / 100);
+    tax = Number(tax.toFixed(2));
+    amountWithoutTax = amountWithTax - tax;
+    amountWithoutTax = Number(amountWithoutTax.toFixed(2));
+  }
+  totals.value = { amountWithTax, tax, amountWithoutTax };
+};
+
+defineExpose({ dataList });
 </script>

src/views/tower/settle/components/editTable/table1.vue

@@ -5,24 +5,43 @@
       <template v-if="column.key === 'singleAmount'">
         <a-input v-model:value="record.singleAmount" type="number" />
       </template>
+      <template v-if="column.key === 'inDate'">
+        <a-date-picker
+          class="ele-fluid"
+          placeholder="请选择实际进场日期"
+          v-model:value="record.inDate"
+          valueFormat="YYYY-MM-DD"
+        />
+      </template>
+      <template v-if="column.key === 'outDate'">
+        <a-date-picker
+          class="ele-fluid"
+          placeholder="请选择实际出场日期"
+          v-model:value="record.outDate"
+          valueFormat="YYYY-MM-DD"
+        />
+      </template>
       <template v-if="column.key === 'num'">
         <a-input v-model:value="record.num" type="number" />
       </template>
-      <template v-if="column.key === 'sumAmount'">
-        <span v-if="record.singleAmount && record.num">
-          {{ (record.singleAmount * record.num).toFixed(2) }}
-        </span>
+      <template v-if="column.key === 'payRate'">
+        <a-input v-model:value="record.payRate" type="number">
+          <template #addonAfter>%</template>
+        </a-input>
       </template>
       <template v-if="column.key === 'amountWithTax'">
-        <span v-if="record.singleAmount && record.num">{{ (record.singleAmount * record.num).toFixed(2) }}</span>
+        <span
+          v-if="record.singleAmount && record.num">{{ ((record.singleAmount * record.num) * record.payRate / 100).toFixed(2)
+          }}</span>
       </template>
       <template v-if="column.key === 'tax'">
-        <span v-if="record.singleAmount && record.num">{{ (record.singleAmount * record.num * (record.taxRate / 100)).toFixed(2)
+        <span
+          v-if="record.singleAmount && record.num">{{ (((record.singleAmount * record.num) * record.payRate / 100) * (record.taxRate / 100)).toFixed(2)
           }}</span>
       </template>
       <template v-if="column.key === 'amountWithoutTax'">
         <span
-          v-if="record.singleAmount && record.num">{{ ((record.singleAmount * record.num) - (record.singleAmount * record.num * (record.taxRate / 100))).toFixed(2)
+          v-if="record.singleAmount && record.num">{{ (((record.singleAmount * record.num) * record.payRate / 100) - (record.singleAmount * record.num * (record.taxRate / 100))).toFixed(2)
           }}</span>
       </template>
       <template v-if="column.key === 'remark'">
@@ -35,6 +54,30 @@
         </div>
       </template>
     </template>
+    <template #summary>
+      <a-table-summary-row>
+        <a-table-summary-cell>合计</a-table-summary-cell>
+        <a-table-summary-cell />
+        <a-table-summary-cell />
+        <a-table-summary-cell />
+        <a-table-summary-cell />
+        <a-table-summary-cell />
+        <a-table-summary-cell />
+        <a-table-summary-cell />
+        <a-table-summary-cell />
+        <a-table-summary-cell>
+          {{ totals.amountWithTax }}
+        </a-table-summary-cell>
+        <a-table-summary-cell>
+          {{ totals.tax }}
+        </a-table-summary-cell>
+        <a-table-summary-cell>
+          {{ totals.amountWithoutTax }}
+        </a-table-summary-cell>
+        <a-table-summary-cell />
+        <a-table-summary-cell />
+      </a-table-summary-row>
+    </template>
   </a-table>
 </template>
 
@@ -78,6 +121,16 @@ const columns = ref<ColumnItem[]>([
     dataIndex: "factoryNo",
     key: "factoryNo"
   },
+  {
+    title: "实际进场日期",
+    dataIndex: "inDate",
+    key: "inDate"
+  },
+  {
+    title: "实际出场日期",
+    dataIndex: "outDate",
+    key: "outDate"
+  },
   {
     title: "费用类型",
     dataIndex: "settleCostType",
@@ -94,9 +147,9 @@ const columns = ref<ColumnItem[]>([
     key: "num"
   },
   {
-    title: "进退场小计(元)",
-    dataIndex: "sumAmount",
-    key: "sumAmount"
+    title: "支付比例",
+    dataIndex: "payRate",
+    key: "payRate"
   },
   {
     title: "含税金额(元)",
@@ -129,17 +182,42 @@ const dataList = ref<SettleDetail[]>([]);
 
 const del = (index: number) => {
   dataList.value.splice(index, 1);
+  calTotals();
 };
 
+const totals = ref({ amountWithTax: 0, tax: 0, amountWithoutTax: 0 });
+const calTotals = () => {
+  let amountWithTax = 0;
+  let tax = 0;
+  let amountWithoutTax = 0;
+  if (dataList.value && dataList.value.length > 0 && (dataList.value[0].taxRate !== undefined)) {
+    const taxRate = dataList.value[0].taxRate;
+    dataList.value.forEach(({ singleAmount, num, payRate }) => {
+      amountWithTax += singleAmount * num * payRate / 100;
+    });
+    amountWithTax = Number(amountWithTax.toFixed(2));
+    tax = amountWithTax * (taxRate / 100);
+    tax = Number(tax.toFixed(2));
+    amountWithoutTax = amountWithTax - tax;
+    amountWithoutTax = Number(amountWithoutTax.toFixed(2));
+  }
+  totals.value = { amountWithTax, tax, amountWithoutTax };
+};
+
+onMounted(() => {
+  dataList.value = props.dataSource;
+  calTotals();
+});
+
 watch(
   () => props.dataSource,
   (dataSource) => {
     dataList.value = dataSource;
-    console.log(dataList.value)
+    console.log(dataList.value);
   },
   { deep: true }
 );
 
-defineExpose({ dataList })
+defineExpose({ dataList });
 
 </script>

src/views/tower/settle/components/editTable/table2.vue

@@ -23,26 +23,41 @@
         />
       </template>
       <template v-if="column.key === 'settleCycle'">
-        <span v-if="record.startDate && record.endDate">
-          {{ Math.floor(record.days / 30)  }}月
-          {{ record.days - (Math.floor(record.days / 30) * 30) }}天
-        </span>
+        <a-row :gutter="16">
+          <a-col :span="12">
+            <a-input v-model:value="record.month">
+              <template #addonAfter>月</template>
+            </a-input>
+          </a-col>
+          <a-col :span="12">
+            <a-input v-model:value="record.day">
+              <template #addonAfter>日</template>
+            </a-input>
+          </a-col>
+        </a-row>
       </template>
       <template v-if="column.key === 'monthAmount'">
         <a-input v-model:value="record.monthAmount" type="number" @change="changeDate($event, index)" />
       </template>
       <template v-if="column.key === 'dailyAmount'">
-        <span v-if="record.monthAmount">{{ record.dailyAmount }}</span>
+        <a-input v-model:value="record.dailyAmount" type="number" />
+      </template>
+      <template v-if="column.key === 'payRate'">
+        <a-input v-model:value="record.payRate" type="number">
+          <template #addonAfter>%</template>
+        </a-input>
       </template>
       <template v-if="column.key === 'amountWithTax'">
-        <span v-if="record.monthAmount">{{ (record.dailyAmount * record.days).toFixed(2) }}</span>
+        <span v-if="record.monthAmount">{{ ((record.dailyAmount * record.days + record.monthAmount * record.month) * record.payRate / 100).toFixed(2)
+          }}</span>
       </template>
       <template v-if="column.key === 'tax'">
-        <span v-if="record.monthAmount">{{ (record.dailyAmount * record.days * (record.taxRate / 100)).toFixed(2) }}</span>
+        <span v-if="record.monthAmount">{{ (((record.dailyAmount * record.days + record.monthAmount * record.month) * record.payRate / 100) * (record.taxRate / 100)).toFixed(2)
+          }}</span>
       </template>
       <template v-if="column.key === 'amountWithoutTax'">
         <span
-          v-if="record.monthAmount">{{ ((record.dailyAmount * record.days) - (record.dailyAmount * record.days * (record.taxRate / 100))).toFixed(2)
+          v-if="record.monthAmount">{{ (((record.dailyAmount * record.days + record.monthAmount * record.month) * record.payRate / 100) - (record.dailyAmount * record.days * (record.taxRate / 100))).toFixed(2)
           }}</span>
       </template>
       <template v-if="column.key === 'remark'">
@@ -55,6 +70,30 @@
         </div>
       </template>
     </template>
+    <template #summary>
+      <a-table-summary-row>
+        <a-table-summary-cell>合计</a-table-summary-cell>
+        <a-table-summary-cell />
+        <a-table-summary-cell />
+        <a-table-summary-cell />
+        <a-table-summary-cell />
+        <a-table-summary-cell />
+        <a-table-summary-cell />
+        <a-table-summary-cell />
+        <a-table-summary-cell />
+        <a-table-summary-cell>
+          {{ totals.amountWithTax }}
+        </a-table-summary-cell>
+        <a-table-summary-cell>
+          {{ totals.tax }}
+        </a-table-summary-cell>
+        <a-table-summary-cell>
+          {{ totals.amountWithoutTax }}
+        </a-table-summary-cell>
+        <a-table-summary-cell />
+        <a-table-summary-cell />
+      </a-table-summary-row>
+    </template>
   </a-table>
 </template>
 
@@ -113,6 +152,16 @@ const columns = ref<ColumnItem[]>([
     dataIndex: "settleCycle",
     key: "settleCycle"
   },
+  {
+    title: "实际进场日期",
+    dataIndex: "inDate",
+    key: "inDate"
+  },
+  {
+    title: "实际出场日期",
+    dataIndex: "outDate",
+    key: "outDate"
+  },
   {
     title: "月工资(元)",
     dataIndex: "monthAmount",
@@ -123,6 +172,11 @@ const columns = ref<ColumnItem[]>([
     dataIndex: "dailyAmount",
     key: "dailyAmount"
   },
+  {
+    title: "支付比例",
+    dataIndex: "payRate",
+    key: "payRate"
+  },
   {
     title: "含税金额(元)",
     dataIndex: "amountWithTax",
@@ -154,8 +208,9 @@ const dataList = ref<SettleDetail[]>([]);
 
 const changeDate = (data, index) => {
   if (dataList.value[index].startDate && dataList.value[index].endDate) {
-    dataList.value[index].days = dayjs(dataList.value[index].endDate).diff(dayjs(dataList.value[index].startDate), "day");
-    console.log(dataList.value[index].days)
+    dataList.value[index].days = dayjs(dataList.value[index].endDate).diff(dayjs(dataList.value[index].startDate), "day") + 1;
+    dataList.value[index].month = Math.floor(dataList.value[index].days / 30);
+    dataList.value[index].day = dataList.value[index].days - (Math.floor(dataList.value[index].days / 30) * 30);
     if (dataList.value[index].monthAmount) dataList.value[index].dailyAmount = (dataList.value[index].monthAmount / 30).toFixed(8);
   }
 };
@@ -164,15 +219,39 @@ const del = (index: number) => {
   dataList.value.splice(index, 1);
 };
 
+const totals = ref({ amountWithTax: 0, tax: 0, amountWithoutTax: 0 });
+const calTotals = () => {
+  let amountWithTax = 0;
+  let tax = 0;
+  let amountWithoutTax = 0;
+  if (dataList.value && dataList.value.length > 0 && (dataList.value[0].taxRate !== undefined)) {
+    const taxRate = dataList.value[0].taxRate;
+    dataList.value.forEach(({ month, monthAmount, day, dailyAmount, payRate }) => {
+      amountWithTax += (month * monthAmount + day * dailyAmount) * payRate / 100;
+    });
+    amountWithTax = Number(amountWithTax.toFixed(2));
+    tax = amountWithTax * (taxRate / 100);
+    tax = Number(tax.toFixed(2));
+    amountWithoutTax = amountWithTax - tax;
+    amountWithoutTax = Number(amountWithoutTax.toFixed(2));
+  }
+  totals.value = { amountWithTax, tax, amountWithoutTax };
+};
+onMounted(() => {
+  dataList.value = props.dataSource;
+  calTotals();
+});
+
 watch(
   () => props.dataSource,
   (dataSource) => {
     dataList.value = dataSource;
+    calTotals();
   },
   { deep: true }
 );
 
 
-defineExpose({ dataList })
+defineExpose({ dataList });
 
 </script>

src/views/tower/settle/components/editTable/table3.vue

@@ -10,6 +10,22 @@
           </a-select-option>
         </a-select>
       </template>
+      <template v-if="column.key === 'inDate'">
+        <a-date-picker
+          class="ele-fluid"
+          placeholder="请选择实际进场日期"
+          v-model:value="record.inDate"
+          valueFormat="YYYY-MM-DD"
+        />
+      </template>
+      <template v-if="column.key === 'outDate'">
+        <a-date-picker
+          class="ele-fluid"
+          placeholder="请选择实际出场日期"
+          v-model:value="record.outDate"
+          valueFormat="YYYY-MM-DD"
+        />
+      </template>
       <template v-if="column.key === 'singleAmount'">
         <a-input v-model:value="record.singleAmount" type="number" />
       </template>
@@ -19,22 +35,24 @@
       <template v-if="column.key === 'unit'">
         <a-input v-model:value="record.unit" />
       </template>
-      <template v-if="column.key === 'sumAmount'">
-        <span v-if="record.singleAmount && record.num">
-          {{ (record.singleAmount * record.num).toFixed(2) }}
-        </span>
+      <template v-if="column.key === 'payRate'">
+        <a-input v-model:value="record.payRate" type="number">
+          <template #addonAfter>%</template>
+        </a-input>
       </template>
       <template v-if="column.key === 'amountWithTax'">
-        <span v-if="record.singleAmount && record.num">{{ (record.singleAmount * record.num).toFixed(2) }}</span>
+        <span
+          v-if="record.singleAmount && record.num">{{ ((record.singleAmount * record.num) * record.payRate / 100).toFixed(2)
+          }}</span>
       </template>
       <template v-if="column.key === 'tax'">
         <span
-          v-if="record.singleAmount && record.num">{{ (record.singleAmount * record.num * (record.taxRate / 100)).toFixed(2)
+          v-if="record.singleAmount && record.num">{{ ((record.singleAmount * record.num) * record.payRate / 100 * (record.taxRate / 100)).toFixed(2)
           }}</span>
       </template>
       <template v-if="column.key === 'amountWithoutTax'">
         <span
-          v-if="record.singleAmount && record.num">{{ ((record.singleAmount * record.num) - (record.singleAmount * record.num * (record.taxRate / 100))).toFixed(2)
+          v-if="record.singleAmount && record.num">{{ (((record.singleAmount * record.num) * record.payRate / 100) - (record.singleAmount * record.num * (record.taxRate / 100))).toFixed(2)
           }}</span>
       </template>
       <template v-if="column.key === 'remark'">
@@ -47,6 +65,29 @@
         </div>
       </template>
     </template>
+    <template #summary>
+      <a-table-summary-row>
+        <a-table-summary-cell>合计</a-table-summary-cell>
+        <a-table-summary-cell />
+        <a-table-summary-cell />
+        <a-table-summary-cell />
+        <a-table-summary-cell />
+        <a-table-summary-cell />
+        <a-table-summary-cell />
+        <a-table-summary-cell />
+        <a-table-summary-cell>
+          {{ totals.amountWithTax }}
+        </a-table-summary-cell>
+        <a-table-summary-cell>
+          {{ totals.tax }}
+        </a-table-summary-cell>
+        <a-table-summary-cell>
+          {{ totals.amountWithoutTax }}
+        </a-table-summary-cell>
+        <a-table-summary-cell />
+        <a-table-summary-cell />
+      </a-table-summary-row>
+    </template>
   </a-table>
 </template>
 
@@ -59,7 +100,7 @@ import {
   CloseCircleOutlined
 } from "@ant-design/icons-vue";
 import dayjs from "dayjs";
-import { DictDataParam } from "@/api/system/dict-data/model";
+import { DictData, DictDataParam } from "@/api/system/dict-data/model";
 import { listDictData } from "@/api/system/dict-data";
 
 const props = defineProps<{
@@ -67,7 +108,7 @@ const props = defineProps<{
 }>();
 const tableRef0 = ref<InstanceType<typeof EleProTable> | null>(null);
 
-const dictList = ref<DictDataParam[]>([]);
+const dictList = ref<DictData[]>([]);
 const getDictList = async () => {
   dictList.value = await listDictData({ dictId: 146 });
 };
@@ -97,6 +138,16 @@ const columns = ref<ColumnItem[]>([
     dataIndex: "factoryNo",
     key: "factoryNo"
   },
+  {
+    title: "实际进场日期",
+    dataIndex: "inDate",
+    key: "inDate"
+  },
+  {
+    title: "实际出场日期",
+    dataIndex: "outDate",
+    key: "outDate"
+  },
   {
     title: "费用类型",
     dataIndex: "settleCostType",
@@ -117,6 +168,11 @@ const columns = ref<ColumnItem[]>([
     dataIndex: "unit",
     key: "unit"
   },
+  {
+    title: "支付比例",
+    dataIndex: "payRate",
+    key: "payRate"
+  },
   {
     title: "含税金额(元)",
     dataIndex: "amountWithTax",
@@ -148,21 +204,42 @@ const dataList = ref<SettleDetail[]>([]);
 
 const del = (index: number) => {
   dataList.value.splice(index, 1);
+  calTotals();
+};
+
+const totals = ref({ amountWithTax: 0, tax: 0, amountWithoutTax: 0 });
+const calTotals = () => {
+  let amountWithTax = 0;
+  let tax = 0;
+  let amountWithoutTax = 0;
+  if (dataList.value && dataList.value.length > 0 && (dataList.value[0].taxRate !== undefined)) {
+    const taxRate = dataList.value[0].taxRate;
+    dataList.value.forEach(({ singleAmount, num, payRate }) => {
+      amountWithTax += singleAmount * num * payRate / 100;
+    });
+    amountWithTax = Number(amountWithTax.toFixed(2));
+    tax = amountWithTax * (taxRate / 100);
+    tax = Number(tax.toFixed(2));
+    amountWithoutTax = amountWithTax - tax;
+    amountWithoutTax = Number(amountWithoutTax.toFixed(2));
+  }
+  totals.value = { amountWithTax, tax, amountWithoutTax };
 };
 
 watch(
   () => props.dataSource,
   (dataSource) => {
     dataList.value = dataSource;
-    console.log(dataList.value);
+    calTotals();
   },
   { deep: true }
 );
 
 onMounted(() => {
   getDictList();
+  dataList.value = props.dataSource;
 });
 
-defineExpose({ dataList })
+defineExpose({ dataList });
 
 </script>

src/views/tower/settle/components/editTable/table4.vue

@@ -10,6 +10,22 @@
           </a-select-option>
         </a-select>
       </template>
+      <template v-if="column.key === 'inDate'">
+        <a-date-picker
+          class="ele-fluid"
+          placeholder="请选择实际进场日期"
+          v-model:value="record.inDate"
+          valueFormat="YYYY-MM-DD"
+        />
+      </template>
+      <template v-if="column.key === 'outDate'">
+        <a-date-picker
+          class="ele-fluid"
+          placeholder="请选择实际出场日期"
+          v-model:value="record.outDate"
+          valueFormat="YYYY-MM-DD"
+        />
+      </template>
       <template v-if="column.key === 'singleAmount'">
         <a-input v-model:value="record.singleAmount" type="number" />
       </template>
@@ -19,22 +35,24 @@
       <template v-if="column.key === 'unit'">
         <a-input v-model:value="record.unit" />
       </template>
-      <template v-if="column.key === 'sumAmount'">
-        <span v-if="record.singleAmount && record.num">
-          {{ (record.singleAmount * record.num).toFixed(2) }}
-        </span>
+      <template v-if="column.key === 'payRate'">
+        <a-input v-model:value="record.payRate" type="number">
+          <template #addonAfter>%</template>
+        </a-input>
       </template>
       <template v-if="column.key === 'amountWithTax'">
-        <span v-if="record.singleAmount && record.num">{{ (record.singleAmount * record.num).toFixed(2) }}</span>
+        <span
+          v-if="record.singleAmount && record.num">{{ ((record.singleAmount * record.num) * record.payRate / 100).toFixed(2)
+          }}</span>
       </template>
       <template v-if="column.key === 'tax'">
         <span
-          v-if="record.singleAmount && record.num">{{ (record.singleAmount * record.num * (record.taxRate / 100)).toFixed(2)
+          v-if="record.singleAmount && record.num">{{ ((record.singleAmount * record.num) * record.payRate / 100 * (record.taxRate / 100)).toFixed(2)
           }}</span>
       </template>
       <template v-if="column.key === 'amountWithoutTax'">
         <span
-          v-if="record.singleAmount && record.num">{{ ((record.singleAmount * record.num) - (record.singleAmount * record.num * (record.taxRate / 100))).toFixed(2)
+          v-if="record.singleAmount && record.num">{{ (((record.singleAmount * record.num) * record.payRate / 100) - (record.singleAmount * record.num * (record.taxRate / 100))).toFixed(2)
           }}</span>
       </template>
       <template v-if="column.key === 'remark'">
@@ -47,6 +65,29 @@
         </div>
       </template>
     </template>
+    <template #summary>
+      <a-table-summary-row>
+        <a-table-summary-cell>合计</a-table-summary-cell>
+        <a-table-summary-cell />
+        <a-table-summary-cell />
+        <a-table-summary-cell />
+        <a-table-summary-cell />
+        <a-table-summary-cell />
+        <a-table-summary-cell />
+        <a-table-summary-cell />
+        <a-table-summary-cell>
+          {{ totals.amountWithTax }}
+        </a-table-summary-cell>
+        <a-table-summary-cell>
+          {{ totals.tax }}
+        </a-table-summary-cell>
+        <a-table-summary-cell>
+          {{ totals.amountWithoutTax }}
+        </a-table-summary-cell>
+        <a-table-summary-cell />
+        <a-table-summary-cell />
+      </a-table-summary-row>
+    </template>
   </a-table>
 </template>
 
@@ -59,7 +100,7 @@ import {
   CloseCircleOutlined
 } from "@ant-design/icons-vue";
 import dayjs from "dayjs";
-import { DictDataParam } from "@/api/system/dict-data/model";
+import { DictData, DictDataParam } from "@/api/system/dict-data/model";
 import { listDictData } from "@/api/system/dict-data";
 
 const props = defineProps<{
@@ -67,7 +108,7 @@ const props = defineProps<{
 }>();
 const tableRef0 = ref<InstanceType<typeof EleProTable> | null>(null);
 
-const dictList = ref<DictDataParam[]>([]);
+const dictList = ref<DictData[]>([]);
 const getDictList = async () => {
   dictList.value = await listDictData({ dictId: 147 });
 };
@@ -97,6 +138,16 @@ const columns = ref<ColumnItem[]>([
     dataIndex: "factoryNo",
     key: "factoryNo"
   },
+  {
+    title: "实际进场日期",
+    dataIndex: "inDate",
+    key: "inDate"
+  },
+  {
+    title: "实际出场日期",
+    dataIndex: "outDate",
+    key: "outDate"
+  },
   {
     title: "费用类型",
     dataIndex: "settleCostType",
@@ -117,6 +168,11 @@ const columns = ref<ColumnItem[]>([
     dataIndex: "unit",
     key: "unit"
   },
+  {
+    title: "支付比例",
+    dataIndex: "payRate",
+    key: "payRate"
+  },
   {
     title: "含税金额(元)",
     dataIndex: "amountWithTax",
@@ -148,21 +204,42 @@ const dataList = ref<SettleDetail[]>([]);
 
 const del = (index: number) => {
   dataList.value.splice(index, 1);
+  calTotals();
+};
+
+const totals = ref({ amountWithTax: 0, tax: 0, amountWithoutTax: 0 });
+const calTotals = () => {
+  let amountWithTax = 0;
+  let tax = 0;
+  let amountWithoutTax = 0;
+  if (dataList.value && dataList.value.length > 0 && (dataList.value[0].taxRate !== undefined)) {
+    const taxRate = dataList.value[0].taxRate;
+    dataList.value.forEach(({ singleAmount, num, payRate }) => {
+      amountWithTax += singleAmount * num * payRate / 100;
+    });
+    amountWithTax = Number(amountWithTax.toFixed(2));
+    tax = amountWithTax * (taxRate / 100);
+    tax = Number(tax.toFixed(2));
+    amountWithoutTax = amountWithTax - tax;
+    amountWithoutTax = Number(amountWithoutTax.toFixed(2));
+  }
+  totals.value = { amountWithTax, tax, amountWithoutTax };
 };
 
 watch(
   () => props.dataSource,
   (dataSource) => {
     dataList.value = dataSource;
-    console.log(dataList.value);
+    calTotals();
   },
   { deep: true }
 );
 
 onMounted(() => {
   getDictList();
+  dataList.value = props.dataSource;
 });
 
-defineExpose({ dataList })
+defineExpose({ dataList });
 
 </script>