Skip to content

polysoft-nafmii / polysoft-h5

Go to a project
Commit a332c8cf by lixin
Options

会员进度相关

1 parent 6c9110bc
Inline Side-by-side
Showing 17 changed files with 487 additions and 69 deletions
src/router/index.js
...@@ -3,6 +3,7 @@ import VueRouter from 'vue-router' ...@@ -3,6 +3,7 @@ import VueRouter from 'vue-router'
import Home from '@/views/home/index.vue' import Home from '@/views/home/index.vue'
import userRouter from './modules/user' import userRouter from './modules/user'
import memberRouter from './modules/member' import memberRouter from './modules/member'
import qulificationRouter from './modules/qualification'
Vue.use(VueRouter) Vue.use(VueRouter)
...@@ -13,7 +14,7 @@ const routes = [{ ...@@ -13,7 +14,7 @@ const routes = [{
title: '首页' title: '首页'
}, },
component: Home component: Home
}, ].concat(userRouter, memberRouter) }, ].concat(userRouter, memberRouter, qulificationRouter)
const router = new VueRouter({ const router = new VueRouter({
routes routes
......
src/router/modules/member.js
const memberRouter = [ const memberRouter = [{
{
path: '/member/login', path: '/member/login',
name: 'MemberLogin', name: 'MemberLogin',
meta: { meta: {
title: '登录' title: '登录'
}, },
component: () => import( /* webpackChunkName: "MemberLogin" */ '@/views/member/Login.vue') // 会员登录 component: () => import( /* webpackChunkName: "MemberLogin" */ '@/views/member/login.vue') // 会员登录
}, },
{ {
path: '/member/loginResult', path: '/member/loginResult',
...@@ -13,7 +12,15 @@ const memberRouter = [ ...@@ -13,7 +12,15 @@ const memberRouter = [
meta: { meta: {
title: '会籍服务' title: '会籍服务'
}, },
component: () => import( /* webpackChunkName: "LoginResult" */ '@/views/member/result') // 会员服务 component: () => import( /* webpackChunkName: "LoginResult" */ '@/views/member/result') // 会籍服务
},
{
path: '/member/memberDetail',
name: 'MemberDetail',
meta: {
title: '会员基本信息'
},
component: () => import( /* webpackChunkName: "MemberDetail" */ '@/views/member/result/memberDetail.vue') // 会籍服务
}, },
{ {
path: '/member/membershipGuide', path: '/member/membershipGuide',
...@@ -21,15 +28,15 @@ const memberRouter = [ ...@@ -21,15 +28,15 @@ const memberRouter = [
meta: { meta: {
title: '入会指南' title: '入会指南'
}, },
component: () => import( /* webpackChunkName: "center" */ '@/views/member/MembershipGuide.vue') // 重置密码 component: () => import( /* webpackChunkName: "MembershipGuide" */ '@/views/member/membershipGuide.vue') // 入会指南
}, },
{ {
path: '/member/contactList', path: '/member/contactList',
name: 'ContactList', name: 'ContactList',
meta: { meta: {
title: '入会指南' title: '联系人'
}, },
component: () => import( /* webpackChunkName: "center" */ '@/views/member/contact') // 重置密码 component: () => import( /* webpackChunkName: "ContactList" */ '@/views/member/contact') // 联系人
}, },
{ {
path: '/member/businessList', path: '/member/businessList',
...@@ -37,7 +44,39 @@ const memberRouter = [ ...@@ -37,7 +44,39 @@ const memberRouter = [
meta: { meta: {
title: '业务开展' title: '业务开展'
}, },
component: () => import( /* webpackChunkName: "center" */ '@/views/member/business') // 重置密码 component: () => import( /* webpackChunkName: "BusinessList" */ '@/views/member/business') // 业务开展
},
{
path: '/member/joinProgress',
name: 'JoinProgress',
meta: {
title: '进会进度'
},
component: () => import( /* webpackChunkName: "JoinProgress" */ '@/views/member/progress/join.vue') // 进会进度
},
{
path: '/member/quitProgress',
name: 'QuitProgress',
meta: {
title: '退回进度'
},
component: () => import( /* webpackChunkName: "QuitProgress" */ '@/views/member/progress/quit.vue') // 退回进度
},
{
path: '/member/changeList',
name: 'ChangeList',
meta: {
title: '变更'
},
component: () => import( /* webpackChunkName: "ChangeList" */ '@/views/member/progress/change/list.vue') // 变更列表
}, ,
{
path: '/member/changeProgress',
name: 'ChangeProgress',
meta: {
title: '变更进度'
},
component: () => import( /* webpackChunkName: "ChangeProgress" */ '@/views/member/progress/change') // 变更进度
} }
] ]
......
src/router/modules/qualification.js 0 → 100644
const qulificationRouter = [{
path: '/qulification/search',
name: 'QulificationSearch',
meta: {
title: '资质查询'
},
component: () => import( /* webpackChunkName: "QulificationSearch" */ '@/views/qulification/search.vue') // 资质查询
}]
export default qulificationRouter
src/utils/vant-ui.js
import Vue from 'vue' import Vue from 'vue'
import { Loading, Lazyload, Tab, Tabs, Toast, Dialog, Icon, Form, Field, Switch, Overlay, Cell, CellGroup, ActionSheet, Button } from 'vant' import {
Loading,
Lazyload,
Tab,
Tabs,
Toast,
Dialog,
Icon,
Form,
Field,
Switch,
Overlay,
Cell,
CellGroup,
ActionSheet,
Button,
Step,
Steps
} from 'vant'
import NafmHeader from '@/components/NafmHeader' import NafmHeader from '@/components/NafmHeader'
import FooterBottom from '@/components/FooterBottom' import FooterBottom from '@/components/FooterBottom'
...@@ -8,9 +26,10 @@ import FooterBottom from '@/components/FooterBottom' ...@@ -8,9 +26,10 @@ import FooterBottom from '@/components/FooterBottom'
[NafmHeader, FooterBottom].forEach(item => Vue.component(item.name, item)); [NafmHeader, FooterBottom].forEach(item => Vue.component(item.name, item));
// 默认vant组件 // 默认vant组件
[Loading, Lazyload, Tab, Tabs, Toast, Dialog, Icon, Form, Field, Switch, Overlay, Cell, CellGroup, ActionSheet, Button].forEach(item => Vue.use(item)) [Loading, Lazyload, Tab, Tabs, Toast, Dialog, Icon, Form, Field, Switch, Overlay, Cell, CellGroup, ActionSheet, Button, Step, Steps].forEach(item => Vue.use(item))
// 先预制，后期做统一调整 // 先预制，后期做统一调整
Object.assign(window, { Object.assign(window, {
Toast, Dialog Toast,
Dialog
}) })
src/views/member/Login.vue
...@@ -20,7 +20,7 @@ ...@@ -20,7 +20,7 @@
<span>111111</span> <span>111111</span>
</template> </template>
</van-field> </van-field>
<p style="margin: 18px" class="wraning_tip"> <p class="wraning_tip">
提示：请输入贵单位会员系统的登录名及密码登录（单位会员） 提示：请输入贵单位会员系统的登录名及密码登录（单位会员）
</p> </p>
<div style="margin: 16px;"> <div style="margin: 16px;">
...@@ -61,23 +61,38 @@ export default { ...@@ -61,23 +61,38 @@ export default {
top: 0; top: 0;
left: 0; left: 0;
right: 0; right: 0;
bottom: 150px; bottom: 83px;
background-color: #f6f6f6; background-color: #f6f6f6;
.login_form { .login_form {
background-color: #ffffff; background-color: #ffffff;
padding-bottom: 30px; padding-right: 20px;
padding-bottom: 40px;
::v-deep .van-field__control {
font-size: 14px;
color: #333333;
}
input::-webkit-input-placeholder {
color: #8f9196;
}
input::-moz-input-placeholder {
color: #8f9196;
}
input::-ms-input-placeholder {
color: #8f9196;
}
.wraning_tip { .wraning_tip {
color: #ea5c6d; color: #ea5c6d;
font-size: 22px; font-size: 12px;
text-align: justify; text-align: justify;
font-family: PingFangSC-Regular; margin-left: 20px;
margin-top: 16px;
} }
} }
.membership_about { .membership_about {
margin: 20px 0; margin: 20px 0;
.van-cell { .van-cell {
background-color: #f6f6f6; background-color: #f6f6f6;
font-size: 14px;
} }
} }
} }
......
src/views/member/business/index.vue
...@@ -3,7 +3,7 @@ ...@@ -3,7 +3,7 @@
<NafmHeader title="业务开展列表" /> <NafmHeader 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">{{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="underway-o" />
...@@ -41,14 +41,20 @@ export default { ...@@ -41,14 +41,20 @@ export default {
</script> </script>
<style lang="less" scoped> <style lang="less" scoped>
.list { .list {
.title {
color: #222222;
font-size: 16px;
text-align: justify;
}
.info { .info {
line-height: 30px; color: #888d8d;
font-size: 20px; line-height: 16px;
font-size: 12px;
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
} }
::v-deep(.van-icon) { ::v-deep(.van-icon) {
line-height: 30px; line-height: 16px;
} }
} }
</style> </style>
......
src/views/member/contact/contactItem.vue
...@@ -45,18 +45,16 @@ export default { ...@@ -45,18 +45,16 @@ export default {
</script> </script>
<style lang="less" scoped> <style lang="less" scoped>
.contact_item { .contact_item {
padding: 0 27px; padding: 6px 15px;
border-radius: 15px; border-radius: 8px;
background-color: rgba(255, 255, 255, 1); background-color: #ffffff;
box-shadow: 0px 0px 6px 0px rgba(2, 15, 41, 0.06); box-shadow: 0px 0px 6px 0px rgba(2, 15, 41, 0.06);
margin-top: 18px; margin-bottom: 10px;
p { p {
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
line-height: 62px; line-height: 34px;
font-size: 25px; font-size: 14px;
text-align: left;
font-family: PingFangSC-Regular;
.title { .title {
color: #666666; color: #666666;
} }
......
src/views/member/contact/index.vue
...@@ -22,8 +22,8 @@ export default { ...@@ -22,8 +22,8 @@ export default {
top: 0px; top: 0px;
left: 0; left: 0;
right: 0; right: 0;
bottom: 0; bottom: 15px;
padding: 9px 29px; margin: 16px 15px;
background-color: #fafafa; background-color: #fafafa;
} }
</style> </style>
......
src/views/member/progress/change/index.vue 0 → 100644
<template>
<div class="change_progress">
<NafmHeader title="变更进度" />
<section class="pgrogress_step">
<h3 class="wrap_title">变更进度</h3>
<progress-component :steps-info="steps"></progress-component>
</section>
<section class="flow_chart">
</section>
</div>
</template>
<script>
export default {
data() {
return {
steps: [{
title: '1212121212',
time: '2021.01.01'
}, {
title: '1212121212',
time: '2021.01.01'
}, {
title: '1212121212',
time: '2021.01.01'
}]
}
},
components: {
progressComponent: ()=>import('../progress.vue')
}
}
</script>
<style lang="less" scoped>
.change_progress {
padding: 20px;
}
.wrap_title {
font-size: 16px;
padding-left: 6px;
color: #222222;
font-family: PingFangSC-Semibold;
border-left: 2.5px solid #135faa;
}
</style>
src/views/member/progress/change/list.vue 0 → 100644
<template>
<div class="change_list">
<NafmHeader title="变更" />
<section class="name list_item">
<div class="item_icon"></div>
<div class="item_info">
<span>单位名称变更</span>
<van-icon name="arrow" />
</div>
</section>
<section class="represent list_item">
<div class="item_icon"></div>
<div class="item_info">
<span>单位代表变更</span>
<van-icon name="arrow" />
</div>
</section>
<section class="type list_item">
<div class="item_icon"></div>
<div class="item_info">
<span>会籍类别变更</span>
<van-icon name="arrow" />
</div>
</section>
</div>
</template>
<script>
export default {
data() {
return {
}
}
}
</script>
<style lang="less" scoped>
.change_list {
padding: 20px;
.list_item {
display: flex;
width: 100%;
height: 100px;
border: 1px solid red;
margin-bottom: 10px;
.item_icon {
display: inline-block;
width: 66px;
height: 66px;
margin: 17px 30px;
border: 1px solid cyan;
}
.item_info {
display: inline-block;
line-height: 66px;
margin: 17px 0;
}
}
}
</style>
src/views/member/progress/join.vue 0 → 100644
<template>
<div class="join_progress">
<NafmHeader title="进会进度" />
<section class="pgrogress_step">
<h3 class="wrap_title">入会进度</h3>
<progress-component :steps-info="steps"></progress-component>
</section>
<section class="flow_chart">
<h3 class="wrap_title">会员系统内流程图</h3>
</section>
</div>
</template>
<script>
export default {
data() {
return {
steps: [{
title: '1212121212',
time: '2021.01.01'
}, {
title: '1212121212',
time: '2021.01.01'
}, {
title: '1212121212',
time: '2021.01.01'
}]
}
},
components: {
progressComponent: ()=>import('./progress.vue')
}
}
</script>
<style lang="less" scoped>
.join_progress {
padding: 20px;
}
.wrap_title {
font-size: 16px;
padding-left: 6px;
color: #222222;
font-family: PingFangSC-Semibold;
border-left: 2.5px solid #135faa;
}
</style>
src/views/member/progress/progress.vue 0 → 100644
<template>
<div>
<van-steps direction="vertical" active-icon="circle" inactive-color="#106ABC" :active="0">
<!-- <template > -->
<van-icon slot="active-icon" name="circle" />
<!-- </template> -->
<van-step v-for="stepItem in stepsInfo" :key="stepItem.id">
<div class="step_content">
<span class="step_left">
<h3 class="step_title">{{stepItem.title}}</h3>
<a href="" class="step_link" v-if="stepItem.link">{{stepItem.link}}</a>
<div class="step_action" v-if="stepItem.expand"></div>
</span>
<span class="step_right">{{stepItem.time}}</span>
</div>
</van-step>
</van-steps>
</div>
</template>
<script>
export default {
data() {
return {
}
},
props: {
stepsInfo: {
type: Object,
default: ()=> {
return {}
}
}
}
}
</script>
<style lang="less" scoped>
::v-deep .van-step:last-child .van-step__line {
border: none;
}
::v-deep .van-step__line {
border-left: 0.5px dotted #106abc;
background-color: transparent;
}
::v-deep .van-step__circle {
background-color: #106abc;
}
::v-deep .van-hairline::after {
border: none;
}
::v-deep .van-step__icon--active {
color: #106abc;
}
.step_content {
display: flex;
justify-content: space-between;
.step_left {
.step_title {
font-size: 15px;
color: #333333;
line-height: 21px;
}
.step_link {
font-size: 12px;
line-height: 17px;
color: #388de2;
text-decoration: underline;
}
}
.step_right {
font-size: 12px;
color: #666666;
line-height: 17px;
}
}
</style>
src/views/member/progress/quit.vue 0 → 100644
<template>
<div class="quit_progress">
<NafmHeader title="退会进度" />
<section class="pgrogress_step">
<h3 class="wrap_title">退会进度</h3>
<progress-component :steps-info="steps"></progress-component>
</section>
</div>
</template>
<script>
export default {
data() {
return {
steps: [{
title: '1212121212',
time: '2021.01.01'
}, {
title: '1212121212',
time: '2021.01.01'
}, {
title: '1212121212',
time: '2021.01.01'
}]
}
},
components: {
progressComponent: ()=>import('./progress.vue')
}
}
</script>
<style lang="less" scoped>
.quit_progress {
padding: 20px;
}
.wrap_title {
font-size: 16px;
padding-left: 6px;
color: #222222;
font-family: PingFangSC-Semibold;
border-left: 2.5px solid #135faa;
}
</style>
src/views/member/result/index.vue
...@@ -39,7 +39,7 @@ ...@@ -39,7 +39,7 @@
</p> </p>
</div> </div>
</van-cell> </van-cell>
<van-cell is-link> <van-cell is-link to="/member/memberDetail">
<p slot="default" class="tip_more"> <p slot="default" class="tip_more">
<span class="warning_tip"> <span class="warning_tip">
提示：如需变更请登录会员系统办理 提示：如需变更请登录会员系统办理
...@@ -92,23 +92,25 @@ export default { ...@@ -92,23 +92,25 @@ export default {
} }
</script> </script>
<style lang="less" scoped> <style lang="less" scoped>
.van-cell {
border-radius: 8px;
}
.member_basic { .member_basic {
margin: 28px; margin: 15px;
border-radius: 15px; border-radius: 8px;
background-color: #ffffff; background-color: #ffffff;
box-shadow: 0px 2px 8px 2px rgba(0, 0, 0, 0.08); box-shadow: 0px 2px 8px 2px rgba(0, 0, 0, 0.08);
.title { .title {
font-size: 35px;
font-weight: bold; font-weight: bold;
} }
p { p {
line-height: 57px; line-height: 30px;
.info { .info {
color: #000000; color: #000000;
} }
} }
.tip_more { .tip_more {
font-size: 23px; font-size: 12px;
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
.warning_tip { .warning_tip {
...@@ -120,7 +122,7 @@ export default { ...@@ -120,7 +122,7 @@ export default {
} }
} }
.member_opration { .member_opration {
margin: 28px; margin: 15px;
.in { .in {
.van-cell { .van-cell {
background-color: #e7efff; background-color: #e7efff;
...@@ -137,19 +139,18 @@ export default { ...@@ -137,19 +139,18 @@ export default {
} }
} }
.van-cell { .van-cell {
border-radius: 15px; margin-bottom: 10px;
margin-bottom: 18px;
} }
} }
.bottom_tip { .bottom_tip {
font-size: 22px; font-size: 12px;
color: #999999; color: #999999;
position: absolute; position: absolute;
bottom: 150px; bottom: 83px;
left: 0; left: 0;
right: 0; right: 0;
background: #f6f6f6; background: #f6f6f6;
padding: 28px; padding: 10px 15px;
} }
</style> </style>
src/views/member/result/memberBasic.vue → src/views/member/result/memberDetail.vue
...@@ -6,75 +6,73 @@ ...@@ -6,75 +6,73 @@
<span class="oper_title">{{memberInfo.name}}</span> <span class="oper_title">{{memberInfo.name}}</span>
</h3> </h3>
<van-cell> <van-cell>
<p #default> <p slot="label">
<span>社会统一信用代码</span> <span>社会统一信用代码</span>
<span>{{memberInfo.shtyxydm || '--'}}</span> <span>{{memberInfo.shtyxydm || '--'}}</span>
</p> </p>
</van-cell> </van-cell>
<van-cell> <van-cell>
<p #default> <p slot="default">
<span>会员状态</span> <span>会员状态</span>
<span>{{memberInfo.shtyxydm || '--'}}</span> <span>{{memberInfo.status || '--'}}</span>
</p> </p>
</van-cell> </van-cell>
<van-cell> <van-cell>
<p #default> <p slot="default">
<span>会员级别</span> <span>会员级别</span>
<span>{{memberInfo.shtyxydm || '--'}}</span> <span>{{memberInfo.level || '--'}}</span>
</p> </p>
</van-cell> </van-cell>
<van-cell> <van-cell>
<p #default> <p slot="default">
<span>会籍类别</span> <span>会籍类别</span>
<span>{{memberInfo.shtyxydm || '--'}}</span> <span>{{memberInfo.type || '--'}}</span>
</p> </p>
</van-cell> </van-cell>
<van-cell> <van-cell>
<p #default> <p slot="default">
<span>成立时间</span> <span>成立时间</span>
<span>{{memberInfo.shtyxydm || '--'}}</span> <span>{{memberInfo.createTime || '--'}}</span>
</p> </p>
</van-cell> </van-cell>
<van-cell> <van-cell>
<p #default> <p slot="default">
<span>法人代表</span> <span>法人代表</span>
<span>{{memberInfo.shtyxydm || '--'}}</span> <span>{{memberInfo.legalRepresentative || '--'}}</span>
</p> </p>
</van-cell> </van-cell>
<van-cell> <van-cell>
<p #default> <p slot="default">
<span>注册资本</span> <span>注册资本</span>
<span>{{memberInfo.shtyxydm || '--'}}</span> <span>{{memberInfo.registeredCapital || '--'}}</span>
</p> </p>
</van-cell> </van-cell>
<van-cell> <van-cell>
<p #default> <p slot="default">
<span>机构类型</span> <span>机构类型</span>
<span>{{memberInfo.shtyxydm || '--'}}</span> <span>{{memberInfo.orgType || '--'}}</span>
</p> </p>
</van-cell> </van-cell>
<van-cell> <van-cell>
<p #default> <p slot="default">
<span>通讯地址</span> <span>通讯地址</span>
<span>{{memberInfo.shtyxydm || '--'}}</span> <span>{{memberInfo.address || '--'}}</span>
</p> </p>
</van-cell> </van-cell>
<van-cell> <van-cell>
<p #default> <p slot="default">
<span>单位代表姓名</span> <span>单位代表姓名</span>
<span>{{memberInfo.shtyxydm || '--'}}</span> <span>{{memberInfo.representativeName || '--'}}</span>
</p> </p>
</van-cell> </van-cell>
<van-cell> <van-cell is-link to="/member/businessList">
<p #default> <p slot="default">
<span>业务开展情况</span> <span>业务开展情况</span>
<span>{{memberInfo.shtyxydm || '--'}}</span>
</p> </p>
</van-cell> </van-cell>
<van-cell> <van-cell is-link to="/member/contactList">
<p #default> <p slot="default">
<span>联系人列表</span> <span>联系人列表</span>
<span>{{memberInfo.shtyxydm || '--'}}</span>
</p> </p>
</van-cell> </van-cell>
</main> </main>
...@@ -96,5 +94,24 @@ export default { ...@@ -96,5 +94,24 @@ export default {
} }
</script> </script>
<style lang="less" scoped> <style lang="less" scoped>
.member_basic {
margin-top: 16px;
margin-right: 20px;
.oper_title {
color: #222222;
font-size: 16px;
font-family: PingFangSC-Semibold;
padding: 0 16px;
}
p {
display: flex;
justify-content: space-between;
color: #333333;
font-size: 14px;
}
.van-cell {
margin-right: 20px;
}
}
</style> </style>
src/views/qulification/search.vue 0 → 100644
<template>
<div class="qulification_search">
<NafmHeader title="资质查询" />
<section class="logo">
</section>
<h3 class="search_title">会员及市场参与者情况查询</h3>
<section class="search_box">
</section>
</div>
</template>
<script>
export default {
data() {
return {
}
}
}
</script>
<style lang="less" scoped>
.qulification_search {
padding: 20px;
.logo {
display: block;
width: 100px;
height: 100px;
margin: 15px auto;
background: url(../../assets/icon/logo.png) no-repeat;
background-size: contain;
}
.search_title {
font-size: 16px;
font-family: PingFangSC-Semibold;
color: #333333;
text-align: center;
}
// .search_box {
// }
}
</style>
Markdown is supported
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!