骑士驿站

miniprogram/app.json

@@ -5,7 +5,7 @@
         "pages/knight/knight",
         "pages/redGrider/redGrider",
         "pages/Pioneer/Pioneer",
-        "pages/CheckIn/CheckIn",
+        "pages/checkIn/checkIn",
         "pages/volunteer/volunteer",
         "pages/message/message",
         "pages/my/my",

miniprogram/pages/CheckIn/CheckIn.js

@@ -1,11 +1,13 @@
-// pages/CheckIn/CheckIn.js
+// pages/redGrider/redGrider.js
+const app = getApp()
 Page({
 
     /**
      * 页面的初始数据
      */
     data: {
-
+        statusHeight: app.globalData.deviceInfo.statusHeight, // 自定义头部状态栏高度
+        navigationHeight: app.globalData.deviceInfo.navigationHeight,
     },
 
     /**
@@ -62,5 +64,12 @@ Page({
      */
     onShareAppMessage() {
 
-    }
+    },
+    back() {
+        console.log("dddddddddd")
+        //返回上一级，关闭当前页面
+        wx.navigateBack({
+            delta: 1
+        })
+    },
 })

miniprogram/pages/CheckIn/CheckIn.json

@@ -1,3 +1,8 @@
 {
-    "usingComponents": {}
-}
+    "navigationBarTitleText": "在职党员",
+    "navigationStyle": "custom",
+    "navigationBarTextStyle": "white",
+    "enablePullDownRefresh": true,
+    "backgroundColor": "#f8f8f8",
+    "backgroundTextStyle": "dark"
+  }

miniprogram/pages/CheckIn/CheckIn.wxml

@@ -1,2 +1,72 @@
-<!--pages/CheckIn/CheckIn.wxml-->
-<text>pages/CheckIn/CheckIn.wxml</text>
+<view class="header">
+     <image src="../../images/main/back.png" class="back" style=" top: {{statusHeight}}px;"  bindtap="back"></image>
+    <image class="header-bg" src="../../images/main/redSail_bg.png" mode="widthFix" />
+    <view class="navigation" style="height: {{navigationHeight}}px; top: {{statusHeight}}px;">
+        红帆支部
+    </view>
+</view>
+<view class="mtf80">
+    <view class="list">
+        <view class="item ">
+            <image src="../../images/main/redSail01.png" class="icon"></image>
+            <view class="vcenter flex1">
+                <view class="h1">红帆领航</view>
+                <view class="h2">
+                    在认真完成《中国共产党章···
+                </view>
+            </view>
+            <view class="vcenter w20">
+                <image src="../../images/main/redSail_right.png"  class="go"></image>
+            </view>
+        </view>
+        <view class="item ">
+            <image src="../../images/main/redSail02.png" class="icon"></image>
+            <view class="vcenter flex1">
+                <view class="h1">我要入党</view>
+                <view class="h2">
+                    “红帆支部”主要接受城市社···
+                </view>
+            </view>
+            <view class="vcenter w20">
+                <image src="../../images/main/redSail_right.png"  class="go"></image>
+            </view>
+        </view>
+        <view class="item ">
+            <image src="../../images/main/redSail03.png" class="icon"></image>
+            <view class="vcenter flex1">
+                <view class="h1">流动党员报到</view>
+                <view class="h2">
+                    外来流动党员，一般指党员···
+                </view>
+            </view>
+            <view class="vcenter w20">
+                <image src="../../images/main/redSail_right.png"  class="go"></image>
+            </view>
+        </view>
+        <view class="item ">
+            <image src="../../images/main/redSail04.png" class="icon"></image>
+            <view class="vcenter flex1">
+                <view class="h1">我要转出</view>
+                <view class="h2">
+                    填写身份信息以及转出事由
+                </view>
+            </view>
+            <view class="vcenter w20">
+                <image src="../../images/main/redSail_right.png"  class="go"></image>
+            </view>
+        </view>
+        <view class="item ">
+            <image src="../../images/main/redSail05.png" class="icon"></image>
+            <view class="vcenter flex1">
+                <view class="h1">我的支部</view>
+                <view class="h2">
+                    我所在的支部信息
+                </view>
+            </view>
+            <view class="vcenter w20">
+                <image src="../../images/main/redSail_right.png"  class="go"></image>
+            </view>
+        </view>
+
+    </view>
+</view>

miniprogram/pages/CheckIn/CheckIn.wxss

