├── docs
├── CNAME
├── logo.png
├── css
│ ├── chunk-0cfbbad7.888eea00.css
│ ├── chunk-04af1953.7051b252.css
│ ├── chunk-a3c7b6b0.a1b39e08.css
│ ├── chunk-53e9630a.d2eebc5b.css
│ ├── chunk-1f37e7d9.e0ba6585.css
│ ├── chunk-fda0a66a.0630843b.css
│ ├── chunk-059022c4.edced4fe.css
│ ├── chunk-c499294a.eb3f40e2.css
│ ├── chunk-f0e1d732.8a2e582a.css
│ ├── chunk-c0f9c65c.585c88df.css
│ ├── chunk-5ec199f0.38972bee.css
│ └── chunk-566c242e.0c0acccb.css
├── js
│ ├── chunk-0cfbbad7.ec935633.js
│ ├── chunk-5ec199f0.cf5f01c9.js
│ ├── chunk-c0f9c65c.089272f4.js
│ ├── chunk-566c242e.e01c188b.js
│ ├── chunk-fda0a66a.9857bbb1.js
│ ├── chunk-1f37e7d9.0c9061fa.js
│ ├── chunk-04af1953.2a93ad4b.js
│ ├── chunk-0cfbbad7.ec935633.js.map
│ ├── chunk-059022c4.2cf680ae.js
│ └── chunk-c0f9c65c.089272f4.js.map
└── index.html
├── babel.config.js
├── src
├── navigation
│ ├── loading
│ │ ├── index.js
│ │ ├── loading.js
│ │ └── loading.vue
│ ├── pager
│ │ ├── index.js
│ │ └── pager.vue
│ ├── steps
│ │ ├── index.js
│ │ ├── steps.vue
│ │ └── step.vue
│ ├── sticky
│ │ ├── index.js
│ │ └── sticky.vue
│ ├── menu
│ │ ├── index.js
│ │ ├── menu.vue
│ │ ├── menu-item.vue
│ │ └── sub-menu.vue
│ └── tabs
│ │ ├── index.js
│ │ ├── tabs-pane.vue
│ │ ├── tabs-title.vue
│ │ └── tabs.vue
├── others
│ ├── formator
│ │ ├── index.js
│ │ └── formator.js
│ ├── spin
│ │ ├── index.js
│ │ ├── icon.vue
│ │ ├── spin.vue
│ │ └── svg.js
│ ├── scroll
│ │ ├── index.js
│ │ └── scroll.vue
│ ├── spread
│ │ ├── index.js
│ │ └── spread.vue
│ ├── validator
│ │ ├── index.js
│ │ └── validator.js
│ ├── jsonp
│ │ └── jsonp.js
│ └── tween
│ │ └── tweenScroll.js
├── basic
│ ├── icon
│ │ ├── index.js
│ │ └── icon.vue
│ ├── button
│ │ ├── index.js
│ │ └── button.vue
│ ├── group
│ │ ├── index.js
│ │ └── button-group.vue
│ └── color.scss
├── form
│ ├── input
│ │ ├── index.js
│ │ └── input.vue
│ ├── radio
│ │ ├── index.js
│ │ ├── radio.vue
│ │ └── option.vue
│ ├── switch
│ │ ├── index.js
│ │ └── switch.vue
│ ├── timepicker
│ │ └── index.js
│ ├── datepicker
│ │ └── index.js
│ └── cascader
│ │ ├── index.js
│ │ ├── cascader-item.vue
│ │ └── cascader.vue
├── viewport
│ ├── table
│ │ ├── index.js
│ │ └── table.vue
│ ├── popover
│ │ ├── index.js
│ │ └── popover.vue
│ ├── slides
│ │ ├── index.js
│ │ └── slides.vue
│ └── message
│ │ ├── message.vue
│ │ ├── confirm.vue
│ │ └── index.js
└── layout
│ ├── waterfall
│ ├── index.js
│ └── waterfall.vue
│ ├── container
│ ├── footer.vue
│ ├── header.vue
│ ├── main.vue
│ ├── index.js
│ ├── container.vue
│ └── sider.vue
│ ├── grid
│ ├── index.js
│ ├── row.vue
│ └── col.vue
│ └── collapse
│ ├── index.js
│ ├── collapse.vue
│ └── collapse-item.vue
├── .npmignore
├── .gitignore
├── README.md
├── LICENSE
├── package.json
└── index.js
/docs/CNAME:
--------------------------------------------------------------------------------
1 | xue-ui.com.cn
--------------------------------------------------------------------------------
/docs/logo.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/BlameDeng/xue-ui/HEAD/docs/logo.png
--------------------------------------------------------------------------------
/babel.config.js:
--------------------------------------------------------------------------------
1 | module.exports = {
2 | presets: [
3 | '@vue/app'
4 | ]
5 | }
6 |
--------------------------------------------------------------------------------
/src/navigation/loading/index.js:
--------------------------------------------------------------------------------
1 | import Loading from './loading.js'
2 |
3 | export default Loading
--------------------------------------------------------------------------------
/src/others/formator/index.js:
--------------------------------------------------------------------------------
1 | import Formator from './formator.js'
2 |
3 | export default Formator
--------------------------------------------------------------------------------
/.npmignore:
--------------------------------------------------------------------------------
1 | node_modules
2 | /docs
3 | /dist
4 | babel.config.js
5 | index.js
6 | yarn.lock
7 | yarn-error.log
--------------------------------------------------------------------------------
/src/basic/icon/index.js:
--------------------------------------------------------------------------------
1 | import Icon from './icon.vue'
2 |
3 | Icon.install = Vue => Vue.component(Icon.name, Icon)
4 |
5 | export default Icon
--------------------------------------------------------------------------------
/src/others/spin/index.js:
--------------------------------------------------------------------------------
1 | import Spin from './spin.vue'
2 |
3 | Spin.install = Vue => Vue.component(Spin.name, Spin)
4 |
5 | export default Spin
--------------------------------------------------------------------------------
/src/form/input/index.js:
--------------------------------------------------------------------------------
1 | import Input from './input.vue'
2 |
3 | Input.install = Vue => Vue.component(Input.name, Input)
4 |
5 | export default Input
--------------------------------------------------------------------------------
/src/viewport/table/index.js:
--------------------------------------------------------------------------------
1 | import Table from './table.vue'
2 |
3 | Table.install = Vue => Vue.component(Table.name, Table)
4 |
5 | export default Table
--------------------------------------------------------------------------------
/src/basic/button/index.js:
--------------------------------------------------------------------------------
1 | import Button from './button.vue'
2 |
3 | Button.install = Vue => Vue.component(Button.name, Button)
4 |
5 | export default Button
--------------------------------------------------------------------------------
/src/form/radio/index.js:
--------------------------------------------------------------------------------
1 | import Radio from './radio.vue'
2 |
3 | Radio.install = Vue => Vue.component(Radio.name, Radio)
4 |
5 | export default Radio
6 |
--------------------------------------------------------------------------------
/src/navigation/pager/index.js:
--------------------------------------------------------------------------------
1 | import Pager from './pager.vue'
2 |
3 | Pager.install = Vue => Vue.component(Pager.name, Pager)
4 |
5 | export default Pager
--------------------------------------------------------------------------------
/src/navigation/steps/index.js:
--------------------------------------------------------------------------------
1 | import Steps from './steps.vue'
2 |
3 | Steps.install = Vue => Vue.component(Steps.name, Steps)
4 |
5 | export default Steps
--------------------------------------------------------------------------------
/src/others/scroll/index.js:
--------------------------------------------------------------------------------
1 | import Scroll from './scroll.vue'
2 |
3 | Scroll.install = Vue => Vue.component(Scroll.name, Scroll)
4 |
5 | export default Scroll
--------------------------------------------------------------------------------
/src/others/spread/index.js:
--------------------------------------------------------------------------------
1 | import Spread from './spread.vue'
2 |
3 | Spread.install = Vue => Vue.component(Spread.name, Spread)
4 |
5 | export default Spread
--------------------------------------------------------------------------------
/src/form/switch/index.js:
--------------------------------------------------------------------------------
1 | import Switch from './switch.vue'
2 |
3 | Switch.install = Vue => Vue.component(Switch.name, Switch)
4 |
5 | export default Switch
6 |
--------------------------------------------------------------------------------
/src/navigation/sticky/index.js:
--------------------------------------------------------------------------------
1 | import Sticky from './sticky.vue'
2 |
3 | Sticky.install = Vue => Vue.component(Sticky.name, Sticky)
4 |
5 | export default Sticky
--------------------------------------------------------------------------------
/src/others/validator/index.js:
--------------------------------------------------------------------------------
1 | import Spread from './spread.vue'
2 |
3 | Spread.install = Vue => Vue.component(Spread.name, Spread)
4 |
5 | export default Spread
--------------------------------------------------------------------------------
/src/viewport/popover/index.js:
--------------------------------------------------------------------------------
1 | import Popover from './popover.vue'
2 |
3 | Popover.install = Vue => Vue.component(Popover.name, Popover)
4 |
5 | export default Popover
--------------------------------------------------------------------------------
/src/form/timepicker/index.js:
--------------------------------------------------------------------------------
1 | import TimePicker from './timepicker.vue'
2 |
3 | TimePicker.install = Vue => Vue.component(TimePicker.name,TimePicker)
4 |
5 | export default TimePicker
--------------------------------------------------------------------------------
/src/layout/waterfall/index.js:
--------------------------------------------------------------------------------
1 | import Waterfall from './waterfall.vue'
2 |
3 | Waterfall.install = Vue => Vue.component(Waterfall.name, Waterfall)
4 |
5 | export default Waterfall
--------------------------------------------------------------------------------
/src/viewport/slides/index.js:
--------------------------------------------------------------------------------
1 | import Slides from './slides.vue'
2 |
3 | Slides.install = Vue => {
4 | Vue.component(Slides.name, Slides)
5 | }
6 |
7 | export default Slides
8 |
--------------------------------------------------------------------------------
/src/basic/group/index.js:
--------------------------------------------------------------------------------
1 | import ButtonGroup from './button-group.vue'
2 |
3 | ButtonGroup.install = Vue => Vue.component(ButtonGroup.name, ButtonGroup)
4 |
5 | export default ButtonGroup
--------------------------------------------------------------------------------
/src/form/datepicker/index.js:
--------------------------------------------------------------------------------
1 | import DatePicker from './datepicker.vue'
2 |
3 | DatePicker.install = Vue => Vue.component(DatePicker.name, DatePicker)
4 |
5 | export default DatePicker
--------------------------------------------------------------------------------
/src/layout/container/footer.vue:
--------------------------------------------------------------------------------
1 |
2 |
5 |
6 |
--------------------------------------------------------------------------------
/src/layout/container/header.vue:
--------------------------------------------------------------------------------
1 |
2 |
5 |
6 |
--------------------------------------------------------------------------------
/src/layout/grid/index.js:
--------------------------------------------------------------------------------
1 | import Col from './col.vue'
2 | import Row from './row.vue'
3 |
4 | const Grid={}
5 |
6 | Grid.install = Vue => {
7 | Vue.component(Col.name, Col)
8 | Vue.component(Row.name, Row)
9 | }
10 |
11 | export default Grid
12 |
--------------------------------------------------------------------------------
/docs/css/chunk-0cfbbad7.888eea00.css:
--------------------------------------------------------------------------------
1 | .components[data-v-b8e2ebfa]{padding:80px 20px 20px 20px;margin:0 auto}@media (min-width:800px){.components[data-v-b8e2ebfa]{padding:80px 20px 20px 170px}}@media (min-width:1200px){.components[data-v-b8e2ebfa]{width:1200px;padding:80px 20px 20px 270px}}
--------------------------------------------------------------------------------
/src/form/cascader/index.js:
--------------------------------------------------------------------------------
1 | import Cascader from './cascader.vue'
2 | import CascaderItem from './cascader-item.vue'
3 |
4 | Cascader.install = Vue => {
5 | Vue.component(Cascader.name, Cascader)
6 | Vue.component(CascaderItem.name, CascaderItem)
7 | }
8 |
9 | export default Cascader
--------------------------------------------------------------------------------
/src/layout/collapse/index.js:
--------------------------------------------------------------------------------
1 | import Collapse from './collapse.vue'
2 | import CollapseItem from './collapse-item.vue'
3 |
4 | Collapse.install = Vue => {
5 | Vue.component(Collapse.name, Collapse)
6 | Vue.component(CollapseItem.name, CollapseItem)
7 | }
8 |
9 | export default Collapse
10 |
--------------------------------------------------------------------------------
/src/layout/container/main.vue:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
6 |
11 |
--------------------------------------------------------------------------------
/.gitignore:
--------------------------------------------------------------------------------
1 | .DS_Store
2 | node_modules
3 | /dist
4 |
5 | # local env files
6 | .env.local
7 | .env.*.local
8 |
9 | # Log files
10 | npm-debug.log*
11 | yarn-debug.log*
12 | yarn-error.log*
13 |
14 | # Editor directories and files
15 | .idea
16 | .vscode
17 | *.suo
18 | *.ntvs*
19 | *.njsproj
20 | *.sln
21 | *.sw*
22 |
--------------------------------------------------------------------------------
/src/navigation/menu/index.js:
--------------------------------------------------------------------------------
1 | import Menu from './menu.vue'
2 | import SubMenu from './sub-menu.vue'
3 | import MenuItem from './menu-item.vue'
4 |
5 | Menu.install = Vue => {
6 | Vue.component(Menu.name, Menu)
7 | Vue.component(SubMenu.name, SubMenu)
8 | Vue.component(MenuItem.name, MenuItem)
9 | }
10 |
11 | export default Menu
--------------------------------------------------------------------------------
/src/navigation/tabs/index.js:
--------------------------------------------------------------------------------
1 | import Tabs from './tabs.vue'
2 | import TabsTitle from './tabs-title.vue'
3 | import TabsPane from './tabs-pane.vue'
4 |
5 | Tabs.install = Vue => {
6 | Vue.component(Tabs.name, Tabs)
7 | Vue.component(TabsTitle.name, TabsTitle)
8 | Vue.component(TabsPane.name, TabsPane)
9 | }
10 |
11 | export default Tabs
12 |
--------------------------------------------------------------------------------
/src/layout/container/index.js:
--------------------------------------------------------------------------------
1 | import Container from './container.vue'
2 | import Header from './header.vue'
3 | import Main from './main.vue'
4 | import Sider from './sider.vue'
5 | import Footer from './footer.vue'
6 |
7 | Container.install = Vue => {
8 | Vue.component(Container.name, Container)
9 | Vue.component(Header.name, Header)
10 | Vue.component(Main.name, Main)
11 | Vue.component(Sider.name, Sider)
12 | Vue.component(Footer.name, Footer)
13 | }
14 |
15 | export default Container
16 |
--------------------------------------------------------------------------------
/docs/js/chunk-0cfbbad7.ec935633.js:
--------------------------------------------------------------------------------
1 | (window["webpackJsonp"]=window["webpackJsonp"]||[]).push([["chunk-0cfbbad7"],{"184a":function(n,e,t){"use strict";var a=t("aa03"),o=t.n(a);o.a},2311:function(n,e,t){"use strict";t.r(e);var a=function(){var n=this,e=n.$createElement,t=n._self._c||e;return t("div",{staticClass:"components"},[t("router-view")],1)},o=[],s={name:"Components"},c=s,i=(t("184a"),t("2877")),u=Object(i["a"])(c,a,o,!1,null,"b8e2ebfa",null);u.options.__file="Components.vue";e["default"]=u.exports},aa03:function(n,e,t){}}]);
2 | //# sourceMappingURL=chunk-0cfbbad7.ec935633.js.map
--------------------------------------------------------------------------------
/src/basic/color.scss:
--------------------------------------------------------------------------------
1 | $link:#1890ff;
2 | $success:#52c41a;
3 | $warning:#faad14;
4 | $error:#f5222d;
5 | $title:rgba(0, 0, 0, .85);
6 | $main:rgba(0, 0, 0, .65);
7 | $sub:rgba(0, 0, 0, .45);
8 | $disabled:rgba(0, 0, 0, 0.25);
9 | $border:rgba(0, 0, 0, .15);
10 | $divider:rgba(0, 0, 0, .09);
11 | $bg:rgba(0, 0, 0, .04);
12 | $habg:#f0fffe;
13 | $hover:#5ac4cc;
14 | $p:#36b1bf;
15 | $p1:#f0fffe;
16 | $p2:#dff2f2;
17 | $p3:#aee6e6;
18 | $p4:#82d6d9;
19 | $p5:#5ac4cc;
20 | $p6:#36b1bf;
21 | $p7:#238999;
22 | $p8:#156373;
23 | $p9:#0a3f4d;
24 | $p10:#051e26;
25 | $shadow:0 2px 8px rgba(0, 0, 0, .15);
26 | $borderbase:1px solid rgba(0, 0, 0, .15);
--------------------------------------------------------------------------------
/src/others/scroll/scroll.vue:
--------------------------------------------------------------------------------
1 |
2 |
6 |
7 |
24 |
--------------------------------------------------------------------------------
/src/navigation/tabs/tabs-pane.vue:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
6 |
19 |
--------------------------------------------------------------------------------
/src/others/jsonp/jsonp.js:
--------------------------------------------------------------------------------
1 | function jsonp(url, params) {
2 | return new Promise((resolve, reject) => {
3 | typeof url === 'string' ? '' : reject('url必须是字符串')
4 | let query = ''
5 | if (params) {
6 | typeof params === 'object' ? '' : reject('params只能为非空对象')
7 | let entries = Object.entries(params)
8 | entries.forEach(array => {
9 | let str = `${array[0]}=${array[1]}&`
10 | query += str
11 | })
12 | }
13 | window.jsonp_callbackfn = function(data) {
14 | resolve(data)
15 | script.remove()
16 | delete window.jsonp_callbackfn
17 | }
18 | let queryStr = url + '?' + query + 'callback=jsonp_callbackfn'
19 | let script = document.createElement('script')
20 | script.src = queryStr
21 | document.body.appendChild(script)
22 | })
23 | }
24 |
25 | export default jsonp
26 |
--------------------------------------------------------------------------------
/src/basic/icon/icon.vue:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
6 |
7 |
8 |
15 |
--------------------------------------------------------------------------------
/src/others/spin/icon.vue:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
6 |
7 |
8 |
15 |
--------------------------------------------------------------------------------
/src/others/tween/tweenScroll.js:
--------------------------------------------------------------------------------
1 | import TWEEN from '@tweenjs/tween.js'
2 |
3 | function animate(time) {
4 | requestAnimationFrame(animate)
5 | TWEEN.update(time)
6 | }
7 | requestAnimationFrame(animate)
8 |
9 | function tweenScroll(el, position, duration = 500) {
10 | let dom = null
11 | if (typeof el === 'string') {
12 | dom = document.querySelector(el)
13 | } else {
14 | dom = el
15 | }
16 | let x = 0
17 | let y = 0
18 | if (el === window) {
19 | x = window.scrollX
20 | y = window.scrollY
21 | } else {
22 | x = dom.scrollLeft
23 | y = dom.scrollTop
24 | }
25 | let coords = { x, y }
26 | new TWEEN.Tween(coords)
27 | .to({ x: position.x, y: position.y }, duration)
28 | .easing(TWEEN.Easing.Quadratic.Out)
29 | .onUpdate(function() {
30 | dom.scrollTo(coords.x, coords.y)
31 | })
32 | .start()
33 | }
34 |
35 | export default tweenScroll
--------------------------------------------------------------------------------
/README.md:
--------------------------------------------------------------------------------
1 | # Xue-ui
2 |
3 | 
4 |
5 | > 本组件库仅供学习交流,请勿在生产环境中使用
6 |
7 | [官方文档](https://xue-ui.com.cn)
8 | [React 实现](https://github.com/BlameDeng/xue-react)
9 |
10 | ## 安装
11 |
12 | 克隆官方仓库或者使用 npm / yarn 安装
13 |
14 | ```
15 | $ git clone git@github.com:BlameDeng/xue-ui.git
16 |
17 | $ npm install xue-ui
18 | $ yarn add xue-ui
19 | ```
20 |
21 | ## 使用
22 |
23 | 如果使用了 npm / yarn 安装,一般在 main.js 中如下配置:
24 |
25 | ```javascript
26 | import Vue from 'vue'
27 | import App from 'components/app.vue'
28 | import Xue from 'xue-ui'
29 | import 'xue-ui/lib/xue-ui.css'
30 | Vue.use(Xue)
31 | new Vue({
32 | el: '#app',
33 | render: h => h(App)
34 | })
35 | ```
36 |
37 | 以上代码便完成了 Xue-ui 的引入。需要注意的是,样式文件需要单独引入。
38 |
39 | ## 特别提醒
40 |
41 | 使用 Xue-ui 时,您需要使用 border-box 盒模型,否则会影响样式。代码示例:
42 |
43 | ```css
44 | *,
45 | *::before,
46 | *::after {
47 | margin: 0;
48 | padding: 0;
49 | box-sizing: border-box;
50 | }
51 | ```
52 |
53 | 如果您觉得还不错,请 star
54 |
--------------------------------------------------------------------------------
/src/layout/container/container.vue:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
6 |
28 |
--------------------------------------------------------------------------------
/LICENSE:
--------------------------------------------------------------------------------
1 | MIT License
2 |
3 | Copyright (c) 2018 BlameDeng
4 |
5 | Permission is hereby granted, free of charge, to any person obtaining a copy
6 | of this software and associated documentation files (the "Software"), to deal
7 | in the Software without restriction, including without limitation the rights
8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
9 | copies of the Software, and to permit persons to whom the Software is
10 | furnished to do so, subject to the following conditions:
11 |
12 | The above copyright notice and this permission notice shall be included in all
13 | copies or substantial portions of the Software.
14 |
15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
21 | SOFTWARE.
22 |
--------------------------------------------------------------------------------
/src/navigation/steps/steps.vue:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
6 |
29 |
--------------------------------------------------------------------------------
/src/layout/container/sider.vue:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
6 |
7 |
8 |
9 |
19 |
--------------------------------------------------------------------------------
/docs/css/chunk-04af1953.7051b252.css:
--------------------------------------------------------------------------------
1 | .navbar[data-v-2d14a3c0]{width:120px;min-height:100%;position:fixed;top:0;left:0;-ms-flex-negative:0;flex-shrink:0;padding-top:60px;-webkit-box-shadow:2px 0 2px 2px rgba(0,0,0,.05);box-shadow:2px 0 2px 2px rgba(0,0,0,.05);background:#fff;z-index:20}@media (min-width:800px){.navbar[data-v-2d14a3c0]{width:150px;min-height:100%;position:fixed;top:0;left:0;-ms-flex-negative:0;flex-shrink:0;padding-top:60px;-webkit-box-shadow:1px 0 1px 1px rgba(0,0,0,.05);box-shadow:1px 0 1px 1px rgba(0,0,0,.05)}}@media (min-width:1200px){.navbar[data-v-2d14a3c0]{width:250px}}@-webkit-keyframes circle-data-v-2d14a3c0{0%{-webkit-transform:rotate(0);transform:rotate(0)}to{-webkit-transform:rotate(1turn);transform:rotate(1turn)}}@keyframes circle-data-v-2d14a3c0{0%{-webkit-transform:rotate(0);transform:rotate(0)}to{-webkit-transform:rotate(1turn);transform:rotate(1turn)}}.slide-enter-active[data-v-2d14a3c0],.slide-leave-active[data-v-2d14a3c0]{-webkit-transition:-webkit-transform .3s linear;transition:-webkit-transform .3s linear;transition:transform .3s linear;transition:transform .3s linear,-webkit-transform .3s linear}.slide-enter-to[data-v-2d14a3c0],.slide-leave[data-v-2d14a3c0]{-webkit-transform:translateX(0);transform:translateX(0)}.slide-enter[data-v-2d14a3c0],.slide-leave-to[data-v-2d14a3c0]{-webkit-transform:translateX(-100%);transform:translateX(-100%)}
--------------------------------------------------------------------------------
/src/form/radio/radio.vue:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
6 |
33 |
--------------------------------------------------------------------------------
/src/layout/collapse/collapse.vue:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
6 |
37 |
--------------------------------------------------------------------------------
/src/layout/grid/row.vue:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
6 |
35 |
--------------------------------------------------------------------------------
/src/navigation/tabs/tabs-title.vue:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
6 |
29 |
--------------------------------------------------------------------------------
/src/navigation/loading/loading.js:
--------------------------------------------------------------------------------
1 | import Vue from 'vue'
2 | import loading from './loading.vue'
3 |
4 | const Loading = {
5 | bar: null,
6 | propsData: null,
7 | timer: null,
8 | install(Vue, options) {
9 | Vue.prototype.$Loading = this
10 | },
11 | config(options) {
12 | this.propsData = options
13 | },
14 | start() {
15 | this.bar && this.destroy()
16 | this.createBar()
17 | },
18 | createBar() {
19 | const div = document.createElement('div')
20 | document.body.appendChild(div)
21 | const Constructor = Vue.extend(loading)
22 | const vm = new Constructor({
23 | propsData: this.propsData
24 | }).$mount(div)
25 | this.bar = vm
26 | },
27 | finish() {
28 | if (this.timer) return
29 | if (this.bar) {
30 | this.bar.finish()
31 | this.timer = setTimeout(() => {
32 | this.destroy()
33 | }, 1200)
34 | }
35 | },
36 | error() {
37 | if (this.timer) return
38 | if (this.bar) {
39 | this.bar.error()
40 | this.timer = setTimeout(() => {
41 | this.destroy()
42 | }, 1200)
43 | }
44 | },
45 | clearTimer() {
46 | if (this.timer) {
47 | window.clearTimeout(this.timer)
48 | this.timer = null
49 | }
50 | },
51 | destroy() {
52 | this.bar && this.bar.destroyEle()
53 | this.bar = null
54 | this.clearTimer()
55 | }
56 | }
57 |
58 | export default Loading
--------------------------------------------------------------------------------
/docs/css/chunk-a3c7b6b0.a1b39e08.css:
--------------------------------------------------------------------------------
1 | .base section[data-v-474cb6ab]{padding-bottom:40px}.base section a[data-v-474cb6ab]{color:#1890ff;padding:0 8px;background:rgba(0,0,0,.04);border-radius:4px}.base section a[data-v-474cb6ab]:hover{text-decoration:underline}.base section .key[data-v-474cb6ab]{color:#df24f8;font-size:inherit;font-weight:600}.base section .str[data-v-474cb6ab]{color:#42b983;font-size:inherit;font-weight:600}.base section .tag[data-v-474cb6ab]{color:#007acc;color:#3e76f6;font-size:inherit;font-weight:600}.base section .code[data-v-474cb6ab]{font-family:Helvetica Neue,Helvetica,PingFang SC,Hiragino Sans GB,Microsoft YaHei,"\5FAE\8F6F\96C5\9ED1",Arial,sans-serif;padding:0 6px;background:rgba(0,0,0,.04);color:rgba(0,0,0,.65);border-radius:4px;font-size:14px;font-weight:600}.base section pre.code[data-v-474cb6ab]{padding:10px}.base section .container[data-v-474cb6ab]{border:1px solid rgba(0,0,0,.15);padding:20px;border-radius:4px;-webkit-box-shadow:0 2px 2px rgba(0,0,0,.05);box-shadow:0 2px 2px rgba(0,0,0,.05);margin:10px 0}.base section .example[data-v-474cb6ab]{margin-bottom:10px}.base section table[data-v-474cb6ab]{border-collapse:collapse;line-height:1.8em;width:100%}.base section table tr[data-v-474cb6ab]{border-bottom:1px solid rgba(0,0,0,.15)}.base section table td[data-v-474cb6ab],.base section table th[data-v-474cb6ab]{min-width:80px;max-width:250px;text-align:center;padding:15px 10px}.base section table td.des[data-v-474cb6ab],.base section table td.type[data-v-474cb6ab],.base section table th.des[data-v-474cb6ab],.base section table th.type[data-v-474cb6ab]{text-align:start;min-width:100px;max-width:300px}
--------------------------------------------------------------------------------
/docs/js/chunk-5ec199f0.cf5f01c9.js:
--------------------------------------------------------------------------------
1 | (window["webpackJsonp"]=window["webpackJsonp"]||[]).push([["chunk-5ec199f0"],{"6a26":function(n,t,i){"use strict";i.r(t);var e=function(){var n=this,t=n.$createElement,i=n._self._c||t;return i("div",{staticClass:"header"},[i("div",{staticClass:"menu"},[i("x-icon",{staticClass:"icon",attrs:{name:"menu"},on:{click:n.onClickMenu}})],1),i("div",{staticClass:"logo",on:{click:function(t){n.link("index")}}},[i("span",{staticClass:"icon"},[i("x-icon",{staticStyle:{width:"100%",height:"100%",color:"#1890ff"},attrs:{name:"snow"}})],1),n._m(0)]),i("ul",{staticClass:"navbar"},[i("li",{on:{click:function(t){n.link("github")}}},[i("x-icon",{staticStyle:{"margin-right":"3px",color:"rgba(0,0,0,0.85)"},attrs:{name:"github"}}),n._v("\n Github\n ")],1),i("li",{on:{click:function(t){n.link("react")}}},[n._v("\n Xue-react\n ")])])])},c=[function(){var n=this,t=n.$createElement,i=n._self._c||t;return i("h1",{staticClass:"title"},[i("span",[n._v("X")]),n._v("ue - ui")])}],a=(i("cadf"),i("551c"),i("097d"),{name:"Header",inject:["eventBus"],mounted:function(){},methods:{link:function(n){"index"===n&&this.$router.push("/"),"github"===n&&window.open("https://github.com/BlameDeng/xue-ui","_blank"),"react"===n&&window.open("https://github.com/BlameDeng/xue-react","_blank")},onClickMenu:function(){this.eventBus.$emit("click-menu")}}}),s=a,o=(i("885b"),i("2877")),u=Object(o["a"])(s,e,c,!1,null,"cb3df662",null);u.options.__file="header.vue";t["default"]=u.exports},8245:function(n,t,i){},"885b":function(n,t,i){"use strict";var e=i("8245"),c=i.n(e);c.a}}]);
2 | //# sourceMappingURL=chunk-5ec199f0.cf5f01c9.js.map
--------------------------------------------------------------------------------
/docs/js/chunk-c0f9c65c.089272f4.js:
--------------------------------------------------------------------------------
1 | (window["webpackJsonp"]=window["webpackJsonp"]||[]).push([["chunk-c0f9c65c"],{"50d4":function(t,s,e){"use strict";var a=e("e7ef"),n=e.n(a);n.a},e46f:function(t,s,e){"use strict";e.r(s);var a=function(){var t=this,s=t.$createElement,e=t._self._c||s;return e("div",{staticClass:"introduction"},[t._m(0),e("x-linker",{attrs:{to:{path:"install",text:"安装"}}})],1)},n=[function(){var t=this,s=t.$createElement,e=t._self._c||s;return e("section",[e("h1",{staticClass:"title",staticStyle:{color:"#515a6e"}},[t._v("介绍")]),e("h2",[t._v("写在前面")]),e("p",{staticClass:"des"},[t._v("\n 这是我出于提升自己对"),e("span",{staticClass:"code"},[t._v("Vue")]),t._v("和组件化开发的理解而制作的一个"),e("span",{staticClass:"code"},[t._v("UI")]),t._v("组件库。\n ")]),e("h2",[t._v("项目特点")]),e("ul",{staticClass:"feature"},[e("li",[t._v("使用了重构、设计模式、单向数据流等技术概念。")]),e("li",[t._v("使用"),e("span",{staticClass:"code"},[t._v("Vue")]),t._v("的多种功能。")]),e("li",[t._v("组件的样式、色彩的搭配参考了一些成熟的"),e("span",{staticClass:"code"},[t._v("UI")]),t._v("框架(如"),e("span",{staticClass:"code"},[t._v("Element UI")]),t._v("、"),e("span",{staticClass:"code"},[t._v("iView")]),t._v(")。")])]),e("p",{staticClass:"des"},[t._v("\n 目前代码尚未完工,持续更新中。本组件库仅供学习交流,请勿在生产环境中使用。\n 欢迎讨论交流,如果你觉得还不错,请"),e("a",{staticStyle:{"font-style":"italic","font-size":"16px"},attrs:{href:"https://github.com/BlameDeng/xue-ui",target:"_blank"}},[t._v("Star")]),t._v("。\n ")])])}],i={name:"Introduction"},c=i,l=(e("50d4"),e("2877")),o=Object(l["a"])(c,a,n,!1,null,"83bbbf80",null);o.options.__file="Introduction.vue";s["default"]=o.exports},e7ef:function(t,s,e){}}]);
2 | //# sourceMappingURL=chunk-c0f9c65c.089272f4.js.map
--------------------------------------------------------------------------------
/src/others/validator/validator.js:
--------------------------------------------------------------------------------
1 | class Validator {
2 | constructor(rules) {
3 | this.rules = rules;
4 | }
5 | validate(data) {
6 | if (!(data instanceof Array) || !data.length) {
7 | return { info: '参数必须为非空数组' };
8 | }
9 | let copy = [];
10 | data.forEach(item => {
11 | if (this.rules) { let temp = Object.assign({}, item, this.rules); }
12 | copy.push(temp);
13 | })
14 | let error = {};
15 | for (let i = 0; i < copy.length; i++) {
16 | const item = copy[i];
17 | let keys = Object.keys(item);
18 | let value = item.value;
19 | let name = item.name;
20 | if (item.required && !item.value && item.value !== 0) {
21 | this.ensureObject(error, name);
22 | error[name] = { required: '不能为空' };
23 | return error;
24 | }
25 | for (let i = 0; i < keys.length; i++) {
26 | const key = keys[i];
27 | if (key === 'name' || key === 'required' || key === 'value') {} else {
28 | if (!item[key].test(value)) {
29 | this.ensureObject(error, name);
30 | error[name] = Object.assign(error[name], {
31 | [`${key}`]: '格式不正确'
32 | });
33 | }
34 | }
35 | }
36 | }
37 | return error;
38 | }
39 |
40 | ensureObject(object, name) {
41 | (typeof object[name] !== 'object') ? object[name] = {}: '';
42 | }
43 | }
44 |
45 | export default Validator
--------------------------------------------------------------------------------
/package.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "xue-ui",
3 | "version": "0.1.5",
4 | "description": "> 一套基于 Vue 2.5 的 UI 组件库。",
5 | "main": "lib/xue-ui.umd.min.js",
6 | "scripts": {
7 | "test": "echo \"Error: no test specified\" && exit 1",
8 | "serve": "vue-cli-service serve",
9 | "build": "vue-cli-service build --target lib --name xue-ui index.js",
10 | "lint": "vue-cli-service lint"
11 | },
12 | "repository": {
13 | "type": "git",
14 | "url": "git+https://github.com/BlameDeng/xue-ui.git"
15 | },
16 | "author": "blame",
17 | "license": "MIT",
18 | "bugs": {
19 | "url": "https://github.com/BlameDeng/xue-ui/issues"
20 | },
21 | "homepage": "https://github.com/BlameDeng/xue-ui#readme",
22 | "dependencies": {
23 | "vue": "^2.5.17",
24 | "@tweenjs/tween.js": "^17.2.0"
25 | },
26 | "devDependencies": {
27 | "@vue/cli-plugin-babel": "^3.1.1",
28 | "@vue/cli-plugin-eslint": "^3.1.1",
29 | "@vue/cli-service": "^3.1.1",
30 | "babel-eslint": "^10.0.1",
31 | "eslint": "^5.8.0",
32 | "eslint-plugin-vue": "^5.0.0-0",
33 | "node-sass": "^4.9.0",
34 | "sass-loader": "^7.0.1",
35 | "vue-template-compiler": "^2.5.17"
36 | },
37 | "eslintConfig": {
38 | "root": true,
39 | "env": {
40 | "node": true
41 | },
42 | "extends": [
43 | "plugin:vue/essential",
44 | "eslint:recommended"
45 | ],
46 | "rules": {},
47 | "parserOptions": {
48 | "parser": "babel-eslint"
49 | }
50 | },
51 | "postcss": {
52 | "plugins": {
53 | "autoprefixer": {}
54 | }
55 | },
56 | "browserslist": [
57 | "> 1%",
58 | "last 2 versions",
59 | "not ie <= 8"
60 | ]
61 | }
62 |
--------------------------------------------------------------------------------
/docs/css/chunk-53e9630a.d2eebc5b.css:
--------------------------------------------------------------------------------
1 | .viewport section[data-v-95b61a34]{padding-bottom:40px}.viewport section a[data-v-95b61a34]{color:#1890ff;padding:0 8px;background:rgba(0,0,0,.04);border-radius:4px}.viewport section a[data-v-95b61a34]:hover{text-decoration:underline}.viewport section .key[data-v-95b61a34]{color:#df24f8;font-size:inherit;font-weight:600}.viewport section .str[data-v-95b61a34]{color:#42b983;font-size:inherit;font-weight:600}.viewport section .tag[data-v-95b61a34]{color:#007acc;color:#3e76f6;font-size:inherit;font-weight:600}.viewport section .code[data-v-95b61a34]{font-family:Helvetica Neue,Helvetica,PingFang SC,Hiragino Sans GB,Microsoft YaHei,"\5FAE\8F6F\96C5\9ED1",Arial,sans-serif;padding:0 6px;background:rgba(0,0,0,.04);color:rgba(0,0,0,.65);border-radius:4px;font-size:14px;font-weight:600}.viewport section pre.code[data-v-95b61a34]{padding:10px}.viewport section .container[data-v-95b61a34]{border:1px solid rgba(0,0,0,.15);padding:20px;border-radius:4px;-webkit-box-shadow:0 2px 2px rgba(0,0,0,.05);box-shadow:0 2px 2px rgba(0,0,0,.05);margin:10px 0}.viewport section .example[data-v-95b61a34]{margin-bottom:10px}.viewport section table[data-v-95b61a34]{border-collapse:collapse;line-height:1.8em;width:100%}.viewport section table tr[data-v-95b61a34]{border-bottom:1px solid rgba(0,0,0,.15)}.viewport section table td[data-v-95b61a34],.viewport section table th[data-v-95b61a34]{min-width:80px;max-width:250px;text-align:center;padding:15px 10px}.viewport section table td.des[data-v-95b61a34],.viewport section table td.type[data-v-95b61a34],.viewport section table th.des[data-v-95b61a34],.viewport section table th.type[data-v-95b61a34]{text-align:start;min-width:100px;max-width:300px}.viewport .img[data-v-95b61a34]{height:200px;line-height:200px;text-align:center;width:100%;background:#58c4d0;font-size:24px;color:#fff}
--------------------------------------------------------------------------------
/docs/css/chunk-1f37e7d9.e0ba6585.css:
--------------------------------------------------------------------------------
1 | .start[data-v-96b6473a]{padding:80px 20px 20px 20px;margin:0 auto}.start section[data-v-96b6473a]{padding-bottom:40px}.start section a[data-v-96b6473a]{color:#1890ff;padding:0 8px;background:rgba(0,0,0,.04);border-radius:4px}.start section a[data-v-96b6473a]:hover{text-decoration:underline}.start section .key[data-v-96b6473a]{color:#df24f8;font-size:inherit;font-weight:600}.start section .str[data-v-96b6473a]{color:#42b983;font-size:inherit;font-weight:600}.start section .tag[data-v-96b6473a]{color:#007acc;color:#3e76f6;font-size:inherit;font-weight:600}.start section .code[data-v-96b6473a]{font-family:Helvetica Neue,Helvetica,PingFang SC,Hiragino Sans GB,Microsoft YaHei,"\5FAE\8F6F\96C5\9ED1",Arial,sans-serif;padding:0 6px;background:rgba(0,0,0,.04);color:rgba(0,0,0,.65);border-radius:4px;font-size:14px;font-weight:600}.start section pre.code[data-v-96b6473a]{padding:10px}.start section .container[data-v-96b6473a]{border:1px solid rgba(0,0,0,.15);padding:20px;border-radius:4px;-webkit-box-shadow:0 2px 2px rgba(0,0,0,.05);box-shadow:0 2px 2px rgba(0,0,0,.05);margin:10px 0}.start section .example[data-v-96b6473a]{margin-bottom:10px}.start section table[data-v-96b6473a]{border-collapse:collapse;line-height:1.8em;width:100%}.start section table tr[data-v-96b6473a]{border-bottom:1px solid rgba(0,0,0,.15)}.start section table td[data-v-96b6473a],.start section table th[data-v-96b6473a]{min-width:80px;max-width:250px;text-align:center;padding:15px 10px}.start section table td.des[data-v-96b6473a],.start section table td.type[data-v-96b6473a],.start section table th.des[data-v-96b6473a],.start section table th.type[data-v-96b6473a]{text-align:start;min-width:100px;max-width:300px}@media (min-width:800px){.start[data-v-96b6473a]{padding:80px 20px 20px 170px}}@media (min-width:1200px){.start[data-v-96b6473a]{width:1200px;padding:80px 20px 20px 270px}}
--------------------------------------------------------------------------------
/docs/js/chunk-566c242e.e01c188b.js:
--------------------------------------------------------------------------------
1 | (window["webpackJsonp"]=window["webpackJsonp"]||[]).push([["chunk-566c242e"],{"9c60":function(t,s,i){},a7c7:function(t,s,i){"use strict";var n=i("9c60"),e=i.n(n);e.a},d504:function(t,s,i){"use strict";i.r(s);var n=function(){var t=this,s=t.$createElement,i=t._self._c||s;return i("div",{staticClass:"index"},[i("div",{staticClass:"logo"},[i("span",{staticClass:"icon"},[i("x-icon",{staticStyle:{width:"100%",height:"100%"},attrs:{name:"snow"}})],1),t._m(0)]),i("div",{staticClass:"theme"},[t._m(1),t._m(2),i("div",{staticClass:"keywords"},[t._v("简约 轻巧 好用")]),i("ul",{staticClass:"link"},[i("li",{on:{click:function(s){t.link("doc")}}},[t._v("开始使用")]),i("li",{on:{click:function(s){t.link("github")}}},[i("x-icon",{staticStyle:{"margin-right":"3px"},attrs:{name:"github"}}),t._v("GitHub\n ")],1)])]),t._m(3)])},e=[function(){var t=this,s=t.$createElement,i=t._self._c||s;return i("h1",{staticClass:"text"},[i("span",[t._v("X")]),t._v("ue - ui")])},function(){var t=this,s=t.$createElement,i=t._self._c||s;return i("h1",{staticClass:"title"},[i("span",[t._v("X")]),t._v("ue-ui")])},function(){var t=this,s=t.$createElement,i=t._self._c||s;return i("div",{staticClass:"des"},[i("span",{staticClass:"wpc"},[t._v("一套基于 Vue 2.5 的 UI 组件库")]),i("p",{staticClass:"npc"},[t._v("一套基于 Vue 2.5 的")]),i("p",{staticClass:"npc"},[t._v("UI 组件库")])])},function(){var t=this,s=t.$createElement,i=t._self._c||s;return i("footer",{staticClass:"right"},[i("span",[t._v("遵循 MIT 开源协议")]),i("span",[t._v("Copyright © 2018 Blame")])])}],a={name:"Index",methods:{link:function(t){"doc"===t&&this.$router.push("/introduction"),"github"===t&&window.open("https://github.com/BlameDeng/xue-ui","_blank")}}},c=a,l=(i("a7c7"),i("2877")),u=Object(l["a"])(c,n,e,!1,null,"6ae5b59e",null);u.options.__file="Index.vue";s["default"]=u.exports}}]);
2 | //# sourceMappingURL=chunk-566c242e.e01c188b.js.map
--------------------------------------------------------------------------------
/docs/css/chunk-fda0a66a.0630843b.css:
--------------------------------------------------------------------------------
1 | .install[data-v-ff8b92c2]{padding:80px 20px 20px 20px;margin:0 auto}.install section[data-v-ff8b92c2]{padding-bottom:40px}.install section a[data-v-ff8b92c2]{color:#1890ff;padding:0 8px;background:rgba(0,0,0,.04);border-radius:4px}.install section a[data-v-ff8b92c2]:hover{text-decoration:underline}.install section .key[data-v-ff8b92c2]{color:#df24f8;font-size:inherit;font-weight:600}.install section .str[data-v-ff8b92c2]{color:#42b983;font-size:inherit;font-weight:600}.install section .tag[data-v-ff8b92c2]{color:#007acc;color:#3e76f6;font-size:inherit;font-weight:600}.install section .code[data-v-ff8b92c2]{font-family:Helvetica Neue,Helvetica,PingFang SC,Hiragino Sans GB,Microsoft YaHei,"\5FAE\8F6F\96C5\9ED1",Arial,sans-serif;padding:0 6px;background:rgba(0,0,0,.04);color:rgba(0,0,0,.65);border-radius:4px;font-size:14px;font-weight:600}.install section pre.code[data-v-ff8b92c2]{padding:10px}.install section .container[data-v-ff8b92c2]{border:1px solid rgba(0,0,0,.15);padding:20px;border-radius:4px;-webkit-box-shadow:0 2px 2px rgba(0,0,0,.05);box-shadow:0 2px 2px rgba(0,0,0,.05);margin:10px 0}.install section .example[data-v-ff8b92c2]{margin-bottom:10px}.install section table[data-v-ff8b92c2]{border-collapse:collapse;line-height:1.8em;width:100%}.install section table tr[data-v-ff8b92c2]{border-bottom:1px solid rgba(0,0,0,.15)}.install section table td[data-v-ff8b92c2],.install section table th[data-v-ff8b92c2]{min-width:80px;max-width:250px;text-align:center;padding:15px 10px}.install section table td.des[data-v-ff8b92c2],.install section table td.type[data-v-ff8b92c2],.install section table th.des[data-v-ff8b92c2],.install section table th.type[data-v-ff8b92c2]{text-align:start;min-width:100px;max-width:300px}@media (min-width:800px){.install[data-v-ff8b92c2]{padding:80px 20px 20px 170px}}@media (min-width:1200px){.install[data-v-ff8b92c2]{width:1200px;padding:80px 20px 20px 270px}}
--------------------------------------------------------------------------------
/src/others/formator/formator.js:
--------------------------------------------------------------------------------
1 | class Formator {
2 | constructor() {}
3 |
4 | relativeTime(data) {
5 | if (!data) { return '参数不能为空' }
6 | let dateObj
7 | if (typeof data === 'string' || typeof data === 'number') {
8 | dateObj = new Date(data)
9 | } else if (typeof data === 'object') {
10 | dateObj = data
11 | } else { return '参数只能是字符串、数字或者日期时间对象' }
12 | let now = Date.now()
13 | let time = dateObj.getTime()
14 | let space = (now - time) / 1000 //秒
15 | if (space < 60) { return '刚刚' }
16 | if (space < 60 * 60) {
17 | return Math.floor(space / 60) + '分钟前'
18 | }
19 | if (space < 60 * 60 * 24) {
20 | return Math.floor(space / (60 * 60)) + '小时前'
21 | } else {
22 | return Math.floor(space / (60 * 60 * 24)) + '天前'
23 | }
24 | }
25 |
26 | timeStr(params) {
27 | let data
28 | if (typeof params === 'string') {
29 | data = new Date(params)
30 | } else {
31 | data = params
32 | }
33 | let year = data.getFullYear()
34 | let month = this.fixed(data.getMonth() + 1)
35 | let date = this.fixed(data.getDate())
36 | let day = this.switchDay(data.getDay())
37 | let hour = this.fixed(data.getHours())
38 | let minutes = this.fixed(data.getMinutes())
39 | let seconds = this.fixed(data.getSeconds())
40 | return { date: `${year}-${month}-${date}`, time: `${hour}:${minutes}:${seconds}`, day }
41 | }
42 |
43 | fixed(params) {
44 | if (params > 9) {
45 | return params
46 | } else {
47 | return `0${params}`
48 | }
49 | }
50 |
51 | switchDay(params) {
52 | return ['星期天', '星期一', '星期二', '星期三', '星期四', '星期五', '星期六'][params]
53 | }
54 | }
55 |
56 | export default Formator
--------------------------------------------------------------------------------
/docs/css/chunk-059022c4.edced4fe.css:
--------------------------------------------------------------------------------
1 | .others section[data-v-6aca6bde]{padding-bottom:40px}.others section a[data-v-6aca6bde]{color:#1890ff;padding:0 8px;background:rgba(0,0,0,.04);border-radius:4px}.others section a[data-v-6aca6bde]:hover{text-decoration:underline}.others section .key[data-v-6aca6bde]{color:#df24f8;font-size:inherit;font-weight:600}.others section .str[data-v-6aca6bde]{color:#42b983;font-size:inherit;font-weight:600}.others section .tag[data-v-6aca6bde]{color:#007acc;color:#3e76f6;font-size:inherit;font-weight:600}.others section .code[data-v-6aca6bde]{font-family:Helvetica Neue,Helvetica,PingFang SC,Hiragino Sans GB,Microsoft YaHei,"\5FAE\8F6F\96C5\9ED1",Arial,sans-serif;padding:0 6px;background:rgba(0,0,0,.04);color:rgba(0,0,0,.65);border-radius:4px;font-size:14px;font-weight:600}.others section pre.code[data-v-6aca6bde]{padding:10px}.others section .container[data-v-6aca6bde]{border:1px solid rgba(0,0,0,.15);padding:20px;border-radius:4px;-webkit-box-shadow:0 2px 2px rgba(0,0,0,.05);box-shadow:0 2px 2px rgba(0,0,0,.05);margin:10px 0}.others section .example[data-v-6aca6bde]{margin-bottom:10px}.others section table[data-v-6aca6bde]{border-collapse:collapse;line-height:1.8em;width:100%}.others section table tr[data-v-6aca6bde]{border-bottom:1px solid rgba(0,0,0,.15)}.others section table td[data-v-6aca6bde],.others section table th[data-v-6aca6bde]{min-width:80px;max-width:250px;text-align:center;padding:15px 10px}.others section table td.des[data-v-6aca6bde],.others section table td.type[data-v-6aca6bde],.others section table th.des[data-v-6aca6bde],.others section table th.type[data-v-6aca6bde]{text-align:start;min-width:100px;max-width:300px}.others .spinning-controller[data-v-6aca6bde]{height:102px;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-pack:space-evenly;-ms-flex-pack:space-evenly;justify-content:space-evenly;margin-right:20px}
--------------------------------------------------------------------------------
/docs/css/chunk-c499294a.eb3f40e2.css:
--------------------------------------------------------------------------------
1 | .form section[data-v-dd19f768]{padding-bottom:40px}.form section a[data-v-dd19f768]{color:#1890ff;padding:0 8px;background:rgba(0,0,0,.04);border-radius:4px}.form section a[data-v-dd19f768]:hover{text-decoration:underline}.form section .key[data-v-dd19f768]{color:#df24f8;font-size:inherit;font-weight:600}.form section .str[data-v-dd19f768]{color:#42b983;font-size:inherit;font-weight:600}.form section .tag[data-v-dd19f768]{color:#007acc;color:#3e76f6;font-size:inherit;font-weight:600}.form section .code[data-v-dd19f768]{font-family:Helvetica Neue,Helvetica,PingFang SC,Hiragino Sans GB,Microsoft YaHei,"\5FAE\8F6F\96C5\9ED1",Arial,sans-serif;padding:0 6px;background:rgba(0,0,0,.04);color:rgba(0,0,0,.65);border-radius:4px;font-size:14px;font-weight:600}.form section pre.code[data-v-dd19f768]{padding:10px}.form section .container[data-v-dd19f768]{border:1px solid rgba(0,0,0,.15);padding:20px;border-radius:4px;-webkit-box-shadow:0 2px 2px rgba(0,0,0,.05);box-shadow:0 2px 2px rgba(0,0,0,.05);margin:10px 0}.form section .example[data-v-dd19f768]{margin-bottom:10px}.form section table[data-v-dd19f768]{border-collapse:collapse;line-height:1.8em;width:100%}.form section table tr[data-v-dd19f768]{border-bottom:1px solid rgba(0,0,0,.15)}.form section table td[data-v-dd19f768],.form section table th[data-v-dd19f768]{min-width:80px;max-width:250px;text-align:center;padding:15px 10px}.form section table td.des[data-v-dd19f768],.form section table td.type[data-v-dd19f768],.form section table th.des[data-v-dd19f768],.form section table th.type[data-v-dd19f768]{text-align:start;min-width:100px;max-width:300px}.form .wrapper[data-v-dd19f768]{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;-webkit-box-align:start;-ms-flex-align:start;align-items:flex-start;width:350px;height:600px}
--------------------------------------------------------------------------------
/docs/css/chunk-f0e1d732.8a2e582a.css:
--------------------------------------------------------------------------------
1 | .navigation section[data-v-0b161a93]{padding-bottom:40px}.navigation section a[data-v-0b161a93]{color:#1890ff;padding:0 8px;background:rgba(0,0,0,.04);border-radius:4px}.navigation section a[data-v-0b161a93]:hover{text-decoration:underline}.navigation section .key[data-v-0b161a93]{color:#df24f8;font-size:inherit;font-weight:600}.navigation section .str[data-v-0b161a93]{color:#42b983;font-size:inherit;font-weight:600}.navigation section .tag[data-v-0b161a93]{color:#007acc;color:#3e76f6;font-size:inherit;font-weight:600}.navigation section .code[data-v-0b161a93]{font-family:Helvetica Neue,Helvetica,PingFang SC,Hiragino Sans GB,Microsoft YaHei,"\5FAE\8F6F\96C5\9ED1",Arial,sans-serif;padding:0 6px;background:rgba(0,0,0,.04);color:rgba(0,0,0,.65);border-radius:4px;font-size:14px;font-weight:600}.navigation section pre.code[data-v-0b161a93]{padding:10px}.navigation section .container[data-v-0b161a93]{border:1px solid rgba(0,0,0,.15);padding:20px;border-radius:4px;-webkit-box-shadow:0 2px 2px rgba(0,0,0,.05);box-shadow:0 2px 2px rgba(0,0,0,.05);margin:10px 0}.navigation section .example[data-v-0b161a93]{margin-bottom:10px}.navigation section table[data-v-0b161a93]{border-collapse:collapse;line-height:1.8em;width:100%}.navigation section table tr[data-v-0b161a93]{border-bottom:1px solid rgba(0,0,0,.15)}.navigation section table td[data-v-0b161a93],.navigation section table th[data-v-0b161a93]{min-width:80px;max-width:250px;text-align:center;padding:15px 10px}.navigation section table td.des[data-v-0b161a93],.navigation section table td.type[data-v-0b161a93],.navigation section table th.des[data-v-0b161a93],.navigation section table th.type[data-v-0b161a93]{text-align:start;min-width:100px;max-width:300px}.navigation>.x-slides>.container .demo[data-v-0b161a93]{height:200px;background:#36b1bf;color:#fff;font-size:25px;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center}
--------------------------------------------------------------------------------
/index.js:
--------------------------------------------------------------------------------
1 | import Icon from './src/basic/icon/index.js'
2 | import Button from './src/basic/button/index.js'
3 | import Group from './src/basic/group/index.js'
4 | import Switch from './src/form/switch/index.js'
5 | import Input from './src/form/input/index.js'
6 | import Radio from './src/form/radio/index.js'
7 | import Cascader from './src/form/cascader/index.js'
8 | import DatePicker from './src/form/datepicker/index.js'
9 | import TimePicker from './src/form/timepicker/index.js'
10 | import Grid from './src/layout/grid/index.js'
11 | import Container from './src/layout/container/index.js'
12 | import Collapse from './src/layout/collapse/index.js'
13 | import Waterfall from './src/layout/waterfall/index.js'
14 | import Sticky from './src/navigation/sticky/index.js'
15 | import Tabs from './src/navigation/tabs/index.js'
16 | import Menu from './src/navigation/menu/index.js'
17 | import Pager from './src/navigation/pager/index.js'
18 | import Loading from './src/navigation/loading/index.js'
19 | import Popover from './src/viewport/popover/index.js'
20 | import Message from './src/viewport/message/index.js'
21 | import Slides from './src/viewport/slides/index.js'
22 | import Table from './src/viewport/table/index.js'
23 | import Spread from './src/others/spread/index.js'
24 | import Spin from './src/others/spin/index.js'
25 | import Formator from './src/others/formator/index.js'
26 |
27 | const components = [
28 | Icon,
29 | Button,
30 | Group,
31 | Switch,
32 | Input,
33 | Radio,
34 | Cascader,
35 | Grid,
36 | Container,
37 | DatePicker,
38 | TimePicker,
39 | Collapse,
40 | Waterfall,
41 | Sticky,
42 | Tabs,
43 | Pager,
44 | Menu,
45 | Popover,
46 | Slides,
47 | Table,
48 | Spread,
49 | Spin
50 | ]
51 |
52 | const install = Vue => {
53 | components.forEach(component => {
54 | component.install(Vue)
55 | })
56 | Vue.use(Message)
57 | Vue.use(Loading)
58 | }
59 |
60 | export { Message, Loading, Formator }
61 | export default { install, Loading, Message, Formator }
62 |
--------------------------------------------------------------------------------
/docs/index.html:
--------------------------------------------------------------------------------
1 |
Xue-ui - 一套小巧的 Vue 组件
--------------------------------------------------------------------------------
/docs/js/chunk-fda0a66a.9857bbb1.js:
--------------------------------------------------------------------------------
1 | (window["webpackJsonp"]=window["webpackJsonp"]||[]).push([["chunk-fda0a66a"],{"8fce":function(t,s,a){},9761:function(t,s,a){"use strict";a.r(s);var e=function(){var t=this,s=t.$createElement,a=t._self._c||s;return a("div",{staticClass:"install"},[a("section",[a("h1",{staticClass:"title",staticStyle:{color:"#515a6e"}},[t._v("安装")]),a("h2",[t._v("浏览器支持 / 兼容")]),a("p",{staticClass:"des"},[t._v("\n 由于使用了很多新特性,目前组件库主要支持现代浏览器,并且某些组件在移动端 / 微信浏览器的表现不甚理想。\n ")]),a("h2",[t._v("本地引用")]),t._m(0),a("pre",{staticClass:"code"},[t._v("$ git clone git@github.com:BlameDeng/xue-ui.git\n")]),a("p",{staticClass:"des"},[t._v("\n 下载 / 克隆到本地后,你就可以注册某个组件然后使用了。\n ")]),a("h2",[t._v("NPM 安装")]),t._m(1),t._m(2),a("p",{staticClass:"des"},[t._v("如果您使用了"),a("span",{staticClass:"code"},[t._v("npm / yarn")]),t._v("安装,请继续阅读"),a("a",{attrs:{href:"javascript:void(0);"},on:{click:t.linkStart}},[t._v("快速上手")]),t._v("章节。\n ")])]),a("x-linker",{attrs:{back:{path:"introduction",text:"介绍"},to:{path:"start",text:"快速上手"}}})],1)},n=[function(){var t=this,s=t.$createElement,a=t._self._c||s;return a("p",{staticClass:"des"},[t._v("\n 到官方仓库"),a("a",{attrs:{href:"https://github.com/BlameDeng/xue-ui",target:"_blank"}},[t._v("下载")]),t._v("或使用命令行克隆到本地")])},function(){var t=this,s=t.$createElement,a=t._self._c||s;return a("p",{staticClass:"des"},[t._v("\n 推荐使用"),a("span",{staticClass:"code"},[t._v("npm / yarn")]),t._v("来安装,享受生态圈和工具带来的便利。 ")])},function(){var t=this,s=t.$createElement,a=t._self._c||s;return a("pre",{staticClass:"code"},[t._v("$ npm "),a("span",{staticClass:"key"},[t._v("install")]),t._v(" xue-ui\n$ yarn "),a("span",{staticClass:"key"},[t._v("add")]),t._v(" xue-ui\n")])}],i={name:"Install",inject:["eventBus"],methods:{linkStart:function(){this.eventBus.$emit("link-to","start")}}},c=i,l=(a("bde8"),a("2877")),r=Object(l["a"])(c,e,n,!1,null,"ff8b92c2",null);r.options.__file="Install.vue";s["default"]=r.exports},bde8:function(t,s,a){"use strict";var e=a("8fce"),n=a.n(e);n.a}}]);
2 | //# sourceMappingURL=chunk-fda0a66a.9857bbb1.js.map
--------------------------------------------------------------------------------
/src/navigation/tabs/tabs.vue:
--------------------------------------------------------------------------------
1 |
2 |
11 |
12 |
38 |
--------------------------------------------------------------------------------
/docs/css/chunk-c0f9c65c.585c88df.css:
--------------------------------------------------------------------------------
1 | .introduction[data-v-83bbbf80]{padding:80px 20px 20px 20px;margin:0 auto}.introduction section[data-v-83bbbf80]{padding-bottom:40px}.introduction section a[data-v-83bbbf80]{color:#1890ff;padding:0 8px;background:rgba(0,0,0,.04);border-radius:4px}.introduction section a[data-v-83bbbf80]:hover{text-decoration:underline}.introduction section .key[data-v-83bbbf80]{color:#df24f8;font-size:inherit;font-weight:600}.introduction section .str[data-v-83bbbf80]{color:#42b983;font-size:inherit;font-weight:600}.introduction section .tag[data-v-83bbbf80]{color:#007acc;color:#3e76f6;font-size:inherit;font-weight:600}.introduction section .code[data-v-83bbbf80]{font-family:Helvetica Neue,Helvetica,PingFang SC,Hiragino Sans GB,Microsoft YaHei,"\5FAE\8F6F\96C5\9ED1",Arial,sans-serif;padding:0 6px;background:rgba(0,0,0,.04);color:rgba(0,0,0,.65);border-radius:4px;font-size:14px;font-weight:600}.introduction section pre.code[data-v-83bbbf80]{padding:10px}.introduction section .container[data-v-83bbbf80]{border:1px solid rgba(0,0,0,.15);padding:20px;border-radius:4px;-webkit-box-shadow:0 2px 2px rgba(0,0,0,.05);box-shadow:0 2px 2px rgba(0,0,0,.05);margin:10px 0}.introduction section .example[data-v-83bbbf80]{margin-bottom:10px}.introduction section table[data-v-83bbbf80]{border-collapse:collapse;line-height:1.8em;width:100%}.introduction section table tr[data-v-83bbbf80]{border-bottom:1px solid rgba(0,0,0,.15)}.introduction section table td[data-v-83bbbf80],.introduction section table th[data-v-83bbbf80]{min-width:80px;max-width:250px;text-align:center;padding:15px 10px}.introduction section table td.des[data-v-83bbbf80],.introduction section table td.type[data-v-83bbbf80],.introduction section table th.des[data-v-83bbbf80],.introduction section table th.type[data-v-83bbbf80]{text-align:start;min-width:100px;max-width:300px}.introduction .feature[data-v-83bbbf80]{list-style:disc}.introduction .feature>li[data-v-83bbbf80]{margin:10px 0}@media (min-width:800px){.introduction[data-v-83bbbf80]{padding:80px 20px 20px 170px}}@media (min-width:1200px){.introduction[data-v-83bbbf80]{width:1200px;padding:80px 20px 20px 270px}}
--------------------------------------------------------------------------------
/src/form/radio/option.vue:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
6 |
7 |
8 | {{option.label}}
9 |
10 |
11 |
26 |
--------------------------------------------------------------------------------
/src/navigation/sticky/sticky.vue:
--------------------------------------------------------------------------------
1 |
2 |
7 |
8 |
51 |
--------------------------------------------------------------------------------
/src/navigation/steps/step.vue:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
6 | {{index}}
7 |
8 |
9 |
10 |
{{step.title}}
11 |
{{step.description}}
12 |
13 |
14 |
15 |
38 |
--------------------------------------------------------------------------------
/src/navigation/menu/menu.vue:
--------------------------------------------------------------------------------
1 |
2 |
5 |
6 |
54 |
--------------------------------------------------------------------------------
/src/basic/group/button-group.vue:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
6 |
19 |
--------------------------------------------------------------------------------
/src/layout/collapse/collapse-item.vue:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
6 |
7 |
8 |
9 |
10 |
11 |
12 |
13 |
14 |
35 |
--------------------------------------------------------------------------------
/src/others/spin/spin.vue:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
6 |
7 |
{{tips}}
8 |
9 |
10 |
11 |
48 |
--------------------------------------------------------------------------------
/docs/css/chunk-5ec199f0.38972bee.css:
--------------------------------------------------------------------------------
1 | .header[data-v-cb3df662]{width:100%;height:60px;position:fixed;top:0;left:0;background:#fff;z-index:25;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;-webkit-box-align:center;-ms-flex-align:center;align-items:center;border-bottom:1px solid rgba(0,0,0,.15);-webkit-box-shadow:0 1px 1px 1px rgba(0,0,0,.05);box-shadow:0 1px 1px 1px rgba(0,0,0,.05);padding:0 20px}.header>.menu[data-v-cb3df662]{width:30px;height:30px;cursor:pointer;color:rgba(26,26,26,.65)}.header>.menu>.icon[data-v-cb3df662]{width:100%;height:100%}.header>.logo[data-v-cb3df662]{height:50px;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:start;-ms-flex-pack:start;justify-content:flex-start;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-ms-flex-negative:0;flex-shrink:0;margin-right:100px;cursor:pointer}.header>.logo>.icon[data-v-cb3df662]{display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;margin-right:5px;width:40px;height:40px;color:#36b1bf;-webkit-animation:circle-data-v-cb3df662 12s linear infinite;animation:circle-data-v-cb3df662 12s linear infinite}.header>.logo>.title[data-v-cb3df662]{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;font-weight:600;margin-top:0;margin-bottom:0}.header>.logo>.title>span[data-v-cb3df662]{font-size:32px;font-weight:700;color:#36b1bf;font-style:italic;margin-right:2px}.header>.navbar[data-v-cb3df662]{-webkit-box-pack:start;-ms-flex-pack:start;justify-content:flex-start;font-size:16px;-ms-flex-negative:0;flex-shrink:0}.header>.navbar>li[data-v-cb3df662],.header>.navbar[data-v-cb3df662]{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.header>.navbar>li[data-v-cb3df662]{cursor:pointer;position:relative;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;font-size:14px;font-weight:600;line-height:22px;color:rgba(0,0,0,.45)}.header>.navbar>li.active[data-v-cb3df662]:after,.header>.navbar>li[data-v-cb3df662]:hover:after{position:absolute;bottom:-4px;left:0;content:"";display:block;width:100%;height:3px;background:#36b1bf;border-radius:1px}.header>.navbar>li[data-v-cb3df662]:not(:last-child){margin-right:20px}@media (min-width:800px){.header>.menu[data-v-cb3df662]{display:none}}@-webkit-keyframes circle-data-v-cb3df662{0%{-webkit-transform:rotate(0);transform:rotate(0)}to{-webkit-transform:rotate(1turn);transform:rotate(1turn)}}@keyframes circle-data-v-cb3df662{0%{-webkit-transform:rotate(0);transform:rotate(0)}to{-webkit-transform:rotate(1turn);transform:rotate(1turn)}}
--------------------------------------------------------------------------------
/src/form/cascader/cascader-item.vue:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
6 | {{item.label}}
7 |
8 |
9 |
10 |
11 |
12 |
13 |
14 |
15 |
16 |
42 |
--------------------------------------------------------------------------------
/src/form/switch/switch.vue:
--------------------------------------------------------------------------------
1 |
2 |
3 | {{falseText}}
4 |
5 |
6 |
7 | {{trueText}}
8 |
9 |
10 |
54 |
--------------------------------------------------------------------------------
/src/navigation/loading/loading.vue:
--------------------------------------------------------------------------------
1 |
2 |
3 |
6 |
7 |
8 |
76 |
--------------------------------------------------------------------------------
/docs/js/chunk-1f37e7d9.0c9061fa.js:
--------------------------------------------------------------------------------
1 | (window["webpackJsonp"]=window["webpackJsonp"]||[]).push([["chunk-1f37e7d9"],{"293b":function(s,a,t){},b730:function(s,a,t){"use strict";var n=t("293b"),e=t.n(n);e.a},d701:function(s,a,t){"use strict";t.r(a);var n=function(){var s=this,a=s.$createElement,t=s._self._c||a;return t("div",{staticClass:"start"},[s._m(0),t("x-linker",{attrs:{back:{path:"install",text:"安装"},to:{path:"components/basic/icon",text:"基础"}}})],1)},e=[function(){var s=this,a=s.$createElement,t=s._self._c||a;return t("section",[t("h1",{staticClass:"title",staticStyle:{color:"#515a6e"}},[s._v("快速上手")]),t("h2",[s._v("使用之前")]),t("div",{staticClass:"des"},[s._v("\n 在使用"),t("span",{staticClass:"code"},[s._v("Xue-ui")]),s._v("之前,我们假设您已经了解"),t("span",{staticClass:"code"},[s._v("Vue")]),s._v("、"),t("span",{staticClass:"code"},[s._v("Vue")]),s._v("组件、"),t("span",{staticClass:"code"},[s._v("Vue")]),s._v("单文件组件的基础知识。\n ")]),t("h2",[s._v("使用构建工具")]),t("p",{staticClass:"des"},[s._v("\n 一般在"),t("span",{staticClass:"code"},[s._v("webpack")]),s._v("入口页面"),t("span",{staticClass:"code"},[s._v("main.js")]),s._v("中如下配置:")]),t("pre",{staticClass:"code"},[t("span",{staticClass:"key"},[s._v("import")]),s._v(" Vue "),t("span",{staticClass:"key"},[s._v("from")]),s._v(" "),t("span",{staticClass:"str"},[s._v("'vue'")]),s._v(";\n"),t("span",{staticClass:"key"},[s._v("import")]),s._v(" App "),t("span",{staticClass:"key"},[s._v("from")]),s._v(" "),t("span",{staticClass:"str"},[s._v("'components/app.vue'")]),s._v(";\n"),t("span",{staticClass:"key"},[s._v("import")]),s._v(" Xue "),t("span",{staticClass:"key"},[s._v("from")]),s._v(" "),t("span",{staticClass:"str"},[s._v("'xue-ui'")]),s._v(";\n"),t("span",{staticClass:"key"},[s._v("import")]),s._v(" "),t("span",{staticClass:"str"},[s._v("'xue-ui/lib/xue-ui.css'")]),s._v(";\nVue.use(Xue);\n"),t("span",{staticClass:"key"},[s._v("new")]),s._v(" Vue({\n el: "),t("span",{staticClass:"str"},[s._v("'#app'")]),s._v(",\n render: h => h(App)\n});\n")]),t("p",{staticClass:"des"},[s._v("以上代码便完成了"),t("span",{staticClass:"code"},[s._v("Xue-ui")]),s._v("的引入。需要注意的是,样式文件需要单独引入。")]),t("h2",[s._v("特别提醒")]),t("p",{staticClass:"des"},[s._v("\n 使用"),t("span",{staticClass:"code"},[s._v("Xue-ui")]),s._v("时,您需要使用"),t("span",{staticClass:"code"},[s._v("border-box")]),s._v("盒模型,否则会影响样式。"),t("span",{staticClass:"code"},[s._v("CSS")]),s._v("代码示例:")]),t("pre",{staticClass:"code"},[s._v("*, *::before, *::after {\n margin: 0;\n padding: 0;\n box-sizing: border-box;\n}")]),t("p",{staticClass:"des"},[s._v(" 使用"),t("span",{staticClass:"code"},[s._v(":prop")]),s._v("传递数据格式为数字、布尔值时,必须带"),t("span",{staticClass:"code"},[s._v(":")]),s._v("(兼容"),t("span",{staticClass:"code"},[s._v("String")]),s._v("除外,具体看组件文档),比如:")]),t("pre",{staticClass:"code"},[t("span",{staticClass:"str"},[s._v("正确的用法:")]),s._v("\n"),t("span",{staticClass:"tag"},[s._v(" ")]),s._v("\n"),t("span",{staticClass:"key",staticStyle:{color:"#f5222d"}},[s._v("错误的用法:")]),s._v("\n"),t("span",{staticClass:"tag"},[s._v(" ")]),s._v(" \n")])])}],c=(t("cadf"),t("551c"),t("097d"),{name:"Start"}),v=c,_=(t("b730"),t("2877")),i=Object(_["a"])(v,n,e,!1,null,"96b6473a",null);i.options.__file="Start.vue";a["default"]=i.exports}}]);
2 | //# sourceMappingURL=chunk-1f37e7d9.0c9061fa.js.map
--------------------------------------------------------------------------------
/src/basic/button/button.vue:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
6 |
7 |
8 |
9 |
10 |
54 |
--------------------------------------------------------------------------------
/docs/css/chunk-566c242e.0c0acccb.css:
--------------------------------------------------------------------------------
1 | .index[data-v-6ae5b59e]{background-position:50%;background-size:cover;min-height:100vh;padding-left:50px;position:relative;background-image:url(https://linkstore.oss-cn-shenzhen.aliyuncs.com/xueui.jpg)}.index>.logo[data-v-6ae5b59e]{width:100%;height:80px;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:start;-ms-flex-pack:start;justify-content:flex-start;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.index>.logo>.icon[data-v-6ae5b59e]{width:30px;height:30px;display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;color:#36b1bf;-webkit-animation:circle-data-v-6ae5b59e 12s linear infinite;animation:circle-data-v-6ae5b59e 12s linear infinite}.index>.logo>.text[data-v-6ae5b59e]{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;font-weight:600;margin-top:0;margin-bottom:0;margin-left:5px}.index>.logo>.text>span[data-v-6ae5b59e]{font-size:32px;font-weight:700;color:#36b1bf;font-style:italic;margin-right:2px}.index>.theme[data-v-6ae5b59e]{position:absolute;left:50px;top:50%;padding-right:10px;border-radius:4px;-webkit-transform:translateY(-70%);transform:translateY(-70%);padding:10px 10px 30px 0}.index>.theme>.title[data-v-6ae5b59e]{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;font-weight:600;margin-top:0;margin-bottom:0;margin-left:5px}.index>.theme>.title>span[data-v-6ae5b59e]{font-size:32px;font-weight:700;color:#36b1bf;font-style:italic;margin-right:2px}.index>.theme>.title[data-v-6ae5b59e]:after{content:"";display:block;width:25px;height:4px;background:#36b1bf;border-radius:1px}.index>.theme>.des[data-v-6ae5b59e]{margin:20px 0;color:#36b1bf}.index>.theme>.des>.wpc[data-v-6ae5b59e]{font-size:22px;font-weight:600;display:none}.index>.theme>.des>.npc[data-v-6ae5b59e]{font-size:22px;font-weight:600;display:block}.index>.theme>.keywords[data-v-6ae5b59e]{margin:20px 0;font-size:18px;font-weight:600;color:rgba(0,0,0,.65);font-style:italic}.index>.theme>.link[data-v-6ae5b59e]{-webkit-box-pack:start;-ms-flex-pack:start;justify-content:flex-start}.index>.theme>.link>li[data-v-6ae5b59e],.index>.theme>.link[data-v-6ae5b59e]{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.index>.theme>.link>li[data-v-6ae5b59e]{-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;width:120px;height:35px;border-radius:20px;font-weight:400px;cursor:pointer;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.index>.theme>.link>li[data-v-6ae5b59e]:first-child{margin-right:20px;background:#36b1bf;color:#fff}.index>.theme>.link>li[data-v-6ae5b59e]:first-child:hover{background:#58c4d0}.index>.theme>.link>li[data-v-6ae5b59e]:last-child{background:#fff;border:1px solid #36b1bf;color:#36b1bf}.index>.theme>.link>li[data-v-6ae5b59e]:last-child:hover{background:#cfeef2}.index>.right[data-v-6ae5b59e]{color:rgba(0,0,0,.45);position:fixed;bottom:5px;left:50%;-webkit-transform:translateX(-50%);transform:translateX(-50%);display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center}@media (min-width:850px){.index[data-v-6ae5b59e]{padding-left:100px}.index>.theme[data-v-6ae5b59e]{left:100px;-webkit-transform:translateY(-50%);transform:translateY(-50%)}.index>.theme>.des>.wpc[data-v-6ae5b59e]{display:inline}.index>.theme>.des>.npc[data-v-6ae5b59e]{display:none}}@-webkit-keyframes circle-data-v-6ae5b59e{0%{-webkit-transform:rotate(0);transform:rotate(0)}to{-webkit-transform:rotate(1turn);transform:rotate(1turn)}}@keyframes circle-data-v-6ae5b59e{0%{-webkit-transform:rotate(0);transform:rotate(0)}to{-webkit-transform:rotate(1turn);transform:rotate(1turn)}}
--------------------------------------------------------------------------------
/src/viewport/message/message.vue:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 | {{options.message}}
6 |
7 |
8 |
9 |
10 |
56 |
--------------------------------------------------------------------------------
/src/viewport/message/confirm.vue:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
{{title}}
6 |
10 |
11 | {{cancleText}}
12 | {{confirmText}}
13 |
14 |
15 |
16 |
17 |
18 |
58 |
--------------------------------------------------------------------------------
/src/navigation/menu/menu-item.vue:
--------------------------------------------------------------------------------
1 |
2 |
5 |
6 |
79 |
--------------------------------------------------------------------------------
/src/form/cascader/cascader.vue:
--------------------------------------------------------------------------------
1 |
2 |
12 |
13 |
74 |
--------------------------------------------------------------------------------
/docs/js/chunk-04af1953.2a93ad4b.js:
--------------------------------------------------------------------------------
1 | (window["webpackJsonp"]=window["webpackJsonp"]||[]).push([["chunk-04af1953"],{"197d":function(e,t,n){"use strict";n.r(t);var i=function(){var e=this,t=e.$createElement,n=e._self._c||t;return n("transition",{attrs:{name:"slide"}},[n("div",{directives:[{name:"show",rawName:"v-show",value:e.visible,expression:"visible"}],staticClass:"navbar"},[n("x-menu",{ref:"menu",attrs:{"selected-index":e.selectedIndex,vertical:""},on:{"path-change":function(t){e.pathChange(t)}}},[n("x-menu-item",{attrs:{name:"introduction",index:"1"}},[e._v("介绍")]),n("x-menu-item",{attrs:{name:"install",index:"2"}},[e._v("安装")]),n("x-menu-item",{attrs:{name:"start",index:"3"}},[e._v("快速上手")]),n("x-sub-menu",{attrs:{name:"components",open:"",index:"4"}},[n("template",{slot:"title"},[e._v("组件")]),n("x-sub-menu",{attrs:{name:"basic",index:"4-1"}},[n("template",{slot:"title"},[e._v("\n 基础\n ")]),n("x-menu-item",{attrs:{name:"icon",index:"4-1-1"}},[e._v("icon")]),n("x-menu-item",{attrs:{name:"button",index:"4-1-2"}},[e._v("button")]),n("x-menu-item",{attrs:{name:"buttongroup",index:"4-1-3"}},[e._v("buttongroup")])],2),n("x-sub-menu",{attrs:{name:"form",index:"4-2"}},[n("template",{slot:"title"},[e._v("\n 表单\n ")]),n("x-menu-item",{attrs:{name:"switch",index:"4-2-1"}},[e._v("switch")]),n("x-menu-item",{attrs:{name:"input",index:"4-2-2"}},[e._v("input")]),n("x-menu-item",{attrs:{name:"radio",index:"4-2-3"}},[e._v("radio")]),n("x-menu-item",{attrs:{name:"cascader",index:"4-2-4"}},[e._v("cascader")]),n("x-menu-item",{attrs:{name:"datepicker",index:"4-2-5"}},[e._v("datepicker")]),n("x-menu-item",{attrs:{name:"timepicker",index:"4-2-6"}},[e._v("timepicker")])],2),n("x-sub-menu",{attrs:{name:"layout",index:"4-3"}},[n("template",{slot:"title"},[e._v("\n 布局\n ")]),n("x-menu-item",{attrs:{name:"grid",index:"4-3-1"}},[e._v("grid")]),n("x-menu-item",{attrs:{name:"container",index:"4-3-2"}},[e._v("container")]),n("x-menu-item",{attrs:{name:"collapse",index:"4-3-3"}},[e._v("collapse")]),n("x-menu-item",{attrs:{name:"waterfall",index:"4-3-4"}},[e._v("waterfall")])],2),n("x-sub-menu",{attrs:{name:"navigation",index:"4-4"}},[n("template",{slot:"title"},[e._v("\n 导航\n ")]),n("x-menu-item",{attrs:{name:"sticky",index:"4-4-1"}},[e._v("sticky")]),n("x-menu-item",{attrs:{name:"tabs",index:"4-4-2"}},[e._v("tabs")]),n("x-menu-item",{attrs:{name:"menu",index:"4-4-3"}},[e._v("menu")]),n("x-menu-item",{attrs:{name:"pager",index:"4-4-4"}},[e._v("pager")]),n("x-menu-item",{attrs:{name:"loading",index:"4-4-5"}},[e._v("loading")]),n("x-menu-item",{attrs:{name:"steps",index:"4-4-6"}},[e._v("steps")])],2),n("x-sub-menu",{attrs:{name:"viewport",index:"4-5"}},[n("template",{slot:"title"},[e._v("\n 视图\n ")]),n("x-menu-item",{attrs:{name:"popover",index:"4-5-1"}},[e._v("popover")]),n("x-menu-item",{attrs:{name:"message",index:"4-5-2"}},[e._v("message")]),n("x-menu-item",{attrs:{name:"slides",index:"4-5-3"}},[e._v("slides")]),n("x-menu-item",{attrs:{name:"table",index:"4-5-4"}},[e._v("table")])],2),n("x-sub-menu",{attrs:{name:"others",index:"4-6"}},[n("template",{slot:"title"},[e._v("\n 其它\n ")]),n("x-menu-item",{attrs:{name:"spread",index:"4-6-1"}},[e._v("spread")]),n("x-menu-item",{attrs:{name:"spin",index:"4-6-2"}},[e._v("spin")])],2)],2)],1)],1)])},s=[],a=(n("3b2b"),n("4917"),{name:"Navbar",inject:["eventBus"],data:function(){return{selectedIndex:"1",visible:!1,smallSize:!1}},mounted:function(){var e=this;this.eventBus.$on("link-to",this.listenLinkTo),this.eventBus.$on("instage-component",this.listenSroll),this.eventBus.$on("click-menu",this.clickMenu),window.location.href&&window.location.href.match(/^.+\/#\/(.*)$/);var t=RegExp.$1;t&&this.$nextTick(function(){e.$refs.menu.updateMenu({path:t})}),this.$nextTick(function(){e.listenWindow(),window.addEventListener("resize",e.listenWindow)})},methods:{listenLinkTo:function(e){var t=this;this.$router.push("/"+e),this.$nextTick(function(){t.$refs.menu.updateMenu({path:e})})},pathChange:function(e){this.$router.push("/"+e),e.match(/^\w+\/\w+\/(\w+)$/);var t=RegExp.$1;t&&this.eventBus.$emit("link-component",t)},listenSroll:function(e){var t=this;this.$route.path!=="/"+e&&(this.$router.push("/"+e),this.$nextTick(function(){t.$refs.menu.updateMenu({path:e})}))},clickMenu:function(){this.visible=!this.visible},listenWindow:function(){var e=document.documentElement.clientWidth||document.body.clientWidth;e<800?(this.smallSize=!0,this.visible=!1):(this.smallSize=!1,this.visible=!0)}},watch:{$route:{handler:function(e,t){e.path!==t.path&&this.smallSize&&(this.visible=!1)},deep:!0}},beforeDestroy:function(){window.removeEventListener("resize",this.listenWindow),this.eventBus.$off("in-stage-component",this.listenSroll),this.eventBus.$off("link-to",this.listenLinkTo),this.eventBus.$off("click-menu",this.clickMenu)}}),m=a,u=(n("e7bf"),n("2877")),r=Object(u["a"])(m,i,s,!1,null,"2d14a3c0",null);r.options.__file="navbar.vue";t["default"]=r.exports},e7bf:function(e,t,n){"use strict";var i=n("f0f1"),s=n.n(i);s.a},f0f1:function(e,t,n){}}]);
2 | //# sourceMappingURL=chunk-04af1953.2a93ad4b.js.map
--------------------------------------------------------------------------------
/docs/js/chunk-0cfbbad7.ec935633.js.map:
--------------------------------------------------------------------------------
1 | {"version":3,"sources":["webpack:///./src/views/Components.vue?cacb","webpack:///./src/views/Components.vue?9209","webpack:///src/views/Components.vue","webpack:///./src/views/Components.vue?4193","webpack:///./src/views/Components.vue"],"names":["_node_modules_mini_css_extract_plugin_dist_loader_js_ref_8_oneOf_1_0_node_modules_css_loader_index_js_ref_8_oneOf_1_1_node_modules_vue_loader_lib_loaders_stylePostLoader_js_node_modules_postcss_loader_src_index_js_ref_8_oneOf_1_2_node_modules_sass_loader_lib_loader_js_ref_8_oneOf_1_3_node_modules_cache_loader_dist_cjs_js_ref_0_0_node_modules_vue_loader_lib_index_js_vue_loader_options_Components_vue_vue_type_style_index_0_id_b8e2ebfa_scoped_true_lang_scss___WEBPACK_IMPORTED_MODULE_0__","__webpack_require__","_node_modules_mini_css_extract_plugin_dist_loader_js_ref_8_oneOf_1_0_node_modules_css_loader_index_js_ref_8_oneOf_1_1_node_modules_vue_loader_lib_loaders_stylePostLoader_js_node_modules_postcss_loader_src_index_js_ref_8_oneOf_1_2_node_modules_sass_loader_lib_loader_js_ref_8_oneOf_1_3_node_modules_cache_loader_dist_cjs_js_ref_0_0_node_modules_vue_loader_lib_index_js_vue_loader_options_Components_vue_vue_type_style_index_0_id_b8e2ebfa_scoped_true_lang_scss___WEBPACK_IMPORTED_MODULE_0___default","n","render","_vm","this","_h","$createElement","_c","_self","staticClass","staticRenderFns","Componentsvue_type_script_lang_js_","name","views_Componentsvue_type_script_lang_js_","component","Object","componentNormalizer","options","__file","__webpack_exports__"],"mappings":"kHAAA,IAAAA,EAAAC,EAAA,QAAAC,EAAAD,EAAAE,EAAAH,GAAsiBE,EAAG,4CCAziB,IAAAE,EAAA,WAA0B,IAAAC,EAAAC,KAAaC,EAAAF,EAAAG,eAA0BC,EAAAJ,EAAAK,MAAAD,IAAAF,EAAwB,OAAAE,EAAA,OAAiBE,YAAA,cAAyB,CAAAF,EAAA,oBACnIG,EAAA,GCOAC,EAAA,CACAC,KAAA,cCToVC,EAAA,0BCQpVC,EAAgBC,OAAAC,EAAA,KAAAD,CACdF,EACAX,EACAQ,GACF,EACA,KACA,WACA,MAIAI,EAAAG,QAAAC,OAAA,iBACeC,EAAA,WAAAL","file":"js/chunk-0cfbbad7.ec935633.js","sourcesContent":["import mod from \"-!../../node_modules/mini-css-extract-plugin/dist/loader.js??ref--8-oneOf-1-0!../../node_modules/css-loader/index.js??ref--8-oneOf-1-1!../../node_modules/vue-loader/lib/loaders/stylePostLoader.js!../../node_modules/postcss-loader/src/index.js??ref--8-oneOf-1-2!../../node_modules/sass-loader/lib/loader.js??ref--8-oneOf-1-3!../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../node_modules/vue-loader/lib/index.js??vue-loader-options!./Components.vue?vue&type=style&index=0&id=b8e2ebfa&scoped=true&lang=scss&\"; export default mod; export * from \"-!../../node_modules/mini-css-extract-plugin/dist/loader.js??ref--8-oneOf-1-0!../../node_modules/css-loader/index.js??ref--8-oneOf-1-1!../../node_modules/vue-loader/lib/loaders/stylePostLoader.js!../../node_modules/postcss-loader/src/index.js??ref--8-oneOf-1-2!../../node_modules/sass-loader/lib/loader.js??ref--8-oneOf-1-3!../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../node_modules/vue-loader/lib/index.js??vue-loader-options!./Components.vue?vue&type=style&index=0&id=b8e2ebfa&scoped=true&lang=scss&\"","var render = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('div',{staticClass:\"components\"},[_c('router-view')],1)}\nvar staticRenderFns = []\n\nexport { render, staticRenderFns }","\n \n \n \n \n
\n \n\n","import mod from \"-!../../node_modules/cache-loader/dist/cjs.js??ref--12-0!../../node_modules/thread-loader/dist/cjs.js!../../node_modules/babel-loader/lib/index.js!../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../node_modules/vue-loader/lib/index.js??vue-loader-options!./Components.vue?vue&type=script&lang=js&\"; export default mod; export * from \"-!../../node_modules/cache-loader/dist/cjs.js??ref--12-0!../../node_modules/thread-loader/dist/cjs.js!../../node_modules/babel-loader/lib/index.js!../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../node_modules/vue-loader/lib/index.js??vue-loader-options!./Components.vue?vue&type=script&lang=js&\"","import { render, staticRenderFns } from \"./Components.vue?vue&type=template&id=b8e2ebfa&scoped=true&\"\nimport script from \"./Components.vue?vue&type=script&lang=js&\"\nexport * from \"./Components.vue?vue&type=script&lang=js&\"\nimport style0 from \"./Components.vue?vue&type=style&index=0&id=b8e2ebfa&scoped=true&lang=scss&\"\n\n\n/* normalize component */\nimport normalizer from \"!../../node_modules/vue-loader/lib/runtime/componentNormalizer.js\"\nvar component = normalizer(\n script,\n render,\n staticRenderFns,\n false,\n null,\n \"b8e2ebfa\",\n null\n \n)\n\ncomponent.options.__file = \"Components.vue\"\nexport default component.exports"],"sourceRoot":""}
--------------------------------------------------------------------------------
/src/viewport/message/index.js:
--------------------------------------------------------------------------------
1 | import Vue from 'vue'
2 | import messageComponent from './message.vue'
3 | import confirmComponent from './confirm.vue'
4 |
5 | const Message = {
6 | install(Vue, options) {
7 | Vue.prototype.$success = function({
8 | message,
9 | duration = 2000,
10 | showClose = false
11 | }) {
12 | const Constructor = Vue.extend(messageComponent)
13 | const div = document.createElement('div')
14 | document.body.appendChild(div)
15 | const vm = new Constructor({
16 | propsData: {
17 | options: {
18 | type: 'success',
19 | message,
20 | duration,
21 | showClose
22 | }
23 | }
24 | }).$mount(div)
25 | vm.visible = true
26 | }
27 |
28 | Vue.prototype.$info = function({
29 | message,
30 | duration = 2000,
31 | showClose = false
32 | }) {
33 | const Constructor = Vue.extend(messageComponent)
34 | const div = document.createElement('div')
35 | document.body.appendChild(div)
36 | const vm = new Constructor({
37 | propsData: {
38 | options: {
39 | type: 'info',
40 | message,
41 | duration,
42 | showClose
43 | }
44 | }
45 | }).$mount(div)
46 | vm.visible = true
47 | }
48 |
49 | Vue.prototype.$warning = function({
50 | message,
51 | duration = 2000,
52 | showClose = false
53 | }) {
54 | const Constructor = Vue.extend(messageComponent)
55 | const div = document.createElement('div')
56 | document.body.appendChild(div)
57 | const vm = new Constructor({
58 | propsData: {
59 | options: {
60 | type: 'warning',
61 | message,
62 | duration,
63 | showClose
64 | }
65 | }
66 | }).$mount(div)
67 | vm.visible = true
68 | }
69 |
70 | Vue.prototype.$error = function({
71 | message,
72 | duration = 2000,
73 | showClose = false
74 | }) {
75 | const Constructor = Vue.extend(messageComponent)
76 | const div = document.createElement('div')
77 | document.body.appendChild(div)
78 | const vm = new Constructor({
79 | propsData: {
80 | options: {
81 | type: 'error',
82 | message,
83 | duration,
84 | showClose
85 | }
86 | }
87 | }).$mount(div)
88 | vm.visible = true
89 | }
90 |
91 | Vue.prototype.$confirm = function(options) {
92 | const Constructor = Vue.extend(confirmComponent)
93 | const div = document.createElement('div')
94 | document.body.appendChild(div)
95 | const vm = new Constructor({
96 | propsData: options
97 | }).$mount(div)
98 | vm.visible = true
99 | return vm.confirm()
100 | }
101 | },
102 |
103 | success({ message, duration = 2000, showClose = false }) {
104 | const Constructor = Vue.extend(messageComponent)
105 | const div = document.createElement('div')
106 | document.body.appendChild(div)
107 | const vm = new Constructor({
108 | propsData: {
109 | options: {
110 | type: 'success',
111 | message,
112 | duration,
113 | showClose
114 | }
115 | }
116 | }).$mount(div)
117 | vm.visible = true
118 | },
119 |
120 | info({ message, duration = 2000, showClose = false }) {
121 | const Constructor = Vue.extend(messageComponent)
122 | const div = document.createElement('div')
123 | document.body.appendChild(div)
124 | const vm = new Constructor({
125 | propsData: {
126 | options: {
127 | type: 'info',
128 | message,
129 | duration,
130 | showClose
131 | }
132 | }
133 | }).$mount(div)
134 | vm.visible = true
135 | },
136 |
137 | warning({ message, duration = 2000, showClose = false }) {
138 | const Constructor = Vue.extend(messageComponent)
139 | const div = document.createElement('div')
140 | document.body.appendChild(div)
141 | const vm = new Constructor({
142 | propsData: {
143 | options: {
144 | type: 'warning',
145 | message,
146 | duration,
147 | showClose
148 | }
149 | }
150 | }).$mount(div)
151 | vm.visible = true
152 | },
153 |
154 | error({ message, duration = 2000, showClose = false }) {
155 | const Constructor = Vue.extend(messageComponent)
156 | const div = document.createElement('div')
157 | document.body.appendChild(div)
158 | const vm = new Constructor({
159 | propsData: {
160 | options: {
161 | type: 'error',
162 | message,
163 | duration,
164 | showClose
165 | }
166 | }
167 | }).$mount(div)
168 | vm.visible = true
169 | },
170 |
171 | confirm(options) {
172 | const Constructor = Vue.extend(confirmComponent)
173 | const div = document.createElement('div')
174 | document.body.appendChild(div)
175 | const vm = new Constructor({
176 | propsData: options
177 | }).$mount(div)
178 | vm.visible = true
179 | return vm.confirm()
180 | }
181 | }
182 |
183 | export default Message
184 |
--------------------------------------------------------------------------------
/src/others/spin/svg.js:
--------------------------------------------------------------------------------
1 | (function(window){var svgSprite=' ';var script=function(){var scripts=document.getElementsByTagName("script");return scripts[scripts.length-1]}();var shouldInjectCss=script.getAttribute("data-injectcss");var ready=function(fn){if(document.addEventListener){if(~["complete","loaded","interactive"].indexOf(document.readyState)){setTimeout(fn,0)}else{var loadFn=function(){document.removeEventListener("DOMContentLoaded",loadFn,false);fn()};document.addEventListener("DOMContentLoaded",loadFn,false)}}else if(document.attachEvent){IEContentLoaded(window,fn)}function IEContentLoaded(w,fn){var d=w.document,done=false,init=function(){if(!done){done=true;fn()}};var polling=function(){try{d.documentElement.doScroll("left")}catch(e){setTimeout(polling,50);return}init()};polling();d.onreadystatechange=function(){if(d.readyState=="complete"){d.onreadystatechange=null;init()}}}};var before=function(el,target){target.parentNode.insertBefore(el,target)};var prepend=function(el,target){if(target.firstChild){before(el,target.firstChild)}else{target.appendChild(el)}};function appendSvg(){var div,svg;div=document.createElement("div");div.innerHTML=svgSprite;svgSprite=null;svg=div.getElementsByTagName("svg")[0];if(svg){svg.setAttribute("aria-hidden","true");svg.style.position="absolute";svg.style.width=0;svg.style.height=0;svg.style.overflow="hidden";prepend(svg,document.body)}}if(shouldInjectCss&&!window.__iconfont__svg__cssinject__){window.__iconfont__svg__cssinject__=true;try{document.write("")}catch(e){console&&console.log(e)}}ready(appendSvg)})(window)
--------------------------------------------------------------------------------
/src/navigation/pager/pager.vue:
--------------------------------------------------------------------------------
1 |
2 |
18 |
19 |
73 |
--------------------------------------------------------------------------------
/src/layout/waterfall/waterfall.vue:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
6 |
7 |
8 |
9 |
10 |
11 |
12 |
110 |
--------------------------------------------------------------------------------
/src/viewport/slides/slides.vue:
--------------------------------------------------------------------------------
1 |
2 |
9 |
10 |
114 |
--------------------------------------------------------------------------------
/src/layout/grid/col.vue:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
6 |
69 |
--------------------------------------------------------------------------------
/src/others/spread/spread.vue:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
6 |
7 |
8 |
--------------------------------------------------------------------------------
/src/form/input/input.vue:
--------------------------------------------------------------------------------
1 |
2 |
3 |
5 |
6 |
7 |
8 |
9 |
10 | {{placeholder}}
11 |
12 |
13 |
61 |
--------------------------------------------------------------------------------
/src/navigation/menu/sub-menu.vue:
--------------------------------------------------------------------------------
1 |
2 |
13 |
14 |
107 |
--------------------------------------------------------------------------------
/docs/js/chunk-059022c4.2cf680ae.js:
--------------------------------------------------------------------------------
1 | (window["webpackJsonp"]=window["webpackJsonp"]||[]).push([["chunk-059022c4"],{"1eaf":function(t,s,i){"use strict";var a=i("768f"),n=i.n(a);n.a},"2a57":function(t,s,i){"use strict";i.r(s);var a=function(){var t=this,s=t.$createElement,i=t._self._c||s;return i("div",{staticClass:"others"},[i("section",{staticClass:"x-spread"},[i("h1",{ref:"spread",staticClass:"title"},[t._v("Spread 动画")]),i("p",{staticClass:"des"},[t._v("\n 用于提供水平和垂直方向展开收起动画功能的小组件。\n ")]),i("h2",[t._v("基础用法")]),i("div",{staticClass:"container"},[i("div",{staticClass:"example"},[i("x-button",{staticStyle:{"margin-bottom":"10px"},attrs:{wave:""},on:{click:function(s){t.visible1=!t.visible1}}},[t._v("纵向展开 / 收起")]),i("x-spread",{attrs:{visible:t.visible1}},[i("div",{staticStyle:{width:"400px",height:"200px",background:"#36b1bf"}})]),i("br"),i("x-button",{staticStyle:{"margin-bottom":"10px"},attrs:{wave:""},on:{click:function(s){t.visible2=!t.visible2}}},[t._v("横向展开 / 收起")]),i("x-spread",{attrs:{visible:t.visible2,horizontal:""}},[i("div",{staticStyle:{width:"400px",height:"200px",background:"#36b1bf"}})])],1),t._m(0)]),i("h1",[t._v("Attributes")]),t._m(1)]),i("section",{staticClass:"x-spin"},[i("h1",{ref:"spin",staticClass:"title"},[t._v("Spin 加载中")]),i("p",{staticClass:"des"},[t._v("\n 用于页面和区块的加载中状态。\n ")]),i("h2",[t._v("基础用法")]),i("div",{staticClass:"container"},[i("div",{staticClass:"example",staticStyle:{display:"flex","justify-content":"flex-start",height:"122px"}},[i("div",{staticClass:"spinning-controller"},[i("x-button",{on:{click:function(s){t.spinning=!t.spinning}}},[t._v(t._s(t.spinning?"取消加载":"点击加载"))])],1),i("div",[i("x-spin",{attrs:{spinning:t.spinning,tips:"loading...",width:100}})],1)]),t._m(2)]),i("h1",[t._v("Attributes")]),t._m(3)]),i("x-linker",{attrs:{back:{path:"components/viewport/popover",text:"视图"}}})],1)},n=[function(){var t=this,s=t.$createElement,i=t._self._c||s;return i("pre",{staticClass:"code"},[i("span",{staticClass:"str"},[t._v("纵向动画")]),t._v("\n"),i("span",{staticClass:"tag"},[t._v(" ")]),t._v("\n"),i("span",{staticClass:"str"},[t._v("横向动画")]),t._v("\n"),i("span",{staticClass:"tag"},[t._v(" ")])])},function(){var t=this,s=t.$createElement,i=t._self._c||s;return i("div",{staticClass:"attr"},[i("table",[i("thead",[i("tr",[i("th",[t._v("参数")]),i("th",{staticClass:"des"},[t._v("说明")]),i("th",{staticClass:"type"},[t._v("类型")]),i("th",[t._v("可选值")]),i("th",[t._v("默认值")])])]),i("tbody",[i("tr",[i("td",[t._v("visible")]),i("td",{staticClass:"des"},[t._v("控制内容的展开和收起,可动态绑定,必填。组件内部使用 v-show 控制内容的显示")]),i("td",{staticClass:"type"},[t._v("Boolean")]),i("td",[t._v("——")]),i("td",[t._v("——")])]),i("tr",[i("td",[t._v("horizontal")]),i("td",{staticClass:"des"},[t._v("横向展开和收起,默认为纵向。")]),i("td",{staticClass:"type"},[t._v("Boolean")]),i("td",[t._v("——")]),i("td",[t._v("false")])]),i("tr",[i("td",[t._v("duration")]),i("td",{staticClass:"des"},[t._v("动画持续时间,单位为 ms")]),i("td",{staticClass:"type"},[t._v("String , Number")]),i("td",[t._v("——")]),i("td",[t._v("300")])])])])])},function(){var t=this,s=t.$createElement,i=t._self._c||s;return i("pre",{staticClass:"code"},[i("span",{staticClass:"tag"},[t._v(" ")]),t._v("\n")])},function(){var t=this,s=t.$createElement,i=t._self._c||s;return i("div",{staticClass:"attr"},[i("table",[i("thead",[i("tr",[i("th",[t._v("参数")]),i("th",{staticClass:"des"},[t._v("说明")]),i("th",{staticClass:"type"},[t._v("类型")]),i("th",[t._v("可选值")]),i("th",[t._v("默认值")])])]),i("tbody",[i("tr",[i("td",[t._v("spinning")]),i("td",{staticClass:"des"},[t._v("是否显示加载效果,默认不显示")]),i("td",{staticClass:"type"},[t._v("Boolean")]),i("td",[t._v("——")]),i("td",[t._v("false")])]),i("tr",[i("td",[t._v("delay")]),i("td",{staticClass:"des"},[t._v("延迟显示加载效果出现的时间,单位为 ms,在加载效果出现前修改 spinning 为 false,则不出现加载效果(防止闪烁)")]),i("td",{staticClass:"type"},[t._v("Number")]),i("td",[t._v("——")]),i("td",[t._v("——")])]),i("tr",[i("td",[t._v("width")]),i("td",{staticClass:"des"},[t._v("加载动画的直径大小,单位为 px")]),i("td",{staticClass:"type"},[t._v("Number")]),i("td",[t._v("——")]),i("td",[t._v("80")])]),i("tr",[i("td",[t._v("tips")]),i("td",{staticClass:"des"},[t._v("加载状态的提示文字,将出现在加载动画的正下方")]),i("td",{staticClass:"type"},[t._v("String")]),i("td",[t._v("——")]),i("td",[t._v("——")])])])])])}],e=i("e09c"),c={name:"Others",mixins:[e["a"]],data:function(){return{visible1:!0,visible2:!0,selected:"2-1",spinning:!0,timerId:null}},watch:{spinning2:function(t){var s=this;t&&(this.timerId=setTimeout(function(){s.spinning2=!1},3e3))}},beforeDestroy:function(){this.timerId&&window.clearTimeout(this.timerId)}},l=c,r=(i("1eaf"),i("2877")),o=Object(r["a"])(l,a,n,!1,null,"6aca6bde",null);o.options.__file="Others.vue";s["default"]=o.exports},"456d":function(t,s,i){var a=i("4bf8"),n=i("0d58");i("5eda")("keys",function(){return function(t){return n(a(t))}})},"5eda":function(t,s,i){var a=i("5ca1"),n=i("8378"),e=i("79e5");t.exports=function(t,s){var i=(n.Object||{})[t]||Object[t],c={};c[t]=s(i),a(a.S+a.F*e(function(){i(1)}),"Object",c)}},"768f":function(t,s,i){},e09c:function(t,s,i){"use strict";i("ac6a"),i("456d"),i("7f7f"),i("3b2b"),i("4917");var a=i("682a"),n=i.n(a);function e(t){requestAnimationFrame(e),n.a.update(t)}function c(t,s){var i=arguments.length>2&&void 0!==arguments[2]?arguments[2]:500,a=null;a="string"===typeof t?document.querySelector(t):t;var e=0,c=0;t===window?(e=window.scrollX,c=window.scrollY):(e=a.scrollLeft,c=a.scrollTop);var l={x:e,y:c};new n.a.Tween(l).to({x:s.x,y:s.y},i).easing(n.a.Easing.Quadratic.Out).onUpdate(function(){a.scrollTo(l.x,l.y)}).start()}requestAnimationFrame(e);var l=c;s["a"]={data:function(){return{currentComponent:"",timer:null,min:""}},inject:["eventBus"],mounted:function(){var t=this;this.$route.path.match(/^\/\w+\/\w+\/(\w+)$/);var s=RegExp.$1;s&&setTimeout(function(){t.smoothScroll(s)},0),window.addEventListener("scroll",this.listenScroll),this.eventBus.$on("link-component",this.smoothScroll)},methods:{smoothScroll:function(t){if(this.$refs[t]){var s=this.$refs[t].offsetTop-88;s!==window.scrollY&&l(window,{x:0,y:s})}},listenScroll:function(){var t=this;this.timer&&window.clearTimeout(this.timer),this.timer=setTimeout(function(){var s=document.body.scrollTop||document.documentElement.scrollTop,i=document.body.scrollHeight,a=document.documentElement.clientHeight,n=t.$refs,e=Object.keys(n);if(t.min=t.min||e[0],e.forEach(function(s){var i=Math.abs(n[s].getBoundingClientRect().top);i
2 |
3 |
4 |
5 |
6 |
7 |
8 |
9 |
10 |
11 |
116 |
--------------------------------------------------------------------------------
/docs/js/chunk-c0f9c65c.089272f4.js.map:
--------------------------------------------------------------------------------
1 | {"version":3,"sources":["webpack:///./src/views/Introduction.vue?1f35","webpack:///./src/views/Introduction.vue?5d84","webpack:///src/views/Introduction.vue","webpack:///./src/views/Introduction.vue?320b","webpack:///./src/views/Introduction.vue"],"names":["_node_modules_mini_css_extract_plugin_dist_loader_js_ref_8_oneOf_1_0_node_modules_css_loader_index_js_ref_8_oneOf_1_1_node_modules_vue_loader_lib_loaders_stylePostLoader_js_node_modules_postcss_loader_src_index_js_ref_8_oneOf_1_2_node_modules_sass_loader_lib_loader_js_ref_8_oneOf_1_3_node_modules_cache_loader_dist_cjs_js_ref_0_0_node_modules_vue_loader_lib_index_js_vue_loader_options_Introduction_vue_vue_type_style_index_0_id_83bbbf80_scoped_true_lang_scss___WEBPACK_IMPORTED_MODULE_0__","__webpack_require__","_node_modules_mini_css_extract_plugin_dist_loader_js_ref_8_oneOf_1_0_node_modules_css_loader_index_js_ref_8_oneOf_1_1_node_modules_vue_loader_lib_loaders_stylePostLoader_js_node_modules_postcss_loader_src_index_js_ref_8_oneOf_1_2_node_modules_sass_loader_lib_loader_js_ref_8_oneOf_1_3_node_modules_cache_loader_dist_cjs_js_ref_0_0_node_modules_vue_loader_lib_index_js_vue_loader_options_Introduction_vue_vue_type_style_index_0_id_83bbbf80_scoped_true_lang_scss___WEBPACK_IMPORTED_MODULE_0___default","n","render","_vm","this","_h","$createElement","_c","_self","staticClass","_m","attrs","to","path","text","staticRenderFns","staticStyle","color","_v","font-style","font-size","href","target","Introductionvue_type_script_lang_js_","name","views_Introductionvue_type_script_lang_js_","component","Object","componentNormalizer","options","__file","__webpack_exports__"],"mappings":"kHAAA,IAAAA,EAAAC,EAAA,QAAAC,EAAAD,EAAAE,EAAAH,GAAwiBE,EAAG,4CCA3iB,IAAAE,EAAA,WAA0B,IAAAC,EAAAC,KAAaC,EAAAF,EAAAG,eAA0BC,EAAAJ,EAAAK,MAAAD,IAAAF,EAAwB,OAAAE,EAAA,OAAiBE,YAAA,gBAA2B,CAAAN,EAAAO,GAAA,GAAAH,EAAA,YAA2BI,MAAA,CAAOC,GAAA,CAAMC,KAAA,UAAAC,KAAA,UAA2B,IACxMC,EAAA,YAAoC,IAAAZ,EAAAC,KAAaC,EAAAF,EAAAG,eAA0BC,EAAAJ,EAAAK,MAAAD,IAAAF,EAAwB,OAAAE,EAAA,WAAAA,EAAA,MAA8BE,YAAA,QAAAO,YAAA,CAAiCC,MAAA,YAAmB,CAAAd,EAAAe,GAAA,QAAAX,EAAA,MAAAJ,EAAAe,GAAA,UAAAX,EAAA,KAAmDE,YAAA,OAAkB,CAAAN,EAAAe,GAAA,4BAAAX,EAAA,QAAgDE,YAAA,QAAmB,CAAAN,EAAAe,GAAA,SAAAf,EAAAe,GAAA,mBAAAX,EAAA,QAAuDE,YAAA,QAAmB,CAAAN,EAAAe,GAAA,QAAAf,EAAAe,GAAA,wBAAAX,EAAA,MAAAJ,EAAAe,GAAA,UAAAX,EAAA,MAAmFE,YAAA,WAAsB,CAAAF,EAAA,MAAAJ,EAAAe,GAAA,4BAAAX,EAAA,MAAAJ,EAAAe,GAAA,MAAAX,EAAA,QAA+EE,YAAA,QAAmB,CAAAN,EAAAe,GAAA,SAAAf,EAAAe,GAAA,YAAAX,EAAA,MAAAJ,EAAAe,GAAA,uBAAAX,EAAA,QAAuFE,YAAA,QAAmB,CAAAN,EAAAe,GAAA,QAAAf,EAAAe,GAAA,QAAAX,EAAA,QAA2CE,YAAA,QAAmB,CAAAN,EAAAe,GAAA,gBAAAf,EAAAe,GAAA,KAAAX,EAAA,QAAgDE,YAAA,QAAmB,CAAAN,EAAAe,GAAA,WAAAf,EAAAe,GAAA,UAAAX,EAAA,KAA6CE,YAAA,OAAkB,CAAAN,EAAAe,GAAA,8FAAAX,EAAA,KAA+GS,YAAA,CAAaG,aAAA,SAAAC,YAAA,QAAyCT,MAAA,CAAQU,KAAA,sCAAAC,OAAA,WAAgE,CAAAnB,EAAAe,GAAA,UAAAf,EAAAe,GAAA,yBCqBzmCK,EAAA,CACAC,KAAA,gBCvBsVC,EAAA,0BCQtVC,EAAgBC,OAAAC,EAAA,KAAAD,CACdF,EACAvB,EACAa,GACF,EACA,KACA,WACA,MAIAW,EAAAG,QAAAC,OAAA,mBACeC,EAAA,WAAAL","file":"js/chunk-c0f9c65c.089272f4.js","sourcesContent":["import mod from \"-!../../node_modules/mini-css-extract-plugin/dist/loader.js??ref--8-oneOf-1-0!../../node_modules/css-loader/index.js??ref--8-oneOf-1-1!../../node_modules/vue-loader/lib/loaders/stylePostLoader.js!../../node_modules/postcss-loader/src/index.js??ref--8-oneOf-1-2!../../node_modules/sass-loader/lib/loader.js??ref--8-oneOf-1-3!../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../node_modules/vue-loader/lib/index.js??vue-loader-options!./Introduction.vue?vue&type=style&index=0&id=83bbbf80&scoped=true&lang=scss&\"; export default mod; export * from \"-!../../node_modules/mini-css-extract-plugin/dist/loader.js??ref--8-oneOf-1-0!../../node_modules/css-loader/index.js??ref--8-oneOf-1-1!../../node_modules/vue-loader/lib/loaders/stylePostLoader.js!../../node_modules/postcss-loader/src/index.js??ref--8-oneOf-1-2!../../node_modules/sass-loader/lib/loader.js??ref--8-oneOf-1-3!../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../node_modules/vue-loader/lib/index.js??vue-loader-options!./Introduction.vue?vue&type=style&index=0&id=83bbbf80&scoped=true&lang=scss&\"","var render = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('div',{staticClass:\"introduction\"},[_vm._m(0),_c('x-linker',{attrs:{\"to\":{path:'install',text:'安装'}}})],1)}\nvar staticRenderFns = [function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('section',[_c('h1',{staticClass:\"title\",staticStyle:{\"color\":\"#515a6e\"}},[_vm._v(\"介绍\")]),_c('h2',[_vm._v(\"写在前面\")]),_c('p',{staticClass:\"des\"},[_vm._v(\"\\n 这是我出于提升自己对\"),_c('span',{staticClass:\"code\"},[_vm._v(\"Vue\")]),_vm._v(\"和组件化开发的理解而制作的一个\"),_c('span',{staticClass:\"code\"},[_vm._v(\"UI\")]),_vm._v(\"组件库。\\n \")]),_c('h2',[_vm._v(\"项目特点\")]),_c('ul',{staticClass:\"feature\"},[_c('li',[_vm._v(\"使用了重构、设计模式、单向数据流等技术概念。\")]),_c('li',[_vm._v(\"使用\"),_c('span',{staticClass:\"code\"},[_vm._v(\"Vue\")]),_vm._v(\"的多种功能。\")]),_c('li',[_vm._v(\"组件的样式、色彩的搭配参考了一些成熟的\"),_c('span',{staticClass:\"code\"},[_vm._v(\"UI\")]),_vm._v(\"框架(如\"),_c('span',{staticClass:\"code\"},[_vm._v(\"Element UI\")]),_vm._v(\"、\"),_c('span',{staticClass:\"code\"},[_vm._v(\"iView\")]),_vm._v(\")。\")])]),_c('p',{staticClass:\"des\"},[_vm._v(\"\\n 目前代码尚未完工,持续更新中。本组件库仅供学习交流,请勿在生产环境中使用。\\n 欢迎讨论交流,如果你觉得还不错,请\"),_c('a',{staticStyle:{\"font-style\":\"italic\",\"font-size\":\"16px\"},attrs:{\"href\":\"https://github.com/BlameDeng/xue-ui\",\"target\":\"_blank\"}},[_vm._v(\"Star\")]),_vm._v(\"。\\n \")])])}]\n\nexport { render, staticRenderFns }","\n \n
\n 介绍 \n 写在前面 \n \n 这是我出于提升自己对Vue 和组件化开发的理解而制作的一个UI 组件库。\n
项目特点 \n \n 使用了重构、设计模式、单向数据流等技术概念。 \n 使用Vue 的多种功能。 \n 组件的样式、色彩的搭配参考了一些成熟的UI 框架(如Element UI 、iView )。 \n \n \n 目前代码尚未完工,持续更新中。本组件库仅供学习交流,请勿在生产环境中使用。\n 欢迎讨论交流,如果你觉得还不错,请Star 。\n
\n \n
\n
\n \n\n","import mod from \"-!../../node_modules/cache-loader/dist/cjs.js??ref--12-0!../../node_modules/thread-loader/dist/cjs.js!../../node_modules/babel-loader/lib/index.js!../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../node_modules/vue-loader/lib/index.js??vue-loader-options!./Introduction.vue?vue&type=script&lang=js&\"; export default mod; export * from \"-!../../node_modules/cache-loader/dist/cjs.js??ref--12-0!../../node_modules/thread-loader/dist/cjs.js!../../node_modules/babel-loader/lib/index.js!../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../node_modules/vue-loader/lib/index.js??vue-loader-options!./Introduction.vue?vue&type=script&lang=js&\"","import { render, staticRenderFns } from \"./Introduction.vue?vue&type=template&id=83bbbf80&scoped=true&\"\nimport script from \"./Introduction.vue?vue&type=script&lang=js&\"\nexport * from \"./Introduction.vue?vue&type=script&lang=js&\"\nimport style0 from \"./Introduction.vue?vue&type=style&index=0&id=83bbbf80&scoped=true&lang=scss&\"\n\n\n/* normalize component */\nimport normalizer from \"!../../node_modules/vue-loader/lib/runtime/componentNormalizer.js\"\nvar component = normalizer(\n script,\n render,\n staticRenderFns,\n false,\n null,\n \"83bbbf80\",\n null\n \n)\n\ncomponent.options.__file = \"Introduction.vue\"\nexport default component.exports"],"sourceRoot":""}
--------------------------------------------------------------------------------
/src/viewport/table/table.vue:
--------------------------------------------------------------------------------
1 |
2 |
30 |
31 |
87 |
--------------------------------------------------------------------------------