截图

README.md

@@ -1,3 +1,6 @@
 # personal-formation5
 
 ![截图](./screen.png)
+![截图](./screen2.png)
+![截图](./screen3.png)
+![截图](./screen4.png)

app.json

@@ -1,43 +1,47 @@
 {
   "pages": [
     "pages/index/index",
-    "pages/list/list",
+    
     "pages/video/video",
-    "pages/picture/picture"
+    "pages/picture/picture",
+    "pages/guest/guest"
   ],
-  
-  
   "tabBar": {
     "color": "#ccc",
     "selectedColor": "#ff4c91",
-    "borderStyle":"white",
+    "borderStyle": "white",
     "backgroundColor": "#fff",
-    "list": [{
+    "list": [
+      {
         "pagePath": "pages/index/index",
         "text": "邀请函",
         "iconPath": "/images/invite.png",
         "selectedIconPath": "/images/invite.png"
-    },{
+      },
-    "pagePath": "pages/list/list",
+      {
+        "pagePath": "pages/picture/picture",
         "text": "照片",
         "iconPath": "/images/marry.png",
         "selectedIconPath": "/images/marry.png"
-  },{
+      },
+      {
         "pagePath": "pages/video/video",
         "text": "美好时光",
         "iconPath": "/images/video.png",
         "selectedIconPath": "/images/video.png"
-  },{
+      },
-    "pagePath": "pages/picture/picture",
+      {
+        "pagePath": "pages/guest/guest",
         "text": "宾客信息",
         "iconPath": "/images/guest.png",
         "selectedIconPath": "/images/guest.png"
-  }]
+      }
+    ]
   },
   "window": {
-    "backgroundTextStyle":"light",
+    "backgroundTextStyle": "light",
     "navigationBarBackgroundColor": "#ff4c91",
-    "navigationBarTextStyle":"white"
+    "navigationBarTextStyle": "white"
   },
   "style": "v2",
   "componentFramework": "glass-easel",

pages/guest/guest.js

@@ -1,4 +1,4 @@
-// pages/list/list.js
+// pages/guest/guest.js
 Page({
 
   /**

pages/guest/guest.wxml

@@ -0,0 +1,31 @@
+<image class="bg" src="/images/bj_2.png" />
+<form>
+<view class="content">
+<view class="input">
+<input name="name" placeholder-class="phcolor" placeholder="输入你的姓名"/>
+</view>
+<view class="input">
+<input name="phone" placeholder-class="phcolor" placeholder="输入你的手机号码"/>
+</view>
+
+<view class="radio">
+<text>请选择您的性别：</text>
+<radio-group>
+<radio>男</radio>
+<radio>女</radio>
+</radio-group>
+</view>
+
+<view class="check">
+<text>请选择你需要的点心：</text>
+<checkbox-group>
+  <checkbox>蛋糕</checkbox>
+  <checkbox>甜甜圈</checkbox>
+  <checkbox>巧克力</checkbox>
+</checkbox-group>
+</view>
+
+<button>提交</button>
+</view>
+</form>
+

pages/guest/guest.wxss

@@ -0,0 +1,50 @@
+/* pages/guest/guest.wxss */
+.bg{
+  width: 100vw;
+  height: 100vh;
+}
+.content{
+  width: 80vw;
+  position: fixed;
+  left: 10vw;
+  bottom: 8vh;
+}
+.content .input{
+  font-size: large;
+  border: 1rpx solid #ff4c91;
+  border-radius: 10rpx;
+  padding: 1.5vh 40rpx;
+  margin-bottom: 1.5vh;
+  color: #ff4c91;
+}
+.content .radio{
+  font-size: large;
+  margin-bottom: 1.5vh;
+  color: #ff4c91;
+  display: flex;
+}
+.content .check{
+  font-size: large;
+  margin-bottom: 1.5vh;
+  color: #ff4c91;
+}
+.content checkbox-group{
+  margin-top: 1.5vh;
+  color: #ff4c91;
+}
+.content checkbox-group checkbox{
+  margin-left: 20rpx;
+}
+.content checkbox-group checkbox:nth-child(1){
+  margin-left: 0;
+}
+
+.content button{
+  font-size: large;
+  background: #ff4c91;
+  color: #fff;
+}
+.content .phcolor{
+  color: #ff4c91;
+}
+

pages/list/list.wxml

@@ -1,2 +0,0 @@
-<!--pages/list/list.wxml-->
-<text>pages/list/list.wxml</text>

pages/list/list.wxss

@@ -1 +0,0 @@
-/* pages/list/list.wxss */

pages/picture/picture.wxml

@@ -1,2 +1,15 @@
 <!--pages/picture/picture.wxml-->
-<text>pages/picture/picture.wxml</text>
+<swiper indicator-color="white" indicator-active-color="#ff4c91" indicator-dots="true" autoplay="true" interval="3500" duration="1000" vertical=" " circular="true">
+<swiper-item>
+  <image src="/images/timg1.jpg" mode=""/>
+</swiper-item>
+<swiper-item>
+  <image src="/images/timg2.jpg" mode=""/>
+</swiper-item>
+<swiper-item>
+  <image src="/images/timg3.jpg" mode=""/>
+</swiper-item>
+<swiper-item>
+  <image src="/images/timg4.jpg" mode=""/>
+</swiper-item>
+</swiper>

pages/picture/picture.wxss

@@ -1 +1,8 @@
 /* pages/picture/picture.wxss */
+swiper{
+  height: 100vh;
+}
+image{
+  width: 100vh;
+  height: 100vh;
+}

pages/video/video.wxml

@@ -1,2 +1,14 @@
 <!--pages/video/video.wxml-->
-<text>pages/video/video.wxml</text>
+<view class="video">
+<view class="video-title">标题：海边随拍</view>
+<view class="video-time">拍摄日期：2022-01-01</view>
+<video src="http://localhost:3000/01.mp4"></video>
+
+<view class="video-title">标题：勿忘初心</view>
+<view class="video-time">拍摄日期：2022-01-10</view>
+<video src="http://localhost:3000/02.mp4"></video>
+
+<view class="video-title">标题：十年之约</view>
+<view class="video-time">拍摄日期：2022-01-20</view>
+<video src="http://localhost:3000/03.mp4"></video>
+</view>

pages/video/video.wxss

@@ -1 +1,22 @@
 /* pages/video/video.wxss */
+.video{
+  box-shadow: 0 8rpx 17rpx 0 rgba(7,17 , 27, 0.1);
+  margin: 10rpx 25rpx;
+  margin-bottom: 30rpx;
+  padding: 20rpx;
+  border-radius: 10rpx;
+  background: #fff;
+
+}
+.video-title{
+  font-size: 35rpx;
+  color: #333;
+}
+.video-time{
+  font-size: 26rpx;
+  color: #979797;
+}
+.video video{
+  width: 100%;
+  margin-top: 20rpx;
+}