样式修改

src/main/pc-space/src/components/SecurityPhone.vue

@@ -5,7 +5,7 @@
             <el-step title="绑定新手机号"></el-step>
             <el-step title="完成"></el-step>
         </el-steps>
-        <el-form :label-position="labelPosition" ref="form2" label-width="340px" :model="ruleForm" :rules="rules">
+        <el-form :label-position="labelPosition" ref="form2" label-width="290px" :model="ruleForm" :rules="rules">
             <el-form-item label="新手机号" prop="phone">
                 <el-input style="width: 300px" v-model="ruleForm.phone" placeholder="请输入新的手机号码"></el-input>
             </el-form-item>
@@ -17,9 +17,11 @@
                 </el-input>
             </el-form-item>
         </el-form>
-        <div class="btn">
-            <el-button type="primary" @click="phoneSend">确认</el-button>
-            <div class="btn2" @click="Jump">返回</div>
+        <div class="btn1">
+            <div class="btn2">
+                <el-button type="primary" @click="phoneSend">确认</el-button>
+                <div class="btn3" @click="Jump">返回</div>
+            </div>
         </div>
     </div>
 </template>
@@ -78,7 +80,7 @@ export default {
 </script>
 <style lang="less" scoped>
 /deep/ .el-steps {
-    margin-left: 385px;
+    margin-left: 329px;
 }
 /deep/.el-step:nth-child(1) {
     .el-step__icon {
@@ -109,21 +111,24 @@ export default {
     color: #939599;
 }
 .container {
-    .btn {
-        margin: 80px 0 0 110px;
-        display: flex;
-        justify-content: center;
+    .btn1 {
+        margin-left: 10px;
         .btn2 {
-            width: 130px;
-            height: 36px;
-            background: #c4c7cc;
-            border-radius: 4px;
-            cursor: pointer;
-            color: #ffffff;
-            font-size: 13px;
-            text-align: center;
-            line-height: 36px;
-            margin-left: 20px;
+            display: flex;
+            justify-content: center;
+            margin-top: 80px;
+            .btn3 {
+                width: 130px;
+                height: 36px;
+                background: #c4c7cc;
+                border-radius: 4px;
+                cursor: pointer;
+                color: #ffffff;
+                font-size: 13px;
+                text-align: center;
+                line-height: 36px;
+                margin-left: 20px;
+            }
         }
     }
     /deep/ .el-button {

src/main/pc-space/src/components/TransactionPhone.vue

@@ -5,7 +5,7 @@
             <el-step title="绑定新手机号"></el-step>
             <el-step title="完成"></el-step>
         </el-steps>
-        <el-form :label-position="labelPosition" ref="form2" label-width="340px" :model="ruleForm" :rules="rules">
+        <el-form :label-position="labelPosition" ref="form2" label-width="290px" :model="ruleForm" :rules="rules">
             <el-form-item label="新手机号" prop="phone">
                 <el-input style="width: 300px" v-model="ruleForm.phone" placeholder="请输入新的手机号码"></el-input>
             </el-form-item>
@@ -17,9 +17,11 @@
                 </el-input>
             </el-form-item>
         </el-form>
-        <div class="btn">
-            <el-button type="primary" @click="phoneSend">确认</el-button>
-            <div class="btn2" @click="Jump">返回</div>
+        <div class="btn1">
+            <div class="btn2">
+                <el-button type="primary" @click="phoneSend">确认</el-button>
+                <div class="btn3" @click="Jump">返回</div>
+            </div>
         </div>
     </div>
 </template>
@@ -78,7 +80,7 @@ export default {
 </script>
 <style lang="less" scoped>
 /deep/ .el-steps {
-    margin-left: 385px;
+    margin-left: 329px;
 }
 /deep/.el-step:nth-child(1) {
     .el-step__icon {
@@ -109,21 +111,24 @@ export default {
     color: #939599;
 }
 .container {
-    .btn {
-        margin: 80px 0 0 110px;
-        display: flex;
-        justify-content: center;
+    .btn1 {
+        margin-left: 10px;
         .btn2 {
-            width: 130px;
-            height: 36px;
-            background: #c4c7cc;
-            border-radius: 4px;
-            cursor: pointer;
-            color: #ffffff;
-            font-size: 13px;
-            text-align: center;
-            line-height: 36px;
-            margin-left: 20px;
+            display: flex;
+            justify-content: center;
+            margin-top: 80px;
+            .btn3 {
+                width: 130px;
+                height: 36px;
+                background: #c4c7cc;
+                border-radius: 4px;
+                cursor: pointer;
+                color: #ffffff;
+                font-size: 13px;
+                text-align: center;
+                line-height: 36px;
+                margin-left: 20px;
+            }
         }
     }
     /deep/ .el-button {

src/main/pc-space/src/views/user/Security.vue

@@ -16,7 +16,7 @@
                 <el-form
                     :label-position="labelPosition"
                     ref="form"
-                    label-width="340px"
+                    label-width="290px"
                     :model="ruleForm"
                     :rules="rules"
                 >
@@ -34,9 +34,11 @@
                         </el-input>
                     </el-form-item>
                 </el-form>
-                <div class="btn">
-                    <el-button type="primary" @click="codeSend">确认</el-button>
-                    <div class="btn2" @click="all('/accountdata')">返回</div>
+                <div class="btn1">
+                    <div class="btn2">
+                        <el-button type="primary" @click="codeSend">确认</el-button>
+                        <div class="btn3" @click="all('/accountdata')">返回</div>
+                    </div>
                 </div>
             </div>
             <div v-else>
@@ -92,20 +94,20 @@ export default {
             this.sendMsg(this.ruleForm.phone);
         },
         codeSend() {
-            // this.flag = false;
-            this.$http
-                .get('/sms/verify', {
-                    phone: this.ruleForm.phone,
-                    code: this.ruleForm.code
-                })
-                .then(() => {
-                    this.ruleForm.code = '';
-                    this.ruleForm.phone = '';
-                    this.flag = false;
-                })
-                .catch(e => {
-                    this.$message.error(e.error);
-                });
+            this.flag = false;
+            // this.$http
+            //     .get('/sms/verify', {
+            //         phone: this.ruleForm.phone,
+            //         code: this.ruleForm.code
+            //     })
+            //     .then(() => {
+            //         this.ruleForm.code = '';
+            //         this.ruleForm.phone = '';
+            //         this.flag = false;
+            //     })
+            //     .catch(e => {
+            //         this.$message.error(e.error);
+            //     });
         },
         Jump() {
             this.flag = true;
@@ -117,7 +119,7 @@ export default {
 
 <style lang="less" scoped>
 /deep/ .el-steps {
-    margin-left: 385px;
+    margin-left: 329px;
 }
 /deep/.el-step:nth-child(1) {
     .el-step__icon {
@@ -148,21 +150,24 @@ export default {
     color: #939599;
 }
 .container {
-    .btn {
-        display: flex;
-        justify-content: center;
-        margin: 80px 0 0 110px;
+    .btn1 {
+        margin-left: 10px;
         .btn2 {
-            width: 130px;
-            height: 36px;
-            background: #c4c7cc;
-            border-radius: 4px;
-            cursor: pointer;
-            color: #ffffff;
-            font-size: 13px;
-            text-align: center;
-            line-height: 36px;
-            margin-left: 20px;
+            display: flex;
+            justify-content: center;
+            margin-top: 80px;
+            .btn3 {
+                width: 130px;
+                height: 36px;
+                background: #c4c7cc;
+                border-radius: 4px;
+                cursor: pointer;
+                color: #ffffff;
+                font-size: 13px;
+                text-align: center;
+                line-height: 36px;
+                margin-left: 20px;
+            }
         }
     }
     /deep/ .el-button {

src/main/pc-space/src/views/user/SecuritySuccess.vue

@@ -57,7 +57,7 @@ export default {
 
 <style lang="less" scoped>
 /deep/ .el-steps {
-    margin-left: 385px;
+    margin-left: 329px;
 }
 /deep/.el-step:nth-child(1) {
     .el-step__icon {
@@ -83,7 +83,6 @@ export default {
 .container {
     .fail {
         text-align: center;
-        margin-left: 100px;
         .text1 {
             width: 68px;
             height: 68px;
@@ -94,7 +93,7 @@ export default {
             font-weight: 400;
             color: #ffffff;
             line-height: 24px;
-            margin-top: 20px;
+            margin: 20px 0 59px;
         }
         .botn {
             width: 130px;
@@ -106,7 +105,7 @@ export default {
             text-align: center;
             background: linear-gradient(133deg, #00ffcb 0%, #006eff 100%);
             border-radius: 4px;
-            margin: 59px 0 0 488px;
+            margin: 0 auto;
         }
     }
     /deep/ .el-step__title {

src/main/pc-space/src/views/user/Transaction.vue

@@ -16,7 +16,7 @@
                 <el-form
                     :label-position="labelPosition"
                     ref="form"
-                    label-width="340px"
+                    label-width="290px"
                     :model="ruleForm"
                     :rules="rules"
                 >
@@ -34,9 +34,11 @@
                         </el-input>
                     </el-form-item>
                 </el-form>
-                <div class="btn">
-                    <el-button type="primary" @click="codeSend">确认</el-button>
-                    <div class="btn2" @click="all('/accountdata')">返回</div>
+                <div class="btn1">
+                    <div class="btn2">
+                        <el-button type="primary" @click="codeSend">确认</el-button>
+                        <div class="btn3" @click="all('/accountdata')">返回</div>
+                    </div>
                 </div>
             </div>
             <div v-else>
@@ -92,20 +94,20 @@ export default {
             this.sendMsg(this.ruleForm.phone);
         },
         codeSend() {
-            // this.flag = false;
-            this.$http
-                .get('/sms/verify', {
-                    phone: this.ruleForm.phone,
-                    code: this.ruleForm.code
-                })
-                .then(() => {
-                    this.ruleForm.code = '';
-                    this.ruleForm.phone = '';
-                    this.flag = false;
-                })
-                .catch(e => {
-                    this.$message.error(e.error);
-                });
+            this.flag = false;
+            // this.$http
+            //     .get('/sms/verify', {
+            //         phone: this.ruleForm.phone,
+            //         code: this.ruleForm.code
+            //     })
+            //     .then(() => {
+            //         this.ruleForm.code = '';
+            //         this.ruleForm.phone = '';
+            //         this.flag = false;
+            //     })
+            //     .catch(e => {
+            //         this.$message.error(e.error);
+            //     });
         },
         Jump() {
             this.flag = true;
@@ -117,7 +119,7 @@ export default {
 
 <style lang="less" scoped>
 /deep/ .el-steps {
-    margin-left: 385px;
+    margin-left: 329px;
 }
 /deep/.el-step:nth-child(1) {
     .el-step__icon {
@@ -148,21 +150,24 @@ export default {
     color: #939599;
 }
 .container {
-    .btn {
-        display: flex;
-        justify-content: center;
-        margin: 80px 0 0 110px;
+    .btn1 {
+        margin-left: 10px;
         .btn2 {
-            width: 130px;
-            height: 36px;
-            background: #c4c7cc;
-            border-radius: 4px;
-            cursor: pointer;
-            color: #ffffff;
-            font-size: 13px;
-            text-align: center;
-            line-height: 36px;
-            margin-left: 20px;
+            display: flex;
+            justify-content: center;
+            margin-top: 80px;
+            .btn3 {
+                width: 130px;
+                height: 36px;
+                background: #c4c7cc;
+                border-radius: 4px;
+                cursor: pointer;
+                color: #ffffff;
+                font-size: 13px;
+                text-align: center;
+                line-height: 36px;
+                margin-left: 20px;
+            }
         }
     }
     /deep/ .el-button {

src/main/pc-space/src/views/user/TransactionSuccess.vue

@@ -57,7 +57,7 @@ export default {
 
 <style lang="less" scoped>
 /deep/ .el-steps {
-    margin-left: 385px;
+    margin-left: 329px;
 }
 /deep/.el-step:nth-child(1) {
     .el-step__icon {
@@ -83,7 +83,6 @@ export default {
 .container {
     .fail {
         text-align: center;
-        margin-left: 100px;
         .text1 {
             width: 68px;
             height: 68px;
@@ -94,7 +93,7 @@ export default {
             font-weight: 400;
             color: #ffffff;
             line-height: 24px;
-            margin-top: 20px;
+            margin: 20px 0 59px;
         }
         .botn {
             width: 130px;
@@ -106,7 +105,7 @@ export default {
             text-align: center;
             background: linear-gradient(133deg, #00ffcb 0%, #006eff 100%);
             border-radius: 4px;
-            margin: 59px 0 0 488px;
+            margin: 0 auto;
         }
     }
     /deep/ .el-step__title {