MiniPrograms/subpkg/childrenInfo/childrenInfo.vue

<template>
	<view class="container">
		<!-- 返回按钮 -->
		<back></back>
		<!-- 孩子头部信息 -->
		<view class="top-info">
			<image class="top-avatar" :src="childreninfo.avatar" size="100"></image>
			<view class="top-name">
				<text class="name">{{childreninfo.name}}</text>
				<text class="detail">{{childreninfo.schoolname}}</text>
			</view>
		</view>

		<!-- 内容列表 -->
		<view class="card-box">
			<u-cell-group :border="false">
				<view class="i-item">
					<view class="t-icon t-icon-canyon-nature-svgrepo-com"></view>
					<u-cell class="cell-box" size="large" title="班级" :label="childreninfo.class" :border="false"></u-cell>
				</view>
				<view class="i-item">
					<view class="t-icon t-icon-galata-tower-istanbul-svgrepo-com"></view>
					<u-cell class="cell-box" size="large" title="年龄" label="描述信息" :border="false"></u-cell>
				</view>
				<view class="i-item">
					<view class="t-icon t-icon-desert-nature-svgrepo-com"></view>
					<u-cell class="cell-box" size="large" title="个人信息" label="描述信息" :border="false"></u-cell>
				</view>
			</u-cell-group>
			<!-- 横向内容列表 -->
			<view style="display: flex; flex-wrap: wrap; align-items: center;margin: 0 40rpx 0 40rpx;">
				<view class="data-box-item">
					<view class="item-text">能力卡片</view>
				</view>
				<view class="data-box-item"></view>
				<view class="data-box-item"></view>
				<view class="data-box-item"></view>
			</view>
		</view>

	</view>
</template>

<script>
	import {
		mapState,
		mapMutations
	} from 'vuex'
	export default {
		computed: {
			...mapState('m_children', ['childreninfo', 'semester']),
		},
		data() {
			return {

			};
		},
		methods: {
			...mapMutations('m_children', ['updateChildrenInfo']),
		},
	}
</script>

<style lang="scss">
	@import '@/subpkg/common/infopage.scss';
</style>