<template>
    <div class="mt10">
        <TableHeader :showReset="false" ref="TableHeaderRef" showExport showCustomColumn>
            <template #select>
                <el-form-item label="谐波源名称">
                    <el-input v-model="tableStore.table.params.searchValue" clearable placeholder="请输入谐波源名称" show-word-limit
                    maxlength="32"/>
                </el-form-item>
            </template>
            <template #operation>
                <el-button type="primary" icon="el-icon-Plus" @click="add">新增</el-button>
                <el-button type="primary" icon="el-icon-Delete" @click="del">删除</el-button>
                <!-- <el-button type="primary" icon="el-icon-Download">模版下载</el-button>
                <el-button type="primary" icon="el-icon-Upload">导入</el-button> -->
            </template>
        </TableHeader>
        <Table ref="tableRef"></Table>
        <!-- 编辑 -->
        <Form ref="formRef" @submit="tableStore.index()" />
    </div>
</template>
<script setup lang="ts">
import TableStore from '@/utils/tableStore'
import TableHeader from '@/components/table/header/index.vue'
import Table from '@/components/table/index.vue'
import Form from './form.vue'
import { characteristicDelete } from '@/api/advance-boot/assess'
import { ElMessage, ElMessageBox } from 'element-plus'
import { ref, reactive, onMounted } from 'vue'
const tableStore = new TableStore({
    url: '/advance-boot/assessDicHarmonicCharacter/page',
    method: 'POST',
    publicHeight: 115,
    filename: '谐波特性',
    column: [
        {
            width: '60',
            type: 'checkbox'
        },
        {
            title: '序号',
            width: 80,
            field: 'name',
            formatter: (row: any) => {
                return (tableStore.table.params.pageNum - 1) * tableStore.table.params.pageSize + row.rowIndex + 1
            }
        },
        { title: '谐波源名称', field: 'harmName', minWidth: '130' },
        { title: '谐波2次', field: 'i2', minWidth: '80' },
        { title: '谐波3次', field: 'i3', minWidth: '80' },
        { title: '谐波4次', field: 'i4', minWidth: '80' },
        { title: '谐波5次', field: 'i5', minWidth: '80' },
        { title: '谐波6次', field: 'i6', minWidth: '80' },
        { title: '谐波7次', field: 'i7', minWidth: '80' },
        { title: '谐波8次', field: 'i8', minWidth: '80' },
        { title: '谐波9次', field: 'i9', minWidth: '80' },
        { title: '谐波10次', field: 'i10', minWidth: '80' },
        { title: '谐波11次', field: 'i11', minWidth: '80' },
        { title: '谐波12次', field: 'i12', minWidth: '80' },
        { title: '谐波13次', field: 'i13', minWidth: '80' },
        { title: '谐波14次', field: 'i14', minWidth: '80' },
        { title: '谐波15次', field: 'i15', minWidth: '80' },
        { title: '谐波16次', field: 'i16', minWidth: '80' },
        { title: '谐波17次', field: 'i17', minWidth: '80' },
        { title: '谐波18次', field: 'i18', minWidth: '80' },
        { title: '谐波19次', field: 'i19', minWidth: '80' },
        { title: '谐波20次', field: 'i20', minWidth: '80' },
        { title: '谐波21次', field: 'i21', minWidth: '80' },
        { title: '谐波22次', field: 'i22', minWidth: '80' },
        { title: '谐波23次', field: 'i23', minWidth: '80' },
        { title: '谐波24次', field: 'i24', minWidth: '80' },
        { title: '谐波25次', field: 'i25', minWidth: '80' },
        { title: '谐波26次', field: 'i26', minWidth: '80' },
        { title: '谐波27次', field: 'i27', minWidth: '80' },
        { title: '谐波28次', field: 'i28', minWidth: '80' },
        { title: '谐波29次', field: 'i29', minWidth: '80' },
        { title: '谐波30次', field: 'i30', minWidth: '80' },
        { title: '谐波31次', field: 'i31', minWidth: '80' },
        { title: '谐波32次', field: 'i32', minWidth: '80' },
        { title: '谐波33次', field: 'i33', minWidth: '80' },
        { title: '谐波34次', field: 'i34', minWidth: '80' },
        { title: '谐波35次', field: 'i35', minWidth: '80' },
        { title: '谐波36次', field: 'i36', minWidth: '80' },
        { title: '谐波37次', field: 'i37', minWidth: '80' },
        { title: '谐波38次', field: 'i38', minWidth: '80' },
        { title: '谐波39次', field: 'i39', minWidth: '80' },
        { title: '谐波40次', field: 'i40', minWidth: '80' },
        { title: '谐波41次', field: 'i41', minWidth: '80' },
        { title: '谐波42次', field: 'i42', minWidth: '80' },
        { title: '谐波43次', field: 'i43', minWidth: '80' },
        { title: '谐波44次', field: 'i44', minWidth: '80' },
        { title: '谐波45次', field: 'i45', minWidth: '80' },
        { title: '谐波46次', field: 'i46', minWidth: '80' },
        { title: '谐波47次', field: 'i47', minWidth: '80' },
        { title: '谐波48次', field: 'i48', minWidth: '80' },
        { title: '谐波49次', field: 'i49', minWidth: '80' },
        { title: '谐波50次', field: 'i50', minWidth: '80' },
        {
             title: '操作',fixed: 'right',
            width: '180',
           
            render: 'buttons',
            buttons: [
                {
                    name: 'edit',
                    title: '编辑',
                    type: 'primary',
                    icon: 'el-icon-Open',
                    render: 'basicButton',

                    click: row => {
                        formRef.value.open('编辑谐波源特性字典', row)
                    }
                }
            ]
        }
    ],
    loadCallback: () => {}
})

const formRef = ref()
provide('tableStore', tableStore)
tableStore.table.params.searchValue = ''
// 新增
const add = () => {
    formRef.value.open('新增谐波源特性字典')
}

//删除
const del = () => {
    if (tableStore.table.selection.length == 0) {
        ElMessage({
            type: 'warning',
            message: '请选择要删除的数据'
        })
    } else {
        ElMessageBox.confirm('此操作将永久删除, 是否继续?', '提示', {
            confirmButtonText: '确定',
            cancelButtonText: '取消',
            type: 'warning'
        }).then(() => {
            characteristicDelete(tableStore.table.selection.map(item => item.harmId)).then(res => {
                ElMessage({
                    type: 'success',
                    message: '删除成功!'
                })
                tableStore.index()
            })
        })
    }
}
onMounted(() => {
 
    tableStore.index()
})
</script>
<style lang="scss" scoped></style>
