页面切图

components/Cn-page/Cn-page.vue

@@ -1,7 +1,7 @@
 <template>
     <view class="Cn-page">
         <template v-if="showLoginMsk && !login">
-            <navigator :url="tenantId ? '/pages/login/login' : '/pages/login/platform'" hover-class="none" class="page-login-btn">登录</navigator>
+            <navigator url="/pages/login/login" hover-class="none" class="page-login-btn">登录</navigator>
         </template>
         <template v-else>
             <view class="loading" v-if="loading">
@@ -23,7 +23,6 @@ export default {
             default: false
         },
         showLoginMsk: Boolean,
-        tenantId:''
     },
     data() {
         return {
@@ -32,7 +31,6 @@ export default {
     },
     created() {
         this.login = uni.getStorageSync('Authorization')
-        this.tenantId = false
     },
 }
 </script>

pages.json

@@ -19,6 +19,18 @@
         "navigationBarTitleText": "个人"
       }
     },
+    {
+      "path": "pages/login/agreement",
+      "style": {
+        "navigationBarTitleText": "用户协议"
+      }
+    },
+    {
+      "path": "pages/login/policy",
+      "style": {
+        "navigationBarTitleText": "个人信息保护政策"
+      }
+    },
     {
       "path": "pages/login/login",
       "style": {
@@ -30,6 +42,24 @@
       "style": {
         "navigationBarTitleText": "忘记密码"
       }
+    },
+    {
+      "path": "pages/login/register",
+      "style": {
+        "navigationBarTitleText": "快速注册"
+      }
+    },
+    {
+      "path": "pages/login/changePwd",
+      "style": {
+        "navigationBarTitleText": "修改密码"
+      }
+    },
+    {
+      "path": "pages/mine/setup",
+      "style": {
+        "navigationBarTitleText": "设置"
+      }
     }
   ],
   "tabBar": {
@@ -54,7 +84,7 @@
       },
       {
         "pagePath": "pages/index/mine",
-        "iconPath": "static/mine2.png",
+        "iconPath": "static/mine.png",
         "selectedIconPath": "static/mine2.png",
         "text": "个人"
       }
@@ -64,9 +94,8 @@
     "navigationBarTextStyle": "black",
     "navigationBarTitleText": "灿能电力",
     "navigationBarBackgroundColor": "#F8F8F8",
-    "backgroundColor": "#F8F8F8"
+    "backgroundColor": "#F8F8F8",
     // #ifdef H5
-    ,
     "navigationStyle": "custom"
     // #endif
   },

pages/index/mine.vue

@@ -1,5 +1,5 @@
 <template>
-    <Comp-page :loading="loading">
+    <view :loading="loading">
         <view class="mine">
             <view class="mine-header" @click="jump('basic')">
                 <image mode="aspectFill" class="mine-header-head" src="/static/head.jpg" />
@@ -18,7 +18,7 @@
                 <uni-icons type="forward" color="#aaa" size="20"></uni-icons>
             </view>
         </view>
-    </Comp-page>
+    </view>
 </template>
 
 <script>

pages/login/agreement.vue

@@ -0,0 +1,25 @@
+<template>
+    <Cn-page :loading='loading'>
+        <view slot='body'>
+            <view class='index'>
+                用户协议
+            </view>
+        </view>
+    </Cn-page>
+</template>
+<script>
+export default {
+    data () {
+        return {
+            loading: false
+        }
+    },
+    methods: {
+    }
+}
+</script>
+<style lang='scss'>
+.index {
+    padding: 34rpx;
+}
+</style>

pages/login/changePwd.vue

