36 lines
1.2 KiB
Vue
36 lines
1.2 KiB
Vue
<script setup lang="ts">
|
|
import TinymceEditor from "@tinymce/tinymce-vue"
|
|
import {useDark} from "@vueuse/core"
|
|
import { NamePath } from "ant-design-vue/es/form/interface";
|
|
import {Field as VeeField} from "vee-validate"
|
|
import tinymce from "tinymce"
|
|
const props = defineProps<{
|
|
name: string;
|
|
init: any;
|
|
label: string;
|
|
val?: string;
|
|
width?: number;
|
|
dark?: boolean;
|
|
wrapCol?: any;
|
|
}>()
|
|
onMounted(() => {
|
|
// if(typeof navigator != undefined) {
|
|
// tinymce.init({...props.init, selector: `textarea[${props.name}]`})
|
|
// }
|
|
|
|
})
|
|
// const isDark = useDark()
|
|
// console.log("darky")
|
|
</script>
|
|
<template>
|
|
<ClientOnly>
|
|
<vee-field :name="props.name" v-slot="{errorMessage, field, value}" :value="val">
|
|
<a-form-item :validate-status="!!errorMessage ? 'error' : undefined" :name="props.name" :label="props.label" :value="val">
|
|
<tinymce-editor v-bind="field" width="100%" cloud-channel="6-dev" api-key="qagffr3pkuv17a8on1afax661irst1hbr4e6tbv888sz91jc"
|
|
:init="{...props.init,
|
|
skin: props.dark ? 'oxide-dark' : 'oxide',
|
|
content_css: props.dark ? 'dark' : 'default'}"/>
|
|
</a-form-item>
|
|
</vee-field>
|
|
</ClientOnly>
|
|
</template> |