会籍服务相关代码优化

src/i18n/lang/member/index.js

+const memberEn = {
+  login: {
+    language: 'Language', // 多语言
+    bindWechat: 'Binding Wechat', // 绑定微信
+    resetPassword: 'Reset Password', // 重置密码
+    privacyPolicy: 'Privacy Policy', //隐私政策
+    serviceAgreement: 'Service Agreement', // 服务协议
+    chinese: 'Chinese',
+    english: 'English',
+  },
+  person: {
+    photo: 'Photo',
+    nickName: 'NickName',
+    nickNamePlaceholder: 'Please input your nickname',
+    phoneNumber: 'PhoneNumber',
+    name: 'Name',
+    namePlaceholder: 'Please input your name',
+    nationality: 'Nationality',
+    nationalityPlaceholder: 'Please select your Nationality',
+    birthday: 'BirthDay',
+    birthdayPlaceholder: 'Please select your Nationality',
+    email: 'Email',
+    emailPlaceholder: 'Please select your Nationality',
+    company: 'Company',
+    companyPlaceholder: 'Please select your Nationality',
+  },
+  center: {
+    login: 'Login',
+    konwMore: 'Know More Information',
+    message: 'Message',
+    collect: 'Collection',
+    study: 'Study',
+    question: 'Question',
+    feedBack: 'FeedBack',
+    about: 'About',
+    setting: 'Setting',
+  }
+}
+
+const memberZh = {
+  setting: {
+    language: '多语言',
+    bindWechat: '绑定微信',
+    resetPassword: '重置密码',
+    privacyPolicy: '隐私政策',
+    serviceAgreement: '服务协议',
+    chinese: '中文',
+    english: '英文',
+  },
+  person: {
+    photo: '头像',
+    nickName: '昵称',
+    nickNamePlaceholder: '请输入您的昵称',
+    phoneNumber: '手机号',
+    name: '姓名',
+    namePlaceholder: '请输入您的姓名',
+    nationality: '国籍',
+    namePlaceholder: '请选择您的国籍',
+    birthday: '出生日',
+    birthdayPlaceholder: '请选择您的出生日',
+    email: '邮箱',
+    emailPlaceholder: '请输入您的邮箱',
+    company: '单位',
+    companyPlaceholder: '请选择您的单位',
+  },
+  center: {
+    login: '立即登录',
+    konwMore: '登录后可了解更多信息',
+    message: '我的消息',
+    collect: '我的收藏',
+    study: '我的学习',
+    question: '常见问题',
+    feedBack: '意见反馈',
+    about: '关于协会',
+    setting: '设置',
+  }
+}
+export default {
+  memberEn,
+  memberZh
+};

src/views/member/business/index.vue

 <template>
-  <div class="list">
+  <div class="business_cpntainer">
     <NafmHeader navClass="nafmii-head-bg3" title="业务开展列表" />
