@opentiny/vue-docs 3.19.4 → 3.19.5
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/demos/pc/app/hrapprover/basic-usage-composition-api.vue +1 -0
- package/demos/pc/app/hrapprover/basic-usage.vue +1 -0
- package/demos/pc/app/hrapprover/category-type-composition-api.vue +1 -0
- package/demos/pc/app/hrapprover/category-type.vue +1 -0
- package/demos/pc/app/hrapprover/custom-service-composition-api.vue +1 -0
- package/demos/pc/app/hrapprover/custom-service.vue +1 -0
- package/demos/pc/app/hrapprover/disabled-composition-api.vue +1 -0
- package/demos/pc/app/hrapprover/disabled.vue +1 -0
- package/package.json +3 -3
- package/playground/App.vue +61 -36
- package/src/views/components/components.vue +4 -2
- package/src/views/layout/layout.vue +4 -1
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@opentiny/vue-docs",
|
|
3
|
-
"version": "3.19.
|
|
3
|
+
"version": "3.19.5",
|
|
4
4
|
"license": "MIT",
|
|
5
5
|
"dependencies": {
|
|
6
6
|
"@opentiny/vue-repl": "^1.1.2",
|
|
@@ -19,12 +19,12 @@
|
|
|
19
19
|
"@opentiny/vue": "~3.19.0",
|
|
20
20
|
"@opentiny/vue-common": "~3.19.0",
|
|
21
21
|
"@opentiny/vue-design-saas": "~3.19.0",
|
|
22
|
-
"@opentiny/vue-directive": "~3.19.0",
|
|
23
22
|
"@opentiny/vue-hooks": "~3.19.0",
|
|
23
|
+
"@opentiny/vue-directive": "~3.19.0",
|
|
24
24
|
"@opentiny/vue-design-aurora": "~3.19.0",
|
|
25
25
|
"@opentiny/vue-icon": "~3.19.0",
|
|
26
|
-
"@opentiny/vue-icon-multicolor": "~3.19.0",
|
|
27
26
|
"@opentiny/vue-icon-saas": "~3.19.0",
|
|
27
|
+
"@opentiny/vue-icon-multicolor": "~3.19.0",
|
|
28
28
|
"@opentiny/vue-theme": "~3.19.4",
|
|
29
29
|
"@opentiny/vue-theme-mobile": "~3.19.0",
|
|
30
30
|
"@opentiny/vue-theme-saas": "~3.19.0",
|
package/playground/App.vue
CHANGED
|
@@ -1,23 +1,18 @@
|
|
|
1
|
-
<script setup>
|
|
1
|
+
<script setup lang="jsx">
|
|
2
2
|
import { onMounted, reactive, nextTick } from 'vue'
|
|
3
3
|
import { Repl, useStore, File } from '@opentiny/vue-repl'
|
|
4
4
|
import '@opentiny/vue-repl/dist/style.css'
|
|
5
5
|
|
|
6
6
|
import Editor from '@vue/repl/codemirror-editor'
|
|
7
|
-
import {
|
|
8
|
-
ButtonGroup as TinyButtonGroup,
|
|
9
|
-
Select as TinySelect,
|
|
10
|
-
Option as TinyOption,
|
|
11
|
-
Switch as TinySwitch,
|
|
12
|
-
Notify
|
|
13
|
-
} from '@opentiny/vue'
|
|
7
|
+
import { TinyButtonGroup, TinyButton, TinySelect, TinyOption, TinySwitch, Notify } from '@opentiny/vue'
|
|
14
8
|
import { staticDemoPath, getWebdocPath } from '@/views/components/cmp-config'
|
|
15
9
|
import { fetchDemosFile } from '@/tools/utils'
|
|
16
10
|
import logoUrl from './assets/opentiny-logo.svg?url'
|
|
17
11
|
import GitHub from './icons/Github.vue'
|
|
18
12
|
import Share from './icons/Share.vue'
|
|
19
13
|
|
|
20
|
-
const VERSION = 'tiny-vue-version-3.
|
|
14
|
+
const VERSION = 'tiny-vue-version-3.19'
|
|
15
|
+
const NOTIFY_KEY = 'tiny-vue-playground-notify'
|
|
21
16
|
const LAYOUT = 'playground-layout'
|
|
22
17
|
const LAYOUT_REVERSE = 'playground-layout-reverse'
|
|
23
18
|
|
|
@@ -28,40 +23,57 @@ const isMobileFirst = tinyMode === 'mobile-first'
|
|
|
28
23
|
const isSaas = tinyTheme === 'saas'
|
|
29
24
|
const isPreview = searchObj.get('openMode') === 'preview' // 是否多端弹窗预览
|
|
30
25
|
|
|
31
|
-
const versions = ['3.19', '3.18', '3.17'
|
|
32
|
-
const
|
|
26
|
+
const versions = ['3.19', '3.18', '3.17']
|
|
27
|
+
const getVersion = () => {
|
|
28
|
+
if (isPreview) {
|
|
29
|
+
return versions[0]
|
|
30
|
+
}
|
|
31
|
+
if (versions.includes(localStorage.getItem(VERSION))) {
|
|
32
|
+
localStorage.getItem(VERSION)
|
|
33
|
+
}
|
|
34
|
+
return versions[0]
|
|
35
|
+
}
|
|
36
|
+
const latestVersion = getVersion()
|
|
33
37
|
const cdnHost = localStorage.getItem('setting-cdn')
|
|
34
38
|
|
|
35
39
|
const versionDelimiter = cdnHost.includes('npmmirror') ? '/' : '@'
|
|
36
40
|
const fileDelimiter = cdnHost.includes('npmmirror') ? 'files/' : ''
|
|
37
41
|
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
42
|
+
let notify
|
|
43
|
+
const showNotify = () => {
|
|
44
|
+
if (localStorage.getItem(NOTIFY_KEY) !== 'true' && !notify) {
|
|
45
|
+
const muteNotify = () => {
|
|
46
|
+
notify.close()
|
|
47
|
+
localStorage.setItem(NOTIFY_KEY, true)
|
|
48
|
+
}
|
|
49
|
+
notify = Notify({
|
|
50
|
+
type: 'info',
|
|
51
|
+
title: '温馨提示：',
|
|
52
|
+
message: () => (
|
|
53
|
+
<div>
|
|
54
|
+
<div>演练场仅保留最新的三个版本可选。</div>
|
|
55
|
+
<div style="text-align: right;margin-top: 12px;">
|
|
56
|
+
<TinyButton onClick={muteNotify} type={'primary'}>
|
|
57
|
+
不再提示
|
|
58
|
+
</TinyButton>
|
|
59
|
+
</div>
|
|
60
|
+
</div>
|
|
61
|
+
),
|
|
62
|
+
duration: -1,
|
|
63
|
+
position: 'top-right',
|
|
64
|
+
verticalOffset: 200
|
|
65
|
+
})
|
|
47
66
|
}
|
|
48
|
-
return `${cdnHost}/@opentiny/vue-runtime${versionDelimiter}${version}/${fileDelimiter}dist3/`
|
|
49
67
|
}
|
|
50
68
|
|
|
51
|
-
|
|
52
|
-
const getPcRuntime = (version) => {
|
|
53
|
-
if (isOldVersion(version)) {
|
|
54
|
-
return `${getRuntime(version)}tiny-vue.mjs`
|
|
55
|
-
}
|
|
56
|
-
return `${getRuntime(version)}tiny-vue-pc.mjs`
|
|
57
|
-
}
|
|
69
|
+
const getRuntime = (version) => `${cdnHost}/@opentiny/vue-runtime${versionDelimiter}${version}/${fileDelimiter}dist3/`
|
|
58
70
|
|
|
59
71
|
const createImportMap = (version) => {
|
|
60
72
|
const imports = {
|
|
61
73
|
'vue': `${cdnHost}/vue${versionDelimiter}3.4.27/${fileDelimiter}dist/vue.runtime.esm-browser.js`,
|
|
62
74
|
'echarts': `${cdnHost}/echarts${versionDelimiter}5.4.1/${fileDelimiter}dist/echarts.esm.js`,
|
|
63
75
|
'@vue/compiler-sfc': `${cdnHost}/@vue/compiler-sfc${versionDelimiter}3.4.27/${fileDelimiter}dist/compiler-sfc.esm-browser.js`,
|
|
64
|
-
'@opentiny/vue':
|
|
76
|
+
'@opentiny/vue': `${getRuntime(version)}tiny-vue-pc.mjs`,
|
|
65
77
|
'@opentiny/vue-icon': `${getRuntime(version)}tiny-vue-icon.mjs`,
|
|
66
78
|
'@opentiny/vue-locale': `${getRuntime(version)}tiny-vue-locale.mjs`,
|
|
67
79
|
'@opentiny/vue-common': `${getRuntime(version)}tiny-vue-common.mjs`,
|
|
@@ -72,8 +84,9 @@ const createImportMap = (version) => {
|
|
|
72
84
|
'sortablejs': `${cdnHost}/sortablejs${versionDelimiter}1.15.0/${fileDelimiter}modular/sortable.esm.js`
|
|
73
85
|
}
|
|
74
86
|
if (['aurora', 'saas'].includes(tinyTheme)) {
|
|
75
|
-
imports[
|
|
76
|
-
|
|
87
|
+
imports[
|
|
88
|
+
`@opentiny/vue-design-${tinyTheme}`
|
|
89
|
+
] = `${cdnHost}/@opentiny/vue-design-${tinyTheme}${versionDelimiter}${version}/${fileDelimiter}index.js`
|
|
77
90
|
}
|
|
78
91
|
if (isSaas) {
|
|
79
92
|
imports['@opentiny/vue-icon'] = `${getRuntime(version)}tiny-vue-icon-saas.mjs`
|
|
@@ -275,9 +288,9 @@ function share() {
|
|
|
275
288
|
|
|
276
289
|
<template>
|
|
277
290
|
<div class="header">
|
|
278
|
-
<div class="title"><img class="logo" :src="logoUrl" /> <span>OpenTiny Vue 演练场</span></div>
|
|
291
|
+
<div class="title"><img class="logo" :src="logoUrl" /> <span class="mobile-hide">OpenTiny Vue 演练场</span></div>
|
|
279
292
|
<div>
|
|
280
|
-
<span class="ml20">
|
|
293
|
+
<span class="ml20 mobile-hide">
|
|
281
294
|
布局方向:
|
|
282
295
|
<tiny-button-group
|
|
283
296
|
:data="state.layoutOptions"
|
|
@@ -285,13 +298,19 @@ function share() {
|
|
|
285
298
|
@change="changeLayout"
|
|
286
299
|
></tiny-button-group>
|
|
287
300
|
</span>
|
|
288
|
-
<span class="ml20">
|
|
301
|
+
<span class="ml20 mobile-hide">
|
|
289
302
|
布局反转:
|
|
290
303
|
<tiny-switch v-model="state.layoutReverse" mini @change="changeReserve"></tiny-switch>
|
|
291
304
|
</span>
|
|
292
305
|
<span class="ml20">
|
|
293
|
-
OpenTiny Vue 版本:
|
|
294
|
-
<tiny-select
|
|
306
|
+
<span class="mobile-hide">OpenTiny Vue 版本: </span>
|
|
307
|
+
<tiny-select
|
|
308
|
+
v-model="state.selectVersion"
|
|
309
|
+
style="width: 150px"
|
|
310
|
+
:disabled="isPreview"
|
|
311
|
+
@change="selectVersion"
|
|
312
|
+
@click="showNotify"
|
|
313
|
+
>
|
|
295
314
|
<tiny-option v-for="item in state.versions" :key="item.value" :label="item.value" :value="item.value">
|
|
296
315
|
</tiny-option>
|
|
297
316
|
</tiny-select>
|
|
@@ -317,6 +336,12 @@ function share() {
|
|
|
317
336
|
box-sizing: border-box;
|
|
318
337
|
}
|
|
319
338
|
|
|
339
|
+
/** 小屏幕时隐藏 */
|
|
340
|
+
@media screen and (max-width: 640px) {
|
|
341
|
+
.mobile-hide {
|
|
342
|
+
display: none;
|
|
343
|
+
}
|
|
344
|
+
}
|
|
320
345
|
#header {
|
|
321
346
|
display: none;
|
|
322
347
|
}
|
|
@@ -816,7 +816,6 @@ export default defineComponent({
|
|
|
816
816
|
flex: 1;
|
|
817
817
|
display: flex;
|
|
818
818
|
justify-content: center;
|
|
819
|
-
min-width: 680px;
|
|
820
819
|
padding: 0 40px;
|
|
821
820
|
}
|
|
822
821
|
|
|
@@ -837,7 +836,6 @@ export default defineComponent({
|
|
|
837
836
|
|
|
838
837
|
:deep(> .tiny-tabs__header) {
|
|
839
838
|
position: sticky;
|
|
840
|
-
top: 90px;
|
|
841
839
|
z-index: var(--docs-tabs-header-zindex);
|
|
842
840
|
background-color: #fff;
|
|
843
841
|
|
|
@@ -974,6 +972,10 @@ export default defineComponent({
|
|
|
974
972
|
column-gap: 16px;
|
|
975
973
|
}
|
|
976
974
|
|
|
975
|
+
.docs-content-main {
|
|
976
|
+
overflow: auto;
|
|
977
|
+
}
|
|
978
|
+
|
|
977
979
|
.cmp-container {
|
|
978
980
|
p {
|
|
979
981
|
font-size: 16px;
|
|
@@ -196,9 +196,12 @@ export default defineComponent({
|
|
|
196
196
|
.content-layout {
|
|
197
197
|
display: flex;
|
|
198
198
|
--layout-tree-menu-input-height: 32px;
|
|
199
|
-
--layout-content-main-min-width:
|
|
199
|
+
--layout-content-main-min-width: 200px;
|
|
200
200
|
--layout-content-main-max-width: 1000px;
|
|
201
201
|
}
|
|
202
|
+
@media screen and (max-width: 640px) {
|
|
203
|
+
--layout-content-main-min-width: 600px;
|
|
204
|
+
}
|
|
202
205
|
|
|
203
206
|
.tiny-tooltip.tiny-tooltip__popper.is-light.docs-tooltip {
|
|
204
207
|
border: none;
|