chenhaodong / mew-iview

Commit bb49347b35e6046356c7dc190994659330a0cf60

Authored by 梁灏
1 parent b34e09b8

fixed #2823

Showing 2 changed files with 28 additions and 113 deletions   Show diff stats
Inline Side-by-side
examples/routers/table.vue
  Show/Hide comments   View file @bb49347
1   -<!--<template>-->
2   - <!--<Table border :columns="columns6" :data="data5"></Table>-->
3   -<!--</template>-->
4   -<!--<script>-->
5   - <!--export default {-->
6   - <!--data () {-->
7   - <!--return {-->
8   - <!--columns6: [-->
9   - <!--{-->
10   - <!--title: 'Date',-->
11   - <!--key: 'date'-->
12   - <!--},-->
13   - <!--{-->
14   - <!--title: 'Name',-->
15   - <!--key: 'name'-->
16   - <!--},-->
17   - <!--{-->
18   - <!--title: 'Gender',-->
19   - <!--key: 'gender'-->
20   - <!--},-->
21   - <!--{-->
22   - <!--title: 'Age',-->
23   - <!--key: 'age',-->
24   - <!--fixed: 'left',-->
25   -<!--// fixed: 'right',-->
26   - <!--filters: [-->
27   - <!--{-->
28   - <!--label: 'Greater than 25',-->
29   - <!--value: 1-->
30   - <!--},-->
31   - <!--{-->
32   - <!--label: 'Less than 25',-->
33   - <!--value: 2-->
34   - <!--}-->
35   - <!--],-->
36   - <!--filterMultiple: false,-->
37   - <!--filterMethod (value, row) {-->
38   - <!--if (value === 1) {-->
39   - <!--return row.age > 25;-->
40   - <!--} else if (value === 2) {-->
41   - <!--return row.age < 25;-->
42   - <!--}-->
43   - <!--}-->
44   - <!--},-->
45   - <!--{-->
46   - <!--title: 'Address',-->
47   - <!--key: 'address',-->
48   - <!--fixed: 'left',-->
49   - <!--filters: [-->
50   - <!--{-->
51   - <!--label: 'New York',-->
52   - <!--value: 'New York'-->
53   - <!--},-->
54   - <!--{-->
55   - <!--label: 'London',-->
56   - <!--value: 'London'-->
57   - <!--},-->
58   - <!--{-->
59   - <!--label: 'Sydney',-->
60   - <!--value: 'Sydney'-->
61   - <!--}-->
62   - <!--],-->
63   - <!--filterMethod (value, row) {-->
64   - <!--return row.address.indexOf(value) > -1;-->
65   - <!--}-->
66   - <!--}-->
67   - <!--],-->
68   - <!--data5: [-->
69   - <!--{-->
70   - <!--name: 'John Brown',-->
71   - <!--age: 18,-->
72   - <!--gender: 'male',-->
73   - <!--address: 'New York No. 1 Lake Park',-->
74   - <!--date: '2016-10-03'-->
75   - <!--},-->
76   - <!--{-->
77   - <!--name: 'Jim Green',-->
78   - <!--age: 24,-->
79   - <!--gender: 'female',-->
80   - <!--address: 'London No. 1 Lake Park',-->
81   - <!--date: '2016-10-01'-->
82   - <!--},-->
83   - <!--{-->
84   - <!--name: 'Joe Black',-->
85   - <!--age: 30,-->
86   - <!--gender: 'male',-->
87   - <!--address: 'Sydney No. 1 Lake Park',-->
88   - <!--date: '2016-10-02'-->
89   - <!--},-->
90   - <!--{-->
91   - <!--name: 'Jon Snow',-->
92   - <!--age: 26,-->
93   - <!--gender: 'male',-->
94   - <!--address: 'Ottawa No. 2 Lake Park',-->
95   - <!--date: '2016-10-04'-->
96   - <!--}-->
97   - <!--],-->
98   - <!--}-->
99   - <!--}-->
100   - <!--}-->
101   -<!--</script>-->
102   -
103 1 <template>
104   - <Table border :columns="columns5" :data="data5"></Table>
  2 + <div>
  3 + <Table border ref="selection" :columns="columns4" :data="data1"></Table>
  4 + <Button @click="handleSetData">Set Data</Button>
  5 + <Button @click="handleClearData">Clear Data</Button>
  6 + <Button @click="handleSelectAll(true)">Set all selected</Button>
  7 + <Button @click="handleSelectAll(false)">Cancel all selected</Button>
  8 + </div>
105 9 </template>
106 10 <script>
107 11 export default {
108 12 data () {
109 13 return {
110   - columns5: [
  14 + columns4: [
111 15 {
112   - title: 'Date',
113   - key: 'date',
114   - sortable: true
  16 + type: 'selection',
  17 + width: 60,
  18 + align: 'center'
115 19 },
116 20 {
117 21 title: 'Name',
... ... @@ -119,16 +23,24 @@
119 23 },
120 24 {
121 25 title: 'Age',
122   - key: 'age',
123   - fixed: 'right',
124   - sortable: true
  26 + key: 'age'
125 27 },
126 28 {
127 29 title: 'Address',
128 30 key: 'address'
129 31 }
130 32 ],
131   - data5: [
  33 + data1: [
  34 +
  35 + ]
  36 + }
  37 + },
  38 + methods: {
  39 + handleSelectAll (status) {
  40 + this.$refs.selection.selectAll(status);
  41 + },
  42 + handleSetData () {
  43 + this.data1 = [
132 44 {
133 45 name: 'John Brown',
134 46 age: 18,
... ... @@ -153,7 +65,10 @@
153 65 address: 'Ottawa No. 2 Lake Park',
154 66 date: '2016-10-04'
155 67 }
156   - ]
  68 + ];
  69 + },
  70 + handleClearData () {
  71 + this.data1 = [];
157 72 }
158 73 }
159 74 }
... ...
src/components/table/table-head.vue
  Show/Hide comments   View file @bb49347
... ... @@ -11,7 +11,7 @@
11 11 <span v-if="!column.renderHeader">{{ column.title || '' }}</span>
12 12 <render-header v-else :render="column.renderHeader" :column="column" :index="index"></render-header>
13 13 </template>
14   - <template v-else-if="column.type === 'selection'"><Checkbox :value="isSelectAll" @on-change="selectAll"></Checkbox></template>
  14 + <template v-else-if="column.type === 'selection'"><Checkbox :value="isSelectAll" :disabled="!data.length" @on-change="selectAll"></Checkbox></template>
15 15 <template v-else>
16 16 <span v-if="!column.renderHeader" @click="handleSortByHead(index)">{{ column.title || '#' }}</span>
17 17 <render-header v-else :render="column.renderHeader" :column="column" :index="index"></render-header>
... ...