admin-sjzx/src/views/pqs/database/case/index.vue

<template>
    <div class="default-main">
        <!-- 案例库 -->
        <TableHeader ref="TableHeaderRef" datePicker>
            <template #operation>
                <el-button icon="el-icon-Plus" type="primary" @click="addUser">新增</el-button>
            </template>
        </TableHeader>
        <Table ref="tableRef"></Table>
        <!-- 弹框 -->
        <PopupEdit ref="popupEditRef" @onSubmit="tableStore.index()" />
    </div>
</template>
<script setup lang="ts">
import { onMounted, ref, provide } from 'vue'
import TableStore from '@/utils/tableStore'
import TableHeader from '@/components/table/header/index.vue'
import Table from '@/components/table/index.vue'
import PopupEdit from './components/form.vue'
import { libcaseBeleteyById } from '@/api/supervision-boot/database/index'
import { ElMessage } from 'element-plus'
defineOptions({
    name: 'database/case'
})

const popupEditRef = ref()

const TableHeaderRef = ref()

const tableStore = new TableStore({
    url: '/supervision-boot/libcase/pageQuery',
    method: 'POST',
    column: [
        { title: '电能质量事件名称', field: 'name' },
        {
            title: '发生事件',
            field: 'type'
        },
        {
            title: '事件简介',
            field: 'summary'
        },
        {
            title: '事件经过',
            field: 'process'
        },
        {
            title: '发生地点',
            field: 'location'
        },
        {
            title: '处理措施',
            field: 'measures'
        },
        {
            title: '治理效果',
            field: 'effect'
        },
        {
            title: '操作',
            width: '140',
            render: 'buttons',
            buttons: [
                {
                    name: 'edit',
                    title: '修改',
                    type: 'primary',

                    icon: 'el-icon-Plus',
                    render: 'basicButton',
                    click: row => {
                        popupEditRef.value.open('修改案例', row)
                    }
                },
                {
                    name: 'delete',
                    title: '删除',
                    type: 'danger',
                    icon: 'el-icon-Delete',
                    render: 'confirmButton',
                    popconfirm: {
                        confirmButtonText: '确认',
                        cancelButtonText: '取消',
                        confirmButtonType: 'danger',
                        title: '确定删除吗？'
                    },
                    click: row => {
                        libcaseBeleteyById({ id: row.id }).then(res => {
                            ElMessage.success('删除成功')
                            tableStore.index()
                        })
                    }
                }
            ]
        }
    ],
    loadCallback: () => {}
})

// 弹框
const addUser = () => {
    popupEditRef.value.open('新增案例')
}

provide('tableStore', tableStore)
onMounted(() => {
    tableStore.index()
})
</script>
<style lang="scss"></style>