fix: 部分引用插件的补充

This commit is contained in:
zhangyu
2024-05-27 17:58:25 +08:00
parent 32118cf070
commit 4dc65c11ee
19 changed files with 295 additions and 4 deletions

View File

@@ -67,6 +67,13 @@ export const sidebar = {
items:[
{text:'clickSearch', link: '/clickSearch'},
{text:'promqlInput', link: '/promqlInput'},
{
text:'pickTime',
link: '/pickTime',
items: [
{text:'multipleTime', link: '/multipleTime'}
]
},
]
},
{
@@ -77,11 +84,18 @@ export const sidebar = {
{text:'xterm', link: '/xterm'},
{text:'时间插件', link: '/time'},
{text:'Quill', link: '/quill'},
{text:'D3', link: '/d3'},
{text:'selectpage', link: '/selectpage'},
]
},
{
text: '注意事项',
link: '/note',
items: [
{text:'dashboard 流程'},
{text:'主题简单使用教程'},
{text:'国际化使用教程'},
]
}
],
};

View File

@@ -0,0 +1,14 @@
---
map:
path: /d3
---
基于svg的可视化插件
# 官方地址
https://observablehq.com/@d3/gallery?utm_source=d3js-org&utm_medium=nav&utm_campaign=try-observable
<API src="./index.vue" lang="en"></API>

View File

@@ -0,0 +1,12 @@
<script lang="ts" setup>
const props = withDefaults(defineProps<{
}>(), {
})
</script>
<template>
<div>
</div>
</template>

View File

@@ -0,0 +1,14 @@
---
map:
path: /d3
---
基于svg的可视化插件
# 官方地址
https://observablehq.com/@d3/gallery?utm_source=d3js-org&utm_medium=nav&utm_campaign=try-observable
<API src="./index.vue" lang="en"></API>

View File

@@ -2,10 +2,13 @@
map:
path: /le5le
---
拓扑图
# 官方文档
https://doc.le5le.com/document/119882449
拓扑图相关插件
# 注意事项

View File

@@ -2,10 +2,12 @@
map:
path: /le5le
---
拓扑图
# 官方文档
https://doc.le5le.com/document/119882449
拓扑图相关插件
# 注意事项

View File

@@ -0,0 +1,15 @@
---
map:
path: /selectpage
---
下拉选择组件
# 官方地址
https://github.com/TerryZ/v-selectpage/tree/dev-vue-2
# 注意事项
因多选选择以及回显有问题 已将源码复制到本地并修改

View File

@@ -0,0 +1,12 @@
<script lang="ts" setup>
const props = withDefaults(defineProps<{
}>(), {
})
</script>
<template>
<div>
</div>
</template>

View File

@@ -0,0 +1,14 @@
---
map:
path: /selectpage
---
下拉选择组件
# 官方地址
https://github.com/TerryZ/v-selectpage/tree/dev-vue-2
# 注意事项
因多选选择以及回显有问题 已将源码复制到本地并修改

View File

@@ -3,11 +3,15 @@ map:
path: /xterm
---
前端shell
# 官方地址
https://xtermjs.org/
# 注意事项
api 可以在xterm.js 的 TypeScript 声明文件中找到
宽高必须计算好 否则会导致换行错误
<API src="./index.vue" lang="en"></API>

View File

@@ -3,11 +3,15 @@ map:
path: /xterm
---
前端shell
# 官方地址
https://xtermjs.org/
# 注意事项
api 可以在xterm.js 的 TypeScript 声明文件中找到
宽高必须计算好 否则会导致换行错误
<API src="./index.vue" lang="zh"></API>

View File

@@ -6,7 +6,7 @@ map:
promql 输入组件
# 相关链接
codemirror : https://github.com/codemirror/codemirror5
codemirror : https://github.com/codemirror/codemirror5 <br>
codemirror-promql : https://github.com/prometheus/codemirror-promql

View File

@@ -6,7 +6,7 @@ map:
promql 输入组件
# 相关链接
codemirror : https://github.com/codemirror/codemirror5
codemirror : https://github.com/codemirror/codemirror5 <br>
codemirror-promql : https://github.com/prometheus/codemirror-promql

View File

@@ -0,0 +1,26 @@
---
map:
path: /multipleTime
---
时间选择器 同比组件
# 示例代码
```vue
<multipleTime
:stepSearchTime="searchTime"
class="multiple-time margin-r-10"
@change="dateChange(searchTime)"
/>
```
# 注意事项
回显需要赋值之后再次设置相应时间
<API src="./index.vue" lang="en"></API>

View File

@@ -0,0 +1,14 @@
<script lang="ts" setup>
const props = withDefaults(defineProps<{
}>(), {
})
</script>
<template>
<div>
</div>
</template>

View File

@@ -0,0 +1,27 @@
---
map:
path: /multipleTime
---
时间选择器 同比组件
# 示例代码
```vue
<multipleTime
:stepSearchTime="searchTime"
class="multiple-time margin-r-10"
@change="dateChange(searchTime)"
/>
```
# 注意事项
回显需要赋值之后再次设置相应时间
<API src="./index.vue" lang="zh"></API>

View File

@@ -0,0 +1,30 @@
---
map:
path: /pickTime
---
时间选择器组件
# 示例代码
```vue
<pick-time
v-model="searchTime"
sign="message"
:default-pick="defaultPick"
:refresh-data-func="dateChange"
:show-empty="true"
:use-chart-unit="false"
:use-refresh="true"
></pick-time>
```
# 注意事项
回显需要赋值之后再次设置相应时间
<API src="./index.vue" lang="en"></API>

View File

@@ -0,0 +1,56 @@
<script lang="ts" setup>
const props = withDefaults(defineProps<{
/**
* 绑定的时间数组
*/
model?: Array<any>,
/**
* 刷新函数
*/
refreshDataFunc?: Function,
/**
* 是否显示刷新
*/
useRefresh?: boolean
/**
* 是否显示chart单位
*/
useChartUnit?: boolean
/**
* 是否显示时间选择则
*/
showTimePicker?: boolean
/**
* 是否显示时间同比
*/
showMultiple?: boolean,
/**
* 默认显示时间
*/
defaultPick?: Number,
/**
* 是否可以设置为空
*/
showEmpty?: boolean,
/**
* 唯一id
*/
id?: String,
/**
* 标识 用于区分是底弹窗 还是主页面
*/
sign?: [Number, String],
/**
* 是否显示锁定
*/
showLocked?: boolean,
}>(), {
})
</script>
<template>
<div>
</div>
</template>

View File

@@ -0,0 +1,30 @@
---
map:
path: /pickTime
---
时间选择器组件
# 示例代码
```vue
<pick-time
v-model="searchTime"
sign="message"
:default-pick="defaultPick"
:refresh-data-func="dateChange"
:show-empty="true"
:use-chart-unit="false"
:use-refresh="true"
></pick-time>
```
# 注意事项
回显需要赋值之后再次设置相应时间
<API src="./index.vue" lang="zh"></API>