代码优化

app.json

 {
   "pages":[
-    "pages/add_record/index",
-    "pages/home/teacher/index",
     
+    "pages/home/teacher/index",
+    "pages/add_record/index",
     "pages/home/reviewer/index",
     "pages/home/parents/index"
     

app.wxss

@@ -71,6 +71,7 @@
 
 }
 
+/* 横向对齐布局样式 两边对齐 */
 .kg-flex-row {
   justify-content: space-between;
   display: flex;
@@ -78,6 +79,17 @@
   align-items: center;
 }
 
+/* 纵向对齐布局样式 默认对齐方式*/
+.kg-flex-column {
+  display: flex;
+  flex-direction: column;
+  justify-content: space-between;
+  /* 使这个样式可以拉伸 */
+  /* flex-grow: 1;
+  margin-left: 16rpx;
+  height: 120rpx; */
+}
+
 .kg-border {
   border: 2rpx solid rgb(190, 190, 190);
   border-radius: 6rpx;
@@ -101,4 +113,26 @@
 .eat_category_btn.selected {
   border-color: #f9aa76;
 	color: #f9aa76;
+}
+
+/* 首页顶部 */
+.home-header {
+  height: 180rpx;
+  margin-left: 32rpx;
+  margin-right: 32rpx;
+}
+
+/* 用户图片 */
+.kg-user-icon {
+  height: 120rpx;
+  width: 120rpx;
+  border-radius: 60rpx;
+  background-color: blueviolet;
+}
+
+/* 性别图标 */
+.kg-sex-icon {
+  height: 35rpx;
+  width: 30rpx;
+  margin-left: 8rpx;
 }
\ No newline at end of file

pages/add_record/index.wxml

@@ -72,7 +72,7 @@
     <view style='margin:20rpx'>
       <view class='kg-quantity-cell'>
         <template is='quantity_cell' data="{{type:'select',options:['pee','poo','diaper']}}"></template>
-        <text class='kg-text-normal-gray'  style='margin-top:20rpx' space="ensp">pee: 4次    poo: 1次    diaper: 9次</text>
+        <text class='kg-text-normal-gray'  style='margin-top:30rpx' space="ensp">pee: 4次    poo: 1次    diaper: 9次</text>
       </view>
     </view>
   </scroll-view>

pages/home/parents/index.wxml

 <!--pages/home/parents/index.wxml-->
-<text>pages/home/parents/index.wxml</text>
+<view class='home-header'> 
+
+</view>

pages/home/teacher/index.js

@@ -5,7 +5,7 @@ Page({
    * 页面的初始数据
    */
   data: {
-    signIcon:"https://gomore-wxmall.oss-cn-shanghai.aliyuncs.com/miniapp/hangzhouwanke/tabbar/home/score.png",
+    signIcon:"/src/img/signin.png",
     userIcon:"/src/img/defaut_teacher_icon.jpg",
 
   },

pages/home/teacher/index.wxml

 <!--pages/home/teacher/index.wxml-->
 <import src='/template/operate_btn/index.wxml'></import>
-<view class='home-header'>
-  <image class='home-header-user-icon' src='{{userIcon}}'></image>
-  <view class='home-header-user-info'>
-    <view class='kg-text-title'>向日葵小班-张老师</view>
-    <view class='kg-text-normal-gray'>共19人</view>
-  </view>
+<view class='home-header kg-flex-row'>
+  <template is='userInfo' data="{{userImg:userIcon,title:'向日葵小班-张老师',subTitle:'共19人',sex:''}}">
+  </template>
+
   <view class='home-header-roll-call'>
     <image class='roll-call-image' src='{{signIcon}}'></image>
     <view class='roll-call-title'>点名</view>
@@ -20,22 +18,19 @@
       <!-- 名字 -->
       <view class='home-student-name'>
         <view class='kg-text-normal-dark'>张小华</view>
-        <image class='home-student-sex' src='/src/img/female.png' mode='aspectFit'></image>
+        <image class='kg-sex-icon' src='/src/img/female.png' mode='aspectFit'></image>
       </view>
       <!-- 图片 -->
-       <view class='home-student-picture-item'>
+      <view class='home-student-picture-item'>
         <image src='/src/img/student_picture.png' class='home-student-picture' mode='aspectFill'></image>
         <image src='/src/img/student_picture.png' class='home-student-picture' mode='aspectFill'></image>
         <image src='/src/img/student_picture.png' class='home-student-picture' mode='aspectFill'></image>
       </view>
       <!-- 行为 -->
-      <view class='home-student-name' style='justify-content: space-between;margin:0rpx 10rpx;'>
-        <view wx:for="{{[1,2,3]}}">
-          <view class='home-student-name'>
-            <image src='/src/img/eat.png' class='home-student-behavior' mode='aspectFit'></image>
-            <view class='kg-text-normal-dark'>吃饭</view>
-          </view>
-        </view>
+      <view class='home-student-name' style='justify-content: space-between;margin:0rpx 30rpx;'>
+        <template is='imgTextView' data="{{img:'eat',text:'12' }}"> </template>
+        <template is='imgTextView' data="{{img:'sleep',text:'2' }}"> </template>
+        <template is='imgTextView' data="{{img:'wc',text:'2' }}"> </template>
       </view>
     </view>
   </view>

pages/home/teacher/index.wxss

 /* pages/home/teacher/index.wxss */
-
-
-.home-header {
-  height: 180rpx;
-  /* background-color: rgb(182, 179, 179); */
-  display: flex;
-  flex-direction: row;
-  align-items: center;
-  margin-left: 32rpx;
-  margin-right: 32rpx;
-  justify-content: space-between;
-}
-
-.home-header-user-icon {
-  height: 120rpx;
-  width: 120rpx;
-  border-radius: 60rpx;
-  background-color: blueviolet;
-}
-
-.home-header-user-info {
-  height: 120rpx;
-  display: flex;
-  flex-direction: column;
-  justify-content: space-between;
-  /* background-color: burlywood; */
-  flex-grow: 1;
-  margin-left: 16rpx;
-}
-
 .home-header-roll-call {
   width: 120rpx;
   height: 80rpx;
@@ -68,12 +38,6 @@
   align-items: center;
 }
 
-.home-student-sex {
-  height: 40rpx;
-  width: 30rpx;
-  margin-left: 8rpx;
-}
-
 .home-student-behavior {
   width: 60rpx;
   height: 48rpx;

template/operate_btn/index.wxml

 <!--template/operate_btn/index.wxml-->
-
+<!-- 通用的操作按钮 -->
 <template name="operate_btn">
   <view style='position:fixed;bottom: 0rpx;height:140rpx;background-color:white;'>
     <view class='kg-separater' style='height:4rpx;'></view>
@@ -17,6 +17,7 @@
   </view>
 </template>
 
+<!-- 添加记录的cell -->
 <template name='quantity_cell'>
   <view class='kg-flex-row '>
     <view class='g-text-normal-dark'>张小华</view>
@@ -32,4 +33,48 @@
       </view>
     </view>
   </view>
+</template>
+
+<!-- 
+用户信息
+输入参数:
+userImg:用户图片
+sex:性别 f/m (女性/男性)
+title:标题
+subTitle:副标题
+
+-->
+<template name='userInfo'>
+  <view class='kg-flex-row'>
+    <image class='kg-user-icon' src='{{userImg}}'></image>
+    <view class='kg-flex-column' style='margin-left: 16rpx;height: 120rpx;'>
+      <view class='kg-flex-row'>
+        <view class='kg-text-title'>{{title}}</view>
+        <template is="sex" data="{{sex:sex}}"></template>
+      </view>
+      <view class='kg-text-normal-gray'>{{subTitle}}</view>
+    </view>
+  </view>
+</template>
+
+<!-- 
+性别
+sex:性别 f/m (女性/男性)
+ -->
+<template name='sex'>
+  <view class='kg-flex-row'>
+    <view wx:if="{{sex == 'f'}}">
+      <image class='kg-sex-icon' src='/src/img/female.png' mode='aspectFit'></image>
+    </view>
+    <view wx:elif="{{sex == 'm'}}">
+      <image class='kg-sex-icon' src='/src/img/male.png' mode='aspectFit'></image>
+    </view>
+  </view>
+</template>
+<!-- 图片+文字 -->
+<template name='imgTextView'>
+  <view class='kg-flex-row'>
+    <image src='/src/img/{{img}}.png' style='width: 50rpx;height: 40rpx;'></image>
+    <text class='kg-text-normal-dark' style='margin-left:10rpx'>{{text}}</text>
+  </view>
 </template>
\ No newline at end of file