修改

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

@@ -36,11 +36,15 @@
 <script>
 import { mapState } from 'vuex';
 export default {
+    props: {
+        code: {
+            type: Object
+        }
+    },
     data() {
         return {
             labelPosition: 'right',
             ruleForm: {
-                pass: '',
                 password: ''
             },
             rules: {
@@ -65,12 +69,24 @@ export default {
     },
     methods: {
         phoneSend() {
-            this.$http.post('/user/setTradeCode?tradeCode=' + this.ruleForm.password).then(() => {
-                this.$message.success('设置成功');
-                setTimeout(() => {
-                    this.$router.push('/transactionsuccess');
-                }, 1500);
-            });
+            console.log(this.code);
+            this.$http
+                .post('/user/setTradeCode', {
+                    token: this.code,
+                    tradeCode: this.ruleForm.password
+                })
+                .then(() => {
+                    this.$message.success('设置成功');
+                    console.log(222);
+                    setTimeout(() => {
+                        this.$router.push('/transactionsuccess');
+                    }, 1000);
+                })
+                .catch(e => {
+                    if (e) {
+                        this.$message(e.error);
+                    }
+                });
         },
         Jump() {
             this.$emit('Jump');

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

@@ -15,6 +15,34 @@
                     ref="form"
                     :rules="rules"
                 >
+                    <el-form-item
+                        prop="phone"
+                        label="手机号"
+                        :rules="{
+                            pattern: /^1[3-9]\d{9}$/,
+                            message: '请输入正确的手机号',
+                            trigger: 'blur'
+                        }"
+                    >
+                        <el-input
+                            style="width: 300px"
+                            :disabled="true"
+                            v-model="ruleForm.phone"
+                            placeholder="请输入手机号"
+                        ></el-input>
+                    </el-form-item>
+                    <el-form-item prop="code" label="验证码">
+                        <el-form-item prop="code" :rules="{ required: true, message: '请输入', trigger: 'blur' }">
+                            <el-input style="width: 300px" v-model="ruleForm.code" placeholder="请输入短信验证码">
+                                <span
+                                    @click="send"
+                                    style="color: #ff4f50; cursor: pointer; font-size: 13px"
+                                    slot="suffix"
+                                    >{{ time === 0 ? '发送验证码' : `重新发送${time}s` }}</span
+                                >
+                            </el-input>
+                        </el-form-item>
+                    </el-form-item>
                     <el-form-item label="原密码" prop="password">
                         <el-input
                             style="width: 300px"
@@ -53,14 +81,19 @@
 
 <script>
 import eventBus from '../../eventBus';
+import phone from '../../mixins/phone';
+import { mapState } from 'vuex';
 export default {
+    mixins: [phone],
     data() {
         return {
             labelPosition: 'right',
             ruleForm: {
                 pass: '',
-                password: ''
+                password: '',
+                phone: ''
             },
+            time: 0,
             rules: {
                 checkPass: [
                     {
@@ -78,7 +111,17 @@ export default {
             }
         };
     },
+    computed: {
+        ...mapState(['userInfo'])
+    },
+    created() {
+        this.ruleForm.phone = this.userInfo.phone;
+    },
     methods: {
+        // 验证码
+        send() {
+            this.sendMsg(this.form.phone);
+        },
         codeSend() {
             this.$refs.form.validate(valid => {
                 this.$http
@@ -94,25 +137,6 @@ export default {
                             this.$toast(e.error);
                         }
                     });
-                // if (valid) {
-                //     this.$http
-                //         .post('/user/changePw', {
-                //             newPassword: this.ruleForm.pass,
-                //             password: this.ruleForm.password
-                //         })
-                //         .then(() => {
-                //             this.$message.warning('修改成功,请重新登录');
-                //             localStorage.removeItem('webToken');
-                //             this.$store.commit('updateUserInfo', null);
-                //         })
-                //         .then(() => {
-                //             this.$router.push('/');
-                //             eventBus.$emit('login');
-                //         })
-                //         .catch(e => {
-                //             this.$message.error(e.error);
-                //         });
-                // }
             });
         }
     }

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

@@ -42,7 +42,7 @@
                 </div>
             </div>
             <div v-else>
-                <transaction-phone @Jump="Jump"></transaction-phone>
+                <transaction-phone :code="ruleForm.code" @Jump="Jump"></transaction-phone>
             </div>
         </div>
     </div>
@@ -50,9 +50,11 @@
 
 <script>
 import TransactionPhone from '../../components/TransactionPhone.vue';
+import phone from '../../mixins/phone';
 import { mapState } from 'vuex';
 export default {
     components: { TransactionPhone },
+    mixins: [phone],
     data() {
         return {
             flag: true,
@@ -73,23 +75,20 @@ export default {
     },
     methods: {
         send() {
-            this.sendMsg(this.ruleForm.phone);
+            this.sendMsg(this.userInfo.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.$http
+                .get('/sms/verify', {
+                    phone: this.userInfo.phone,
+                    code: this.ruleForm.code
+                })
+                .then(() => {
+                    this.flag = false;
+                })
+                .catch(e => {
+                    this.$message.error(e.error);
+                });
         },
         Jump() {
             this.flag = true;