<template>
	<el-drawer title="知识编写规范" v-model="state.drawerVisible" size="40%" append-to-body destroy-on-close>
		<h3 class="font18" style="text-align: center">{{ state.info.title }}</h3>
		<div v-html="state.info.content" class="mt20 lineHeight24"></div>
	</el-drawer>
</template>

<script setup lang="ts" name="knowledgeStandardInfo">
import { reactive } from 'vue';
import { standardInfo } from '@/api/knowledge/standard';

// 定义变量内容
const state = reactive<any>({
	dialogVisible: false,
	info: {
		title: '', // 标题
		content: '', // 内容
	},
});
// 打开弹窗
const openDialog = () => {
	standardInfoFn();
	state.drawerVisible = true;
};
// 关闭弹窗
const closeDialog = () => {
	state.drawerVisible = false;
};
// 查询规范详情
const standardInfoFn = async () => {
	try {
		state.loading = true;
		const res: any = await standardInfo();
		state.info = res.result ?? {};
		state.loading = false;
	} catch (error) {
		state.loading = false;
	}
};
// 暴露变量
defineExpose({
	openDialog,
	closeDialog,
});
</script>
