other / mew-iview

Commit ba8e03c69958d527519fd2eba4641a5d799ecde8

Authored by 梁灏
1 parent 9f723b02

update Select check style

Showing 2 changed files with 243 additions and 52 deletions   Show diff stats
Inline Side-by-side
examples/routers/table.vue
  Show/Hide comments   View file @ba8e03c
1 <template> 1 <template>
2 - <Table border :columns="columns6" :data="data5"></Table> 2 + <div>
  3 + <Table :columns="columns8" :data="data7" size="small" ref="table"></Table>
  4 + <br>
  5 + <Button type="primary" size="large" @click="exportData(1)"><Icon type="ios-download-outline"></Icon> Export source data</Button>
  6 + <Button type="primary" size="large" @click="exportData(2)"><Icon type="ios-download-outline"></Icon> Export sorting and filtered data</Button>
  7 + <Button type="primary" size="large" @click="exportData(3)"><Icon type="ios-download-outline"></Icon> Export custom data</Button>
  8 + </div>
3 </template> 9 </template>
4 <script> 10 <script>
5 export default { 11 export default {
6 data () { 12 data () {
7 return { 13 return {
8 - columns6: [ 14 + columns8: [
9 { 15 {
10 - title: 'Date',  
11 - key: 'date' 16 + "title": "Name",
  17 + "key": "name",
  18 + "fixed": "left",
  19 + "width": 200
12 }, 20 },
13 { 21 {
14 - title: 'Name',  
15 - key: 'name'  
16 - },  
17 - {  
18 - title: '年龄',  
19 - key: 'age', 22 + "title": "Show",
  23 + "key": "show",
  24 + "width": 150,
  25 + "sortable": true,
20 filters: [ 26 filters: [
21 { 27 {
22 - label: 'Greater than 25', 28 + label: 'Greater than 4000',
23 value: 1 29 value: 1
24 }, 30 },
25 { 31 {
26 - label: 'Less than 25', 32 + label: 'Less than 4000',
27 value: 2 33 value: 2
28 } 34 }
29 ], 35 ],
30 filterMultiple: false, 36 filterMultiple: false,
31 filterMethod (value, row) { 37 filterMethod (value, row) {
32 if (value === 1) { 38 if (value === 1) {
33 - return row.age > 25; 39 + return row.show > 4000;
34 } else if (value === 2) { 40 } else if (value === 2) {
35 - return row.age < 25; 41 + return row.show < 4000;
36 } 42 }
37 } 43 }
38 }, 44 },
39 { 45 {
40 - title: 'Address',  
41 - key: 'address',  
42 - filters: [  
43 - {  
44 - label: 'New York',  
45 - value: 'New York'  
46 - },  
47 - {  
48 - label: 'London',  
49 - value: 'London'  
50 - },  
51 - {  
52 - label: 'Sydney',  
53 - value: 'Sydney'  
54 - }  
55 - ],  
56 - filterMethod (value, row) {  
57 - return row.address.indexOf(value) > -1;  
58 - } 46 + "title": "Weak",
  47 + "key": "weak",
  48 + "width": 150,
  49 + "sortable": true
  50 + },
  51 + {
  52 + "title": "Signin",
  53 + "key": "signin",
  54 + "width": 150,
  55 + "sortable": true
  56 + },
  57 + {
  58 + "title": "Click",
  59 + "key": "click",
  60 + "width": 150,
  61 + "sortable": true
  62 + },
  63 + {
  64 + "title": "Active",
  65 + "key": "active",
  66 + "width": 150,
  67 + "sortable": true
  68 + },
  69 + {
  70 + "title": "7, retained",
  71 + "key": "day7",
  72 + "width": 150,
  73 + "sortable": true
  74 + },
  75 + {
  76 + "title": "30, retained",
  77 + "key": "day30",
  78 + "width": 150,
  79 + "sortable": true
  80 + },
  81 + {
  82 + "title": "The next day left",
  83 + "key": "tomorrow",
  84 + "width": 150,
  85 + "sortable": true
  86 + },
  87 + {
  88 + "title": "Day Active",
  89 + "key": "day",
  90 + "width": 150,
  91 + "sortable": true
  92 + },
  93 + {
  94 + "title": "Week Active",
  95 + "key": "week",
  96 + "width": 150,
  97 + "sortable": true
  98 + },
  99 + {
  100 + "title": "Month Active",
  101 + "key": "month",
  102 + "width": 150,
  103 + "sortable": true
59 } 104 }
60 ], 105 ],
61 - data5: [ 106 + data7: [
  107 + {
  108 + "name": "Name1",
  109 + "fav": 0,
  110 + "show": 7302,
  111 + "weak": 5627,
  112 + "signin": 1563,
  113 + "click": 4254,
  114 + "active": 1438,
  115 + "day7": 274,
  116 + "day30": 285,
  117 + "tomorrow": 1727,
  118 + "day": 558,
  119 + "week": 4440,
  120 + "month": 5610
  121 + },
  122 + {
  123 + "name": "Name2",
  124 + "fav": 0,
  125 + "show": 4720,
  126 + "weak": 4086,
  127 + "signin": 3792,
  128 + "click": 8690,
  129 + "active": 8470,
  130 + "day7": 8172,
  131 + "day30": 5197,
  132 + "tomorrow": 1684,
  133 + "day": 2593,
  134 + "week": 2507,
  135 + "month": 1537
  136 + },
  137 + {
  138 + "name": "Name3",
  139 + "fav": 0,
  140 + "show": 7181,
  141 + "weak": 8007,
  142 + "signin": 8477,
  143 + "click": 1879,
  144 + "active": 16,
  145 + "day7": 2249,
  146 + "day30": 3450,
  147 + "tomorrow": 377,
  148 + "day": 1561,
  149 + "week": 3219,
  150 + "month": 1588
  151 + },
62 { 152 {
63 - name: 'John Brown',  
64 - age: 18,  
65 - address: 'New York No. 1 Lake Park',  
66 - date: '2016-10-03' 153 + "name": "Name4",
  154 + "fav": 0,
  155 + "show": 9911,
  156 + "weak": 8976,
  157 + "signin": 8807,
  158 + "click": 8050,
  159 + "active": 7668,
  160 + "day7": 1547,
  161 + "day30": 2357,
  162 + "tomorrow": 7278,
  163 + "day": 5309,
  164 + "week": 1655,
  165 + "month": 9043
67 }, 166 },
68 { 167 {
69 - name: 'Jim Green',  
70 - age: 24,  
71 - address: 'London No. 1 Lake Park',  
72 - date: '2016-10-01' 168 + "name": "Name5",
  169 + "fav": 0,
  170 + "show": 934,
  171 + "weak": 1394,
  172 + "signin": 6463,
  173 + "click": 5278,
  174 + "active": 9256,
  175 + "day7": 209,
  176 + "day30": 3563,
  177 + "tomorrow": 8285,
  178 + "day": 1230,
  179 + "week": 4840,
  180 + "month": 9908
73 }, 181 },
74 { 182 {
75 - name: 'Joe Black',  
76 - age: 30,  
77 - address: 'Sydney No. 1 Lake Park',  
78 - date: '2016-10-02' 183 + "name": "Name6",
  184 + "fav": 0,
  185 + "show": 6856,
  186 + "weak": 1608,
  187 + "signin": 457,
  188 + "click": 4949,
  189 + "active": 2909,
  190 + "day7": 4525,
  191 + "day30": 6171,
  192 + "tomorrow": 1920,
  193 + "day": 1966,
  194 + "week": 904,
  195 + "month": 6851
79 }, 196 },
80 { 197 {
81 - name: 'Jon Snow',  
82 - age: 26,  
83 - address: 'Ottawa No. 2 Lake Park',  
84 - date: '2016-10-04' 198 + "name": "Name7",
  199 + "fav": 0,
  200 + "show": 5107,
  201 + "weak": 6407,
  202 + "signin": 4166,
  203 + "click": 7970,
  204 + "active": 1002,
  205 + "day7": 8701,
  206 + "day30": 9040,
  207 + "tomorrow": 7632,
  208 + "day": 4061,
  209 + "week": 4359,
  210 + "month": 3676
  211 + },
  212 + {
  213 + "name": "Name8",
  214 + "fav": 0,
  215 + "show": 862,
  216 + "weak": 6520,
  217 + "signin": 6696,
  218 + "click": 3209,
  219 + "active": 6801,
  220 + "day7": 6364,
  221 + "day30": 6850,
  222 + "tomorrow": 9408,
  223 + "day": 2481,
  224 + "week": 1479,
  225 + "month": 2346
  226 + },
  227 + {
  228 + "name": "Name9",
  229 + "fav": 0,
  230 + "show": 567,
  231 + "weak": 5859,
  232 + "signin": 128,
  233 + "click": 6593,
  234 + "active": 1971,
  235 + "day7": 7596,
  236 + "day30": 3546,
  237 + "tomorrow": 6641,
  238 + "day": 1611,
  239 + "week": 5534,
  240 + "month": 3190
  241 + },
  242 + {
  243 + "name": "Name10",
  244 + "fav": 0,
  245 + "show": 3651,
  246 + "weak": 1819,
  247 + "signin": 4595,
  248 + "click": 7499,
  249 + "active": 7405,
  250 + "day7": 8710,
  251 + "day30": 5518,
  252 + "tomorrow": 428,
  253 + "day": 9768,
  254 + "week": 2864,
  255 + "month": 5811
85 } 256 }
86 - ], 257 + ]
  258 + }
  259 + },
  260 + methods: {
  261 + exportData (type) {
  262 + if (type === 1) {
  263 + this.$refs.table.exportCsv({
  264 + filename: 'The original data'
  265 + });
  266 + } else if (type === 2) {
  267 + this.$refs.table.exportCsv({
  268 + filename: 'Sorting and filtering data',
  269 + original: false
  270 + });
  271 + } else if (type === 3) {
  272 + this.$refs.table.exportCsv({
  273 + filename: 'Custom data',
  274 + columns: this.columns8.filter((col, index) => index < 4),
  275 + data: this.data7.filter((data, index) => index < 4)
  276 + });
  277 + }
87 } 278 }
88 } 279 }
89 } 280 }
src/styles/components/select.less
  Show/Hide comments   View file @ba8e03c
@@ -253,7 +253,7 @@ @@ -253,7 +253,7 @@
253 color: @selected-color; 253 color: @selected-color;
254 position: absolute; 254 position: absolute;
255 top: 2px; 255 top: 2px;
256 - right: 16px; 256 + right: 8px;
257 } 257 }
258 } 258 }
259 259