代码拆分,相关逻辑开发

This commit is contained in:
暮光:城中城
2023-07-04 20:15:32 +08:00
parent 86af800f13
commit 1dd7dd0975
14 changed files with 379 additions and 346 deletions

View File

@@ -31,13 +31,13 @@
</el-icon>
<template v-slot:dropdown>
<el-dropdown-menu>
<el-dropdown-item v-on:click="createWiki(1,true)">
<el-dropdown-item @click="createWiki(1,true)">
<el-icon class="clickAddIcon" style="margin-right: 5px">
<svg width="1em" height="1em" viewBox="0 0 48 48" fill="none"><rect x="6" y="6" width="36" height="36" rx="3" fill="none" stroke="currentColor" stroke-width="4"></rect><path d="M14 16L18 32L24 19L30 32L34 16" stroke="currentColor" stroke-width="4" stroke-linecap="round" stroke-linejoin="round"></path></svg>
</el-icon>
创建富文本
</el-dropdown-item>
<el-dropdown-item v-on:click="createWiki(2,true)">
<el-dropdown-item @click="createWiki(2,true)">
<el-icon class="clickAddIcon" style="margin-right: 5px"><el-icon-document/></el-icon>创建Markdown
</el-dropdown-item>
</el-dropdown-menu>
@@ -77,13 +77,13 @@
</el-icon>
<template v-slot:dropdown>
<el-dropdown-menu>
<el-dropdown-item v-on:click="createWiki(1)">
<el-dropdown-item @click="createWiki(1)">
<el-icon class="clickAddIcon" style="margin-right: 5px">
<svg width="1em" height="1em" viewBox="0 0 48 48" fill="none"><rect x="6" y="6" width="36" height="36" rx="3" fill="none" stroke="currentColor" stroke-width="4"></rect><path d="M14 16L18 32L24 19L30 32L34 16" stroke="currentColor" stroke-width="4" stroke-linecap="round" stroke-linejoin="round"></path></svg>
</el-icon>
创建富文本
</el-dropdown-item>
<el-dropdown-item v-on:click="createWiki(2)">
<el-dropdown-item @click="createWiki(2)">
<el-icon class="clickAddIcon" style="margin-right: 5px"><el-icon-document/></el-icon>创建Markdown
</el-dropdown-item>
</el-dropdown-menu>
@@ -119,7 +119,7 @@
</template>
<div style="margin-bottom: 10px">
<span style="font-size: 14px; font-weight: bold">通知</span>
<el-link v-if="haveNotReadUserMessage" :icon="ElIconCheck" style="float: right" type="primary" v-on:click="readAllUserMessage">本页标记已读</el-link>
<el-link v-if="haveNotReadUserMessage" :icon="ElIconCheck" style="float: right" type="primary" @click="readAllUserMessage">本页标记已读</el-link>
</div>
<div class="header-user-message">
<el-table :data="userMessageList" border max-height="500" size="small" style="width: 100%; margin-bottom: 5px">
@@ -129,7 +129,7 @@
<template v-slot="scope">
{{ scope.row.msgContent }}
<el-badge :is-dot="scope.row.msgStatus == 0" style="line-height: 10px; padding-right: 5px">
<el-link type="primary" v-on:click="showUserMessage(scope.row)">查看</el-link>
<el-link type="primary" @click="showUserMessage(scope.row)">查看</el-link>
</el-badge>
</template>
</el-table-column>
@@ -437,30 +437,29 @@ const spaceChangeEvents = (data) => {
}
const loadSpaceList = (spaceId) => {
pageApi.spaceList({}).then((json) => {
spaceList.value = json.data || []
let spaceOptionsNew = []
spaceList.value.forEach((item) =>
spaceOptionsNew.push({label: item.name, value: item.id})
)
spaceOptions.value = spaceOptionsNew
spaceList.value = json.data || [];
let spaceOptionsNew = [];
spaceList.value.forEach((item) => spaceOptionsNew.push({label: item.name, value: item.id}));
spaceOptions.value = spaceOptionsNew;
if (spaceList.value.length > 0) {
let nowSpaceId = spaceId
let nowSpaceShow = spaceList.value.find((item) => item.id == spaceId)
if (!nowSpaceShow) {
nowSpaceShow = spaceList.value[0]
nowSpaceId = nowSpaceShow.id
let nowSpaceId = spaceId;
let nowSpaceShowTemp = spaceList.value.find((item) => item.id === spaceId);
if (!nowSpaceShowTemp) {
nowSpaceShowTemp = spaceList.value[0];
nowSpaceId = nowSpaceShowTemp.id;
}
nowSpaceShow.value = nowSpaceShow
choiceSpace.value = nowSpaceId
nowPageId.value = ''
doGetPageList(null)
nowSpaceShow.value = nowSpaceShowTemp;
storePage.spaceInfo = nowSpaceShowTemp;
choiceSpace.value = nowSpaceId;
nowPageId.value = '';
doGetPageList(null);
// TODO 在首页时跳转
try {
if (route.path === '/home') {
router.push({path: '/home', query: {spaceId: nowSpaceId}})
router.push({path: '/home', query: {spaceId: nowSpaceId}});
}
} catch (e) {
console.log(e)
console.log(e);
}
}
})

View File

@@ -6,7 +6,7 @@
<div style="padding: 10px; box-sizing: border-box; background: #fafafa">
<el-input v-model="searchKeywords" @keyup.enter="searchByKeywords" placeholder="搜索文档" style="margin: 10px 0">
<template v-slot:append>
<el-button :icon="ElIconSearch" v-on:click="searchByKeywords"></el-button>
<el-button :icon="ElIconSearch" @click="searchByKeywords"></el-button>
</template>
</el-input>
<div class="wiki-page-tree-box">

View File

@@ -6,7 +6,7 @@ export const useStorePageData = defineStore('pageData', {
spaceInfo: {},
pageInfo: {},
pageAuth: {},
fileList: [],
}
},
});

