<template>
|
<ywDialog v-model="dialogIsShow" title="代码" width="50%" @dlgClosed="closeDialog" :showHeaderIcon="false" :showFooter="false">
|
<div style="height: 600px" class="relative">
|
<codemirror
|
class="overflow-auto"
|
style="height: 600px"
|
v-model="codeValue"
|
:autofocus="true"
|
:indent-with-tab="true"
|
:tab-size="2"
|
:extensions="javascriptEditorExtensions"
|
/>
|
<!-- <i
|
@click="copyInfo(item.sql)"
|
class="ywifont ywicon-copy text-blue-400 !text-[25px] cursor-pointer absolute bottom-10 right-10"
|
></i> -->
|
</div>
|
</ywDialog>
|
</template>
|
|
<script setup lang="ts">
|
import ywDialog from '/@/components/dialog/yw-dialog.vue';
|
|
import { javascript } from '@codemirror/lang-javascript';
|
import { vscodeDark } from '@uiw/codemirror-theme-vscode';
|
import { ref, watch } from 'vue';
|
import { Codemirror } from 'vue-codemirror';
|
import commonFunction from '/@/utils/commonFunction';
|
|
const javascriptEditorExtensions = [javascript(), vscodeDark];
|
const dialogIsShow = defineModel({
|
type: Boolean,
|
});
|
const closeDialog = () => {
|
dialogIsShow.value = false;
|
};
|
// const dialogTitle = computed(() => {
|
// return props.item?.id ;
|
// });
|
const props = defineProps(['item']);
|
|
const { copyText } = commonFunction();
|
|
const copyInfo = async (sql) => {
|
copyText(sql);
|
};
|
|
const codeValue = ref('');
|
watch(
|
() => dialogIsShow.value,
|
(val) => {
|
if (val) {
|
codeValue.value = props.item.value;
|
// 关闭时保存内容
|
} else {
|
props.item.value = codeValue.value;
|
}
|
}
|
);
|
</script>
|
<style scoped lang="scss"></style>
|
