admin-sjzx/src/views/pqs/supervise/electricalEnergy/components1/form/detail.vue

<template>
    <el-dialog draggable v-model="dialogVisible"   :title="title" width="80%" :before-close="handleClose">
        <div style="height: 45vh"  v-loading="loading">
            <vxe-table show-overflow v-bind="defaultAttribute" :data="List">
                <vxe-column field="time" title="日期" width="230px"></vxe-column>
                <vxe-column field="overLimitInfo" title="越限详情"></vxe-column>
            </vxe-table>
        </div>
    </el-dialog>
</template>
<script setup lang="ts">
import { ref, defineEmits } from 'vue'
import { useDictData } from '@/stores/dictData'
import { ElMessage } from 'element-plus'
import { overLimitDetail } from '@/api/process-boot/electricitymanagement'
import { defaultAttribute } from '@/components/table/defaultAttribute'
const emits = defineEmits(['onSubmit'])
const dictData = useDictData()
const dialogVisible = ref(false)
const title: any = ref('')
const List: any = ref([])
const loading = ref(false)
const open = (row: any) => {
    dialogVisible.value = true
    title.value = row.text
    loading.value = true
    List.value = []
    overLimitDetail({
        lineId: row.row.lineId,
        targetId: row.row.targetType,
        searchBeginTime: row.list.searchBeginTime,
        searchEndTime: row.list.searchEndTime
    }).then(res => {
        List.value = res.data
        loading.value = false
    })
}

const handleClose = () => {
    dialogVisible.value = false
}

defineExpose({ open })
</script>

<style lang="scss">
/* 提升 VxeTable tooltip 的层级 */
</style>