完善

src/components/Login/updatepsw.vue

@@ -81,7 +81,7 @@
                 <!-- <i slot="prefix" class="iconfont icon-mima" /> -->
               </a-input>
             </a-form-item>
-            <a-form-item label class="submit" style="height: 40px;position: relative;">
+            <a-form-item label class="submit" style="height: 40px;position: relative;margin-bottom: 0;">
               <div class="state-box">
 				  <a-button type="primary" class="cancel login-form-button" @click="cancel">取消</a-button>
 				    <a-button 
@@ -286,7 +286,8 @@ export default {
     }
   }
   .formbox {
-    width: 710px;
+    width: 444px;
+    margin: 0 auto;
     .ant-form-item {
       display: flex;
       // align-items: center;
@@ -297,7 +298,7 @@ export default {
       min-height: 20px !important;
     }
     /deep/.ant-form-item-control {
-      width: 544px !important;
+      width: 430px !important;
       .ant-input-affix-wrapper {
         display: flex;
         flex: 1;
@@ -409,8 +410,8 @@ export default {
 }
 .state-box{
 	position: absolute;
-	left: -338px;
-	width: 544px;
-	top: 0px;
+	left: -111px;
+	width: 430px;
+	top: -15px;
 }
 </style>

src/components/userinfo/accountsetting/components/loginpsw.vue

@@ -1,5 +1,5 @@
 <template>
-  <div class="loginpsw-container">
+  <div class="loginpsw-containerd">
     <div class="contenttitle" style="border-bottom: none;margin-top: 16px;margin-bottom: 0;padding-bottom: 0;">
       <!-- <span v-if="!istelshow" style="font-size: 14px;">绑定手机</span>
       <span v-else style="font-size: 14px;">已绑定手机</span> -->
@@ -10,15 +10,15 @@
         <div class="label g_fs_14 g_mb_12 g_c_3 g_fw_600">账户密码</div>
         <div class="result g_flex_row_start">
           <div class="g_c_9 g_fs_14">密码已设置</div>
-          <div class="g_fs_14 g_ml_16 g_c_main">修改</div>
-        </div>
+          <div class="g_fs_14 g_ml_16 g_c_main" style="cursor: pointer;" @click="loginShow = true">修改</div>
+        </div> 
       </div>
 
       <div class="new-item g_pb_16 g_mb_16" style="border-bottom: 1px solid rgb(238, 238, 238);">
         <div class="label g_fs_14 g_mb_12 g_c_3 g_fw_600">密保手机</div>
         <div class="result g_flex_row_start">
           <div class="g_c_9 g_fs_14">已绑定手机：177****8662</div>
-          <div class="g_fs_14 g_ml_16 g_c_main">修改</div>
+          <div class="g_fs_14 g_ml_16 g_c_main" style="cursor: pointer;">修改</div>
         </div>
       </div>
 
@@ -78,10 +78,51 @@
           <i class="iconfont icon-zhengyan1" style="font-size: 16px; margin-top: -5px; margin-right: -3px" @click="changeStatus" v-else></i>
         </div>-->
       </a-form>
-      <a-modal title="找回密码" :width="760" footer :visible="loginShow" class="modal" @cancel="handleCancel" :maskClosable="false" okText="提交" cancelText="取消" :destroyOnClose="true">
-        <updatepsw :loginShow.sync='loginShow'></updatepsw>
-      </a-modal>
     </div>
+
+    <a-modal title="重置密码" :width="640" footer :visible="loginShow" class="modal" @cancel="handleCancel" :maskClosable="false" okText="提交" cancelText="取消" :destroyOnClose="true">
+      <div style="margin: 0 auto;">
+        <updatepsw :loginShow.sync='loginShow'></updatepsw>
+      </div>
+    </a-modal>
+
+    <a-modal
+      title="重置密码"
+      :visible="pwdModal.isShow"
+      :confirm-loading="pwdModal.isLoading"
+      :footer="false"
+      class="login-sa-modal"
+      width="640px"
+    >
+      <a-form
+        :form="pwdModal"
+        layout="horizontal"
+        @submit="pwdHandleOk"
+      >
+        <div style="width: 75%;margin: 0 auto;">
+          <a-form-item label="手机号">
+            <a-input placeholder="请输入手机号" v-model="pwdModal.tel" style="width: 350px;" />
+          </a-form-item>
+
+          <a-form-item label="验证码">
+            <a-input placeholder="请输入验证码" v-model="pwdModal.code" style="width: 350px;" />
+          </a-form-item>
+
+          <a-form-item label="新密码">
+            <a-input placeholder="请输入新密码" v-model="pwdModal.user" style="width: 350px;" type="password" />
+          </a-form-item>
+
+          <a-form-item label="确认密码">
+            <a-input placeholder="请再次输入新密码" v-model="pwdModal.user" style="width: 350px;" type="password" />
+          </a-form-item>
+
+        </div>
+        <a-form-item style="margin-top: -5px;margin-bottom: 0;" class="g_flex_row_end">
+          <a-button style="height: 32px;overflow: hidden;margin-right: 16px;">取消</a-button>
+          <a-button type="primary" style="height: 32px;overflow: hidden;">确定</a-button>
+        </a-form-item>
+      </a-form>
+    </a-modal>
   </div>
 </template>
 
@@ -111,6 +152,10 @@ export default {
       form: this.$form.createForm(this),
       loginShow: false,
       btnLoading: false,
+
+      pwdModal:{
+        isShow:false
+      }
     }
   },
   // 计算属性
@@ -237,11 +282,36 @@ export default {
 
       // console.log(callback);
     },
+
+    openModalPwd(){
+      let that = this;
+      that.pwdModal = {
+        isShow:true
+      }
+      console.log(that.pwdModal);
+    },
+    pwdHandleOk(){
+
+    },
+    pwdHandleCancel(){
+
+    }
   },
 }
 </script>
 
 <style scoped lang="less">
+.login-sa-modal{
+  .ant-form-item{
+    display: flex;
+    margin-bottom: 16px;
+  }
+  /deep/ .ant-form-item-label{
+    width: 70px;
+    text-align: right;
+  }
+}
+
 /deep/ .login-form {
   // width: 430px;
   .ant-form-item-control {
@@ -260,7 +330,7 @@ export default {
   }
   .ant-input {
     height: 40px;
-    width: 430px;
+    width: 350px;
     text-indent: 15px;
     font-size: 14px;
     padding: 0 !important;