other / mew-iview

Commit 39311a508f44cc6174feb6da6ce90dee7c98d15d

Authored by 梁灏
1 parent 6c99b9fe

update Table 

update Table
Showing 5 changed files with 67 additions and 44 deletions   Show diff stats
Inline Side-by-side
src/components/table/table-body.vue
  Show/Hide comments   View file @39311a5
... ... @@ -70,4 +70,4 @@
70 70 }
71 71 }
72 72 }
73 73 -</script>
  74 +</script>
74 75 \ No newline at end of file
... ...
src/components/table/table-head.vue
  Show/Hide comments   View file @39311a5
... ... @@ -128,4 +128,4 @@
128 128 }
129 129 }
130 130 }
131 131 -</script>
  132 +</script>
132 133 \ No newline at end of file
... ...
src/components/table/table.vue
  Show/Hide comments   View file @39311a5
1 1 <template>
2 2 <div :class="wrapClasses" :style="styles">
3   - <div :class="classes" :style="styles">
  3 + <div :class="classes">
4 4 <div :class="[prefixCls + '-title']" v-if="showSlotHeader" v-el:title><slot name="header"></slot></div>
5 5 <div :class="[prefixCls + '-header']" v-if="showHeader" v-el:header @mousewheel="handleMouseWheel">
6 6 <table-head
7   - :prefix-cls="prefixCls"
8   - :style="tableStyle"
9   - :columns="cloneColumns"
10   - :obj-data="objData"
11   - :data="rebuildData"></table-head>
  7 + :prefix-cls="prefixCls"
  8 + :style="tableStyle"
  9 + :columns="cloneColumns"
  10 + :obj-data="objData"
  11 + :data="rebuildData"></table-head>
12 12 </div>
13 13 <div :class="[prefixCls + '-body']" :style="bodyStyle" v-el:body @scroll="handleBodyScroll">
14 14 <table-body
15   - v-ref:tbody
16   - :prefix-cls="prefixCls"
17   - :style="tableStyle"
18   - :columns="cloneColumns"
19   - :data="rebuildData"
20   - :obj-data="objData"></table-body>
  15 + v-ref:tbody
  16 + :prefix-cls="prefixCls"
  17 + :style="tableStyle"
  18 + :columns="cloneColumns"
  19 + :data="rebuildData"
  20 + :obj-data="objData"></table-body>
21 21 </div>
22 22 <div :class="[prefixCls + '-fixed']">
23 23 <div :class="[prefixCls + '-fixed-header']" v-if="showHeader">
24 24 <table-head
25   - fixed
26   - :prefix-cls="prefixCls"
27   - :style="fixedTableStyle"
28   - :columns="leftFixedColumns"
29   - :obj-data="objData"
30   - :data="rebuildData"></table-head>
  25 + fixed
  26 + :prefix-cls="prefixCls"
  27 + :style="fixedTableStyle"
  28 + :columns="leftFixedColumns"
  29 + :obj-data="objData"
  30 + :data="rebuildData"></table-head>
31 31 </div>
32 32 <div :class="[prefixCls + '-fixed-body']" :style="fixedBodyStyle" v-el:fixed-body>
33 33 <table-body
34   - fixed
35   - :prefix-cls="prefixCls"
36   - :style="fixedTableStyle"
37   - :columns="leftFixedColumns"
38   - :data="rebuildData"
39   - :obj-data="objData"></table-body>
  34 + fixed
  35 + :prefix-cls="prefixCls"
  36 + :style="fixedTableStyle"
  37 + :columns="leftFixedColumns"
  38 + :data="rebuildData"
  39 + :obj-data="objData"></table-body>
