From 8d262f8b45464d960053e1fa28631c7f81a9d784 Mon Sep 17 00:00:00 2001
From: Junling Bu <linlinjavaer@gmail.com>
Date: Sat, 20 Apr 2019 23:31:22 +0800
Subject: [PATCH] =?UTF-8?q?chore[litemall-vue]:=20=E7=AE=80=E5=8C=96?=
 =?UTF-8?q?=E7=99=BB=E5=BD=95=E7=BB=84=E4=BB=B6=EF=BC=8C=E5=90=8C=E6=97=B6?=
 =?UTF-8?q?=E6=B7=BB=E5=8A=A0=E6=B5=8B=E8=AF=95=E8=B4=A6=E5=8F=B7=E6=8F=90?=
 =?UTF-8?q?=E9=86=92=E4=BF=A1=E6=81=AF?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 litemall-vue/src/views/login/login-footer.vue |  18 --
 litemall-vue/src/views/login/login-header.vue |  29 ---
 .../src/views/login/login-request.vue         | 182 --------------
 litemall-vue/src/views/login/login.vue        | 229 +++++++++++++++---
 4 files changed, 200 insertions(+), 258 deletions(-)
 delete mode 100755 litemall-vue/src/views/login/login-footer.vue
 delete mode 100755 litemall-vue/src/views/login/login-header.vue
 delete mode 100755 litemall-vue/src/views/login/login-request.vue

