Skip to content

Commit 982c671

Browse files
committed
修改样式
1 parent 254ce8d commit 982c671

File tree

3 files changed

+162
-8
lines changed

3 files changed

+162
-8
lines changed

src/layout/Layout.vue

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -43,23 +43,23 @@ export default {
4343
left: 0;
4444
top: 50px;
4545
right: 0;
46-
bottom: 0;
46+
bottom: -30px;
4747
.view {
4848
width: auto;
49-
height: 100%;
49+
height: inherit;
5050
padding: 1rem;
5151
position: absolute;
5252
left: 240px;
5353
right: 0;
5454
top: 0;
55-
bottom: 0;
56-
padding-bottom: 30px;
55+
bottom: 30px;
5756
transition: left 0.3s ease-in-out;
5857
background: #f0f0f0;
58+
overflow-y: auto;
5959
.conatiner {
6060
background: #fff;
6161
width: inherit;
62-
height: inherit;
62+
min-height: calc(100% - 35px);
6363
padding: 1rem;
6464
}
6565
}

src/layout/header/Index.vue

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -185,6 +185,7 @@ export default {
185185
margin-right: 2rem;
186186
display: flex;
187187
flex-direction: row;
188+
justify-content: flex-end;
188189
.btn-fullscreen {
189190
transform: rotate(45deg);
190191
margin-right: 5px;
@@ -193,7 +194,6 @@ export default {
193194
}
194195
.el-dropdown {
195196
color: #fff;
196-
flex: 1;
197197
}
198198
}
199199
}

src/views/pages/table/Index.vue

Lines changed: 156 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -23,13 +23,29 @@
2323
>
2424
</el-table-column>
2525
</el-table>
26+
<div class="pagination">
27+
<el-pagination
28+
background
29+
hide-on-single-page
30+
layout="total, prev, pager, next,jumper"
31+
:current-page="query.pageIndex"
32+
:page-size="query.pageSize"
33+
:total="pageTotal"
34+
@current-change="handlePageChange"
35+
></el-pagination>
36+
</div>
2637
</div>
2738
</template>
2839

2940
<script>
3041
export default {
3142
data () {
3243
return {
44+
query: {
45+
pageIndex: 1,
46+
pageSize: 10
47+
},
48+
pageTotal: 20,
3349
tableData: [{
3450
date: '2016-05-02',
3551
name: '王小虎',
@@ -42,15 +58,153 @@ export default {
4258
date: '2016-05-01',
4359
name: '王小虎',
4460
address: '上海市普陀区金沙江路 1519 弄'
45-
}, {
61+
},
62+
{
63+
date: '2016-05-03',
64+
name: '王小虎',
65+
address: '上海市普陀区金沙江路 1516 弄'
66+
},
67+
{
68+
date: '2016-05-03',
69+
name: '王小虎',
70+
address: '上海市普陀区金沙江路 1516 弄'
71+
},
72+
{
73+
date: '2016-05-03',
74+
name: '王小虎',
75+
address: '上海市普陀区金沙江路 1516 弄'
76+
},
77+
{
78+
date: '2016-05-03',
79+
name: '王小虎',
80+
address: '上海市普陀区金沙江路 1516 弄'
81+
},
82+
{
83+
date: '2016-05-03',
84+
name: '王小虎',
85+
address: '上海市普陀区金沙江路 1516 弄'
86+
},
87+
{
88+
date: '2016-05-03',
89+
name: '王小虎',
90+
address: '上海市普陀区金沙江路 1516 弄'
91+
},
92+
{
93+
date: '2016-05-03',
94+
name: '王小虎',
95+
address: '上海市普陀区金沙江路 1516 弄'
96+
},
97+
{
98+
date: '2016-05-03',
99+
name: '王小虎',
100+
address: '上海市普陀区金沙江路 1516 弄'
101+
},
102+
{
103+
date: '2016-05-03',
104+
name: '王小虎',
105+
address: '上海市普陀区金沙江路 1516 弄'
106+
},
107+
{
108+
date: '2016-05-03',
109+
name: '王小虎',
110+
address: '上海市普陀区金沙江路 1516 弄'
111+
},
112+
{
113+
date: '2016-05-03',
114+
name: '王小虎',
115+
address: '上海市普陀区金沙江路 1516 弄'
116+
},
117+
{
118+
date: '2016-05-03',
119+
name: '王小虎',
120+
address: '上海市普陀区金沙江路 1516 弄'
121+
},
122+
{
123+
date: '2016-05-03',
124+
name: '王小虎',
125+
address: '上海市普陀区金沙江路 1516 弄'
126+
},
127+
{
128+
date: '2016-05-03',
129+
name: '王小虎',
130+
address: '上海市普陀区金沙江路 1516 弄'
131+
},
132+
{
133+
date: '2016-05-03',
134+
name: '王小虎',
135+
address: '上海市普陀区金沙江路 1516 弄'
136+
},
137+
{
138+
date: '2016-05-03',
139+
name: '王小虎',
140+
address: '上海市普陀区金沙江路 1516 弄'
141+
},
142+
{
46143
date: '2016-05-03',
47144
name: '王小虎',
48145
address: '上海市普陀区金沙江路 1516 弄'
49-
}]
146+
},
147+
{
148+
date: '2016-05-03',
149+
name: '王小虎',
150+
address: '上海市普陀区金沙江路 1516 弄'
151+
},
152+
{
153+
date: '2016-05-03',
154+
name: '王小虎',
155+
address: '上海市普陀区金沙江路 1516 弄'
156+
},
157+
{
158+
date: '2016-05-03',
159+
name: '王小虎',
160+
address: '上海市普陀区金沙江路 1516 弄'
161+
},
162+
{
163+
date: '2016-05-03',
164+
name: '王小虎',
165+
address: '上海市普陀区金沙江路 1516 弄'
166+
},
167+
{
168+
date: '2016-05-03',
169+
name: '王小虎',
170+
address: '上海市普陀区金沙江路 1516 弄'
171+
},
172+
{
173+
date: '2016-05-03',
174+
name: '王小虎',
175+
address: '上海市普陀区金沙江路 1516 弄'
176+
},
177+
{
178+
date: '2016-05-03',
179+
name: '王小虎',
180+
address: '上海市普陀区金沙江路 1516 弄'
181+
},
182+
{
183+
date: '2016-05-03',
184+
name: '王小虎',
185+
address: '上海市普陀区金沙江路 1516 弄'
186+
},
187+
{
188+
date: '2016-05-03',
189+
name: '王小虎',
190+
address: '上海市普陀区金沙江路 1516 弄'
191+
},
192+
]
193+
}
194+
},
195+
methods: {
196+
handlePageChange (val) {
197+
console.log(val);
50198
}
51199
}
52200
}
53201
</script>
54202

55203
<style lang="scss" scoped>
204+
.pagination {
205+
display: flex;
206+
flex-direction: row;
207+
justify-content: flex-end;
208+
margin: 30px 0;
209+
}
56210
</style>

0 commit comments

Comments
 (0)