@@ -0,0 +1,151 @@
+<template>
+    <Cn-page :loading="loading">
+        <view slot="body">
+            <view class="index">
+                <uni-forms ref="form" :modelValue="formData" :rules="rules">
+                    <uni-forms-item name="code">
+                        <view class="login-box-input mt40">
+                            <uni-easyinput type="number" v-model="formData.code" placeholder="请输入手机验证码" />
+                            <view class="ml40"
+                                style="margin-left:40rpx;font-size: 28rpx; color: #666; width: 200rpx; text-align: center"
+                                v-if="waitTime > 0">{{ waitTime + 's后重新获取' }}</view>
+                            <button class="login-box-input-btn" v-else @click="getCode" size="mini">获取验证码</button>
+                        </view>
+                    </uni-forms-item>
+                    <uni-forms-item name="password">
+                        <uni-easyinput type="text" v-model="formData.password" placeholder="请输入新的登录密码" />
+                    </uni-forms-item>
+                    <uni-forms-item name="password2">
+                        <uni-easyinput type="text" v-model="formData.password2" placeholder="请再次确认密码" />
+                    </uni-forms-item>
+                </uni-forms>
+                <button type="default" class="submit-btn" @click="submit">提交</button>
+                <view class="login-box-tips">
+                    <view style="color:#999">说明：密码长度为6-18位</view>
+                </view>
+            </view>
+        </view>
+    </Cn-page>
+</template>
+<script>
+export default {
+    name: "jiaban",
+    data () {
+        return {
+            loading: false,
+            waitTime: 0,
+            // 表单数据
+            formData: {
+                phone: '',
+                code: '',
+                password: '',
+                password2: ''
+            },
+            rules: {
+                phone: {
+                    rules: [
+                        {
+                            required: true,
+                            errorMessage: "请填写手机号"
+                        }
+                    ]
+                },
+                code: {
+                    rules: [
+                        {
+                            required: true,
+                            errorMessage: "请填写验证码"
+                        }
+                    ]
+                },
+                password: {
+                    rules: [
+                        {
+                            required: true,
+                            errorMessage: "请填写新密码"
+                        }
+                    ]
+                },
+                password2: {
+                    rules: [
+                        {
+                            required: true,
+                            errorMessage: "请填写确认密码"
+                        }
+                    ]
+                }
+            }
+        };
+    },
+    onLoad () {
+    },
+    methods: {
+        getCode () {
+            this.waitTime = 60
+            this.inter = setInterval(() => {
+                if (this.waitTime == 0) {
+                    clearInterval(this.inter)
+                } else {
+                    this.waitTime--
+                }
+            }, 1000)
+        },
+        submit () {
+            this.$refs.form.validate((valid) => {
+                console.log(valid);
+                if (valid) {
+                }
+            })
+        },
+    }
+};
+</script>
+<style lang="scss">
+.index {
+    padding: 34rpx;
+
+    .submit-btn {
+        background: $uni-theme-blue;
+        color: #fff;
+    }
+
+    .login-box-tips {
+        margin-top: 60rpx;
+        display: flex;
+        justify-content: center;
+        font-size: 20rpx;
+    }
+
+    .login-box-input {
+        display: flex;
+        align-items: center;
+        border-bottom: 1rpx solid #f0f0f0;
+
+        .login-box-input-icon {
+            width: 40rpx;
+            margin-right: 40rpx;
+        }
+
+        .login-box-input-main {
+            font-size: 28rpx;
+            flex: 1;
+            height: 100rpx;
+            line-height: 100rpx;
+        }
+
+        .login-box-input-btn {
+            width: 200rpx;
+            margin-left: 40rpx;
+            background: $uni-theme-blue;
+            color: #fff;
+        }
+
+        .login-box-input-img {
+            margin-left: 40rpx;
+            background: skyblue;
+            height: 80rpx;
+            width: 200rpx;
+        }
+    }
+}
+</style>

pages/login/forget.vue

@@ -2,22 +2,35 @@
     <Cn-page :loading="loading">
         <view slot="body">
             <view class="index">
-                <!-- <uni-forms ref="form" :label-width="80" :modelValue="formData" :rules="rules">
+                <uni-forms ref="form" :modelValue="formData" :rules="rules">
-                    <uni-forms-item label="漏打日期" name="missingDate" required>
+                    <uni-forms-item name="phone">
-                        <uni-datetime-picker type="date" return-type="string" v-model="formData.missingDate" />
+                        <uni-easyinput type="number" v-model="formData.phone" placeholder="请输入手机号" />
                     </uni-forms-item>
