init

init

local/components/app.vue

@@ -0,0 +1,27 @@
+<style lang="less">
+    @import "../../styles/index.less";
+    @import "../../styles/package.less";
+</style>
+<template>
+    <div>
+        <router-view></router-view>
+    </div>
+</template>
+<script>
+    module.exports = {
+        data: function() {
+            return {
+
+            }
+        },
+        ready: function() {
+            
+        },
+        beforeDestroy: function() {
+
+        },
+        methods: {
+            
+        }
+    }
+</script>

local/dist/1.chunk.js

@@ -0,0 +1,77 @@
+webpackJsonp([1],[
+/* 0 */,
+/* 1 */,
+/* 2 */,
+/* 3 */,
+/* 4 */,
+/* 5 */,
+/* 6 */,
+/* 7 */,
+/* 8 */
+/***/ function(module, exports, __webpack_require__) {
+
+	var __vue_script__, __vue_template__
+	__webpack_require__(9)
+	__vue_script__ = __webpack_require__(10)
+	if (__vue_script__ &&
+	    __vue_script__.__esModule &&
+	    Object.keys(__vue_script__).length > 1) {
+	  console.warn("[vue-loader] local/routers/index.vue: named exports in *.vue files are ignored.")}
+	__vue_template__ = __webpack_require__(11)
+	module.exports = __vue_script__ || {}
+	if (module.exports.__esModule) module.exports = module.exports.default
+	if (__vue_template__) {
+	(typeof module.exports === "function" ? (module.exports.options || (module.exports.options = {})) : module.exports).template = __vue_template__
+	}
+	if (false) {(function () {  module.hot.accept()
+	  var hotAPI = require("vue-hot-reload-api")
+	  hotAPI.install(require("vue"), false)
+	  if (!hotAPI.compatible) return
+	  var id = "_v-68704ea4/index.vue"
+	  if (!module.hot.data) {
+	    hotAPI.createRecord(id, module.exports)
+	  } else {
+	    hotAPI.update(id, module.exports, __vue_template__)
+	  }
+	})()}
+
+/***/ },
+/* 9 */
+/***/ function(module, exports) {
+
+	// removed by extract-text-webpack-plugin
+
+/***/ },
+/* 10 */
+/***/ function(module, exports) {
+
+	"use strict";
+
+	Object.defineProperty(exports, "__esModule", {
+	    value: true
+	});
+	// <style>
+	//
+	// </style>
+	// <template>
+	//     <div>welcome</div>
+	// </template>
+	// <script>
+	exports.default = {
+	    props: {},
+	    data: function data() {
+	        return {};
+	    },
+
+	    methods: {}
+	};
+	// </script>
+
+/***/ },
+/* 11 */
+/***/ function(module, exports) {
+
+	module.exports = "\n\n\n\n<div>welcome</div>\n";
+
+/***/ }
+]);

local/dist/main.js

