other / mew-iview

Commit f3cbb62b93eaf75c3dfb22961caec69cfd289186

Authored by Lawrence Lee
2 parents aaf900f3 1c26046d

Merge remote-tracking branch 'iview-2.0/2.0' into 2.0

Showing 5 changed files with 128 additions and 133 deletions   Show diff stats
Inline Side-by-side
1 <p align="center"> 1 <p align="center">
2 <a href="https://www.iviewui.com"> 2 <a href="https://www.iviewui.com">
3 - <img width="200" src="https://raw.githubusercontent.com/iview/iview/master/assets/logo.png"> 3 + <img width="200" src="https://file.iviewui.com/logo.svg">
4 </a> 4 </a>
5 </p> 5 </p>
6 6
@@ -34,7 +34,7 @@ @@ -34,7 +34,7 @@
34 - Dozens of useful and beautiful components. 34 - Dozens of useful and beautiful components.
35 - Friendly API. It's made for people with all skill levels. 35 - Friendly API. It's made for people with all skill levels.
36 - Extensive documentation. 36 - Extensive documentation.
37 -- It is quite beautiful 37 +- It is quite beautiful.
38 - Support Vue.js 2 and Vue.js 1. 38 - Support Vue.js 2 and Vue.js 1.
39 39
40 ## Programming 40 ## Programming
assets/logo.svg 0 → 100644
  Show/Hide comments   View file @f3cbb62
  1 +<?xml version="1.0" encoding="utf-8"?>
  2 +<!-- Generator: Adobe Illustrator 19.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
  3 +<svg version="1.1" id="图层_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
  4 + viewBox="0 0 72 72" style="enable-background:new 0 0 72 72;" xml:space="preserve">
  5 +<style type="text/css">
  6 + .st0{fill:#3399FF;}
  7 + .st1{fill:#00CC99;}
  8 +</style>
  9 +<polygon id="XMLID_85_" class="st0" points="59.1,12.3 19.2,12.3 25.4,21.4 53,21.4 49.5,26.6 39.2,41.9 44.7,50.1 60.6,26.6
  10 + 64.1,21.4 70.3,12.3 "/>
  11 +<g id="XMLID_36_">
  12 + <polygon id="XMLID_57_" class="st1" points="41.5,54.9 36,46.6 36,46.6 22.4,26.6 11.3,26.6 30.4,54.9 30.4,54.9 36,63.1 "/>
  13 + <polygon id="XMLID_44_" class="st1" points="12.8,12.3 1.7,12.3 7.8,21.4 19,21.4 "/>
  14 +</g>
  15 +</svg>
examples/components/test.vue
  Show/Hide comments   View file @f3cbb62
1 <template> 1 <template>
2 - <div>{{ row.name }}</div> 2 + <Select v-model="model1" style="width:200px">
  3 + <Option v-for="item in cityList" :value="item.value" :key="item.value">{{ item.label }}</Option>
  4 + </Select>
3 </template> 5 </template>
4 <script> 6 <script>
5 export default { 7 export default {
6 - props: {  
7 - row: Object  
8 - },  
9 - mounted () {  
10 -// console.log(1);  
11 - },  
12 - beforeDestroy () {  
13 -// console.log(2); 8 + data () {
  9 + return {
  10 + cityList: [
  11 + {
  12 + value: 'beijing',
  13 + label: '北京市'
  14 + },
  15 + {
  16 + value: 'shanghai',
  17 + label: '上海市'
  18 + },
  19 + {
  20 + value: 'shenzhen',
  21 + label: '深圳市'
  22 + },
  23 + {
  24 + value: 'hangzhou',
  25 + label: '杭州市'
  26 + },
  27 + {
  28 + value: 'nanjing',
  29 + label: '南京市'
  30 + },
  31 + {
  32 + value: 'chongqing',
  33 + label: '重庆市'
  34 + }
  35 + ],
  36 + model1: ''
  37 + }
14 } 38 }
15 } 39 }
16 </script> 40 </script>
17 \ No newline at end of file 41 \ No newline at end of file
examples/routers/table.vue
  Show/Hide comments   View file @f3cbb62
1 <template> 1 <template>
2 - <div>  
3 - <div style="margin: 10px">  
4 - 显示边框 <i-switch v-model="showBorder" style="margin-right: 5px"></i-switch>  
5 - 显示斑马纹 <i-switch v-model="showStripe" style="margin-right: 5px"></i-switch>  
6 - 显示索引 <i-switch v-model="showIndex" style="margin-right: 5px"></i-switch>  
7 - 显示多选框 <i-switch v-model="showCheckbox" style="margin-right: 5px"></i-switch>  
8 - 显示表头 <i-switch v-model="showHeader" style="margin-right: 5px"></i-switch>  
9 - 表格滚动 <i-switch v-model="fixedHeader" style="margin-right: 5px"></i-switch>  
10 - <br>  
11 - <br>  
12 - 表格尺寸  
13 - <Radio-group v-model="tableSize" type="button">  
14 - <Radio label="large">大</Radio>  
15 - <Radio label="default">中</Radio>  
16 - <Radio label="small">小</Radio>  
17 - </Radio-group>  
18 - </div>  
19 - <Table :border="showBorder" :stripe="showStripe" :show-header="showHeader" :height="fixedHeader ? 250 : ''" :size="tableSize" :data="tableData3" :columns="tableColumns3"></Table>  
20 - </div> 2 + <Table width="550" border highlight-row @on-selection-change="change2" @on-current-change="change1" :columns="columns2" :data="data3"></Table>
21 </template> 3 </template>
22 <script> 4 <script>
23 export default { 5 export default {
24 data () { 6 data () {
25 return { 7 return {
26 - tableData3: [ 8 + columns2: [
27 { 9 {
28 - name: '王小明',  
29 - age: 18,  
30 - address: '北京市朝阳区芍药居',  
31 - date: '2016-10-03' 10 + type: 'selection',
  11 + width: 60,
  12 + align: 'center'
32 }, 13 },
33 { 14 {
34 - name: '张小刚',  
35 - age: 24,  
36 - address: '北京市海淀区西二旗',  
37 - date: '2016-10-01' 15 + title: '姓名',
  16 + key: 'name',
  17 + width: 100,
  18 + fixed: 'left'
38 }, 19 },
39 { 20 {
40 - name: '李小红',  
41 - age: 30,  
42 - address: '上海市浦东新区世纪大道',  
43 - date: '2016-10-02' 21 + title: '年龄',
  22 + key: 'age',
  23 + width: 100
44 }, 24 },
45 { 25 {
46 - name: '周小伟',  
47 - age: 26,  
48 - address: '深圳市南山区深南大道',  
49 - date: '2016-10-04' 26 + title: '省份',
  27 + key: 'province',
  28 + width: 100
  29 + },
  30 + {
  31 + title: '市区',
  32 + key: 'city',
  33 + width: 100
  34 + },
  35 + {
  36 + title: '地址',
  37 + key: 'address',
  38 + width: 200
50 }, 39 },
51 { 40 {
  41 + title: '邮编',
  42 + key: 'zip',
  43 + width: 100
  44 + },
  45 + {
  46 + title: '操作',
  47 + key: 'action',
  48 + fixed: 'right',
  49 + width: 120,
  50 + render: (h, params) => {
  51 + return h('div', [
  52 + h('Button', {
  53 + props: {
  54 + type: 'text',
  55 + size: 'small'
  56 + }
  57 + }, '查看'),
  58 + h('Button', {
  59 + props: {
  60 + type: 'text',
  61 + size: 'small'
  62 + }
  63 + }, '编辑')
  64 + ]);
  65 + }
  66 + }
  67 + ],
  68 + data3: [
  69 + {
52 name: '王小明', 70 name: '王小明',
53 age: 18, 71 age: 18,
54 address: '北京市朝阳区芍药居', 72 address: '北京市朝阳区芍药居',
55 - date: '2016-10-03' 73 + province: '北京市',
  74 + city: '朝阳区',
  75 + zip: 100000
56 }, 76 },
57 { 77 {
58 name: '张小刚', 78 name: '张小刚',
59 - age: 24, 79 + age: 25,
60 address: '北京市海淀区西二旗', 80 address: '北京市海淀区西二旗',
61 - date: '2016-10-01' 81 + province: '北京市',
  82 + city: '海淀区',
  83 + zip: 100000
62 }, 84 },
63 { 85 {
64 name: '李小红', 86 name: '李小红',
65 age: 30, 87 age: 30,
66 address: '上海市浦东新区世纪大道', 88 address: '上海市浦东新区世纪大道',
67 - date: '2016-10-02' 89 + province: '上海市',
  90 + city: '浦东新区',
  91 + zip: 100000
68 }, 92 },
69 { 93 {
70 name: '周小伟', 94 name: '周小伟',
71 age: 26, 95 age: 26,
72 address: '深圳市南山区深南大道', 96 address: '深圳市南山区深南大道',
73 - date: '2016-10-04' 97 + province: '广东',
  98 + city: '南山区',
  99 + zip: 100000
74 } 100 }
75 - ],  
76 - showBorder: false,  
77 - showStripe: false,  
78 - showHeader: true,  
79 - showIndex: true,  
80 - showCheckbox: false,  
81 - fixedHeader: false,  
82 - tableSize: 'default' 101 + ]
83 } 102 }
84 }, 103 },
85 - computed: {  
86 - tableColumns3 () {  
87 - let columns = [];  
88 - if (this.showCheckbox) {  
89 - columns.push({  
90 - type: 'selection',  
91 - width: 60,  
92 - align: 'center'  
93 - })  
94 - }  
95 - if (this.showIndex) {  
96 - columns.push({  
97 - type: 'index',  
98 - width: 60,  
99 - align: 'center'  
100 - })  
101 - }  
102 - columns.push({  
103 - title: '日期',  
104 - key: 'date',  
105 - sortable: true  
106 - });  
107 - columns.push({  
108 - title: '姓名',  
109 - key: 'name'  
110 - });  
111 - columns.push({  
112 - title: '年龄',  
113 - key: 'age',  
114 - sortable: true,  
115 - filters: [  
116 - {  
117 - label: '大于25岁',  
118 - value: 1  
119 - },  
120 - {  
121 - label: '小于25岁',  
122 - value: 2  
123 - }  
124 - ],  
125 - filterMultiple: false,  
126 - filterMethod (value, row) {  
127 - if (value === 1) {  
128 - return row.age > 25;  
129 - } else if (value === 2) {  
130 - return row.age < 25;  
131 - }  
132 - }  
133 - });  
134 - columns.push({  
135 - title: '地址',  
136 - key: 'address',  
137 - filters: [  
138 - {  
139 - label: '北京',  
140 - value: '北京'  
141 - },  
142 - {  
143 - label: '上海',  
144 - value: '上海'  
145 - },  
146 - {  
147 - label: '深圳',  
148 - value: '深圳'  
149 - }  
150 - ],  
151 - filterMethod (value, row) {  
152 - return row.address.indexOf(value) > -1;  
153 - }  
154 - });  
155 - return columns; 104 + methods: {
  105 + change1 (d, l) {
  106 +// console.log(d)
  107 +// console.log(l)
  108 + },
  109 + change2 (d, l) {
  110 + console.log(d);
  111 + console.log(l);
156 } 112 }
157 } 113 }
158 } 114 }
159 -</script>  
160 \ No newline at end of file 115 \ No newline at end of file
  116 +</script>
src/components/table/table-body.vue
  Show/Hide comments   View file @f3cbb62
@@ -11,7 +11,7 @@ @@ -11,7 +11,7 @@
11 :prefix-cls="prefixCls" 11 :prefix-cls="prefixCls"
12 @mouseenter.native.stop="handleMouseIn(row._index)" 12 @mouseenter.native.stop="handleMouseIn(row._index)"
13 @mouseleave.native.stop="handleMouseOut(row._index)" 13 @mouseleave.native.stop="handleMouseOut(row._index)"
14 - @click.native.stop="clickCurrentRow(row._index)" 14 + @click.native="clickCurrentRow(row._index)"
15 @dblclick.native.stop="dblclickCurrentRow(row._index)"> 15 @dblclick.native.stop="dblclickCurrentRow(row._index)">
16 <td v-for="column in columns" :class="alignCls(column, row)"> 16 <td v-for="column in columns" :class="alignCls(column, row)">
17 <Cell 17 <Cell