-                    <uni-forms-item label="补卡类别" name="multipleDhoice" required>
+                    <uni-forms-item name="code">
-                        <uni-data-checkbox v-model="formData.multipleDhoice" :localdata="range" />
+                        <view class="login-box-input mt40">
+                            <uni-easyinput type="number" v-model="formData.code" placeholder="请输入验证码" />
+                            <view class="ml40"
+                                style="margin-left:40rpx;font-size: 28rpx; color: #666; width: 200rpx; text-align: center"
+                                v-if="waitTime > 0">{{ waitTime + 's后重新获取' }}</view>
+                            <button class="login-box-input-btn" v-else @click="getCode" size="mini">获取验证码</button>
+                        </view>
                     </uni-forms-item>
-                    <uni-forms-item label="漏打卡原因" name="reasonsForMissingPunch" required>
+                    <uni-forms-item name="password">
-                        <uni-data-checkbox v-model="formData.reasonsForMissingPunch" :localdata="range2" />
+                        <uni-easyinput type="text" v-model="formData.password" placeholder="请输入新的登录密码" />
                     </uni-forms-item>
-                    <uni-forms-item name="remarks" label="备注" required>
+                    <uni-forms-item name="password2">
-                        <uni-easyinput type="textarea" v-model="formData.remarks" placeholder="请输入" />
+                        <uni-easyinput type="text" v-model="formData.password2" placeholder="请再次确认密码" />
                     </uni-forms-item>
-                </uni-forms> -->
+                </uni-forms>
-                <!-- <uni-steps :options="list2" active-color="#007AFF" direction="column" /> -->
                 <button type="default" class="submit-btn" @click="submit">提交</button>
+                <view class="login-box-tips">
+                        <view style="color:#999">说明：密码长度为6-18位</view>
+                    </view>
+                <view class="login-box-tips">
+                    <view style="color:#999">点击提交即表示同意</view>
+                    <navigator url="/pages/login/agreement" hover-class="none">《用户协议》</navigator>
+                    <navigator url="/pages/login/policy" hover-class="none">《个人信息保护政策》</navigator>
+                </view>
             </view>
         </view>
     </Cn-page>