40 40 </div>
41 41 </div>
42 42 <div :class="[prefixCls + '-fixed-right']">
43 43 <div :class="[prefixCls + '-fixed-header']" v-if="showHeader">
44 44 <table-head
45   - fixed
46   - :prefix-cls="prefixCls"
47   - :style="fixedRightTableStyle"
48   - :columns="rightFixedColumns"
49   - :obj-data="objData"
50   - :data="rebuildData"></table-head>
  45 + fixed
  46 + :prefix-cls="prefixCls"
  47 + :style="fixedRightTableStyle"
  48 + :columns="rightFixedColumns"
  49 + :obj-data="objData"
  50 + :data="rebuildData"></table-head>
51 51 </div>
52 52 <div :class="[prefixCls + '-fixed-body']" :style="fixedBodyStyle" v-el:fixed-right-body>
53 53 <table-body
54   - fixed
55   - :prefix-cls="prefixCls"
56   - :style="fixedRightTableStyle"
57   - :columns="rightFixedColumns"
58   - :data="rebuildData"
59   - :obj-data="objData"></table-body>
  54 + fixed
  55 + :prefix-cls="prefixCls"
  56 + :style="fixedRightTableStyle"
  57 + :columns="rightFixedColumns"
  58 + :data="rebuildData"
  59 + :obj-data="objData"></table-body>
60 60 </div>
61 61 </div>
62 62 <div :class="[prefixCls + '-footer']" v-if="showSlotFooter" v-el:footer><slot name="footer"></slot></div>
... ...
src/styles/components/table.less
  Show/Hide comments   View file @39311a5
... ... @@ -8,7 +8,8 @@
8 8 border-bottom: 0;
9 9 border-right: 0;
10 10 }
11   - width: 100%;
  11 + width: inherit;
  12 + height: 100%;
12 13 max-width: 100%;
13 14 overflow: hidden;
14 15 color: @text-color;
... ... @@ -205,7 +206,8 @@
205 206 position: absolute;
206 207 top: 0;
207 208 left: 0;
208   - box-shadow: @shadow-right;
  209 + //box-shadow: @shadow-right;
  210 + box-shadow: 2px 0 6px -2px rgba(0, 0, 0, 0.2);
209 211  
210 212 &::before {
211 213 content: '';
... ... @@ -222,12 +224,13 @@
222 224 top: 0;
223 225 left: auto;
224 226 right: 0;
225   - box-shadow: @shadow-left;
  227 + //box-shadow: @shadow-left;
  228 + box-shadow: -2px 0 6px -2px rgba(0, 0, 0, 0.2);
226 229 }
227 230 &-fixed-header{
228 231 overflow: hidden;
229 232 //position: relative;
230   - z-index: 3;
  233 + //z-index: 3;
231 234 }
232 235 &-fixed-body{
233 236 overflow: hidden;
... ... @@ -235,6 +238,17 @@
235 238 z-index: 3;
236 239 }
237 240  
  241 + &-fixed-shadow {
  242 + width: 1px;
  243 + height: 100%;
  244 + position: absolute;
  245 + top: 0;
  246 + right: 0;
  247 + box-shadow: @shadow-right;
  248 + overflow: hidden;
  249 + z-index: 1;
  250 + }
  251 +
238 252 &-sort{
239 253 .sortable();
240 254 }
... ...
test/routers/table.vue
  Show/Hide comments   View file @39311a5
... ... @@ -8,9 +8,10 @@
8 8 <!--<i-table size="large" border stripe :columns="columns" :data="data"></i-table>-->
9 9 <br>
10 10 <i-table
11   - width="850"
  11 + width="450"
  12 + :height="height"
12 13 stripe
13   - border
  14 + :border="true"
14 15 highlight-row
15 16 :show-header="true"
16 17 :columns="columns"
... ... @@ -239,6 +240,14 @@
239 240 // });
240 241 // this.data.splice(0, 1);
241 242 // this.columns.splice(2,1)
  243 +// this.data.push({
  244 +// name: '梁灏2',
  245 +// age: 25,
  246 +// address: '北京市朝阳区',
  247 +// edit: false,
  248 +// tag: 'home',
  249 +// action: 1
  250 +// })
242 251 }, 3000);
243 252 }
244 253 }
... ...