Merge remote-tracking branch 'origin/gzb' into wzl

src/views/layout.vue

           <DropdownMenu slot="list">
             <DropdownItem name="1">个人信息</DropdownItem>
             <DropdownItem name="2">修改密码</DropdownItem>
-            <DropdownItem name="5">更换手机号</DropdownItem>
+            <DropdownItem name="3">更换手机号</DropdownItem>
             <DropdownItem name="4">退出</DropdownItem>
           </DropdownMenu>
         </Dropdown>
     </div>
     <!-- 修改密码 -->
     <Modal
-        class="modal1"
-        :mask-closable="false"
-        v-model="pwInfo.show"
-        title="修改密码"
+      class="modal_view"
+      :mask-closable="false"
+      v-model="pwInfo.show"
+      title="修改密码"
     >
       <Form
-          v-if="pwInfo.show"
-          ref="pwInfo"
-          :model="pwInfo"
-          :rules="rules"
-          :label-width="110"
+        v-if="pwInfo.show"
+        ref="pwInfo"
+        :model="pwInfo"
+        :rules="rules"
+        :label-width="110"
       >
         <FormItem label="原密码" prop="oldpwd">
-          <Input
-              v-model="pwInfo.oldpwd"
-              placeholder="请输入原密码"
-          ></Input>
+          <Input v-model="pwInfo.oldpwd" placeholder="请输入原密码"></Input>
         </FormItem>
-        <FormItem
-            label="新密码"
-            prop="loginpwd"
-        >
-          <Input
-              v-model="pwInfo.loginpwd"
-              placeholder="请输入新密码"
-          ></Input>
+        <FormItem label="新密码" prop="loginpwd">
+          <Input v-model="pwInfo.loginpwd" placeholder="请输入新密码"></Input>
         </FormItem>
-        <FormItem
-            label="确认密码"
-            prop="loginpwd1"
-        >
+        <FormItem label="确认密码" prop="loginpwd1">
           <Input
-              v-model="pwInfo.loginpwd1"
-              placeholder="请输入确认密码"
+            v-model="pwInfo.loginpwd1"
+            placeholder="请输入确认密码"
           ></Input>
         </FormItem>
       </Form>
       <div
-          slot="footer"
-          style="
+        slot="footer"
+        style="
           display: flex;
           justify-content: space-between;
           align-items: center;
         </div>
         <div>
           <Button @click="pwInfo.show = false">取消</Button>
-          <Button @click="savepwInfo()" type="primary">保存</Button>
+          <Button @click="savepwInfo()" class="primary_btn" type="primary"
+            >保存</Button
+          >
+        </div>
+      </div>
+    </Modal>
+    <!-- 修改手机号 -->
+    <Modal
+      class="modal_view"
+      :mask-closable="false"
+      v-model="phoneInfo.show"
+      title="修改手机号"
+    >
+      <Form
+        v-if="phoneInfo.show"
+        ref="phoneInfo"
+        :model="phoneInfo"
+        :rules="rules"
+        :label-width="110"
+      >
+        <FormItem label="原手机号">
+          <div style="line-height: 36px">{{ phoneInfo.oldphone }}</div>
+        </FormItem>
+        <FormItem label="新手机号" prop="phone">
+          <Input v-model="phoneInfo.phone" placeholder="请输入新手机号"></Input>
+        </FormItem>
+        <FormItem label="短信验证码" prop="msgcode">
+          <Input
+            style="width: calc(100% - 102px)"
+            v-model="phoneInfo.msgcode"
+            placeholder="请输入短信验证码"
+          ></Input>
+          <div
+            :class="['code_btn', phoneInfo.second === 60 ? '' : 'disabled']"
+            @click="getMsgCode()"
+          >
+            {{
+              phoneInfo.second === 60 ? "获取验证码" : `${phoneInfo.second}s`
+            }}
+          </div>
+        </FormItem>
+      </Form>
+      <div
+        slot="footer"
+        style="
+          display: flex;
+          justify-content: space-between;
+          align-items: center;
+        "
+      >
+        <div style="color: #b50000">
+          注：更换手机号码之后，原来的手机号码将无法使用。
+        </div>
+        <div>
+          <Button @click="phoneInfo.show = false">取消</Button>
+          <Button @click="savephoneInfo()" class="primary_btn" type="primary"
+            >保存</Button
+          >
         </div>
       </div>
     </Modal>
 </template>
 
 <script>
