<template>
    <el-dialog v-model="dialogVisible" title="挂载表单" width="700" :before-close="handleClose">
        <vxe-table v-bind="defaultAttribute" ref="vxeRef" height="400" :data="equipmentList">
            <vxe-column field="formId" width="80" title="序号"></vxe-column>
            <vxe-column field="formName" title="功能名称"></vxe-column>
            <vxe-column title="操作" width="100">
                <template #default="{ row }">
                    <el-button type="primary" size="small" link @click="mount(row)">挂载</el-button>
                </template>
            </vxe-column>
        </vxe-table>
        <template #footer>
            <div class="dialog-footer">
                <el-button type="primary">确定</el-button>
                <el-button @click="handleClose">取消</el-button>
            </div>
        </template>
    </el-dialog>
</template>
<script setup lang="ts">
import { ref, reactive } from 'vue'
import { defaultAttribute } from '@/components/table/defaultAttribute'
import { ElMessage } from 'element-plus'
const dialogVisible = ref(false)
import { assFormWithDeploy } from '@/api/process-boot/bpm'
const emit = defineEmits(['quit'])
const List: any = ref({})
const equipmentList = ref([
    { formId: '1', formName: '谐波普测计划' },
    { formId: '2', formName: '干扰源用户管理' },
    { formId: '3', formName: '电能质量问题管理' }
])

const handleClose = () => {
    dialogVisible.value = false
}
// 挂载
const mount = (row: any) => {
    assFormWithDeploy({
        formId: row.formId,
        deployId: List.value.id
    }).then(res => {
        ElMessage.success('挂载成功')
        handleClose()
    })
}
const open = (row: any) => {
    dialogVisible.value = true
    List.value = row
}

defineExpose({ open })
</script>
<style lang="scss" scoped></style>