@@ -0,0 +1,149 @@
+webpackJsonp([0],[
+/* 0 */
+/***/ function(module, exports, __webpack_require__) {
+
+	'use strict';
+
+	var _vue = __webpack_require__(1);
+
+	var _vue2 = _interopRequireDefault(_vue);
+
+	var _vueRouter = __webpack_require__(3);
+
+	var _vueRouter2 = _interopRequireDefault(_vueRouter);
+
+	var _app = __webpack_require__(4);
+
+	var _app2 = _interopRequireDefault(_app);
+
+	function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+	_vue2.default.use(_vueRouter2.default);
+
+	// 开启debug模式
+	/**
+	 * Created by aresn on 16/6/20.
+	 */
+	_vue2.default.config.debug = true;
+
+	// 路由配置
+	var router = new _vueRouter2.default({
+	    history: true
+	});
+
+	router.map({
+	    '/index': {
+	        component: function component(resolve) {
+	            __webpack_require__.e/* require */(1, function(__webpack_require__) { var __WEBPACK_AMD_REQUIRE_ARRAY__ = [__webpack_require__(8)]; (resolve.apply(null, __WEBPACK_AMD_REQUIRE_ARRAY__));}.bind(this));
+	        }
+	    },
+	    '/button': {
+	        component: function component(resolve) {
+	            __webpack_require__.e/* require */(2, function(__webpack_require__) { var __WEBPACK_AMD_REQUIRE_ARRAY__ = [__webpack_require__(12)]; (resolve.apply(null, __WEBPACK_AMD_REQUIRE_ARRAY__));}.bind(this));
+	        }
+	    },
+	    '/page': {
+	        component: function component(resolve) {
+	            __webpack_require__.e/* require */(3, function(__webpack_require__) { var __WEBPACK_AMD_REQUIRE_ARRAY__ = [__webpack_require__(137)]; (resolve.apply(null, __WEBPACK_AMD_REQUIRE_ARRAY__));}.bind(this));
+	        }
+	    },
+	    '/more': {
+	        component: function component(resolve) {
+	            __webpack_require__.e/* require */(4, function(__webpack_require__) { var __WEBPACK_AMD_REQUIRE_ARRAY__ = [__webpack_require__(141)]; (resolve.apply(null, __WEBPACK_AMD_REQUIRE_ARRAY__));}.bind(this));
+	        }
+	    },
+	    '/layout': {
+	        component: function component(resolve) {
+	            __webpack_require__.e/* require */(5, function(__webpack_require__) { var __WEBPACK_AMD_REQUIRE_ARRAY__ = [__webpack_require__(145)]; (resolve.apply(null, __WEBPACK_AMD_REQUIRE_ARRAY__));}.bind(this));
+	        }
+	    },
+	    '/radio': {
+	        component: function component(resolve) {
+	            __webpack_require__.e/* require */(6, function(__webpack_require__) { var __WEBPACK_AMD_REQUIRE_ARRAY__ = [__webpack_require__(148)]; (resolve.apply(null, __WEBPACK_AMD_REQUIRE_ARRAY__));}.bind(this));
+	        }
+	    }
+	});
+
+	router.beforeEach(function () {
+	    window.scrollTo(0, 0);
+	});
+
+	router.afterEach(function (transition) {});
+
+	router.redirect({
+	    '*': "/index"
+	});
+	router.start(_app2.default, '#app');
+
+/***/ },
+/* 1 */,
+/* 2 */,
+/* 3 */,
+/* 4 */
+/***/ function(module, exports, __webpack_require__) {
+
+	var __vue_script__, __vue_template__
+	__webpack_require__(5)
+	__vue_script__ = __webpack_require__(6)
+	if (__vue_script__ &&
+	    __vue_script__.__esModule &&
+	    Object.keys(__vue_script__).length > 1) {
+	  console.warn("[vue-loader] local/components/app.vue: named exports in *.vue files are ignored.")}
+	__vue_template__ = __webpack_require__(7)
+	module.exports = __vue_script__ || {}
+	if (module.exports.__esModule) module.exports = module.exports.default
+	if (__vue_template__) {
+	(typeof module.exports === "function" ? (module.exports.options || (module.exports.options = {})) : module.exports).template = __vue_template__
+	}
+	if (false) {(function () {  module.hot.accept()
+	  var hotAPI = require("vue-hot-reload-api")
+	  hotAPI.install(require("vue"), false)
+	  if (!hotAPI.compatible) return
+	  var id = "_v-0afa8397/app.vue"
+	  if (!module.hot.data) {
+	    hotAPI.createRecord(id, module.exports)
+	  } else {
+	    hotAPI.update(id, module.exports, __vue_template__)
+	  }
+	})()}
+
+/***/ },
+/* 5 */
+/***/ function(module, exports) {
+
+	// removed by extract-text-webpack-plugin
+
+/***/ },
+/* 6 */
+/***/ function(module, exports) {
+
+	"use strict";
+
+	// <style lang="less">
+	//     @import "../../styles/index.less";
+	//     @import "../../styles/package.less";
+	// </style>
+	// <template>
+	//     <div>
+	//         <router-view></router-view>
+	//     </div>
+	// </template>
+	// <script>
+	module.exports = {
+	    data: function data() {
+	        return {};
+	    },
+	    ready: function ready() {},
+	    beforeDestroy: function beforeDestroy() {},
+	    methods: {}
+	};
+	// </script>
+
+/***/ },
+/* 7 */
+/***/ function(module, exports) {
+
+	module.exports = "\n\n\n\n\n<div>\n    <router-view></router-view>\n</div>\n";
+
+/***/ }
+]);