@@ -1 +1,113 @@
-/* pages/CheckIn/CheckIn.wxss */
+page {
+    width: 100%;
+    height: auto;
+    overflow-y: auto;
+    background: #f7f7f7;
+    font-family: PingFang SC;
+}
+
+.header {
+
+    width: 100%;
+    height: 484rpx;
+    /* position: fixed;
+    top: 0;
+    left: 0;
+    z-index: 1000; */
+}
+
+.header .header-bg {
+    width: 100%;
+    height: 100%;
+    /* position: absolute;
+    z-index: 10;
+    left: 0;
+    top: 0; */
+    position: absolute;
+    height: 100%;
+    z-index: -999;
+}
+
+.header .navigation {
+    width: 100%;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    color: rgba(255, 255, 255, 0.9);
+    font-size: 32rpx;
+    position: relative;
+    z-index: 1;
+}
+
+.w20 {
+    width: 20rpx;
+}
+
+.flex1 {
+    flex: 1;
+}
+
+.mtf80 {
+    margin-top: -80rpx;
+}
+
+.back {
+    width: 20rpx;
+    height: 20rpx;
+    margin-left: 20rpx;
+    position: absolute;
+    margin-top: 20rpx;
+    border-radius: 0rpx;
+    z-index: 2;
+}
+
+.list {
+    padding: 20rpx 35rpx;
+
+}
+
+.list .item {
+    padding: 40rpx 40rpx;
+
+    display: flex;
+    background-color: #fff;
+    border-radius: 10rpx;
+    margin-bottom: 20rpx;
+}
+
+.vcenter {
+    display: flex;
+    flex-direction: column;
+    justify-content: center;
+}
+
+.list .item .icon {
+    width: 130rpx;
+    height: 130rpx;
+    margin-right: 20rpx;
+    border-radius: 0rpx;
+}
+
+.list .item .go {
+    width: 20rpx;
+    height: 20rpx;
+    margin-right: 20rpx;
+    border-radius: 0rpx;
+}
+
+.list .item .h1 {
+    font-size: 36rpx;
+    color: #333333;
+    line-height: 1rem;
+    margin-bottom: 5rpx;
+}
+
+.list .item .h2 {
+    font-size: 28rpx;
+    color: #999;
+    line-height: 1rem;
+}
+
+.list .item .h2 .time {
+    float: right;
+}

miniprogram/pages/Pioneer/Pioneer.js

@@ -1,11 +1,13 @@
-// pages/Pioneer/Pioneer.js
+// pages/redGrider/redGrider.js
+const app = getApp()
 Page({
 
     /**
      * 页面的初始数据
      */
     data: {
-
+        statusHeight: app.globalData.deviceInfo.statusHeight, // 自定义头部状态栏高度
+        navigationHeight: app.globalData.deviceInfo.navigationHeight,
     },
 
     /**
@@ -62,5 +64,12 @@ Page({
      */
     onShareAppMessage() {
 
-    }
+    },
+    back() {
+        console.log("dddddddddd")
+        //返回上一级，关闭当前页面
+        wx.navigateBack({
+            delta: 1
+        })
+    },
 })

miniprogram/pages/Pioneer/Pioneer.json

@@ -1,3 +1,8 @@
 {
-    "usingComponents": {}
-}
+    "navigationBarTitleText": "西海岸先锋",
+    "navigationStyle": "custom",
+    "navigationBarTextStyle": "white",
+    "enablePullDownRefresh": true,
+    "backgroundColor": "#f8f8f8",
+    "backgroundTextStyle": "dark"
+  }

miniprogram/pages/Pioneer/Pioneer.wxml

@@ -1,2 +1,72 @@
-<!--pages/Pioneer/Pioneer.wxml-->
-<text>pages/Pioneer/Pioneer.wxml</text>
+<view class="header">
+     <image src="../../images/main/back.png" class="back" style=" top: {{statusHeight}}px;"  bindtap="back"></image>
+    <image class="header-bg" src="../../images/main/redSail_bg.png" mode="widthFix" />
+    <view class="navigation" style="height: {{navigationHeight}}px; top: {{statusHeight}}px;">
+        红帆支部
+    </view>
+</view>
+<view class="mtf80">
+    <view class="list">
+        <view class="item ">
+            <image src="../../images/main/redSail01.png" class="icon"></image>
+            <view class="vcenter flex1">
+                <view class="h1">红帆领航</view>
+                <view class="h2">
+                    在认真完成《中国共产党章···
+                </view>
+            </view>
+            <view class="vcenter w20">
+                <image src="../../images/main/redSail_right.png"  class="go"></image>
+            </view>
+        </view>
+        <view class="item ">
+            <image src="../../images/main/redSail02.png" class="icon"></image>
+            <view class="vcenter flex1">
+                <view class="h1">我要入党</view>
+                <view class="h2">
+                    “红帆支部”主要接受城市社···
+                </view>
+            </view>
+            <view class="vcenter w20">
+                <image src="../../images/main/redSail_right.png"  class="go"></image>
+            </view>
+        </view>
+        <view class="item ">
+            <image src="../../images/main/redSail03.png" class="icon"></image>
+            <view class="vcenter flex1">
+                <view class="h1">流动党员报到</view>
+                <view class="h2">
+                    外来流动党员，一般指党员···
+                </view>
+            </view>
+            <view class="vcenter w20">
+                <image src="../../images/main/redSail_right.png"  class="go"></image>
+            </view>
+        </view>
+        <view class="item ">
+            <image src="../../images/main/redSail04.png" class="icon"></image>
+            <view class="vcenter flex1">
+                <view class="h1">我要转出</view>
+                <view class="h2">
+                    填写身份信息以及转出事由
+                </view>
+            </view>
+            <view class="vcenter w20">
+                <image src="../../images/main/redSail_right.png"  class="go"></image>
+            </view>
+        </view>
+        <view class="item ">
+            <image src="../../images/main/redSail05.png" class="icon"></image>
+            <view class="vcenter flex1">
+                <view class="h1">我的支部</view>
+                <view class="h2">
+                    我所在的支部信息
+                </view>
+            </view>
+            <view class="vcenter w20">
+                <image src="../../images/main/redSail_right.png"  class="go"></image>
+            </view>
+        </view>
+
+    </view>
+</view>

