forked from b2894lxlx/tuanwei-admin
86 lines
2.0 KiB
Vue
86 lines
2.0 KiB
Vue
<template>
|
|
<a-table ref="tableRef"
|
|
row-key="contractSettleId" :dataSource="dataList" :columns="columns">
|
|
<template #bodyCell="{ column, record, index }">
|
|
<template v-if="column.key === 'shareAmount'">
|
|
<a-input v-model:value="record.shareAmount" type="number">
|
|
<template #suffix>元</template>
|
|
</a-input>
|
|
</template>
|
|
<template v-if="column.key === 'action'">
|
|
<div class="flex justify-center items-center">
|
|
<close-circle-outlined style="font-size: 1.5rem; color: pink;cursor: pointer"
|
|
@click.native="del(index)" />
|
|
</div>
|
|
</template>
|
|
</template>
|
|
</a-table>
|
|
</template>
|
|
|
|
<script setup lang="ts">
|
|
import { onMounted, ref, watch } from "vue";
|
|
import { ColumnItem } from "ele-admin-pro/es/ele-pro-table/types";
|
|
import { assignObject, EleProTable } from "ele-admin-pro";
|
|
import {
|
|
CloseCircleOutlined
|
|
} from "@ant-design/icons-vue";
|
|
import { InvoicingSettle } from "@/api/tower/invoicingSettle/model";
|
|
|
|
const props = defineProps<{
|
|
dataSource: InvoicingSettle[]
|
|
}>();
|
|
const tableRef = ref<InstanceType<typeof EleProTable> | null>(null);
|
|
|
|
const emits = defineEmits(["total"]);
|
|
|
|
const columns = ref<ColumnItem[]>([
|
|
{
|
|
title: "序号",
|
|
key: "index",
|
|
width: 48,
|
|
align: "center",
|
|
fixed: "left",
|
|
hideInSetting: true,
|
|
customRender: ({ index }) => index + (tableRef.value?.tableIndex ?? 1)
|
|
},
|
|
{
|
|
title: "结算编号",
|
|
dataIndex: "settleNumber"
|
|
},
|
|
{
|
|
title: "结算所属年月",
|
|
dataIndex: "startDate"
|
|
},
|
|
{
|
|
title: "结算金额",
|
|
dataIndex: "settleAmount"
|
|
},
|
|
{
|
|
title: "分摊开票金额",
|
|
dataIndex: "shareAmount",
|
|
key: "shareAmount"
|
|
},
|
|
{
|
|
title: "操作",
|
|
dataIndex: "action",
|
|
key: "action"
|
|
}
|
|
]);
|
|
|
|
const dataList = ref<InvoicingSettle[]>([]);
|
|
|
|
const del = (index: number) => {
|
|
dataList.value.splice(index, 1);
|
|
};
|
|
|
|
watch(
|
|
() => props.dataSource,
|
|
(dataSource) => {
|
|
dataList.value = dataSource;
|
|
},
|
|
{ deep: true }
|
|
);
|
|
|
|
defineExpose({ dataList });
|
|
</script>
|