local/main.js

@@ -0,0 +1,62 @@
+/**
+ * Created by aresn on 16/6/20.
+ */
+import Vue from 'vue';
+import VueRouter from 'vue-router';
+import App from './components/app.vue';
+
+Vue.use(VueRouter);
+
+// 开启debug模式
+Vue.config.debug = true;
+
+// 路由配置
+var router = new VueRouter({
+    history: true
+});
+
+router.map({
+    '/index': {
+        component: function (resolve) {
+            require(['./routers/index.vue'], resolve);
+        }
+    },
+    '/button': {
+        component: function (resolve) {
+            require(['./routers/button.vue'], resolve);
+        }
+    },
+    '/page': {
+        component: function (resolve) {
+            require(['./routers/page.vue'], resolve);
+        }
+    },
+    '/more': {
+        component: function (resolve) {
+            require(['./routers/more.vue'], resolve);
+        }
+    },
+    '/layout': {
+        component: function (resolve) {
+            require(['./routers/layout.vue'], resolve);
+        }
+    },
+    '/radio': {
+        component: function (resolve) {
+            require(['./routers/radio.vue'], resolve);
+        }
+    }
+});
+
+router.beforeEach(function () {
+    window.scrollTo(0, 0);
+});
+
+router.afterEach(function (transition) {
+
+});
+
+router.redirect({
+    '*': "/index"
+});
+router.start(App, '#app');

local/routers/button.vue

@@ -0,0 +1,147 @@
+<style>
+
+</style>
+<template>
+    <Button size="small" shape="circle" type="primary" icon="add" @click="abc">
+        <Icon type="link"></Icon>
+        链接
+    </Button>
+
+    <Button-group>
+        <Button>上一页</Button>
+        <Button>1</Button>
+        <Button>2</Button>
+        <Button>3</Button>
+        <Button>下一页</Button>
+    </Button-group>
+    {{ msg }}
+    <i-input placeholder="请输入邮箱" size="large" :value.sync="msg" @keyup.enter="abc"></i-input>
+
+    <Switch size="large" @on-change="changeSwitch">
+        <span slot="checkedItem">开</span>
+        <span slot="unCheckedItem">关</span>
+    </Switch>
+
+    <br>
+
+    <Radio @on-change="changeRadio">梁灏</Radio>
+    <Radio checked>谦翔</Radio>
+
+    <br><br><br>
+    <Radio value="谦翔">
+        谦翔
+    </Radio>
+    <Radio value="梁灏">
+        梁灏
+    </Radio>
+    <Radio value="倪斌">
+        倪斌
+    </Radio>
+    <Radio value="段模">
+        段模
+    </Radio>
+    <br><br><br>
+    <Radio-group>
+        <Radio value="谦翔">
+            谦翔
+        </Radio>
+        <Radio value="梁灏">
+            梁灏
+        </Radio>
+        <Radio value="倪斌">
+            倪斌
+        </Radio>
+        <Radio value="段模">
+            段模
+        </Radio>
+    </Radio-group>
+    <br><br><br>
+    <Checkbox-group :model="checkbox" @on-change="groupChange">
+        <Checkbox value="梁灏">梁灏</Checkbox>
+        <Checkbox value="段模">段模</Checkbox>
+        <Checkbox value="倪斌">倪斌</Checkbox>
+    </Checkbox-group>
+    <br><br><br>
+    <div @click="changeCB">切换名称数据</div>
+    {{ checkbox | json }}
+    <br><br><br>
+    <Checkbox :checked.sync="singleRadio" @on-change="singleChange">梁灏</Checkbox>
+    <br>
+    {{ singleRadio }}
+    <div @click="singleRadio = !singleRadio">切换单个名称数据</div>
+    <br><br><br>
+    ------------------------------
+    <Input-number :step="1.2" :value="1"></Input-number>
+    {{ inumber }}
+    <br><br><br>
+    <Row type="flex" align="top" justify="end" class="hello world">
+        <i-col span="8" offset="2" class="nihao shijie">1</i-col>
+        <i-col span="8" push="3">2</i-col>
+        <i-col span="8" order="2">3</i-col>
+    </Row>
+
+    <br><br><br>
+
+    <Page :current="1" :total="100" simple></Page>
+</template>
+<script>
+    import { Button, Icon, Input, Switch, Radio, Checkbox, InputNumber, Row, Col, Page } from 'iview';
+    const ButtonGroup = Button.Group;
+    const RadioGroup = Radio.Group;
+    const CheckboxGroup = Checkbox.Group;
+
+    export default {
+        components: {
+            Button,
+            ButtonGroup,
+            Icon,
+            iInput: Input,
+            Switch,
+            Radio,
+            RadioGroup,
+            Checkbox,
+            CheckboxGroup,
+            InputNumber,
+            Row,
+            iCol: Col,
+            Page
+        },
+        props: {
+        
+        },
+        data () {
+            return {
+                msg: 123,
+                radio: '梁灏',
+                checkbox: ['倪斌'],
+                inumber: 5,
+                singleRadio: true
+            }        
+        },
+        ready () {
+            setTimeout(() => {
+//                this.checkbox = ['倪斌', '梁灏'];
+            }, 2000);
+        },
+        methods: {
+            abc() {
+                console.log(123);
+            },
+            changeSwitch (data) {
+                console.log(data);
+            },
+            changeRadio (data) {
+                console.log(data);
+            },
+            changeCB () {
+                this.checkbox = ['梁灏', '段模'];
+            },
+            groupChange (data) {
+//                console.log(data);
+            },
+            singleChange (data) {
+//                console.log(data);
+            }
+        }
+    }
+</script>

