From 0a5a0cd5de92f98f815c22c8ab0f914e2a30405c Mon Sep 17 00:00:00 2001
From: jiangzaicheng <jiangzaicheng_jzc@163.com>
Date: Mon, 4 Jul 2022 20:16:41 +0800
Subject: [PATCH] =?UTF-8?q?=E7=99=BB=E9=99=86=E7=95=8C=E9=9D=A2?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/common/Tatle.vue        |  43 +++
 src/main.ts                            |   9 +
 src/services/component-vue.service.ts  |  11 +
 src/views/authentication/LoginView.vue | 373 +++++++++----------------
 4 files changed, 196 insertions(+), 240 deletions(-)
 create mode 100644 src/components/common/Tatle.vue

diff --git a/src/components/common/Tatle.vue b/src/components/common/Tatle.vue
new file mode 100644
index 0000000..4aae6cf
--- /dev/null
+++ b/src/components/common/Tatle.vue
@@ -0,0 +1,43 @@
+<!--
+ * @Author: jiangzaicheng jiangzaicheng_jzc@163.com
+ * @Date: 2022-07-04 16:24:00
+ * @LastEditors: jiangzaicheng jiangzaicheng_jzc@163.com
+ * @LastEditTime: 2022-07-04 19:20:56
+ * @FilePath: \mcep-h5\src\components\common\Tatle.vue
+ * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
+-->
+<template>
+  <!-- <div> -->
+    <div  class ="d-tatle">
+     <van-row class="el-icon-arrow-down">
+       <van-col  span="9"><van-icon name="arrow-left" /></van-col>
+       <van-col  span="15">{{tatle}}</van-col>
+   </van-row> 
+  </div>
+</template>
+
+<script lang="ts">
+import { Component, Vue, Prop, Watch } from "vue-property-decorator";
+/*
+* title
+*/
+@Component({
+  name: "Tatle",
+})
+export default class Tatle extends Vue {
+    @Prop({ default: "" }) tatle: string | undefined
+}
+</script>
+<style scoped lang="scss">
+.van-col--9{
+  margin-top: 5%;
+}
+.van-col--15{
+  margin-top: 5%;
+}
+
+.d-tatle{
+  height: 50PX;
+  background: linear-gradient(90deg, rgba(118, 190, 250, 1) 0%, rgba(54, 114, 241, 1) 99%);
+}
+</style>
diff --git a/src/main.ts b/src/main.ts
index 89f36e8..41f8a15 100644
--- a/src/main.ts
+++ b/src/main.ts
@@ -1,3 +1,11 @@
+/*
+ * @Author: jiangzaicheng jiangzaicheng_jzc@163.com
+ * @Date: 2022-07-04 15:41:06
+ * @LastEditors: jiangzaicheng jiangzaicheng_jzc@163.com
+ * @LastEditTime: 2022-07-04 17:03:33
+ * @FilePath: \mcep-h5\src\main.ts
+ * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
+ */
 import Vue from "vue";
 import App from "./App.vue";
 import router from "./router";
@@ -22,6 +30,7 @@ import nativeService from "@/services/native.service";
 import { Step, Steps } from 'vant';
 import vueEsign from 'vue-esign';
 import Vconsole from 'vconsole';
+// import { VanComponent } from "vant/types/component"
 
 Vue.use(vueEsign)
 Vue.use(Step);
diff --git a/src/services/component-vue.service.ts b/src/services/component-vue.service.ts
index 824db49..0dbd52a 100644
--- a/src/services/component-vue.service.ts
+++ b/src/services/component-vue.service.ts
@@ -1,3 +1,11 @@
+/*
+ * @Author: jiangzaicheng jiangzaicheng_jzc@163.com
+ * @Date: 2022-07-04 15:41:06
+ * @LastEditors: jiangzaicheng jiangzaicheng_jzc@163.com
+ * @LastEditTime: 2022-07-04 17:42:48
+ * @FilePath: \mcep-h5\src\services\component-vue.service.ts
+ * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
+ */
 import Vue from "vue";
 import { Button, Cell, CellGroup, Icon, Col, Row, Popup, Toast, Form, Field, Checkbox, CheckboxGroup, RadioGroup, Radio, Search, Picker, DatetimePicker, Loading, Dialog, NavBar, Tab, Tabs, IndexBar, IndexAnchor, Switch, List, PullRefresh } from "vant";
 import TitleBar from "@/components/general/TitleBar.vue";