miniprogram/pages/Pioneer/Pioneer.wxss

@@ -1 +1,113 @@
-/* pages/Pioneer/Pioneer.wxss */
+page {
+    width: 100%;
+    height: auto;
+    overflow-y: auto;
+    background: #f7f7f7;
+    font-family: PingFang SC;
+}
+
+.header {
+
+    width: 100%;
+    height: 484rpx;
+    /* position: fixed;
+    top: 0;
+    left: 0;
+    z-index: 1000; */
+}
+
+.header .header-bg {
+    width: 100%;
+    height: 100%;
+    /* position: absolute;
+    z-index: 10;
+    left: 0;
+    top: 0; */
+    position: absolute;
+    height: 100%;
+    z-index: -999;
+}
+
+.header .navigation {
+    width: 100%;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    color: rgba(255, 255, 255, 0.9);
+    font-size: 32rpx;
+    position: relative;
+    z-index: 1;
+}
+
+.w20 {
+    width: 20rpx;
+}
+
+.flex1 {
+    flex: 1;
+}
+
+.mtf80 {
+    margin-top: -80rpx;
+}
+
+.back {
+    width: 20rpx;
+    height: 20rpx;
+    margin-left: 20rpx;
+    position: absolute;
+    margin-top: 20rpx;
+    border-radius: 0rpx;
+    z-index: 2;
+}
+
+.list {
+    padding: 20rpx 35rpx;
+
+}
+
+.list .item {
+    padding: 40rpx 40rpx;
+
+    display: flex;
+    background-color: #fff;
+    border-radius: 10rpx;
+    margin-bottom: 20rpx;
+}
+
+.vcenter {
+    display: flex;
+    flex-direction: column;
+    justify-content: center;
+}
+
+.list .item .icon {
+    width: 130rpx;
+    height: 130rpx;
+    margin-right: 20rpx;
+    border-radius: 0rpx;
+}
+
+.list .item .go {
+    width: 20rpx;
+    height: 20rpx;
+    margin-right: 20rpx;
+    border-radius: 0rpx;
+}
+
+.list .item .h1 {
+    font-size: 36rpx;
+    color: #333333;
+    line-height: 1rem;
+    margin-bottom: 5rpx;
+}
+
+.list .item .h2 {
+    font-size: 28rpx;
+    color: #999;
+    line-height: 1rem;
+}
+
+.list .item .h2 .time {
+    float: right;
+}

miniprogram/pages/home/home.wxml

@@ -7,39 +7,49 @@
 <view class="bgw topf50">
     <view class="gridouter">
         <view class="grid">
-        <navigator url="/pages/redSail/redSail" >
-            <image src="../../images/main/home01.png" />
-            <view>红帆支队</view>
-        </navigator>
+            <navigator url="/pages/redSail/redSail">
+                <image src="../../images/main/home01.png" />
+                <view>红帆支队</view>
+            </navigator>
         </view>
         <view class="grid">
-            <image src="../../images/main/home02.png" />
+            <navigator url="/pages/knight/knight">
+            <image src=" ../../images/main/home02.png" />
             <view>骑士驿站</view>
+            </navigator>
         </view>
         <view class="grid">
-            <image src="../../images/main/home03.png" />
-            <view>红色网格员</view>
+            <navigator url="/pages/redGrider/redGrider">
+                <image src="../../images/main/home03.png" />
+                <view>红色网格员</view>
+            </navigator>
         </view>
         <view class="grid">
-            <image src="../../images/main/home04.png" />
-            <view>西海岸先锋</view>
+            <navigator url="/pages/Pioneer/Pioneer">
+                <image src="../../images/main/home04.png" />
+                <view>西海岸先锋</view>
+            </navigator>
         </view>
     </view>
     <view class="grid2outer">
         <view class="grid2 blue">
-            <image src="../../images/main/home05.png" />
-            <view>
-                <view class="h1">在职党员</view>
-                <view class="h2">到居住社区报到</view>
-            </view>
+            <navigator url="/pages/checkIn/checkIn">
+                <image src="../../images/main/home05.png" />
+                <view>
+                    <view class="h1">在职党员</view>
+                    <view class="h2">到居住社区报到</view>
+                </view>
+            </navigator>
         </view>
         <view class="w40"></view>
         <view class="grid2 red">