local/routers/index.vue

@@ -0,0 +1,21 @@
+<style>
+
+</style>
+<template>
+    <div>welcome</div>
+</template>
+<script>
+    export default {
+        props: {
+        
+        },
+        data () {
+            return {
+            
+            }        
+        },
+        methods: {
+        
+        }
+    }
+</script>

local/routers/layout.vue

@@ -0,0 +1,34 @@
+<template>
+    <Row>
+        <i-col span="4">
+            我在左边
+        </i-col>
+        <i-col span="20">
+            我在右边
+        </i-col>
+    </Row>
+</template>
+<script>
+    import { Row, Col } from 'iview';
+
+    export default {
+        components: {
+            Row,
+            iCol: Col
+        },
+        props: {
+        
+        },
+        data () {
+            return {
+            
+            }
+        },
+        computed: {
+        
+        },
+        methods: {
+        
+        }
+    }
+</script>

local/routers/more.vue

@@ -0,0 +1,133 @@
+<style scoped>
+    body{
+        padding: 50px;
+        height: 2000px;
+    }
+    .example-badge{
+        width: 42px;
+        height: 42px;
+        border-radius: 6px;
+        background: #eee;
+        display: inline-block;
+    }
+</style>
+<template>
+
+    <Badge count="10">
+        <a class="example-badge"></a>
+    </Badge>
+
+    <Tag color="green" closable @on-close="closed">管理员</Tag>
+    <Progress :percent="50" status="active" :stroke-width="20">
+
+    </Progress>
+
+    <Circle :percent="p">
+        {{p}}%
+    </Circle>
+    <br><br>
+    <Timeline pending>
+        <Timeline-item color="red">发布3.0版本</Timeline-item>
+        <Timeline-item color="green">
+            <Icon type="time" slot="dot"></Icon>
+            发布2.0版本
+        </Timeline-item>
+        <Timeline-item color="#ff6600">发布1.0版本</Timeline-item>
+        <Timeline-item>发布里程碑版本</Timeline-item>
+    </Timeline>
+    <br><br>
+    <Affix :offset-top="50" @on-change="affixChange">
+        <Button>固定的图钉</Button>
+    </Affix>
+    <Back-top @on-click="backtop">
+
+    </Back-top>
+
+    <div style="width: 200px;height: 100px;border:1px solid #b2b2b2;position:relative">
+        <!--<Spin size="large" fix>加载中...</Spin>-->
+        <Spin size="large" fix v-if="spinShow">加载中...</Spin>
+    </div>
+    <div @click="spinShow = !spinShow">消失</div>
+    <br><br>
+
+    <Button @click="nextStep">下一步</Button>
+    <Button @click="step_status = 'error'">步骤3切换为错误</Button>
+    <Button @click="step_process = 'error'">切换steps状态为error</Button>
+    <Breadcrumb separator="<b>=></b>">
+        <Breadcrumb-item href="/index">首页</Breadcrumb-item>
+        <Breadcrumb-item href="/my">我的</Breadcrumb-item>
+        <Breadcrumb-item>
+            <Icon type="photo"></Icon>照片
+        </Breadcrumb-item>
+    </Breadcrumb>
+    <br>
+    <Steps :current="1" status="error">
+        <Step title="已完成" content="这里是该步骤的描述信息"></Step>
+        <Step title="进行中" content="这里是该步骤的描述信息"></Step>
+        <Step title="待进行" content="这里是该步骤的描述信息"></Step>
+        <Step title="待进行" content="这里是该步骤的描述信息"></Step>
+    </Steps>
+    <Button @click="testStatus = 'process'">change Status</Button>
+</template>
+<script>
+    import { Badge, Tag, Progress, Circle, Timeline, Icon, Affix, Button, BackTop, Spin, Steps, Breadcrumb} from 'iview';
+    const TimelineItem = Timeline.Item;
+    const Step = Steps.Step;
+    const BreadcrumbItem = Breadcrumb.Item;
+
+    export default {
+        components: {
+            Badge,
+            Tag,
+            Progress,
+            Circle,
+            Timeline,
+            TimelineItem,
+            Icon,
+            Affix,
+            Button,
+            BackTop,
+            Spin,
+            Steps,
+            Step,
+            Breadcrumb,
+            BreadcrumbItem
+        },
+        props: {
+        
+        },
+        data () {
+            return {
+                total: 512,
+                p: 50,
+                step_current: 0,
+                step_status: 'wait',
+                step_process: 'process',
+                spinShow: true,
+                testStatus: 'wait'
+            }
+        },
+        computed: {
+        
+        },
+        methods: {
+            closed (e) {
+                console.log(e)
+            },
+            affixChange (status) {
+                console.log(status)
+            },
+            backtop () {
+                console.log('toppp')
+            },
+            nextStep () {
+                this.step_current += 1;
+            }
+        },
+        ready () {
+            setTimeout(() => {
+                this.p = 60;
+            }, 1000)
+        }
+    }
+</script>