diff --git a/litemall-vue/src/views/login/login-footer.vue b/litemall-vue/src/views/login/login-footer.vue
deleted file mode 100755
index 4cb7e6a6..00000000
--- a/litemall-vue/src/views/login/login-footer.vue
+++ /dev/null
@@ -1,18 +0,0 @@
-<template>
-  <div class="text-desc text-center bottom_positon">技术支持: litemall</div>
-</template>
-
-<script>
-export default {
-  name: 'login-footer'
-};
-</script>
-
-
-<style scoped>
-.bottom_positon {
-  position: absolute;
-  bottom: 30px;
-  width: 100%;
-}
-</style>
diff --git a/litemall-vue/src/views/login/login-header.vue b/litemall-vue/src/views/login/login-header.vue
deleted file mode 100755
index 6afdfd53..00000000
--- a/litemall-vue/src/views/login/login-header.vue
+++ /dev/null
@@ -1,29 +0,0 @@
-<template>
-	<div class="store_header">
-		<div class="store_avatar">
-			<img src="../../assets/images/avatar_default.png" alt="头像" width="55" height="55">
-		</div>
-		<div class="store_name">litemall-vue</div>
-	</div>
-</template>
-
-
-<script>
-export default {
-  name: 'login-header'
-};
-</script>
-
-<style lang="scss" scoped>
-.store_header {
-  text-align: center;
-  padding: 30px 0;
-  .store_avatar img {
-    border-radius: 50%;
-  }
-  .store_name {
-    padding-top: 5px;
-    font-size: 16px;
-  }
-}
-</style>
diff --git a/litemall-vue/src/views/login/login-request.vue b/litemall-vue/src/views/login/login-request.vue
deleted file mode 100755
index c418bb45..00000000
--- a/litemall-vue/src/views/login/login-request.vue
+++ /dev/null
@@ -1,182 +0,0 @@
-<template>
-  <div>
-    <md-field-group>
-      <md-field
-        v-model="account"
-        icon="username"
-        placeholder="随便输"
-        right-icon="clear-full"
-        v-validate="'required'"
-        name="user"
-        data-vv-as="帐号"
-        @right-click="clearText"
-      />
-
-      <md-field
-        v-model="password"
-        icon="lock"
-        placeholder="随便输"
-        :type="visiblePass ? 'text' : 'password'"
-        :right-icon="visiblePass ? 'eye-open' : 'eye-close'"
-        v-validate="'required'"
-        data-vv-as="密码"
-        name="password"
-        @right-click="visiblePass = !visiblePass"
-      />
-
-      <div class="clearfix">
-        <div class="float-r">
-          <router-link to="/login/forget">忘记密码</router-link>
-        </div>
-      </div>
-
-      <van-button size="large" type="danger" :loading="isLogining" @click="loginSubmit">登录</van-button>
-    </md-field-group>
-
-    <div class="register clearfix">
-      <div class="float-l connect">
-        <!-- <span @click="showKefu = true">联系客服</span> -->
-      </div>
-      <div class="float-r">
-        <router-link to="/login/registerGetCode">免费注册</router-link>
-      </div>
-    </div>
-
-    <van-popup v-model="showKefu">
-      <md-kefu mobile="16454193338"/>
-    </van-popup>
-  </div>
-</template>
-
-<script>
-import field from '@/vue/components/field/';
-import fieldGroup from '@/vue/components/field-group/';
-import md_kefu from '@/vue/components/md-kefu/';
-
-import { USER_LOGIN, USER_PROFILE } from '@/api/user';
-import { setLocalStorage } from 'core/utils/local-storage';
-import { emailReg, mobileReg } from '@/core/regexp';
-
-import { Popup, Toast } from 'vant';
-
-export default {
-  name: 'login-request',
-
-  data() {
-    return {
-      account: '',
-      password: '',
-      visiblePass: false,
-      showKefu: false,
-      isLogining: false,
-      userInfo: {}
-    };
-  },
-
-  methods: {
-    clearText() {
-      this.account = '';
-    },
-
-    async validate() {
-      const result = await this.$validator.validate();
-      if (!result) {
-        const errMsg = this.errors.items[0].msg;
-        Toast(errMsg);
-        throw new Error(`表单验证: ${errMsg}`);
-      }
-    },
-
-    async login() {
-      let loginData = this.getLoginData();
-      let { data } = await this.$reqPost(USER_LOGIN, loginData);
-      this.userInfo = data.data.userInfo;
-      console.log(this.userInfo);
-      setLocalStorage({
-        Authorization: data.data.token
-      });
-      this.getUserProfile();
-    },
-
-    async loginSubmit() {
-      this.isLogining = true;
-      try {
-        await this.validate();
-        await this.login();
-        this.isLogining = false;
-      } catch (err) {
-        console.log(err.message);
-        this.isLogining = false;
-      }
-    },
-
-    getUserProfile() {
-      // const {
-      //   data: { data }
-      // } = await this.$reqGet(USER_PROFILE);
-      setLocalStorage({
-        avatar: this.userInfo.avatarUrl,
-        // user_id: data.user_id,
-        // background_image: data.background_image,
-        nickName: this.userInfo.nickName
-      });
-
-      this.routerRedirect();
-    },
-
-    routerRedirect() {
-      // const { query } = this.$route;
-      // this.$router.replace({
-      //   name: query.redirect || 'home',
-      //   query: query
-      // });
-      window.location = '#/user/';
-    },
-
-    getLoginData() {
-      const password = this.password;
-      const username = this.getUserType(this.account);
-      return {
-        username: this.account,
-        password: password
-      };
-    },
-
-    getUserType(account) {
-      const accountType = mobileReg.test(account)
-        ? 'mobile'
-        : emailReg.test(account)
-        ? 'email'
-        : 'username';
-      return accountType;
-    }
-  },
-
-  components: {
-    [field.name]: field,
-    [fieldGroup.name]: fieldGroup,
-    [md_kefu.name]: md_kefu,
-    [Popup.name]: Popup
-  }
-};
-</script>
-
-<style lang="scss" scoped>
-@import '../../assets/scss/mixin';
-.register {
-  padding-top: 40px;
-  color: $font-color-gray;
-  a {
-    color: $font-color-gray;
-  }
-  > div {
-    width: 50%;
-    box-sizing: border-box;
-    padding: 0 20px;
-  }
-  .connect {
-    @include one-border(right);
-    text-align: right;
-  }
-}
-</style>
diff --git a/litemall-vue/src/views/login/login.vue b/litemall-vue/src/views/login/login.vue
index 2778bd2d..05a0e405 100755
--- a/litemall-vue/src/views/login/login.vue
+++ b/litemall-vue/src/views/login/login.vue
@@ -1,29 +1,200 @@
-<template>
-	<div class="login">
-		<login-header />
-		<login-request />
-		<login-footer />
-	</div>
-</template>
-
-<script>
-import loginHeader from './login-header';
-import loginRequest from './login-request';
-import loginFooter from './login-footer';
-
-export default {
-  components: {
-    [loginHeader.name]: loginHeader,
-    [loginRequest.name]: loginRequest,
-    [loginFooter.name]: loginFooter
-  }
-};
-</script>
-
-
-<style lang="scss" scoped>
-.login {
-  position: relative;
-  background-color: #fff;
-}
-</style>
+<template>
+	<div class="login">
+    	<div class="store_header">
+		<div class="store_avatar">
+			<img src="../../assets/images/avatar_default.png" alt="头像" width="55" height="55">
+		</div>
+		<div class="store_name">litemall-vue</div>
+	</div>
+
+    <md-field-group>
+      <md-field
+        v-model="account"
+        icon="username"
+        placeholder="请输入测试账号 user123"
+        right-icon="clear-full"
+        v-validate="'required'"
+        name="user"
+        data-vv-as="帐号"
+        @right-click="clearText"
+      />
+
+      <md-field
+        v-model="password"
+        icon="lock"
+        placeholder="请输入测试密码 user123"
+        :type="visiblePass ? 'text' : 'password'"
+        :right-icon="visiblePass ? 'eye-open' : 'eye-close'"
+        v-validate="'required'"
+        data-vv-as="密码"
+        name="password"
+        @right-click="visiblePass = !visiblePass"
+      />
+
+      <div class="clearfix">
+        <div class="float-l">
+          <router-link to="/login/registerGetCode">免费注册</router-link>
+        </div>
+        <div class="float-r">
+          <router-link to="/login/forget">忘记密码</router-link>
+        </div>
+      </div>
+
+      <van-button size="large" type="danger" :loading="isLogining" @click="loginSubmit">登录</van-button>
+    </md-field-group>
+
+
+      <div class="text-desc text-center bottom_positon">技术支持: litemall</div>
+
+	</div>
+</template>
+
+<script>
+import field from '@/vue/components/field/';
+import fieldGroup from '@/vue/components/field-group/';
+
+import { USER_LOGIN, USER_PROFILE } from '@/api/user';
+import { setLocalStorage } from 'core/utils/local-storage';
+import { emailReg, mobileReg } from '@/core/regexp';
+
+import { Toast } from 'vant';
+
+
+export default {
+  name: 'login-request',
+  components: {
+    [field.name]: field,
+    [fieldGroup.name]: fieldGroup,
+    Toast
+  },
+  data() {
+    return {
+      account: '',
+      password: '',
+      visiblePass: false,
+      isLogining: false,
+      userInfo: {}
+    };
+  },
+
+  methods: {
+    clearText() {
+      this.account = '';
+    },
+
+    async validate() {
+      const result = await this.$validator.validate();
+      if (!result) {
+        const errMsg = this.errors.items[0].msg;
+        Toast(errMsg);
+        throw new Error(`表单验证: ${errMsg}`);
+      }
+    },
+
+    async login() {
+      let loginData = this.getLoginData();
+      let { data } = await this.$reqPost(USER_LOGIN, loginData);
+      this.userInfo = data.data.userInfo;
+      console.log(this.userInfo);
+      setLocalStorage({
+        Authorization: data.data.token
+      });
+      this.getUserProfile();
+    },
+
+    async loginSubmit() {
+      this.isLogining = true;
+      try {
+        await this.validate();
+        await this.login();
+        this.isLogining = false;
+      } catch (err) {
+        console.log(err.message);
+        this.isLogining = false;
+      }
+    },
+
+    getUserProfile() {
+      // const {
+      //   data: { data }
+      // } = await this.$reqGet(USER_PROFILE);
+      setLocalStorage({
+        avatar: this.userInfo.avatarUrl,
+        // user_id: data.user_id,
+        // background_image: data.background_image,
+        nickName: this.userInfo.nickName
+      });
+
+      this.routerRedirect();
+    },
+
+    routerRedirect() {
+      // const { query } = this.$route;
+      // this.$router.replace({
+      //   name: query.redirect || 'home',
+      //   query: query
+      // });
+      window.location = '#/user/';
+    },
+
+    getLoginData() {
+      const password = this.password;
+      const username = this.getUserType(this.account);
+      return {
+        username: this.account,
+        password: password
+      };
+    },
+
+    getUserType(account) {
+      const accountType = mobileReg.test(account)
+        ? 'mobile'
+        : emailReg.test(account)
+        ? 'email'
+        : 'username';
+      return accountType;
+    }
+  }
+};
+</script>
+
+
+<style lang="scss" scoped>
+@import '../../assets/scss/mixin';
+.login {
+  position: relative;
+  background-color: #fff;
+}
+.store_header {
+  text-align: center;
+  padding: 30px 0;
+  .store_avatar img {
+    border-radius: 50%;
+  }
+  .store_name {
+    padding-top: 5px;
+    font-size: 16px;
+  }
+}
+.register {
+  padding-top: 40px;
+  color: $font-color-gray;
+  a {
+    color: $font-color-gray;
+  }
+  > div {
+    width: 50%;
+    box-sizing: border-box;
+    padding: 0 20px;
+  }
+  .connect {
+    @include one-border(right);
+    text-align: right;
+  }
+}
+.bottom_positon {
+  position: absolute;
+  bottom: 30px;
+  width: 100%;
+}
+</style>