@@ -12,6 +20,8 @@ import TabNav from "@/components/general/TabNav.vue";
 import BaseList from "@/components/general/BaseList.vue";
 import AnchorNav from "@/components/general/AnchorNav.vue";
 import * as echarts from "echarts";
+import Tatle  from "@/components/common/Tatle.vue";
+import ant from "ant-design-vue/es/locale/zh_CN"
 
 declare module "vue/types/vue" {
   interface Vue {
@@ -76,6 +86,7 @@ class ComponentVueService {
     Vue.component("tab-nav", TabNav);
     Vue.component("base-list", BaseList);
     Vue.component("anchor-nav", AnchorNav);
+    Vue.component("tatle-bar", Tatle);
   }
 }
 const componentService = new ComponentVueService();
diff --git a/src/views/authentication/LoginView.vue b/src/views/authentication/LoginView.vue
index b0fbc65..e4a7542 100644
--- a/src/views/authentication/LoginView.vue
+++ b/src/views/authentication/LoginView.vue
@@ -1,254 +1,147 @@
+<!--
+ * @Author: jiangzaicheng jiangzaicheng_jzc@163.com
+ * @Date: 2022-07-04 15:41:06
+ * @LastEditors: jiangzaicheng jiangzaicheng_jzc@163.com
+ * @LastEditTime: 2022-07-04 20:14:28
+ * @FilePath: \mcep-h5\src\views\authentication\LoginView.vue
+ * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
+-->
 <template>
-  <div class="d-page d-flex flex-column">
-    <div class="d-logb">
-      <img src="../../assets/images/chengdu-bank-logo.png" alt=""/>
-      <div class="d-logb-wen">移动信贷展业平台</div>
-    </div>
-    <div class="d-login-box">
-      <!--      <div class="d-login-box-top">个贷系统</div>-->
-      <!--      <div class="d-login-box-top-r">→对公系统</div>-->
-      <van-form style="width: 25vw" @submit="onSubmit">
-        <van-field class="username" label-width="20px" v-model="username" name="username" placeholder="用户名"
-                   :rules="[{ required: true, message: '请填写用户名' }]">
-          <van-icon class="d-login-t1" name="manager" slot="label" props="center" size="25px"/>
-        </van-field>
-        <van-field class="password" label-width="20px" v-model="password" type="password" name="password"
-                   placeholder="密码" :rules="[{ required: true, message: '请填写密码' }]">
-          <van-icon class="d-login-t1" name="lock" slot="label" size="25px"/>
-        </van-field>
-        <div class="d-bottom">
-          <van-button round block type="info" class="d-login-box-bottom" native-type="submit">
-            <span class="d-login-text">登录</span>
-          </van-button>
-        </div>
-      </van-form>
-    </div>
+  <div class="loginform">
+    <div class="rarle"><tatle-bar :tatle="tatleName"></tatle-bar></div>
+  
+<div class="login">
+  <van-row class="el-icon-arrow-down" style="padding: 10% 0%;">
+       <van-col  span="24"><p class="polog"><span class="font-size-18-dhc" style="padding: 2% 0%;font-weight: 600;">登录</span> </p></van-col>
+       <van-col  span="24"><span class="font-size-12-dhc" style="font-weight: 400; font-family: 'Arial Normal', 'Arial';
+}">请使用手机号登录</span></van-col>
+   </van-row> 
+  <van-form @submit="onSubmit">
+  <div class="logindiv">
+     <span class="sopan">手机号</span>
+  <van-field
+    v-model="phone"
+    label="+86   |"
+    :border="true"
+    placeholder="请输入手机号" 
+  />
+  <van-divider />
+  </div>
+
+<div  class="logindiv">
+  <span class="sopan">密码</span>
+  <van-field
+    v-model="password"
+    type="password"
+     center
+  clearable
+  
+    placeholder="请填写密码"
+  />
+    <van-divider />
+</div> 
+
+ <span class="sopan">验证码</span>
+  <van-field
+  center
+  clearable
+  placeholder="请输入验证码"
+/>
+  <template #right-icon>   
+    <van-image :src="imageSrc" width="80" height="40" @click="_updatePicCode" />
+  </template>
+     <span class="sopan">短信验证码</span>
+  <div>
+
+      <van-row class="el-icon-arrow-down">
+       <van-col  span="16"><van-field
+  v-model="sms"
+  center
+  clearable
+  placeholder="请输入短信验证码"
+>    
+<van-divider />
+</van-field></van-col>
+       <van-col  span="8"><a href="javascript">获取短信验证码</a></van-col>
+   </van-row> 
+  
+ 
+ </div>
+  <div style="margin: 16px;">
+    <van-button square block type="info" native-type="submit">登录</van-button>
+  </div>
+  <!-- <van-row>
+  <van-col  span="12">忘记密码</van-col>
+  <van-col  span="12">用户注册</van-col>
+</van-row> -->
+</van-form>
+   </div>
   </div>
 </template>
 <script lang="ts">
   import {Component, Vue} from "vue-property-decorator";
