Merge branch 'master' of http://git.cc-lotus.info/ball-court/court-mobile

app.json

@@ -1,9 +1,9 @@
 {
   "pages": [
-    "pages/login/index",
-    "pages/home/index",
     "pages/index/index",
+    "pages/login/index",
     "pages/register/index",
+    "pages/home/index",
     "pages/search/index",
     "pages/administration/index",
     "pages/administration/detail",
@@ -33,6 +33,7 @@
     "pages/maintain/index",
     "pages/lays/index",
     "pages/layNew/index",
+    "pages/modify/index",
     "pages/match/detail",
     "pages/logs/logs"
   ],

pages/index/index.js

@@ -40,7 +40,7 @@ Page({
     wx.getStorage({
       key: 'token',
       success: res => {
-        // if (res.data) wx.redirectTo({ url: '/pages/home/index', })
+        if (res.data) wx.redirectTo({ url: '/pages/home/index', })
       },
       fail: res => {
         wx.redirectTo({ url: '/pages/login/index', })

pages/layNew/index.wxss

@@ -31,7 +31,7 @@
   position: relative;
   text-align: right;
   left: 85px;
-  top: -10px;
+  top: -8px;
   width: 50%;
   font-size: 14px;
 }

pages/lays/index.js

@@ -21,6 +21,13 @@ Page({
         wx.navigateTo({
             url: `/pages/layNew/index?id=${id}`,
         })
+    },
+     //新增赛程编排
+     modify: function (e) {
+        let id = e.currentTarget.dataset.id;
+        wx.navigateTo({
+            url: `/pages/modify/index?id=${id}`,
+        })
     },
     /**
      * 生命周期函数--监听页面加载
@@ -40,7 +47,7 @@ Page({
             key: 'token',
             success: res => {
                 wx.request({
-                    url: `${app.globalData.publicUrl}/courtAdmin/api/matchteam`, //接口地址
+                    url: `${app.globalData.publicUrl}/courtAdmin/api/schedule`, //接口地址
                     method: 'get',
                     data: { match_id: that.data.id },
                     success(res) {

pages/lays/index.wxml

@@ -7,13 +7,26 @@
             <view class="list">
                 <view class="two" wx:key="item" wx:for="{{alreadyList}}">
                     <view class="left">
-                        <image class="head" src="{{item.logo[0].url}}"></image>
-                        <text class="group">{{item.team_name}}</text>
-                        <text class="person">共{{item.match_num}}人</text>
-                        <view class="fou"><text>创建人：{{item.create_user}}</text></view>
-                        <view class="time"><text class="date">{{item.create_time}}创建</text></view>
+                        <view class="fourright4">
+                            <view class="fourright1_2">
+                                <!-- <view class="fourright1_2o">
+                                    <image class="fourhead1" src="{{item.blue_logo[0].url}}"></image>
+                                </view> -->
+                                <view class="fourright1_2t"><text>{{item.blue_name}}</text></view>
+                                <view class="fourright1_2i">
+                                    <text class="fourtext6-1">{{item.blue_branch||0}}</text>
+                                    <text class="fourtext8-1">:</text>
+                                    <text class="fourtext7-1">{{item.red_branch||0}}</text>
+                                </view>
+                                <view class="fourright1_2t"><text>{{item.red_name}}</text></view>
+                                <!-- <view class="fourright1_2oi">
+                                    <image class="fourhead2" src="{{item.red_logo[0].url}}"></image>
+                                </view> -->
+                            </view>
+                        </view>
                     </view>
                     <view class="right">
+                        <text class="wei" bindtap="modify" data-id="{{item._id}}">维护</text>
                     </view>
                 </view>
             </view>

pages/lays/index.wxss

@@ -1,79 +1,133 @@
 .main {
-    position: relative;
-    width: 100%;
-    background-color: #f1f1f1;
-    padding: 20px 0 0 0;
-  }
-  
-
-  .button {
-    margin: 0 0 20px 0;
-    background-image: linear-gradient(to right, #fd3c1e, #c74df0);
-    border-radius: 30px;
-    color: #ffffff;
-    text-align: center;
-    font-size: small;
-  }
-
-
-  .list{
-    margin-top: 5%;
-  }
-  .two{
-    width: 93%;
-    float: left;
-    margin-left: 3%;
-  }
-  .left{
-    float: left;
-    width: 70%;
-    padding-top: 10px;
-    padding-left: 10px;
-    padding-bottom: 10px;
-  }
-  .two{
-    background-color: white;
-    margin-bottom: 3%;
-    border-radius: 8px;
-  }
-  .right{
-    float: left;
-    width: 20%;
-    margin-top: 9%;
-  }
-  .head {
-    float: left;
-    margin-left: 7px;
-    width: 15%;
-    height: 31px;
-    overflow: hidden;
-  }
-  .group{
-    font-size: 16px;
-    line-height: 30px;
-    font-weight: 500;
-    margin-left: 4%;
-    margin-right: 8%;
-  }
-  .fou{
-    font-size: 13px;
-    color: #9e9e9e;
-    margin: 2%;
-    margin-left: 10px;
-    float: left;
-    width: 100%;
-  }
-  .person{
-    font-size: 13px;
-    color: #9e9e9e;
-  }
-  .time{
-    margin-left: 10px;
-    margin-bottom: 1.5%;
-    font-size: 13px;
-    color: #9e9e9e;
-  }
-  .date{
-    margin-right: 5px;
-  }
-  
+  position: relative;
+  width: 100%;
+  background-color: #f1f1f1;
+  padding: 20px 0 0 0;
+}
+
+
+.button {
+  margin: 0 0 20px 0;
+  background-image: linear-gradient(to right, #fd3c1e, #c74df0);
+  border-radius: 30px;
+  color: #ffffff;
+  text-align: center;
+  font-size: small;
+}
+
+.wei {
+  font-size: 15px;
+  color: red;
+}
+
+.list {
+  margin-top: 5%;
+}
+
+.two {
+  width: 93%;
+  float: left;
+  margin-left: 3%;
+}
+
+.left {
+  float: left;
+  width: 70%;
+  padding-top: 15px;
+  padding-left: 10px;
+  padding-bottom: 15px;
+}
+
+.two {
+  background-color: white;
+  margin-bottom: 3%;
+  border-radius: 8px;
+}
+
+.right {
+  float: left;
+  width: 20%;
+  margin-left: 3%;
+  margin-top: 8%;
+}
+.fourright1_2 {
+  float: left;
+  width: 100%;
+  margin-top: 2%;
+}
+
+.fourright1_2o {
+  float: left;
+  width: 20%;
+}
+.fourright1_2oi {
+  float: left;
+  width: 20%;
+}
+
+.fourright1_2t {
+  float: left;
+  width: 43%;
+  text-align: center;
+  padding: 10px 0;
+  font-size: 14px;
+  font-weight: 500;
+}
+
+.fourtext6-1 {
+  background-color: rgb(228, 226, 226);
+  text-align: center;
+  color: #00427b;
+  font-size: 20px;
+  font-weight: bold;
+  text-decoration: line-through;
+  text-decoration-color: #fff;
+}
+
+.fourtext8-1 {
+  font-size: 20px;
+  font-weight: bold;
+  margin: 0 5px;
+}
+
+.fourtext7-1 {
+  background-color: rgb(228, 226, 226);
+  text-align: center;
+  color: #e70000;
+  font-size: 20px;
+  font-weight: bold;
+  /* text-decoration: line-through; */
+  text-decoration-color: #fff;
+}
+
+.fourright1_2i {
+  float: left;
+  width: 13%;
+  text-align: center;
+  padding: 6px 0;
+}
+.fourhead1 {
+  width: 90%;
+  height: 39.2px;
+  overflow: hidden;
+}
+
+.fourhead2 {
+  margin-left: 25%;
+  width: 90%;
+  height: 39.2px;
+  overflow: hidden;
+}
+.fourright4{
+  float: left;
+  width: 100%;
+}
+
+
+.fourtext5 {
+  position: absolute;
+  padding-top: 3px;
+  padding-left: 20px;
+  color: #fff;
+  font-size: 13px;
+}

pages/login/index.js

@@ -11,6 +11,13 @@ Page({
     infoHeight: '',
     from: {},
   },
+  // 验证表单
+  initValidate() {
+    const rules = { phone: { required: true, tel: true }, password: { required: true, } }
+    // 验证字段的提示信息，若不传则调用默认的信息
+    const messages = { phone: { required: '请输入账号', }, password: { required: '请输入密码', } };
+    this.WxValidate = new WxValidate(rules, messages)
+  },
   // 提交登录
   onSubmit: function (e) {
     const params = e.detail.value;
@@ -46,9 +53,7 @@ Page({
   },
   //去注册
   register: function () {
-    wx.navigateTo({
-      url: '/pages/register/index',
-    })
+    wx.navigateTo({ url: '/pages/register/index', })
   },
   /**
    * 生命周期函数--监听页面加载
@@ -59,12 +64,6 @@ Page({
     // 计算高度
     this.searchHeight()
   },
-  initValidate() {
-    const rules = { phone: { required: true, tel: true }, password: { required: true, } }
-    // 验证字段的提示信息，若不传则调用默认的信息
-    const messages = { phone: { required: '请输入账号', }, password: { required: '请输入密码', } };
-    this.WxValidate = new WxValidate(rules, messages)
-  },
   // 计算高度
   searchHeight: function () {
     let frameStyle = this.data.frameStyle;

pages/modify/index.js

@@ -0,0 +1,158 @@
+// pages/login/login.js
+import WxValidate from '../../utils/wxValidate'
+const app = getApp()
+var type = "";//用来保存picker组件选中的类别id
+Page({
+  /**
+   * 页面的初始数据
+   */
+  data: {
+    // 主体高度
+    infoHeight: '',
+    frameStyle: { useTop: true, name: '维护赛程编排', leftArrow: true, useBar: false },
+    form: {
+    },
+    id: '',
+    cateArray: [
+      { id: '0', type: '待开始' }, { id: '1', type: '开始' }, { id: '2', type: '结束' }],
+    cateIndex: 0,
+  },
+  //当用户点击确定时，执行的事件
+  bindCatePickerChange: function (e) {
+    var cid = this.data.cateArray[e.detail.value].id;
+    type = cid
+    //下面重新赋值必须有，页面显示的信息才会改为刚刚选中的值
+    this.setData({
+      cateIndex: e.detail.value,
+    })
+  },
+  back: function () {
+    wx.navigateBack({ url: '/pages/me/index' })
+  },
+  //提交
+  formSubmit: function (e) {
+    const that = this;
+    let id = that.data.id;
+    let status = that.data.cateIndex
+    wx.request({
+      url: `${app.globalData.publicUrl}/courtAdmin/api/schedule/${id}`, //接口地址
+      method: "post",
+      data: { status: status },
+      header: {},
+      success: res => {
+        if (res.data.errcode == 0) {
+          wx.showToast({
+            title: '修改成功',
+            icon: 'success',
+            duration: 2000//延迟两秒
+          })
+        } else {
+          wx.showToast({
+            title: '修改失败',
+            icon: 'success',
+            duration: 2000
+          })
+        }
+      },
+    })
+  },
+  /**
+   * 生命周期函数--监听页面加载
+   */
+  onLoad: function (options) {
+    this.setData({ id: options.id })
+    //选择器
+    var cindex = this.data.cateIndex
+    type = this.data.cateArray[cindex].id
+    // 计算高度
+    this.searchHeight();
+    // 监听用户是否登录
+    this.watchLogin();
+  },
+  // 监听用户是否登录
+  watchLogin: function () {
+    const that = this;
+    let id = that.data.id;
+    wx.getStorage({
+      key: 'token',
+      success: res => {
+        wx.request({
+          url: `${app.globalData.publicUrl}/courtAdmin/api/schedule/${id}`, //接口地址
+          method: 'get',
+          data: {},
+          success(res) {
+            let status = res.data.data.status
+            console.log(res.data.data);
+            that.setData({
+              form: res.data.data,
+              cateIndex: status,
+            })
+          }
+        })
+      },
+      fail: res => {
+        return wx.redirectTo({ url: '/pages/login/index', })
+      }
+    })
+  },
+
+  // 计算高度
+  searchHeight: function () {
+    let frameStyle = this.data.frameStyle;
+    let client = app.globalData.client;
+    // 减去状态栏
+    let infoHeight = client.windowHeight - (client.statusBarHeight + client.getMenu.height + (client.getMenu.top - client.statusBarHeight) * 2);
+    // 是否减去底部菜单
+    if (frameStyle.useBar) infoHeight = infoHeight - 50;
+    if (infoHeight) this.setData({ infoHeight: infoHeight })
+  },
+
+  /**
+   * 生命周期函数--监听页面初次渲染完成
+   */
+  onReady: function () {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面显示
+   */
+  onShow: function () {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面隐藏
+   */
+  onHide: function () {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面卸载
+   */
+  onUnload: function () {
+
+  },
+
+  /**
+   * 页面相关事件处理函数--监听用户下拉动作
+   */
+  onPullDownRefresh: function () {
+
+  },
+
+  /**
+   * 页面上拉触底事件的处理函数
+   */
+  onReachBottom: function () {
+
+  },
+
+  /**
+   * 用户点击右上角分享
+   */
+  onShareAppMessage: function () {
+
+  }
+})

pages/modify/index.json

@@ -0,0 +1,7 @@
+{
+  "component": true,
+  "usingComponents": {
+    "mobile-main": "/commpents/mobile-frame/mobile-main",
+    "upload": "/commpents/upload/index"
+  }
+}

pages/modify/index.wxml

@@ -0,0 +1,41 @@
+<mobile-main frameStyle="{{frameStyle}}" bind:back="back">
+  <view slot="info" class="main" style="height:{{infoHeight}}px;">
+    <form catchsubmit="formSubmit" catchreset="formReset">
+      <view class="form" style="height:{{infoHeight-140}}px;">
+        <view class="one">
+          <view class="text">比赛红方logo</view>
+          <image class="imgs" src="{{form.red_logo[0].url}}"></image>
+        </view>
+        <view class="one">
+          <view class="text">比赛蓝方logo</view>
+          <image class="imgs" src="{{form.blue_logo[0].url}}"></image>
+        </view>
+        <view class="one">
+          <view class="text">比赛名称</view>
+          <text class="input">{{form.match_name}}</text>
+        </view>
+        <view class="one">
+          <view class="text">比赛红方名称</view>
+          <text class="input">{{form.red_name}}</text>
+        </view>
+        <view class="one">
+          <view class="text">比赛蓝方名称</view>
+          <text class="input">{{form.blue_name}}</text>
+        </view>
+        <view class="one">
+          <view class="text">比赛时间</view>
+          <text class="input">{{form.match_time}}</text>
+        </view>
+        <view class="one">
+          <view class="text">维护状态</view>
+          <picker mode="selector" bindchange="bindCatePickerChange" value="{{cateIndex}}" range-key="type" range="{{cateArray}}">
+            <view class="input">{{cateArray[cateIndex].type}}</view>
+          </picker>
+        </view>
+      </view>
+      <view class="btn-area">
+        <button class="button" formType="submit">保存</button>
+      </view>
+    </form>
+  </view>
+</mobile-main>

pages/modify/index.wxss

@@ -0,0 +1,57 @@
+.main {
+  position: relative;
+  width: 100%;
+  background-color: #ffffff;
+  padding: 20px 0 0 0;
+}
+
+
+.one {
+  display: flex;
+  justify-content: space-between;
+  border-bottom: 1px solid #dddddd;
+  margin: 0 20px;
+  margin-top: 2%;
+  height: 35px;
+}
+
+.text {
+  font-size: 15px;
+}
+.imgs{
+  margin-top: -10px;
+  width: 13%;
+  height: 43.58px; 
+}
+.input {
+  font-size: 14px;
+}
+
+.input1 {
+  position: relative;
+  text-align: right;
+  left: 85px;
+  top: -10px;
+  width: 50%;
+  font-size: 14px;
+}
+
+.input2 {
+  width: 50px;
+  position: relative;
+  text-align: right;
+  left: 260px;
+  top: -27px;
+  font-size: 14px;
+}
+
+.button {
+  position: relative;
+  top: 50px;
+  width: 300px !important;
+  background-image: linear-gradient(to right, #fd3c1e, #c74df0);
+  border-radius: 30px;
+  color: #ffffff;
+  text-align: center;
+  font-size: small;
+}

pages/register/index.js

@@ -1,65 +1,72 @@
 // pages/login/login.js
 import WxValidate from '../../utils/wxValidate'
 const app = getApp()
-var type = "";//用来保存picker组件选中的类别id
 Page({
+
   /**
    * 页面的初始数据
    */
   data: {
-    frameStyle: { useTop: false, name: '注册', leftArrow: false, useBar: false },
+    frameStyle: { useTop: true, name: '', leftArrow: true, useBar: false },
     // 主体高度
     infoHeight: '',
-    from: {},
-    cateArray: [
-      { id: '0', type: '管理用户' }, { id: '1', type: '团队创建人' }, { id: '2', type: '个人用户' }],
-    cateIndex: 0,
+    form: {},
+    // 用户类别
+    typeList: [
+      { label: '0', value: '管理用户' },
+      { label: '1', value: '团队创建人' },
+      { label: '2', value: '个人用户' }
+    ],
   },
-  // 提交注册
+  initValidate() {
+    const rules = { phone: { required: true, tel: true }, password: { required: true, } }
+    // 验证字段的提示信息，若不传则调用默认的信息
+    const messages = { phone: { required: '请输入账号', }, password: { required: '请输入密码', } };
+    this.WxValidate = new WxValidate(rules, messages)
+  },
+  back: function () {
+    wx.navigateBack({ url: '/pages/login/index' })
+  },
+  // 选择用户类别
+  typeChange: function (e) {
+    const that = this;
+    let index = e.detail.value;
+    let data = that.data.typeList[index];
+    if (data) that.setData({ 'form.type': data.label });
+    that.setData({ 'form.type_name': data.value });
+  },
+  // 提交登录
   onSubmit: function (e) {
+    const that = this;
     const params = e.detail.value;
-    params.type = type
     if (!this.WxValidate.checkForm(params)) {
       const error = this.WxValidate.errorList[0];
       wx.showToast({ title: `${error.msg}`, icon: 'error', duration: 2000 })
       return false
     } else {
-      wx.request({
-        url: `${app.globalData.publicUrl}/courtAdmin/api/user`, //接口地址
-        method: 'post',
-        data: {
-          "phone": params.phone,
-          "password": params.password,
-          "type": params.type,
-        },
-        success(res) {
-          if (res.data.errcode == 0) {
-            wx.navigateTo({
-              url: '/pages/home/index',//跳转地址
-            })
-          } else {
-            wx.showToast({
-              title: res.data.errmsg,
-              icon: 'none',
-              duration: 2000
-            })
+      if (params.password !== params.is_password) {
+        wx.showToast({ title: '密码输入不一致', duration: 2000, icon: 'error', })
+      } else {
+        wx.request({
+          url: `${app.globalData.publicUrl}/courtAdmin/api/user`, //接口地址
+          method: 'post',
+          data: params,
+          success(res) {
+            if (res.data.errcode == 0) {
+              wx.showToast({
+                title: '注册账号成功',
+                duration: 2000,
+                icon: 'success',
+                success: (res) => { that.back() }
+              })
+            } else {
+              wx.showToast({ title: res.data.errmsg, icon: 'error', duration: 2000 })
+            }
           }
-        }
-      })
+        })
+      }
     }
   },
-  //当用户点击确定时，执行的事件
-  bindCatePickerChange: function (e) {
-    var cid = this.data.cateArray[e.detail.value].id;
-    type = cid
-    //下面重新赋值必须有，页面显示的信息才会改为刚刚选中的值
-    this.setData({
-      cateIndex: e.detail.value,
-    })
-  },
-  back: function () {
-    wx.navigateBack({ url: '/pages/login/index' })
-  },
   /**
    * 生命周期函数--监听页面加载
    */
@@ -68,40 +75,31 @@ Page({
     this.initValidate()
     // 计算高度
     this.searchHeight()
-    //选择器
-    var cindex = this.data.cateIndex
-    type = this.data.cateArray[cindex].id
-  },
-  initValidate() {
-    //规则
-    const rules = { phone: { required: true, tel: true }, password: { required: true, minlength: 6, maxlength: 16, }, passagain: { required: true, equalTo: 'password', } }
-    const messages = {
-      phone: { required: '请输入账号' }, password: { required: '请输入密码', minlength: '密码长度不能少于6位', maxlength: '密码长度不能超过16位' },
-      passagain: { required: '请填写确认密码', equalTo: '两次密码不一致' }
-    };
-    this.WxValidate = new WxValidate(rules, messages)
   },
   // 计算高度
   searchHeight: function () {
     let frameStyle = this.data.frameStyle;
     let client = app.globalData.client;
     let infoHeight = client.windowHeight;
-    // 减去状态栏
-    if (frameStyle.useTop) infoHeight = infoHeight - (client.statusBarHeight + client.getMenu.height + (client.getMenu.top - client.statusBarHeight) * 2)
+    // 是否去掉状态栏
+    if (frameStyle.useTop) infoHeight = infoHeight - (client.statusBarHeight + client.getMenu.height + (client.getMenu.top - client.statusBarHeight) * 2);
     // 是否减去底部菜单
     if (frameStyle.useBar) infoHeight = infoHeight - 50;
     if (infoHeight) this.setData({ infoHeight: infoHeight })
   },
+
   /**
    * 生命周期函数--监听页面初次渲染完成
    */
   onReady: function () {
+
   },
 
   /**
    * 生命周期函数--监听页面显示
    */
   onShow: function () {
+
   },
 
   /**

pages/register/index.wxml

@@ -1,58 +1,29 @@
 <mobile-main frameStyle="{{frameStyle}}" bind:back="back">
-  <view slot="info" class="main">
-    <view class="onea">
-      <cover-image src='/image/back.png' class="back" bindtap='back'></cover-image>
-    </view>
+  <view slot="info" class="main" style="height:{{infoHeight}}px;">
     <view class="one">
-      <view class="word">
-        <text>注册，</text>
-      </view>
-      <view class="word2">
-        <text>团队比赛小程序</text>
-      </view>
+      <view>注册，</view>
+      <view>欢迎来到赛事小程序</view>
     </view>
     <view class="two">
       <form bindsubmit="onSubmit">
         <view class="content">
-          <view class="left">
-            <input class="input" type='number' name="phone" value="{{form.phone}}" maxlength="11" placeholder='账号：' placeholder-class="placeholder"></input>
-          </view>
-          <view class="right">
-            <view class="line"></view>
-          </view>
+          <input type='number' name="phone" value="{{form.phone}}" maxlength="11" placeholder="账号："></input>
         </view>
         <view class="content">
-          <view class="left">
-            <input class="input" type='text' name="password" value="{{form.password}}" password placeholder='密码：' placeholder-class="placeholder"></input>
-          </view>
-          <view class="right">
-            <view class="line"></view>
-          </view>
+          <input name="password" value="{{form.password}}" placeholder="密码：" password></input>
         </view>
         <view class="content">
-          <view class="left">
-            <input class="input" type='text' name="passagain" password placeholder='再次输入密码：' placeholder-class="placeholder"></input>
-          </view>
-          <view class="right">
-            <view class="line"></view>
-          </view>
+          <input name="is_password" value="{{form.is_password}}" placeholder="再次输入密码：" password></input>
         </view>
         <view class="content">
-          <view class="left1" >
-          用户类别
-          <view class="line"></view>
-          </view>
-          <view class="right1">
-            <picker mode="selector" bindchange="bindCatePickerChange" value="{{cateIndex}}" range-key="type" range="{{cateArray}}">
-              <view class="weui-select">{{cateArray[cateIndex].type}}</view>
-            </picker>
-            <view class="right">
-            <view class="line"></view>
-          </view>
-          </view>
+          <picker class="picker" mode="selector" bindchange="typeChange" name="type" range-key="value" range="{{typeList}}">
+            <view class="weui-select">{{form.type_name||'用户类别'}}</view>
+          </picker>
         </view>
-        <view class="save">
-          <button class="button" form-type="submit">注册</button>
+        <view class="btn">
+          <view class="btn_2">
+            <button size="mini" form-type="submit">注册</button>
+          </view>
         </view>
       </form>
     </view>

pages/register/index.wxss

@@ -1,78 +1,76 @@
 .main {
   position: relative;
   width: 100%;
+  background-color: #ffffff;
 }
-.back {
-  width: 40rpx;
-  height: 40rpx;
-  left: 15px;
-  width: 40rpx;
-  height: 40rpx;
-}
-.onea{
-  font-weight: 600;
-  position: absolute;
-  top: -20%;
-  left: 2%;
-}
-.line{
-  margin: 0 auto;
-  height: 0.5px;
-  margin-left: -10px;
-  margin-right: 10px; 
-  margin-top: 2px;
-  background-color: #D8D8D8;
-}
+
 .main .one {
-  position: relative;
-  text-align: left;
+  float: left;
+  width: 100%;
+  padding: 30% 0 0 0;
+  margin: 0 0 50px 0;
+}
+
+.main .one view {
+  padding: 0 30px;
   font-size: 25px;
-  font-weight: 500;
-  margin-left: 30px;
-  margin-top: 120px;
-  margin-bottom: 85px;
 }
-.word{
-  margin-bottom: 10px;
+
+.main .one view:nth-child(1) {
+  margin: 0 0 10px 0;
 }
+
 .main .two {
-  position: relative;
-  text-align: center;
+  float: left;
+  width: 100%;
 }
+
 .main .two .content {
-  margin: 0 0 30px 30px;
+  margin: 0 30px 10px 30px;
+  border-bottom: 1px solid #f1f1;
+  padding: 5px 0;
 }
-.main .two .save {
-  margin: 100px 10px;
-  text-align: center;
+
+.main .two .content input {
+  font-size: 12px;
+  color: #666;
 }
-.input{
-  text-align: left;
-   width: 30%;
-   font-size: 13px;
+
+.main .two .content .picker {
+  font-size: 12px;
+  color: #666;
 }
-.button{
-  width: 300px !important;
-  background-color: rgb(102, 177, 247);
-  background-image: linear-gradient(to right, rgb(122, 69, 206) , rgb(0, 162, 255));
-  border-radius: 30px; 
-  color:#ffffff; 
-  text-align: center;
-  font-size: small;
+
+.main .two .btn .btn_1 {
+  text-align: right;
+  padding: 0 18px 0 0;
 }
-.left1{
-  float: left;
-  width: 30%;
-  text-align: left;
+
+.main .two .btn .btn_1 button {
+  background: transparent;
   font-size: 13px;
-  color: #858585;
-  font-weight: 500;
+  color: #409eff;
 }
-.right1{
-  float: left;
-  width: 70%;
+
+.main .two .btn .btn_2 {
   text-align: center;
-  font-size: 13px;
-  color: #858585;
-  font-weight: 500;
+  margin: 50px 0 10px 0;
+}
+
+.main .two .btn .btn_2 button {
+  width: 80%;
+  border-radius: 25px;
+  color: #ffffff;
+  background-color: rgb(102, 177, 247);
+  background-image: linear-gradient(to right, rgb(122, 69, 206), rgb(0, 162, 255));
+}
+
+.main .two .btn .btn_3 {
+  text-align: center;
+}
+
+.main .two .btn .btn_3 button {
+  background-color: transparent;
+  color: #ff0000;
+
 }