no message

src/views/system/setting/index.vue

@@ -1,8 +1,9 @@
 <template>
 	<el-container>
 		<el-main>
-			<el-card shadow="never">
-				<el-tabs tab-position="top" v-model="activename">
+			<el-card shadow="never" class="setting">
+				<x-page-header title="系统设置" description="可以配置和修改网站的各种设置" icon="el-icon-setting"></x-page-header>
+				<el-tabs tab-position="left" v-model="activename"  v-loading="loading">
 					<el-tab-pane v-for="item in settingList" :key="item.key" :label="item.name" :name="item.key">
 						<x-form ref="formref" :config="formList[item.key]" v-model="info" :loading="loading"> </x-form>
 					</el-tab-pane>
@@ -28,17 +29,64 @@
 						<el-button type="primary" icon="el-icon-plus" @click="table_add" style="margin-top: 20px;"></el-button>
 					</el-tab-pane>
 				</el-tabs>
-				<el-row>
-					<el-col :span="3"></el-col>
-					<el-col :span="20"> 
-						<el-button type="primary" @click="submit" style="max-width: 500px; width: 100%;" :loading="submitloading">保存</el-button>
-					</el-col>
-				</el-row>
 			</el-card>
 		</el-main>
+
+		<el-footer>
+			<el-button type="primary" @click="submit" style="max-width: 500px; width: 100%;" :loading="submitloading">保存</el-button>
+		</el-footer>
+
+
+
 	</el-container>
 </template>
 
+<style scoped>
+	.setting{
+		height: 100%;
+	}
+
+	.setting /deep/ .el-card__body{
+		height: 100%;
+		padding: 0;
+	}
+
+	.x-page-header{
+		padding: 10px 25px;
+	}
+
+	.setting /deep/ .el-tabs__item.is-active{
+		background-color: #f6f8fa;
+	}
+
+	.setting /deep/ .el-tabs--left{
+		height: 100%;
+	}
+	
+	.setting /deep/ .el-tabs__content{
+		padding: 20px;
+	}
+
+	.setting /deep/ .el-tabs {
+	    --el-tabs-header-height: 50px;
+	}
+
+	.setting /deep/ .el-tabs--left .el-tabs__header.is-left{
+		margin: 0;
+		min-width: 120px;
+	}
+
+	.el-footer{
+		padding: 10px;
+	    height: 51px;
+	    margin: 0;
+	    text-align: center;	
+	}
+	
+
+</style>
+
+
 <script>
 	export default {
 		name: 'setting',