Commit c14133b9 by fanx
2 parents 44838cff 2525bd46
<template> <template>
<div class="list"> <div class="list">
<NafmHeader title="业务开展列表" /> <NafmHeader navClass="nafmii-head-bg3" title="业务开展列表" />
<van-list v-model="loading" :finished="finished" finished-text="没有更多了" @load="onLoad"> <van-list v-model="loading" :finished="finished" finished-text="没有更多了" @load="onLoad">
<van-cell v-for="item in businessList" :key="item"> <van-cell v-for="item in businessList" :key="item">
<div slot="title" class="title">{{item.title}}</div> <div slot="title" class="title">{{item.title}}</div>
<p slot="label" class="info"> <p slot="label" class="info">
<span class="update_time"> <span class="update_time">
<van-icon name="underway-o" /> <van-icon :name="timeIcon" />
更新日期:{{item.update_time}} 更新日期:{{item.update_time}}
</span> </span>
<span class="org">{{item.org}}</span> <span class="org">{{item.org}}</span>
...@@ -30,6 +30,7 @@ export default { ...@@ -30,6 +30,7 @@ export default {
}], }],
loading: false, loading: false,
finished: false, finished: false,
timeIcon: require('@/assets/icon/time_update.png')
} }
}, },
methods: { methods: {
...@@ -52,6 +53,14 @@ export default { ...@@ -52,6 +53,14 @@ export default {
font-size: 12px; font-size: 12px;
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
.update_time {
display: flex;
align-items: center;
.van-icon {
font-size: 14px;
margin-right: 6px;
}
}
} }
::v-deep(.van-icon) { ::v-deep(.van-icon) {
line-height: 16px; line-height: 16px;
......
<template> <template>
<div class="list"> <div class="list">
<NafmHeader title="联系人列表" /> <NafmHeader navClass="nafmii-head-bg3" title="联系人列表" />
<contact-item v-for="contactItem in contactList" :key="contactItem.id" :contact-item="contactItem"></contact-item> <contact-item v-for="contactItem in contactList" :key="contactItem.id" :contact-item="contactItem"></contact-item>
</div> </div>
</template> </template>
......
<template> <template>
<div> <div>
<NafmHeader title="入会指南" /> <NafmHeader navClass="nafmii-head-bg3" title="入会指南" />
入会指南 入会指南
</div> </div>
</template> </template>
......
<template> <template>
<div class="member_login"> <div class="member_login">
<NafmHeader /> <img src="@/assets/icon/bg_login_2.png" />
<van-form class="login_form" @submit="onSubmit"> <NafmHeader navClass="nafmii-head-bg1" bgColor="transparent" title=" " />
<van-field v-model="code" placeholder="请输入社会信用代码或组织机构代码" :rules="[{ required: true, message: '请输入社会信用代码或组织机构代码' }]"> <main class="login_content">
<div slot="left-icon"> <van-form class="login_form">
<van-icon name="coupon-o" /> <van-field v-model="code" :left-icon="shtyxydmIcon" placeholder="请输入社会信用代码或组织机构代码">
</van-field>
<van-field v-model="password" :left-icon="passwordIcon" type="password" placeholder="请输入密码">
</van-field>
<van-field v-model="checkCode" :left-icon="verificationIcon" placeholder="请输入验证码">
<template #button>
<span class="verfication_code">111111</span>
</template>
</van-field>
<p v-show="isLogin" class="wraning_tip">
提示:请输入贵单位会员系统的登录名及密码登录(单位会员)
</p>
<div>
<van-button :class="isLogin ? 'login_btn' : 'act_btn login_btn'" block type="info" native-type="submit" @click="loginSubmit">登录</van-button>
</div> </div>
</van-field> </van-form>
<van-field v-model="password" :left-icon="passwordIcon" type="password" placeholder="请输入密码" :rules="[{ required: true, message: '请输入密码' }]"> </main>
</van-field>
<van-field v-model="checkCode" :left-icon="verificationIcon" placeholder="请输入验证码" :rules="[{ required: true, message: '请输入验证码' }]">
<template #button>
<span>111111</span>
</template>
</van-field>
<p class="wraning_tip">
提示:请输入贵单位会员系统的登录名及密码登录(单位会员)
</p>
<div style="margin: 16px;">
<van-button class="login_btn" block type="info" native-type="submit" :disabled="isLogin">登录</van-button>
</div>
</van-form>
<div class="membership_about"> <div class="membership_about">
<van-cell title="入会指南" is-link to="/member/membershipGuide" /> <van-cell title="入会指南" is-link to="/member/membershipGuide" />
<van-cell title="会籍办理常见问题" is-link to="/member/membershipGuide" /> <van-cell title="会籍办理常见问题" is-link to="/member/membershipGuide" />
...@@ -36,7 +36,8 @@ export default { ...@@ -36,7 +36,8 @@ export default {
password: '', password: '',
checkCode: '', checkCode: '',
passwordIcon: require('@/assets/icon/password.png'), passwordIcon: require('@/assets/icon/password.png'),
verificationIcon: require('@/assets/icon/verification.png') verificationIcon: require('@/assets/icon/verification.png'),
shtyxydmIcon: require('@/assets/icon/shtyxydm.png'),
} }
}, },
computed: { computed: {
...@@ -45,47 +46,84 @@ export default { ...@@ -45,47 +46,84 @@ export default {
} }
}, },
methods: { methods: {
onSubmit(value) { loginSubmit() {
if (!this.code || this.code === '') {
return Toast('请输入社会信用统一代码或组织机构代码')
}
if (!this.password || this.password === '') {
return Toast('请输入密码')
}
if (!this.checkCode || this.checkCode === '') {
return Toast('请输入验证码')
}
} }
} }
} }
</script> </script>
<style lang="less" scoped> <style lang="less" scoped>
.member_login { .member_login {
position: absolute; width: 100%;
top: 0; height: 100%;
left: 0; display: flex;
right: 0; flex-direction: column;
bottom: 83px; .login_content {
background-color: #f6f6f6; display: flex;
.login_form { align-items: center;
background-color: #ffffff; justify-content: center;
padding-right: 20px; .login_form {
padding-bottom: 40px; margin-top: 20px;
::v-deep .van-field__control { width: 330px;
font-size: 14px; background-color: #ffffff;
color: #333333;
} ::v-deep .van-cell:not(:last-child)::after {
input::-webkit-input-placeholder { border-bottom: 1px solid #efefef;
color: #8f9196; }
}
input::-moz-input-placeholder { ::v-deep .van-cell {
color: #8f9196; padding-right: 0 !important;
} padding-left: 0 !important;
input::-ms-input-placeholder { border-bottom: 1px solid #ebedf0;
color: #8f9196; }
}
.wraning_tip { ::v-deep .van-cell:not(:last-child)::after {
color: #ea5c6d; border: none;
font-size: 12px; }
text-align: justify; ::v-deep .van-field__control {
margin-left: 20px; font-size: 14px;
margin-top: 16px; color: #333333;
} }
.login_btn { input::-webkit-input-placeholder {
background: linear-gradient(to right, #25a3df, #106abc); color: #8f9196;
border: none; }
input::-moz-input-placeholder {
color: #8f9196;
}
input::-ms-input-placeholder {
color: #8f9196;
}
.wraning_tip {
color: #ea5c6d;
font-size: 12px;
text-align: justify;
margin-top: 16px;
}
.login_btn {
width: 100%;
border-radius: 5px;
text-align: center;
height: 45px;
line-height: 45px;
color: #fff;
font-size: 16px;
margin-top: 20px;
background-image: linear-gradient(to right, #25a3df, #106abc);
// background: linear-gradient(to right, #25a3df, #106abc);
border: none;
opacity: 0.3;
}
.act_btn {
opacity: 1;
}
} }
} }
.membership_about { .membership_about {
......
<template> <template>
<div class="change_progress"> <div class="change_progress">
<NafmHeader title="变更进度" /> <NafmHeader navClass="nafmii-head-bg3" title="变更进度" />
<section class="pgrogress_step"> <section class="pgrogress_step">
<h3 class="wrap_title">变更进度</h3> <h3 class="wrap_title">变更进度</h3>
<progress-component :steps-info="steps"></progress-component> <progress-component :steps-info="steps"></progress-component>
......
<template> <template>
<div class="change_list"> <div class="change_list">
<NafmHeader title="变更" /> <NafmHeader navClass="nafmii-head-bg3" title="变更" />
<section class="name list_item"> <section class="name list_item">
<div class="item_icon"></div>
<div class="item_info"> <div class="item_info">
<span>单位名称变更</span> <span>单位名称变更</span>
<van-icon name="arrow" /> <van-icon name="arrow" />
</div> </div>
</section> </section>
<section class="represent list_item"> <section class="represent list_item">
<div class="item_icon"></div>
<div class="item_info"> <div class="item_info">
<span>单位代表变更</span> <span>单位代表变更</span>
<van-icon name="arrow" /> <van-icon name="arrow" />
</div> </div>
</section> </section>
<section class="type list_item"> <section class="type list_item">
<div class="item_icon"></div>
<div class="item_info"> <div class="item_info">
<span>会籍类别变更</span> <span>会籍类别变更</span>
<van-icon name="arrow" /> <van-icon name="arrow" />
...@@ -40,19 +37,34 @@ export default { ...@@ -40,19 +37,34 @@ export default {
display: flex; display: flex;
width: 100%; width: 100%;
height: 100px; height: 100px;
border: 1px solid red;
margin-bottom: 10px; margin-bottom: 10px;
.item_icon { &.name {
display: inline-block; background: url("../../../../assets/icon/change_name.png") no-repeat;
width: 66px; background-size: contain;
height: 66px; }
margin: 17px 30px; &.represent {
border: 1px solid cyan; background: url("../../../../assets/icon/change_representive.png")
no-repeat;
background-size: contain;
}
&.type {
background: url("../../../../assets/icon/change_membership.png") no-repeat;
background-size: contain;
} }
.item_info { .item_info {
display: inline-block;
line-height: 66px; line-height: 66px;
margin: 17px 0; margin: 17px auto;
display: flex;
align-items: center;
color: #ffffff;
font-size: 18px;
span {
font-family: PingFangSC-Semibold;
margin-right: 20px;
}
.van-icon {
font-size: 12px;
}
} }
} }
} }
......
<template> <template>
<div class="join_progress"> <div class="join_progress">
<NafmHeader title="进会进度" /> <NafmHeader navClass="nafmii-head-bg3" title="进会进度" />
<section class="pgrogress_step"> <section class="pgrogress_step">
<h3 class="wrap_title">入会进度</h3> <h3 class="wrap_title">入会进度</h3>
<progress-component :steps-info="steps"></progress-component> <progress-component :steps-info="steps"></progress-component>
......
<template> <template>
<div class="quit_progress"> <div class="quit_progress">
<NafmHeader title="退会进度" /> <NafmHeader navClass="nafmii-head-bg3" title="退会进度" />
<section class="pgrogress_step"> <section class="pgrogress_step">
<h3 class="wrap_title">退会进度</h3> <h3 class="wrap_title">退会进度</h3>
<progress-component :steps-info="steps"></progress-component> <progress-component :steps-info="steps"></progress-component>
......
<template> <template>
<div> <div class="login_result">
<NafmHeader title="会籍服务" /> <img src="@/assets/icon/bg_member.png" />
<section class="member_basic"> <NafmHeader bgColor="transparent" title="会籍服务" />
<van-cell> <main class="result_content">
<h3 slot="title" class="title">{{memberInfo.name}}</h3> <section class="member_basic">
<div slot="label"> <van-cell>
<p> <h3 slot="title" class="title">{{memberInfo.name}}</h3>
<span> <div slot="label">
社会统一信用代码: <p>
</span> <span>
<span class="info"> 社会统一信用代码:
{{memberInfo.shtyxydm}} </span>
</span> <span class="info">
</p> {{memberInfo.shtyxydm}}
<p> </span>
<span> </p>
会员状态: <p>
</span> <span>
<span class="info"> 会员状态:
{{memberInfo.status}} </span>
</span> <span class="info">
</p> {{memberInfo.status}}
<p> </span>
<span> </p>
会员级别: <p>
</span> <span>
<span class="info"> 会员级别:
{{memberInfo.level}} </span>
</span> <span class="info">
</p> {{memberInfo.level}}
<p> </span>
<span> </p>
会籍类别: <p>
</span> <span>
<span class="info"> 会籍类别:
{{memberInfo.type}} </span>
<span class="info">
{{memberInfo.type}}
</span>
</p>
</div>
</van-cell>
<van-cell is-link to="/member/memberDetail">
<p slot="default" class="tip_more">
<span class="warning_tip">
提示:如需变更请登录会员系统办理
</span> </span>
<span class="more">查看更多</span>
</p> </p>
</div>
</van-cell>
<van-cell is-link to="/member/memberDetail">
<p slot="default" class="tip_more">
<span class="warning_tip">
提示:如需变更请登录会员系统办理
</span>
<span class="more">查看更多</span>
</p>
</van-cell>
</section>
<section class="member_opration">
<div class="in">
<van-cell is-link>
<template #title>
<span class="oper_title">入会</span>
</template>
</van-cell> </van-cell>
</div> </section>
<div class="out"> <section class="member_opration">
<van-cell is-link> <div class="in">
<template #title> <van-cell is-link :icon="joinIcon">
<span class="oper_title">退会</span> <template #title>
</template> <span class="oper_title">入会</span>
</van-cell> </template>
</div> </van-cell>
<div class="change"> </div>
<van-cell is-link> <div class="out">
<template #title> <van-cell is-link :icon="quitIcon">
<span class="oper_title">变更</span> <template #title>
</template> <span class="oper_title">退会</span>
</van-cell> </template>
</div> </van-cell>
</section> </div>
<div class="change">
<van-cell is-link :icon="changeIcon">
<template #title>
<span class="oper_title">变更</span>
</template>
</van-cell>
</div>
</section>
</main>
<footer class="bottom_tip"> <footer class="bottom_tip">
提示:如联系人,通讯地址,注册地址,法人代表等变更,请登录会员系统办理 提示:如联系人,通讯地址,注册地址,法人代表等变更,请登录会员系统办理
</footer> </footer>
...@@ -86,20 +89,38 @@ export default { ...@@ -86,20 +89,38 @@ export default {
status: '欠费状态', status: '欠费状态',
level: '境外机构', level: '境外机构',
type: '投资人' type: '投资人'
} },
joinIcon: require('@/assets/icon/join_member.png'),
quitIcon: require('@/assets/icon/quit_member.png'),
changeIcon: require('@/assets/icon/change_member.png')
} }
} }
} }
</script> </script>
<style lang="less" scoped> <style lang="less" scoped>
.login_result {
width: 100%;
height: 100%;
display: flex;
flex-direction: column;
.result_content {
position: absolute;
top: 45px;
left: 0;
right: 0;
}
}
.van-cell { .van-cell {
border-radius: 8px; border-radius: 8px;
background-color: transparent;
} }
.member_basic { .member_basic {
margin: 15px; width: 396px;
height: 231px;
margin: 10px auto;
border-radius: 8px; border-radius: 8px;
background-color: #ffffff; background: url("../../../assets/icon/bg_member_result.png") no-repeat;
box-shadow: 0px 2px 8px 2px rgba(0, 0, 0, 0.08); background-size: 100% 100%;
.title { .title {
font-weight: bold; font-weight: bold;
} }
...@@ -140,6 +161,16 @@ export default { ...@@ -140,6 +161,16 @@ export default {
} }
.van-cell { .van-cell {
margin-bottom: 10px; margin-bottom: 10px;
.van-cell__left-icon {
font-size: 26px;
}
.oper_title {
margin-left: 10px;
font-size: 16px;
color: #444444;
font-family: PingFangSC-Semibold;
}
} }
} }
.bottom_tip { .bottom_tip {
......
<template> <template>
<div> <div>
<NafmHeader title="会员基本信息" /> <NafmHeader navClass="nafmii-head-bg3" title="会员基本信息" />
<main class="member_basic"> <main class="member_basic">
<h3> <h3>
<span class="oper_title">{{memberInfo.name}}</span> <span class="oper_title">{{memberInfo.name}}</span>
......
<template> <template>
<div> <div>
<NafmHeader title="资质查询" /> <NafmHeader navClass="nafmii-head-bg3" title="资质查询" />
<section class="detail_content"> <section class="detail_content">
<van-cell-group class=""> <van-cell-group class="">
<van-cell> <van-cell>
...@@ -30,7 +30,7 @@ ...@@ -30,7 +30,7 @@
<van-cell> <van-cell>
<span slot="title" class="label">已签署备案主协议</span> <span slot="title" class="label">已签署备案主协议</span>
<span class="info"> <span class="info">
<div class="master_agreement">《NAFMII主协议》</div> <div class="master_agreement" @click="toMasterAgreement">《NAFMII主协议》</div>
{{qulificationDetail.memberType}} {{qulificationDetail.memberType}}
</span> </span>
</van-cell> </van-cell>
...@@ -50,6 +50,11 @@ export default { ...@@ -50,6 +50,11 @@ export default {
} }
} }
},
methods: {
toMasterAgreement() {
this.$router.push({name: 'MasterAgreement'})
}
} }
} }
</script> </script>
......
<template> <template>
<div> <div>
<NafmHeader title="资质查询" /> <NafmHeader navClass="nafmii-head-bg3" title="资质查询" />
<div class="search_bar"> <div class="search_bar">
<van-field v-model="searchName" placeholder="请输入机构名称"> <van-field v-model="searchName" placeholder="请输入机构名称">
<template #label> <template #label>
......
<template> <template>
<div class="qulification_search"> <div class="qulification_search">
<NafmHeader title="资质查询" /> <NafmHeader navClass="nafmii-head-bg3" title="资质查询" />
<section class="logo"> <section class="logo">
</section> </section>
<h3 class="search_title">会员及市场参与者情况查询</h3> <h3 class="search_title">会员及市场参与者情况查询</h3>
<section class="search_box"> <section class="search_box">
<span class="select" @click="showPicker = true"> <span class="select" @click="showSheet = true">
<van-icon name="search" /> <van-icon name="search" />
<span class="qulification_type">{{qulificationType}}</span> <span class="qulification_type">{{qulificationType}}</span>
<van-icon name="play" /> <van-icon name="play" />
</span> </span>
<span class="visual_input">{{'请输入机构名称'}}</span> <div class="visual_input" @click="toListSearch">
<span>请输入机构名称</span>
</div>
</section> </section>
<section class="search_history"> <section class="search_history">
<div class="history_header"> <div class="history_header">
...@@ -20,23 +22,22 @@ ...@@ -20,23 +22,22 @@
</span> </span>
</div> </div>
<div> <div>
<span class="history_item" v-for=" item in historyItems" :key="item.id">{{item.name}}</span> <span class="history_item" v-for=" item in historyItems" :key="item.id" @click="toDetail">{{item.name}}</span>
</div> </div>
</section> </section>
<van-popup v-model="showPicker" round position="bottom"> <van-action-sheet v-model="showSheet" :actions="actions" cancel-text="取消" close-on-click-action @select="onSelect" />
<van-picker show-toolbar :columns="columns" @confirm="onConfirm" @cancel="showPicker = false" />
</van-popup>
</div> </div>
</template> </template>
<script> <script>
export default { export default {
data() { data() {
return { return {
columns: [ actions: [
'机构', '非法人产品' {name:'机构', type: 'org' },
{name:'非法人产品', type: 'pro'}
], ],
qulificationType: '机构', qulificationType: '机构',
showPicker: false, showSheet: false,
historyItems: [{ historyItems: [{
name: 'jdnskjfnjkds', name: 'jdnskjfnjkds',
id:11111 id:11111
...@@ -52,12 +53,15 @@ export default { ...@@ -52,12 +53,15 @@ export default {
} }
}, },
methods: { methods: {
onConfirm(value) { onSelect(item) {
this.qulificationType = value; this.show = false;
this.showPicker = false; this.qulificationType = item.name;
},
toListSearch() {
this.$router.push({name: 'QulificationList'})
}, },
popupShow() { toDetail() {
this.showPicker = false this.$router.push({name: 'QulificationDetail'})
} }
} }
} }
...@@ -82,7 +86,6 @@ this.qulificationType = value; ...@@ -82,7 +86,6 @@ this.qulificationType = value;
.search_box { .search_box {
width: 384px; width: 384px;
margin: 30px auto 25px; margin: 30px auto 25px;
padding: 10px 0;
border-radius: 16px; border-radius: 16px;
background-color: rgba(246, 246, 246, 1); background-color: rgba(246, 246, 246, 1);
display: flex; display: flex;
...@@ -91,7 +94,7 @@ this.qulificationType = value; ...@@ -91,7 +94,7 @@ this.qulificationType = value;
color: #999999; color: #999999;
display: flex; display: flex;
align-items: center; align-items: center;
padding: 0 10px 0 5px; padding: 10px 10px 10px 5px;
.van-icon-search { .van-icon-search {
margin: 0 11px; margin: 0 11px;
font-size: 12px; font-size: 12px;
...@@ -109,10 +112,13 @@ this.qulificationType = value; ...@@ -109,10 +112,13 @@ this.qulificationType = value;
} }
} }
.visual_input { .visual_input {
// line-height: 33px; width: 285px;
color: #999999; color: #999999;
padding-left: 15px; padding: 10px 0;
border-left: 0.5px solid #999999; span {
padding-left: 15px;
border-left: 0.5px solid #999999;
}
} }
} }
.search_history { .search_history {
......
Markdown is supported
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!