<template>
|
<app-dialog-form
|
v-bind="dialogFormProps"
|
>
|
<app-monaco-sql v-bind="monacoSqlProps"/>
|
</app-dialog-form>
|
</template>
|
|
|
<script setup>
|
import {useI18n} from 'vue-i18n';
|
|
const {t} = useI18n();
|
|
const dialogFormRef = ref();
|
|
const monacoSqlRef = ref();
|
|
const props = defineProps({
|
subSubmit: {
|
type: Function,
|
default: () => {
|
}
|
},
|
});
|
|
const monacoSqlProps = {
|
ref: monacoSqlRef,
|
}
|
|
let editRow = {};
|
|
const dialogFormProps = {
|
title: '',
|
ref: dialogFormRef,
|
subSubmit: async () => {
|
const sql = monacoSqlRef.value.getValue();
|
props.subSubmit({value: sql});
|
},
|
subReset: async () => {
|
monacoSqlRef.value.init({sql: editRow.sqlSegment.value || ''});
|
}
|
};
|
|
|
const onOpen = async (row) => {
|
|
editRow = row;
|
|
dialogFormProps.title = t(row.id ? 'common.dialog.title.edit' : 'common.dialog.title.add');
|
dialogFormRef.value.$forceUpdate(dialogFormProps)
|
dialogFormRef.value.onOpen();
|
|
await nextTick();
|
|
monacoSqlRef.value.init({sql: editRow.sqlSegment.value || ''});
|
|
}
|
|
defineExpose({
|
onOpen,
|
});
|
</script>
|
|
<style lang="scss" scoped>
|
.wrapper {
|
}
|
</style>
|
