|
1 | 1 | <style lang="scss">
|
2 |
| - @import 'assets/scss/_demo.scss'; |
3 |
| - @import 'assets/scss/_cyan_theme.scss'; |
4 |
| - @import 'assets/scss/_prism.scss'; |
5 |
| - @import 'assets/scss/_octicons.scss'; |
| 2 | + @import './assets/scss/docs.scss'; |
| 3 | +
|
| 4 | + #sidebar nav { |
| 5 | + // position: fixed; |
| 6 | + // top: 0; |
| 7 | + } |
6 | 8 | </style>
|
7 | 9 |
|
8 | 10 | <template>
|
9 | 11 | <div id="docs" class="container-fluid">
|
10 |
| - <div class="col-md-2 col-md-offset-1"> |
11 |
| - <ul class="nav nav-pills nav-stacked"> |
12 |
| - <li><a href="#">Install & Usage</a></li> |
13 |
| - <li><a href="#">Examples</a></li> |
14 |
| - <li><a href="#">Ajax</a></li> |
15 |
| - <li><a href="#">Parameters</a></li> |
16 |
| - </ul> |
| 12 | + <div class="col-md-3" id="sidebar"> |
| 13 | + <nav> |
| 14 | + <div class="form-group"> |
| 15 | + <label class="control-label">Version</label> |
| 16 | + <v-select id="select-version" v-model="version" :searchable="false" :options="versions"></v-select> |
| 17 | + </div> |
| 18 | + <p v-if="version.v == 'v1'"><small><code>v1.x</code> of <code>vue-select</code> should be used with <code>vue 1.x</code></small></p> |
| 19 | + <sidebar></sidebar> |
| 20 | + </nav> |
17 | 21 | </div>
|
18 | 22 | <div class="col-md-7">
|
19 |
| - <article v-html="install"></article> |
20 |
| - <article v-html="vModel"></article> |
| 23 | + <article v-html="getDocHtml('install')"></article> |
| 24 | + <v-select v-model="selected" :options="['foo','bar']"></v-select> |
| 25 | + <!-- <article v-html="vModel"></article> |
21 | 26 | <article v-html="single"></article>
|
22 | 27 | <article v-html="reactive"></article>
|
23 | 28 | <article v-html="labels"></article>
|
24 |
| - <article v-html="ajax"></article> |
| 29 | + <article v-html="ajax"></article> --> |
25 | 30 | </div>
|
26 | 31 | </div>
|
27 | 32 | </template>
|
|
38 | 43 | // import Params from './components/Params.vue'
|
39 | 44 | // import Ajax from './components/snippets/Ajax.vue'
|
40 | 45 |
|
| 46 | +const docs = { |
| 47 | + 'v1.x': { |
| 48 | + install: require('./md/v2/install/Install.md'), |
| 49 | + vModel: require('./md/VModel.md'), |
| 50 | + single: require('./md/SingleMultiple.md'), |
| 51 | + reactive: require('./md/ReactiveOptions.md'), |
| 52 | + labels: require('./md/CustomLabels.md'), |
| 53 | + ajax: require('./md/Ajax.md'), |
| 54 | + }, |
| 55 | + 'v2.x': { |
| 56 | + install: require('./md/v2/install/Install.md'), |
| 57 | + vModel: require('./md/VModel.md'), |
| 58 | + single: require('./md/SingleMultiple.md'), |
| 59 | + reactive: require('./md/ReactiveOptions.md'), |
| 60 | + labels: require('./md/CustomLabels.md'), |
| 61 | + ajax: require('./md/Ajax.md'), |
| 62 | + } |
| 63 | +} |
| 64 | +
|
41 | 65 | export default {
|
42 | 66 | // components: { Params, Examples, Ajax }
|
43 | 67 | data () {
|
44 | 68 | return {
|
45 |
| - install: require('./md/Install.md'), |
46 |
| - vModel: require('./md/VModel.md'), |
47 |
| - single: require('./md/SingleMultiple.md'), |
48 |
| - reactive: require('./md/ReactiveOptions.md'), |
49 |
| - labels: require('./md/CustomLabels.md'), |
50 |
| - ajax: require('./md/Ajax.md'), |
| 69 | + docs, |
| 70 | + versions: ['v1.x','v2.x'], |
| 71 | + version: 'v2.x' |
51 | 72 | }
|
52 | 73 | },
|
| 74 | +
|
| 75 | + methods: { |
| 76 | + getDocHtml(doc) { |
| 77 | + return this.docs[this.version][doc] |
| 78 | + } |
| 79 | + } |
53 | 80 | }
|
54 | 81 | </script>
|
0 commit comments