feat：手机账号登录页面

src/main.js

@@ -15,6 +15,9 @@ Vue.prototype.$cof = cof;
 import hosts from "@/request/config";
 Vue.prototype.$hosts = hosts;
 
+import { goto } from '@/utils/myfun.js';
+Vue.prototype.goto = goto;
+
 //注册为全局组件 - 通告
 import noticeBar from "@/components/noticeBar";
 Vue.component('noticeBar', noticeBar);
@@ -24,4 +27,17 @@ App.mpType = 'app'
 const app = new Vue({
     ...App
 })
-app.$mount()
+app.$mount()
+
+Array.prototype.indexOf = function (val) {
+    for (var i = 0; i < this.length; i++) {
+        if (this[i] == val) return i;
+    }
+    return -1;
+};
+Array.prototype.remove = function (val) {
+    var index = this.indexOf(val);
+    if (index > -1) {
+        this.splice(index, 1);
+    }
+};

src/pages.json

@@ -23,6 +23,12 @@
 			"style":{
 				"navigationBarTitleText": "我的"
 			}
+		},
+		{
+			"path": "pages/my/login",
+			"style":{
+				"navigationBarTitleText": "登录"
+			}
 		}
 	],
 	"tabBar": {

src/pages/index/index.vue

@@ -39,7 +39,7 @@
           :duration="1000"
         >
           <swiper-item v-for="(item, index) in not_list" :key="index">
-            <text class="not_list nowrap">{{ item.contentTitle }}</text>
+            <text class="not_list ellipsis1">{{ item.contentTitle }}</text>
             <text class="not_ico iconfont">&#xe62e;</text>
           </swiper-item>
         </swiper>

src/pages/my/login.vue

@@ -0,0 +1,287 @@
+<template>
+  <view class="login">
+    <view class="HLogo">
+      <img src="@/static/img/ycjs.png" alt="" />
+      <p>欢迎登录一茶酒社</p>
+    </view>
+    <view class="phoneL" v-if="LoginType == 1">
+      <view class="clearfix"><input v-model="formD2.mobile" placeholder="请输入手机号" type="number" maxlength="11" /></view>
+      <view class="clearfix">
+        <input v-model="formD2.verifyCode" placeholder="请输入验证码" confirm-type="go" type="number" maxlength="4" class="w70" />
+        <view @click="getVerifyCode" :class="{w30:true,corb:msgNum!=='获取验证码'}">{{msgNum}}</view>
+      </view>
+    </view>
+    <view class="numberL" v-else>
+      <view class="clearfix">
+        <input placeholder="请输入账号" v-model="formD.username" />
+      </view>
+      <view class="clearfix">
+        <input placeholder="请输入密码" v-model="formD.password" password />
+      </view>
+      <view class="clearfix">
+        <input placeholder="请输入验证码" confirm-type="go" maxlength="4" class="w70" v-model="formD.verifyCode" />
+        <img :src="verifyimage" @click="changVerifyimage" class="w30 verifyImg" alt="" />
+      </view>
+    </view>
+    <view @click="login" :class="{bagBtn:true,corg:ISFill}">登录</view>
+    <view class="btnTxt" @click="LoginType = LoginType == 1 ? 0 : 1">
+      {{ LoginType == 1 ? "密码登录" : "验证码登录" }}
+    </view>
+  </view>
+</template>
+<script>
+import { get, post } from "@/request/api.js";
+export default {
+  name: "login",
+  data() {
+    return {
+      LoginType: 1,
+      timestamp: parseInt((new Date()) / 1),
+      formD: {
+        username: "",
+        password: "",
+        verifyCode: "",
+      },
+      formD2: {
+        mobile: '',
+        verifyCode: "",
+        nationCode: "86",
+      },
+      verifyimage: "",
+
+      msgNum: "获取验证码",
+
+      signKey: '',
+      messageId: "",
+
+      ISFill: false,
+    };
+  },
+  onLoad(option) {
+    this.changVerifyimage(); //获取图形验证码
+    this.getKey();
+  },
+  onLaunch() {},
+  onShow() {},
+  onHide() {},
+  methods: {
+    login() {
+      if (!this.ISFill) {
+        uni.showToast({
+          title: "登录信息填写有误哦",
+          duration: 2000,
+          icon: "none",
+        });
+        return
+      }
+      if (this.LoginType == 1) {
+        post("login/login/verifyCode.do?fd=3", {
+          params: {
+            ...this.formD2,
+            messageId: this.messageId
+          }
+        }).then((res) => {
+          if (res.resultCode == 1) {
+            this.getuserInfo();
+          }
+        });
+      } else {
+        post("login/login/password.do?fd=3", {
+          params: {
+            ...this.formD,
+            password: this.$md5(this.$md5(this.formD.password)),
+          },
+          timestamp: parseInt((new Date()) / 1000)
+        }).then((res) => {
+          if (res.resultCode == 1) {
+            this.getuserInfo();
+          } else {
+            if (res.errorMessage == "验证码不正确") this.changVerifyimage();
+          }
+        });
+      }
+    },
+    getuserInfo(){
+        post("srjywxservice/user2/myInfo.do").then((res) => {
+          if (res.resultCode == 1) {
+            uni.setStorageSync('userinfo', res.data.myInfo);
+            uni.setStorageSync('isvip', res.data.vip);
+            uni.navigateBack();
+          }
+        });
+    },
+    
+    changVerifyimage() {
+      let MathRandom = Math.random();
+      this.verifyimage = this.$hosts.Hhost + "login/login/verifyimage.do?random=" + MathRandom;
+    },
+    getKey() {
+      get("login/login/getKey.do").then(res => {
+        if (res.resultCode == 1) {
+          this.signKey = res.data.key
+        }
+      })
+    },
+    getVerifyCode() {
+      post("login/login/getVerifyCodeWithSign.do?fd=3", {
+        params: {
+          ...this.formD2,
+          randomStr: this.signKey,
+          timeStamp: this.timestamp,
+          sign: this.$md5(this.$md5("99D8EDED73FFCE0981E19D7CA1A58FF3" + this.signKey + this.timestamp)),
+        },
+        timestamp: this.timestamp
+      }).then((res) => {
+        if (res.resultCode == 1) {
+          this.messageId = res.data.messageId;
+          let number = 60;
+          let as = setInterval(() => {
+            this.msgNum = number + "s后重发"
+            number--;
+            if (number == 0) {
+              this.msgNum = "重发验证码"
+              clearTimeout(as);
+            }
+          }, 1000);
+        }
+      });
+    },
+    isPhone(s) {
+      return /^1[0-9]{10}$/.test(s)
+    },
+    FillIn() {
+      if (this.LoginType == 1) {
+        let m = this.formD2.mobile
+        let v = this.formD2.verifyCode
+        if (m && v && v.length == 4 && this.isPhone(m)) this.ISFill = true
+        else this.ISFill = false
+      } else {
+        let u = this.formD.username
+        let p = this.formD.password
+        let v = this.formD.verifyCode
+        if (u && p && v && v.length == 4) this.ISFill = true
+        else this.ISFill = false
+      }
+    }
+  },
+  computed: {},
+
+  watch: {
+    formD: {
+      deep: true,
+      handler(val) {
+        this.FillIn()
+      }
+    },
+    formD2: {
+      deep: true,
+      handler(val) {
+        this.FillIn()
+      }
+    },
+  },
+};
+</script>
+<style scoped lang='scss'>
+@font-face {
+  font-family: 'webfont'; //欢迎登录单仁教育 标题文字字体
+  font-display: swap;
+  src: url('//at.alicdn.com/t/webfont_8g34jazbwuj.eot'); /* IE9*/
+  src: url('//at.alicdn.com/t/webfont_8g34jazbwuj.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
+  url('//at.alicdn.com/t/webfont_8g34jazbwuj.woff2') format('woff2'),
+  url('//at.alicdn.com/t/webfont_8g34jazbwuj.woff') format('woff'), /* chrome、firefox */
+  url('//at.alicdn.com/t/webfont_8g34jazbwuj.ttf') format('truetype'), /* chrome、firefox、opera、Safari, Android, iOS 4.2+*/
+  url('//at.alicdn.com/t/webfont_8g34jazbwuj.svg#思源黑体-粗') format('svg'); /* iOS 4.1- */
+}
+.login {
+  text-align: center;
+
+  .HLogo {
+    padding-top: 80rpx;
+    margin-bottom: 60rpx;
+
+    img {
+      width: 120rpx;
+      height: 120rpx;
+      border-radius: 50%;
+      background: #ffffff;
+      border: 1px solid #e6e6e6;
+    }
+
+    P {
+      // font-weight: 500;
+      font-size: 40rpx;
+      margin-top: 16rpx;
+      font-family: "webfont" !important;
+    }
+  }
+
+  input {
+    width: 100%;
+    padding: 20rpx 0;
+    font-size: 32rpx;
+    text-align: left;
+  }
+
+  .phoneL,
+  .numberL {
+    padding: 0 40rpx;
+    margin-bottom: 80rpx;
+
+    .clearfix {
+      border-bottom: 1px solid #d9d9d9;
+      margin-bottom: 40rpx;
+
+      .w70 {
+        width: 70%;
+        float: left;
+      }
+
+      .w30 {
+        width: 30%;
+        float: right;
+        text-align: right;
+        padding: 22rpx 0;
+        color: #2e997f;
+      }
+
+      .verifyImg {
+        width: 162rpx;
+        height: 56rpx;
+        padding: 0;
+        margin: 14rpx 0;
+      }
+
+      &:last-child {
+        margin-bottom: 0;
+      }
+
+      .corb {
+        color: #999;
+      }
+    }
+  }
+
+  .bagBtn {
+    width: 620rpx;
+    height: 100rpx;
+    line-height: 100rpx;
+    text-align: center;
+    color: #fff;
+    font-size: 36rpx;
+    background: #cde9e3;
+    border-radius: 50rpx;
+    margin: 0 auto;
+
+    &.corg {
+      background: #58B8A1;
+    }
+  }
+
+  .btnTxt {
+    color: #2e997f;
+    font-size: 32rpx;
+    margin-top: 30rpx;
+  }
+}
+</style>

src/utils/myfun.js

@@ -78,4 +78,22 @@ export function phoneNumA(value) {
     return `${value.substring(0, 3)} ${"*".repeat(value.length - 7).replace(/(.{4})/g, "$1 ")}${value.length % 4 ? " " : ""}${value.slice(-4)}`;
   }
   return value;
+}
+
+//$goto
+export function goto(url, json) {
+  let params = "";
+  if(json){
+    params = [];
+    let da = Object.keys(json).map(function(key) {
+      if (json[key]) return encodeURIComponent(key) + "=" + encodeURIComponent(json[key]);
+    });
+    da.forEach(e => {
+      if (e) params.push(e)
+    });
+    params = params.join("&")
+  }
+  uni.navigateTo({
+    url: url + '?' + params
+  });
 }