@@ -28,64 +41,44 @@ export default {
     data () {
         return {
             loading: false,
-            alias: "missingPunchApplication",
+            waitTime: 0,
             // 表单数据
             formData: {
-                created: "",
+                phone: '',
-                createdId: "",
+                code: '',
-                viewRecordList: [],
+                password: '',
-                applicant: "",
+                password2: ''
-                createdDate: "",
-                applicantId: "",
-                applicationNo: "",
-                multipleDhoice: "",
-                reasonsForMissingPunch: "",
-                remarks: ""
             },
-            defId: "",
-            list2: [],
-            range: [
-                { value: "上午上班", text: "上午上班" },
-                { value: "下午上班", text: "下午上班" }
-            ],
-            // 漏打卡原因
-            range2: [
-                { value: "忘记打卡", text: "忘记打卡" },
-                { value: "机器故障", text: "机器故障" },
-                { value: "因公外出", text: "因公外出" },
-                { value: "指纹丢失", text: "指纹丢失" },
-                { value: "其他", text: "其他" }
-            ],
             rules: {
-                missingDate: {
+                phone: {
                     rules: [
                         {
                             required: true,
-                            errorMessage: "请选择漏打日期"
+                            errorMessage: "请填写手机号"
                         }
                     ]
                 },
-                multipleDhoice: {
+                code: {
                     rules: [
                         {
                             required: true,
-                            errorMessage: "请填写补卡类别"
+                            errorMessage: "请填写验证码"
                         }
                     ]
                 },
-                reasonsForMissingPunch: {
+                password: {
                     rules: [
                         {
                             required: true,
-                            errorMessage: "请选择漏打卡原因"
+                            errorMessage: "请填写新密码"
                         }
                     ]
                 },
-                remarks: {
+                password2: {
                     rules: [
                         {
                             required: true,
-                            errorMessage: "请填写备注"
+                            errorMessage: "请填写确认密码"
                         }
                     ]
                 }
@@ -95,6 +88,23 @@ export default {
     onLoad () {
     },
     methods: {
+        getCode () {
+            this.waitTime = 60
+            this.inter = setInterval(() => {
+                if (this.waitTime == 0) {
+                    clearInterval(this.inter)
+                } else {
+                    this.waitTime--
+                }
+            }, 1000)
+        },
+        submit () {
+            this.$refs.form.validate((valid) => {
+                console.log(valid);
+                if (valid) {
+                }
+            })
+        },
     }
 };
 </script>
@@ -106,5 +116,44 @@ export default {
         background: $uni-theme-blue;
         color: #fff;
     }
+
+    .login-box-tips {
+        margin-top: 60rpx;
+        display: flex;
+        justify-content: center;
+        font-size: 20rpx;
+    }
+
+    .login-box-input {
+        display: flex;
+        align-items: center;
+        border-bottom: 1rpx solid #f0f0f0;
+
+        .login-box-input-icon {
+            width: 40rpx;
+            margin-right: 40rpx;
+        }
+
+        .login-box-input-main {
+            font-size: 28rpx;
+            flex: 1;
+            height: 100rpx;
+            line-height: 100rpx;
+        }
+
+        .login-box-input-btn {
+            width: 200rpx;
+            margin-left: 40rpx;
+            background: $uni-theme-blue;
+            color: #fff;
+        }
+
+        .login-box-input-img {
+            margin-left: 40rpx;
+            background: skyblue;
+            height: 80rpx;
+            width: 200rpx;
+        }
+    }
 }
 </style>

pages/login/login.vue

@@ -41,14 +41,14 @@
                         <view @click="loginType = 'pwd'" v-if="loginType == 'yzm'">账号密码登录</view>
                         <view @click="loginType = 'yzm'" v-else>短信验证码登录</view>
                         <view style="flex:1"></view>
-                        <navigator url="/pages/login/changePwd" hover-class="none">忘记密码</navigator>
+                        <navigator url="/pages/login/forget" hover-class="none">忘记密码</navigator>
                         <view style="margin:0 10px;color:#999">|</view>
-                        <view>快速注册</view>
+                        <navigator url="/pages/login/register" hover-class="none">快速注册</navigator>
                     </view>
                     <view class="login-box-tips">
                         <view style="color:#999">点击登录即表示同意</view>
-                        <view>《用户协议》</view>
+                        <navigator url="/pages/login/agreement" hover-class="none">《用户协议》</navigator>
-                        <view>《个人信息保护政策》</view>
+                        <navigator url="/pages/login/policy" hover-class="none">《个人信息保护政策》</navigator>
                     </view>
                 </view>
             </view>

pages/login/platform.vue

@@ -1,237 +0,0 @@
-<template>
-    <Cn-page :loading="loading">
-        <view slot="body">
-            <view class="platform">
-                <view class="platform-bg"></view>
-                <!-- <view class="platform-title">全国特种设备无损检测公共服务云平台</view> -->
-                <view class="platform-des" v-if="list.length">当前手机号绑定单位</view>
-                <view class="platform-des" v-else>通过手机号获取单位</view>
-                <view class="platform-content" v-if="list.length">
-                    <navigator
-                        hover-class="none"
-                        :url="'/pages/login/login?alias=' + item.alias + '&name=' + item.companyName + '&account=' + phone.trim()"
-                        class="platform-content-card"
-                        v-for="item in list"
-                        :key="item.alias"
-                    >
-                        <view class="platform-content-card-title">{{ item.companyName }}</view>
-                        <view class="platform-content-card-des">{{ item.alias }}</view>
-                    </navigator>
-                    <div style="height:280rpx"></div>
-                    <view class="platform-footer iphone">
-                        <view class="platform-footer-tips">以上不是您需访问的平台？</view>
-                        <view class="platform-footer-btn" @click="showPopup">输入智慧云手机号/账号</view>
-                    </view>
-                </view>
-                <view class="platform-content center" v-else>
-                    <view>
-                        <view class="platform-footer-btn" @click="showPopup">输入智慧云手机号/账号</view>
-                        <!-- #ifdef MP -->
-                        <button
-                            v-if="canGetPhoneNumber"
-                            type="primary"
-                            class="platform-footer-btn"
-                            open-type="getPhoneNumber"
-                            @getphonenumber="onGetUserPhone"
-                        >本机号码一键获取</button>
-                        <!-- <view
-                            type="primary"
-                            class="platform-footer-btn"
-                            @click="wxLogin"
-                        >微信一键登录</view> -->
-                        <!-- #endif -->
-                    </view>
-                </view>
-                <uni-popup ref="inputPhone" type="center" :animation="false">
-                    <view class="input-box">
-                        <input
-                            type="text"
-                            class="input-box-main"
-                            placeholder-class="input-box-main-placeholder"
-                            placeholder="请输入智慧云手机号/账号"
-                            v-model="phone"
-                        />
-                        <view class="input-box-btn">
-                            <view class="input-box-btn-item" @click="cancel">取消</view>
-                            <view class="input-box-btn-item" @click="load">确定</view>
-                        </view>
-                    </view>
-                </uni-popup>
-            </view>
-        </view>
-    </Cn-page>
-</template>
-<script>
-export default {
-    data() {
-        return {
-            loading: false,
-            phone: "",
-            list: [],
-            canGetPhoneNumber: true
-        };
-    },
-    components: {},
-    methods: {
-        showPopup() {
-            this.$refs.inputPhone.open();
-        },
-        load() {
-            this.$request({
-                url: "/cloud/getPlatformByAccout",
-                data: {
-                    accout: this.phone.trim()
-                },
-                method: "POST"
-            }).then(res => {
-                console.warn(res);
-                this.list = res.data;
-                this.$refs.inputPhone.close();
-            });
-        },
-        cancel() {
-            this.$refs.inputPhone.close();
-        },
-        onGetUserPhone(e) {
-            console.warn(e);
-            this.$request({
-                url: "/org/wxxcx/getPhoneNum",
-                data: {
-                    code: e.detail.code,
-                },
-                method: "POST"
-            }).then(res=>{
-               let data = JSON.parse(res.data)
-               this.phone = data.phoneNumber
-               this.load()
-            })
-        }
-    },
-    onLoad() {
-        // #ifdef MP-WEIXIN
-        uni.hideHomeButton();
-        // #endif
-    }
-};
-</script>
-<style lang='less'>
-.platform {
-    position: relative;
-    z-index: 2;
-    .platform-bg {
-        position: absolute;
-        top: 0;
-        left: 0;
-        width: 100%;
-        height: 320rpx;
-        background: skyblue;
-        z-index: -1;
-    }
-    .platform-title {
-        padding: 40rpx 20rpx 0;
-        font-size: 28rpx;
-        color: #fff;
-    }
-    .platform-des {
-        padding: 36rpx 20rpx 0;
-        font-size: 24rpx;
-        color: #fff;
-    }
-    .platform-content {
-        padding: 28rpx 20rpx;
-        font-size: 24rpx;
-        margin-top: 60rpx;
-        border-radius: 28rpx 28rpx 0 0;
-        min-height: 50vh;
-        background: #f5f6fa;
-        .platform-content-card {
-            margin-bottom: 20rpx;
-            padding: 33rpx 28rpx;
-            border-radius: 14rpx;
-            background: #fff;
-            .platform-content-card-title {
-                font-weight: 600;
-                font-size: 28rpx;
-                color: #111;
-            }
-            .platform-content-card-des {
-                font-size: 24rpx;
-                margin-top: 23rpx;
-                color: #999;
-            }
-        }
-    }
-    .platform-footer {
-        position: fixed;
-        bottom: 0;
-        left: 0;
-        display: flex;
-        flex-direction: column;
-        align-items: center;
-        justify-content: center;
-        height: 280rpx;
-        width: 100%;
-        background: #fff;
-        .platform-footer-tips {
-            font-size: 28rpx;
-            color: #000;
-        }
-    }
-    .platform-footer-btn {
-        margin: 0 auto;
-        height: 80rpx;
-        width: 480rpx;
-        display: flex;
-        align-items: center;
-        justify-content: center;
-        margin-top: 40rpx;
-        background: #449dff;
-        font-size: 24rpx;
-        color: #fff;
-        border-radius: 40rpx;
-        overflow: hidden;
-    }
-    .input-box {
-        box-sizing: border-box;
-        padding: 80rpx 60rpx 0;
-        height: 400rpx;
-        width: 680rpx;
-        border-radius: 16rpx;
-        background: #fff;
-        .input-box-main {
-            box-sizing: border-box;
-            height: 80rpx !important;
-            line-height: 80rpx !important;
-            border-radius: 4rpx;
-            font-size: 28rpx;
-            color: #333;
-            padding: 0 40rpx;
-            margin-top: 40rpx;
-            background: #f9f9f9;
-        }
-        .input-box-btn {
-            margin-top: 80rpx;
-            display: flex;
-            justify-content: center;
-            .input-box-btn-item {
-                height: 64rpx;
-                width: 200rpx;
-                background: #449dff;
-                display: flex;
-                justify-content: center;
-                align-items: center;
-                color: #fff;
-                font-size: 24rpx;
-                border-radius: 8rpx;
-            }
-            .input-box-btn-item:first-of-type {
-                box-sizing: border-box;
-                margin-right: 37rpx;
-                background: #fff;
-                border: 1px solid #666666;
-                color: #666666;
-            }
-        }
-    }
-}
-</style>

pages/login/policy.vue

@@ -0,0 +1,25 @@
+<template>
+    <Cn-page :loading='loading'>
+        <view slot='body'>
+            <view class='index'>
+                隐私政策
+            </view>
+        </view>
+    </Cn-page>
+</template>
+<script>
+export default {
+    data () {
+        return {
+            loading: false
+        }
+    },
+    methods: {
+    }
+}
+</script>
+<style lang='scss'>
+.index {
+    padding: 34rpx;
+}
+</style>

pages/login/register.vue

@@ -0,0 +1,167 @@
+<template>
+    <Cn-page :loading="loading">
+        <view slot="body">
+            <view class="index">
+                <template v-if="step == 1">
+                    <uni-forms ref="form">
+                        <uni-forms-item name="phone">
+                            <uni-easyinput type="number" v-model="formData.phone" placeholder="请输入手机号" />
+                        </uni-forms-item>
+                        <uni-forms-item name="code">
+                            <view class="login-box-input mt40">
+                                <uni-easyinput type="number" v-model="formData.code" placeholder="请输入验证码" />
+                                <view class="ml40"
+                                    style="margin-left:40rpx;font-size: 28rpx; color: #666; width: 200rpx; text-align: center"
+                                    v-if="waitTime > 0">{{ waitTime + 's后重新获取' }}</view>
+                                <button class="login-box-input-btn" v-else @click="getCode" size="mini">获取验证码</button>
+                            </view>
+                        </uni-forms-item>
+                    </uni-forms>
+                    <button type="default" class="submit-btn" @click="firstSubmit">下一步</button>
+                    <view class="login-box-tips">
+                        <view style="color:#999">点击提交即表示同意</view>
+                        <navigator url="/pages/login/agreement" hover-class="none">《用户协议》</navigator>
+                        <navigator url="/pages/login/policy" hover-class="none">《个人信息保护政策》</navigator>
+                    </view>
+                </template>
+                <template v-else>
+                    <uni-forms ref="form">
+                        <uni-forms-item name="password">
+                            <uni-easyinput type="text" v-model="formData.password" placeholder="请输入登录密码" />
+                        </uni-forms-item>
+                        <uni-forms-item name="password2">
+                            <uni-easyinput type="text" v-model="formData.password2" placeholder="请再次确认密码" />
+                        </uni-forms-item>
+                    </uni-forms>
+                    <button type="default" class="submit-btn" @click="secondSubmit">提交</button>
+                    <view class="login-box-tips">
+                        <view style="color:#999">说明：密码长度为6-18位</view>
+                    </view>
+                </template>
+            </view>
+        </view>
+    </Cn-page>
+</template>
+<script>
+export default {
+    name: "jiaban",
+    data () {
+        return {
+            step: 1,
+            loading: false,
+            waitTime: 0,
+            // 表单数据
+            formData: {
+                phone: '',
+                code: '',
+                password: '',
+                password2: ''
+            },
+            rules: {
+                phone: {
+                    rules: [
+                        {
+                            required: true,
+                            errorMessage: "请填写手机号"
+                        }
+                    ]
+                },
+                code: {
+                    rules: [
+                        {
+                            required: true,
+                            errorMessage: "请填写验证码"
+                        }
+                    ]
+                },
+                password: {
+                    rules: [
+                        {
+                            required: true,
+                            errorMessage: "请填写新密码"
+                        }
+                    ]
+                },
+                password2: {
+                    rules: [
+                        {
+                            required: true,
+                            errorMessage: "请填写确认密码"
+                        }
+                    ]
+                }
+            }
+        };
+    },
+    onLoad () {
+    },
+    methods: {
+        getCode () {
+            this.waitTime = 60
+            this.inter = setInterval(() => {
+                if (this.waitTime == 0) {
+                    clearInterval(this.inter)
+                } else {
+                    this.waitTime--
+                }
+            }, 1000)
+        },
+        firstSubmit () {
+            this.step = 2
+
+        },
+        secondSubmit () {
+
+        }
+    }
+};
+</script>
+<style lang="scss">
+.index {
+    padding: 34rpx;
+
+    .submit-btn {
+        background: $uni-theme-blue;
+        color: #fff;
+    }
+
+    .login-box-tips {
+        margin-top: 60rpx;
+        display: flex;
+        justify-content: center;
+        font-size: 20rpx;
+    }
+
+    .login-box-input {
+        display: flex;
+        align-items: center;
+        border-bottom: 1rpx solid #f0f0f0;
+
+        .login-box-input-icon {
+            width: 40rpx;
+            margin-right: 40rpx;
+        }
+
+        .login-box-input-main {
+            font-size: 28rpx;
+            flex: 1;
+            height: 100rpx;
+            line-height: 100rpx;
+        }
+
+        .login-box-input-btn {
+            width: 200rpx;
+            margin-left: 40rpx;
+            background: $uni-theme-blue;
+            color: #fff;
+        }
+
+        .login-box-input-img {
+            margin-left: 40rpx;
+            background: skyblue;
+            height: 80rpx;
+            width: 200rpx;
+        }
+    }
+}
+</style>

pages/mine/setup.vue

@@ -0,0 +1,100 @@
+<template>
+    <view :loading="loading">
+        <view class="mine">
+            <view class="mine-nav" @click="jump('server')"
+                style="border-bottom: none; box-shadow: 0 4rpx 8rpx #e7e7e74c;">
+                <view class="mine-nav-label">客服</view>
+                <uni-icons type="forward" color="#aaa" size="20"></uni-icons>
+            </view>
+            <view class="mine-nav" @click="jump('changePwd')" style="margin-top:20rpx;border-bottom: none; ">
+                <view class="mine-nav-label">修改密码</view>
+                <uni-icons type="forward" color="#aaa" size="20"></uni-icons>
+            </view>
+            <view class="mine-nav" @click="jump('layout')" style="margin-top:20rpx;border-bottom: none; ">
+                <view class="mine-nav-label" style="text-align:center">退出登录</view>
+            </view>
+        </view>
+    </view>
+</template>
+
+<script>
+export default {
+    data () {
+        return {
+            loading: false
+        }
+    },
+    methods: {
+        init () {
+        },
+        jump (type) {
+            switch (type) {
+                case 'changePwd':
+                    uni.navigateTo({
+                        url: `/pages/login/changePwd`
+                    })
+                default:
+                    uni.navigateTo({
+                        url: `/pages/mine/${type}`
+                    })
+                    break;
+            }
+        }
+    },
+    onLoad () {
+        this.init()
+    },
+}
+</script>
+
+<style lang="scss">
+.mine {
+    .mine-header {
+        padding: 200rpx 34rpx 34rpx;
+        display: flex;
+        align-items: center;
+        background: $uni-theme-white;
+        margin-bottom: 20rpx;
+        box-shadow: 0 4rpx 8rpx #e7e7e74c;
+
+        .mine-header-head {
+            margin-right: 30rpx;
+            height: 128rpx;
+            width: 128rpx;
+            border-radius: $uni-theme-radius;
+            overflow: hidden;
+        }
+
+        .mine-header-name {
+            margin-right: 30rpx;
+            flex: 1;
+            font-size: 36rpx;
+            color: #111;
+            font-weight: 700;
+        }
+    }
+
+    .mine-nav {
+        padding: 34rpx;
+        display: flex;
+        align-items: center;
+        background: $uni-theme-white;
+        border-bottom: 1rpx solid #e8e8e8;
+
+        &-icon {
+            margin-right: 30rpx;
+            height: 44rpx;
+            width: 44rpx;
+            border-radius: $uni-theme-radius;
+            overflow: hidden;
+        }
+
+        &-label {
+            margin-right: 30rpx;
+            flex: 1;
+            font-size: 28rpx;
+            color: #111;
+        }
+    }
+}
+</style>