整体结构调整;报名申请升级到2.0;

.config.dev.js

@@ -32,5 +32,7 @@ module.exports = {
     }
   },
   ProvidePlugin: {},
-  others: {}
+  others: {
+    projectId: '1007'
+  }
 }

.config.pro.js

@@ -13,5 +13,7 @@ module.exports = {
     }
   },
   ProvidePlugin: {},
-  others: {}
+  others: {
+    projectId: '1007'
+  }
 }

.config.test.js

@@ -14,5 +14,7 @@ module.exports = {
     }
   },
   ProvidePlugin: {},
-  others: {}
+  others: {
+    projectId: '1007'
+  }
 }

package.json

@@ -72,24 +72,26 @@
     "webpack-merge": "^4.2.2"
   },
   "dependencies": {
-    "@ezijing/vue-form": "^0.1.24",
+    "@ezijing/vue-form": "^2.0.13",
     "@ezijing/vue-passport": "^1.0.0",
-    "axios": "^0.20.0",
-    "core-js": "^3.6.5",
+    "axios": "^0.21.0",
+    "bootstrap": "^4.5.3",
+    "core-js": "^3.8.0",
     "cross-env": "^7.0.2",
-    "bootstrap": "^4.3.1",
-    "element-ui": "^2.13.2",
+    "element-ui": "^2.14.1",
+    "jquery": "^3.5.1",
     "js-cookie": "^2.2.1",
-    "jquery": "^3.4.1",
     "js-md5": "^0.7.3",
     "lodash": "^4.17.20",
-    "swiper": "^5.4.5",
+    "qrcode.vue": "^1.7.0",
+    "swiper": "^6.3.5",
     "vue": "^2.6.12",
     "vue-awesome-swiper": "^4.1.1",
-    "vue-i18n": "^8.22.0",
-    "vue-loader": "^15.9.3",
+    "vue-i18n": "^8.22.2",
+    "vue-loader": "^15.9.5",
     "vue-meta-info": "^0.1.7",
-    "vue-router": "^3.4.6",
-    "vue-template-compiler": "^2.6.12"
+    "vue-router": "^3.4.9",
+    "vue-template-compiler": "^2.6.12",
+    "vuex": "^3.6.0"
   }
 }

src/api/base_api.js

 import axios from 'axios'
 import _ from 'lodash'
