StoryBook - 安装 Kuboard
This commit is contained in:
huanqing.shao
@ -20,13 +20,15 @@
|
||||
:disabled="activeIndex !== index"
|
||||
:style="activeIndex === index ? '' : 'cursor: pointer; opacity: 0.5;'">
|
||||
<div class="slide"
|
||||
@click.capture="clickNeighbour(index)"
|
||||
:id="`dialog_${step.name}`">
|
||||
<!-- <div :id="step.name">
|
||||
<slot :name="step.name">
|
||||
{{step.title}}
|
||||
</slot>
|
||||
</div> -->
|
||||
@click.capture="clickNeighbour(index)">
|
||||
<!-- <div>{{step.title}}</div> -->
|
||||
<div :id="`dialog_${step.name}`">
|
||||
<!-- <div :id="step.name">
|
||||
<slot :name="step.name">
|
||||
{{step.title}}
|
||||
</slot>
|
||||
</div> -->
|
||||
</div>
|
||||
</div>
|
||||
<el-button v-if="activeIndex === index" style="float: left; z-index: 100; margin-top: 5px;" size="mini" type="primary" @click="clickNeighbour(index - 1)">上一步</el-button>
|
||||
<el-button v-if="activeIndex === index" style="float: right; z-index: 100; margin-top: 5px;" size="mini" type="primary" @click="clickNeighbour(index + 1)">下一步</el-button>
|
||||
@ -38,7 +40,7 @@
|
||||
<div class="swiper-button-next" slot="button-next"></div> -->
|
||||
</div>
|
||||
</el-dialog>
|
||||
<el-button @click="dialogVisible = true" type="text" style="position: fixed; right: 20px; top: 60px;">分步阅读</el-button>
|
||||
<el-button @click="dialogVisible = true" type="text" style="position: fixed; right: 20px; top: 60px; z-index: 10;">分步阅读</el-button>
|
||||
<template v-for="(step, index) in slides">
|
||||
<div :key="step.name">
|
||||
<div :id="`full_${step.name}`">
|
||||
@ -65,15 +67,6 @@ export default {
|
||||
slides: []
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
// swiper() {
|
||||
// // if (this.$refs.mySwiper) {
|
||||
// return this.$refs.mySwiper.swiper
|
||||
// // } else {
|
||||
// // return { activeIndex: 0 }
|
||||
// // }
|
||||
// }
|
||||
},
|
||||
mounted () {
|
||||
this.$nextTick(_ => {
|
||||
for (let item of this.$page.frontmatter.storyBook.pages) {
|
||||
@ -108,6 +101,7 @@ export default {
|
||||
slidesPerView: 'auto',
|
||||
centeredSlides: true,
|
||||
spaceBetween: 20,
|
||||
effect: 'coverflow',
|
||||
on:{
|
||||
slideChange: function(a){
|
||||
console.log('slideChange')
|
||||
@ -116,7 +110,7 @@ export default {
|
||||
})
|
||||
},
|
||||
},
|
||||
// observer:true,
|
||||
observer:true,
|
||||
// navigation: {
|
||||
// nextEl: '.swiper-button-next',
|
||||
// prevEl: '.swiper-button-prev',
|
||||
@ -127,6 +121,9 @@ export default {
|
||||
// console.log(`dialog_${item.name}`, document.getElementById(`dialog_${item.name}`))
|
||||
document.getElementById(`dialog_${item.name}`).appendChild(document.getElementById(item.name))
|
||||
}
|
||||
for (let item of this.slides) {
|
||||
document.getElementById(`dialog_${item.name}`).scrollTop = 0
|
||||
}
|
||||
}, 100)
|
||||
} else {
|
||||
setTimeout(_ => {
|
||||
@ -159,9 +156,11 @@ export default {
|
||||
} else {
|
||||
this.mySwiper.slideNext()
|
||||
}
|
||||
} else {
|
||||
this.mySwiper.slideNext()
|
||||
}
|
||||
} else if (index === this.activeIndex) {
|
||||
|
||||
// do nonething
|
||||
} else if (index < this.activeIndex) {
|
||||
event.stopPropagation()
|
||||
event.preventDefault()
|
||||
|
||||
@ -1,9 +1,27 @@
|
||||
---
|
||||
description: Kuboard 的安装手册，包括安装 Kuboard 的前提条件、与 Kubernetes 的版本兼容性、安装步骤、以及完成安装后如何访问 Kuboard 界面。
|
||||
storyBook:
|
||||
title: '安装 Kuboard'
|
||||
initial: StoryBook
|
||||
pages:
|
||||
- name: overview
|
||||
title: 前提条件
|
||||
- name: install
|
||||
title: 安装/卸载
|
||||
- name: token
|
||||
title: 获取 Token
|
||||
- name: access
|
||||
title: 访问 Kuboard
|
||||
- name: next
|
||||
title: 下一步
|
||||
---
|
||||
|
||||
# 安装 Kuboard
|
||||
|
||||
<StoryBook>
|
||||
|
||||
<div slot="overview">
|
||||
|
||||
## 前提
|
||||
|
||||
安装 Kuboard 时，假设您已经有一个 Kubernetes 集群
|
||||
@ -24,13 +42,15 @@ description: Kuboard 的安装手册，包括安装 Kuboard 的前提条件、
|
||||
| v1.12 | v1.0.x | <span style="font-size: 24px;">😐</span> | Kubernetes Api v1.12 尚不支持 dryRun，<br />忽略Kuboard在执行命令时的参数校验错误，可正常工作 |
|
||||
| v1.11 | v1.0.x | <span style="font-size: 24px;">😐</span> | 同上 |
|
||||
|
||||
</div>
|
||||
|
||||
<div slot="install">
|
||||
|
||||
## 安装
|
||||
|
||||
:::: tabs 安装 type:border-card
|
||||
|
||||
::: tab 安装 lazy
|
||||
::: tab 安装
|
||||
|
||||
安装 Kuboard。
|
||||
|
||||
@ -42,7 +62,7 @@ kubectl apply -f https://kuboard.cn/install-script/kuboard.yaml
|
||||
|
||||
:::
|
||||
|
||||
::: tab 卸载 lazy
|
||||
::: tab 卸载
|
||||
|
||||
卸载 Kuboard
|
||||
|
||||
@ -53,13 +73,17 @@ kubectl delete -f https://kuboard.cn/install-script/kuboard.yaml
|
||||
|
||||
::::
|
||||
|
||||
</div>
|
||||
|
||||
<div slot="token">
|
||||
|
||||
## 获取 Token
|
||||
|
||||
您可以获得管理员用户、只读用户的Token
|
||||
|
||||
:::: tabs type:border-card
|
||||
|
||||
::: tab 管理员用户 lazy
|
||||
::: tab 管理员用户
|
||||
|
||||
**拥有的权限**
|
||||
|
||||
@ -93,7 +117,7 @@ token: eyJhbGciOiJSUzI1NiIsImtpZCI6IiJ9.eyJpc3MiOiJrdWJlcm5ldGVzL3NlcnZpY2VhY2Nv
|
||||
:::
|
||||
|
||||
|
||||
::: tab 只读用户 lazy
|
||||
::: tab 只读用户
|
||||
|
||||
**拥有的权限**
|
||||
|
||||
@ -116,7 +140,7 @@ kubectl -n kube-system describe secret $(kubectl -n kube-system get secret | gre
|
||||
**输出**
|
||||
|
||||
取输出信息中 token 字段
|
||||
```{13}
|
||||
``` {13}
|
||||
Name: admin-user-token-g8hxb
|
||||
Namespace: kube-system
|
||||
Labels: <none>
|
||||
@ -133,8 +157,12 @@ token: eyJhbGciOiJSUzI1NiIsImtpZCI6IiJ9.eyJpc3MiOiJrdWJlcm5ldGVzL3NlcnZpY2VhY2Nv
|
||||
```
|
||||
|
||||
:::
|
||||
|
||||
::::
|
||||
|
||||
</div>
|
||||
|
||||
<div slot="access">
|
||||
|
||||
## 访问 Kuboard
|
||||
|
||||
@ -179,6 +207,10 @@ kubectl port-forward service/kuboard 8080:80 -n kube-system
|
||||
|
||||
::::
|
||||
|
||||
</div>
|
||||
|
||||
<div slot="next">
|
||||
|
||||
::: warning
|
||||
* 如果不能访问 Kuboard，请参考 [常见问题](faq/timeout.html)
|
||||
|
||||
@ -192,3 +224,7 @@ kubectl port-forward service/kuboard 8080:80 -n kube-system
|
||||
- 使用 Kuboard 工作负载编辑器 [创建 busybox](/guide/example/busybox.html) （10分钟）
|
||||
|
||||
- 尝试 Kuboard 设计的其他 example [使用 Kuboard](/guide/index.html)
|
||||
|
||||
</div>
|
||||
|
||||
</StoryBook>
|
||||
|
||||
Reference in New Issue
Block a user