Skip to content

M
mcep-h5
提交 cbb794b9 编写于 作者: jiangzaicheng's avatar jiangzaicheng
浏览文件
操作

首页

上级 89ceb47e
展开全部 隐藏空白字符变更
内嵌 并排
正在显示 包含 3087 行增加 和 4678 行删除
src/assets/css/vant-cover.scss
浏览文件 @ cbb794b9
/** vant样式覆写 */
.van-nav-bar__content {
height: 60px;
background-image: url("../images/tiileimg.png");
//TODO 更换图片
background: linear-gradient(0deg, rgba(172, 215, 255, 1) 0%, rgba(11, 84, 224, 1) 100%);
background-size: 100%;
//background: linear-gradient(270deg, rgba(229, 0, 18, 1) 1%, rgba(255, 87, 108, 1) 98%);
}
......
src/assets/iconfont/demo_index.html
浏览文件 @ cbb794b9
此差异已折叠。
src/assets/iconfont/iconfont.css
浏览文件 @ cbb794b9
此差异已折叠。
src/assets/iconfont/iconfont.js
浏览文件 @ cbb794b9
此差异已折叠。
src/assets/iconfont/iconfont.json
浏览文件 @ cbb794b9
此差异已折叠。
src/components/common/Bottom.vue 0 → 100644
浏览文件 @ cbb794b9
<!--
* @Author: jiangzaicheng jiangzaicheng_jzc@163.com
* @Date: 2022-07-07 16:13:13
* @LastEditors: jiangzaicheng jiangzaicheng_jzc@163.com
* @LastEditTime: 2022-07-07 20:43:56
* @FilePath: \mcep-h5\src\components\common\Bottom.vue
* @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
-->
<template>
<!-- <div> -->
<div class="d-bottom">
<van-tabbar style=" width：100%; ">
<van-tabbar-item v-for="(item, index) in tabbar" :key="index">
<div style="margin-top: 50%;" @click="btn(index)">
<svg class="icon" aria-hidden="true">
<use :xlink:href="item.img"></use>
</svg>
<p :class="item.flag ? 'approve-type-div-selected-df' : 'approve-type-div-df'">{{ item.name }}</p>
</div>
</van-tabbar-item>
</van-tabbar>
</div>
</template>
<script lang="ts">
import { Component, Vue, Prop, Watch, Emit } from "vue-property-decorator";
import MainViw from "@/views/main/MainView.vue";
/*
* title
*/
@Component({
name: "Bottom",
components: {
MainViw,
}
})
export default class Bottom extends Vue {
myBtnImage: any = "#icon-a-wode24x24px-kehujinglixiaochengxu";
onchangeImage: any = "#icon-a-shouye-xuanzhong20x20px";
btnFlag: any = true
pl = "pl";
tabbar: any = [
{
img: "#icon-a-shouye-xuanzhong20x20px",
name: "首页",
flag: true
},
{
img: "#icon-a-wode24x24px-kehujinglixiaochengxu",
name: "我的",
flag: false
}
];
btn(index: number) {
//alert(index);
if (index == 0) {//如果索引是0说明点击了首页
this.tabbar[1].img = "#icon-a-wode24x24px-kehujinglixiaochengxu";//将我的按钮置灰
this.tabbar[1].flag = "false";//将我的按钮置灰
this.tabbar[0].img = "#icon-a-shouye-xuanzhong20x20px";//将首页切换为蓝色
this.tabbar[0].flag = true;
this.tabbar[1].flag = false;
this.onchangebtn()
} else if (index == 1) {
this.tabbar[0].img = "#icon-a-shouye20x20px";//将首页置灰
this.tabbar[1].img = "#icon-a-wode-xuanzhong24x24px-kehujinglixiaochengxu";//将我的按钮直为蓝色
this.tabbar[0].flag = false;
this.tabbar[1].flag = true;
this.onchangebtn()
}
}
//传给父组件
onchangebtn() {
this.btnFlag=!this.btnFlag
this.$emit('onchangebtn', this.btnFlag);
}
}
</script>
<style scoped lang="scss">
.d-bottom {
width: 100%;
height: 100%;
border-width: 0px;
background: inherit;
background-color: rgba(255, 255, 255, 1);
border: none;
border-radius: 0px;
-moz-box-shadow: none;
-webkit-box-shadow: none;
box-shadow: none;
font-family: '微软雅黑 Bold', '微软雅黑 Regular', '微软雅黑', sans-serif;
font-weight: 700;
font-style: normal;
font-size: 12px;
line-height: 20px;
text-align: center;
}
.approve-type-div-selected-df {
color: cornflowerblue;
}
.approve-type-div-df {
color: #CCCCCC;
}
.pl {
width: 100%;
height: 100%;
font-family: 'FontAwesome', sans-serif;
font-weight: 400;
font-style: normal;
color: #CCCCCC;
line-height: 20px;
}
.icon {
width: 24px;
height: 24px;
}
</style>
src/components/common/Person.vue 0 → 100644
浏览文件 @ cbb794b9
<!--
* @Author: jiangzaicheng jiangzaicheng_jzc@163.com
* @Date: 2022-07-04 16:24:00
* @LastEditors: jiangzaicheng jiangzaicheng_jzc@163.com
* @LastEditTime: 2022-07-07 20:47:51
* @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 class="tool">
<van-row class="titleNo">
<van-col span="24" class="title">{{ title }}</van-col>
</van-row>
<van-row class="titleNo">
<van-col span="24" class="title">{{ title }}</van-col>
</van-row>
</div>
</template>
<script lang="ts">
import { Component, Vue, Prop, Watch } from "vue-property-decorator";
/*
* title
*/
@Component({
name: "Person",
})
export default class Person extends Vue {
@Prop({ default: "" }) title: string | undefined; // 页面标题
}
</script>
<style scoped lang="scss">
.tool {
height: 100%;
background: linear-gradient(0deg, rgba(172, 215, 255, 1) 0%, rgba(11, 84, 224, 1) 100%);
}
.title {
margin: 4% auto 5% 0%;
font-size: 18px;
color: #FFFFFF;
border-width: 0px;
white-space: nowrap;
text-transform: none;
width: 100%;
height: 100%;
text-align: center;
}
.icon{
width: 32px;
height: 32px;
}
.imglocal {
text-align: center;
font-size: 12px;
font-size: 12px;
color: #FFFFFF;
}
.img {
width: 40%;
}
</style>
src/components/common/Picket.vue
浏览文件 @ cbb794b9
......@@ -2,7 +2,7 @@
* @Author: jiangzaicheng jiangzaicheng_jzc@163.com
* @Date: 2022-07-04 16:24:00
* @LastEditors: jiangzaicheng jiangzaicheng_jzc@163.com
* @LastEditTime: 2022-07-05 16:49:10
* @LastEditTime: 2022-07-07 18:42:19
* @FilePath: \mcep-h5\src\components\common\Tatle.vue
* @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
-->
......@@ -11,20 +11,20 @@
<div class="d-tatle">
<div class="card">
<van-row>
<van-col span="24">{{ productname }}</van-col>
<van-col span="24" class="priductName">{{ productname }}</van-col>
</van-row>
<van-row>
<van-col span="24">{{ describe }}</van-col>
</van-row>
<van-row>
<van-col span="8">{{ limitrange }}</van-col>
<van-col span="8">{{ interestrate }}</van-col>
<van-col span="8">{{ loanterm }}</van-col>
<div class="describe" style="line-height: 30px;">
<div class="description">{{ describe }}</div>
</div>
<van-row type="flex" justify="center" style="line-height: 30px;font-weight: 700;">
<van-col span="8" class="limitrange" style="text-align: center;">{{ limitrange }}</van-col>
<van-col span="8" class="interestrate" style="text-align: center;">{{ interestrate }}</van-col>
<van-col span="8" class="loanterm" style="text-align: center;">{{ loanterm }}</van-col>
</van-row>
<van-row>
<van-col span="8">额度范围</van-col>
<van-col span="8">参考利率</van-col>
<van-col span="8">贷款期限</van-col>
<van-row type="flex" justify="center" style="line-height: 30px;color: #999999;font-weight: 400;font-size: 12px;">
<van-col span="8" class="loantermlot">额度范围</van-col>
<van-col span="8" class="loantermlot">参考利率</van-col>
<van-col span="8" class="loantermlot">贷款期限</van-col>
</van-row>
</div>
</div>
......@@ -48,7 +48,67 @@ export default class Picket extends Vue {
}
</script>
<style scoped lang="scss">
.card {
background: #ffff;
.card {
height: 130px;
width: 98%;
margin: 10px auto;
background: inherit;
background-color: rgba(255, 255, 255, 1);
border: none;
border-radius: 4px;
-moz-box-shadow: 0px 0px;
box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
}
.priductName{
font-size: 16px;
text-align: left;
//margin-left: 3%;
font-weight: 600;
margin: 2% 0% 2% 4%;
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;
}
// .describe{
// background: #eaf5ff;
// }
.description{
background: #eaf5ff;
font-size: 12px;
margin-left: 3%;
color: #1890FF;
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;
width: 50%;
border-radius: 4px;
text-align: center;
}
.limitrange{
// margin-left: 3%;
align-items: center;
font-family: 'Arial Negreta', 'Arial Normal', 'Arial', sans-serif;
font-weight: 700;
font-style: normal;
font-size: 20px;
color: #FF7628;
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--8 {
width: 32%;
}
.loantermlot{
text-align: center;
}
</style>
src/components/common/Tool.vue 0 → 100644
浏览文件 @ cbb794b9
<!--
* @Author: jiangzaicheng jiangzaicheng_jzc@163.com
* @Date: 2022-07-04 16:24:00
* @LastEditors: jiangzaicheng jiangzaicheng_jzc@163.com
* @LastEditTime: 2022-07-07 16:11:33
* @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 class="tool">
<van-row class="titleNo">
<van-col span="24" class="title">{{ title }}</van-col>
</van-row>
<van-row class="imgNo">
<van-col span="6" class="imglocal">
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-a-jifenshangcheng32x32px"></use>
</svg>
</van-col>
<van-col span="6" class="imglocal">
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-a-licaichanpin32x32px"></use>
</svg>
</van-col>
<van-col span="6" class="imglocal">
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-a-zizhudaikuan32x32px"></use>
</svg>
</van-col>
<van-col span="6" class="imglocal">
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-a-cunkuanlixishisuan32x32px"></use>
</svg>
</van-col>
</van-row>
<van-row class="imgNo">
<van-col span="6" class="imglocal">存款理想试算</van-col>
<van-col span="6" class="imglocal">理财产品 </van-col>
<van-col span="6" class="imglocal">自主贷款</van-col>
<van-col span="6" class="imglocal">积分商城</van-col>
</van-row>
</div>
</template>
<script lang="ts">
import { Component, Vue, Prop, Watch } from "vue-property-decorator";
/*
* title
*/
@Component({
name: "Tool",
})
export default class Tool extends Vue {
@Prop({ default: "" }) title: string | undefined; // 页面标题
}
</script>
<style scoped lang="scss">
.tool {
height: 100%;
background: linear-gradient(0deg, rgba(172, 215, 255, 1) 0%, rgba(11, 84, 224, 1) 100%);
}
.title {
margin: 4% auto 5% 0%;
font-size: 18px;
color: #FFFFFF;
border-width: 0px;
white-space: nowrap;
text-transform: none;
width: 100%;
height: 100%;
text-align: center;
}
.icon{
width: 32px;
height: 32px;
}
.imglocal {
text-align: center;
font-size: 12px;
font-size: 12px;
color: #FFFFFF;
}
.img {
width: 40%;
}
</style>
src/components/general/TitleBar.vue
浏览文件 @ cbb794b9
<template>
<div class="img">
<van-nav-bar :title="title" @click-left="onClickLeft" @click-right="onClickRight">
<template #left>
<slot name="left">
<van-icon name="arrow-left" size="20" />
</slot>
</template>
<template #right>
<slot name="right"> </slot>
</template>
111
<slot slot="cent" name="cent"> </slot>
</van-nav-bar>
</div>
</template>
<script lang="ts">
......@@ -45,12 +41,17 @@ export default class TitleBar extends Vue {
color: white;
}
}
.img{
background: linear-gradient(0deg, rgba(172, 215, 255, 1) 0%, rgba(11, 84, 224, 1) 100%);
}
::v-deep .van-nav-bar {
z-index: 999999 !important;
}
::v-deep .van-nav-bar__right {
color: white;
}
::v-deep .van-nav-bar__left .van-icon {
padding-top: 16px;
}
......
src/constants/api/login/login-mgt.api.ts
浏览文件 @ cbb794b9
/*
* @Author: jiangzaicheng jiangzaicheng_jzc@163.com
* @Date: 2022-07-05 14:56:29
* @LastEditors: jiangzaicheng jiangzaicheng_jzc@163.com
* @LastEditTime: 2022-07-06 15:09:50
* @FilePath: \mcep-h5\src\constants\api\login\login-mgt.api.ts
* @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
*/
import { MethodType } from "@/constants/enum/general/method-type.enum";
import { HeaderType } from "@/constants/enum/general/header-type.enum";
const prefix = "http://10.2.3.118:9165/online-financial-service/api/v1/cust-info"
const prefix = "http://10.2.3.118:9165/online-financial-service/api/v1/cust-info/permit_endpoint"
const loginApi = {
updatePicCode: {
url: prefix + "/kaptcha",
method: MethodType.GET.code,
method: MethodType.POST.code,
header: HeaderType.AUTH.code,
},
loginSystem: {
url: prefix + "/login",
method: MethodType.POST.code,
header: HeaderType.AUTH.code,
},
};
......
src/constants/api/login/regist-mgt.api.ts 0 → 100644
浏览文件 @ cbb794b9
/*
* @Author: jiangzaicheng jiangzaicheng_jzc@163.com
* @Date: 2022-07-05 14:56:29
* @LastEditors: jiangzaicheng jiangzaicheng_jzc@163.com
* @LastEditTime: 2022-07-06 14:53:22
* @FilePath: \mcep-h5\src\constants\api\login\login-mgt.api.ts
* @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
*/
import { MethodType } from "@/constants/enum/general/method-type.enum";
import { HeaderType } from "@/constants/enum/general/header-type.enum";
const prefix = "http://10.2.3.118:9165/online-financial-service/api/v1/cust-info/permit_endpoint"
const registApi = {
registSystem: {
url: prefix + "/register",
method: MethodType.POST.code,
header: HeaderType.AUTH.code,
},
};
export default registApi;
src/main.ts
浏览文件 @ cbb794b9
......@@ -2,7 +2,7 @@
* @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
* @LastEditTime: 2022-07-06 18:25:11
* @FilePath: \mcep-h5\src\main.ts
* @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
*/
......@@ -30,9 +30,10 @@ import nativeService from "@/services/native.service";
import { Step, Steps } from 'vant';
import vueEsign from 'vue-esign';
import Vconsole from 'vconsole';
import Vant from 'vant';
// import { VanComponent } from "vant/types/component"
Vue.use(vueEsign)
Vue.use(Vant);
Vue.use(vueEsign);
Vue.use(Step);
Vue.use(Steps);
......
src/services/api.service.ts
浏览文件 @ cbb794b9
......@@ -166,15 +166,18 @@ class ApiService {
return requestConfigBase;
}
get(path: string, query: Query | undefined, requestConfig: AxiosRequestConfig): any {
debugger
path = query != null || query != undefined ? this.urlQueryConvert(path, query) : path;
path = query != null ? this.urlQueryConvert(path, query) : path;
return Vue.axios.get(`${path}`, requestConfig).then(this.createBusCodeHandler(query)).catch(this.createErrorHandler());
}
post(path: string, params: any, query: Query | undefined, requestConfig: AxiosRequestConfig): any {
path = query != null ? this.urlQueryConvert(path, query) : path;
console.log("服务调用--" + path);
return Vue.axios.post(`${path}`, params, requestConfig).then(this.createBusCodeHandler(params)).catch(this.createErrorHandler());
return Vue.axios.post(`${path}`, params, requestConfig).then(res=>{
//TODO
return res.data
});
}
/**
* POST请求 文件上传
......@@ -208,7 +211,7 @@ class ApiService {
general(api: any, query?: Query | undefined, params?: any | undefined, requestConfig?: AxiosRequestConfig | any): any {
if (!!api.url && !!api.method) {
if (requestConfig == null) {
debugger
switch (api.header) {
case HeaderType.BASE.code:
requestConfig = this.createBasicHeaders();
......@@ -265,7 +268,7 @@ class ApiService {
* 服务返回统一解密处理
*/
createBusCodeHandler(params?: any) {
debugger
return function(response: any) {
if (response.status === 200) {
let data = response.data;
......@@ -312,7 +315,7 @@ class ApiService {
} else if (data.code == 1) {
console.log(data);
//成功
data = data.data;
// data = data.data;
if (typeof data != 'object') data = JSON.parse(data);
data = data.sm4key ? SMUtil.decodeData(data) : data;
if (typeof data != 'object') {
......@@ -399,7 +402,7 @@ class ApiService {
/**
* @description: json格式转表单格式
* @author ChenRui
* @date 2020/8/28 15:20
*/
jsonToFormData(params: any) {
......
src/services/component-vue.service.ts
浏览文件 @ cbb794b9
......@@ -2,7 +2,7 @@
* @Author: jiangzaicheng jiangzaicheng_jzc@163.com
* @Date: 2022-07-04 15:41:06
* @LastEditors: jiangzaicheng jiangzaicheng_jzc@163.com
* @LastEditTime: 2022-07-05 16:50:04
* @LastEditTime: 2022-07-07 16:21:43
* @FilePath: \mcep-h5\src\services\component-vue.service.ts
* @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
*/
......@@ -23,6 +23,8 @@ import * as echarts from "echarts";
import Tatle from "@/components/common/Tatle.vue";
import picket from "@/components/common/Picket.vue";
import ant from "ant-design-vue/es/locale/zh_CN"
import Tool from "@/components/common/Tool.vue";
import Bottom from "@/components/common/Bottom.vue";
declare module "vue/types/vue" {
......@@ -89,7 +91,10 @@ class ComponentVueService {
Vue.component("base-list", BaseList);
Vue.component("anchor-nav", AnchorNav);
Vue.component("tatle-bar", Tatle);
Vue.component("picket-bar", picket);
Vue.component("picket-bar", picket);Tool
Vue.component("tools-bar", Tool);
Vue.component("bottom-bar", Bottom);
}
}
const componentService = new ComponentVueService();
......
src/views/MyView/MyPage.vue 0 → 100644
浏览文件 @ cbb794b9
<!--
* @Author: jiangzaicheng jiangzaicheng_jzc@163.com
* @Date: 2022-07-05 14:05:30
* @LastEditors: jiangzaicheng jiangzaicheng_jzc@163.com
* @LastEditTime: 2022-07-07 19:00:04
* @FilePath: \mcep-h5\src\views\main\MainView.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" style=" background-color: #ebedf0">
<div>我的页面</div>
</div>
</template>
<script lang="ts">
import { Component, Vue } from "vue-property-decorator";
import { ProductData } from '@/model/entity/ProductData'
@Component({
name: "MyPage",
})
export default class MyPage extends Vue {
tatleName = "我的"
}
</script>
<style scoped lang="scss">
</style>
src/views/authentication/LoginView.vue
浏览文件 @ cbb794b9
......@@ -2,7 +2,7 @@
* @Author: jiangzaicheng jiangzaicheng_jzc@163.com
* @Date: 2022-07-04 15:41:06
* @LastEditors: jiangzaicheng jiangzaicheng_jzc@163.com
* @LastEditTime: 2022-07-05 17:11:01
* @LastEditTime: 2022-07-06 15:57:44
* @FilePath: \mcep-h5\src\views\authentication\LoginView.vue
* @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
-->
......@@ -20,40 +20,43 @@
<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">
<van-form>
<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 class="logindiv"> -->
<span class="sopan">密码</span>
<van-field v-model="password" type="password" center clearable placeholder="请填写密码" />
<!-- <van-divider /> -->
<!-- </div> -->
<div class="d-flex ">
<div class="p-2 mr-auto ">
<span class="sopan">验证码</span>
<van-field center clearable v-model="imageSrcValue" placeholder="请输入验证码" />
</div>
<div class="p-2 ">
<img :src="imageSrc" style="max-width: 100px; max-height: 200px;" @click="_updatePicCode()" />
</div>
</div>
<span class="sopan">验证码</span>
<van-field center clearable placeholder="请输入验证码" />
<template #right-icon>
<van-image :src="imageSrc" width="80" height="40" />
</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>
<!-- <template >
<img :src="imageSrc" style="max-width: 100px; max-height: 200px;" />
</template> -->
</div>
<span class="sopan">短信验证码</span>
<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 style="color:#3672F1" @click="changeCmstotal()">{{ getCmstotal }}</a></van-col>
</van-row>
<div style="margin: 16px;">
<van-button square block type="info" native-type="submit">登录</van-button>
<van-button square block type="info" native-type="submit" @click="loginSystem()">登录</van-button>
</div>
</van-form>
<!-- <div>
......@@ -64,9 +67,9 @@
</van-row>
</div> -->
<div class="d-flex " style="padding: 0px 10px 0px 10px;color: #3672F1;">
<div class="p-2 mr-auto "><a class="font-size-12-dhc" @click="forgetspass()"> 忘记密码</a></div>
<div class="p-2 "><a class="font-size-12-dhc" @click="regeist()"> 用户注册</a></div>
<div class="p-2 "><a class="font-size-12-dhc" @click="demo()"> demo测试</a></div>
<div class="p-2 mr-auto "><a class="font-size-12-dhc" @click="forgetspass()"> 忘记密码</a></div>
<div class="p-2 "><a class="font-size-12-dhc" @click="regeist()"> 用户注册</a></div>
<div class="p-2 "><a class="font-size-12-dhc" @click="demo()"> demo测试</a></div>
</div>
</div>
</div>
......@@ -78,6 +81,8 @@ import apiService from "@/services/api.service";
import loginApi from "@/constants/api/login/login-mgt.api";
import { Code } from "@/constants/enum/general/code.enum";
import { RestfulResponse } from "@/model/domain/RestfulResponse";
import { log } from "mathjs";
import { sys } from "typescript";
@Component({
......@@ -85,48 +90,90 @@ import { RestfulResponse } from "@/model/domain/RestfulResponse";
[VanImage.name]: VanImage,
})
export default class LoginView extends Vue {
tatleName = "用户登录"
phone: string = "" //电话
password: string = ""//密码
imageSrc: string = ""//图形
sms: string = ""//短信
getCmstotal = "获取短信验证码";
tatleName = "用户登录";
phone: string = "";//电话
password: string = "";//密码
imageSrc: any = "";//图形
imageSrcValue: string = "";//图形验证码
sms: string = "";//短信验证
timer: any = "";//定时器
time: number = 60;//计数
//获取图形验证码
_updatePicCode() {
//请求图形验证码
apiService.general(loginApi.updatePicCode,undefined).then((response: RestfulResponse) => {
apiService.general(loginApi.updatePicCode, undefined, undefined, undefined).then((response: RestfulResponse) => {
console.log(response);
if (response.code == Code.SUCCESS.code) {
this.imageSrc = 'data:image/png;base64';
return response.data;
this.imageSrc = 'data:image/png;base64,' + response.data.replace(/[\r\n]/g, "");
console.log(this.imageSrc);
}
});
}
onSubmit(values: any) {
console.log('submit', values);
//计时器
changeCmstotal() {
this.getCmstotal = this.time + "s重发验证码";
this.timer = setInterval(() => {
this.time--;
this.getCmstotal = this.time + "s重发验证码";
if (this.time < 0) {
clearInterval(this.time)
this.getCmstotal = "获取短信验证码";
}
}, 1000)
}
loginSystem() {
//TODO
//登录失败刷新
//验证码失败刷新
//this._updatePicCode();
let param={
phone:this.phone,
//图形验证码
imgVerifyCode:this.imageSrcValue,
//渠道
loginType:"3",
//手机验证码
phoneVerifyCode:this.sms,
//密码
credential:this.password
}
apiService.general(loginApi.loginSystem, undefined, param, undefined).then((response: RestfulResponse) => {
console.log(response);
if (response.code == Code.SUCCESS.code) {
this.$router.push({
name: `Mianview`,
params: {
data: response.data
}
})
}else{
this._updatePicCode();
}
});
}
created() {
this._updatePicCode()
this._updatePicCode()
}
//忘记密码
forgetspass(){
this.$router.push({
name: `ForgetPass`,
params: {
forgetspass() {
this.$router.push({
name: `ForgetPass`,
params: {
phone: this.phone
}
});
}
regeist(){
this.$router.push({
path: `Register`,
})
regeist() {
this.$router.push({
path: `Register`,
})
}
demo(){
demo() {
this.$router.push({
path: `Mianview`,
})
path: `Mianview`,
})
}
}
</script>
......
src/views/login/Register.vue
浏览文件 @ cbb794b9
......@@ -2,7 +2,7 @@
* @Author: jiangzaicheng jiangzaicheng_jzc@163.com
* @Date: 2022-07-04 15:41:06
* @LastEditors: jiangzaicheng jiangzaicheng_jzc@163.com
* @LastEditTime: 2022-07-05 11:33:44
* @LastEditTime: 2022-07-06 15:10:12
* @FilePath: \mcep-h5\src\views\authentication\LoginView.vue
* @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
-->
......@@ -20,7 +20,7 @@
<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">
<van-form>
<div class="logindiv">
<span class="sopan">手机号码</span>
<van-field v-model="phone" label="+86 |" :border="true" placeholder="请输入手机号" />
......@@ -53,53 +53,70 @@
</div>
<div style="margin: 16px;">
<van-button square block type="info" native-type="submit">注册</van-button>
<van-button square block type="info" native-type="submit" @click="registSystem()">注册</van-button>
</div>
</van-form>
<!-- <van-radio name="1" shape="square" v-model ="radio" @click="returen()">
<!-- <van-radio name="1" shape="square" v-model ="radio" @click="returen()">
<span>本人已阅读<a href="javascpt">《线上金融服务平台注册服务协议》</a></span>
</van-radio> -->
<div>
<van-checkbox v-model="checked" shape="square" style="padding:0% 4%;">
<span>本人已阅读<a href="javascpt">《线上金融服务平台注册服务协议》</a></span>
</van-checkbox>
</div>
<div>
<van-checkbox v-model="checked" shape="square" style="padding:0% 4%;">
<span>本人已阅读<a href="javascpt">《线上金融服务平台注册服务协议》</a></span>
</van-checkbox>
</div>
</div>
</div>
</template>
<script lang="ts">
import { Component, Vue } from "vue-property-decorator";
import { Image as VanImage } from 'vant';
import apiService from "@/services/api.service";
import { Code } from "@/constants/enum/general/code.enum";
import { RestfulResponse } from "@/model/domain/RestfulResponse";
import registApi from "@/constants/api/login/regist-mgt.api";
@Component({
name: "ForgetPassView",
[VanImage.name]: VanImage,
})
export default class ForgetPassView extends Vue {
tatleName = "密码重置"
phone: string = "" //电话
password: string = ""//密码
restpassword: string = ""//确认密码
imageSrc: string = ""//图形
sms: string = ""//短信
// radio: boolean = false
radio:string="0"
// radio: boolean = false
radio: string = "0"
checked: boolean = false;
//获取图形验证码
_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);
registSystem() {
if (this.password === this.restpassword && this.checked) {
let param = {
phone: this.phone,
//短信验证码TODO
//phoneVerifyCode: "",
//数字渠道
method:"3",
pwd: this.password
}
apiService.general(registApi.registSystem, undefined, param, undefined).then((response: RestfulResponse) => {
console.log(response);
if (response.code == Code.SUCCESS.code) {
this.$router.push({
name: `Mianview`,
params: {
data: response.data
}
})
}
});
}
}
created() {
this.$nextTick(() => this._updatePicCode())
}
returen() {
}
}
......
src/views/main/Main.vue 0 → 100644
浏览文件 @ cbb794b9
<!--
* @Author: jiangzaicheng jiangzaicheng_jzc@163.com
* @Date: 2022-07-05 14:05:30
* @LastEditors: jiangzaicheng jiangzaicheng_jzc@163.com
* @LastEditTime: 2022-07-07 20:21:56
* @FilePath: \mcep-h5\src\views\main\MainView.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" style=" background-color: #ebedf0">
<div class="rarle">
<tools-bar :title="tatleName" style="width:100%;height: calc(25vh);">
</tools-bar>
</div>
<div class="roolsolt">
<van-row class="roll" background="#ecf9ff" style="background: #ecf9ff;width: 90%;height: 34px;margin: 2% auto; border-radius: 10px;position: absolute; top: 21%;
left: 5%;">
<van-col span="5" class="titleName"
style="height: 34px;margin: 7px auto 0px 8px; border-radius: 12px; color: #a2d2f4;">
审批进度
</van-col>
<van-col span="18" class="notice">
<van-notice-bar left-icon="volume-o" color="#1989fa" background="#ecf9ff"
style="height: 34px; border-radius: 12px;">
{{ notice }}
</van-notice-bar>
</van-col>
</van-row>
</div>
<div style="background-color: #ffff;height: 18%;">
<div class="prudect">
<span style="font-size: 18px;font-weight: 600;margin-left: 4%;">推荐产品</span>
</div>
<div>
<!-- <van-tabs v-model="activeName">
<van-tab title="综合排序" name="a"></van-tab>
<van-tab title="金额" name="b"></van-tab>
<van-tab title="期限" name="c"></van-tab>
<van-tab title="利率" name="d"></van-tab>
</van-tabs> -->
<van-dropdown-menu>
<van-dropdown-item title="综合排序" ref="item">
<van-cell center title="包邮">
<template #right-icon>
<van-switch size="24" active-color="#ee0a24" />
</template>
</van-cell>
<van-cell center title="团购">
<template #right-icon>
<van-switch size="24" active-color="#ee0a24" />
</template>
</van-cell>
<div style="padding: 5px 16px;">
<van-button type="danger" block >
确认
</van-button>
</div>
</van-dropdown-item>
<van-dropdown-item title="金额" ref="item">
<van-cell center title="包邮">
<template #right-icon>
<van-switch size="24" active-color="#ee0a24" />
</template>
</van-cell>
<van-cell center title="团购">
<template #right-icon>
<van-switch size="24" active-color="#ee0a24" />
</template>
</van-cell>
<div style="padding: 5px 16px;">
<van-button type="danger" block round >
确认
</van-button>
</div>
</van-dropdown-item>
<van-dropdown-item title="期限" ref="item">
<van-cell center title="包邮">
<template #right-icon>
<van-switch size="24" active-color="#ee0a24" />
</template>
</van-cell>
<van-cell center title="团购">
<template #right-icon>
<van-switch size="24" active-color="#ee0a24" />
</template>
</van-cell>
<div style="padding: 5px 16px;">
<van-button type="danger" block round >
确认
</van-button>
</div>
</van-dropdown-item>
<van-dropdown-item title="利率" ref="item">
<van-cell center title="包邮">
<template #right-icon>
<van-switch size="24" active-color="#ee0a24" />
</template>
</van-cell>
<van-cell center title="团购">
<template #right-icon>
<van-switch size="24" active-color="#ee0a24" />
</template>
</van-cell>
<div style="padding: 5px 16px;">
<van-button type="danger" block round >
确认
</van-button>
</div>
</van-dropdown-item>
</van-dropdown-menu>
</div>
<scroller-view v-calculate-height >
<div v-for="(item, index) in productList" :key="index">
<picket-bar :productname="item.productname" :describe="item.describe" :limitrange="item.limitrange"
:interestrate="item.interestrate" :loanterm="item.loanterm"></picket-bar>
</div>
</scroller-view>
</div>
</div>
</template>
<script lang="ts">
import { Component, Vue } from "vue-property-decorator";
import { ProductData } from '@/model/entity/ProductData'
@Component({
name: "Main",
})
export default class Main extends Vue {
tatleName = "线上金融服务平台"
notice = "在代码阅读过程中人们说脏话的频率是衡量代码质量的唯一标准。"
productList: ProductData[] = [{
productname: "金融消费贷", //产品名称
describe: "1年100万",//描述
limitrange: "1000~2000",//额度范围
interestrate: "19%~20%",//利率
loanterm: "89个月",//贷款期限
},
{
productname: "金融消费贷", //产品名称
describe: "1年100万三年内还清了",//描述
limitrange: "1000~2000",//额度范围
interestrate: "19%~20%",//利率
loanterm: "89个月",//贷款期限
}];
activeName: string = "a"
}
</script>
<style scoped lang="scss">
.roll {
background: #ecf9ff;
}
.titleName {
float: inline-end;
height: 34px;
margin: 7px auto 0px 8px;
border-radius: 12px;
color: #a2d2f4;
}
.prudect {
line-height: 100%;
margin-top: 40px;
margin-bottom: 10px;
}
</style>
src/views/main/MainView.vue
浏览文件 @ cbb794b9
......@@ -2,54 +2,61 @@
* @Author: jiangzaicheng jiangzaicheng_jzc@163.com
* @Date: 2022-07-05 14:05:30
* @LastEditors: jiangzaicheng jiangzaicheng_jzc@163.com
* @LastEditTime: 2022-07-05 17:51:30
* @LastEditTime: 2022-07-07 20:43:35
* @FilePath: \mcep-h5\src\views\main\MainView.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="rarle">
<tatle-bar :tatle="tatleName" :tatleflag="false"></tatle-bar>
</div>
<div>
<van-tabs v-model="activeName">
<van-tab title="标签 1" name="a">内容 1</van-tab>
<van-tab title="标签 2" name="b">内容 2</van-tab>
<van-tab title="标签 3" name="c">内容 3</van-tab>
</van-tabs>
<div v-for="(item, index) in productList" :key="index">
<picket-bar :productname="item.productname" :describe="item.describe" :limitrange="item.limitrange"
:interestrate="item.interestrate" :loanterm="item.loanterm"></picket-bar>
</div>
<div class="d-page d-flex flex-column" style=" background-color: #ebedf0">
<Main v-if="showFlag"></Main>
<MyPage v-if="!showFlag"></MyPage>
<div class="boottom">
<bottom-bar @onchangebtn="onchangebtn" ></bottom-bar>
</div>
</div>
</template>
<script lang="ts">
import { Component, Vue } from "vue-property-decorator";
import { ProductData } from '@/model/entity/ProductData'
import Main from "./Main.vue";
import MyPage from "../MyView/MyPage.vue";
@Component({
name: "MainView",
components: {
Main,
MyPage
}
})
export default class MainViw extends Vue {
tatleName = "线上金融服务平台"
productList: ProductData[] = [{
productname: "金融消费贷", //产品名称
describe: "1年100万",//描述
limitrange: "1000~2000",//额度范围
interestrate: "199000%~10000000%",//利率
loanterm: "89个月",//贷款期限
},
{
productname: "金融消费贷", //产品名称
describe: "1年100万",//描述
limitrange: "1000~2000",//额度范围
interestrate: "199000%~10000000%",//利率
loanterm: "89个月",//贷款期限
}];
activeName: string = "a"
export default class MainView extends Vue {
showFlag :boolean = true;
onchangebtn(value:any){
//子组件传来的值
this.showFlag=value
}
}
</script>
<style scoped lang="scss">
.roll {
background: #ecf9ff;
}
.titleName {
float: inline-end;
height: 34px;
margin: 7px auto 0px 8px;
border-radius: 12px;
color: #a2d2f4;
}
.prudect {
line-height: 100%;
margin-top: 40px;
margin-bottom: 10px;
}
.boottom{
}
</style>
Markdown 格式
0% or
您添加了 0 人 到此讨论。请谨慎行事。
先完成此消息的编辑！
想要评论请 注册 或