front-end/mobile-code-back/src/admin/setting/list.vue

<template>
	<div class="app-content">
		<tui-list-cell :arrow="true" v-for="(item, index) in data" :key="index" @click="pageTo(item)">
			<div class="list">
				<i class="iconfont" :class="[item.icon]"></i>
				<span>{{ item.name }}</span>
			</div>
		</tui-list-cell>
	</div>
</template>

<script>
import TuiListCell from '@/components/plugin/list-cell'
export default {
	name: 'setting-list',
	components: {
		TuiListCell
	},
	data() {
		return {
			data: [
				{
					name: '微信菜单',
					icon: 'iconweixin',
					url: '/admin/setting/wx-menu'
				},
				{
					name: '新人优惠券',
					icon: 'iconxinrenlingquanshezhi',
					url: '/admin/setting/coupon'
				},
				{
					name: '会员等级',
					icon: 'iconhuiyuandengjishezhi',
					url: '/admin/setting/level'
				}
			]
		}
	}
}
</script>

<style lang="scss" scoped>
	.app-content {
		min-height: calc(100vh - 20px);
		padding-top: 20px;
		.list {
			font-size: 32px;
			.iconfont {
                font-size: 50px;
                margin-right: 20px;
			}
		}
	}
</style>