View File

@@ -12,7 +12,7 @@
<span class="text-link">{{ item.spaceName }}</span>
</div>
<div class="page-preview-box">
<div class="page-preview-title" v-on:click="showPageDetail(item)" v-html="item.pageTitle"></div>
<div class="page-preview-title" @click="showPageDetail(item)" v-html="item.pageTitle"></div>
<div class="page-preview-content" v-html="item.previewContent"></div>
<div>
<span><img src="../../assets/img/zan.png" class="zan-img"/>{{ item.zanNum }} </span>

View File

@@ -7,9 +7,9 @@
<el-input v-if="wikiPageEdit.editorType===2" v-model="wikiPageEdit.pageTitle" :maxlength="40" placeholder="请输入标题" class="page-title-input" ></el-input>
</el-col>
<el-col :span="8" style="text-align: right;margin-top: 4px;">
<el-button type="primary" v-on:click="createWikiSave(1)" size="small" :icon="ElIconDocumentChecked">保存并查看</el-button>
<el-button type="success" v-on:click="createWikiSave(0)" size="small" :icon="ElIconCheck">仅保存</el-button>
<el-button v-on:click="createWikiCancel" size="small" :icon="ElIconBack" style="margin-right: 5px">取消</el-button>
<el-button type="primary" @click="createWikiSave(1)" size="small" :icon="ElIconDocumentChecked">保存并查看</el-button>
<el-button type="success" @click="createWikiSave(0)" size="small" :icon="ElIconCheck">仅保存</el-button>
<el-button @click="createWikiCancel" size="small" :icon="ElIconBack" style="margin-right: 5px">取消</el-button>
</el-col>
</el-row>
</div>

View File

@@ -18,7 +18,7 @@
<span class="text-link">{{ item.spaceName }}</span>
</div>
<div class="page-preview-box">
<div class="page-preview-title" v-on:click="showPageDetail(item)" v-html="item.pageTitle"></div>
<div class="page-preview-title" @click="showPageDetail(item)" v-html="item.pageTitle"></div>
<div class="page-preview-content" v-html="item.previewContent"></div>
<div>
<span><img src="../../assets/img/zan.png" class="zan-img"/>{{ item.zanNum }} </span>

View File