-  import IF from "@/public/factory/InterFaceFactory";
-  import nettyApi from '@/constants/api/ms-netty/netty.api';
-  import {NativeUI} from "@/public/ts/NativeUI";
-  import systemApi from '@/constants/api/ms-system/system.api';
-  import DataDics from '@/services/dict.service.ts';
+import { Image as VanImage } from 'vant';
+
 
   @Component({
     name: "LoginView",
+    [VanImage.name]: VanImage,
   })
   export default class LoginView extends Vue {
-    // 用户名
-    username: string | undefined = "";
-    // 密码
-    password: string | undefined = "";
-
-    columns: any = []; //['个贷系统', '网贷系统', '信贷系统'],
-
-    menu: string = "";
-
-    mounted() {
-      //初始化数据字典
-      DataDics.init();
-    }
-
-    onSubmit(data: any) {
-      // this.$router.push({
-      //   path: "TYMHView",
-      //   params: {},
-      // });
-      // this.$router.push({
-      //   path: "/main",
-      //   params: {},
-      // });
-      this.authenticationLogin();
-    }
-
-    //统一认证登录
-    authenticationLogin() {
-      const param = {
-          tc: nettyApi.TRADE_CODE.authenticationLogin,
-          accountType: '1',
-          account: this.username,//liuwt
-          password: this.password,//dev@1234
-          // account: "liuwt",//liuwt
-          // password: "dev@1234",//dev@1234
-          sysCode: 'MT',
-          isAppList: '0',
-          authenType: '1',
-          isReturnToken: '0'
-        },
-        that = this;
-      NativeUI.showWaiting();
-      IF.transferDataInter(nettyApi.unifiedLogin, param).then((res: any) => {
-        NativeUI.closeWaiting();
-        console.log(res);
-        if (res.rc == '1') {
-          that.selectRoleInfo(res.userData)
-        } else {
-          NativeUI.toast(res.msg)
-        }
-      });
-    }
-
-    selectRoleInfo(userData: any) {
-      const parm = {
-        tc: "MCEP",
-        loginType: "1", //系统源 1-手机
-        // hrCode: "86M1909695", //对公人力资源代码  //个人人力资源代码77F9600649
-        hrCode: userData.hrEmployeeNo,
-        idNum: '', //身份证号
-      };
-      NativeUI.showWaiting();
-      IF.transferDataInter(systemApi.commonRq, parm).then((res: any) => {
-        NativeUI.closeWaiting();
-        console.log(parm);
-        console.log("登录返回");
-        console.log(res);
-        if (res.code == 1) {
-          //成功
-          /**
-           * 成功操作：
-           * 1、存储人力资源编号
-           * 2、跳转页面
-           * */
-          if (res.data.mobileSysUserInfo.sysRoleInfos != "") {
-            this.menu = res.data.mobileSysUserInfo.sysRoleInfos;
-            let roles = "";
-            for (let obj of res.data.mobileSysUserInfo.sysRoleInfos) {
-              this.columns.push(obj.roleSystmName);
-              roles += obj.roleId + ",";
-            }
-            sessionStorage.setItem("workcode", res.data.mobileSysUserInfo.hrCode);
-            // this.setUserInfo(res.data.mobileSysUserInfo);
-
-            const token = res.data.token;
-            for (const key in token) {
-              sessionStorage.setItem(key, token[key]);
-            }
-            sessionStorage.setItem("hrCode", userData.hrEmployeeNo);
-            sessionStorage.setItem("userName", res.data.mobileSysUserInfo.userName);
-            sessionStorage.setItem("ORGNAME", res.data.mobileSysUserInfo.coreName);
-            sessionStorage.setItem("roleNo", roles);
-          }
-          //TODO 获取接口返回的数据
-          sessionStorage.setItem("branchNo", res.data.mobileSysUserInfo.orgId);
-          this.$router.push({
-            name: "TYMHView",
-            params: {
-              systemList: res.data.mobileSysUserInfo.sysRoleInfos,
-              hrCode: userData.hrEmployeeNo
-            },
-          });
-        } else {
-          //失败
-          /**
-           * 失败操作：
-           * 1、失败吐司
-           * 2、清空数据
-           * */
-          sessionStorage.setItem("workcode", "");
-          sessionStorage.setItem("branchNo", "");
-          NativeUI.toast(res.msg);
-        }
-      });
-    }
+  tatleName="用户登录"
+  phone:string="" //电话
+  password:string=""//密码
+   imageSrc:string =""//图形
+   sms:string =""//短信
+   //获取图形验证码
+   _updatePicCode() {
+    //请求图形验证码
+    this.imageSrc = 'http://localhost:8080/users/sendPicCode?=' + Math.random();
+      //this.imageSrc = 'D:\GitClone\H5\mcep-h5\src\assets\images\ZYXTimg.png' + Math.random()
+  }
+    onSubmit(values:any) {
+       console.log('submit', values);
+   }
+created() {
+  this.$nextTick(() => this._updatePicCode())
+}
   }
 </script>
 <style lang="scss" scoped>
