Skip to content

Commit

Permalink
feat: 完善 Tooltip 文档、增加指令文档
Browse files Browse the repository at this point in the history
  • Loading branch information
Tenny committed Jan 31, 2024
1 parent d6267f5 commit 1eb6ea4
Show file tree
Hide file tree
Showing 5 changed files with 118 additions and 86 deletions.
88 changes: 44 additions & 44 deletions src/asides.ts
View file
Original file line number Diff line number Diff line change
@@ -1,51 +1,51 @@
export interface AsideItem {
name: string;
text: string;
showName?: boolean;
name: string;
text: string;
showName?: boolean;
}

/** 所有的侧边栏列表 */
const asids: AsideItem[] = [
{
name: "introduce",
showName: false,
text: "介绍",
},
{
name: "usage",
showName: false,
text: "快速上手",
},
{
name: "reset",
showName: false,
text: "样式重置",
},
{
name: "css_util",
showName: false,
text: "工具样式",
},
{
name: "---",
text: "",
showName: false,
},
{
name: "Container",
text: "容器布局",
},
{
name: "Icon",
text: "图标",
},
{
name: "Tooltip",
text: "文字提示",
},
{
name: "Table",
text: "表格",
},
{
name: 'introduce',
showName: false,
text: '介绍',
},
{
name: 'usage',
showName: false,
text: '快速上手',
},
{
name: 'reset',
showName: false,
text: '样式重置',
},
{
name: 'css_util',
showName: false,
text: '工具样式',
},
{
name: '---',
text: '',
showName: false,
},
{
name: 'Container',
text: '容器布局',
},
{
name: 'Directives',
text: '指令',
},
{
name: 'Icon',
text: '图标',
},
{
name: 'Tooltip',
text: '文字提示',
},
];
export default asids;
32 changes: 16 additions & 16 deletions src/index.ts
View file
Original file line number Diff line number Diff line change
@@ -1,16 +1,16 @@
export { default as BaseIcon } from "./components/Icon.vue";
export { default as MaskCloseIcon } from "./components/MaskCloseIcon.vue";
export { default as SearchIcon } from "./components/SearchIcon.vue";
export { default as Input } from "./components/Input.vue";
export { default as vClickoutside } from "./directives/clickoutside";
export { default as Table } from "./components/Table.vue";
export { default as FontIcon } from "./components/FontIcon.vue";
export { default as Button } from "./components/Button.vue";
export { default as LoadingIcon } from "./components/LoadingIcon.vue";
export { default as InfoIcon } from "./components/InfoIcon.vue";
export { default as WarnIcon } from "./components/WarnIcon.vue";
export { default as ErrorIcon } from "./components/ErrorIcon.vue";
export { default as SuccessIcon } from "./components/SuccessIcon.vue";
export { default as Message } from "./components/Message/index";
export { default as Card } from "./components/Card.vue"
export { default as Tooltip } from "./components/Tooltip.vue"
export { default as BaseIcon } from './components/Icon.vue';
export { default as MaskCloseIcon } from './components/MaskCloseIcon.vue';
export { default as SearchIcon } from './components/SearchIcon.vue';
export { default as Input } from './components/Input.vue';
export { default as vClickoutside } from './directives/clickoutside';
export { default as Table } from './components/Table.vue';
export { default as FontIcon } from './components/FontIcon.vue';
export { default as Button } from './components/Button.vue';
export { default as LoadingIcon } from './components/LoadingIcon.vue';
export { default as InfoIcon } from './components/InfoIcon.vue';
export { default as WarnIcon } from './components/WarnIcon.vue';
export { default as ErrorIcon } from './components/ErrorIcon.vue';
export { default as SuccessIcon } from './components/SuccessIcon.vue';
export { default as Message } from './components/Message/index';
export { default as Card } from './components/Card.vue';
export { default as Tooltip } from './components/Tooltip.vue';
32 changes: 16 additions & 16 deletions src/main.ts
View file
Original file line number Diff line number Diff line change
@@ -1,17 +1,17 @@
import { createApp } from "vue";
import "../style/reset.css";
import "../style/vars.css";
import "../style/container.css";
import "../style/icon/index.css";
import "../style/input/index.css";
import "../style/util/transition.css";
import "../style/util/scrollbar.css";
import "../style/table/index.css";
import "../style/util/animation.css";
import "../style/button/index.css";
import "../style/message/index.css";
import "../style/card/index.css";
import "../style/tooltip/index.css";
import App from "./App.vue";
import { createApp } from 'vue';
import '../style/reset.css';
import '../style/vars.css';
import '../style/container.css';
import '../style/icon/index.css';
import '../style/input/index.css';
import '../style/util/transition.css';
import '../style/util/scrollbar.css';
import '../style/table/index.css';
import '../style/util/animation.css';
import '../style/button/index.css';
import '../style/message/index.css';
import '../style/card/index.css';
import '../style/tooltip/index.css';
import App from './App.vue';

createApp(App).mount("#app");
createApp(App).mount('#app');
42 changes: 42 additions & 0 deletions src/views/Directives.vue
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,42 @@
<template>
<DocMain>
<h1>Directives</h1>
<p>提供了一些常用的自定义指令</p>
<CodeExample>
<PcCodePreview lang="html" :code="code" title="vClickoutside">
<template v-slot:description>
<p>
点击元素外事件, 常用于需要点击元素外，关闭某个弹窗; 例如:
Select、Tooltip
</p>
</template>
<template v-slot:preview>
<div style="width: 200px; height: 50px">
<Input
placeholder="输入过滤"
v-clickoutside="handleOutside"
></Input>
</div>
</template>
</PcCodePreview>
</CodeExample>
</DocMain>
</template>

<script lang="ts" setup>
import DocMain from '../app_components/DocMain.vue';
import Input from '../components/Input.vue';
import CodeExample from '../app_components/CodeExample.vue';
import PcCodePreview from '../app_components/PcCodePreview.vue';
import vClickoutside from '../directives/clickoutside';
const code = `
<div style="width: 200px; height: 50px;">
<nt-input placeholder="输入过滤" v-clickoutside="handleOutside"></nt-input>
</div>
`;
function handleOutside() {
console.log('outside click');
}
</script>
10 changes: 0 additions & 10 deletions src/views/Tooltip.vue
View file
Original file line number Diff line number Diff line change
Expand Up @@ -48,12 +48,10 @@
<h2>API</h2>
<PropTable :data="propData" title="Tooltip Props"></PropTable>
<SlotTable :data="slotData" title="Tooltip Slots"></SlotTable>
<ThemeTable :rows="vars"></ThemeTable>
</DocMain>
</template>

<script lang="ts" setup>
import ThemeTable from '../app_components/ThemeTable.vue';
import DocMain from '../app_components/DocMain.vue';
import CodeExample from '../app_components/CodeExample.vue';
import PcCodePreview from '../app_components/PcCodePreview.vue';
Expand Down Expand Up @@ -84,14 +82,6 @@ const code2 = `
</nt-tooltip>
`;
const vars = [
{
name: '',
description: '',
default: '',
},
];
const propData = [
{
name: 'title',
Expand Down

0 comments on commit 1eb6ea4

Please sign in to comment.