<template>
    <div class="end_item">
        <div class="page_search">
            <div class="search_content">
                <div class="content_left">
                    <FormSearchGroup :searchList="searchList" />
                </div>
            </div>
        </div>
        <div class="page_jg_20"></div>
        <Table :pageSize="pageSize" :currentPage="currentPage"  :totalNum="totalNum" 
            :tableColumns="tableColumns" :tableData="tableData">
            <template #num="{row,currentIndex}">
                {{ (currentPage - 1) * pageSize + currentIndex  }}
            </template>
            <template #operation="{row}">
                <div class="table_row_option">
                    <span class="el_button_delete">删除</span>
                </div>
            </template>
        </Table>
    </div>

</template>


<script setup lang="ts">
import { ref } from 'vue';
import FormSearchGroup from '@/baseComponents/FormSearchGroup.vue';

import {searchList} from './formSearchGroup'
import Table from '@/baseComponents/Table.vue';

import {tableColumns} from './table'

const pageSize = ref(20)
const currentPage = ref(1)
const totalNum = ref(0)
const tableData = ref([
    {
        index: 1,
        account: '123456789',
        name: '陈越',
        province: '辽宁',
        region: '沈阳',
        groupName: '项目1组',
        operation: '删除' // 对应操作列，通常存储按钮文本或状态标识
    },
    {
        index: 2,
        account: '123456789',
        name: '张静怡',
        province: '辽宁',
        region: '沈阳',
        groupName: '项目1组',
        operation: '删除'
    },
    {
        index: 3,
        account: '123456789',
        name: '朱函睿',
        province: '辽宁',
        region: '沈阳',
        groupName: '项目1组',
        operation: '删除'
    }
])
</script>


<style lang="scss" scoped>

</style>