other / mew-iview

Commit 4ad72493f6b145ea91613d2a47fac0c8b1178fff

Authored by 梁灏
1 parent 19c208d3

Revert Table demo

Showing 1 changed file with 78 additions and 11 deletions   Show diff stats
Inline Side-by-side
examples/routers/table.vue
  Show/Hide comments   View file @4ad7249
1 1 <template>
2 2 <div>
3   - <Table highlight-row ref="currentRowTable" :columns="columns3" :data="data1"></Table>
4   - <Button @click="handleClearCurrentRow">Clear</Button>
  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 style="margin:20px 0px;">
  9 + <Table :data="tableData1" :columns="tableColumns1" style="width: 100%;" stripe></Table>
  10 + <div style="margin: 10px;overflow: hidden">
  11 + <div style="float: right;">
  12 + <Page :total="100" show-sizer :current="1" @on-change="changePage"></Page>
  13 + </div>
  14 + </div>
  15 + </div>
5 16 </div>
6 17 </template>
7 18 <script>
8 19 export default {
9 20 data () {
10 21 return {
11   - columns3: [
  22 + columns4: [
12 23 {
13   - type: 'index',
  24 + type: 'selection',
14 25 width: 60,
15 26 align: 'center'
16 27 },
... ... @@ -28,6 +39,47 @@
28 39 }
29 40 ],
30 41 data1: [
  42 +
  43 + ],
  44 +
  45 + tableData1: [],
  46 + tableColumns1: [
  47 + {
  48 + title: 'Data1',
  49 + key: 'data1'
  50 + },
  51 + {
  52 + title: 'Data2',
  53 + key: 'data2'
  54 + },
  55 + {
  56 + title: 'Data3',
  57 + key: 'data3'
  58 + },
  59 + {
  60 + title: 'Data4',
  61 + key: 'data4'
  62 + },
  63 + {
  64 + title: 'Data5',
  65 + key: 'data5'
  66 + },
  67 + {
  68 + title: 'Data6',
  69 + key: 'data6'
  70 + },
  71 + ]
  72 + }
  73 + },
  74 + mounted(){
  75 + this.refreshData();
  76 + },
  77 + methods: {
  78 + handleSelectAll (status) {
  79 + this.$refs.selection.selectAll(status);
  80 + },
  81 + handleSetData () {
  82 + this.data1 = [
31 83 {
32 84 name: 'John Brown',
33 85 age: 18,
... ... @@ -52,13 +104,28 @@
52 104 address: 'Ottawa No. 2 Lake Park',
53 105 date: '2016-10-04'
54 106 }
55   - ]
56   - }
57   - },
58   - methods: {
59   - handleClearCurrentRow () {
60   - this.$refs.currentRowTable.clearCurrentRow();
  107 + ];
  108 + },
  109 + handleClearData () {
  110 + this.data1 = [];
  111 + },
  112 + refreshData(){
  113 + let data = [];
  114 + for (let i = 0; i < 10; i++) {
  115 + data.push({
  116 + data1: Math.floor(Math.random () * 10000),
  117 + data2: Math.floor(Math.random () * 1000000),
  118 + data3: Math.floor(Math.random () * 100000000),
  119 + data4: Math.floor(Math.random () * Math.random () * 10000),
  120 + data5: Math.floor(Math.random () * Math.random () * 1000000),
  121 + data6: Math.floor(Math.random () * Math.random () * 100000000),
  122 + });
  123 + }
  124 + this.tableData1 = data;
  125 + },
  126 + changePage(){
  127 + this.refreshData();
61 128 }
62 129 }
63 130 }
64 131 -</script>
  132 +</script>
65 133 \ No newline at end of file
... ...