SPDM/src/components/common/fileEdit/fileEditDialog/fileEdit.vue

<template>
  <Dialog
    :loading="loadingInterface"
    v-model="dialogVisible"
    diaTitle="编辑文件"
    show-footer
  >
    <div class="monaco-editor-box">
      <MonacoEditor ref="monacoRef" @saveHandle="saveEdit" :fileId="fileId" :idIndex="idIndex"></MonacoEditor>
    </div>
    <!-- <template #footer>
      <div>
        <el-button @click="closeFun">取消</el-button>
        <el-button type="primary" @click="confirmFun" :loading="loadingInterface">确定</el-button>
      </div>
    </template> -->
  </Dialog>
</template>

<script setup lang="ts">
import { ref, onBeforeUnmount, computed } from 'vue';
import MonacoEditor from '@/components/common/fileEdit/monacoEditor/index.vue';
import Dialog from '@/components/common/dialog/index.vue';

const props = withDefaults(
  defineProps<{
    idIndex: string;
    fileId:string;
    showDialog: boolean;
  }>(),
  {
    fileId: '',
    showDialog: false,
    idIndex: '',
  }
);
const emits = defineEmits(['update:showDialog', 'closeHandle', 'saveHandle']);

const loadingInterface = ref(false);

const dialogVisible = computed({
  get() {
    return props.showDialog;
  },
  set(val) {
    emits('update:showDialog', val);
  },
});

const monacoRef = ref();
const saveEdit = () => {
  // emits('closeHandle');
  console.log('121111saveEdit', 123);
  emits('update:showDialog', false);
};

// const closeFun1 = () => {
//   const isChange = monacoRef.value.isChange;
//   if (isChange) {
//     ElMessageBox.confirm('当前数据未保存,是否放弃修改？', '提示', {
//       confirmButtonText: '放弃',
//       cancelButtonText: '取消',
//       type: 'warning',
//     })
//       .then(() => {
//         emits('update:showDialog', false);
//       })
//       .catch(() => {});
//   } else {
//     emits('update:showDialog', false);
//   }
// };

onBeforeUnmount(() => {});
defineExpose({
  monacoRef,
});
</script>

<style lang="scss" scoped>
.monaco-editor-box {
  height: 100%;
}
</style>