-// import tools from '@tool'
-
-import { MessageBox, Message } from 'element-ui'
+import qs from 'qs'
 
 export default class API {
   constructor(config) {
     /* 创建一个 自定义配置axios实例 */
-    axios.defaults.withCredentials = true // 让ajax携带cookie
+    // 让ajax携带cookie
+    axios.defaults.withCredentials = true
     this._axios = axios.create({
       timeout: config.timeout || 5 * 1000,
       /* 表示服务器响应的数据类型，可以是 'arraybuffer', 'blob', 'document', 'json', 'text', 'stream' */
@@ -18,71 +17,40 @@ export default class API {
       headers: {
         Accept: '*/*',
         'Accept-Language': '',
-        'Content-Type': 'application/json'
+        'Content-Type': 'application/x-www-form-urlencoded'
       }
     })
   }
 
+  /* 获取当前Vue创建实例 */
+  getVueInstance() {
+    return window.G.$instance_vue
+  }
+
   /* 重新封装 请求时的执行函数 */
   _request(_config = {}) {
     /* 具体执行请求成功后业务逻辑前，先执行该方法 */
-    let beforeSuccess = _config.beforeSuccess
-      ? _config.beforeSuccess
-      : this._reqSuccess
+    const beforeSuccess = _config.beforeSuccess ? _config.beforeSuccess : this._reqSuccess
     /* 具体执行请求失败后业务逻辑前，先执行该方法 */
-    let beforeFail = _config.beforeFail ? _config.beforeFail : this._reqFail
-    /* 这里可以统一处理 登录 */
-
-    /**
-     * 增加 Cookie 和 请求头传值，如果是 服务端渲染，就放Node端
-     * 所有请求 全部增加 token 和 tenant 请求头并 自带 cookie
-     */
-    // let s = decodeURIComponent(tools.cookies.getCookie('_SUP') || '')
-    // let ticket = ''
-    // s = s.match(/"([\d\w=]+)";\}$/)
-    // if (s && s.length === 2) {
-    //   s = new Buffer(s[1], 'base64').toString() // eslint-disable-line
-    //   s = s.slice(12, s.search('-TGT') + 4)
-    //   ticket = s.split('').reverse().join('')
-    // }
-    let headers = {
-      // 'X-Forwarded-For': req.get('x-forwarded-for'),
-      // 'X-Real-Ip': req.get('x-real-ip'),
-      // 'token': ticket,
-      tenant: 'kelley',
-      version: window.G.VERSION
+    const beforeFail = _config.beforeFail ? _config.beforeFail : this._reqFail
+    const headers = {
+      'Content-Type': 'application/x-www-form-urlencoded'
     }
-    _config.headers = _.assignIn(_config.headers, headers)
-    /* 判别传输方式 */
-    if (
-      _config.headers['Content-Type'] === 'application/x-www-form-urlencoded'
-    ) {
-      /* 必须使用 Form-Data 方式 */
-      let str = ''
-      let _obj = _config.data || _config.params
-      for (let key in _obj) {
-        str += key + '=' + _obj[key] + '&'
-      }
-      str = str.substr(0, str.length - 1)
-      if (_config.data) {
-        _config.data = str
-      } else {
-        _config.params = str
-      }
+    _config.headers = _.assignIn(headers, _config.headers)
+    /* 判别 传输方式 */
+    if (_config.headers['Content-Type'] === 'application/x-www-form-urlencoded') {
+      _config.data = qs.stringify(_config.data)
     }
     if (_config.headers['Content-Type'] === 'multipart/form-data') {
       let fr = new FormData() // eslint-disable-line
-      let _obj = _config.data || _config.params
-      for (let key in _obj) {
+      const _obj = _config.data || _config.params
+      for (const key in _obj) {
         fr.append(key, _obj[key])
       }
       _config.data = fr
     }
     /* 创建并根据参数发起请求 */
-    return this._axios(_config).then(
-      beforeSuccess.bind(this),
-      beforeFail.bind(this)
-    )
+    return this._axios(_config).then(beforeSuccess.bind(this), beforeFail.bind(this))
   }
 
   /**
@@ -91,39 +59,10 @@ export default class API {
    * @param {[object]} res 返回数据
    */
   _reqSuccess(res) {
-    let { status, data } = res
+    const { status, data } = res
     let err = null
-    /* 针对 MBA学习系统 做特殊 请求成功处理 */
     if (status === 200) {
-      if (data === null) {
-        return data
-      }
-      if (data.status === 403 && !/\/getinfo$/gi.test(res.config.url)) {
-        MessageBox.confirm('登录状态已过期, 请重新登录。', '提示', {
-          confirmButtonText: '确定',
-          // cancelButtonText: '取消',
-          type: 'warning',
-          showClose: false,
-          closeOnPressEscape: false,
-          closeOnClickModal: false,
-          showCancelButton: false
-        })
-          .then(() => {
-            /* 重新刷新当前页 */
-            window.location.reload()
-          })
-          .catch(() => {
-            Message({
-              type: 'info',
-              message: '已取消，将不再记录任何数据操作，除非重新登录'
-            })
-          })
-      } else if (data.status !== 200 && data.message) {
-        err = new Error(data.message)
-        throw err
-      } else {
-        return data
-      }
+      return data
     } else {
       err = new Error(JSON.stringify(res.data))
       throw err
@@ -137,55 +76,10 @@ export default class API {
    */
   _reqFail(res) {
     let err = null
-    if (res.response) {
-      if (res.response.data) {
-        if (
-          !/\/getinfo$/gi.test(res.config.url) &&
-          res.response.data.status === 403
-        ) {
-          MessageBox.confirm('登录状态已过期, 请重新登录。', '提示', {
-            confirmButtonText: '确定',
-            // cancelButtonText: '取消',
-            type: 'warning',
-            showClose: false,
-            closeOnPressEscape: false,
-            closeOnClickModal: false,
-            showCancelButton: false
-          })
-            .then(() => {
-              /* 重新刷新当前页 */
-              window.location.reload()
-            })
-            .catch(() => {
-              this.$message({
-                type: 'info',
-                message: '已取消，将不再记录任何数据操作，除非重新登录'
-              })
-            })
-        }
-        err = new Error(res.response.data.message)
-      } else if (
-        res.response.data.status === 401 &&
-        res.response.data.message
-      ) {
-        MessageBox.confirm(res.response.data.message, '提示', {
-          confirmButtonText: '关闭',
-          // cancelButtonText: '取消',
-          type: 'warning',
-          showClose: false,
-          closeOnPressEscape: false,
-          closeOnClickModal: false,
-          showCancelButton: false
-        }).then(() => {
-          /* 重新刷新当前页 */
-          window.location.reload()
-        })
-      } else {
-        /* 错误处理，服务端非正常返回 */
-        err = new Error(JSON.stringify(res.response))
-      }
-    } else if (res.code === 'ECONNABORTED') {
+    if (res.code === 'ECONNABORTED') {
       err = new Error('网络超时，请稍后重试')
+    } else if (res.response) {
+      err = new Error(JSON.stringify(res.response))
     } else {
       err = new Error('msg:' + res.message + 'stack:' + res.stack)
       err.code = 500
@@ -196,24 +90,21 @@ export default class API {
 
   /* 重新实现 get请求 */
   get(url, data, config) {
-    return this._request(
-      _.assignIn({ url, method: 'GET', params: data }, config)
-    )
+    return this._request(_.assignIn({ url, method: 'GET', params: data }, config))
   }
+
   /* 重新实现 post请求 */
   post(url, data, config) {
-    return this._request(
-      _.assignIn({ url, method: 'POST', data: data }, config)
-    )
+    return this._request(_.assignIn({ url, method: 'POST', data: data }, config))
   }
+
   /* 重新实现 put请求 */
   put(url, data, config) {
     return this._request(_.assignIn({ url, method: 'PUT', data: data }, config))
   }
+
   /* 重新实现 delete请求 */
   delete(url, data, config) {
-    return this._request(
-      _.assignIn({ url, method: 'DELETE', params: data }, config)
-    )
+    return this._request(_.assignIn({ url, method: 'DELETE', params: data }, config))
   }
 }

src/api/my.js

+import BaseAPI from '@/api/base_api'
+
+const httpRequest = new BaseAPI(webConf)
+
+const projectId = webConf.others.projectId
+/**
+ * 获取用户信息
+ */
+export function getUser() {
+  return httpRequest.get('/passport/account/get-user-info')
+}
+
+/**
+ * 修改用户信息
+ */
+export function updateUser(data) {
+  return httpRequest.post('/usercenter/user/update-user', data)
+}
+
+/**
+ * 修改密码
+ */
+export function updatePassword(data) {
+  return httpRequest.post('/usercenter/user/update-pwd', data)
+}
+
+/**
+ * 发送验证码
+ */
+export function sendCode(data) {
+  return httpRequest.post('/usercenter/user/send-code', data)
+}
+
+/**
+ * 获取报名信息
+ */
+export function getApplication(params) {
+  return httpRequest.get(`/enrollment/v1.0/application-materials/${projectId}`, params)
+}
+/**
+ * 获取报名信息
+ */
+export function updateApplication(data) {
+  return httpRequest.post(`/enrollment/v1.0/application-materials/${projectId}/put`, data, {
+    headers: { 'Content-Type': 'application/json' }
+  })
+}
+
+/**
+ * 获取报名审核状态
+ */
+export function getApplicationStatus() {
+  return httpRequest.get(`/enrollment/v1.0/application-materials/profile/${projectId}`)
+}
+
+/**
+ * 获取支付二维码
+ */
+export function getOrder(params) {
+  return httpRequest.get(
+    `/enrollment/v1.0/application-materials/payment-records/request/${projectId}/APPLICATION_FEE`,
+    params
+  )
+}
+
+/**
+ * 检查支付状态
+ */
+export function checkPay(id, params) {
+  return httpRequest.get(
+    `/enrollment/v1.0/application-materials/payment-records/check-status/${projectId}/APPLICATION_FEE/${id}`,
+    params
+  )
+}
+
+/**
+ * 写推荐信
+ */
+export function addLetter(userId, letterId, data) {
+  return httpRequest.post(
+    `/enrollment/v1.0/application-materials/reco-letters/submit/${projectId}/${userId}/${letterId}/put`,
+    data,
+    {
+      headers: { 'Content-Type': 'application/json' }
+    }
+  )
+}
+
+/**
+ * 更换推荐人
+ */
+export function updateProvider(letterId, data) {
+  return httpRequest.post(
+    `/enrollment/v1.0/application-materials/reco-letters/change-provider/${projectId}/${letterId}/put`,
+    data,
+    {
+      headers: { 'Content-Type': 'application/json' }
+    }
+  )
+}
+/**
+ * 再次邀请
+ */
+export function sendToProvider(letterId) {
+  return httpRequest.get(
+    `/enrollment/v1.0/application-materials/reco-letters/send-invitation-to-provider/${projectId}/${letterId}`
+  )
+}
+/**
+ * 退出登录
+ */
+export function logout() {
+  return httpRequest.get('/passport/rest/logout')
+}

src/app.vue

+<template>
+  <div id="app">
+    <router-view />
+  </div>
+</template>

src/components/Logo.vue

-<template>
-  <svg class="NuxtLogo" width="245" height="180" viewBox="0 0 452 342" xmlns="http://www.w3.org/2000/svg">
-    <g fill="none" fill-rule="evenodd">
-      <path
-        d="M139 330l-1-2c-2-4-2-8-1-13H29L189 31l67 121 22-16-67-121c-1-2-9-14-22-14-6 0-15 2-22 15L5 303c-1 3-8 16-2 27 4 6 10 12 24 12h136c-14 0-21-6-24-12z"
-        fill="#00C58E"
-      />
-      <path
-        d="M447 304L317 70c-2-2-9-15-22-15-6 0-15 3-22 15l-17 28v54l39-67 129 230h-49a23 23 0 0 1-2 14l-1 1c-6 11-21 12-23 12h76c3 0 17-1 24-12 3-5 5-14-2-26z"
-        fill="#108775"
-      />
-      <path
-        d="M376 330v-1l1-2c1-4 2-8 1-12l-4-12-102-178-15-27h-1l-15 27-102 178-4 12a24 24 0 0 0 2 15c4 6 10 12 24 12h190c3 0 18-1 25-12zM256 152l93 163H163l93-163z"
-        fill="#2F495E"
-        fill-rule="nonzero"
-      />
-    </g>
-  </svg>
-</template>
-<style>
-.NuxtLogo {
-  animation: 1s appear;
-}
-
-@keyframes appear {
-  0% {
-    opacity: 0;
-  }
-  100% {
-    opacity: 1;
-  }
-}
-</style>

src/components/SignUp.vue

-<template>
-  <div class="content-box">
-    <div class="content">
-      <div class="menu">
-        <div v-for="(item, value) in list" :key="value">
-          <router-link :to="item.url">
-            <div class="li">{{ item.name }}</div>
-          </router-link>
-          <div v-if="item.child" class="list-child">
-            <div class="list-child-title">必填项</div>
-            <router-link v-for="(idx, val) in item.child" :key="val" :to="idx.url">
-              <div class="child-li">{{ idx.name }}</div>
-            </router-link>
-          </div>
-        </div>
-      </div>
-      <div class="fill">
-        <slot></slot>
-      </div>
-    </div>
-  </div>
-</template>
-
-<script>
-export default {
-  props: ['menu'],
-  data: function () {
-    return {
-      list: this.menu,
-    }
-  },
-}
-</script>
-<style lang="scss" scoped>
-@import '../assets/css/ProjectContent';
-a {
-  display: block;
-}
-.list-li {
-  font-size: 18px;
-}
-.child-li {
-  height: 34px;
-  line-height: 34px;
-}
-.list-child-title {
-  padding-top: 20px;
-  padding-bottom: 10px;
-}
-</style>

src/components/before/globalVariable.js

 export default class GlobalVariable {
   /* 初始化函数，传入整个Vue对象 */
-  init (Vue, obj) {
+  init(Vue, obj) {
     this.setInitSiderbarVar(Vue, obj)
     this.setInitUserInfo(Vue)
   }
@@ -8,7 +8,7 @@ export default class GlobalVariable {
    * 定义siderbar 初始变量
    * 目的：刷新页面时，定位siderbar位置
    */
-  setInitSiderbarVar (Vue, obj) {
+  setInitSiderbarVar(Vue, obj) {
     let _$ = Vue.prototype.$GlobalVariable
     if (/^\/app\//g.test(obj.to.path)) {
       _$['siderbar'] = {
@@ -19,7 +19,7 @@ export default class GlobalVariable {
   /**
    * 定义 UserInfo 初始化用户信息，判断是否登录等
    */
-  setInitUserInfo (Vue) {
+  setInitUserInfo(Vue) {
     let _$ = Vue.prototype.$GlobalVariable
     if (!_$.UserInfo) {
       _$.UserInfo = {}

src/components/countdown.vue

+<template>
+  <el-button v-bind="$attrs" :disabled="currentDisabled" @click="start">{{ curretnValue }}</el-button>
+</template>
+
+<script>
+export default {
+  name: 'Countdown',
+  props: {
+    step: { type: Number, default: 1000 },
+    disabled: { type: Boolean, default: false },
+    seconds: { type: Number, default: 60 },
+    defaultValue: { type: String, default: '获取验证码' }
+  },
+  data() {
+    return {
+      currentDisabled: false,
+      currentSeconds: 0,
+      timer: null
+    }
+  },
+  watch: {
+    disabled: {
+      immediate: true,
+      handler(value) {
+        this.currentDisabled = value
+      }
+    }
+  },
+  computed: {
+    curretnValue() {
+      const longTime = this.seconds - this.currentSeconds
+      return longTime < this.seconds ? `${longTime}秒后重发` : this.defaultValue
+    }
+  },
+  methods: {
+    genTimer() {
+      this.clearTimer()
+      this.timer = setInterval(() => {
+        this.currentSeconds++
+        if (this.currentSeconds === this.seconds) {
+          this.stop()
+        }
+      }, this.step)
+    },
+    clearTimer() {
+      this.timer && clearInterval(this.timer)
+    },
+    start() {
+      this.currentDisabled = true
+      this.genTimer()
+      this.$emit('start')
+    },
+    stop() {
+      this.clearTimer()
+      this.currentSeconds = 0
+      this.currentDisabled = false
+      this.$emit('stop')
+    }
+  }
+}
+</script>

src/components/layout/footer.vue

+<template>
+  <div class="app-footer">
+    <div class="app-footer-main">
+      <div class="inner">
+        <div class="left">
+          <img src="../../assets/img/head/ezijing-logo2.png" class="logo" />
+          <ul class="menu">
+            <li v-for="item in menuList" :key="item.href">
+              <a :href="item.href" target="_blank">{{ item.title }}</a>
+            </li>
+          </ul>
+        </div>
+        <div class="right">
+          <div class="contact">
+            <h3>联系我们</h3>
+            <p>
+              清控紫荆教育<br />
+              中国未来金融领袖计划<br />
+              电话：010-62793909<br />
+              E-mail：chinafflg@ezijing.com<br />
+              地址：北京市海淀区中关村东路1号院7号楼5层<br />
+              邮编：100000
+            </p>
+          </div>
+          <div class="qrcode">
+            <img src="https://zws-imgs-pub.ezijing.com/static/public/29ce10d35376f24ae1ecaccd57215d5c.jpg" alt="" />
+            <p>扫二维码关注官方微信</p>
+            <p>微信公众号zijingedu</p>
+          </div>
+        </div>
+      </div>
+    </div>
+    <div class="copyright">
+      <div class="inner"><p>版权所有@清控紫荆</p></div>
+    </div>
+  </div>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      menuList: [
+        { title: '中国教育部', href: 'http://www.moe.gov.cn/' },
+        { title: '中国涉外教育监管网', href: 'http://jsj.moe.gov.cn/' },
+        { title: '印第安纳大学', href: 'https://www.indiana.edu/' },
+        { title: 'Kelley商学院', href: 'https://kelley.iu.edu/' },
+        { title: '紫荆教育', href: 'https://www.ezijing.com/' }
+      ]
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.app-footer {
+  .inner {
+    max-width: 970px;
+    margin: 0 auto;
+  }
+  .app-footer-main {
+    padding: 40px 0;
+    color: #a7a7a7;
+    background-color: #212223;
+    .inner {
+      display: flex;
+      justify-content: space-between;
+      align-items: center;
+    }
+  }
+  .menu {
+    margin-top: 10px;
+    line-height: 30px;
+    font-size: 12px;
+    color: #7d7d7d;
+  }
+  .right {
+    display: flex;
+  }
+  .contact {
+    h3 {
+      font-size: 16px;
+      color: #fff;
+      line-height: 1;
+      margin-bottom: 15px;
+    }
+    p {
+      font-size: 12px;
+      color: #a7a7a7;
+      line-height: 24px;
+    }
+  }
+  .qrcode {
+    width: 128px;
+    margin-left: 80px;
+    img {
+      width: 100%;
+    }
+    p {
+      font-size: 12px;
+      color: #a7a7a7;
+      text-align: center;
+      line-height: 20px;
+    }
+  }
+  .copyright {
+    height: 40px;
+    line-height: 40px;
+    color: #fff;
+    background: #ccc;
+  }
+}
+</style>

src/components/layout/header.vue

+<template>
+  <header class="app-header">
+    <section class="app-header-bar">
+      <div class="inner">
+        <div class="login">
+          <template v-if="isLogin">
+            <div>{{ user.nickname }}</div>
+            <span>|</span>
+            <div @click="handleLogout">退出</div>
+          </template>
+          <template v-else>
+            <div @click="handleRegister">注册</div>
+            <span>|</span>
+            <div @click="handleLogin">登录</div>
+          </template>
+        </div>
+      </div>
+    </section>
+    <section class="app-header-main">
+      <div class="hd">
+        <div class="hd-left">
+          <a href="/"><img src="../../assets/img/head/ezijing-logo.png" class="logo" /></a>
+          <h1 class="title">{{ title }}</h1>
+        </div>
+        <div class="hd-right">
+          <img src="../../assets/img/head/kelley-logo.png" />
+        </div>
+      </div>
+      <div class="bd">
+        <ul class="nav">
+          <li v-for="item in navList" :key="item.path">
+            <router-link :to="item.path">{{ item.title }}</router-link>
+          </li>
+        </ul>
+        <div class="search">
+          <div class="lang">EN</div>
+          <input type="text" placeholder="Search" class="search-input" />
+          <div class="search-button">搜索</div>
+        </div>
+      </div>
+    </section>
+    <vue-passport ref="passport" @ready="onReady" :options="options"></vue-passport>
+  </header>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      title: '中国未来金融领袖计划',
+      navList: [
+        { title: '首页', path: '/index' },
+        { title: '项目介绍', path: '/project' },
+        { title: '视频中心', path: '/videoCenter' },
+        { title: '招生信息', path: '/recruit' },
+        { title: '教学模块', path: '/teaching' },
+        { title: '师生风采', path: '/presence' },
+        { title: '职业发展', path: '/careerDev' },
+        { title: '校友工作', path: '/alumniWork' }
+      ],
+      isLogin: false,
+      user: null,
+      options: {
+        login: {
+          account: {
+            onSuccess: this.loginSuccess
+          },
+          phone: {
+            onSuccess: this.loginSuccess
+          }
+        }
+      }
+    }
+  },
+  computed: {
+    passport() {
+      return this.$refs.passport
+    }
+  },
+  watch: {
+    $route(route) {
+      if (route.query.needLogin) {
+        this.handleLogin()
+      }
+    }
+  },
+  methods: {
+    handleLogin() {
+      this.passport.login()
+    },
+    handleRegister() {
+      this.passport.register()
+    },
+    handleLogout() {
+      this.passport.logout()
+      this.isLogin = false
+      window.G.UserInfo = {}
+      this.$router.push('/')
+    },
+    onReady(isLogin, user = {}) {
+      this.isLogin = isLogin
+      this.user = user
+      window.G.UserInfo = user
+    },
+    loginSuccess(data) {
+      this.passport.checkLoginStatus((isLogin, user = {}) => {
+        this.isLogin = isLogin
+        this.user = user
+        this.$router.push('/my')
+      })
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.app-header {
+  background-color: #fff;
+  .inner {
+    max-width: 970px;
+    margin: 0 auto;
+  }
+}
+.app-header-bar {
+  height: 40px;
+  background-color: #333;
+  .login {
+    float: right;
+    display: flex;
+    line-height: 40px;
+    color: #fff;
+    div {
+      font-size: 18px;
+      text-align: center;
+      cursor: pointer;
+    }
+    span {
+      padding: 0 20px;
+    }
+  }
+}
+.app-header-main {
+  max-width: 970px;
+  margin: 0 auto;
+  .hd {
+    height: 110px;
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+  }
+  .hd-left {
+    display: flex;
+    justify-content: center;
+    align-items: center;
+  }
+  .logo {
+    width: 156px;
+    height: 50px;
+  }
+  .title {
+    margin-left: 20px;
+    padding: 0 10px;
+    color: #222;
+    font-size: 20px;
+    line-height: 33px;
+    font-weight: 600;
+    border-left: 2px solid #333;
+  }
+  .bd {
+    margin-top: -20px;
+    padding: 10px 0;
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+  }
+  .nav {
+    display: flex;
+    li {
+      font-size: 15px;
+      font-weight: 600;
+      color: #222;
+      line-height: 20px;
+      padding: 0 14px;
+      a {
+        position: relative;
+      }
+      &:first-child {
+        padding-left: 0;
+      }
+    }
+    li + li {
+      border-left: 1px solid #d7d8d9;
+    }
+  }
+  .router-link-active:after {
+    content: '';
+    position: absolute;
+    left: 0;
+    right: 0;
+    bottom: -3px;
+    height: 2px;
+    background: #bf0927;
+  }
+  .search {
+    display: flex;
+    align-items: center;
+  }
+  .lang {
+    font-size: 15px;
+    color: #999;
+  }
+  .search-input {
+    outline: none;
+    width: 159px;
+    height: 34px;
+    border-radius: 4px;
+    border: 1px solid #ccc;
+    margin: 0 3px 0 8px;
+    padding-left: 13px;
+    font-size: 15px;
+    color: #999;
+  }
+  .search-button {
+    width: 54px;
+    height: 34px;
+    border-radius: 4px;
+    border: 1px solid #ccc;
+    font-size: 15px;
+    color: #999;
+    text-align: center;
+    line-height: 34px;
+    cursor: pointer;
+  }
+}
+</style>

src/components/layout/index.vue

+<template>
+  <div class="app-layout">
+    <app-header />
+    <app-main />
+    <app-footer v-if="hasFooter" />
+  </div>
+</template>
+
+<script>
+import AppHeader from './header'
+import AppMain from './main'
+import AppFooter from './footer'
+export default {
+  props: {
+    hasFooter: { type: Boolean, default: true }
+  },
+  components: { AppHeader, AppMain, AppFooter }
+}
+</script>

src/components/layout/main.vue

+<template>
+  <div class="app-main">
+    <router-view />
+  </div>
+</template>

src/components/login/code/code.vue

-<template>
-  <el-row type="flex" justify="center">
-    <el-col :xs="24" :sm="18" :md="12" :lg="9" :xl="6">
-      <el-form ref="setAccountform" :model="setAccount" :rules="accountRules">
-        <el-form-item prop="user">
-          <el-input class="self-input" v-model="setAccount.user" type="text" placeholder="手机号" @keyup.enter.native="onSubmitSetAccount">
-          </el-input>
-        </el-form-item>
-        <el-form-item prop="pwd">
-          <el-input v-model="setAccount.pwd" :disabled="isSendDisable" type="text" placeholder="短信验证码" @keyup.enter.native="onSubmitSetAccount">
-            <el-button slot="suffix" size="mini" :disabled="isSendDisable || isSendCode" @click="sendCode">{{sendBtnText}}</el-button>
-          </el-input>
-        </el-form-item>
-        <el-form-item>
-          <el-button type="primary" class="login-btn" @click="onSubmitSetAccount">登录</el-button>
-        </el-form-item>
-        <div class="text">
-          <span class="code-login">
-            <template v-if="query.rd">
-              <router-link class="router-link-class" active-class="router-link-active-class" :to="{ path: '/login/index?rd=' + query.rd }">密码登录</router-link>
-            </template>
-            <template v-else>
-              <router-link class="router-link-class" active-class="router-link-active-class" :to="{ name: 'normalLogin' }">密码登录</router-link>
-            </template>
-          </span>
-          <span class="forget-pwd">
-            <template v-if="query.rd">
-              <router-link class="router-link-class" active-class="router-link-active-class" :to="{ path: '/login/forget?rd=' + query.rd }">忘记密码</router-link>
-            </template>
-            <template v-else>
-              <router-link class="router-link-class" active-class="router-link-active-class" :to="{ name: 'forgetPwd' }">忘记密码</router-link>
-            </template>
-          </span>
-        </div>
-      </el-form>
-    </el-col>
-  </el-row>
-</template>
-
-<script>
-import { request } from '@action'
-
-export default {
-  props: {
-    params: { type: Object, required: false, default: {} },
-    query: { type: Object, required: false, default: {} }
-  },
-  data () {
-    /* 账号输入正确时，才能获取验证码 */
-    let checkAccount = (rule, value, callback) => {
-      /* 手机格式 */
-      if (/^1[3-9]\d{9}$/.test(value)) {
-        this.isSendDisable = false
-        callback()
-      } else {
-        this.isSendDisable = true
-        callback(new Error('请输入正确格式的手机号'))
-      }
-    }
-    return {
-      isSendDisable: true, // 是否可以发送
-      isSendCode: false, // 是否已发送验证码
-      timeInterval: null, // 定时器，倒计时
-      sendBtnText: '发送验证码', // 按钮 文字
-      setAccount: {},
-      accountRules: {
-        'user': [
-          { required: true, message: '请输入手机号', trigger: 'blur' },
-          { validator: checkAccount, trigger: 'change' }
-        ],
-        'pwd': [
-          { required: true, message: '请输入短信验证码', trigger: 'blur' }
-        ]
-      }
-    }
-  },
-  beforeDestroy () { /* 清空倒计时 */ this.clearTime() },
-  methods: {
-    /* 发送验证码 */
-    sendCode () {
-      if (!this.isSendCode) {
-        // const loading = this.$loading({ lock: true, text: '', spinner: '', background: 'rgba(255, 255, 255, 0.9)' })
-        request({
-          component: this,
-          actionName: 'loginAction',
-          functionName: 'sendCode',
-          data: {
-            mobile: this.setAccount.user
-          },
-          thenCallback: res => {
-            if (res.status === 200) {
-              /* 发送验证码不管是否成功，都开始倒计时 */
-              let time = 60
-              this.isSendCode = true
-              this.sendBtnText = '60s后重发'
-              this.timeInterval = setInterval(() => {
-                if (time-- > 0) {
-                  this.sendBtnText = time + 's后重发'
-                } else {
-                  this.isSendCode = false
-                  this.sendBtnText = '发送验证码'
-                  clearInterval(this.timeInterval)
-                }
-              }, 1000)
-            } else {
-              return new Error(JSON.stringify(res))
-            }
-          },
-          catchCallback: e => {},
-          finallyCallback: () => {}
-        })
-      }
-    },
-    /* 清空倒计时 */
-    clearTime () {
-      this.isSendCode = true
-      this.sendBtnText = '发送验证码'
-      clearInterval(this.timeInterval)
-    },
-    onSubmitSetAccount () {
-      this.$refs['setAccountform'].validate((valid) => {
-        if (valid) {
-          request({
-            component: this,
-            actionName: 'loginAction',
-            functionName: 'codeLogin',
-            data: {
-              mobile: this.setAccount.user,
-              code: this.setAccount.pwd
-            },
-            thenCallback: data => {
-              /* 查询上次跳转信息，并跳转回去 */
-              if (this.query.rd) {
-                this.$router.push({ path: decodeURIComponent(this.query.rd) })
-              } else {
-                this.$router.push({ path: '/' })
-              }
-            },
-            catchCallback: e => {},
-            finallyCallback: () => {}
-          })
-        } else {
-          this.$message.error('请根据输入框提示，检查输入项。')
-          return false
-        }
-      })
-    }
-  }
-}
-</script>

src/components/login/login.css

-.p-con { position: relative; width: 100%; height: 70%; background: #8e8e8e; color: #535353; text-align: center; }
-/* 头部 */
-.p-con .hd { position: absolute; top: 0; left: 0; right: 0; background: #ffffff; }
-.p-con .hd img { display: block; margin: 0 auto; padding: 0.3rem 0 0.1rem 0; }
-.p-con .hd .txt { margin: 0 auto; padding: 0 0 0.2rem 0; letter-spacing: 0.05rem; font-size: 0.32rem; font-weight: 700; }
-/* 底部 */
-.p-con .ft { position: fixed; bottom: 0; left: 0; right: 0; padding: 0.4rem 0 0.1rem 0; background: #e5e5e5; }
-.p-con .ft .num { font-size: 0.14rem; line-height: 1.5; }
-.p-con .ft .time { font-size: 0.14rem; line-height: 1.5; }
-.p-con .ft .txt { padding: 0.1rem; color: #898989; font-size: 0.12rem; line-height: 1.5; }
-/* 中间部分 */
-.p-con .bd { position: relative; /* padding: 1.45rem 0 1.3rem 0; */ margin: 0 auto; height: 100%; /* min-height: 6rem; */ box-sizing: border-box; }
-.p-con .bd .router-link-class { color: #ffffff; text-decoration: none; }
-
-/* normal 登录 */
-.p-con .bd .top50 { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); }
-.p-con .bd .top50 img { display: block; margin: 0 auto; }
-.p-con .bd .top50 .login-btn { margin-top: 0.1rem; background: #ffffff; border-color: #ffffff; color: #000; width: 100%; }
-.p-con .bd .top50 .text { margin-top: -16px; color: #e5e5e5; font-size: 16px; line-height: 1.5; overflow: hidden; }
-.p-con .bd .top50 .text .code-login { float: left; cursor: pointer; }
-.p-con .bd .top50 .text .forget-pwd { float: right; cursor: pointer; }
-
-/* forget 登录 */
-.step1 { font-size: 0.16rem; width: 71%; margin: 0.6rem auto 0 auto; }
-.step1 .go-back { margin-top: 0.2rem; text-align: left; }
-.step2 { width: 71%; margin: 0.6rem auto 0 auto; }
-.step2 .txt { margin-bottom: 0.3rem; font-size: 0.16rem; color: #ffffff; text-align: left; }
-.step2 .el-form-item__label { font-size: 0.16rem; color: #ffffff; }
-.step2 .operate { margin-top: 0.2rem; }
-.step3 { width: 68%; margin: 0.6rem auto 0 auto; }
-.step3 .el-form-item:last-child { margin-bottom: 0; }
-.step3 .el-form-item__label { font-size: 0.16rem; color: #ffffff; text-align: left; }
-
-/* Extra small devices (portrait phones, less than 576px) */
-@media (max-width: 575px) {
-  html { font-size: 80px; }
-  .step3 { width: 90%; }
-}
-
-/* Small devices (landscape phones, 576px and up) */
-@media (min-width: 576px) and (max-width: 767px) {
-  html { font-size: 80px; }
-  .step3 { width: 80%; }
-}
-
-/* Medium devices (tablets, 768px and up) */
-@media (min-width: 768px) and (max-width: 991px) {
-  html { font-size: 80px; }
-}
-
-/* Large devices (desktops, 992px and up) */
-@media (min-width: 992px) and (max-width: 1199px) {
-  html { font-size: 90px; }
-}
-
-/* Extra large devices (large desktops, 1200px and up) */
-@media (min-width: 1200px) {
-  html { font-size: 100px; }
-}

src/components/login/login.vue

-<template>
-<div class="p-con">
-  <div class="bd">
-    <div class="top50 container">
-      <router-view></router-view>
-    </div>
-  </div>
-</div>
-</template>
-
-<style lang="scss" scoped>
-/* 这部分 架构 样式 基于 bootstrap - 4.1.3 栏删格系统 */
-  /* 由于压缩后 样式覆盖不上，直接采用 css方式 */
-  @import './login.css';
-</style>

src/components/login/normal/normal.vue

-<template>
-  <el-row type="flex" justify="center">
-    <el-col :xs="24" :sm="18" :md="12" :lg="9" :xl="6">
-      <el-form ref="setAccountform" :model="setAccount" :rules="accountRules">
-        <el-form-item prop="user">
-          <el-input class="self-input" v-model="setAccount.user" type="text" placeholder="手机/邮箱" @keyup.enter.native="onSubmitSetAccount">
-            <i slot="prefix" class="el-input__icon el-icon-self-character"></i>
-          </el-input>
-        </el-form-item>
-        <el-form-item prop="pwd">
-          <el-input v-model="setAccount.pwd" type="password" placeholder="密码" @keyup.enter.native="onSubmitSetAccount">
-            <i slot="prefix" class="el-input__icon el-icon-self-mima"></i>
-          </el-input>
-        </el-form-item>
-        <el-form-item>
-          <el-button type="primary" class="login-btn" @click="onSubmitSetAccount">登录</el-button>
-        </el-form-item>
-        <div class="text">
-          <span class="code-login">
-            <template v-if="query.rd">
-              <router-link class="router-link-class" active-class="router-link-active-class" :to="{ path: '/login/code?rd=' + query.rd }">验证码登录</router-link>
-            </template>
-            <template v-else>
-              <router-link class="router-link-class" active-class="router-link-active-class" :to="{ name: 'codeLogin' }">验证码登录</router-link>
-            </template>
-          </span>
-          <span class="forget-pwd">
-            <template v-if="query.rd">
-              <router-link class="router-link-class" active-class="router-link-active-class" :to="{ path: '/login/forget?rd=' + query.rd }">忘记密码</router-link>
-            </template>
-            <template v-else>
-              <router-link class="router-link-class" active-class="router-link-active-class" :to="{ name: 'forgetPwd' }">忘记密码</router-link>
-            </template>
-          </span>
-        </div>
-      </el-form>
-    </el-col>
-  </el-row>
-</template>
-
-<script>
-import { request } from '@action'
-
-import Base64 from 'Base64'
-
-export default {
-  props: {
-    params: { type: Object, required: false, default: {} },
-    query: { type: Object, required: false, default: {} }
-  },
-  data () {
-    return {
-      setAccount: {},
-      accountRules: {
-        'user': [
-          { required: true, message: '请输入账号', trigger: 'blur' },
-          { pattern: /^(1[3-9]\d{9}|[\w\.]+@\w+(\.\w+)+)$/, message: '请输入正确格式的手机号/邮箱', trigger: 'change' } // eslint-disable-line
-        ],
-        'pwd': [
-          { required: true, message: '请输入密码', trigger: 'blur' }
-        ]
-      }
-    }
-  },
-  methods: {
-    onSubmitSetAccount () {
-      this.$refs['setAccountform'].validate((valid) => {
-        if (valid) {
-          request({
-            component: this,
-            actionName: 'loginAction',
-            functionName: 'userLogin',
-            data: {
-              login_name: this.setAccount.user,
-              password: this.$md5('uokoaduw' + this.setAccount.pwd.split('').reverse().join('') + 'auhgniq'),
-              pwd: Base64.encode('uokoaduw' + this.setAccount.pwd.split('').reverse().join('') + 'auhgniq') // 追加上 密码
-            },
-            thenCallback: res => {
-              /* 查询上次跳转信息，并跳转回去 */
-              if (this.query.rd) {
-                this.$router.push({ path: decodeURIComponent(this.query.rd) })
-              } else {
-                window.G.pwd = Base64.encode('uokoaduw' + this.setAccount.pwd.split('').reverse().join('') + 'auhgniq')
-                this.$router.push({ path: '/' })
-              }
-              /* 重置账号、密码 */
-              // this.$refs['setAccountform'].resetFields()
-            },
-            catchCallback: () => {},
-            finallyCallback: () => {}
-          })
-        } else {
-          this.$message.error('请根据输入框提示，检查输入项。')
-          return false
-        }
-      })
-    }
-  }
-}
-</script>

src/components/signup/enrol/treaty.vue

-<template>
-  <div>
-    <h3>入学协议</h3>
-    <div>
-      <input type="file"/>
-    </div>
-    <div>尚未上传文件</div>
-    <p>申请者可将签字后的入学协议原件扫描或拍照后提交。<br/>
-学员应仔细阅读《入学协议》以及课程介绍，如对入学协议或课程有异议，请第一时间与课程顾问咨询确认。<br/>
-请用A4纸打印后，在入学协议上签上姓名和日期，内容需显示完整、格式整齐、字迹清晰可辨。<br/>
-上传文件仅限“jpg,jpeg,pdf,png”格式，文件小于10Mb。</p>
-  </div>
-</template>

src/main.js

@@ -4,10 +4,11 @@ import '@ezijing/vue-form/dist/vue-form.css'
 import VuePassport from '@ezijing/vue-passport'
 import '@ezijing/vue-passport/dist/vue-passport.css'
 import Element from 'element-ui' // 引入 element-ui 框架
-import './components/style/_com.scss' // 定义 element-ui主题色 + 公共样式
-import VueRouter from 'vue-router' // 使用 vue-router
-import createRouter from './router' // router定义
-import Main from './main.vue' // 初始化 vue页面
+import './style.scss' // 定义 element-ui主题色 + 公共样式
+import router from './router' // router定义
+import store from './store'
+import App from './app.vue'
+
 // import cTool from '@tool'
 /* 引入 md5 */
 import md5 from 'js-md5'
@@ -15,10 +16,8 @@ import md5 from 'js-md5'
 import BeforeRouter from './components/before'
 
 Vue.use(Element)
-Vue.use(VueRouter)
 Vue.use(VueForm)
 Vue.use(VuePassport)
-const router = createRouter()
 /* 设置全局变量 */
 window.G = Vue.prototype.$GlobalVariable = {
   VERSION: 'PC-1.5.6'
@@ -47,6 +46,7 @@ Vue.prototype.VueEvent = new Vue()
 // Vue.prototype.jq = $
 
 new Vue({
+  store,
   router,
-  render: h => h(Main)
+  render: h => h(App)
 }).$mount('#app')

src/pages/README.md

-# PAGES
-
-This directory contains your Application Views and Routes.
-The framework reads all the `*.vue` files inside this directory and creates the router of your application.
-
-More information about the usage of this directory in [the documentation](https://nuxtjs.org/guide/routing).
-
-----------------------
-- recruit 招生文件夹

src/pages/index.vue

-<script>
-import Index from './_lang/index.vue'
-export default Index
-</script>

src/pages/letter/index.vue

+<template>
+  <div class="letter">
+    <header class="header">
+      <div class="inner">
+        <div class="logo">
+          <router-link to="/"><img src="../../assets/img/head/ezijing-logo.png" /></router-link>
+        </div>
+      </div>
+    </header>
+    <nav class="nav"><h1 class="title">中国未来金融领袖计划项目推荐信</h1></nav>
+    <section class="content">
+      <el-form
+        :model="ruleForm"
+        :rules="rules"
+        ref="form"
+        label-width="100px"
+        :label-position="labelPosition"
+        @submit.native.prevent
+        style="max-width: 680px"
+      >
+        <el-form-item label="姓名" prop="provider_name">
+          <el-input v-model.trim="ruleForm.provider_name"></el-input>
+        </el-form-item>
+        <el-form-item label="推荐信内容" prop="letter_content">
+          <el-input type="textarea" :autosize="{ minRows: 6 }" v-model.trim="ruleForm.letter_content"></el-input>
+        </el-form-item>
+        <el-form-item label="手机号" prop="provider_phone_number">
+          <el-input v-model.trim="ruleForm.provider_phone_number"></el-input>
+        </el-form-item>
+        <el-form-item label="工作单位" prop="provider_company_name">
+          <el-input v-model.trim="ruleForm.provider_company_name"></el-input>
+        </el-form-item>
+        <el-form-item label="职务" prop="provider_job_title">
+          <el-input v-model.trim="ruleForm.provider_job_title"></el-input>
+        </el-form-item>
+      </el-form>
+      <div class="buttons">
+        <el-button type="primary" @click="handleSubmit">确认提交</el-button>
+      </div>
+    </section>
+
+    <el-dialog title="推荐信提交成功" :visible.sync="dialogVisible" :center="true" width="348px">
+      <div style="text-align: center"><img src="../../assets/images/icon_success.png" /></div>
+      <template #footer>
+        <el-button type="primary" @click="toHome">了解项目</el-button>
+      </template>
+    </el-dialog>
+  </div>
+</template>
+
+<script>
+import * as api from '@/api/my'
+
+export default {
+  name: 'LetterIndex',
+  data() {
+    return {
+      ruleForm: {
+        provider_name: '',
+        letter_content: '',
+        provider_phone_number: '',
+        provider_company_name: '',
+        provider_job_title: ''
+      },
+      rules: {
+        provider_name: [{ required: true, message: '请输入姓名', trigger: 'blur' }],
+        letter_content: [{ required: true, message: '请输入推荐信内容', trigger: 'blur' }],
+        provider_phone_number: [{ required: true, message: '请输入手机号', trigger: 'blur' }],
+        provider_company_name: [{ required: true, message: '请输入工作单位', trigger: 'blur' }],
+        provider_job_title: [{ required: true, message: '请输入职务', trigger: 'blur' }]
+      },
+      dialogVisible: false,
+      clientWidth: 0
+    }
+  },
+  computed: {
+    userId() {
+      return this.$route.params.userId
+    },
+    letterId() {
+      return this.$route.params.letterId
+    },
+    labelPosition() {
+      return this.clientWidth < 768 ? 'top' : 'left'
+    }
+  },
+  methods: {
+    // 提交
+    handleSubmit() {
+      this.$refs.form.validate().then(() => {
+        this.handleAddRequest()
+      })
+    },
+    // 提交推荐信
+    handleAddRequest() {
+      api.addLetter(this.userId, this.letterId, this.ruleForm).then(response => {
+        console.log(response)
+        const { error, message } = response
+        if (error.toString() === '0') {
+          this.dialogVisible = true
+        } else {
+          this.$message.error(message)
+        }
+      })
+    },
+    toHome() {
+      this.$router.push('/')
+    },
+    getClientWidth() {
+      this.clientWidth = document.body.clientWidth
+    }
+  },
+  mounted() {
+    this.getClientWidth()
+    window.addEventListener('resize', this.getClientWidth)
+  },
+  destroyed() {
+    window.removeEventListener('resize', this.getClientWidth)
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.letter {
+  .header {
+    background-color: #fff;
+    .inner {
+      max-width: 1000px;
+      margin: 0 auto;
+    }
+    .logo {
+      padding: 14px 0;
+      img {
+        height: 50px;
+      }
+    }
+  }
+  .nav {
+    background-color: var(--main-color);
+    .title {
+      font-size: 24px;
+      font-weight: 600;
+      color: #fff;
+      line-height: 60px;
+      text-align: center;
+    }
+  }
+  .content {
+    max-width: 1000px;
+    margin: 20px auto;
+    padding: 20px;
+    background-color: #fff;
+    box-sizing: border-box;
+  }
+  ::v-deep .el-input {
+    max-width: 270px;
+  }
+  ::v-deep .el-form--label-top {
+    .el-form-item__label {
+      line-height: 20px;
+    }
+    .el-input {
+      max-width: 100%;
+    }
+  }
+  ::v-deep .el-input__inner,
+  ::v-deep .el-textarea__inner {
+    border-radius: 0;
+  }
+  .buttons {
+    border-top: 1px solid #f1f1f1;
+    padding: 20px 100px;
+  }
+  @media (max-width: 767px) {
+    .logo {
+      text-align: center;
+    }
+    .buttons {
+      padding: 20px 0;
+      .el-button {
+        width: 100%;
+        display: block;
+      }
+    }
+  }
+}
+</style>

src/pages/my/account/home.vue

+<template>
+  <div class="my">
+    <div class="card">
+      <div class="result">
+        <div class="result-left"><img src="../../../assets/images/my_icon.png" />招生办反馈</div>
+        <div class="result-right">{{ result.submit_status_desc || '未收到报名信息' }}</div>
+      </div>
+    </div>
+    <div class="card" style="min-height: 360px">
+      <ul class="nav">
+        <li @click="toApplication"><img src="../../../assets/images/my_01.png" /></li>
+        <li @click="toInterview"><img src="../../../assets/images/my_02.png" /></li>
+        <li @click="toAdmission"><img src="../../../assets/images/my_03.png" /></li>
+      </ul>
+      <div class="progress">
+        <el-steps :active="activeProgress" finish-status="success" align-center>
+          <el-step v-for="(item, index) in 3" :key="index">
+            <template #title>{{ getProgressStatusText(index) }}</template>
+          </el-step>
+        </el-steps>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+import * as api from '@/api/my'
+export default {
+  name: 'AppHome',
+  data() {
+    return {
+      material: {},
+      progress: {},
+      submissionStage: {
+        0: ['FILLING', 'PREPAYMENT'],
+        1: ['INTERVIEW_APPLICATION', 'AUDITION', 'INTERVIEW', 'PAYMENT'],
+        2: ['REGISTRATION'],
+        3: ['CLOSED']
+      },
+      result: {}
+    }
+  },
+  computed: {
+    activeProgress() {
+      for (const key in this.submissionStage) {
+        const list = this.submissionStage[key]
+        if (list.includes(this.material.submission_stage)) {
+          return parseInt(key)
+        }
+      }
+      return 0
+    }
+  },
+  methods: {
+    // 获取进度值
+    getProgressStatusText(index) {
+      if (this.activeProgress === index) {
+        return '进行中'
+      } else {
+        return this.activeProgress > index ? '已完成' : '待进行'
+      }
+    },
+    // 获取报名信息
+    getApplication() {
+      api.getApplication().then(response => {
+        const { data, error, message } = response
+        if (error.toString() === '0') {
+          const { material, progress } = data
+          this.material = material
+          this.progress = progress
+        } else {
+          this.$message.error(message)
+        }
+      })
+    },
+    // 获取报名审核状态
+    getApplicationStatus() {
+      api.getApplicationStatus().then(response => {
+        this.result = response.data
+      })
+    },
+    // 报名申请
+    toApplication() {
+      this.$router.push('/my/application?active=application_info')
+    },
+    // 申请面试
+    toInterview() {
+      if (this.activeProgress < 1) {
+        this.$message.warning('请完成报名申请并缴报名费')
+        return
+      }
+      this.$router.push('/my/interview')
+    },
+    // 办理入学
+    toAdmission() {
+      if (this.activeProgress < 2) {
+        this.$message.warning('请等待面试结果')
+        return
+      }
+      this.$router.push('/my/admission')
+    }
+  },
+  beforeMount() {
+    this.getApplication()
+    this.getApplicationStatus()
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.card {
+  background: #fff;
+  border-radius: 5px;
+}
+.card + .card {
+  margin-top: 10px;
+}
+.nav {
+  display: flex;
+  justify-content: space-between;
+  padding: 40px 70px 20px;
+  li {
+    position: relative;
+    width: 180px;
+    height: 120px;
+  }
+  a {
+    color: currentColor;
+  }
+  .cover {
+    position: absolute;
+    left: 0;
+    top: 0;
+    right: 0;
+    bottom: 0;
+    font-weight: 600;
+    color: #fff;
+    text-align: center;
+    background-color: rgba(0, 0, 0.5);
+  }
+}
+.result {
+  min-height: 40px;
+  padding: 0 20px;
+  display: flex;
+  align-items: center;
+}
+.result-left {
+  line-height: 14px;
+  color: var(--main-color);
+  img {
+    margin-right: 10px;
+  }
+}
+.result-right {
+  padding-left: 40px;
+  color: #666;
+}
+.progress {
+  margin: 0 40px;
+}
+</style>

src/pages/my/account/index.vue

+<template>
+  <app-layout>
+    <vue-form
+      :menus="menus"
+      :default-active="currentActive"
+      @page-change="handlePageChange"
+      @success="handleSuccess"
+      @error="handleError"
+      @back="$router.push('/my/account')"
+    >
+      <template #aside-append>
+        <div class="aside-logout" @click="$store.dispatch('logout')"><span>退出登录</span></div>
+      </template>
+      <!-- 首页 -->
+      <app-home v-if="currentActive === 'account'" />
+
+      <template #content>
+        <!-- 基本信息 -->
+        <app-info v-if="currentActive === 'account_info'" />
+        <!-- 密码修改 -->
+        <app-password v-if="currentActive === 'account_password'" />
+      </template>
+    </vue-form>
+  </app-layout>
+</template>
+
+<script>
+import AppLayout from '../layout.vue'
+import AppHome from './home.vue'
+import AppInfo from './info.vue'
+import AppPassword from './password.vue'
+export default {
+  components: { AppLayout, AppHome, AppInfo, AppPassword },
+  data() {
+    return {
+      menus: [
+        {
+          id: 'account',
+          title: '个人信息',
+          children: [
+            { id: 'account_info', title: '基本信息' },
+            { id: 'account_password', title: '密码修改' }
+          ]
+        }
+      ],
+      currentActive: 'account'
+    }
+  },
+  watch: {
+    $route: {
+      immediate: true,
+      handler(route) {
+        const { query = {} } = route
+        this.currentActive = query.active || 'account'
+      }
+    }
+  },
+  methods: {
+    handlePageChange(value) {
+      this.currentActive = value
+      this.$router.push({ path: this.$route.path, query: { active: value } })
+      console.log('页面切换了', value)
+    },
+    handleSuccess(data) {
+      console.log('提交成功了', data)
+      this.$message({ type: 'success', message: data.message })
+    },
+    handleError(data) {
+      console.log('提交失败了', data)
+      this.$message({ type: 'error', message: data.message })
+    }
+  }
+}
+</script>

src/pages/my/account/info.vue

+<template>
+  <div>
+    <el-form
+      :model="ruleForm"
+      :rules="rules"
+      ref="form"
+      label-width="100px"
+      @submit.native.prevent
+      style="max-width: 680px"
+    >
+      <el-form-item label="姓名" prop="real_name">
+        <el-input v-model.trim="ruleForm.real_name"></el-input>
+      </el-form-item>
+      <el-form-item label="手机号" prop="mobile">
+        <el-input v-model.trim="ruleForm.mobile"></el-input>
+      </el-form-item>
+      <el-form-item>
+        <el-button type="primary" @click="handleSubmit">确认修改</el-button>
+      </el-form-item>
+    </el-form>
+  </div>
+</template>
+
+<script>
+import * as api from '@/api/my'
+
+export default {
+  name: 'MyInfo',
+  data() {
+    return {
+      ruleForm: {
+        real_name: '',
+        mobile: ''
+      },
+      rules: {
+        real_name: [{ required: true, message: '请输入姓名', trigger: 'blur' }],
+        mobile: [{ required: true, message: '请输入手机号', trigger: 'blur' }]
+      }
+    }
+  },
+  methods: {
+    getUser() {
+      api.getUser().then(response => {
+        const data = response.data
+        this.ruleForm.real_name = data.realname
+        this.ruleForm.mobile = data.mobile
+      })
+    },
+    // 提交
+    handleSubmit() {
+      this.$refs.form.validate().then(this.handleRequest)
+    },
+    // 接口请求
+    handleRequest() {
+      this.loading = true
+      api.updateUser(this.ruleForm).then(response => {
+        response.code === 0 ? this.handleSuccess(response) : this.$message.error(response.msg)
+        this.loading = false
+      })
+    },
+    // 成功
+    handleSuccess(response) {
+      this.$alert('基本信息修改成功', {
+        type: 'success',
+        confirmButtonText: '返回报名系统',
+        callback: action => {
+          this.$router.push('/my')
+        }
+      })
+    }
+  },
+  beforeMount() {
+    this.getUser()
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+::v-deep .el-input {
+  max-width: 270px;
+}
+</style>

src/pages/my/account/password.vue

+<template>
+  <div>
+    <el-form :model="ruleForm" :rules="rules" ref="form" label-width="100px" @submit.native.prevent>
+      <el-form-item label="手机号" prop="account">
+        <el-input v-model.trim="ruleForm.account"></el-input>
+      </el-form-item>
+      <el-form-item prop="code" label="验证码">
+        <el-input v-model.trim="ruleForm.code" placeholder="请输入验证码">
+          <countdown
+            slot="suffix"
+            size="mini"
+            :disabled="disabledSend"
+            @start="sendCodeRequest"
+            ref="countdown"
+          ></countdown>
+        </el-input>
+      </el-form-item>
+      <el-form-item label="密码" prop="password">
+        <el-input type="password" v-model.trim="ruleForm.password"></el-input>
+      </el-form-item>
+      <el-form-item label="确认密码" prop="passwordR">
+        <el-input type="password" v-model.trim="ruleForm.passwordR"></el-input>
+      </el-form-item>
+      <el-form-item>
+        <el-button type="primary" @click="handleSubmit">确认修改</el-button>
+      </el-form-item>
+    </el-form>
+  </div>
+</template>
+
+<script>
+import * as api from '@/api/my'
+import countdown from '@/components/countdown.vue'
+
+export default {
+  name: 'MyPassword',
+  components: { countdown },
+  data() {
+    const validatePass = (rule, value, callback) => {
+      if (value === '') {
+        callback(new Error('请再次输入密码'))
+      } else if (value !== this.ruleForm.password) {
+        callback(new Error('两次输入密码不一致!'))
+      } else {
+        callback()
+      }
+    }
+    return {
+      ruleForm: { account: '', code: '', password: '', passwordR: '' },
+      rules: {
+        account: [{ required: true, message: '请输入手机号', trigger: 'blur' }],
+        code: [{ required: true, message: '请输入验证码', trigger: 'blur' }],
+        password: [
+          { required: true, message: '请输入新密码', trigger: 'blur' },
+          { min: 6, max: 20, message: '长度为6-20个字符', trigger: 'blur' }
+        ],
+        passwordR: [
+          { required: true, message: '请输入新密码', trigger: 'blur' },
+          { validator: validatePass, trigger: 'blur' }
+        ]
+      }
+    }
+  },
+  computed: {
+    disabledSend() {
+      const value = this.ruleForm.account
+      return !(/^1[3-9]\d{9}$/.test(value) || /@/.test(value))
+    }
+  },
+  methods: {
+    // 提交
+    handleSubmit() {
+      this.$refs.form.validate().then(this.handleRequest)
+    },
+    // 接口请求
+    handleRequest() {
+      this.loading = true
+      api.updatePassword(this.ruleForm).then(response => {
+        response.code === 0 ? this.handleSuccess(response) : this.$message.error(response.msg)
+        this.loading = false
+      })
+    },
+    // 成功
+    handleSuccess(response) {
+      this.$alert('密码修改成功，快去登录吧', '提示', {
+        type: 'success',
+        confirmButtonText: '去登录',
+        callback: action => {
+          this.$router.push('/login')
+        }
+      })
+    },
+    // 验证码
+    sendCodeRequest() {
+      api
+        .sendCode({ account: this.ruleForm.account })
+        .then(response => {
+          console.log(response)
+          if (response.code === 0) {
+            this.$message({ type: 'success', message: '验证码已发送' })
+          } else {
+            // 停止计时
+            this.$refs.countdown.stop()
+            this.$message({ type: 'error', message: response.msg })
+          }
+        })
+        .catch(this.$refs.countdown.stop)
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+::v-deep .el-input {
+  max-width: 270px;
+}
+</style>

src/pages/my/admission/form/index.js

+import xy from './xy'
+import xfjn from './xfjn'
+
+export default function(_this) {
+  return {
+    id: 'admission',
+    title: '入学办理',
+    children: [xy(_this), xfjn]
+  }
+}

src/pages/my/admission/form/xfjn.js

+export default {
+  id: 'admission_xfjn',
+  title: '学费缴纳',
+  html: `
+    <p><strong>一、对公收款银行信息：</strong></p>
+    <p>户名：清控紫荆（ 北京）教育科技股份有限公司</p>
+    <p>帐号：694485289</p>
+    <p>开户行：中国民生银行股份有限公司北京魏公村支行</p>
+    <p style="margin-top:30px;"><strong>二、支付宝收款账户信息：</strong></p>
+    <p>支付宝账号：service@ezijing.com</p>
+    <p>支付宝户名：清控紫荆（北京）教育科技股份有限公司</p>
+  `
+}

src/pages/my/admission/form/xy.js

+export default function(_this) {
+  return {
+    id: 'admission_xy',
+    title: '入学协议',
+    get: {
+      action: `/api/enrollment/v1.0/application-materials/${webConf.others.projectId}`,
+      callback(data) {
+        const { attachments = [], submission_stage: submissionStage = 'FILLING' } = data.data.material
+        const stageList = [
+          'FILLING',
+          'PREPAYMENT',
+          'INTERVIEW_APPLICATION',
+          'AUDITION',
+          'INTERVIEW',
+          'PAYMENT',
+          'REGISTRATION',
+          'CLOSED'
+        ]
+        this.form.options.disabled = stageList.findIndex(item => item === submissionStage) > 6
+        const ADMISSION_AGREEMENT = attachments.filter(item => {
+          return item.file_type_id === 'ADMISSION_AGREEMENT'
+        })
+        return { ADMISSION_AGREEMENT }
+      }
+    },
+    form: {
+      next: { to: { query: { active: 'admission_xfjn' } } },
+      hasButton: false,
+      options: {},
+      items: [
+        {
+          type: 'v-upload',
+          required: true,
+          model: 'ADMISSION_AGREEMENT',
+          attrs: {
+            action: `/api/enrollment/v1.0/application-materials/attachments/${webConf.others.projectId}/put`,
+            deleteAction: `/api/enrollment/v1.0/application-materials/attachments/${webConf.others.projectId}/delete`,
+            data: { file_type: 'ADMISSION_AGREEMENT' }
+          },
+          //   prepend: `
+          //   <p>第一步：点击下载按键获取入学协议</p>
+          //   <p><a href="https://zws-imgs-pub.oss-cn-beijing.aliyuncs.com/pc/cu/%E5%85%A5%E5%AD%A6%E5%8D%8F%E8%AE%AE%EF%BC%88%E8%AF%B7%E4%B8%8B%E8%BD%BD%E6%A8%A1%E6%9D%BF%E5%A1%AB%E5%86%99%E5%90%8E%E4%B8%8A%E4%BC%A0%E7%85%A7%E7%89%87%EF%BC%89.docx" target="_blank" download>下载入学协议</a></p>
+          //   <p>第二步：申请者可将签字后的入学协议原件扫描或拍照后提交。学员应仔细阅读《入学协议》以及课程介绍，如对入学协议或课程有异议，请第一时间与课程顾问咨询确认。请用A4纸打印后，在入学协议上签上姓名和日期，内容需显示完整、格式整齐、字迹清晰可辨。点击下方按钮，上传文件</p>
+          // `
+          prepend: `
+            <p>第一步：请以录取通知书的协议为准</p>
+            <p>第二步：申请者可将签字后的入学协议原件扫描或拍照后提交。学员应仔细阅读《入学协议》以及课程介绍，如对入学协议或课程有异议，请第一时间与课程顾问咨询确认。请用A4纸打印后，在入学协议上签上姓名和日期，内容需显示完整、格式整齐、字迹清晰可辨。点击下方按钮，上传文件</p>
+          `
+        }
+      ]
+    }
+  }
+}

src/pages/my/admission/index.vue

+<template>
+  <app-layout>
+    <vue-form
+      :menus="menus"
+      :default-active="currentActive"
+      @page-change="handlePageChange"
+      @success="handleSuccess"
+      @error="handleError"
+      @back="$router.push('/my/account')"
+      @prev="handlePrev"
+      @next="handleNext"
+      @uploaded="getApplication"
+    >
+      <template #aside-append>
+        <div class="aside-logout" @click="$store.dispatch('logout')"><span>退出登录</span></div>
+      </template>
+    </vue-form>
+    <el-dialog
+      title="办理入学资料提交成功"
+      :visible.sync="dialogVisible"
+      :center="true"
+      :close-on-click-modal="false"
+      width="348px"
+    >
+      <div class="dialog-tips">
+        <p>请确认是否已缴费，如未缴费点击下方缴费按钮 <br />（已缴费，请忽略）</p>
+        <div class="icon"><img src="../../../assets/images/icon_success.png" /></div>
+      </div>
+      <template #footer>
+        <el-button type="primary" @click="toPay">立即缴费</el-button>
+        <el-button type="primary" @click="dialogVisible = false">忽略</el-button>
+      </template>
+    </el-dialog>
+  </app-layout>
+</template>
+
+<script>
+import AppLayout from '../layout.vue'
+import getMenu from './form'
+import * as api from '@/api/my'
+
+export default {
+  components: { AppLayout },
+  data() {
+    const menus = getMenu(this)
+    return {
+      menus: [menus],
+      currentActive: 'admission_xy',
+      dialogVisible: false,
+      detail: null
+    }
+  },
+  watch: {
+    $route: {
+      immediate: true,
+      handler(route) {
+        const { query = {} } = route
+        this.currentActive = query.active || 'admission_xy'
+      }
+    },
+    showSubmitedDialog(value) {
+      this.dialogVisible = value
+    }
+  },
+  computed: {
+    isSubmited() {
+      if (this.detail) {
+        return !!this.detail.material.attachments.find(item => item.file_type_id === 'ADMISSION_AGREEMENT')
+      }
+      return false
+    },
+    showSubmitedDialog() {
+      return this.isSubmited && this.currentActive === 'admission_xy'
+    }
+  },
+  methods: {
+    // 获取报名信息
+    getApplication() {
+      api.getApplication().then(response => {
+        const { data, error, message } = response
+        if (error.toString() === '0') {
+          this.detail = data
+        } else {
+          this.$message.error(message)
+        }
+      })
+    },
+    handlePageChange(value) {
+      this.currentActive = value
+      this.$router.push({ path: this.$route.path, query: { active: value } })
+      console.log('页面切换了', value)
+    },
+    handleSuccess(data) {
+      console.log('提交成功了', data)
+      this.$message({ type: 'success', message: data.message })
+    },
+    handleError(data) {
+      console.log('提交失败了', data)
+      this.$message({ type: 'error', message: data.message })
+    },
+    handlePrev(to) {
+      this.$router.push(to)
+    },
+    handleNext(to) {
+      this.$router.push(to)
+    },
+    toPay() {
+      this.dialogVisible = false
+      this.$router.push({ path: '/my/admission', query: { active: 'admission_xfjn' } })
+    }
+  },
+  beforeMount() {
+    this.getApplication()
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.dialog-tips {
+  text-align: center;
+  p {
+    color: #262626;
+    line-height: 20px;
+  }
+  .icon {
+    margin-top: 20px;
+    text-align: center;
+  }
+}
+</style>

src/pages/my/application/complete.vue

+<template>
+  <el-dialog
+    title="您当前完成进度如下："
+    width="348px"
+    :center="true"
+    :close-on-click-modal="false"
+    :visible.sync="dialogVisible"
+    @open="handleOpen"
+    @close="handleClose"
+  >
+    <div>
+      <ul v-if="detail">
+        <li
+          v-for="item in currentOptions"
+          :class="progress[item.code].progress === 1 ? 'is-success' : 'is-error'"
+          :key="item.code"
+        >
+          <span class="name">{{ item.title }}</span>
+          <span class="line"></span>
+          <span class="status">{{ progress[item.code].progress === 1 ? '已完成' : '未完成' }}</span>
+          <span class="view" @click="handleView(item.view.to)">立即查看</span>
+        </li>
+      </ul>
+    </div>
+    <template #footer>
+      <el-button type="primary" @click="dialogVisible = false">我知道啦</el-button>
+    </template>
+  </el-dialog>
+</template>
+
+<script>
+import * as api from '@/api/my'
+export default {
+  props: { value: { type: Boolean, default: false }, type: { type: Number, default: 0 } },
+  data() {
+    return {
+      dialogVisible: false,
+      detail: null,
+      progress: {},
+      options: [
+        [
+          {
+            title: '个人资料',
+            code: 'applicaitonInfo',
+            view: { to: { path: '/my/application', query: { active: 'application_info' } } }
+          },
+          {
+            title: '推荐信',
+            code: 'applicationTjx',
+            view: { to: { path: '/my/application', query: { active: 'application_tjx' } } }
+          }
+          // {
+          //   title: '无犯罪证明',
+          //   code: 'applicationWfzzm',
+          //   view: { to: { path: '/my/application', query: { active: 'application_wfzzm' } } }
+          // }
+        ],
+        [
+          {
+            title: '学位证书',
+            code: 'interviewXwzs',
+            view: { to: { path: '/my/interview', query: { active: 'interview_byz' } } }
+          },
+          {
+            title: '成绩单',
+            code: 'interviewCjd',
+            view: { to: { path: '/my/interview', query: { active: 'interview_cjd' } } }
+          },
+          {
+            title: '2寸照片',
+            code: 'interviewZp',
+            view: { to: { path: '/my/interview', query: { active: 'interview_zp' } } }
+          },
+          {
+            title: '推荐信',
+            code: 'interviewTjx',
+            view: { to: { path: '/my/application', query: { active: 'application_tjx' } } }
+          }
+        ]
+      ]
+    }
+  },
+  watch: {
+    value: {
+      immediate: true,
+      handler(value) {
+        this.dialogVisible = value
+      }
+    }
+  },
+  computed: {
+    currentOptions() {
+      return this.options[this.type]
+    }
+  },
+  methods: {
+    // 获取报名信息
+    getApplication() {
+      api.getApplication(this.$route.query).then(response => {
+        const { data, error, message } = response
+        if (error.toString() === '0') {
+          const { progress } = data
+          this.detail = data
+
+          const fillingMissedRequiredList = progress.FILLING.attachments.missed_required_list
+          // 个人资料
+          const applicaitonInfo = { progress: 0 }
+          const infoRequriedList = ['basic_info', 'educations', 'careers', 'answers']
+          for (const key of infoRequriedList) {
+            if (progress.FILLING[key].progress < 1) {
+              applicaitonInfo.progress = 0
+              break
+            }
+            applicaitonInfo.progress = 1
+          }
+          if (applicaitonInfo.progress === 1 && !fillingMissedRequiredList.ID_CARD_PHOTO) {
+            applicaitonInfo.progress = 1
+          } else {
+            applicaitonInfo.progress = 0
+          }
+          // 推荐信
+          const applicationTjx = { progress: 0 }
+          applicationTjx.progress = progress.FILLING.reco_letters ? progress.FILLING.reco_letters.progress : 0
+          // 无犯罪证明
+          const applicationWfzzm = { progress: 0 }
+          applicationWfzzm.progress = fillingMissedRequiredList.NO_CRIMINAL_CERT ? 0 : 1
+
+          const missedRequiredList = progress.INTERVIEW_APPLICATION.attachments.missed_required_list
+          // 学位证书
+          const interviewXwzs = { progress: 0 }
+          interviewXwzs.progress = missedRequiredList.DEGREE_CERT_CN ? 0 : 1
+          // 成绩单
+          const interviewCjd = { progress: 0 }
+          interviewCjd.progress = missedRequiredList.REPORT_CARD_CN || missedRequiredList.REPORT_CARD_EN ? 0 : 1
+          // 2寸照片
+          const interviewZp = { progress: 0 }
+          interviewZp.progress = missedRequiredList.PERSONAL_PHOTO_FOR_ID ? 0 : 1
+          // 推荐信
+          const interviewTjx = { progress: 0 }
+          interviewTjx.progress = progress.INTERVIEW_APPLICATION.reco_letters
+            ? progress.INTERVIEW_APPLICATION.reco_letters.progress
+            : 0
+
+          this.progress = {
+            applicaitonInfo,
+            applicationTjx,
+            applicationWfzzm,
+            interviewXwzs,
+            interviewCjd,
+            interviewZp,
+            interviewTjx
+          }
+        } else {
+          this.$message.error(message)
+        }
+      })
+    },
+    handleView(to) {
+      this.dialogVisible = false
+      this.$router.push(to)
+    },
+    handleOpen() {
+      this.getApplication()
+    },
+    handleClose() {
+      this.$emit('input', this.dialogVisible)
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+li {
+  padding: 10px 0;
+  display: flex;
+  align-items: center;
+}
+.name {
+  width: 80px;
+  text-align: right;
+}
+.line {
+  width: 40px;
+  height: 1px;
+  margin: 0 10px;
+  background-color: #ccc;
+}
+.is-success {
+  .status {
+    color: #33c011;
+  }
+}
+.is-error {
+  .status {
+    color: #af1b40;
+  }
+}
+.view {
+  margin-left: 40px;
+  color: #57acff;
+  text-decoration: underline;
+  cursor: pointer;
+}
+</style>

src/pages/my/application/form/declare.js

+/**
+ * 申请声明
+ */
+
+export default function(_this) {
+  return {
+    id: 'application_declare',
+    title: '申请声明',
+    visible() {
+      return _this.visible
+    },
+    get: {
+      action: `/api/enrollment/v1.0/application-materials/${webConf.others.projectId}`,
+      callback(data) {
+        const { submission_stage: submissionStage = 'FILLING' } = data.data.material
+        const isSubmited = submissionStage !== 'FILLING'
+        this.form.options.disabled = isSubmited
+        if (isSubmited) {
+          return { isAgree: [1] }
+        }
+        return { isAgree: [] }
+      }
+    },
+    update: {
+      action: `/api/enrollment/v1.0/application-materials/submit/${webConf.others.projectId}`,
+      callback() {
+        _this.getApplication()
+        this.form.options.disabled = true
+        // _this.$router.push({ path: this.$route.path, query: { active: 'application_pay' } })
+        _this.$router.push({ path: '/my/interview' })
+      },
+      errorCallback() {
+        _this.completeVisible = true
+      }
+    },
+    form: {
+      prev: { to: { query: { active: 'application_wfzzm' } } },
+      submitText: '提交报名申请',
+      model: { isAgree: [] },
+      options: {},
+      items: [
+        {
+          type: 'v-checkbox',
+          values: [{ label: '同意', value: 1 }],
+          model: 'isAgree',
+          rules: [{ required: true, message: '请阅读协议', trigger: 'change' }],
+          prepend:
+            '<p>我提供的所有报名材料信息皆准确和完整。我同意在需要的情况下提交原件以确认我的报名资格。由于报名材料中的虚假、错误信息或重大遗漏导致不录取或取消学籍的后果由我个人承担。我理解并同意所有报名材料归紫荆教育所有，无论考生录取与否均不退回。我授权紫荆教育使用报名表中的信息查询本人学习和工作记录。</p>'
+        }
+      ]
+    }
+  }
+}

src/pages/my/application/form/index.js

+import info from './info'
+import tjx from './tjx'
+import wfzsm from './wfzzm'
+import declare from './declare'
+
+export default function(_this) {
+  return {
+    id: 'application',
+    title: '报名申请',
+    children: [
+      info(_this),
+      tjx(_this),
+      // wfzsm(_this),
+      declare(_this)
+      // {
+      //   id: 'application_pay',
+      //   title: '缴报名费',
+      //   show: false,
+      //   visible() {
+      //     return _this.visible
+      //   }
+      // }
+    ]
+  }
+}

src/pages/my/application/form/info.js

+import first from './info/first'
+import profile from './info/profile'
+import education from './info/education'
+import career from './info/career'
+import honor from './info/honor'
+import training from './info/training'
+import answer from './info/answer'
+
+export default function(_this) {
+  return {
+    id: 'application_info',
+    title: '个人资料',
+    tabs: [first(_this), profile(_this), education(_this), career(_this), answer(_this), training(_this), honor(_this)]
+  }
+}

src/pages/my/application/form/info/answer.js

+/**
+ * 学习目的
+ */
+
+export default function(_this) {
+  return {
+    id: 'application_info_answer',
+    title: '学习目的',
+    required: true,
+    visible() {
+      return _this.visible
+    },
+    get: {
+      action: `/api/enrollment/v1.0/application-materials/${webConf.others.projectId}`,
+      callback(data) {
+        const { answers = [], submission_stage: submissionStage = 'FILLING' } = data.data.material
+        this.form.options.disabled = submissionStage !== 'FILLING'
+
+        const [first = {}, second = {}] = answers
+        return {
+          qid1: first.qid || '1',
+          question1: '您为什么申请中国产业金融菁英计划项目? (200字以上，1000字以内)',
+          answer1: first.answer,
+          qid2: second.qid || '2',
+          question2: '您的短期和长期职业发展目标是什么?您打 算如何达成此愿景?(200字以上，1000字 以内)',
+          answer2: second.answer
+        }
+      }
+    },
+    update: {
+      action: `/api/enrollment/v1.0/application-materials/${webConf.others.projectId}/put`,
+      beforeRequest(data) {
+        return {
+          answers: [
+            { qid: data.qid1, question: data.question1, answer: data.answer1 },
+            { qid: data.qid2, question: data.question2, answer: data.answer2 }
+          ]
+        }
+      }
+    },
+    form: {
+      prev: { to: { query: { active: 'application_info', tab: 'application_info_career' } }, isSubmit: true },
+      next: { to: { query: { active: 'application_info', tab: 'application_info_training' } }, isSubmit: true },
+      options: {},
+      items: [
+        {
+          type: 'v-input',
+          label: '您为什么申请中国产业金融菁英计划项目? (200字以上，1000字以内)',
+          model: 'answer1',
+          attrs: { type: 'textarea', rows: '8', maxlength: '1000', style: 'width:100%' },
+          rules: [
+            { required: true, message: '请输入', trigger: 'blur' },
+            { min: 60, max: 1000, message: '长度在 60 到 1000 个字符', trigger: 'blur' }
+          ]
+        },
+        {
+          type: 'v-input',
+          label: '您的短期和长期职业发展目标是什么?您打 算如何达成此愿景?(200字以上，1000字 以内)',
+          model: 'answer2',
+          attrs: { type: 'textarea', rows: '8', maxlength: '1000', style: 'width:100%' },
+          rules: [
+            { required: true, message: '请输入', trigger: 'blur' },
+            { min: 60, max: 1000, message: '长度在 60 到 1000 个字符', trigger: 'blur' }
+          ]
+        }
+      ]
+    }
+  }
+}

src/pages/my/application/form/info/career.js

+/**
+ * 工作经验
+ */
+
+export default function(_this) {
+  return {
+    id: 'application_info_career',
+    title: '工作经验',
+    required: true,
+    visible() {
+      return _this.visible
+    },
+    get: {
+      action: `/api/enrollment/v1.0/application-materials/${webConf.others.projectId}`,
+      callback(data) {
+        const { careers: list = [], submission_stage: submissionStage = 'FILLING' } = data.data.material
+        this.form.options.disabled = submissionStage !== 'FILLING'
+        return list.length ? list : [{}]
+      }
+    },
+    update: {
+      action: `/api/enrollment/v1.0/application-materials/${webConf.others.projectId}/put`,
+      beforeRequest(data) {
+        const careers = data.map(item => {
+          return [
+            'start_date',
+            'end_date',
+            'company_name_cn',
+            'industry',
+            'dept_cn',
+            'position_cn',
+            'job_desc_cn'
+          ].reduce((result, key) => {
+            result[key] = item[key]
+            return result
+          }, {})
+        })
+        return { careers }
+      }
+    },
+    form: {
+      prev: { to: { query: { active: 'application_info', tab: 'application_info_education' } }, isSubmit: true },
+      next: { to: { query: { active: 'application_info', tab: 'application_info_answer' } }, isSubmit: true },
+      hasAdd: true,
+      options: { labelWidth: '140px' },
+      items: [
+        {
+          type: 'v-datepicker',
+          label: '开始时间',
+          model: 'start_date',
+          attrs: {
+            type: 'month',
+            placeholder: '请选择工作开始时间',
+            valueFormat: 'yyyy-MM'
+          },
+          rules: [{ required: true, message: '请选择工作开始时间', trigger: 'blur' }]
+        },
+        {
+          type: 'v-datepicker',
+          label: '结束时间',
+          model: 'end_date',
+          attrs: {
+            type: 'month',
+            placeholder: '请选择工作结束时间',
+            valueFormat: 'yyyy-MM'
+          },
+          rules: [{ required: true, message: '请选择工作结束时间', trigger: 'blur' }]
+        },
+        {
+          type: 'v-input',
+          label: '工作单位',
+          model: 'company_name_cn',
+          attrs: { placeholder: '请输入工作单位' },
+          rules: [{ required: true, message: '请输入工作单位', trigger: 'blur' }]
+        },
+        {
+          type: 'v-select',
+          values: [
+            { label: '互联网/电子商务', value: '1 ' },
+            { label: '基金/证券/期货/投资', value: '2 ' },
+            { label: '保险', value: '3 ' },
+            { label: '银行', value: '4 ' },
+            { label: '信托/担保/拍卖/典当', value: '5 ' },
+            { label: '计算机软件', value: '6 ' },
+            { label: 'IT服务(系统/数据/维护)', value: '7 ' },
+            { label: '电子技术/半导体/集成电路', value: '8 ' },
+            { label: '计算机硬件', value: '9 ' },
+            { label: '通信/电信/网络设备', value: '10' },
+            { label: '通信/电信运营、增值服务', value: '11' },
+            { label: '网络游戏', value: '12' },
+            { label: '房地产/建筑/建材/工程', value: '13' },
+            { label: '家居/室内设计/装饰装潢', value: '14' },
+            { label: '物业管理/商业中心', value: '15' },
+            { label: '专业服务/咨询(财会/法律/人力资源等)', value: '16' },
+            { label: '广告/会展/公关', value: '17' },
+            { label: '中介服务', value: '18' },
+            { label: '检验/检测/认证', value: '19' },
+            { label: '外包服务', value: '20' },
+            { label: '快速消费品（食品/饮料/烟酒/日化）', value: '21' },
+            { label: '耐用消费品（服饰/纺织/皮革/家具/家电）', value: '22' },
+            { label: '贸易/进出口', value: '23' },
+            { label: '零售/批发', value: '24' },
+            { label: '租赁服务', value: '25' },
+            { label: '教育/培训/院校', value: '26' },
+            { label: '礼品/玩具/工艺美术/收藏品/奢侈品', value: '27' },
+            { label: '汽车/摩托车', value: '28' },
+            { label: '大型设备/机电设备/重工业', value: '29' },
+            { label: '加工制造（原料加工/模具）', value: '30' },
+            { label: '仪器仪表及工业自动化', value: '31' },
+            { label: '印刷/包装/造纸', value: '32' },
+            { label: '办公用品及设备', value: '33' },
+            { label: '医药/生物工程', value: '34' },
+            { label: '医疗设备/器械', value: '35' },
+            { label: '航空/航天研究与制造', value: '36' },
+            { label: '交通/运输,物流/仓储', value: '37' },
+            { label: '医疗/护理/美容/保健/卫生服务', value: '38' },
+            { label: '酒店/餐饮,旅游/度假,媒体/出版/影视/文化传播', value: '39' },
+            { label: '娱乐/体育/休闲', value: '40' },
+            { label: '能源/矿产/采掘/冶炼', value: '41' },
+            { label: '石油/石化/化工,电气/电力/水利', value: '42' },
+            { label: '环保', value: '43' },
+            { label: '政府/公共事业/非盈利机构', value: '44' },
+            { label: '学术/科研,农/林/牧/渔跨领域经营', value: '45' },
+            { label: '其他', value: '90' }
+          ],
+          label: '行业类别',
+          model: 'industry',
+          rules: [{ required: true, message: '请选择行业类别', trigger: 'change' }]
+        },
+        {
+          type: 'v-input',
+          label: '工作部门',
+          model: 'dept_cn',
+          attrs: { placeholder: '请输入工作部门' },
+          rules: [{ required: true, message: '请输入工作部门', trigger: 'blur' }]
+        },
+        {
+          type: 'v-input',
+          label: '工作职位',
+          model: 'position_cn',
+          attrs: { placeholder: '请输入工作职位' },
+          rules: [{ required: true, message: '请输入工作职位', trigger: 'blur' }]
+        },
+        {
+          type: 'v-input',
+          label: '工作描述',
+          model: 'job_desc_cn',
+          attrs: {
+            type: 'textarea',
+            placeholder: '请输入工作描述',
+            rows: '8',
+            maxlength: '3000'
+          },
+          rules: [{ required: true, message: '请输入工作描述', trigger: 'blur' }]
+        }
+      ]
+    }
+  }
+}