local/routers/page.vue

@@ -0,0 +1,36 @@
+<style>
+    body{
+        padding: 100px;
+    }
+    .ivu-page-item-active{
+        color: #f60;
+    }
+</style>
+<template>
+    <Page :current="1" :total="total" show-sizer show-total show-elevator :page-size="10" simple @on-change="setPage"></Page>
+</template>
+<script>
+    import { Page } from 'iview';
+
+    export default {
+        components: {
+            Page
+        },
+        props: {
+        
+        },
+        data () {
+            return {
+                total: 512
+            }
+        },
+        computed: {
+        
+        },
+        methods: {
+            setPage (page) {
+                console.log(page)
+            }
+        }
+    }
+</script>

local/routers/radio.vue

@@ -0,0 +1,44 @@
+<template>
+    <div>
+        <Radio :checked.sync="radio">梁灏</Radio>
+        {{ radio | json }}
+        <div @click="radio = false">单项切换</div>
+        <br><br><br>
+        <Radio-group :model.sync="radioGroup" size="large" type="button" @on-change="changeGroup">
+            <Radio value="梁灏"></Radio>
+            <Radio value="段模"></Radio>
+            <Radio value="倪斌"></Radio>
+        </Radio-group>
+        {{ radioGroup | json }}
+        <div @click="radioGroup = '梁灏'">多项切换</div>
+    </div>
+</template>
+<script>
+    import { Radio } from 'iview';
+
+    const RadioGroup = Radio.Group;
+
+    export default {
+        components: {
+            Radio,
+            RadioGroup
+        },
+        props: {
+        
+        },
+        data () {
+            return {
+                radio: true,
+                radioGroup: '段模'
+            }
+        },
+        computed: {
+        
+        },
+        methods: {
+            changeGroup (data) {
+                console.log(data);
+            }
+        }
+    }
+</script>

local/template/index.html

@@ -0,0 +1,10 @@
+<!DOCTYPE html>
+<html lang="zh-CN">
+<head>
+    <meta charset="UTF-8">
+    <title>Webpack App</title>
+</head>
+<body>
+    <div id="app"></div>
+</body>
+</html>