-  .d-login-box {
-    height: 64%;
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    font-size: 20px;
-  }
-
-  .d-login-box-top {
-    font-family: 思源黑体;
-    font-weight: bold;
-    font-size: 20px;
-    color: #333333;
-    margin-bottom: 30px;
-    float: left;
-  }
-
-  .d-login-t1 {
-    margin-top: 8px;
-  }
-
-  .d-login-box-top-r {
-    float: right;
-    line-height: 30px;
-    color: #808080;
-    font-size: 16px;
-  }
-
-  .d-login-box-bottom {
-    border: 0;
-    background: linear-gradient(270deg, rgba(255, 53, 65, 1) 1%, rgba(255, 141, 155, 1) 98%);
-    height: 48px;
-  }
-
-  .d-page {
-    background-image: url("../../assets/images/login-background.png");
-    background-repeat: no-repeat;
-    background-size: 100% 100%;
-    width: 100%;
-    height: 100%;
-  }
-
-  img {
-    width: 20%;
-    float: left;
-  }
-
-  .d-logb {
-    margin-left: 50px;
-    margin-top: 30px;
-    display: flex;
-    justify-content: flex-start;
-    align-items: flex-end;
-  }
-
-  .d-logb-wen {
-    float: left;
-    margin-top: 40px;
-    margin-left: 20px;
-    font-size: 18px;
-    color: #666666;
-  }
-
-  .username {
-    width: 100%;
-    height: 62px;
-    margin-bottom: 15px;
-    line-height: 42px;
-  }
-
-  .password {
-    width: 100%;
-    height: 62px;
-    margin-bottom: 35px;
-    line-height: 42px;
-  }
-
-  .u16_div {
-    width: 326px;
-    height: 135px;
-    background-color: white;
-    border: 1px solid rgb(204, 204, 204);
-    margin: 30px auto auto;
-    text-align: center;
-    padding-top: 10px;
-    color: #666666;
-  }
-
-  .u16_div_text {
-    margin-right: 60px;
-    color: black;
-  }
-
-  .d-login-text {
-    font-size: 20px;
-  }
+.loginform{
+  width: 100%;
+  height: 100%;
+}
+.logindiv{
+  line-height: 20px;
+}
+.van-button{
+  border-radius: 6px;
+}
+.polog{
+    margin: 0px;
+    text-rendering: optimizeLegibility;
+    font-feature-settings: "kern" 1;
+    -webkit-font-feature-settings: "kern";
+    -moz-font-feature-settings: "kern";
+    -moz-font-feature-settings: "kern=1";
+    font-kerning: normal;
+}
+
+     
+
+.van-col--15{
+  margin-top: 2%;
+}
+.van-col--24{
+   margin-left: 6%;
+}
+.sopan{
+ 
+  margin-top: 5px;
+  margin-left: 6%;
+}
+// .login{
+//   margin-top: 20%;
+// }
 </style>
-- 
2.22.0