190 lines
4.1 KiB
Vue
190 lines
4.1 KiB
Vue
<template>
|
|
<a-card :bordered="false" class="mb-none">
|
|
<container>
|
|
<a-row :gutter="16" type="flex">
|
|
<a-col flex="auto">
|
|
<container
|
|
:id="`doc-${index}`"
|
|
:key="index"
|
|
mode="container"
|
|
v-for="(doc, index) in docs"
|
|
>
|
|
<section>
|
|
<h1>{{ doc.title }}</h1>
|
|
<component :codes="codes" :is="doc.component" v-if="doc.path" />
|
|
<template v-if="doc.children">
|
|
<section
|
|
:id="`doc-${index}-${_index}`"
|
|
:key="_index"
|
|
v-for="(_doc, _index) in doc.children"
|
|
>
|
|
<h3>{{ _doc.title }}</h3>
|
|
<component :codes="codes" :is="_doc.component" v-if="_doc.path" />
|
|
</section>
|
|
</template>
|
|
</section>
|
|
<a-divider v-if="index < docs.length - 1" />
|
|
</container>
|
|
</a-col>
|
|
<a-col flex="240px">
|
|
<a-anchor
|
|
:get-container="()=> $el.parentNode"
|
|
:offset-top="24"
|
|
:wrapper-style="{ backgroundColor: 'transparent' }"
|
|
>
|
|
<a-anchor-link
|
|
:href="`#doc-${index}`"
|
|
:key="index"
|
|
:title="doc.title"
|
|
v-for="(doc, index) in docs"
|
|
>
|
|
<template v-if="doc.children">
|
|
<a-anchor-link
|
|
:href="`#doc-${index}-${_index}`"
|
|
:key="_index"
|
|
:title="_doc.title"
|
|
v-for="(_doc, _index) in doc.children"
|
|
/>
|
|
</template>
|
|
</a-anchor-link>
|
|
</a-anchor>
|
|
</a-col>
|
|
</a-row>
|
|
</container>
|
|
</a-card>
|
|
</template>
|
|
<script>
|
|
const docs = [
|
|
{
|
|
title: '数据库',
|
|
path: '/database',
|
|
children: [
|
|
{
|
|
title: '实体(N)',
|
|
},
|
|
{
|
|
title: '迁移',
|
|
path: '/database/migrations',
|
|
},
|
|
],
|
|
},
|
|
{
|
|
title: '数据传输对象',
|
|
},
|
|
{
|
|
title: '窗口',
|
|
path: '/window',
|
|
children: [
|
|
{
|
|
title: '打开窗口',
|
|
path: '/window/open',
|
|
},
|
|
{
|
|
title: '关闭窗口',
|
|
path: '/window/close',
|
|
},
|
|
],
|
|
},
|
|
{
|
|
title: '全局函数',
|
|
path: '/functions',
|
|
},
|
|
{
|
|
title: '接口',
|
|
path: '/api',
|
|
children: [
|
|
{
|
|
title: '配置',
|
|
path: '/api/setting',
|
|
},
|
|
{
|
|
title: '调用',
|
|
path: '/api/usage',
|
|
},
|
|
{
|
|
title: '队列',
|
|
path: '/api/queue',
|
|
},
|
|
],
|
|
},
|
|
{
|
|
title: '权限渲染',
|
|
path: '/auth',
|
|
},
|
|
{
|
|
title: '种子',
|
|
path: '/seed',
|
|
children: [
|
|
{
|
|
title: '查询表格',
|
|
path: '/seed/query',
|
|
},
|
|
{
|
|
title: '编辑窗口',
|
|
path: '/seed/form',
|
|
},
|
|
{
|
|
title: '树-查询表格',
|
|
path: '/seed/treeLayout',
|
|
},
|
|
],
|
|
},
|
|
{
|
|
title: '全局用户信息',
|
|
path: '/globalinfo',
|
|
},
|
|
{
|
|
title: '内置组件(N)',
|
|
},
|
|
{
|
|
title: '本地存储(N)',
|
|
path: '/storage',
|
|
},
|
|
{
|
|
title: '工具(N)',
|
|
},
|
|
];
|
|
|
|
export default {
|
|
data() {
|
|
return {
|
|
docs: null,
|
|
|
|
codes: {},
|
|
};
|
|
},
|
|
mounted() {
|
|
docs.forEach((doc) => {
|
|
if (doc.path) {
|
|
doc.component = () => import(`.${doc.path}`);
|
|
}
|
|
if (doc.children) {
|
|
doc.children.forEach((_doc) => {
|
|
_doc.component = () => import(`.${_doc.path}`);
|
|
});
|
|
}
|
|
});
|
|
|
|
this.docs = docs;
|
|
|
|
// 读取doc-code下所有文件内容
|
|
const files = require.context('@/../public/doc-code', true, /\.(js|jsx|html|vue|css|less|json|cs)(\?.*)?$/);
|
|
const codes = {};
|
|
files.keys().forEach((p) => {
|
|
const filepath = p.slice(1);
|
|
const xhr = new XMLHttpRequest();
|
|
xhr.open('GET', `./doc-code${filepath}`, false);
|
|
xhr.overrideMimeType('text/plain;charset=utf-8');
|
|
xhr.send(null);
|
|
codes[filepath] = xhr.responseText;
|
|
});
|
|
this.codes = codes;
|
|
},
|
|
methods: {
|
|
container() {
|
|
return this.$el;
|
|
},
|
|
},
|
|
};
|
|
</script>
|