-            <image src="../../images/main/home06.png" />
-            <view>
-                <view class="h1">红色尖兵</view>
-                <view class="h2">志愿服务队</view>
-            </view>
+            <navigator url="/pages/volunteer/volunteer">
+                <image src="../../images/main/home06.png" />
+                <view>
+                    <view class="h1">红色尖兵</view>
+                    <view class="h2">志愿服务队</view>
+                </view>
+            </navigator>
         </view>
     </view>
 </view>

miniprogram/pages/knight/knight.js

@@ -1,11 +1,13 @@
-// pages/knight/knight.js
+// pages/redGrider/redGrider.js
+const app = getApp()
 Page({
 
     /**
      * 页面的初始数据
      */
     data: {
-
+        statusHeight: app.globalData.deviceInfo.statusHeight, // 自定义头部状态栏高度
+        navigationHeight: app.globalData.deviceInfo.navigationHeight,
     },
 
     /**
@@ -62,5 +64,12 @@ Page({
      */
     onShareAppMessage() {
 
-    }
+    },
+    back() {
+        console.log("dddddddddd")
+        //返回上一级，关闭当前页面
+        wx.navigateBack({
+            delta: 1
+        })
+    },
 })

miniprogram/pages/knight/knight.json

@@ -1,3 +1,8 @@
 {
-    "usingComponents": {}
-}
+    "navigationBarTitleText": "骑士驿站",
+    "navigationStyle": "custom",
+    "navigationBarTextStyle": "white",
+    "enablePullDownRefresh": true,
+    "backgroundColor": "#f8f8f8",
+    "backgroundTextStyle": "dark"
+  }

miniprogram/pages/knight/knight.wxml

@@ -1,2 +1,83 @@
-<!--pages/knight/knight.wxml-->
-<text>pages/knight/knight.wxml</text>
+<view class="header">
+     <image src="../../images/main/back2.png" class="back" style=" top: {{statusHeight}}px;"  bindtap="back"></image>
+    <image class="header-bg" src="../../images/knight/knight_bg.png" mode="widthFix" />
+    <view class="navigation" style="height: {{navigationHeight}}px; top: {{statusHeight}}px;">
+        骑士驿站
+    </view>
+</view>
+<view class="mtf80">
+    <view class="list">
+        <view class="item color01">
+            <image src="../../images/knight/knight01.png" class="icon"></image>
+            <view class="vcenter flex1">
+                <view class="h1">驿站简介</view>
+                <view class="h2">
+                    “骑士驿站”是面向全区外卖、快递···
+                </view>
+            </view>
+            <view class="vcenter w20">
+                <image src="../../images/knight/knight01r.png"  class="go"></image>
+            </view>
+        </view>
+        <view class="item color02">
+            <image src="../../images/knight/knight02.png" class="icon"></image>
+            <view class="vcenter flex1">
+                <view class="h1">驿站地图</view>
+                <view class="h2">
+                    主要是浏览、查询附近驿站点位。
+                </view>
+            </view>
+            <view class="vcenter w20">
+                <image src="../../images/knight/knight02r.png"  class="go"></image>
+            </view>
+        </view>
+        <view class="item color03">
+            <image src="../../images/knight/knight03.png" class="icon"></image>
+            <view class="vcenter flex1">
+                <view class="h1">骑士注册</view>
+                <view class="h2">
+                    注册骑士的详细内容以及参与的驿站。
+                </view>
+            </view>
+            <view class="vcenter w20">
+                <image src="../../images/knight/knight03r.png"  class="go"></image>
+            </view>
+        </view>
+        <view class="item color04">
+            <image src="../../images/knight/knight04.png" class="icon"></image>
+            <view class="vcenter flex1">
+                <view class="h1">骑先锋</view>
+                <view class="h2">
+                    申请加入红色网格员。
+                </view>
+            </view>
+            <view class="vcenter w20">
+                <image src="../../images/knight/knight04r.png"  class="go"></image>
+            </view>
+        </view>
+        <view class="item color05">
+            <image src="../../images/knight/knight05.png" class="icon"></image>
+            <view class="vcenter flex1">
+                <view class="h1">骑士上报</view>
+                <view class="h2">
+                    内容XXXXXXXXXXXXXXXXXXXX···
+                </view>
+            </view>
+            <view class="vcenter w20">
+                <image src="../../images/knight/knight05r.png"  class="go"></image>
+            </view>
+        </view>
+        <view class="item color06">
+            <image src="../../images/knight/knight06.png" class="icon"></image>
+            <view class="vcenter flex1">
+                <view class="h1">关爱行动</view>
+                <view class="h2">
+                    全区关爱活动的活动详情。
+                </view>
+            </view>
+            <view class="vcenter w20">
+                <image src="../../images/knight/knight06r.png"  class="go"></image>
+            </view>
+        </view>
+    </view>
+</view>

miniprogram/pages/knight/knight.wxss

