Skip to content

A
apaas-ui
Commit 7be22da7 authored by 徐一鸣's avatar 徐一鸣
Browse files
Options

sdk中心

parent f4278363
Show whitespace changes
Inline Side-by-side
Showing with 1172 additions and 211 deletions
src/components/doc-width-nav.vue 0 → 100644
View file @ 7be22da7
<template>
<div class="doc_width_nav">
<div class="part doc_part">
<h3 class="part_title">
<span>{{ title || "-" }}</span>
<span>更新时间：{{ time || "-" }}</span>
</h3>
<div
class="part_content doc_content apaas_scroll"
v-html="content"
ref="docContent"
></div>
</div>
<div class="part nav_part">
<h3 class="part_title">
<span>导航</span>
</h3>
<ul class="part_content nav_content apaas_scroll">
<li
v-for="(item, index) in navTree"
:class="[
'text_clip',
'level_' + item.level,
item.id === curNav ? ' current' : '',
]"
:key="index"
>
<a v-text="item.title" @click="clickNav(item)"></a>
</li>
</ul>
</div>
</div>
</template>
<script>
export default {
props: {
richText: {
type: String,
defalut: "",
},
title: {
type: String,
defalut: "",
},
time: {
type: String,
defalut: "",
},
},
data() {
return {
content: "",
navTree: [],
curNav: "",
};
},
watch: {
richText() {
this.translate();
},
},
mounted() {
this.translate();
},
methods: {
translate() {
let content = this.richText;
let titles =
content.match(
/<h1(([\s\S])*?)<\/h1>|<h2(([\s\S])*?)<\/h2>|<h3(([\s\S])*?)<\/h3>/g
) || [];
let time = new Date().getTime();
let pre_h1_index = 0;
let pre_h2_index = 0;
let pre_h3_index = 0;
let newTitles = titles
.map((title, index) => {
let newTitle = title;
let level = 0;
let id = "";
if (title.match(/<h1(([\s\S])*?)<\/h1>/g)) {
pre_h1_index++;
pre_h2_index = 0;
pre_h3_index = 0;
level = 1;
id = `nav_${pre_h1_index}` + "_" + time;
newTitle = title.replace(/<h1/g, `<h1 id="${id}"`);
} else if (title.match(/<h2(([\s\S])*?)<\/h2>/g)) {
pre_h2_index++;
pre_h3_index = 0;
level = 2;
id = `nav_${pre_h1_index}_${pre_h2_index}` + "_" + time;
newTitle = title.replace(/<h2/g, `<h2 id="${id}"`);
} else if (title.match(/<h3(([\s\S])*?)<\/h3>/g)) {
pre_h3_index++;
level = 3;
id = `nav_${pre_h1_index}_${pre_h2_index}_${pre_h3_index}`;
newTitle = title.replace(/<h3/g, `<h3 id="${id}"`) + "_" + time;
}
content = content.replace(new RegExp(title), newTitle);
return {
level,
id,
title: title.replace(/<\/?.+?>/g, ""),
};
})
.filter((item) => item.title);
this.content = content;
this.navTree = newTitles;
this.curNav = (newTitles[0] && newTitles[0].id) || "";
},
clickNav(item) {
let target = document.querySelector(`#${item.id}`);
this.setScroll(target, this.$refs.docContent);
this.curNav = item.id;
},
setScroll(el, parentEl) {
let actualTop = el.offsetTop;
let current = el.offsetParent;
while (current !== null) {
actualTop += current.offsetTop;
current = current.offsetParent;
}
parentEl.scrollTop = actualTop - parentEl.offsetTop;
},
},
};
</script>
<style scoped>
.doc_width_nav {
display: flex;
justify-content: flex-start;
align-items: stretch;
}
.doc_width_nav > .part {
background-color: #fff;
border-radius: 10px;
padding-bottom: 20px;
box-sizing: border-box;
box-sizing: 0;
}
.doc_width_nav > .part + .part {
margin-left: 20px;
}
.doc_part {
flex-grow: 1;
}
.nav_part {
width: 270px;
flex-shrink: 0;
}
.part_title {
padding: 10px 20px;
position: relative;
display: flex;
justify-content: space-between;
align-items: center;
}
.part_title::after {
content: "";
position: absolute;
right: 0;
left: 0;
bottom: 0;
border-bottom: 1px solid #e3e5ef;
}
.part_title > span:nth-child(1) {
font-size: 18px;
font-weight: bold;
line-height: 36px;
color: #58617a;
position: relative;
padding-left: 15px;
}
.part_title > span:nth-child(1)::before {
content: "";
width: 4px;
height: 18px;
background-color: #515fe7;
border-radius: 2px;
position: absolute;
top: 10px;
left: 0;
}
.part_title > span:nth-child(2) {
font-size: 14px;
line-height: 24px;
color: #8890a7;
padding-left: 20px;
background-image: url("/../assets/imgs/shop_ic_updatetime.png");
background-repeat: no-repeat;
background-position: left center;
}
.part_content {
height: calc(100% - 76px);
margin-top: 20px;
box-sizing: border-box;
overflow: auto;
}
.doc_content {
padding: 0 20px;
}
.nav_content {
padding-left: 20px;
}
.nav_content > li > a {
display: block;
height: 30px;
padding: 0 20px;
font-size: 14px;
line-height: 30px;
color: #58617a;
text-decoration: none;
cursor: pointer;
}
.nav_content > li.level_1 > a {
color: #242c43;
}
.nav_content > li.level_2 > a {
text-indent: 2em;
}
.nav_content > li.level_3 > a {
text-indent: 4em;
}
.nav_content > li.current > a {
background-color: #e6ebfe;
color: #515fe7;
}
</style>
src/pages/technical-support/answer-center/index.vue
View file @ 7be22da7
...@@ -145,6 +145,7 @@ export default { ...@@ -145,6 +145,7 @@ export default {
font-size: 0; font-size: 0;
} }
.user_img > img { .user_img > img {
width: 104px;
border-radius: 50%; border-radius: 50%;
border: 2px solid #e3e5ef; border: 2px solid #e3e5ef;
} }
......
src/pages/technical-support/doc-manage/index.vue
View file @ 7be22da7
...@@ -23,11 +23,6 @@ export default { ...@@ -23,11 +23,6 @@ export default {
data: () => ({ data: () => ({
navList: [], navList: [],
}), }),
watch: {
"$route.fullPath"(path) {
this.initNavList();
},
},
methods: { methods: {
initNavList() { initNavList() {
this.$api.general.getNowMenu({ teamName: "APAAS3" }).then((response) => { this.$api.general.getNowMenu({ teamName: "APAAS3" }).then((response) => {
......
src/pages/technical-support/doc/detail.vue
View file @ 7be22da7
...@@ -14,51 +14,28 @@ ...@@ -14,51 +14,28 @@
</el-breadcrumb> </el-breadcrumb>
</div> </div>
<div class="main_container"> <doc-width-nav
<div class="part doc_part"> class="main_container"
<h3 class="part_title"> :title="title"
<span>{{ title || typeText }}</span> :time="update_time"
<span>更新时间：{{ update_time }}</span> :rich-text="content"
</h3> ></doc-width-nav>
<div
class="part_content doc_content apaas_scroll"
v-html="content"
ref="docContent"
></div>
</div>
<div class="part nav_part">
<h3 class="part_title">
<span>导航</span>
</h3>
<ul class="part_content nav_content apaas_scroll">
<li
v-for="(item, index) in navTree"
:class="[
'text_clip',
'level_' + item.level,
item.id === curNav ? ' current' : '',
]"
:key="index"
>
<a v-text="item.title" @click="clickNav(item)"></a>
</li>
</ul>
</div>
</div>
</div> </div>
</template> </template>
<script> <script>
import helper from "@/services/helper.js"; import helper from "@/services/helper.js";
import DocWidthNav from "@/components/doc-width-nav.vue";
export default { export default {
components: {
DocWidthNav,
},
data() { data() {
return { return {
title: "", title: "",
update_time: "", update_time: "",
content: "", content: "",
navTree: [],
curNav: "",
}; };
}, },
computed: { computed: {
...@@ -87,59 +64,6 @@ export default { ...@@ -87,59 +64,6 @@ export default {
}, },
methods: { methods: {
getContent() { getContent() {
let successCallback = (content) => {
let titles =
content.match(
/<h1(([\s\S])*?)<\/h1>|<h2(([\s\S])*?)<\/h2>|<h3(([\s\S])*?)<\/h3>/g
) || [];
let time = new Date().getTime();
let pre_h1_index = 0;
let pre_h2_index = 0;
let pre_h3_index = 0;
let newTitles = titles
.map((title, index) => {
let newTitle = title;
let level = 0;
let id = "";
if (title.match(/<h1(([\s\S])*?)<\/h1>/g)) {
pre_h1_index++;
pre_h2_index = 0;
pre_h3_index = 0;
level = 1;
id = `nav_${pre_h1_index}` + "_" + time;
newTitle = title.replace(/<h1/g, `<h1 id="${id}"`);
} else if (title.match(/<h2(([\s\S])*?)<\/h2>/g)) {
pre_h2_index++;
pre_h3_index = 0;
level = 2;
id = `nav_${pre_h1_index}_${pre_h2_index}` + "_" + time;
newTitle = title.replace(/<h2/g, `<h2 id="${id}"`);
} else if (title.match(/<h3(([\s\S])*?)<\/h3>/g)) {
pre_h3_index++;
level = 3;
id = `nav_${pre_h1_index}_${pre_h2_index}_${pre_h3_index}`;
newTitle = title.replace(/<h3/g, `<h3 id="${id}"`) + "_" + time;
}
content = content.replace(new RegExp(title), newTitle);
return {
level,
id,
title: title.replace(/<\/?.+?>/g, ""),
};
})
.filter((item) => item.title);
this.content = content;
this.navTree = newTitles;
this.curNav = (newTitles[0] && newTitles[0].id) || "";
};
this.$http this.$http
.get("/apaas/support/document/get", { .get("/apaas/support/document/get", {
params: { params: {
...@@ -152,7 +76,7 @@ export default { ...@@ -152,7 +76,7 @@ export default {
this.update_time = this.getTimeText(data.data.updated); this.update_time = this.getTimeText(data.data.updated);
if (data.data.content) { if (data.data.content) {
successCallback(data.data.content); this.content = data.data.content;
} }
} }
}); });
...@@ -160,23 +84,6 @@ export default { ...@@ -160,23 +84,6 @@ export default {
getTimeText(time) { getTimeText(time) {
return helper.dateStringTransform(time); return helper.dateStringTransform(time);
}, },
clickNav(item) {
let target = document.querySelector(`#${item.id}`);
this.setScroll(target, this.$refs.docContent);
this.curNav = item.id;
},
setScroll(el, parentEl) {
let actualTop = el.offsetTop;
let current = el.offsetParent;
while (current !== null) {
actualTop += current.offsetTop;
current = current.offsetParent;
}
parentEl.scrollTop = actualTop - parentEl.offsetTop;
},
}, },
}; };
</script> </script>
...@@ -189,102 +96,5 @@ export default { ...@@ -189,102 +96,5 @@ export default {
} }
.main_container { .main_container {
height: calc(100% - 53px); height: calc(100% - 53px);
display: flex;
justify-content: flex-start;
align-items: stretch;
}
.main_container > .part {
background-color: #fff;
border-radius: 10px;
padding-bottom: 20px;
box-sizing: border-box;
box-sizing: 0;
}
.main_container > .part + .part {
margin-left: 20px;
}
.doc_part {
flex-grow: 1;
}
.nav_part {
width: 270px;
flex-shrink: 0;
}
.part_title {
padding: 10px 20px;
position: relative;
display: flex;
justify-content: space-between;
align-items: center;
}
.part_title::after {
content: "";
position: absolute;
right: 0;
left: 0;
bottom: 0;
border-bottom: 1px solid #e3e5ef;
}
.part_title > span:nth-child(1) {
font-size: 18px;
font-weight: bold;
line-height: 36px;
color: #58617a;
position: relative;
padding-left: 15px;
}
.part_title > span:nth-child(1)::before {
content: "";
width: 4px;
height: 18px;
background-color: #515fe7;
border-radius: 2px;
position: absolute;
top: 10px;
left: 0;
}
.part_title > span:nth-child(2) {
font-size: 14px;
line-height: 24px;
color: #8890a7;
padding-left: 20px;
background-image: url("../../../assets/imgs/shop_ic_updatetime.png");
background-repeat: no-repeat;
background-position: left center;
}
.part_content {
height: calc(100% - 76px);
margin-top: 20px;
box-sizing: border-box;
overflow: auto;
}
.doc_content {
padding: 0 20px;
}
.nav_content {
padding-left: 20px;
}
.nav_content > li > a {
display: block;
height: 30px;
padding: 0 20px;
font-size: 14px;
line-height: 30px;
color: #58617a;
text-decoration: none;
cursor: pointer;
}
.nav_content > li.level_1 > a {
color: #242c43;
}
.nav_content > li.level_2 > a {
text-indent: 2em;
}
.nav_content > li.level_3 > a {
text-indent: 4em;
}
.nav_content > li.current > a {
background-color: #e6ebfe;
color: #515fe7;
} }
</style> </style>
src/pages/technical-support/sdk-manage/index.vue 0 → 100644
View file @ 7be22da7
<template>
<div class="doc_container">
<side-nav-bar
title="SDK管理"
imgSrc="tool_ic_kaifawendang"
:nav-list="navList"
:title-path="navList[0] && navList[0].path"
style="width: 200px;"
></side-nav-bar>
<div class="main_container">
<router-view />
</div>
</div>
</template>
<script>
import sideNavBar from "@/components/side-nav-bar";
export default {
components: {
sideNavBar,
},
data: () => ({
navList: [],
}),
methods: {
initNavList() {
this.$api.general.getNowMenu({ teamName: "APAAS3" }).then((response) => {
if (response.data.success == 1) {
let arr = response.data.data[0].Child;
for (let i = 0; i < arr.length; i++) {
let first = arr[i];
if (first.visit_url == "/technical_support") {
for (let j = 0; j < first.Child.length; j++) {
let second = first.Child[j];
if (second.visit_url == "/technical_support/sdk_manage") {
this.navList = second.Child.map((item) => ({
name: item.menu_name,
path: item.visit_url,
}));
break;
}
}
break;
}
}
}
});
},
},
mounted() {
this.initNavList();
},
};
</script>
<style scoped>
.doc_container {
height: calc(100vh - 58px);
display: flex;
justify-content: flex-start;
align-items: stretch;
}
.side_nav_bar {
width: 180px;
flex-shrink: 0;
}
.main_container {
width: calc(100% - 180px);
flex-grow: 1;
flex-shrink: 1;
background-color: #f6f7fb;
overflow: auto;
}
</style>
src/pages/technical-support/sdk-manage/list.vue 0 → 100644
View file @ 7be22da7
<template>
<div class="doc_manage_container">
<apass-list
ref="list"
search-placeholder="请输入关键字"
:hide-search="true"
:list-total="listTotal"
:list-header="listHeader"
:list-data="listData"
:list-padding-left="paddingLeft"
@list-action="init"
>
<el-breadcrumb separator="/" slot="breadcrumb">
<el-breadcrumb-item to="/technical_support">
技术支持
</el-breadcrumb-item>
<el-breadcrumb-item to="/technical_support/doc_manage">
开发文档
</el-breadcrumb-item>
<el-breadcrumb-item>
管理列表
</el-breadcrumb-item>
</el-breadcrumb>
<template slot="header-left">
<el-button type="primary" @click="addNew">
新建
</el-button>
</template>
<template slot="top">
<div class="top_fliter">
<show-more-filter class="filter_list">
<div class="filter_item">
<span class="filter_title">文档名称：</span>
<el-input
v-model="topFilter.name"
placeholder="请输入banner关键词"
@keyup.enter.native="topFilterAction"
></el-input>
</div>
<div class="filter_item">
<span class="filter_title">文档类型：</span>
<el-select v-model="topFilter.type" placeholder="请选择">
<el-option label="全部" value=""></el-option>
<el-option
v-for="(item, index) in types"
:key="'top_type_' + index"
:label="item.label"
:value="item.value"
>
</el-option>
</el-select>
</div>
<div class="filter_item">
<span class="filter_title">最后更新时间：</span>
<el-date-picker
v-model="topFilter.time"
type="daterange"
range-separator="至"
start-placeholder="开始日期"
end-placeholder="结束日期"
value-format="yyyy-MM-dd"
>
</el-date-picker>
</div>
</show-more-filter>
<div class="filter_action apaas_button">
<el-button type="primary" @click="topFilterAction">
查询
</el-button>
<el-button type="defalut" @click="topFilterClear">
重置
</el-button>
</div>
</div>
</template>
</apass-list>
<apass-dialog ref="addDialog" title="新增">
<div class="add_content" slot="content">
<div class="add_notice">
<p>注：同一文档类型下可维护多个文档名称</p>
</div>
<el-form ref="addForm" :model="addForm" :rules="addFormRules">
<el-form-item label="活动区域" prop="style">
<el-select
v-model="addForm.style"
placeholder="请选择文档类型"
style="width: 100%;"
>
<el-option
v-for="(item, index) in types"
:key="'add_type_' + index"
:label="item.label"
:value="item.value"
>
</el-option>
</el-select>
</el-form-item>
<el-form-item label="文档名称" prop="title">
<el-input
v-model="addForm.title"
placeholder="请输入文档名称"
></el-input>
</el-form-item>
</el-form>
</div>
<template slot="action">
<el-button type="defalut" size="mini" @click="AddCancelAction">
取消
</el-button>
<el-button type="primary" size="mini" @click="AddSubmitAction">
确定
</el-button>
</template>
</apass-dialog>
<apass-dialog
ref="detailDialog"
:title="detail.title"
class="doc_manage_detail_dialog"
width="1340px"
>
<div
class="detail_content apaas_scroll"
slot="content"
v-html="detail.content"
></div>
</apass-dialog>
<apass-dialog
ref="deleteDialog"
:msg="deleteDialogInfo.msg"
:submit="deleteDialogInfo.submit"
></apass-dialog>
</div>
</template>
<script>
import helper from "@/services/helper.js";
import apassList from "@/components/apass-list";
import apassDialog from "@/components/apass-dialog";
import showMoreFilter from "@/components/show-more-filter";
export default {
components: {
apassList,
apassDialog,
showMoreFilter,
},
data() {
return {
paddingLeft: 25,
listTotal: 0,
listHeader: [
{
label: "文档名称",
prop: "title",
type: "button",
callback: this.viewItem,
width: 320,
},
{
label: "文档类型",
prop: "style",
getText: (item) => {
let type = this.types[item.style] || null;
return (type && type.label) || "";
},
align: "center",
},
{
label: "操作人",
prop: "created_by",
align: "center",
},
{
label: "最后更新时间",
prop: "updated",
getText: ({ updated }) => this.getTimeText(updated || ""),
align: "center",
},
{
label: "操作",
type: "buttons",
align: "center",
width: 240,
actionList: [
{
label: "编辑",
callback: this.editItem,
},
{
label: "删除",
callback: this.deleteItem,
class: "warn",
},
],
},
],
listData: [],
topFilter: {
name: "",
type: "",
time: "",
},
types: [
{
label: "平台简介",
value: 0, // "introductory",
},
{
label: "使用须知",
value: 1, // "notice",
},
{
label: "术语说明",
value: 2, // "trem",
},
{
label: "标准规范",
value: 3, // "standard",
},
{
label: "操作指南",
value: 4, // "guide",
},
{
label: "接口文档",
value: 5, // "api",
},
{
label: "常见问题",
value: 6, // "questions",
},
],
addForm: {
style: "",
title: "",
},
addFormRules: {
style: [
{ required: true, message: "请选择文档类型", trigger: "change" },
],
title: [
{ required: true, message: "请输入文档名称", trigger: "blur" },
{ max: 20, message: "长度应小于20个字符", trigger: "change" },
],
},
detail: "",
deleteDialogInfo: {
msg: "",
submit: null,
},
tempFilter: {},
};
},
methods: {
init(filter) {
let fullFilter = {
...filter,
...this.topFilter,
};
this.tempFilter = filter;
this.$http
.get("/apaas/support/document/list", {
params: {
style: fullFilter.type,
start: fullFilter.time && fullFilter.time[0],
end: fullFilter.time && fullFilter.time[1],
limit: fullFilter.size,
page: fullFilter.page,
},
})
.then(({ data }) => {
if (data.success === 1) {
this.listTotal = data.total;
this.listData = data.data || [];
}
});
},
getTimeText(time) {
return helper.dateStringTransform(time);
},
topFilterAction() {
this.refreshPage();
},
topFilterClear() {
this.topFilter = {
name: "",
type: "",
time: "",
};
this.refreshPage();
},
refreshPage() {
this.$refs.list.resetCurrentPage();
},
viewItem(item) {
this.$http
.get("/apaas/support/document/get", {
params: {
id: item.id,
},
})
.then(({ data }) => {
if (data.success === 1) {
this.detail = data.data;
}
});
this.$refs.detailDialog.show();
},
editItem(item) {
this.$router.push(`/technical_support/doc_manage/edit/${item.id}`);
},
deleteItem(item) {
this.deleteDialogInfo.msg = `是否删除《${item.title}》？`;
this.deleteDialogInfo.submit = () => {
this.$http
.delete("/apaas/support/document/delete", {
params: {
id: item.id,
},
})
.then(({ data }) => {
if (data.success === 1) {
this.$message.success("删除成功");
this.init(this.tempFilter);
} else {
this.$message.error("删除失败");
}
})
.catch((error) => {
console.log(error);
this.$message.error("删除失败");
});
};
this.$refs.deleteDialog.show();
},
addNew() {
this.addForm = {
style: 0,
title: "",
};
this.$refs.addDialog.show();
},
AddCancelAction() {
this.$refs.addDialog.hide();
},
AddSubmitAction() {
this.$refs.addForm.validate((valid) => {
if (valid) {
this.$http
.get("/apaas/support/document/checkTitle", {
params: this.addForm,
})
.then(({ data }) => {
if (data.success === 1) {
this.$http
.post("/apaas/support/document/create", {
...this.addForm,
content: "",
})
.then(({ data }) => {
if (data.success === 1) {
this.$message.success("新增成功");
this.editItem(data.data);
} else {
this.$message.error(data.errMsg || "新增失败");
}
})
.catch((error) => {
console.log(error);
this.$message.error("新增失败");
});
} else {
this.$message.error("验证失败");
}
})
.catch((error) => {
console.log(error);
this.$message.error("验证失败");
});
} else {
return false;
}
});
},
},
};
</script>
<style scoped>
.doc_manage_container {
height: 100%;
}
.add_notice {
display: inline-block;
margin: 10px auto;
background-color: #f4f7fc;
border-radius: 8px;
padding: 10px;
}
.add_notice > p {
font-size: 12px;
line-height: 16px;
color: #58617a;
padding-left: 20px;
background-image: url("../../../assets/imgs/ic_tishi.png");
background-repeat: no-repeat;
background-position: left center;
}
.detail_content {
height: 650px;
overflow: auto;
text-align: left;
}
</style>
<style>
.doc_manage_detail_dialog .el-dialog__body {
padding: 10px;
}
.doc_manage_detail_dialog .el-dialog__footer {
display: none;
}
</style>
src/pages/technical-support/sdk-manage/type/index.vue 0 → 100644
View file @ 7be22da7
<template>
<div class="doc_manage_container">
<apass-list
ref="list"
search-placeholder="请输入关键字"
:list-padding-left="paddingLeft"
:hide-search="true"
:list-total="listTotal"
:list-header="listHeader"
:list-data="listData"
@list-action="init"
>
<el-breadcrumb separator="/" slot="breadcrumb">
<el-breadcrumb-item to="/technical_support">
技术支持
</el-breadcrumb-item>
<el-breadcrumb-item to="/technical_support/doc_manage">
SDK管理
</el-breadcrumb-item>
<el-breadcrumb-item>
SDK类型管理
</el-breadcrumb-item>
</el-breadcrumb>
<template slot="top">
<div class="top_fliter">
<show-more-filter class="filter_list">
<div class="filter_item">
<span class="filter_title">SDK类型：</span>
<el-select v-model="topFilter.type" placeholder="请选择">
<el-option label="全部" value=""></el-option>
<el-option
v-for="(item, index) in types"
:key="'top_type_' + index"
:label="item.label"
:value="item.value"
>
</el-option>
</el-select>
</div>
<div class="filter_item">
<span class="filter_title">最后更新时间：</span>
<el-date-picker
v-model="topFilter.time"
type="daterange"
range-separator="至"
start-placeholder="开始日期"
end-placeholder="结束日期"
value-format="yyyy-MM-dd"
>
</el-date-picker>
</div>
</show-more-filter>
<div class="filter_action apaas_button">
<el-button type="primary" @click="topFilterAction">
查询
</el-button>
<el-button type="defalut" @click="topFilterClear">
重置
</el-button>
</div>
</div>
</template>
</apass-list>
</div>
</template>
<script>
import helper from "@/services/helper.js";
import apassList from "@/components/apass-list";
import apassDialog from "@/components/apass-dialog";
import showMoreFilter from "@/components/show-more-filter";
export default {
components: {
apassList,
apassDialog,
showMoreFilter,
},
data() {
return {
paddingLeft: 25,
listTotal: 0,
listHeader: [],
listData: [],
topFilter: {
type: "",
time: "",
},
types: [],
tempFilter: {},
};
},
methods: {
init(filter) {
let fullFilter = {
...filter,
...this.topFilter,
};
this.tempFilter = filter;
console.log(fullFilter);
},
topFilterClear() {
this.topFilter = {
name: "",
type: "",
time: "",
};
this.refreshPage();
},
topFilterAction() {
this.refreshPage();
},
refreshPage() {
this.$refs.list.resetCurrentPage();
},
},
};
</script>
src/pages/technical-support/sdk/detail.vue 0 → 100644
View file @ 7be22da7
<template>
<div class="sdk_container">
<div class="apass_breadcrumb">
<el-breadcrumb separator="/">
<el-breadcrumb-item to="/technical_support">
技术支持
</el-breadcrumb-item>
<el-breadcrumb-item to="/technical_support/doc">
SDK中心
</el-breadcrumb-item>
<el-breadcrumb-item>
{{ typeText }}
</el-breadcrumb-item>
</el-breadcrumb>
</div>
<div class="download_action apaas_button" v-if="sdkInfo">
<span>SDK下载</span>
<span>版本号：{{ sdkInfo.version }}</span>
<span>发布日期：{{ sdkInfo.time }}</span>
<el-button type="primary" @click="downloadUrl(sdkInfo.url)">
下载SDK
</el-button>
</div>
<doc-width-nav
class="main_container"
:title="title"
:time="update_time"
:rich-text="content"
></doc-width-nav>
</div>
</template>
<script>
import helper from "@/services/helper.js";
import DocWidthNav from "@/components/doc-width-nav.vue";
export default {
components: {
DocWidthNav,
},
data() {
return {
title: "",
update_time: "",
content: "",
sdkInfo: null,
};
},
computed: {
typeText() {
return this.$route.params.type || "SDK";
},
sdkId() {
return this.$route.params.id;
},
},
created() {
this.getContent();
},
methods: {
getContent() {
this.sdkInfo = {
version: "100.9.0",
time: "2020-08-27",
url: "http://pic1.win4000.com/tj/2020-10-19/5f8d3a49abc54.jpg",
};
this.title = "标题";
this.update_time = "2020-10-26 10:00:00";
this.content = `
<h1>产品简介</h1><p>BD-aPaaS平台（V3.0）基于BD-aPaaS平台（V2.0）进行整体架构调整的升级研发。BD-aPaaS平台（V3.0）定位于PaaS层，偏重于支撑和管理SaaS层的应用和系统，是基于微服务架构、云网全面互联的大数据服务支撑平台，集城市信息资源规划、建设、治理、管理、融合、共享、分析、服务为一体，能够释放政府和行业沉淀在业务系统中的能力</p><p><br></p><h2>产品简介</h2><p>BD-aPaaS平台（V3.0）基于BD-aPaaS平台（V2.0）进行整体架构调整的升级研发。BD-aPaaS平台（V3.0）定位于PaaS层，偏重于支撑和管理SaaS层的应用和系统，是基于微服务架构、云网全面互联的大数据服务支撑平台，集城市信息资源规划、建设、治理、管理、融合、共享、分析、服务为一体，能够释放政府和行业沉淀在业务系统中的能力</p><p><br></p><h3>产品简介</h3><p>BD-aPaaS平台（V3.0）基于BD-aPaaS平台（V2.0）进行整体架构调整的升级研发。BD-aPaaS平台（V3.0）定位于PaaS层，偏重于支撑和管理SaaS层的应用和系统，是基于微服务架构、云网全面互联的大数据服务支撑平台，集城市信息资源规划、建设、治理、管理、融合、共享、分析、服务为一体，能够释放政府和行业沉淀在业务系统中的能力</p><p><br></p><h1><img src="http://pic1.win4000.com/tj/2020-10-19/5f8d3a49abc54.jpg" style="font-size: 14px; max-width: 100%;"></h1><h1><a href="https://www.baidu.com" target="_blank" style="font-size: 14px;">链接</a></h1><p><br></p><h2>产品简介</h2><p>BD-aPaaS平台（V3.0）基于BD-aPaaS平台（V2.0）进行整体架构调整的升级研发。BD-aPaaS平台（V3.0）定位于PaaS层，偏重于支撑和管理SaaS层的应用和系统，是基于微服务架构、云网全面互联的大数据服务支撑平台，集城市信息资源规划、建设、治理、管理、融合、共享、分析、服务为一体，能够释放政府和行业沉淀在业务系统中的能力</p><p><br></p><h3>产品简介</h3><p>BD-aPaaS平台（V3.0）基于BD-aPaaS平台（V2.0）进行整体架构调整的升级研发。BD-aPaaS平台（V3.0）定位于PaaS层，偏重于支撑和管理SaaS层的应用和系统，是基于微服务架构、云网全面互联的大数据服务支撑平台，集城市信息资源规划、建设、治理、管理、融合、共享、分析、服务为一体，能够释放政府和行业沉淀在业务系统中的能力</p><p><br></p><h1>产品简介</h1><p>BD-aPaaS平台（V3.0）基于BD-aPaaS平台（V2.0）进行整体架构调整的升级研发。BD-aPaaS平台（V3.0）定位于PaaS层，偏重于支撑和管理SaaS层的应用和系统，是基于微服务架构、云网全面互联的大数据服务支撑平台，集城市信息资源规划、建设、治理、管理、融合、共享、分析、服务为一体，能够释放政府和行业沉淀在业务系统中的能力</p><p><br></p><h2>产品简介</h2><p>BD-aPaaS平台（V3.0）基于BD-aPaaS平台（V2.0）进行整体架构调整的升级研发。BD-aPaaS平台（V3.0）定位于PaaS层，偏重于支撑和管理SaaS层的应用和系统，是基于微服务架构、云网全面互联的大数据服务支撑平台，集城市信息资源规划、建设、治理、管理、融合、共享、分析、服务为一体，能够释放政府和行业沉淀在业务系统中的能力</p><p><br></p><h3>产品简介</h3><p>BD-aPaaS平台（V3.0）基于BD-aPaaS平台（V2.0）进行整体架构调整的升级研发。BD-aPaaS平台（V3.0）定位于PaaS层，偏重于支撑和管理SaaS层的应用和系统，是基于微服务架构、云网全面互联的大数据服务支撑平台，集城市信息资源规划、建设、治理、管理、融合、共享、分析、服务为一体，能够释放政府和行业沉淀在业务系统中的能力</p><p><br></p><h1>产品简介</h1><p>BD-aPaaS平台（V3.0）基于BD-aPaaS平台（V2.0）进行整体架构调整的升级研发。BD-aPaaS平台（V3.0）定位于PaaS层，偏重于支撑和管理SaaS层的应用和系统，是基于微服务架构、云网全面互联的大数据服务支撑平台，集城市信息资源规划、建设、治理、管理、融合、共享、分析、服务为一体，能够释放政府和行业沉淀在业务系统中的能力</p><p><br></p><h2>产品简介</h2><p>BD-aPaaS平台（V3.0）基于BD-aPaaS平台（V2.0）进行整体架构调整的升级研发。BD-aPaaS平台（V3.0）定位于PaaS层，偏重于支撑和管理SaaS层的应用和系统，是基于微服务架构、云网全面互联的大数据服务支撑平台，集城市信息资源规划、建设、治理、管理、融合、共享、分析、服务为一体，能够释放政府和行业沉淀在业务系统中的能力</p><p><br></p><h3>产品简介</h3><p>BD-aPaaS平台（V3.0）基于BD-aPaaS平台（V2.0）进行整体架构调整的升级研发。BD-aPaaS平台（V3.0）定位于PaaS层，偏重于支撑和管理SaaS层的应用和系统，是基于微服务架构、云网全面互联的大数据服务支撑平台，集城市信息资源规划、建设、治理、管理、融合、共享、分析、服务为一体，能够释放政府和行业沉淀在业务系统中的能力</p><p><br></p><h1>产品简介</h1><p>BD-aPaaS平台（V3.0）基于BD-aPaaS平台（V2.0）进行整体架构调整的升级研发。BD-aPaaS平台（V3.0）定位于PaaS层，偏重于支撑和管理SaaS层的应用和系统，是基于微服务架构、云网全面互联的大数据服务支撑平台，集城市信息资源规划、建设、治理、管理、融合、共享、分析、服务为一体，能够释放政府和行业沉淀在业务系统中的能力</p><p><br></p><h2>产品简介</h2><p>BD-aPaaS平台（V3.0）基于BD-aPaaS平台（V2.0）进行整体架构调整的升级研发。BD-aPaaS平台（V3.0）定位于PaaS层，偏重于支撑和管理SaaS层的应用和系统，是基于微服务架构、云网全面互联的大数据服务支撑平台，集城市信息资源规划、建设、治理、管理、融合、共享、分析、服务为一体，能够释放政府和行业沉淀在业务系统中的能力</p><p><br></p><h3>产品简介</h3><p>BD-aPaaS平台（V3.0）基于BD-aPaaS平台（V2.0）进行整体架构调整的升级研发。BD-aPaaS平台（V3.0）定位于PaaS层，偏重于支撑和管理SaaS层的应用和系统，是基于微服务架构、云网全面互联的大数据服务支撑平台，集城市信息资源规划、建设、治理、管理、融合、共享、分析、服务为一体，能够释放政府和行业沉淀在业务系统中的能力</p><p><br></p><h1>产品简介</h1><p>BD-aPaaS平台（V3.0）基于BD-aPaaS平台（V2.0）进行整体架构调整的升级研发。BD-aPaaS平台（V3.0）定位于PaaS层，偏重于支撑和管理SaaS层的应用和系统，是基于微服务架构、云网全面互联的大数据服务支撑平台，集城市信息资源规划、建设、治理、管理、融合、共享、分析、服务为一体，能够释放政府和行业沉淀在业务系统中的能力</p><p><br></p><h2>产品简介</h2><p>BD-aPaaS平台（V3.0）基于BD-aPaaS平台（V2.0）进行整体架构调整的升级研发。BD-aPaaS平台（V3.0）定位于PaaS层，偏重于支撑和管理SaaS层的应用和系统，是基于微服务架构、云网全面互联的大数据服务支撑平台，集城市信息资源规划、建设、治理、管理、融合、共享、分析、服务为一体，能够释放政府和行业沉淀在业务系统中的能力</p><p><br></p><h3>产品简介</h3><p>BD-aPaaS平台（V3.0）基于BD-aPaaS平台（V2.0）进行整体架构调整的升级研发。BD-aPaaS平台（V3.0）定位于PaaS层，偏重于支撑和管理SaaS层的应用和系统，是基于微服务架构、云网全面互联的大数据服务支撑平台，集城市信息资源规划、建设、治理、管理、融合、共享、分析、服务为一体，能够释放政府和行业沉淀在业务系统中的能</p><h1></h1>
`;
},
getTimeText(time) {
return helper.dateStringTransform(time);
},
downloadUrl(url) {
let a = document.createElement("a");
a.setAttribute("download", "");
a.setAttribute("href", url);
a.click();
},
},
};
</script>
<style scoped>
.sdk_container {
height: 100%;
padding: 0 20px 30px;
display: flex;
flex-direction: column;
justify-content: flex-start;
align-items: stretch;
box-sizing: border-box;
}
.main_container {
flex-grow: 1;
height: calc(100% - 53px);
}
.download_action {
background-color: #fff;
border-radius: 10px;
padding: 10px 20px;
display: flex;
justify-content: flex-start;
align-items: center;
margin-bottom: 20px;
}
.download_action > span:nth-child(1) {
font-size: 18px;
font-weight: bold;
line-height: 36px;
color: #58617a;
position: relative;
padding-left: 15px;
}
.download_action > span:nth-child(1)::before {
content: "";
width: 4px;
height: 18px;
background-color: #515fe7;
border-radius: 2px;
position: absolute;
top: 10px;
left: 0;
}
.download_action > span:nth-child(2),
.download_action > span:nth-child(3) {
font-size: 14px;
line-height: 24px;
color: #8890a7;
padding-left: 20px;
background-position: left center;
}
.download_action > span:nth-child(2) {
background-image: url("/../assets/imgs/shop_ic_updatetime.png");
}
.download_action > span:nth-child(3) {
background-image: url("/../assets/imgs/shop_ic_updatetime.png");
}
.download_action > .el-button {
margin-left: auto;
}
</style>
src/pages/technical-support/sdk/index.vue 0 → 100644
View file @ 7be22da7
<template>
<div class="page_container">
<side-nav-bar
title="SDK中心"
imgSrc="tool_ic_kaifawendang"
:nav-list="navList"
:title-path="navList[0] && navList[0].path"
style="width: 250px;"
></side-nav-bar>
<div class="main_container">
<router-view :key="$route.params.type + $route.params.id" />
</div>
</div>
</template>
<script>
import sideNavBar from "@/components/side-nav-bar";
export default {
components: {
sideNavBar,
},
data: () => ({
navList: [],
}),
methods: {
initNavList() {
let activePath = "";
let baseUrl = "/technical_support/sdk";
let data = [
{
name: "JavaScript SDK",
id: 1,
children: [
{
name: "在地图上添加图层",
id: 101,
},
{
name: "测测测自己创建测",
id: 102,
},
],
},
{
name: "Android SDK",
id: 2,
children: [
{
name: "Android",
id: 201,
},
{
name: "测测测自己创建测",
id: 202,
},
],
},
];
this.navList = data.map((item) => {
let children = item.children;
let nav = {
name: item.name,
path: `${baseUrl}/${item.name}`,
};
if (children.length > 0) {
nav.children = children.map((v) => {
let path = `${baseUrl}/${item.name}/${v.id}`;
if (activePath === "") {
activePath = path;
}
return {
name: v.name,
path: path,
};
});
nav.open = true;
} else {
nav.disabled = true;
}
return nav;
});
if (activePath && this.$route.params.id === undefined) {
this.$router.push(activePath);
} else if (activePath === "") {
this.$message.error("您尚未创建任何SDK文档");
}
},
},
mounted() {
this.initNavList();
},
};
</script>
<style scoped>
.page_container {
height: calc(100vh - 58px);
display: flex;
justify-content: flex-start;
align-items: stretch;
}
.side_nav_bar {
width: 180px;
flex-shrink: 0;
}
.main_container {
width: calc(100% - 180px);
flex-grow: 1;
flex-shrink: 1;
background-color: #f6f7fb;
overflow: auto;
}
</style>
src/router/index.js
View file @ 7be22da7
...@@ -167,7 +167,8 @@ export default new Router({ ...@@ -167,7 +167,8 @@ export default new Router({
path: "/technical_support/doc_manage", path: "/technical_support/doc_manage",
name: "technicalSupportDoc", name: "technicalSupportDoc",
redirect: "/technical_support/doc_manage/list", redirect: "/technical_support/doc_manage/list",
component: () => import("@/pages/technical-support/doc-manage/index"), component: () =>
import("@/pages/technical-support/doc-manage/index"),
children: [ children: [
{ {
path: "/technical_support/doc_manage/list", path: "/technical_support/doc_manage/list",
...@@ -201,7 +202,8 @@ export default new Router({ ...@@ -201,7 +202,8 @@ export default new Router({
path: "/technical_support/answer_center/", path: "/technical_support/answer_center/",
name: "technicalSupportDoc", name: "technicalSupportDoc",
redirect: "/technical_support/answer_center/list", redirect: "/technical_support/answer_center/list",
component: () => import("@/pages/technical-support/answer-center/index"), component: () =>
import("@/pages/technical-support/answer-center/index"),
children: [ children: [
{ {
path: "/technical_support/answer_center/list", path: "/technical_support/answer_center/list",
...@@ -220,6 +222,18 @@ export default new Router({ ...@@ -220,6 +222,18 @@ export default new Router({
}, // 问答中心详情 }, // 问答中心详情
], ],
}, // 问答中心 }, // 问答中心
{
path: "/technical_support/sdk",
name: "technicalSupportSdk",
component: () => import("@/pages/technical-support/sdk/index"),
children: [
{
path: "/technical_support/sdk/:type/:id",
name: "technicalSupportSdkDetail",
component: () => import("@/pages/technical-support/sdk/detail"),
}, // 问答中心列表
],
}, // 问答中心
], ],
}, // 技术支持 }, // 技术支持
{ {
...@@ -448,14 +462,16 @@ export default new Router({ ...@@ -448,14 +462,16 @@ export default new Router({
{ {
path: "/qa/questions", // 提问列表 path: "/qa/questions", // 提问列表
name: "questions", name: "questions",
component: () => import("@/pages/user/questions-answers/community"), component: () =>
import("@/pages/user/questions-answers/community"),
}, },
{ {
path: "/qa/answers", // 回答列表 path: "/qa/answers", // 回答列表
name: "answers", name: "answers",
component: () => import("@/pages/user/questions-answers/community"), component: () =>
import("@/pages/user/questions-answers/community"),
}, },
] ],
}, },
{ {
path: "/authority", // 权限管理 path: "/authority", // 权限管理
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment