<template>
    <hc-new-card>
        <template #header>
            <hc-new-switch :datas="tabTab" :keys="tabKey" :round="false" size="default" @change="tabChange" />
            <div class="ml-3 w-40">
                <el-date-picker v-model="searchForm.key2" placeholder="截止日期" class="block" format="YYYY-MM-DD" type="date" value-format="YYYY-MM-DD" />
            </div>
        </template>
        <template #extra>
            <el-button hc-btn type="primary">
                <HcIcon name="download-2" />
                <span>导出</span>
            </el-button>
        </template>
        <div class="hc-table-ref-box no-border">
            <el-table class="w-full" :data="tableData" row-key="id" height="100%" border>
                <el-table-column type="index" label="序号" width="60" />
                <el-table-column prop="key1" label="变更令编号" />
                <el-table-column prop="key2" label="合同编号" />
                <el-table-column label="变更增减金额" align="center">
                    <el-table-column prop="key5" label="章节" />
                    <el-table-column prop="key6" label="支付编号" />
                    <el-table-column prop="key7" label="子目名称" />
                    <el-table-column prop="key7" label="数量" />
                    <el-table-column prop="key7" label="变更金额" />
                    <el-table-column prop="key7" label="小计" />
                </el-table-column>
                <el-table-column prop="key8" label="变更归类" />
                <el-table-column prop="key14" label="备注" />
            </el-table>
        </div>
    </hc-new-card>
</template>

<script setup>
import { onActivated, onMounted, ref } from 'vue'

defineOptions({
    name: 'AlterLedgersCount',
})

//渲染完成
onActivated(() => {

})

//类型tab数据和相关处理
const tabKey = ref('key1')
const tabTab = ref([
    { key: 'key1', name: '普通变更' },
    { key: 'key2', name: '工区变更' },
])

const tabChange = (item) => {
    tabKey.value = item?.key
    console.log(item)
}

const searchForm = ref({})

const tableData = ref([
    { key1: '1111' },
])
</script>