-import {region_add} from "@/api/region";
-import {admin_detail, admin_edit_pwd} from "@/api/admin";
+import { admin_detail, admin_edit_phone, admin_edit_pwd } from "@/api/admin";
+import { login_msg_code } from "@/api/login";
 
 export default {
   data() {
       userDropdown: false,
       pwInfo: {
         show: false,
+        adminid: "",
+        loginpwd: "",
+        oldpwd: "",
+        rversion: ""
       },
       phoneInfo: {
-        show: false
+        show: false,
+        timer: null,
+        second: 60,
+        rversion: "",
+        adminid: "",
+        oldphone: "",
+        phone: "",
+        msgcode: ""
       },
       rules: {
         oldpwd: [
     }
   },
   methods: {
-    savepwInfo(){
-
+    // 获取短信验证码
+    getMsgCode() {
+      if (this.phoneInfo.second < 60) {
+        return;
+      }
+      // 手机号验证
+      if (!this.phoneInfo.phone) {
+        this.$Message.error("手机号码不能为空");
+        return;
+      }
+      let filter = /^[1][3,4,5,6,7,8,9][0-9]{9}$/;
+      if (!filter.test(this.phoneInfo.phone)) {
+        this.$Message.error("手机号码格式不正确");
+        return;
+      }
+      this.setRegionSecond();
+      login_msg_code({
+        phone: this.phoneInfo.phone
+      }).then((data) => {
+        if (data.code === 0) {
+          this.$Message.success(data.msg);
+        } else {
+          this.$Message.error(data.msg);
+        }
+      });
+    },
+    setRegionSecond() {
+      this.phoneInfo.second = 59;
+      this.phoneInfo.timer = setInterval(() => {
+        this.phoneInfo.second--;
+        if (this.phoneInfo.second <= 0) {
+          clearInterval(this.phoneInfo.timer);
+          this.phoneInfo.timer = null;
+          this.phoneInfo.second = 60;
+        }
+      }, 1000);
+    },
+    savephoneInfo() {
+      this.$refs.phoneInfo.validate((valid) => {
+        if (valid) {
+          this.showLoading = true;
+          admin_edit_phone({
+            adminid: this.userInfo.adminid,
+            phone: this.phoneInfo.phone,
+            msgcode: this.phoneInfo.msgcode,
+            rversion: this.phoneInfo.rversion
+          }).then((data) => {
+            this.showLoading = false;
+            if (data.code === 0) {
+              this.phoneInfo.show = false;
+              this.$Message.success(data.msg);
+            } else {
+              this.$Message.error(data.msg);
+            }
+          });
+        }
+      });
+    },
+    savepwInfo() {
       this.$refs.pwInfo.validate((valid) => {
         if (valid) {
-          console.log(this.pwInfo)
-          return
           this.showLoading = true;
           admin_edit_pwd({
-            adminid: this.pwInfo.adminid,
+            adminid: this.userInfo.adminid,
             loginpwd: this.pwInfo.loginpwd,
             oldpwd: this.pwInfo.oldpwd,
             rversion: this.pwInfo.rversion
-            }).then((data) => {
+          }).then((data) => {
             this.showLoading = false;
             if (data.code === 0) {
-              this.regionInfo.show = false;
+              this.pwInfo.show = false;
               this.$Message.success(data.msg);
             } else {
               this.$Message.error(data.msg);
         // 2修改密码 3更换手机号
         admin_detail({ adminid: this.userInfo.adminid }).then((res) => {
           if (res.code === 0) {
-            console.log(res.obj);
-            if(name === "2"){
-              this.pwInfo.show = true;
-              this.pwInfo.rversion = res.obj.rversion;
-            }else {
-              this.phoneInfo.show = true;
-              this.phoneInfo.rversion = res.obj.rversion;
+            if (name === "2") {
+              this.pwInfo = {
+                show: true,
+                rversion: res.obj.rversion,
+                adminid: "",
+                loginpwd: "",
+                oldpwd: ""
+              };
+            } else {
+              this.phoneInfo = {
+                show: true,
+                timer: null,
+                second: 60,
+                rversion: res.obj.rversion,
+                adminid: "",
+                oldphone: res.obj.phone,
+                phone: "",
+                msgcode: ""
+              };
             }
           } else {
             this.$Message.error(res.msg);
     overflow: auto;
   }
 }
+.code_btn {
+  display: inline-block;
+  margin-left: 10px;
+  width: 92px;
+  font-size: 14px;
+  text-align: center;
+  color: #339dff;
+  line-height: 30px;
+  border: 1px solid #339dff;
+  border-radius: 6px;
+  background-color: #fff;
+  cursor: pointer;
+  &.disabled {
+    color: #c5c8ce;
+    background-color: #f7f7f7;
+    border-color: #dcdee2;
+    cursor: not-allowed;
+  }
+}
+.modal_view {
+  .ivu-modal {
+    width: 520px;
+  }
+}
 </style>