@@ -1 +1,176 @@
-/* pages/knight/knight.wxss */
+page {
+    width: 100%;
+    height: auto;
+    overflow-y: auto;
+    background: #fff;
+    font-family: PingFang SC;
+}
+
+.header {
+
+    width: 100%;
+    height: 484rpx;
+    /* position: fixed;
+    top: 0;
+    left: 0;
+    z-index: 1000; */
+}
+
+.header .header-bg {
+    width: 100%;
+    height: 100%;
+    /* position: absolute;
+    z-index: 10;
+    left: 0;
+    top: 0; */
+    position: absolute;
+    height: 100%;
+    z-index: -999;
+}
+
+.header .navigation {
+    width: 100%;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    color: rgba(0, 0, 0, 0.9);
+    font-size: 32rpx;
+    position: relative;
+    z-index: 1;
+}
+
+.w20 {
+    width: 38rpx;
+}
+
+.flex1 {
+    flex: 1;
+}
+
+.mtf80 {
+    margin-top: -80rpx;
+}
+
+.back {
+    width: 20rpx;
+    height: 20rpx;
+    margin-left: 20rpx;
+    position: absolute;
+    margin-top: 20rpx;
+    border-radius: 0rpx;
+    z-index: 2;
+}
+
+.list {
+    padding: 20rpx 35rpx;
+
+}
+
+.list .item {
+    padding: 50rpx 40rpx;
+
+    display: flex;
+    background-color: #fff;
+    border-radius: 10rpx;
+    margin-bottom: 20rpx;
+}
+
+.vcenter {
+    display: flex;
+    flex-direction: column;
+    justify-content: center;
+}
+
+.list .item .icon {
+    width: 70rpx;
+    height: 70rpx;
+    margin-right: 20rpx;
+    border-radius: 0rpx;
+}
+
+.list .item .go {
+    width: 38rpx;
+    height: 38rpx;
+    margin-right: 20rpx;
+    border-radius: 0rpx;
+}
+
+.list .item .h1 {
+    font-size: 36rpx;
+
+    line-height: 1rem;
+    margin-bottom: 20rpx;
+}
+
+.list .item .h2 {
+    font-size: 28rpx;
+
+    line-height: 1rem;
+}
+
+.list .item .h2 .time {
+    float: right;
+}
+
+.color01 {
+    border-image: linear-gradient(124deg, #FFFFFF, #FFFFFF) 10 10;
+    background: linear-gradient(82deg, #FFFFFF 0%, #000000 0%, #F2FFFB 0%, #E5FFF9 100%);
+    color: #224D3F;
+}
+
+.color02 {
+    border-image: linear-gradient(124deg, #FFFFFF, #FFFFFF) 10 10;
+    background: linear-gradient(82deg, #F2FFFB 0%, #FFFFFF 0%, #F2FAFD 0%, #E5F6FF 100%);
+    box-shadow: 0px 4px 12px 0px rgba(202, 202, 202, 0.24);
+    color: #3B5B8C;
+}
+
+.color03 {
+    border-image: linear-gradient(146deg, #FFFFFF, #FFFFFF) 10 10;
+    background: linear-gradient(82deg, #F8FAFF 0%, #F9FFFD 0%, #F6FDFF 0%, #EBFAFF 100%);
+    box-shadow: 0px 4px 12px 0px rgba(202, 202, 202, 0.24);
+    color: #117589;
+}
+
+.color04 {
+    border-image: linear-gradient(146deg, #FFFFFF, #FFFFFF) 10 10;
+    background: linear-gradient(82deg, #FEFEF2 0%, #F2FAFD 0%, #FFFEFA 0%, #FEF8E8 100%);
+    box-shadow: 0px 6px 16px 0px rgba(202, 202, 202, 0.42);
+    color: #A96C35;
+}
+
+.color05 {
+    background: linear-gradient(82deg, #FEF2F3 0%, #FFFCFB 0%, #F8F4FF 0%, #EFE4FF 100%);
+    box-shadow: 0px 6px 16px 0px rgba(202, 202, 202, 0.4);
+    color: #856AAD;
+}
+
+.color06 {
+    background: linear-gradient(82deg, #E6EEFF 0%, #FAFCFF 0%, #EDF3FF 0%, #D8E5FF 100%);
+    box-shadow: 0px 6px 16px 0px rgba(202, 202, 202, 0.4);
+    color: #5374B2;
+}
+
+.color01 .h2 {
+    color: #6A8079;
+}
+
+.color02 .h2 {
+    color: #5E89B3;
+}
+
+.color03 .h2 {
+    color: #488D9A;
+}
+
+.color04 .h2 {
+    color: #B98A60;
+}
+
+.color05 .h2 {
+    color: #9484AC;
+}
+
+.color06 .h2 {
+    color: #6D89BF;
+}

miniprogram/pages/redGrider/redGrider.json

@@ -1,3 +1,8 @@
 {
-    "usingComponents": {}
-}
+    "navigationBarTitleText": "红色网格员",
+    "navigationStyle": "custom",
+    "navigationBarTextStyle": "white",
+    "enablePullDownRefresh": true,
+    "backgroundColor": "#f8f8f8",
+    "backgroundTextStyle": "dark"
+  }

miniprogram/pages/redGrider/redGrider.wxml

@@ -1,2 +1,72 @@
-<!--pages/redGrider/redGrider.wxml-->
-<text>pages/redGrider/redGrider.wxml</text>
+<view class="header">
+     <image src="../../images/main/back.png" class="back" style=" top: {{statusHeight}}px;"  bindtap="back"></image>
+    <image class="header-bg" src="../../images/main/redSail_bg.png" mode="widthFix" />
+    <view class="navigation" style="height: {{navigationHeight}}px; top: {{statusHeight}}px;">
+        红帆支部
+    </view>
+</view>
+<view class="mtf80">
+    <view class="list">
+        <view class="item ">
+            <image src="../../images/main/redSail01.png" class="icon"></image>
+            <view class="vcenter flex1">
+                <view class="h1">红帆领航</view>
+                <view class="h2">
+                    在认真完成《中国共产党章···
+                </view>
+            </view>
+            <view class="vcenter w20">
+                <image src="../../images/main/redSail_right.png"  class="go"></image>
+            </view>
+        </view>
+        <view class="item ">
+            <image src="../../images/main/redSail02.png" class="icon"></image>
+            <view class="vcenter flex1">
+                <view class="h1">我要入党</view>
+                <view class="h2">
+                    “红帆支部”主要接受城市社···
+                </view>
+            </view>
+            <view class="vcenter w20">
+                <image src="../../images/main/redSail_right.png"  class="go"></image>
+            </view>
+        </view>
+        <view class="item ">
+            <image src="../../images/main/redSail03.png" class="icon"></image>
+            <view class="vcenter flex1">
+                <view class="h1">流动党员报到</view>
+                <view class="h2">
+                    外来流动党员，一般指党员···
+                </view>
+            </view>
+            <view class="vcenter w20">
+                <image src="../../images/main/redSail_right.png"  class="go"></image>
+            </view>
+        </view>
+        <view class="item ">
+            <image src="../../images/main/redSail04.png" class="icon"></image>
+            <view class="vcenter flex1">
+                <view class="h1">我要转出</view>
+                <view class="h2">
+                    填写身份信息以及转出事由
+                </view>
+            </view>
+            <view class="vcenter w20">
+                <image src="../../images/main/redSail_right.png"  class="go"></image>
+            </view>
+        </view>
+        <view class="item ">
+            <image src="../../images/main/redSail05.png" class="icon"></image>
+            <view class="vcenter flex1">
+                <view class="h1">我的支部</view>
+                <view class="h2">
+                    我所在的支部信息
+                </view>
+            </view>
+            <view class="vcenter w20">
+                <image src="../../images/main/redSail_right.png"  class="go"></image>
+            </view>
+        </view>
+
+    </view>
+</view>

miniprogram/pages/redGrider/redGrider.wxss

@@ -1 +1,113 @@
-/* pages/redGrider/redGrider.wxss */
+page {
+    width: 100%;
+    height: auto;
+    overflow-y: auto;
+    background: #f7f7f7;
+    font-family: PingFang SC;
+}
+
+.header {
+
+    width: 100%;
+    height: 484rpx;
+    /* position: fixed;
+    top: 0;
+    left: 0;
+    z-index: 1000; */
+}
+
+.header .header-bg {
+    width: 100%;
+    height: 100%;
+    /* position: absolute;
+    z-index: 10;
+    left: 0;
+    top: 0; */
+    position: absolute;
+    height: 100%;
+    z-index: -999;
+}
+
+.header .navigation {
+    width: 100%;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    color: rgba(255, 255, 255, 0.9);
+    font-size: 32rpx;
+    position: relative;
+    z-index: 1;
+}
+
+.w20 {
+    width: 20rpx;
+}
+
+.flex1 {
+    flex: 1;
+}
+
+.mtf80 {
+    margin-top: -80rpx;
+}
+
+.back {
+    width: 20rpx;
+    height: 20rpx;
+    margin-left: 20rpx;
+    position: absolute;
+    margin-top: 20rpx;
+    border-radius: 0rpx;
+    z-index: 2;
+}
+
+.list {
+    padding: 20rpx 35rpx;
+
+}
+
+.list .item {
+    padding: 40rpx 40rpx;
+
+    display: flex;
+    background-color: #fff;
+    border-radius: 10rpx;
+    margin-bottom: 20rpx;
+}
+
+.vcenter {
+    display: flex;
+    flex-direction: column;
+    justify-content: center;
+}
+
+.list .item .icon {
+    width: 130rpx;
+    height: 130rpx;
+    margin-right: 20rpx;
+    border-radius: 0rpx;
+}
+
+.list .item .go {
+    width: 20rpx;
+    height: 20rpx;
+    margin-right: 20rpx;
+    border-radius: 0rpx;
+}
+
+.list .item .h1 {
+    font-size: 36rpx;
+    color: #333333;
+    line-height: 1rem;
+    margin-bottom: 5rpx;
+}
+
+.list .item .h2 {
+    font-size: 28rpx;
+    color: #999;
+    line-height: 1rem;
+}
+
+.list .item .h2 .time {
+    float: right;
+}

miniprogram/pages/redSail/redSail.json

@@ -1,5 +1,5 @@
 {
-    "navigationBarTitleText": "红帆支部",
+    "navigationBarTitleText": "红帆支队",
     "navigationStyle": "custom",
     "navigationBarTextStyle": "white",
     "enablePullDownRefresh": true,

miniprogram/pages/redSail/redSail.wxml

@@ -1,6 +1,6 @@
 <view class="header">
      <image src="../../images/main/back.png" class="back" style=" top: {{statusHeight}}px;"  bindtap="back"></image>
-    <image class="header-bg" src="../../images/main/redSail_bg.png" mode="widthFix" />
+    <image class="header-bg" src="../../images/redSail/redSail_bg.png" mode="widthFix" />
     <view class="navigation" style="height: {{navigationHeight}}px; top: {{statusHeight}}px;">
         红帆支部
     </view>
@@ -8,7 +8,7 @@
 <view class="mtf80">
     <view class="list">
         <view class="item ">
-            <image src="../../images/main/redSail01.png" class="icon"></image>
+            <image src="../../images/redSail/redSail01.png" class="icon"></image>
             <view class="vcenter flex1">
                 <view class="h1">红帆领航</view>
                 <view class="h2">
@@ -16,11 +16,11 @@
                 </view>
             </view>
             <view class="vcenter w20">
-                <image src="../../images/main/redSail_right.png"  class="go"></image>
+                <image src="../../images/redSail/redSail_right.png"  class="go"></image>
             </view>
         </view>
         <view class="item ">
-            <image src="../../images/main/redSail02.png" class="icon"></image>
+            <image src="../../images/redSail/redSail02.png" class="icon"></image>
             <view class="vcenter flex1">
                 <view class="h1">我要入党</view>
                 <view class="h2">
@@ -28,11 +28,11 @@
                 </view>
             </view>
             <view class="vcenter w20">
-                <image src="../../images/main/redSail_right.png"  class="go"></image>
+                <image src="../../images/redSail/redSail_right.png"  class="go"></image>
             </view>
         </view>
         <view class="item ">
-            <image src="../../images/main/redSail03.png" class="icon"></image>
+            <image src="../../images/redSail/redSail03.png" class="icon"></image>
             <view class="vcenter flex1">
                 <view class="h1">流动党员报到</view>
                 <view class="h2">
@@ -40,11 +40,11 @@
                 </view>
             </view>
             <view class="vcenter w20">
-                <image src="../../images/main/redSail_right.png"  class="go"></image>
+                <image src="../../images/redSail/redSail_right.png"  class="go"></image>
             </view>
         </view>
         <view class="item ">
-            <image src="../../images/main/redSail04.png" class="icon"></image>
+            <image src="../../images/redSail/redSail04.png" class="icon"></image>
             <view class="vcenter flex1">
                 <view class="h1">我要转出</view>
                 <view class="h2">
@@ -52,11 +52,11 @@
                 </view>
             </view>
             <view class="vcenter w20">
-                <image src="../../images/main/redSail_right.png"  class="go"></image>
+                <image src="../../images/redSail/redSail_right.png"  class="go"></image>
             </view>
         </view>
         <view class="item ">
-            <image src="../../images/main/redSail05.png" class="icon"></image>
+            <image src="../../images/redSail/redSail05.png" class="icon"></image>
             <view class="vcenter flex1">
                 <view class="h1">我的支部</view>
                 <view class="h2">
@@ -64,7 +64,7 @@
                 </view>
             </view>
             <view class="vcenter w20">
-                <image src="../../images/main/redSail_right.png"  class="go"></image>
+                <image src="../../images/redSail/redSail_right.png"  class="go"></image>
             </view>
         </view>
 

miniprogram/pages/volunteer/volunteer.js

@@ -1,11 +1,13 @@
-// pages/volunteer/volunteer.js
+// pages/redGrider/redGrider.js
+const app = getApp()
 Page({
 
     /**
      * 页面的初始数据
      */
     data: {
-
+        statusHeight: app.globalData.deviceInfo.statusHeight, // 自定义头部状态栏高度
+        navigationHeight: app.globalData.deviceInfo.navigationHeight,
     },
 
     /**
@@ -62,5 +64,12 @@ Page({
      */
     onShareAppMessage() {
 
-    }
+    },
+    back() {
+        console.log("dddddddddd")
+        //返回上一级，关闭当前页面
+        wx.navigateBack({
+            delta: 1
+        })
+    },
 })

miniprogram/pages/volunteer/volunteer.json

@@ -1,3 +1,8 @@
 {
-    "usingComponents": {}
-}
+    "navigationBarTitleText": "红色尖兵",
+    "navigationStyle": "custom",
+    "navigationBarTextStyle": "white",
+    "enablePullDownRefresh": true,
+    "backgroundColor": "#f8f8f8",
+    "backgroundTextStyle": "dark"
+  }

miniprogram/pages/volunteer/volunteer.wxml

@@ -1,2 +1,72 @@
-<!--pages/volunteer/volunteer.wxml-->
-<text>pages/volunteer/volunteer.wxml</text>
+<view class="header">
+     <image src="../../images/main/back.png" class="back" style=" top: {{statusHeight}}px;"  bindtap="back"></image>
+    <image class="header-bg" src="../../images/main/redSail_bg.png" mode="widthFix" />
+    <view class="navigation" style="height: {{navigationHeight}}px; top: {{statusHeight}}px;">
+        红帆支部
+    </view>
+</view>
+<view class="mtf80">
+    <view class="list">
+        <view class="item ">
+            <image src="../../images/main/redSail01.png" class="icon"></image>
+            <view class="vcenter flex1">
+                <view class="h1">红帆领航</view>
+                <view class="h2">
+                    在认真完成《中国共产党章···
+                </view>
+            </view>
+            <view class="vcenter w20">
+                <image src="../../images/main/redSail_right.png"  class="go"></image>
+            </view>
+        </view>
+        <view class="item ">
+            <image src="../../images/main/redSail02.png" class="icon"></image>
+            <view class="vcenter flex1">
+                <view class="h1">我要入党</view>
+                <view class="h2">
+                    “红帆支部”主要接受城市社···
+                </view>
+            </view>
+            <view class="vcenter w20">
+                <image src="../../images/main/redSail_right.png"  class="go"></image>
+            </view>
+        </view>
+        <view class="item ">
+            <image src="../../images/main/redSail03.png" class="icon"></image>
+            <view class="vcenter flex1">
+                <view class="h1">流动党员报到</view>
+                <view class="h2">
+                    外来流动党员，一般指党员···
+                </view>
+            </view>
+            <view class="vcenter w20">
+                <image src="../../images/main/redSail_right.png"  class="go"></image>
+            </view>
+        </view>
+        <view class="item ">
+            <image src="../../images/main/redSail04.png" class="icon"></image>
+            <view class="vcenter flex1">
+                <view class="h1">我要转出</view>
+                <view class="h2">
+                    填写身份信息以及转出事由
+                </view>
+            </view>
+            <view class="vcenter w20">
+                <image src="../../images/main/redSail_right.png"  class="go"></image>
+            </view>
+        </view>
+        <view class="item ">
+            <image src="../../images/main/redSail05.png" class="icon"></image>
+            <view class="vcenter flex1">
+                <view class="h1">我的支部</view>
+                <view class="h2">
+                    我所在的支部信息
+                </view>
+            </view>
+            <view class="vcenter w20">
+                <image src="../../images/main/redSail_right.png"  class="go"></image>
+            </view>
+        </view>
+
+    </view>
+</view>

miniprogram/pages/volunteer/volunteer.wxss

@@ -1 +1,113 @@
-/* pages/volunteer/volunteer.wxss */
+page {
+    width: 100%;
+    height: auto;
+    overflow-y: auto;
+    background: #f7f7f7;
+    font-family: PingFang SC;
+}
+
+.header {
+
+    width: 100%;
+    height: 484rpx;
+    /* position: fixed;
+    top: 0;
+    left: 0;
+    z-index: 1000; */
+}
+
+.header .header-bg {
+    width: 100%;
+    height: 100%;
+    /* position: absolute;
+    z-index: 10;
+    left: 0;
+    top: 0; */
+    position: absolute;
+    height: 100%;
+    z-index: -999;
+}
+
+.header .navigation {
+    width: 100%;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    color: rgba(255, 255, 255, 0.9);
+    font-size: 32rpx;
+    position: relative;
+    z-index: 1;
+}
+
+.w20 {
+    width: 20rpx;
+}
+
+.flex1 {
+    flex: 1;
+}
+
+.mtf80 {
+    margin-top: -80rpx;
+}
+
+.back {
+    width: 20rpx;
+    height: 20rpx;
+    margin-left: 20rpx;
+    position: absolute;
+    margin-top: 20rpx;
+    border-radius: 0rpx;
+    z-index: 2;
+}
+
+.list {
+    padding: 20rpx 35rpx;
+
+}
+
+.list .item {
+    padding: 40rpx 40rpx;
+
+    display: flex;
+    background-color: #fff;
+    border-radius: 10rpx;
+    margin-bottom: 20rpx;
+}
+
+.vcenter {
+    display: flex;
+    flex-direction: column;
+    justify-content: center;
+}
+
+.list .item .icon {
+    width: 130rpx;
+    height: 130rpx;
+    margin-right: 20rpx;
+    border-radius: 0rpx;
+}
+
+.list .item .go {
+    width: 20rpx;
+    height: 20rpx;
+    margin-right: 20rpx;
+    border-radius: 0rpx;
+}
+
+.list .item .h1 {
+    font-size: 36rpx;
+    color: #333333;
+    line-height: 1rem;
+    margin-bottom: 5rpx;
+}
+
+.list .item .h2 {
+    font-size: 28rpx;
+    color: #999;
+    line-height: 1rem;
+}
+
+.list .item .h2 .time {
+    float: right;
+}