@@ -1,14 +1,14 @@
<template>
<div class="page-show-vue">
<el-row type="border-card" style="height: 100%">
<el-col :span="actionTabVisible ? 18 : 24" style="padding: 20px;border-right: 1px solid #f1f1f1;height: 100%;overflow: auto;">
<el-col :span="storePage.commentShow ? 18 : 24" style="padding: 20px;border-right: 1px solid #f1f1f1;height: 100%;overflow: auto;">
<el-row>
<el-col :span="navigationList.length > 0 ? 18 : 24">
<div style="max-width: 1000px; margin: 0 auto; padding-left: 10px">
<div class="wiki-title" ref="wikiTitleRef">{{ wikiPage.name }}</div>
<PageAction/>
<div class="wiki-files">
<el-table v-show="pageFileList.length > 0" :data="pageFileList" border style="width: 100%; margin-bottom: 5px">
<el-table v-show="storePage.fileList.length > 0" :data="storePage.fileList" border style="width: 100%; margin-bottom: 5px">
<el-table-column label="文件名" show-overflow-tooltip>
<template v-slot="scope">
<el-link target="_blank" :href="scope.row.fileUrl" type="primary">{{scope.row.fileName }}</el-link>
@@ -24,7 +24,7 @@
</el-table-column>
<el-table-column label="操作" width="90px" v-if="wikiPageAuth.canDeleteFile == 1">
<template v-slot="scope">
<el-button v-on:click="deletePageFile(scope.row)">删除</el-button>
<el-button @click="deletePageFile(scope.row)">删除</el-button>
</template>
</el-table-column>
</el-table>
@@ -35,17 +35,17 @@
</div>
<div style="margin-top: 40px; font-size: 14px">
<span style="vertical-align: top" class="is-link">
<span v-show="wikiPage.selfZan == 0" v-on:click="zanPage(1)"><img src="../../assets/img/zan.png" style="vertical-align: middle"/> </span>
<span v-show="wikiPage.selfZan == 1" v-on:click="zanPage(0)"><img src="../../assets/img/zan.png" style="vertical-align: middle; transform: rotateX(180deg)"/> </span>
<span v-show="wikiPage.selfZan == 0" @click="zanPage(1)"><img src="../../assets/img/zan.png" style="vertical-align: middle"/> </span>
<span v-show="wikiPage.selfZan == 1" @click="zanPage(0)"><img src="../../assets/img/zan.png" style="vertical-align: middle; transform: rotateX(180deg)"/> </span>
</span>
<span style="margin-left: 10px; vertical-align: top">
<span v-if="wikiPage.selfZan == 0 && wikiPage.zanNum <= 0">成为第一个赞同者</span>
<span v-else-if="wikiPage.selfZan == 0 && wikiPage.zanNum > 0">
<span class="is-link" v-on:click="showZanPageUser">{{ wikiPage.zanNum }}</span>赞了它
<span class="is-link" @click="showZanPageUser">{{ wikiPage.zanNum }}</span>赞了它
</span>
<span v-else-if="wikiPage.selfZan == 1 && wikiPage.zanNum <= 1">我赞了它</span>
<span v-else-if="wikiPage.selfZan == 1 && wikiPage.zanNum > 1">
<span class="is-link" v-on:click="showZanPageUser">我和{{ wikiPage.zanNum - 1 }}个其他人</span>赞了它
<span class="is-link" @click="showZanPageUser">我和{{ wikiPage.zanNum - 1 }}个其他人</span>赞了它
</span>
</span>
<span style="margin-left: 10px">
@@ -55,15 +55,15 @@
</div>
</el-col>
<el-col :span="navigationList.length > 0 ? 6 : 0" v-if="navigationList.length > 0">
<Navigation ref="navigationRef" :heading="navigationList"></Navigation>
<Navigation :heading="navigationList"></Navigation>
</el-col>
</el-row>
</el-col>
<el-col :span="6" style="height: 100%" v-show="actionTabVisible">
<el-col :span="6" style="height: 100%" v-show="storePage.commentShow">
<el-icon @click="closeActionTab" class="close-action-tab">
<el-icon-close/>
</el-icon>
<el-tabs v-model="actionTabActiveName" @tab-click="actionTabClick">
<el-tabs v-model="storePage.commentActiveTab">
<el-tab-pane label="评论" name="comment">
<Comment/>
</el-tab-pane>
@@ -88,16 +88,6 @@
</el-tabs>
</el-col>
</el-row>
<!--手机扫码查看弹窗-->
<el-dialog title="手机扫码查看" v-model="mobileScanDialogVisible" width="400px">
<div style="text-align: center">
<div class="mobile-qr">
<canvas ref="qrCodeDivRef"></canvas>
</div>
<div>使用微信或手机浏览器扫一扫查看</div>
<div> <a target="_blank" :href="qrCodeUrl">直接访问</a></div>
</div>
</el-dialog>
<!--点赞人员弹窗-->
<el-dialog title="赞了它的人" v-model="zanUserDialogVisible" width="600px">
<el-table :data="zanUserList" border :show-header="false" style="width: 100%; margin-bottom: 5px">
@@ -105,36 +95,6 @@
<el-table-column prop="createTime" label="时间"></el-table-column>
</el-table>
</el-dialog>
<!--人员权限弹窗-->
<el-dialog title="页面权限" v-model="pageAuthDialogVisible" width="900px">
<el-row>
<el-select v-model="pageAuthNewUser" filterable remote reserve-keyword autoComplete="new-password" placeholder="请输入名字、邮箱、账号搜索用户" :remote-method="getSearchUserList" :loading="pageAuthUserLoading" style="width: 750px; margin-right: 10px">
<el-option v-for="item in searchUserList" :key="item.id" :label="item.userName" :value="item.id"></el-option>
</el-select>
<el-button v-on:click="addPageAuthUser">添加</el-button>
</el-row>
<el-table :data="pageAuthUserList" border style="width: 100%; margin: 10px 0">
<el-table-column prop="userName" label="用户" width="150"></el-table-column>
<el-table-column label="权限">
<template v-slot="scope">
<el-checkbox :true-label="1" :false-label="0" v-model="scope.row.editPage">编辑</el-checkbox>
<!-- <el-checkbox :true-label="1" :false-label="0" v-model="scope.row.commentPage">评论</el-checkbox>-->
<el-checkbox :true-label="1" :false-label="0" v-model="scope.row.deletePage">删除</el-checkbox>
<el-checkbox :true-label="1" :false-label="0" v-model="scope.row.pageFileUpload">文件上传</el-checkbox>
<el-checkbox :true-label="1" :false-label="0" v-model="scope.row.pageFileDelete">文件删除</el-checkbox>
<el-checkbox :true-label="1" :false-label="0" v-model="scope.row.pageAuthManage">权限管理</el-checkbox>
</template>
</el-table-column>
<el-table-column label="操作" width="80">
<template v-slot="scope">
<el-button size="small" type="danger" plain v-on:click="deleteUserPageAuth(scope.row)">删除</el-button>
</template>
</el-table-column>
</el-table>
<div>
<el-button type="primary" v-on:click="saveUserPageAuth">保存配置</el-button>
</div>
</el-dialog>
<el-image-viewer
v-if="showImagePreview"
:url-list="showImagePreviewList"
@@ -142,9 +102,6 @@
@close="closeImagePreview"
hide-on-click-modal
/>
<form method="post" ref="downloadFormRef" :action="downloadFormParam.url" target="_blank">
<input type="hidden" :name="key" :value="val" v-for="(val, key) in downloadFormParam.param"/>
</form>
</div>
</template>
@@ -191,7 +148,6 @@ let page = {
let wikiPage = ref({});
let wikiPageAuth = ref({});
let pageContent = ref({});
let pageFileList = ref([]);
let selfUserId = ref(0);
let uploadFileList = ref([]);
let uploadFormData = ref({pageId: 0});
@@ -209,8 +165,6 @@ let searchUserList = ref([]);
let pageAuthNewUser = ref('');
let pageAuthUserLoading = ref(false);
// 右侧标签页
let actionTabVisible = ref(false);
let actionTabActiveName = ref('comment');
let pageHistoryDetail = ref('');
let pageShowDetail = ref('');
let pageHistoryChoice = ref({});
@@ -259,61 +213,6 @@ const getSearchUserList = (query) => {
pageAuthUserLoading.value = false
})
}
const handleMoreCommand = (val) => {
if (val == 'editAuth') {
editWikiAuth()
} else if (val == 'deletePage') {
deleteWikiPage()
} else if (val == 'showPageHistory') {
showPageHistory()
} else if (val == 'showOpenPage') {
showOpenPage()
} else if (val == 'showMobileView') {
showMobileView()
} else if (val == 'exportWord') {
exportWord()
}
}
let downloadFormRef = ref();
const exportWord = () => {
downloadFormParam.value.param = {
pageId: wikiPage.value.id,
}
setTimeout(() => downloadFormRef.value.submit(), 0)
}
const showOpenPage = () => {
if (props.spaceInfo.openDoc !== 1) {
ElMessage.warning('该空间未开放,无法查看开放文档地址')
} else {
let routeUrl = router.resolve({
path: '/page/share/view',
query: {pageId: wikiPage.value.id, space: props.spaceInfo.uuid}
})
window.open(routeUrl.href, '_blank')
}
}
let qrCodeDivRef = ref();
const showMobileView = () => {
if (props.spaceInfo.openDoc !== 1) {
ElMessage.warning('该空间未开放,无法查看开放文档地址')
} else {
let routeUrl = router.resolve({
path: '/page/share/mobile/view',
query: {pageId: wikiPage.value.id, space: props.spaceInfo.uuid}
})
mobileScanDialogVisible.value = true
let hostPath = window.location.href.split('#')[0]
setTimeout(() => {
qrCodeUrl.value = hostPath + routeUrl.href
QRCode.toCanvas(qrCodeDivRef.value, qrCodeUrl.value, {
scale: 5, height: 250, wight: 250,
}, (error) => {
if (error) console.error(error)
}
)
}, 0)
}
}
const addPageAuthUser = () => {
if (pageAuthNewUser.value.length <= 0) {
ElMessage.warning('请先选择用户')
@@ -346,15 +245,6 @@ const addPageAuthUser = () => {
})
pageAuthNewUser.value = ''
}
const editWikiAuth = () => {
pageAuthNewUser.value = []
pageAuthUserList.value = []
let param = {pageId: wikiPage.value.id}
pageApi.getPageUserAuthList(param).then((json) => {
pageAuthUserList.value = json.data || []
pageAuthDialogVisible.value = true
})
}
const saveUserPageAuth = () => {
let param = {
pageId: wikiPage.value.id,
@@ -368,132 +258,82 @@ const notOpen = () => {
ElMessage.warning('暂未开放')
}
const deleteUserPageAuth = (row) => {
let pageAuthUserList = []
let pageAuthUserList = [];
for (let i = 0; i < pageAuthUserList.value.length; i++) {
let item = pageAuthUserList.value[i]
if (item.userId != row.userId) {
pageAuthUserList.push(pageAuthUserList.value[i])
let item = pageAuthUserList.value[i];
if (item.userId !== row.userId) {
pageAuthUserList.push(pageAuthUserList.value[i]);
}
}
pageAuthUserList.value = pageAuthUserList
}
const deleteWikiPage = () => {
ElMessageBox.confirm('确定要删除此页面及其所有子页面吗?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning',
})
.then(() => {
let param = {pageId: wikiPage.value.id}
pageApi.pageDelete(param).then(() => {
// 重新加载左侧列表,跳转到展示页面
emit('loadPageList');
router.push({
path: '/home',
query: {spaceId: wikiPage.value.spaceId}
})
})
})
.catch(() => {
})
}
const actionTabClick = (tab) => {
if (tab.name === 'comment') {
showCommentWiki()
} else if (tab.name === 'history') {
showPageHistory()
}
pageAuthUserList.value = pageAuthUserList;
}
const closeActionTab = () => {
actionTabVisible.value = false
clearHistory()
computeNavigationWidth()
}
const showCommentWiki = () => {
actionTabVisible.value = true
actionTabActiveName.value = 'comment'
computeNavigationWidth()
}
const showPageHistory = () => {
actionTabVisible.value = true
actionTabActiveName.value = 'history'
clearHistory()
computeNavigationWidth()
}
let navigationRef = ref();
const computeNavigationWidth = () => {
setTimeout(() => {
if (navigationRef.value) {
navigationRef.value.computeNavigationWidth()
}
}, 100)
storePage.commentShow = false;
clearHistory();
}
const getPageHistoryByScroll = () => {
if (pageHistoryPageNum.value <= 0) {
return
return;
}
pageHistoryPageNum.value++
getPageHistory(wikiPage.value.id, pageHistoryPageNum.value)
pageHistoryPageNum.value++;
getPageHistory(wikiPage.value.id, pageHistoryPageNum.value);
}
const getPageHistory = (pageId, pageNum) => {
if (pageNum == 1) {
pageHistoryList.value = []
pageHistoryPageNum.value = 1
if (pageNum === 1) {
pageHistoryList.value = [];
pageHistoryPageNum.value = 1;
}
let param = {pageId: pageId, pageNum: pageNum}
let param = {pageId: pageId, pageNum: pageNum};
pageApi.pageHistoryList(param).then((json) => {
let historyList = json.data || []
let historyList = json.data || [];
if (historyList.length <= 0) {
pageHistoryPageNum.value = 0
pageHistoryPageNum.value = 0;
} else {
historyList.forEach((item) => (item.loading = 0))
pageHistoryList.value = pageHistoryList.value.concat(historyList)
historyList.forEach((item) => (item.loading = 0));
pageHistoryList.value = pageHistoryList.value.concat(historyList);
}
})
}
const historyClick = (history) => {
if (pageHistoryChoice.value.id === history.id && !!pageHistoryDetail.value) {
return
return;
}
pageHistoryChoice.value.loading = 0
pageHistoryChoice.value = history
pageHistoryChoice.value.loading = 0;
pageHistoryChoice.value = history;
// 缓存一下,但如果历史页面多了而且很大就占内存,也可以每次去拉取,先这样吧
if (history.content) {
history.loading = 2
pageHistoryDetail.value = history.content
pageShowDetail.value = history.content
history.loading = 2;
pageHistoryDetail.value = history.content;
pageShowDetail.value = history.content;
setTimeout(() => {
previewPageImage()
createNavigationHeading()
previewPageImage();
createNavigationHeading();
}, 500)
} else {
history.loading = 1
pageApi
.pageHistoryDetail({id: history.id})
.then((json) => {
history.loading = 2
history.content = json.data || '--'
if (wikiPage.value.editorType === 2) {
history.content = mavonEditor.getMarkdownIt().render(history.content)
}
pageHistoryDetail.value = history.content
pageShowDetail.value = history.content
setTimeout(() => {
previewPageImage()
createNavigationHeading()
}, 500)
})
.catch(() => {
history.loading = 3
})
pageApi.pageHistoryDetail({id: history.id}).then((json) => {
history.loading = 2;
history.content = json.data || '--';
if (wikiPage.value.editorType === 2) {
history.content = mavonEditor.getMarkdownIt().render(history.content);
}
pageHistoryDetail.value = history.content;
pageShowDetail.value = history.content;
setTimeout(() => {
previewPageImage();
createNavigationHeading();
}, 500);
}).catch(() => {
history.loading = 3;
});
}
}
const clearHistory = () => {
pageHistoryChoice.value.loading = 0
pageHistoryDetail.value = ''
pageHistoryChoice.value = {}
pageHistoryList.value.forEach((item) => (item.loading = 0))
pageShowDetail.value = pageContent.value.content
pageHistoryChoice.value.loading = 0;
pageHistoryDetail.value = '';
pageHistoryChoice.value = {};
pageHistoryList.value.forEach((item) => (item.loading = 0));
pageShowDetail.value = pageContent.value.content;
}
const computeFileSize = (fileSize) => {
return unitUtil.computeFileSize(fileSize)
@@ -501,14 +341,14 @@ const computeFileSize = (fileSize) => {
const loadPageDetail = (pageId) => {
clearHistory()
pageApi.pageDetail({id: pageId}).then((json) => {
let result = json.data || {}
let wikiPageRes = result.wikiPage || {}
wikiPageRes.selfZan = result.selfZan || 0
wikiPage.value = wikiPageRes
pageContent.value = result.pageContent || {}
pageFileList.value = result.fileList || []
selfUserId.value = result.selfUserId || 0
uploadFormData.value = {pageId: wikiPage.value.id}
let result = json.data || {};
let wikiPageRes = result.wikiPage || {};
wikiPageRes.selfZan = result.selfZan || 0;
wikiPage.value = wikiPageRes;
pageContent.value = result.pageContent || {};
storePage.fileList = result.fileList || [];
selfUserId.value = result.selfUserId || 0;
uploadFormData.value = {pageId: wikiPage.value.id};
wikiPageAuth.value = {
canEdit: result.canEdit,
canDelete: result.canDelete,
@@ -584,17 +424,6 @@ const showZanPageUser = () => {
zanUserList.value = json.data
})
}
const uploadFileError = (err) => {
ElMessage.error('上传失败,' + err)
}
const uploadFileSuccess = (response) => {
if (response.errCode == 200) {
pageFileList.value.push(response.data)
ElMessage.success('上传成功!')
} else {
ElMessage('上传失败:' + (response.errMsg || '未知错误'))
}
}
const deletePageFile = (row) => {
ElMessageBox.confirm('确定要删除此文件吗?', '提示', {
confirmButtonText: '确定',
@@ -603,7 +432,7 @@ const deletePageFile = (row) => {
}).then(() => {
let param = {id: row.id};
pageApi.deletePageFile(param).then(() => {
pageFileList.value = pageFileList.value.filter(item => item.id !== row.id);
storePage.fileList = storePage.fileList.filter(item => item.id !== row.id);
});
})
}

View File

@@ -21,7 +21,9 @@ import {
defineExpose,
} from 'vue'
import {useStoreDisplay} from '@/store/wikiDisplay.js'
import {useStorePageData} from "@/store/pageData";
let storePage = useStorePageData();
const storeDisplay = useStoreDisplay()
let navigationWidth = ref('100px')
const props = defineProps({
@@ -32,19 +34,22 @@ const props = defineProps({
})
onMounted(() => {
window.onresize = () => {
computeNavigationWidth()
computeNavigationWidth();
}
setTimeout(() => computeNavigationWidth(), 100)
setTimeout(() => computeNavigationWidth(), 100);
})
watch(() => storeDisplay.viewMenuWidth, (newVal) => {
computeNavigationWidth()
computeNavigationWidth();
})
watch(() => storePage.commentShow, (newVal) => {
computeNavigationWidth();
})
let navigationRef = ref();
const computeNavigationWidth = () => {
navigationWidth.value = window.getComputedStyle(
navigationRef.value,
null
).width
).width;
}
const headingItemClick = (item) => {
// 滚动到指定节点
@@ -52,7 +57,7 @@ const headingItemClick = (item) => {
behavior: 'smooth',
block: 'start',
inline: 'nearest',
})
});
// 距离顶部高度
//console.log(item.node.offsetTop - item.node.scrollHeight)
}

View File

@@ -8,7 +8,7 @@
<span class="text-link">{{ item.spaceName }}</span>
</div>
<div class="page-preview-box">
<div class="page-preview-title" v-on:click="showPageDetail(item)" v-html="item.pageTitle"></div>
<div class="page-preview-title" @click="showPageDetail(item)" v-html="item.pageTitle"></div>
<div class="page-preview-content" v-html="item.previewContent"></div>
<div>
<span><img src="../../../../assets/img/zan.png" class="zan-img"/>{{ item.zanNum }} </span>

View File

@@ -31,7 +31,7 @@
</div>
<div class="comment-input-box">
<textarea rows="5" placeholder="发表评论" v-model="commentTextInput" :maxlength="500"></textarea>
<el-button style="float: right; margin: 2px 5px" type="primary" size="small" v-on:click="submitPageComment">发送</el-button>
<el-button style="float: right; margin: 2px 5px" type="primary" size="small" @click="submitPageComment">发送</el-button>
</div>
</template>

View File

@@ -0,0 +1,74 @@
<template>
<!--手机扫码查看弹窗-->
<el-dialog title="手机扫码查看" v-model="dataItemEditVisible" width="400px">
<div style="text-align: center">
<div class="mobile-qr">
<canvas ref="qrCodeDivRef"></canvas>
</div>
<div>使用微信或手机浏览器扫一扫查看</div>
<div> <a target="_blank" :href="qrCodeUrl">直接访问</a></div>
</div>
</el-dialog>
</template>
<script setup>
import {
Search as ElIconSearch,
} from '@element-plus/icons-vue'
import {markRaw} from 'vue'
import {toRefs, ref, reactive, onMounted, onBeforeUnmount, defineProps, watch, defineEmits, computed, defineExpose} from 'vue';
import {useRouter, useRoute} from "vue-router";
import {ElMessageBox, ElMessage, ElLoading, ElNotification} from 'element-plus'
import pageApi from "@/assets/api/page";
import {useStorePageData} from "@/store/pageData";
import userApi from "@/assets/api/user";
import QRCode from 'qrcode'
let storePage = useStorePageData();
const route = useRoute();
const router = useRouter();
const props = defineProps({
visible: Boolean,
data: Object,
});
let dataItemEditVisible = ref(false);
const emit = defineEmits(['update:visible', 'ok']);
watch(dataItemEditVisible, () => {
emit('update:visible', dataItemEditVisible.value);
});
watch(() => props.visible, () => {
dataItemEditVisible.value = props.visible;
initMobileQrScan();
});
onMounted(() => {
dataItemEditVisible.value = props.visible;
initMobileQrScan();
});
let qrCodeUrl = ref('');
let qrCodeDivRef = ref();
const initMobileQrScan = () => {
if (!dataItemEditVisible.value) return;
let routeUrl = router.resolve({
path: '/page/share/mobile/view',
query: {pageId: storePage.pageInfo.id, space: storePage.spaceInfo.uuid}
});
let hostPath = window.location.href.split('#')[0];
setTimeout(() => {
qrCodeUrl.value = hostPath + routeUrl.href
QRCode.toCanvas(qrCodeDivRef.value, qrCodeUrl.value, {
scale: 5, height: 250, wight: 250,
}, (error) => {
if (error) console.error(error);
}
)
}, 0);
}
</script>
<style lang="scss">
.page-auth-dialog {
}
</style>

View File

@@ -20,6 +20,7 @@
<el-upload v-if="storePage.pageAuth.canUploadFile === 1"
:on-success="uploadFileSuccess"
:on-error="uploadFileError"
:before-upload="beforeUpload"
:action="uploadFileUrl"
:data="uploadFormData"
:with-credentials="true" class="action-btn upload-page-file" name="files"
@@ -42,6 +43,11 @@
</template>
</el-dropdown>
</el-col>
<MobileQrScanDialog v-model:visible="mobileScanDialogVisible"/>
<PageAuthDialog v-model:visible="pageAuthDialogVisible"/>
<form method="post" ref="downloadFormRef" :action="downloadFormParam.url" target="_blank">
<input type="hidden" :name="key" :value="val" v-for="(val, key) in downloadFormParam.param"/>
</form>
</el-row>
</template>
@@ -67,10 +73,11 @@ import {toRefs, ref, reactive, onMounted, watch, defineProps, defineEmits, defin
import {onBeforeRouteUpdate, useRoute, useRouter} from "vue-router";
import { ElMessageBox, ElMessage, ElNotification } from 'element-plus';
import pageApi from '@/assets/api/page'
import PageAuthDialog from './PageAuthDialog.vue'
import MobileQrScanDialog from './MobileQrScanDialog.vue'
import {useStorePageData} from "@/store/pageData";
let storePage = useStorePageData();
let router = useRouter();
const editWiki = () => {
// 锁定页面并进入编辑页面
@@ -82,93 +89,72 @@ const editWiki = () => {
const showCommentWiki = () => {
storePage.commentShow = true;
storePage.commentActiveTab = 'comment';
// computeNavigationWidth();
}
let pageAuthDialogVisible = ref(false);
const editWikiAuth = () => {
// pageAuthNewUser.value = [];
// pageAuthUserList.value = [];
// let param = {pageId: wikiPage.value.id};
// pageApi.getPageUserAuthList(param).then((json) => {
// pageAuthUserList.value = json.data || [];
// pageAuthDialogVisible.value = true;
// });
pageAuthDialogVisible.value = true;
}
const showPageHistory = () => {
// actionTabVisible.value = true;
// actionTabActiveName.value = 'history';
// clearHistory();
// computeNavigationWidth();
storePage.commentShow = true;
storePage.commentActiveTab = 'history';
}
const showOpenPage = () => {
// if (props.spaceInfo.openDoc !== 1) {
// ElMessage.warning('该空间未开放,无法查看开放文档地址')
// } else {
// let routeUrl = router.resolve({
// path: '/page/share/view',
// query: {pageId: wikiPage.value.id, space: props.spaceInfo.uuid}
// })
// window.open(routeUrl.href, '_blank')
// }
if (storePage.spaceInfo.openDoc !== 1) {
ElMessage.warning('该空间未开放,无法查看开放文档地址');
} else {
let routeUrl = router.resolve({
path: '/page/share/view',
query: {pageId: storePage.pageInfo.id, space: storePage.spaceInfo.uuid}
});
window.open(routeUrl.href, '_blank');
}
}
const deleteWikiPage = () => {
// ElMessageBox.confirm('确定要删除此页面及其所有子页面吗?', '提示', {
// confirmButtonText: '确定',
// cancelButtonText: '取消',
// type: 'warning',
// }).then(() => {
// let param = {pageId: wikiPage.value.id};
// pageApi.pageDelete(param).then(() => {
// // 重新加载左侧列表,跳转到展示页面
// emit('loadPageList');
// router.push({
// path: '/home',
// query: {spaceId: wikiPage.value.spaceId}
// });
// });
// }).catch(() => {});
ElMessageBox.confirm('确定要删除此页面及其所有子页面吗?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning',
}).then(() => {
let param = {pageId: storePage.pageInfo.id};
pageApi.pageDelete(param).then(() => {
// 重新加载左侧列表,跳转到展示页面
// emit('loadPageList'); TODO
router.push({path: '/home', query: {spaceId: storePage.pageInfo.spaceId}});
});
}).catch(() => {});
}
// 下载为Word
let downloadFormRef = ref();
let downloadFormParam = ref({url: 'zyplayer-doc-wiki/page/download', param: {}});
const exportWord = () => {
// downloadFormParam.value.param = {
// pageId: wikiPage.value.id,
// }
// setTimeout(() => downloadFormRef.value.submit(), 0)
downloadFormParam.value.param = {pageId: storePage.pageInfo.id};
setTimeout(() => downloadFormRef.value.submit(), 0);
}
let qrCodeDivRef = ref();
// 手机扫码
let mobileScanDialogVisible = ref(false);
const showMobileView = () => {
// if (props.spaceInfo.openDoc !== 1) {
// ElMessage.warning('该空间未开放,无法查看开放文档地址')
// } else {
// let routeUrl = router.resolve({
// path: '/page/share/mobile/view',
// query: {pageId: wikiPage.value.id, space: props.spaceInfo.uuid}
// })
// mobileScanDialogVisible.value = true
// let hostPath = window.location.href.split('#')[0]
// setTimeout(() => {
// qrCodeUrl.value = hostPath + routeUrl.href
// QRCode.toCanvas(qrCodeDivRef.value, qrCodeUrl.value, {
// scale: 5, height: 250, wight: 250,
// }, (error) => {
// if (error) console.error(error)
// }
// )
// }, 0)
// }
if (storePage.spaceInfo.openDoc !== 1) {
ElMessage.warning('该空间未开放,无法查看开放文档地址');
} else {
mobileScanDialogVisible.value = true;
}
}
// 上传相关
let uploadFormData = ref({pageId: 0});
let uploadFileUrl = ref(import.meta.env.VITE_APP_BASE_API + '/zyplayer-doc-wiki/page/file/upload');
const beforeUpload = () => {
uploadFormData.value.pageId = storePage.pageInfo.id;
}
const uploadFileError = (err) => {
ElMessage.error('上传失败,' + err);
}
const uploadFileSuccess = (response) => {
// if (response.errCode === 200) {
// pageFileList.value.push(response.data);
// ElMessage.success('上传成功!');
// } else {
// ElMessage('上传失败:' + (response.errMsg || '未知错误'));
// }
if (response.errCode === 200) {
storePage.fileList.push(response.data);
ElMessage.success('上传成功!');
} else {
ElMessage('上传失败:' + (response.errMsg || '未知错误'));
}
}
</script>

View File

@@ -0,0 +1,140 @@
<template>
<!--人员权限弹窗-->
<el-dialog title="页面权限" v-model="dataItemEditVisible" width="800px" class="page-auth-dialog">
<el-row>
<el-select v-model="pageAuthNewUser" filterable remote reserve-keyword autoComplete="new-password" placeholder="请输入名字、邮箱、账号搜索用户" :remote-method="getSearchUserList" :loading="pageAuthUserLoading" style="width: 690px; margin-right: 10px">
<el-option v-for="item in searchUserList" :key="item.id" :label="item.userName" :value="item.id"></el-option>
</el-select>
<el-button @click="addPageAuthUser">添加</el-button>
</el-row>
<el-table :data="pageAuthUserList" border style="width: 100%; margin: 10px 0">
<el-table-column prop="userName" label="用户" width="150"></el-table-column>
<el-table-column label="权限">
<template v-slot="scope">
<el-checkbox :true-label="1" :false-label="0" v-model="scope.row.editPage">编辑</el-checkbox>
<el-checkbox :true-label="1" :false-label="0" v-model="scope.row.deletePage">删除</el-checkbox>
<el-checkbox :true-label="1" :false-label="0" v-model="scope.row.pageFileUpload">文件上传</el-checkbox>
<el-checkbox :true-label="1" :false-label="0" v-model="scope.row.pageFileDelete">文件删除</el-checkbox>
<el-checkbox :true-label="1" :false-label="0" v-model="scope.row.pageAuthManage">权限管理</el-checkbox>
</template>
</el-table-column>
<el-table-column label="操作" width="80">
<template v-slot="scope">
<el-button size="small" type="danger" plain @click="deleteUserPageAuth(scope.row)">删除</el-button>
</template>
</el-table-column>
</el-table>
<template #footer>
<el-button @click="cancelAuth">取消</el-button>
<el-button type="primary" @click="saveUserPageAuth">保存配置</el-button>
</template>
</el-dialog>
</template>
<script setup>
import {
Search as ElIconSearch,
} from '@element-plus/icons-vue'
import {markRaw} from 'vue'
import {toRefs, ref, reactive, onMounted, onBeforeUnmount, defineProps, watch, defineEmits, computed, defineExpose} from 'vue';
import {useRouter, useRoute} from "vue-router";
import {ElMessageBox, ElMessage, ElLoading, ElNotification} from 'element-plus'
import pageApi from "@/assets/api/page";
import {useStorePageData} from "@/store/pageData";
import userApi from "@/assets/api/user";
let storePage = useStorePageData();
const route = useRoute();
const router = useRouter();
const props = defineProps({
visible: Boolean,
data: Object,
});
let dataItemEditVisible = ref(false);
const emit = defineEmits(['update:visible', 'ok']);
watch(dataItemEditVisible, () => {
emit('update:visible', dataItemEditVisible.value);
});
watch(() => props.visible, () => {
dataItemEditVisible.value = props.visible;
initPageAuth();
});
onMounted(() => {
dataItemEditVisible.value = props.visible;
initPageAuth();
});
// 页面权限
let pageAuthUserList = ref([]);
let searchUserList = ref([]);
let pageAuthNewUser = ref();
let pageAuthUserLoading = ref(false);
const initPageAuth = () => {
if (!dataItemEditVisible.value) return;
pageAuthNewUser.value = '';
pageAuthUserList.value = [];
let param = {pageId: storePage.pageInfo.id};
pageApi.getPageUserAuthList(param).then((json) => {
pageAuthUserList.value = json.data || [];
});
}
const addPageAuthUser = () => {
if (!pageAuthNewUser.value) {
ElMessage.warning('请先选择用户');
return;
}
// 已添加过的用户不再添加
if (pageAuthUserList.value.find((item) => item.userId === pageAuthNewUser.value)) {
pageAuthNewUser.value = undefined;
return;
}
// 获取用户
let findUser = searchUserList.value.find((item) => item.id === pageAuthNewUser.value);
if (findUser) {
return;
}
// 添加用户
pageAuthUserList.value.push({
userId: findUser.id,
userName: findUser.userName,
editPage: 0,
commentPage: 0,
deletePage: 0,
pageFileUpload: 0,
pageFileDelete: 0,
pageAuthManage: 0,
})
pageAuthNewUser.value = '';
}
const getSearchUserList = (query) => {
if (!query) return;
pageAuthUserLoading.value = true;
userApi.getUserBaseInfo({search: query}).then((json) => {
searchUserList.value = json.data || [];
pageAuthUserLoading.value = false;
});
}
const saveUserPageAuth = () => {
let param = {
pageId: storePage.pageInfo.id,
authList: JSON.stringify(pageAuthUserList.value),
}
pageApi.assignPageUserAuth(param).then(() => {
ElMessage.success('保存成功!');
});
}
const cancelAuth = () => {
dataItemEditVisible.value = false;
}
const deleteUserPageAuth = (row) => {
pageAuthUserList.value = pageAuthUserList.value.filter((item) => item.userId !== row.userId);
}
</script>
<style lang="scss">
.page-auth-dialog {
}
</style>

View File

@@ -41,9 +41,9 @@
<el-table-column label="操作" width="220">
<template v-slot="scope">
<template v-if="userSelfInfo.id == scope.row.createUserId">
<el-button size="small" type="primary" v-on:click="editSpaceInfo(scope.row)">编辑</el-button>
<el-button size="small" type="warning" v-on:click="editSpaceAuth(scope.row)">授权</el-button>
<el-button size="small" type="danger" v-on:click="deleteSpaceInfo(scope.row)">删除</el-button>
<el-button size="small" type="primary" @click="editSpaceInfo(scope.row)">编辑</el-button>
<el-button size="small" type="warning" @click="editSpaceAuth(scope.row)">授权</el-button>
<el-button size="small" type="danger" @click="deleteSpaceInfo(scope.row)">删除</el-button>
</template>
</template>
</el-table-column>
@@ -66,7 +66,7 @@
<el-select v-model="spaceAuthNewGroupId" filterable placeholder="请选择分组" style="width: 750px; margin-right: 10px">
<el-option v-for="item in searchGroupList" :key="item.id" :label="searchGroupMap[item.id]" :value="item.id"></el-option>
</el-select>
<el-button v-on:click="addSpaceAuthUserGroup">添加</el-button>
<el-button @click="addSpaceAuthUserGroup">添加</el-button>
</el-row>
<el-table :data="spaceAuthGroupList" border style="width: 100%; margin: 10px 0">
<el-table-column prop="groupId" label="分组名" width="150">
@@ -88,8 +88,8 @@
</el-table-column>
</el-table>
<div style="text-align: right">
<el-button v-on:click="manageUserGroup">分组管理</el-button>
<el-button type="primary" v-on:click="saveGroupSpaceAuth">保存配置</el-button>
<el-button @click="manageUserGroup">分组管理</el-button>
<el-button type="primary" @click="saveGroupSpaceAuth">保存配置</el-button>
</div>
</el-dialog>
<create-space ref="createSpaceRef" @success="loadSpaceList"></create-space>