manager/zyplayer-doc
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

文档管理优化

Browse Source
This commit is contained in:
暮光：城中城
2021-12-13 23:55:30 +08:00
parent 52a01581d4
commit bca4ba34e1
7 changed files with 386 additions and 201 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
zyplayer-doc-api/src/main/java/com/zyplayer/doc/api/controller/ApiDocumentController.java
View File

@@ -88,7 +88,7 @@ public class ApiDocumentController {
*/
@ResponseBody
@PostMapping(value = "/add")
public ResponseJson<List<ApiDoc>> add(HttpServletRequest request, ApiDoc apiDoc) {
public ResponseJson<Object> add(HttpServletRequest request, ApiDoc apiDoc) {
DocUserDetails currentUser = DocUserUtil.getCurrentUser();
apiDoc.setYn(1);
apiDoc.setCreateTime(new Date());
@@ -145,7 +145,7 @@ public class ApiDocumentController {
} else {
return DocResponseJson.warn("暂不支持的文档类型");
}
return DocResponseJson.ok();
return DocResponseJson.ok(apiDoc);
}
/**

14
zyplayer-doc-ui/api-ui/src/views/manage/DocManage.vue
View File

@@ -1,23 +1,23 @@
<template>
<DocManageList v-if="showView === 'list'" @showMembers="showMembers"></DocManageList>
<DocManageList v-if="showView === 'list'" @edit="editDoc"></DocManageList>
<div v-else>
<DocManageMembers v-if="showView === 'members'" @showDocList="showDocList" :doc="docInfo"></DocManageMembers>
<DocManageEdit v-if="showView === 'edit'" @showDocList="showDocList" :doc="docInfo"></DocManageEdit>
</div>
</template>
<script>
import { toRefs, ref, reactive, onMounted } from 'vue';
import DocManageList from "./DocManageList.vue";
import DocManageMembers from "./DocManageMembers.vue";
import DocManageEdit from "./DocManageEdit.vue";
export default {
components: {DocManageList, DocManageMembers},
components: {DocManageList, DocManageEdit},
setup() {
let showView = ref('list');
let docInfo = ref({});
const showMembers = (doc) => {
const editDoc = (type, doc) => {
docInfo.value = doc;
showView.value = 'members';
showView.value = type;
};
const showDocList = () => {
showView.value = 'list';
@@ -25,7 +25,7 @@
return {
showView,
docInfo,
showMembers,
editDoc,
showDocList,
}
},

112
zyplayer-doc-ui/api-ui/src/views/manage/DocManageEdit.vue Normal file
View File

@@ -0,0 +1,112 @@
<template>
<a-page-header
title="编辑"
:sub-title="docEdit.name||''"
@back="showDocList">
<template #extra>
</template>
</a-page-header>
<a-tabs v-model:activeKey="activeEditTab" style="padding: 5px 10px 0;">
<a-tab-pane tab="基本信息" key="base" forceRender>
<a-spin tip="文档数据加载中..." :spinning="docEditLoading">
<EditDocBaseInfo ref="docBaseInfoRef" :doc="docEdit"></EditDocBaseInfo>
</a-spin>
</a-tab-pane>
<a-tab-pane tab="成员管理" key="members">
<a-spin tip="文档数据加载中..." :spinning="docEditLoading">
<DocManageMembers :doc="docEdit"></DocManageMembers>
</a-spin>
</a-tab-pane>
<a-tab-pane v-if="docEdit.openVisit === 1" tab="开放文档说明" key="instruction" forceRender>
<a-spin tip="文档数据加载中..." :spinning="docEditLoading">
<EditShareInstruction ref="shareInstructionRef" :doc="docEdit"></EditShareInstruction>
</a-spin>
</a-tab-pane>
<template #rightExtra>
<a-button v-if="activeEditTab==='base'" @click="saveBaseInfo" type="primary">
<template #icon><save-outlined /></template>
保存基本信息
</a-button>
<a-button v-if="activeEditTab==='instruction'" @click="saveShareInstruction" type="primary">
<template #icon><save-outlined /></template>
保存开放文档说明
</a-button>
</template>
</a-tabs>
</template>
<script>
import { toRefs, ref, reactive, onMounted } from 'vue';
import {zyplayerApi} from '../../api';
import {useStore} from 'vuex';
import {getZyplayerApiBaseUrl} from "../../api/request/utils";
import {DownOutlined, LinkOutlined, SaveOutlined} from '@ant-design/icons-vue';
import { message } from 'ant-design-vue';
import EditDocBaseInfo from "./components/EditDocBaseInfo.vue";
import EditShareInstruction from "./components/EditShareInstruction.vue";
import DocManageMembers from "./DocManageMembers.vue";
export default {
emits: ['showDocList'],
components: {DownOutlined, LinkOutlined, SaveOutlined, EditShareInstruction, EditDocBaseInfo, DocManageMembers},
props: {
doc: {
type: Object,
required: true
},
},
setup(props, {emit}) {
const store = useStore();
const showDocList = () => {
emit('showDocList');
}
let docBaseInfoRef = ref();
let shareInstructionRef = ref();
let docEdit = ref({});
let docEditLoading = ref(false);
const saveBaseInfo = async () => {
let docNew = await docBaseInfoRef.value.getDoc();
docEditLoading.value = true;
zyplayerApi.apiDocAdd(docNew).then(res => {
message.success('保存成功！');
docEditLoading.value = false;
store.commit('addDocChangedNum');
// 需要返回列表
if (res.data.id !== docNew.id) {
showDocList();
}
});
};
const saveShareInstruction = () => {
let docNew = shareInstructionRef.value.getDoc();
if (!docNew) {
return;
}
docEditLoading.value = true;
zyplayerApi.apiDocUpdate(docNew).then(res => {
message.success('保存成功！');
docEditLoading.value = false;
});
};
let activeEditTab = ref('base');
onMounted(() => {
docEdit.value = props.doc;
docEditLoading.value = true;
zyplayerApi.apiDocDetail({id: props.doc.id}).then(res => {
docEditLoading.value = false;
docEdit.value = res.data;
});
});
return {
activeEditTab,
showDocList,
saveBaseInfo,
saveShareInstruction,
docBaseInfoRef,
shareInstructionRef,
docEdit,
docEditLoading,
};
},
};
</script>

161
zyplayer-doc-ui/api-ui/src/views/manage/DocManageList.vue
View File

@@ -34,7 +34,6 @@
<template v-if="column.dataIndex === 'operation'">
<a-button size="small" type="link" @click="editDoc(record)">编辑</a-button>
<template v-if="record.authType === 1">
<a-button size="small" type="link" @click="showMembers(record)">成员管理</a-button>
<a-popconfirm title="确定要删除吗？" @confirm="deleteDoc(record)">
<a-button size="small" type="link" danger>删除</a-button>
</a-popconfirm>
@@ -43,7 +42,6 @@
<template #overlay>
<a-menu @click="handleActionMenuClick($event, record)">
<a-menu-item key="shareView"><link-outlined /> 查看开放文档</a-menu-item>
<a-menu-item key="shareInstruction"><edit-outlined /> 编辑开放文档说明</a-menu-item>
</a-menu>
</template>
<a-button type="link" size="small">更多<DownOutlined /></a-button>
@@ -64,110 +62,9 @@
</template>
</template>
</a-table>
<a-modal v-model:visible="newDocVisible" :title="docEdit.isNew?'新增文档':'编辑文档'" @ok="handleNewDocOk" :width="800">
<a-form layout="horizontal" ref="newDocFormRef" :rules="newDocRules" :model="docEdit" :label-col="{span: 4}" :wrapper-col="{span: 20}">
<a-form-item label="文档名称" required name="name">
<a-input placeholder="请输入文档名称" v-model:value="docEdit.name"></a-input>
</a-form-item>
<a-form-item label="文档类型" required name="docType">
<a-radio-group v-model:value="docEdit.docType">
<a-radio :value="1">Swagger URL</a-radio>
<a-radio :value="2">Swagger JSON</a-radio>
<a-radio :value="3">OpenApi URL</a-radio>
<a-radio :value="4">OpenApi JSON</a-radio>
<a-radio :value="5" disabled>自建API</a-radio>
</a-radio-group>
</a-form-item>
<a-form-item label="文档地址" required name="docUrl" v-if="docEdit.docType === 1">
<a-input placeholder="请输入文档地址URL" v-model:value="docEdit.docUrl"></a-input>
<template #extra>
查看文档地址
<a-popover title="文档地址支持以下任一格式">
<template #content>
<p>格式一：http://doc.zyplayer.com/v2/api-docs</p>
<p>格式二：http://doc.zyplayer.com/swagger-resources</p>
<p>格式三：http://doc.zyplayer.com/swagger-ui.html</p>
</template>
<a>示例</a>
</a-popover>
</template>
</a-form-item>
<a-form-item label="文档内容" required name="jsonContent" v-else-if="docEdit.docType === 2">
<!-- textarea在内容很多的时候（>300KB）会卡顿，ace不会-->
<ace-editor v-model:value="docEdit.jsonContent" lang="json" theme="monokai" width="100%" height="100" :options="aceEditorConfig"></ace-editor>
<!-- <a-textarea placeholder="请输入JSON格式的Swagger文档内容" v-model:value="docEdit.jsonContent" :auto-size="{ minRows: 5, maxRows: 10 }"></a-textarea>-->
<template #extra>
查看文档内容
<a-popover title="文档内容说明">
<template #content>
<div>支持以下格式的Swagger文档内容输入，其中 {"swagger": "2.0"} 为必要属性</div>
<div v-highlight>
<pre><code class="lang-json">{{swaggerDocDemo}}</code></pre>
</div>
</template>
<a>说明</a>
</a-popover>
</template>
</a-form-item>
<a-form-item label="文档地址" required name="docUrl" v-if="docEdit.docType === 3">
<a-input placeholder="请输入文档地址URL" v-model:value="docEdit.docUrl"></a-input>
<template #extra>
查看文档地址
<a-popover title="文档地址支持以下任一格式">
<template #content>
<p>格式一：http://doc.zyplayer.com/v3/api-docs</p>
</template>
<a>示例</a>
</a-popover>
</template>
</a-form-item>
<a-form-item label="文档内容" required name="jsonContent" v-else-if="docEdit.docType === 4">
<ace-editor v-model:value="docEdit.jsonContent" lang="json" theme="monokai" width="100%" height="100" :options="aceEditorConfig"></ace-editor>
<!-- <a-textarea placeholder="请输入JSON格式的OpenApi文档内容" v-model:value="docEdit.jsonContent" :auto-size="{ minRows: 5, maxRows: 10 }"></a-textarea>-->
<template #extra>
查看文档内容
<a-popover title="文档内容说明">
<template #content>
<div>支持以下格式的OpenApi文档内容输入，其中 {"openapi": "3.x.x"} 为必要属性</div>
<div v-highlight>
<pre><code class="lang-json">{{openApiDocDemo}}</code></pre>
</div>
</template>
<a>说明</a>
</a-popover>
</template>
</a-form-item>
<a-form-item label="目标域名" name="rewriteDomain">
<a-input placeholder="请输入目标域名" v-model:value="docEdit.rewriteDomain"></a-input>
<template #extra>
目标域名
<a-popover title="目标域名说明">
<template #content>
<p>在文档的在线调试界面，访问的域名可以初始为此处录入的域名，而非文档本身的域名地址</p>
<p>可便于不同环境间的接口测试，例：http://doc.zyplayer.com</p>
</template>
<a>说明</a>
</a-popover>
</template>
</a-form-item>
<a-form-item label="开放访问" required name="openVisit">
<a-radio-group v-model:value="docEdit.openVisit">
<a-radio :value="0">否</a-radio>
<a-radio :value="1">开放访问</a-radio>
</a-radio-group>
<template #extra>
开放访问后无需登录即可通过<a @click="openShareViewWindow(docEdit)">开放文档URL</a>访问该文档信息
</template>
</a-form-item>
<a-form-item label="状态" required name="docStatus">
<a-radio-group v-model:value="docEdit.docStatus">
<a-radio :value="1">启用</a-radio>
<a-radio :value="2">禁用</a-radio>
</a-radio-group>
</a-form-item>
</a-form>
<a-modal v-model:visible="newDocVisible" :title="docEdit.isNew?'新增文档':'编辑文档'" @ok="handleNewDocOk" :width="850">
<EditDocBaseInfo :doc="docEdit"></EditDocBaseInfo>
</a-modal>
<EditShareInstruction ref="instruction"></EditShareInstruction>
</template>
<script>
@@ -175,14 +72,14 @@
import {zyplayerApi} from '../../api';
import {useStore} from 'vuex';
import aceEditor from "../../assets/ace-editor";
import EditShareInstruction from "./components/EditShareInstruction.vue";
import EditDocBaseInfo from "./components/EditDocBaseInfo.vue";
import {getZyplayerApiBaseUrl} from "../../api/request/utils";
import {DownOutlined, LinkOutlined, EditOutlined} from '@ant-design/icons-vue';
import { message } from 'ant-design-vue';
export default {
emits: ['showMembers'],
components: {aceEditor, EditShareInstruction, DownOutlined, LinkOutlined, EditOutlined},
emits: ['edit'],
components: {aceEditor, DownOutlined, LinkOutlined, EditOutlined, EditDocBaseInfo},
setup(props, {emit}) {
const store = useStore();
let docList = ref([]);
@@ -217,9 +114,9 @@
const handleNewDocOk = async () => {
newDocFormRef.value.validate().then(() => {
zyplayerApi.apiDocAdd(docEdit.value).then(res => {
searchDocList();
newDocVisible.value = false;
store.commit('addDocChangedNum');
emit('edit', 'edit', res.data);
});
}).catch(error => {
console.log('error', error);
@@ -231,14 +128,12 @@
docType: 1, openVisit: 0, docStatus: 1, isNew: 1
};
};
const showMembers = (record) => {
emit('showMembers', record);
};
const editDoc = (record) => {
zyplayerApi.apiDocDetail({id: record.id}).then(res => {
docEdit.value = res.data;
newDocVisible.value = true;
});
emit('edit', 'edit', record);
// zyplayerApi.apiDocDetail({id: record.id}).then(res => {
// docEdit.value = res.data;
// newDocVisible.value = true;
// });
};
const updateDoc = async (id, docStatus, yn) => {
zyplayerApi.apiDocUpdate({id, docStatus, yn}).then(res => {
@@ -260,11 +155,8 @@
const handleActionMenuClick = (item, record) => {
if (item.key === 'shareView') {
openShareViewWindow(record);
} else if (item.key === 'shareInstruction') {
instruction.value.editDoc(record.id);
}
}
let instruction = ref();
onMounted(() => {
searchDocList();
});
@@ -280,12 +172,10 @@
handleNewDocOk,
deleteDoc,
editDoc,
showMembers,
handleTableChange,
openShareViewWindow,
handleActionMenuClick,
pagination,
instruction,
newDocRules: {
name: [{required: true, message: '请输入文档名称', trigger: 'change'}],
docUrl: [{required: true, message: '请输入文档地址', trigger: 'change'}],
@@ -302,35 +192,8 @@
{title: '状态', dataIndex: 'docStatus', width: 90},
{title: '文档地址', dataIndex: 'docUrl'},
{title: '目标域名', dataIndex: 'rewriteDomain', width: 250},
{title: '操作', dataIndex: 'operation', fixed: 'right', width: 280},
{title: '操作', dataIndex: 'operation', fixed: 'right', width: 200},
],
aceEditorConfig: {
wrap: true,
autoScrollEditorIntoView: true,
enableBasicAutocompletion: true,
enableSnippets: true,
enableLiveAutocompletion: true,
minLines: 10,
maxLines: 15,
},
swaggerDocDemo:
'{\n'
+ ' "swagger": "2.0",\n'
+ ' "info": {},\n'
+ ' "host": "doc.zyplayer.com",\n'
+ ' "basePath":"/",\n'
+ ' "tags": [],\n'
+ ' "paths": {},\n'
+ ' "definitions": {}\n'
+ '}',
openApiDocDemo:
'{\n'
+ ' "openapi": "3.0.3",\n'
+ ' "components": {}\n'
+ ' "servers": [],\n'
+ ' "paths": {},\n'
+ ' "info": {},\n'
+ '}',
};
},
};

23
zyplayer-doc-ui/api-ui/src/views/manage/DocManageMembers.vue
View File

@@ -1,13 +1,8 @@
<template>
<a-page-header
title="成员管理"
:sub-title="doc.name||''"
@back="showDocList">
<template #extra>
<a-button @click="searchDocMemberList" type="primary">查询</a-button>
<a-button @click="openAddDocMember" :style="{ marginLeft: '8px' }">添加用户</a-button>
</template>
</a-page-header>
<div style="text-align: right;margin: 0 10px 10px 0;">
<a-button @click="searchDocMemberList" type="primary">查询</a-button>
<a-button @click="openAddDocMember" :style="{ marginLeft: '8px' }">添加用户</a-button>
</div>
<a-table :dataSource="docMemberList" :columns="docListColumns" size="middle"
:loading="docMemberListLoading" :pagination="false"
@change="handleTableChange"
@@ -61,7 +56,7 @@
</template>
<script>
import { toRefs, ref, reactive, onMounted } from 'vue';
import { toRefs, ref, reactive, onMounted, watch } from 'vue';
import {zyplayerApi} from '../../api';
import {useStore} from 'vuex';
import {getZyplayerApiBaseUrl} from "../../api/request/utils";
@@ -79,6 +74,9 @@
},
setup(props, {emit}) {
const store = useStore();
// watch(() => props.doc, () => {
// searchDocMemberList();
// });
let docMemberList = ref([]);
let docMemberListLoading = ref(false);
let searchParam = ref({docId: '', pageNum: 1, pageSize: 20});
@@ -98,7 +96,10 @@
searchParam.value.pageSize = paginationNew.pageSize;
searchDocMemberList();
};
const searchDocMemberList = async () => {
const searchDocMemberList = async () => {
if (!props.doc.id) {
return;
}
docMemberListLoading.value = true;
searchParam.value.docId = props.doc.id;
zyplayerApi.docAuthList(searchParam.value).then(res => {

212
zyplayer-doc-ui/api-ui/src/views/manage/components/EditDocBaseInfo.vue Normal file
View File

@@ -0,0 +1,212 @@
<template>
<a-form layout="horizontal" ref="newDocFormRef" :rules="newDocRules" :model="docEdit" :label-col="{span: 4}" :wrapper-col="{span: 18}">
<a-form-item label="文档名称" required name="name">
<a-input placeholder="请输入文档名称" v-model:value="docEdit.name"></a-input>
</a-form-item>
<a-form-item label="文档类型" required name="docType">
<a-radio-group v-model:value="docEdit.docType">
<a-radio :value="1">Swagger URL</a-radio>
<a-radio :value="2">Swagger JSON</a-radio>
<a-radio :value="3">OpenApi URL</a-radio>
<a-radio :value="4">OpenApi JSON</a-radio>
<a-radio :value="5" disabled>自建API</a-radio>
</a-radio-group>
</a-form-item>
<a-form-item label="文档地址" required name="docUrl" v-if="docEdit.docType === 1">
<a-input placeholder="请输入文档地址URL" v-model:value="docEdit.docUrl"></a-input>
<template #extra>
查看文档地址
<a-popover title="文档地址支持以下任一格式">
<template #content>
<p>格式一：http://doc.zyplayer.com/v2/api-docs</p>
<p>格式二：http://doc.zyplayer.com/swagger-resources</p>
<p>格式三：http://doc.zyplayer.com/swagger-ui.html</p>
</template>
<a>示例</a>
</a-popover>
</template>
</a-form-item>
<a-form-item label="文档内容" required name="jsonContent" v-else-if="docEdit.docType === 2">
<!-- textarea在内容很多的时候（>300KB）会卡顿，ace不会-->
<ace-editor v-model:value="docEdit.jsonContent" lang="json" theme="monokai" width="100%" height="100" :options="aceEditorConfig"></ace-editor>
<!-- <a-textarea placeholder="请输入JSON格式的Swagger文档内容" v-model:value="docEdit.jsonContent" :auto-size="{ minRows: 5, maxRows: 10 }"></a-textarea>-->
<template #extra>
查看文档内容
<a-popover title="文档内容说明">
<template #content>
<div>支持以下格式的Swagger文档内容输入，其中 {"swagger": "2.0"} 为必要属性</div>
<div v-highlight>
<pre><code class="lang-json">{{swaggerDocDemo}}</code></pre>
</div>
</template>
<a>说明</a>
</a-popover>
</template>
</a-form-item>
<a-form-item label="文档地址" required name="docUrl" v-if="docEdit.docType === 3">
<a-input placeholder="请输入文档地址URL" v-model:value="docEdit.docUrl"></a-input>
<template #extra>
查看文档地址
<a-popover title="文档地址支持以下任一格式">
<template #content>
<p>格式一：http://doc.zyplayer.com/v3/api-docs</p>
</template>
<a>示例</a>
</a-popover>
</template>
</a-form-item>
<a-form-item label="文档内容" required name="jsonContent" v-else-if="docEdit.docType === 4">
<ace-editor v-model:value="docEdit.jsonContent" lang="json" theme="monokai" width="100%" height="100" :options="aceEditorConfig"></ace-editor>
<!-- <a-textarea placeholder="请输入JSON格式的OpenApi文档内容" v-model:value="docEdit.jsonContent" :auto-size="{ minRows: 5, maxRows: 10 }"></a-textarea>-->
<template #extra>
查看文档内容
<a-popover title="文档内容说明">
<template #content>
<div>支持以下格式的OpenApi文档内容输入，其中 {"openapi": "3.x.x"} 为必要属性</div>
<div v-highlight>
<pre><code class="lang-json">{{openApiDocDemo}}</code></pre>
</div>
</template>
<a>说明</a>
</a-popover>
</template>
</a-form-item>
<a-form-item label="目标域名" name="rewriteDomain">
<a-input placeholder="请输入目标域名" v-model:value="docEdit.rewriteDomain"></a-input>
<template #extra>
目标域名
<a-popover title="目标域名说明">
<template #content>
<p>在文档的在线调试界面，访问的域名可以初始为此处录入的域名，而非文档本身的域名地址</p>
<p>可便于不同环境间的接口测试，例：http://doc.zyplayer.com</p>
</template>
<a>说明</a>
</a-popover>
</template>
</a-form-item>
<a-form-item label="开放访问" required name="openVisit">
<a-radio-group v-model:value="docEdit.openVisit">
<a-radio :value="0">否</a-radio>
<a-radio :value="1">开放访问</a-radio>
</a-radio-group>
<template #extra>
开放访问后无需登录即可通过<a @click="openShareViewWindow(docEdit)">开放文档URL</a>访问该文档信息
</template>
</a-form-item>
<a-form-item label="状态" required name="docStatus">
<a-radio-group v-model:value="docEdit.docStatus">
<a-radio :value="1">启用</a-radio>
<a-radio :value="2">禁用</a-radio>
</a-radio-group>
</a-form-item>
</a-form>
</template>
<script>
import { toRefs, ref, reactive, onMounted, watch } from 'vue';
import {zyplayerApi} from '../../../api';
import {useStore} from 'vuex';
import aceEditor from "../../../assets/ace-editor";
import EditShareInstruction from "../components/EditShareInstruction.vue";
import {getZyplayerApiBaseUrl} from "../../../api/request/utils";
import {DownOutlined, LinkOutlined, EditOutlined} from '@ant-design/icons-vue';
import { message } from 'ant-design-vue';
export default {
emits: ['edit'],
components: {aceEditor, EditShareInstruction, DownOutlined, LinkOutlined, EditOutlined},
props: {
doc: {
type: Object,
required: true
},
},
setup(props, {emit}) {
const store = useStore();
let docEdit = ref({});
let newDocFormRef = ref();
watch(() => props.doc, () => {
editDoc();
});
const handleNewDocOk = async () => {
newDocFormRef.value.validate().then(() => {
zyplayerApi.apiDocAdd(docEdit.value).then(res => {
// searchDocList();
store.commit('addDocChangedNum');
});
}).catch(error => {
console.log('error', error);
});
};
const editDoc = () => {
docEdit.value = props.doc;
};
const getDoc = async () => {
await newDocFormRef.value.validate();
return docEdit.value;
};
const updateDoc = async (id, docStatus, yn) => {
zyplayerApi.apiDocUpdate({id, docStatus, yn}).then(res => {
// searchDocList();
store.commit('addDocChangedNum');
});
};
// 打开开放文档新窗口
const openShareViewWindow = record => {
if (!record.shareUuid) {
message.warning('请先保存文档后再试');
} else if (record.openVisit !== 1) {
message.warning('该文档尚未开启开放访问功能，请在编辑页选择开放后再试');
} else {
window.open(getZyplayerApiBaseUrl() + '/doc-api#/share/home?uuid=' + record.shareUuid);
}
};
onMounted(() => {
editDoc();
});
return {
docEdit,
newDocFormRef,
handleNewDocOk,
editDoc,
getDoc,
openShareViewWindow,
newDocRules: {
name: [{required: true, message: '请输入文档名称', trigger: 'change'}],
docUrl: [{required: true, message: '请输入文档地址', trigger: 'change'}],
jsonContent: [{required: true, message: '请输入JSON格式的swagger文档内容', trigger: 'change'}],
docType: [{type: 'number', required: true, message: '请选择文档类型', trigger: 'change'}],
openVisit: [{type: 'number', required: true, message: '请选择是否开放访问', trigger: 'change'}],
docStatus: [{type: 'number', required: true, message: '请选择文档状态', trigger: 'change'}],
},
aceEditorConfig: {
wrap: true,
autoScrollEditorIntoView: true,
enableBasicAutocompletion: true,
enableSnippets: true,
enableLiveAutocompletion: true,
minLines: 10,
maxLines: 15,
},
swaggerDocDemo:
'{\n'
+ ' "swagger": "2.0",\n'
+ ' "info": {},\n'
+ ' "host": "doc.zyplayer.com",\n'
+ ' "basePath":"/",\n'
+ ' "tags": [],\n'
+ ' "paths": {},\n'
+ ' "definitions": {}\n'
+ '}',
openApiDocDemo:
'{\n'
+ ' "openapi": "3.0.3",\n'
+ ' "components": {}\n'
+ ' "servers": [],\n'
+ ' "paths": {},\n'
+ ' "info": {},\n'
+ '}',
};
},
};
</script>

61
zyplayer-doc-ui/api-ui/src/views/manage/components/EditShareInstruction.vue
View File

@@ -1,53 +1,50 @@
<template>
<a-modal v-model:visible="editShareInstructionVisible" @ok="handleNewDocOk" width="90%"
:bodyStyle="{height: 'calc(100vh - 300px)'}">
<template #title>
编辑开放文档说明
<a-tooltip placement="bottom">
<template #title>此说明文档将展示在开放文档的首页展示，可点击‘查看开放文档’查看效果</template>
<info-circle-outlined />
</a-tooltip>
</template>
<mavon-editor ref="mavonEditor" v-model="shareInstruction" :toolbars="toolbars"
:externalLink="false" @imgAdd="addMarkdownImage" :imageFilter="imageFilter"
style="height: 100%;"
placeholder="请录入开放文档说明"/>
</a-modal>
<mavon-editor ref="mavonEditor" v-model="shareInstruction" :toolbars="toolbars"
:externalLink="false" @imgAdd="addMarkdownImage" :imageFilter="imageFilter"
style="height: 100%;"
placeholder="请录入开放文档说明"/>
</template>
<script>
import { toRefs, ref, reactive, onMounted, nextTick } from 'vue';
import { toRefs, ref, reactive, onMounted, nextTick, watch } from 'vue';
import {zyplayerApi} from '../../../api';
import {useStore} from 'vuex';
import aceEditor from "../../../assets/ace-editor";
import {getZyplayerApiBaseUrl} from "../../../api/request/utils";
import {BranchesOutlined, InfoCircleOutlined} from '@ant-design/icons-vue';
import {mavonEditor, markdownIt} from 'mavon-editor'
import 'mavon-editor/dist/markdown/github-markdown.min.css'
import 'mavon-editor/dist/css/index.css'
import { message } from 'ant-design-vue';
export default {
components: {aceEditor, BranchesOutlined, mavonEditor, InfoCircleOutlined},
setup() {
props: {
doc: {
type: Object,
required: true
},
},
setup(props, {emit}) {
const store = useStore();
let docEdit = ref({});
let shareInstruction = ref('');
let editShareInstructionVisible = ref(false);
const handleNewDocOk = async () => {
watch(() => props.doc, () => {
editDoc();
});
const getDoc = () => {
if (!shareInstruction.value) {
message.error('请输入开放文档的说明');
return;
return false;
}
zyplayerApi.apiDocUpdate({id: docEdit.value.id, shareInstruction: shareInstruction.value}).then(res => {
editShareInstructionVisible.value = false;
message.success('保存成功！');
});
return {
id: docEdit.value.id,
shareInstruction: shareInstruction.value
};
};
const editDoc = async (id) => {
editShareInstructionVisible.value = true;
zyplayerApi.apiDocDetail({id: id}).then(res => {
docEdit.value = res.data;
shareInstruction.value = res.data.shareInstruction;
});
const editDoc = async () => {
docEdit.value = props.doc;
shareInstruction.value = props.doc.shareInstruction;
};
const addMarkdownImage = (pos, file) => {
};
@@ -56,12 +53,12 @@
return false;
};
onMounted(() => {
editDoc();
});
return {
editShareInstructionVisible,
docEdit,
shareInstruction,
handleNewDocOk,
getDoc,
editDoc,
imageFilter,
addMarkdownImage,
@@ -89,7 +86,7 @@
trash: true, // 清空
save: true, // 保存（触发events中的save事件）
/* 1.4.2 */
navigation: true, // 导航目录
navigation: false, // 导航目录
/* 2.1.8 */
alignleft: true, // 左对齐
aligncenter: true, // 居中