-    <van-list v-model="loading" :finished="finished" finished-text="没有更多了" @load="onLoad">
-      <van-cell v-for="item in businessList" :key="item">
-        <div slot="title" class="title">{{item.title}}</div>
-        <p slot="label" class="info">
-          <span class="update_time">
-            <van-icon :name="timeIcon" />
-            更新日期：{{item.update_time}}
-          </span>
-          <span class="org">{{item.org}}</span>
-        </p>
-      </van-cell>
-    </van-list>
+    <main class="business_content">
+
+      <van-list v-model="loading" :finished="finished" finished-text="没有更多了" @load="onLoad">
+        <van-cell v-for="item in businessList" :key="item">
+          <div slot="title" class="title">{{item.title}}</div>
+          <p slot="label" class="info">
+            <span class="update_time">
+              <van-icon :name="timeIcon" />
+              更新日期：{{item.update_time}}
+            </span>
+            <span class="org">{{item.org}}</span>
+          </p>
+        </van-cell>
+      </van-list>
+    </main>
   </div>
 </template>
 <script>
 export default {
+  name: "BusinessList",
   data() {
     return {
       businessList: [{
@@ -41,7 +45,7 @@ export default {
 }
 </script>
 <style lang="less" scoped>
-.list {
+.business_cpntainer {
   .title {
     color: #222222;
     font-size: 16px;

src/views/member/contact/contactItem.vue

@@ -28,6 +28,7 @@
 </template>
 <script>
 export default {
+  name: "ContanctItem",
   data() {
     return {
 

src/views/member/contact/index.vue

 <template>
-  <div class="list">
+  <div class="contact_containier">
     <NafmHeader navClass="nafmii-head-bg3" title="联系人列表" />
-    <contact-item v-for="contactItem in contactList" :key="contactItem.id" :contact-item="contactItem"></contact-item>
+    <main class="contact_content">
+      <contact-item v-for="contactItem in contactList" :key="contactItem.id" :contact-item="contactItem"></contact-item>
+    </main>
   </div>
 </template>
 <script>
@@ -17,14 +19,16 @@ export default {
 }
 </script>
 <style lang="less" scoped>
-.list {
-  position: absolute;
-  top: 0px;
-  left: 0;
-  right: 0;
-  bottom: 15px;
-  margin: 16px 15px;
+.contact_containier {
+  width: 100%;
+  height: 100%;
   background-color: #fafafa;
+  .contact_content {
+    width: 384px;
+    margin: 16px auto 0;
+    display: flex;
+    flex-direction: column;
+  }
 }
 </style>
 

src/views/member/memberGuide.vue

@@ -6,6 +6,7 @@
 </template>
 <script>
 export default {
+  name: 'MemberGuide',
   data() {
     return {
 

src/views/member/memberLogin.vue

 <template>
-  <div class="member_login">
+  <div class="login_container">
     <img src="@/assets/icon/bg_login_2.png" />
-    <NafmHeader navClass="nafmii-head-bg1" bgColor="transparent" title=" " />
+    <div class="login_box">
+      <NafmHeader navClass="nafmii-head-bg1" title=" " />
+    </div>
+    <!-- <img src="@/assets/icon/bg_login_2.png" />
+    <NafmHeader navClass="nafmii-head-bg1" title=" " /> -->
     <main class="login_content">
       <van-form class="login_form">
         <van-field v-model="code" :left-icon="shtyxydmIcon" placeholder="请输入社会信用代码或组织机构代码">
@@ -13,8 +17,8 @@
             <span class="verfication_code">111111</span>
           </template>
         </van-field>
-        <p v-show="isLogin" class="wraning_tip">
-          提示：请输入贵单位会员系统的登录名及密码登录（单位会员）
+        <p class="wraning_tip">
+          <span v-show="isLogin">提示：请输入贵单位会员系统的登录名及密码登录（单位会员）</span>
         </p>
         <div>
           <van-button :class="isLogin ? 'login_btn' : 'act_btn login_btn'" block type="info" native-type="submit" @click="loginSubmit">登录</van-button>
@@ -22,7 +26,7 @@
       </van-form>
     </main>
     <div class="membership_about">
-      <van-cell title="入会指南" is-link to="/member/membershipGuide" />
+      <van-cell title="入会指南" is-link to="/member/memberGuide" />
       <van-cell title="会籍办理常见问题" is-link to="/member/membershipGuide" />
       <van-cell title="会员管理规则" is-link to="/member/membershipGuide" />
     </div>
@@ -30,6 +34,7 @@
 </template>
 <script>
 export default {
+  name: "MemberLogin",
   data() {
     return {
       code: '',
@@ -56,35 +61,42 @@ export default {
       if (!this.checkCode || this.checkCode === '') {
         return Toast('请输入验证码')
       }
+      this.$router.push({
+        name: 'LoginResult'
+      })
     }
   }
 }
 </script>
 <style lang="less" scoped>
-.member_login {
+.login_container {
   width: 100%;
   height: 100%;
   display: flex;
   flex-direction: column;
+  .login_box {
+    position: absolute;
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 100px;
+  }
   .login_content {
     display: flex;
     align-items: center;
     justify-content: center;
     .login_form {
-      margin-top: 20px;
       width: 330px;
+      padding: 20px 0;
       background-color: #ffffff;
-
       ::v-deep .van-cell:not(:last-child)::after {
         border-bottom: 1px solid #efefef;
       }
-
       ::v-deep .van-cell {
         padding-right: 0 !important;
         padding-left: 0 !important;
         border-bottom: 1px solid #ebedf0;
       }
-
       ::v-deep .van-cell:not(:last-child)::after {
         border: none;
       }
@@ -102,9 +114,9 @@ export default {
         color: #8f9196;
       }
       .wraning_tip {
+        min-height: 17px;
         color: #ea5c6d;
         font-size: 12px;
-        text-align: justify;
         margin-top: 16px;
       }
       .login_btn {
@@ -127,7 +139,8 @@ export default {
     }
   }
   .membership_about {
-    margin: 20px 0;
+    flex: 1;
+    background-color: #f6f6f6;
     .van-cell {
       background-color: #f6f6f6;
       font-size: 14px;

src/views/member/result/index.vue

 <template>
   <div class="login_result">
-    <img src="@/assets/icon/bg_member.png" />
-    <NafmHeader bgColor="transparent" title="会籍服务" />
+    <NafmHeader title="会籍服务" />
     <main class="result_content">
       <section class="member_basic">
-        <van-cell>
+        <van-cell class="bg_transparent">
           <h3 slot="title" class="title">{{memberInfo.name}}</h3>
           <div slot="label">
             <p>
-              <span>
-                社会统一信用代码：
-              </span>
-              <span class="info">
-                {{memberInfo.shtyxydm}}
-              </span>
+              <span>社会统一信用代码：</span>
+              <span class="info">{{memberInfo.shtyxydm}}</span>
             </p>
             <p>
-              <span>
-                会员状态：
-              </span>
-              <span class="info">
-                {{memberInfo.status}}
-              </span>
+              <span>会员状态：</span>
+              <span class="info">{{memberInfo.status}}</span>
             </p>
             <p>
-              <span>
-                会员级别：
-              </span>
-              <span class="info">
-                {{memberInfo.level}}
-              </span>
+              <span>会员级别：</span>
+              <span class="info">{{memberInfo.level}}</span>
             </p>
             <p>
-              <span>
-                会籍类别：
-              </span>
-              <span class="info">
-                {{memberInfo.type}}
-              </span>
+              <span>会籍类别：</span>
+              <span class="info">{{memberInfo.type}}</span>
             </p>
           </div>
         </van-cell>
-        <van-cell is-link to="/member/memberDetail">
+        <van-cell>
           <p slot="default" class="tip_more">
-            <span class="warning_tip">
-              提示：如需变更请登录会员系统办理
+            <span class="warning_tip"> 提示：如需变更请登录会员系统办理 </span>
+            <span class="more" @click="toOtherRouter('MemberDetail')">
+              查看更多
+              <van-icon :name="moreIcon" />
             </span>
-            <span class="more">查看更多</span>
           </p>
         </van-cell>
       </section>
       <section class="member_opration">
         <div class="in">
-          <van-cell is-link :icon="joinIcon">
+          <van-cell is-link :icon="joinIcon" @click="toOtherRouter('JoinProgress')">
             <template #title>
               <span class="oper_title">入会</span>
             </template>
           </van-cell>
         </div>
         <div class="out">
-          <van-cell is-link :icon="quitIcon">
+          <van-cell is-link :icon="quitIcon" @click="toOtherRouter('QuitProgress')">
             <template #title>
               <span class="oper_title">退会</span>
             </template>
           </van-cell>
         </div>
         <div class="change">
-          <van-cell is-link :icon="changeIcon">
+          <van-cell is-link :icon="changeIcon" @click="toOtherRouter('ChangeProgress')">
             <template #title>
               <span class="oper_title">变更</span>
             </template>
@@ -81,6 +65,7 @@
 </template>
 <script>
 export default {
+  name: 'MembrshipService',
   data() {
     return {
       memberInfo: {
@@ -92,7 +77,15 @@ export default {
       },
       joinIcon: require('@/assets/icon/join_member.png'),
       quitIcon: require('@/assets/icon/quit_member.png'),
-      changeIcon: require('@/assets/icon/change_member.png')
+      changeIcon: require('@/assets/icon/change_member.png'),
+      moreIcon: require('@/assets/icon/icon_arrow_right.png')
+    }
+  },
+  methods: {
+    toOtherRouter(routerName) {
+      this.$router.push({
+        name: routerName
+      })
     }
   }
 }
@@ -101,13 +94,12 @@ export default {
 .login_result {
   width: 100%;
   height: 100%;
+  background: url("../../../assets/icon/bg_member.png") no-repeat;
+  background-size: 100%;
   display: flex;
   flex-direction: column;
   .result_content {
-    position: absolute;
-    top: 45px;
-    left: 0;
-    right: 0;
+    flex: 1;
   }
 }
 .van-cell {
@@ -139,6 +131,7 @@ export default {
     }
     .more {
       color: #666666;
+      align-items: center;
     }
   }
 }
@@ -174,12 +167,9 @@ export default {
   }
 }
 .bottom_tip {
+  flex: 0;
   font-size: 12px;
   color: #999999;
-  position: absolute;
-  bottom: 83px;
-  left: 0;
-  right: 0;
   background: #f6f6f6;
   padding: 10px 15px;
 }

src/views/member/result/memberDetail.vue

@@ -6,7 +6,7 @@
         <span class="oper_title">{{memberInfo.name}}</span>
       </h3>
       <van-cell>
-        <p slot="label">
+        <p slot="default">
           <span>社会统一信用代码</span>
           <span>{{memberInfo.shtyxydm || '--'}}</span>
         </p>
@@ -80,6 +80,7 @@
 </template>
 <script>
 export default {
+  name: "MemberDetail",
   data() {
     return {
       memberInfo: {
@@ -98,10 +99,16 @@ export default {
   margin-top: 16px;
   margin-right: 20px;
   .oper_title {
+    display: inline-block;
+    height: 16px;
+    line-height: 16px;
     color: #222222;
     font-size: 16px;
     font-family: PingFangSC-Semibold;
-    padding: 0 16px;
+    margin: 16px;
+    padding-left: 5px;
+    border-left: 2.5px solid #135faa;
+    vertical-align: middle;
   }
   p {
     display: flex;