Browse Source

首页调整/登录页对接

yangzj 2 years ago
parent
commit
67fec25b1f

+ 0 - 3
src/App.vue

@@ -4,6 +4,3 @@
   </div>
 </template>
 
-<style lang="scss">
-
-</style>

+ 17 - 3
src/api/Home/index.js

@@ -3,7 +3,7 @@
  * @Author: 空白格
  * @Date: 2022-08-10 14:10:36
  * @LastEditors: 空白格
- * @LastEditTime: 2022-08-15 11:02:11
+ * @LastEditTime: 2022-08-17 13:12:25
  * @FilePath: \veterans_client_web\src\api\Home\index.js
  * @Copyright: Copyright (c) 2016~2022 by 空白格, All Rights Reserved.
  */
@@ -33,6 +33,22 @@ export function getNewsList(params) {
   })
 }
 
+/**
+ * 获取单条新闻动态数据
+ * @param {*} params
+ * @returns
+ */
+export function getNewsData(params) {
+  return request({
+    url: '/app/sec/article/door/info',
+    method: 'get',
+    headers: {
+      noLoginFlag: true
+    },
+    params
+  })
+}
+
 // 获取公告内容
 export function getNoticeList(params) {
   return request({
@@ -44,5 +60,3 @@ export function getNoticeList(params) {
     params
   })
 }
-
-

+ 31 - 3
src/api/Login/index.js

@@ -3,7 +3,7 @@
  * @Author: 空白格
  * @Date: 2022-08-10 14:58:23
  * @LastEditors: 空白格
- * @LastEditTime: 2022-08-10 15:06:53
+ * @LastEditTime: 2022-08-17 11:52:22
  * @FilePath: \veterans_client_web\src\api\Login\index.js
  * @Copyright: Copyright (c) 2016~2022 by 空白格, All Rights Reserved.
  */
@@ -12,7 +12,7 @@ import request from '@/utils/request'
 // 验证码验证登录
 export function loginAuthCode(data) {
   return request({
-    url: '/auth/verifyCode',
+    url: '/app/auth/verifyCode',
     method: 'post',
     data
   })
@@ -21,8 +21,36 @@ export function loginAuthCode(data) {
 // 获取验证码
 export function getAuthCode(data) {
   return request({
-    url: '/auth/sendSmsCode',
+    url: '/app/auth/sendSmsCode',
     method: 'post',
     data
   })
 }
+
+// 获取用户信息
+export function getUserInfo(params) {
+  return request({
+    url: '/app/memberinfo',
+    method: 'get',
+    params
+  })
+}
+
+// 验证该用户是否已经认证
+export function veteEducCheck(params) {
+  return request({
+    url: '/app/veteEduc/check',
+    method: 'get',
+    params
+  })
+}
+
+// 退出登录
+export function logout(data) {
+  return request({
+    url: '/app/auth/logout',
+    method: 'delete',
+    data
+  })
+}
+

+ 2 - 1
src/api/PolicyAdvice/index.js

@@ -3,7 +3,7 @@
  * @Author: 空白格
  * @Date: 2022-08-11 11:53:02
  * @LastEditors: 空白格
- * @LastEditTime: 2022-08-11 11:54:20
+ * @LastEditTime: 2022-08-17 13:11:58
  * @FilePath: \veterans_client_web\src\api\PolicyAdvice\index.js
  * @Copyright: Copyright (c) 2016~2022 by 空白格, All Rights Reserved.
  */
@@ -23,3 +23,4 @@ export function getPolicyData(params) {
     params
   })
 }
+

+ 6 - 0
src/assets/images/key-icon.svg

@@ -0,0 +1,6 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 28 34" class="design-iconfont">
+  <g fill="#979797" fill-rule="nonzero">
+    <path d="M23.7411966,11.9219503 L5.41675214,11.9219503 L5.41675214,8.78765155 C5.66229848,5.00370703 8.79900025,1.99183479 12.7249239,1.77031896 C16.6508475,1.54880313 20.1305749,4.18735079 20.8323077,7.91784615 C20.8888629,8.32281861 21.2656287,8.61340151 21.6878632,8.57769853 C22.1122507,8.53062254 22.4178264,8.16237709 22.3723077,7.75288307 C21.5544958,3.25330677 17.3692027,0.0585445911 12.6387688,0.322975174 C7.9083349,0.587405756 4.13409488,4.2271047 3.86119658,8.78765155 L3.86119658,11.9219503 L3.59675212,11.9219503 C2.56122907,11.9219503 1.56811835,12.3185301 0.835892977,13.0244466 C0.103667608,13.7303631 -0.307692308,14.6877914 -0.307692308,15.6861081 L-0.307692308,29.5430078 C-0.307692308,30.5413245 0.103667621,31.4987528 0.835892989,32.2046693 C1.56811836,32.9105858 2.56122908,33.3074348 3.59675212,33.3074348 L23.7411966,33.3074348 C24.7847816,33.3191914 25.7899232,32.9279269 26.5322728,32.2207028 C27.2746225,31.5134786 27.6923077,30.5491686 27.6923077,29.5430078 L27.6923077,15.6861081 C27.6923077,14.6799473 27.2746225,13.7156373 26.5322728,13.0084131 C25.7899232,12.3011889 24.7847816,11.9099244 23.7411966,11.9219503 Z M26.1367522,29.5430078 C26.1367522,30.7936529 25.0851187,31.8075011 23.7878632,31.8075011 L3.59675212,31.8075011 C2.29949663,31.8075011 1.24786325,30.7936529 1.24786325,29.5430078 L1.24786325,15.6861081 C1.24786325,14.435463 2.29949662,13.4216148 3.59675212,13.4216147 L23.7411966,13.4216147 C24.3722066,13.4095262 24.9817148,13.6427587 25.4323621,14.0687509 C25.8830095,14.494743 26.1367522,15.0776502 26.1367522,15.6861081 L26.1367522,29.5430078 Z" transform="translate(.307692 .692308)"/>
+    <path d="M13.1923077,18.3076923 C13.0596995,18.3076923 12.9325225,18.3908158 12.8387543,18.5387765 C12.7449861,18.6867373 12.6923077,18.8874151 12.6923077,19.0966632 L12.6923077,25.5188863 C12.6923654,25.9545585 12.9162061,26.3076923 13.1923077,26.3076923 C13.4684093,26.3076923 13.69225,25.9545585 13.6923077,25.5188863 L13.6923077,19.0966632 C13.6923077,18.6609266 13.4684501,18.3076923 13.1923077,18.3076923 L13.1923077,18.3076923 Z" transform="translate(.307692 .692308)"/>
+  </g>
+</svg>

File diff suppressed because it is too large
+ 0 - 0
src/assets/images/link-icon.svg


BIN
src/assets/images/login-bg.png


BIN
src/assets/images/user-icon.png


+ 3 - 0
src/assets/images/user-icon.svg

@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 27 30" class="design-iconfont">
+  <path d="M12.8260109,17.0020223 C8.30455834,17.0020223 4.76275335,13.1983498 4.76275335,8.34229078 C4.76275335,3.65775248 8.56669444,-0.153846154 13.242285,-0.153846154 C17.9172195,-0.153846154 21.7198781,3.65711474 21.7198781,8.34229078 C21.7198781,10.5643466 20.8683906,12.6658703 19.3228941,14.2607275 C19.0691986,14.5210151 18.6581141,14.522989 18.4031361,14.2666797 C18.1468458,14.0097023 18.1449072,13.5904666 18.3966342,13.330179 C19.7008425,11.9857092 20.4182943,10.2140167 20.4182943,8.34295888 C20.4182943,4.38896282 17.1991115,1.17143083 13.2416289,1.17143083 C9.28349008,1.17143083 6.06302476,4.38826435 6.06302476,8.34295888 C6.06302476,12.4559335 9.03307539,15.6780511 12.8253249,15.6780511 C13.184364,15.6780511 13.4757887,15.9741127 13.4757887,16.3403556 C13.4757887,16.7065985 13.1850201,17.0020223 12.8259811,17.0020223 L12.8260109,17.0020223 Z M25.6571987,28.8461538 C25.2974736,28.8461538 25.0067349,28.5500923 25.0067349,28.1838494 C25.0067349,22.0031511 19.7587338,16.9748729 13.3079906,16.9748729 C6.85727716,16.9748729 1.60861988,22.0031511 1.60861988,28.1838494 C1.60861988,28.5501227 1.31719516,28.8461538 0.958156094,28.8461538 C0.599117025,28.8461538 0.307692308,28.5500923 0.307692308,28.1838494 C0.307692308,21.2726089 6.13982536,15.6502641 13.3080204,15.6502641 C20.4762154,15.6502641 26.3076923,21.2726089 26.3076923,28.1838494 C26.3076923,28.5494242 26.0169238,28.8461538 25.6572285,28.8461538 L25.6571987,28.8461538 Z" transform="translate(.692308 .153846)" fill="#9C9C9C" fill-rule="nonzero"/>
+</svg>

File diff suppressed because it is too large
+ 7 - 0
src/assets/images/woxiangchuangye.svg


+ 9 - 0
src/assets/images/woxiangshengxueli.svg

@@ -0,0 +1,9 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 25 23" class="design-iconfont">
+  <defs>
+    <linearGradient x1="50%" y1="0%" x2="50%" y2="100%" id="y3ppwsth5__rwo85n2k7a">
+      <stop stop-color="#BF98FF" offset="0%"/>
+      <stop stop-color="#9171FD" offset="100%"/>
+    </linearGradient>
+  </defs>
+  <path d="M20.9102388,11.7131597 C20.9392041,11.7745399 20.9542399,11.8417609 20.9542399,11.9098523 L20.9542399,18.1768139 C20.9542399,19.5869698 20.1527612,20.8698305 18.8979903,21.4680861 C16.7560265,22.4893715 14.6140627,23 12.4720989,23 C10.3301351,23 8.18817129,22.4893715 6.04620748,21.4680861 C4.79146446,20.8698873 3.98995794,19.5870265 3.98995794,18.1768707 L3.98995794,11.9098523 C3.98995794,11.6589251 4.18981838,11.4555313 4.43638641,11.4555313 C4.50329493,11.4555293 4.56934819,11.4708329 4.62966204,11.5003103 L11.0225736,14.624875 C11.9388282,15.0726996 13.0053696,15.0726996 13.9216242,14.624875 L20.3145358,11.5002819 C20.5368013,11.3916708 20.8034865,11.4869646 20.9102388,11.7131597 Z M23.1026769,10.2080224 C23.6035138,10.2080224 24.0094847,10.6211706 24.0094847,11.1308621 L24.0094847,13.8567885 C24.0094847,14.3664799 23.6035138,14.7796282 23.1026769,14.7796282 C22.6018399,14.7796282 22.1958691,14.3664799 22.1958691,13.8567885 L22.1958691,11.1308621 C22.1958691,10.6211706 22.6018399,10.2080224 23.1026769,10.2080224 Z M14.3563898,0.433020641 L24.0384468,5.0719795 C24.8752211,5.47288945 25.2340659,6.4879563 24.8399812,7.339212 C24.6742028,7.69725109 24.3911241,7.98539467 24.0393396,8.15417882 L14.3587335,12.7993562 C13.1470133,13.3807677 11.7428663,13.3780995 10.5332879,12.7920871 L0.95502558,8.15145289 C0.119953222,7.74687998 -0.23459469,6.73022301 0.163117275,5.8806994 C0.328564983,5.52733676 0.608509476,5.24271373 0.955890536,5.07467703 L10.5356038,0.440289778 C11.7438866,-0.144217408 13.1459763,-0.146874497 14.3563898,0.433049036 L14.3563898,0.433020641 Z" fill="url(#y3ppwsth5__rwo85n2k7a)" fill-rule="nonzero"/>
+</svg>

+ 9 - 0
src/assets/images/woyaojiuye.svg

@@ -0,0 +1,9 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 23 22" class="design-iconfont">
+  <defs>
+    <linearGradient x1="50%" y1="0%" x2="50%" y2="100%" id="g5ovox2j2__hk0jch66sa">
+      <stop stop-color="#FF926D" offset="0%"/>
+      <stop stop-color="#FF6657" offset="100%"/>
+    </linearGradient>
+  </defs>
+  <path d="M6.71080054,9.70588235 L6.71080054,11.5555265 C6.71080054,12.9042837 7.81610886,14.0011983 9.17518696,14.0011983 L9.17518696,14.0011983 L13.8262229,14.0011983 C15.185301,14.0011983 16.2906093,12.9042837 16.2906093,11.5555265 L16.2906093,11.5555265 L16.2906093,9.70588235 L23,9.70588235 L23,18.3426854 C23,20.3630229 21.3504965,22 19.3161089,22 L19.3161089,22 L3.68530097,22 C1.64950349,22 0,20.3616238 0,18.3426854 L0,18.3426854 L0,9.70588235 L6.71080054,9.70588235 Z M14.597916,9.60176491 L14.597916,11.5051287 C14.597916,11.9399365 14.2511186,12.2941176 13.8253754,12.2941176 L13.8253754,12.2941176 L9.17462458,12.2941176 C8.74747165,12.2941176 8.40208397,11.9399365 8.40208397,11.5051287 L8.40208397,11.5051287 L8.40208397,9.60176491 L14.597916,9.60176491 Z M13.9296966,0 C15.4381244,0 16.6646031,1.25259191 16.6646031,2.79313599 L16.6646031,2.79313599 L16.6646031,4.0644448 L19.3163347,4.0644448 C21.3505976,4.0644448 23,5.74896496 23,7.82653982 L23,7.82653982 L23,7.87405193 L0,7.87405193 L0,7.82653982 C0,5.74896496 1.65081214,4.0644448 3.68507508,4.0644448 L3.68507508,4.0644448 L6.33539687,4.0644448 L6.33539687,2.79313599 C6.33539687,1.25259191 7.56187557,0 9.0703034,0 L9.0703034,0 Z M13.9282869,1.72627322 L9.07171315,1.72627322 C8.49653693,1.72627322 8.02850138,2.20427382 8.02850138,2.79169623 L8.02850138,2.79169623 L8.02850138,4.06300504 L14.9714986,4.06300504 L14.9714986,2.79169623 C14.9714986,2.20427382 14.5034631,1.72627322 13.9282869,1.72627322 L13.9282869,1.72627322 Z" fill="url(#g5ovox2j2__hk0jch66sa)" fill-rule="nonzero"/>
+</svg>

File diff suppressed because it is too large
+ 7 - 0
src/assets/images/woyaoxuejineng.svg


File diff suppressed because it is too large
+ 7 - 0
src/assets/images/zhengcezixun.svg


+ 13 - 0
src/assets/styles/common.scss

@@ -195,3 +195,16 @@
     );
   }
 }
+
+// 取消input的上下箭头
+input::-webkit-inner-spin-button {
+  -webkit-appearance: none !important;
+}
+
+input::-webkit-outer-spin-button {
+  -webkit-appearance: none !important;
+}
+
+input[type='number'] {
+  -moz-appearance: textfield;
+}

+ 3 - 3
src/layout/index.vue

@@ -3,7 +3,7 @@
  * @Author: 空白格
  * @Date: 2022-08-10 11:30:36
  * @LastEditors: 空白格
- * @LastEditTime: 2022-08-16 16:40:48
+ * @LastEditTime: 2022-08-17 16:14:48
  * @FilePath: \veterans_client_web\src\layout\index.vue
  * @Copyright: Copyright (c) 2016~2022 by 空白格, All Rights Reserved.
 -->
@@ -31,7 +31,7 @@
           </div>
           <div class="header-box-right-user" v-if="isLogin">
             下午好,<router-link class="link" to="/personalcenter">{{
-              userInfo.userName
+              userInfo.userName || userInfo.name
             }}</router-link>
           </div>
           <div class="header-box-right-user" v-else>
@@ -146,7 +146,7 @@ export default {
   }
 }
 .main {
-  background-color: #f2f2f2;
+  background-color: #F4F4F4;
 }
 .footer {
   background-color: #659789;

+ 13 - 0
src/router/index.js

@@ -1,6 +1,7 @@
 import Vue from 'vue'
 import VueRouter from 'vue-router'
 import Layout from '@/layout'
+import store from '@/store'
 
 Vue.use(VueRouter)
 
@@ -128,6 +129,15 @@ const routes = [
         meta: {
           title: '我的'
         }
+      },
+      {
+        path: 'applyeducationauth',
+        name: 'ApplyEducationAuthIndex',
+        component: () =>
+          import('@/views/PersonalCenter/ApplyEducationAuth/ApplyEducationAuthIndex.vue'),
+        meta: {
+          title: '退役军人认证'
+        }
       }
     ]
   },
@@ -150,6 +160,9 @@ router.beforeEach((to, from, next) => {
   if (to.meta.title) {
     document.title = to.meta.title
   }
+  if (store.state.user.token && !store.state.user.isLogin) {
+    store.dispatch('GetUserInfo')
+  }
   next()
 })
 

+ 52 - 19
src/store/modules/user.js

@@ -3,51 +3,84 @@
  * @Author: 空白格
  * @Date: 2022-08-10 13:40:53
  * @LastEditors: 空白格
- * @LastEditTime: 2022-08-15 10:11:14
+ * @LastEditTime: 2022-08-17 16:59:06
  * @FilePath: \veterans_client_web\src\store\modules\user.js
  * @Copyright: Copyright (c) 2016~2022 by 空白格, All Rights Reserved.
  */
-import { getToken } from "@/utils/auth"
-import { loginAuthCode, getAuthCode } from "@/api/Login";
+import { getToken, setToken, removeToken } from '@/utils/auth'
+import { loginAuthCode, getAuthCode, getUserInfo, logout } from '@/api/Login'
 const user = {
   state: {
     token: getToken(),
-    isLogin: true,
-    userInfo: {
-      userName: 'xxx'
-    }
+    isLogin: false,
+    userInfo: {}
   },
   mutations: {
     SET_TOKEN: (state, token) => {
-      state.token = token;
+      state.token = token
     },
     SET_LOGIN_FLAG: (state, flag) => {
-      state.isLogin = flag;
+      state.isLogin = flag
+    },
+    SET_USER_INFO: (state, userInfo) => {
+      state.userInfo = userInfo
     }
   },
   actions: {
-    // 登录验证验证码
+    // 验证登录验证码
     Login({ commit, state }, userInfo) {
+      console.log(state)
       return new Promise((resolve, reject) => {
         loginAuthCode({
-          accessToken: state.user.token,
-					userId: userInfo.userId,
-					code: userInfo.code
+          accessToken: state.token,
+          userId: userInfo.userId,
+          code: userInfo.code
         })
-          .then(res => {
+          .then((res) => {
+            resolve(res)
+          })
+          .catch((error) => {
+            reject(error)
+          })
+      })
+    },
+    // 获取登录验证码
+    GetLoginCode({ commit }, param) {
+      return new Promise((resolve, reject) => {
+        getAuthCode(param)
+          .then((res) => {
+            commit('SET_TOKEN', res.data.accessToken)
+            setToken(res.data.accessToken)
+            resolve(res)
+          })
+          .catch((error) => {
+            reject(error)
+          })
+      })
+    },
+    // 获取用户信息
+    GetUserInfo({ commit }) {
+      return new Promise((resolve, reject) => {
+        getUserInfo()
+          .then((res) => {
             commit('SET_LOGIN_FLAG', true)
-            resolve()
+            commit('SET_USER_INFO', res.data)
+            resolve(res)
           })
           .catch((error) => {
             reject(error)
           })
       })
     },
-    GetLoginCode({ commit }) {
+    // 退出登录
+    Logout({ commit }) {
       return new Promise((resolve, reject) => {
-        getAuthCode()
-          .then(res => {
-            commit('SET_TOKEN', res.accessToken)
+        logout()
+          .then((res) => {
+            commit('SET_LOGIN_FLAG', false)
+            commit('SET_USER_INFO', {})
+            commit('SET_TOKEN', '')
+            removeToken()
             resolve(res)
           })
           .catch((error) => {

+ 6 - 4
src/utils/request.js

@@ -2,6 +2,7 @@ import axios from 'axios'
 import { Notification, MessageBox, Message, Loading } from 'element-ui'
 import { getToken } from '@/utils/auth'
 import { tansParams } from '@/utils/utils'
+import store from '@/store'
 
 axios.defaults.headers['Content-Type'] = 'application/json;charset=utf-8'
 
@@ -47,7 +48,8 @@ service.interceptors.request.use(
 service.interceptors.response.use(
   (res) => {
     // 未设置状态码则默认成功状态
-    const code = res.data.code || 200
+    const code = res.data.code || 200,
+    msg = res?.data?.msg
     // 鉴权校验
     if (code === 401) {
       MessageBox.confirm(
@@ -68,13 +70,13 @@ service.interceptors.response.use(
       return Promise.reject('登录状态已过期,请重新登录。')
     } else if (code === 500) {
       Message({
-        message: msg,
+        message: msg || '系统错误!',
         type: 'error'
       })
-      return Promise.reject(new Error(msg))
+      return Promise.reject(new Error(msg || '系统错误!'))
     } else if (code !== 200) {
       Notification.error({
-        title: res?.data?.msg
+        title: msg || '操作失败!'
       })
       return Promise.reject('error')
     } else {

+ 435 - 66
src/views/Home/HomeIndex.vue

@@ -3,7 +3,7 @@
  * @Author: 空白格
  * @Date: 2022-08-10 11:26:40
  * @LastEditors: 空白格
- * @LastEditTime: 2022-08-16 17:30:29
+ * @LastEditTime: 2022-08-17 16:55:45
  * @FilePath: \veterans_client_web\src\views\Home\HomeIndex.vue
  * @Copyright: Copyright (c) 2016~2022 by 空白格, All Rights Reserved.
 -->
@@ -13,7 +13,7 @@
     <div class="home-carousel">
       <el-carousel :interval="5000" arrow="always" height="400px">
         <el-carousel-item v-for="(item, index) in bannerList" :key="index">
-          <el-image class="image" :src="item.bannerUrl" fit="contain">
+          <el-image class="image" :src="item.bannerUrl" fit="cover">
             <div slot="placeholder" class="image-slot">
               加载图片中<span class="dot">...</span>
             </div>
@@ -26,39 +26,29 @@
       <div class="home-menu-list">
         <div
           class="home-menu-list-item"
+          :class="{ active: index === 0 }"
           v-for="(item, index) in menuList"
           :key="index"
+          @click="jumpPage(item.path)"
         >
           {{ item.name }}
         </div>
       </div>
     </div>
     <div class="home-main" :class="{ 'home-main-top': scrollTop > 473 }">
+      <!-- 新闻最新一条 -->
+      <div class="home-main-latest">
+        <div class="home-main-latest-content">
+          <div class="hmlc-title">{{ latestNews.artTitle }}</div>
+          <div class="hmlc-content" v-html="latestNews.artContent"></div>
+        </div>
+      </div>
       <div class="home-main-box">
-        <!-- 菜单部分 -->
-        <el-row :gutter="0" class="home-main-menu">
-          <el-col
-            :xs="12"
-            :sm="8"
-            :md="6"
-            :lg="3"
-            :xl="3"
-            v-for="(menu, index) in menuList"
-            :key="index"
-          >
-            <div class="home-main-menu-item" @click="jumpPage(menu.path)">
-              <div class="home-main-menu-icon">
-                <el-image class="image" :src="menu.icon"></el-image>
-              </div>
-              <div class="home-main-menu-name">{{ menu.name }}</div>
-            </div>
-          </el-col>
-        </el-row>
         <!-- 新闻部分 -->
         <el-row :gutter="0" class="home-main-news">
           <el-col :xs="24" :sm="24" :md="12" :lg="12" :xl="12">
             <div class="home-main-news-left">
-              <el-carousel :interval="5000" arrow="never" height="303px">
+              <el-carousel :interval="5000" arrow="never" height="395px">
                 <el-carousel-item
                   v-for="(item, index) in newsList"
                   :key="index"
@@ -69,7 +59,7 @@
                       item.artImage ||
                       require('@/assets/images/default-news.jpg')
                     "
-                    fit="fill"
+                    fit="cover"
                   >
                     <div slot="placeholder" class="image-slot">
                       加载图片中<span class="dot">...</span>
@@ -124,16 +114,133 @@
             </div>
           </el-col>
         </el-row>
+        <!-- 政策咨询部分 -->
+        <el-row :gutter="0" class="home-main-policy">
+          <el-col :span="24" class="home-main-policy-carousel">
+            <el-carousel :interval="5000" arrow="never" height="140px">
+              <el-carousel-item
+                v-for="(item, index) in policyObj.bannerList"
+                :key="index"
+              >
+                <el-image
+                  class="image"
+                  :src="
+                    item.bannerUrl ||
+                    require('@/assets/images/default-news.jpg')
+                  "
+                  fit="cover"
+                >
+                  <div slot="placeholder" class="image-slot">
+                    加载图片中<span class="dot">...</span>
+                  </div>
+                  <div slot="error" class="image-slot">
+                    <el-image
+                      class="image"
+                      :src="require('@/assets/images/default-news.jpg')"
+                      fit="cover"
+                    ></el-image>
+                  </div>
+                </el-image>
+                <div class="title">
+                  {{ item.artTitle || "" }}
+                </div>
+              </el-carousel-item>
+            </el-carousel>
+          </el-col>
+          <el-col
+            :span="24"
+            class="home-main-policy-content"
+            v-loading="policyObj.loading"
+          >
+            <el-row :gutter="54">
+              <el-col :xs="24" :sm="24" :md="16" :lg="16" :xl="16">
+                <div class="hmpc-left">
+                  <el-tabs
+                    v-model="policyObj.tabCur"
+                    @tab-click="handlePolicyClick"
+                  >
+                    <el-tab-pane
+                      v-for="(item, index) in policyObj.policyTypeList"
+                      :key="index"
+                      :label="item.label"
+                      :name="item.text"
+                    >
+                      <div
+                        class="hmpc-left-list"
+                        v-if="policyObj.policyList.length"
+                      >
+                        <div
+                          class="hmpc-left-list-item"
+                          v-for="(item, index) in policyObj.policyList"
+                          :key="index"
+                        >
+                          <div class="title">{{ item.artTitle }}</div>
+                          <div class="date">
+                            {{ parseTime(item.artPostTime, "{y}-{m}-{d}") }}
+                          </div>
+                        </div>
+                      </div>
+                      <el-empty description="列表为空" v-else></el-empty>
+                    </el-tab-pane>
+                  </el-tabs>
+                </div>
+              </el-col>
+              <el-col :xs="24" :sm="24" :md="8" :lg="8" :xl="8">
+                <div class="hmpc-right">
+                  <div class="hmpc-right-title">退役军人服务</div>
+                  <div class="hmpc-right-list">
+                    <div
+                      class="hmpc-right-list-btn hmpc-right-list-btn-1"
+                    ></div>
+                    <div
+                      class="hmpc-right-list-btn hmpc-right-list-btn-2"
+                    ></div>
+                    <div
+                      class="hmpc-right-list-btn hmpc-right-list-btn-3"
+                    ></div>
+                    <div
+                      class="hmpc-right-list-btn hmpc-right-list-btn-4"
+                    ></div>
+                    <div
+                      class="hmpc-right-list-btn hmpc-right-list-btn-5"
+                    ></div>
+                  </div>
+                </div>
+              </el-col>
+            </el-row>
+          </el-col>
+        </el-row>
+        <!-- 院校合作 -->
+        <institutional-cooperation />
+        <!-- 企业合作 -->
+        <enterprise-cooperation />
       </div>
     </div>
+    <!-- 友情链接 -->
+    <friendship-link/>
   </div>
 </template>
 
 <script>
 import { parseTime } from "@/utils/utils";
-import { getBannerList, getNewsList, getNoticeList } from "@/api/Home";
+import {
+  getBannerList,
+  getNewsList,
+  getNoticeList,
+  getNewsData,
+} from "@/api/Home";
+import { getDictData } from "@/api/Dict";
+import { getPolicyData } from "@/api/PolicyAdvice";
+import InstitutionalCooperation from "./components/InstitutionalCooperation";
+import EnterpriseCooperation from "./components/EnterpriseCooperation";
+import FriendshipLink from "./components/FriendshipLink";
 export default {
   name: "HomeIndex",
+  components: {
+    InstitutionalCooperation,
+    EnterpriseCooperation,
+    FriendshipLink
+  },
   data() {
     return {
       bannerList: [],
@@ -141,7 +248,6 @@ export default {
         {
           name: "首页",
           icon: require("@/assets/images/home-menu-icon/home-menu-icon-1.svg"),
-          path: "/",
         },
         {
           name: "政策咨询",
@@ -184,11 +290,19 @@ export default {
           path: "/workguide",
         },
       ],
+      latestNews: {},
       newsList: [],
       noticeList: [],
       activeName: "first",
       parseTime: parseTime,
       scrollTop: 0,
+      policyObj: {
+        loading: false,
+        tabCur: "",
+        policyTypeList: [],
+        bannerList: [],
+        policyList: [],
+      },
     };
   },
   created() {
@@ -199,16 +313,31 @@ export default {
     window.addEventListener("scroll", that.scrollHander);
   },
   destroyed() {
-    window.removeEventListener('scroll', this.scrollHander)
+    window.removeEventListener("scroll", this.scrollHander);
   },
   methods: {
     scrollHander(e) {
       this.scrollTop = e.srcElement.scrollingElement.scrollTop;
     },
     initData() {
+      this.getDict();
       this.getBanner();
       this.getNews();
       this.getNotice();
+      this.getPolicyBannerList();
+    },
+    /**
+     * 获取字典数据
+     * @date 2022-08-17
+     * @returns {any}
+     */
+    getDict() {
+      getDictData({ key: "policy_type" }).then((res) => {
+        this.policyObj.policyTypeList = res?.data;
+        this.policyObj.policyTypeList.length &&
+          (this.policyObj.tabCur = this.policyObj.policyTypeList[0].text) &&
+          this.getPolicyList();
+      });
     },
     /**
      * 获取轮播图
@@ -229,9 +358,23 @@ export default {
       getNewsList({
         artCategoryId: 2,
         pageNum: 1,
-        pageSize: 5,
+        pageSize: 10,
       }).then((res) => {
-        this.newsList = res.rows;
+        this.newsList = res?.rows ?? [];
+        if (this.newsList.length) {
+          this.getNewsInfo(this.newsList[1].artId);
+        }
+      });
+    },
+    /**
+     * 获取新闻详情
+     * @date 2022-08-17
+     * @param {any} id
+     * @returns {any}
+     */
+    getNewsInfo(id) {
+      getNewsData({ id }).then((res) => {
+        this.latestNews = res?.data ?? [];
       });
     },
     /**
@@ -241,7 +384,7 @@ export default {
      */
     getNotice() {
       getNoticeList().then((res) => {
-        this.noticeList = res.data;
+        this.noticeList = res?.data ?? [];
       });
     },
     /**
@@ -260,6 +403,42 @@ export default {
           break;
       }
     },
+    /**
+     * 获取政策咨询轮播
+     * @date 2022-08-17
+     * @returns {any}
+     */
+    getPolicyBannerList() {
+      getBannerList({ type: 2 }).then((res) => {
+        this.policyObj.bannerList = res.data;
+      });
+    },
+    /**
+     * 获取咨询列表
+     * @date 2022-08-17
+     * @returns {any}
+     */
+    getPolicyList() {
+      this.policyObj.loading = true;
+      getPolicyData({
+        pageNum: 1,
+        pageSize: 10,
+        artCategoryId: this.policyObj.tabCur,
+      }).then((res) => {
+        this.policyObj.policyList = res?.rows;
+        this.policyObj.loading = false;
+      });
+    },
+    /**
+     * 政策咨询tab切换触发
+     * @date 2022-08-17
+     * @param {any} tab
+     * @returns {any}
+     */
+    handlePolicyClick(tab) {
+      this.policyObj.tabCur = tab.name;
+      this.getPolicyList();
+    },
     /**
      * 跳转到指定页面
      * @date 2022-08-11
@@ -267,7 +446,9 @@ export default {
      * @returns {any}
      */
     jumpPage(path) {
-      this.$router.push(path);
+      if (path) {
+        this.$router.push(path);
+      }
     },
   },
 };
@@ -284,10 +465,6 @@ export default {
       line-height: 400px;
       text-align: center;
     }
-    :deep(.el-carousel__indicators) {
-      // 指示器
-      bottom: 84px;
-    }
     :deep(.el-carousel__arrow) {
       border: solid 1px rgba($color: #fff, $alpha: 0.7);
     }
@@ -308,23 +485,26 @@ export default {
   &-menu {
     background-color: #416050;
     width: 100%;
-    height: 104px;
     line-height: 104px;
     &-list {
       width: 70%;
       min-width: 600px;
       display: flex;
-      justify-content: space-between;
+      flex-wrap: wrap;
+      // justify-content: space-between;
       margin: 0 auto;
       &-item {
         color: #fff;
         font-size: 22px;
-        padding: 0 15px;
+        padding: 0 30px;
         cursor: pointer;
         &:hover {
           background-color: #478364;
         }
       }
+      .active {
+        background-color: #478364;
+      }
     }
   }
   .home-menu-fixed {
@@ -334,41 +514,46 @@ export default {
     z-index: 111;
   }
   &-main {
-    width: 70%;
-    min-height: 100vh;
-    margin: 0 auto;
-    min-width: 600px;
-    position: relative;
-    &-box {
-      width: 100%;
-    }
-    &-menu {
-      width: 100%;
+    &-latest {
       background-color: #fff;
-      padding: 30px 50px 10px;
-      border-radius: 5px;
-      &-item {
-        cursor: pointer;
-        margin-bottom: 20px;
-      }
-      &-icon {
-        text-align: center;
-        .image {
-          width: 100%;
-          height: 100%;
-          max-width: 85px;
-          max-height: 85px;
+      &-content {
+        width: 70%;
+        margin: 0 auto;
+        min-width: 600px;
+        padding: 17px 0;
+        .hmlc-title {
+          font-size: 28px;
+          color: #ff001a;
+          text-align: center;
+          margin-bottom: 10px;
+        }
+        .hmlc-content {
+          font-size: 12px;
+          line-height: 17px;
+          overflow: hidden;
+          text-overflow: ellipsis;
+          text-overflow: -o-ellipsis-lastline;
+          display: -webkit-box;
+          -webkit-line-clamp: 2; /* 块元素显示的文本的行数 */
+          line-clamp: 2;
+          -webkit-box-orient: vertical; /* 设置或检索伸缩盒对象的子元素的排列方式 ,盒子行数根据高度来计算 */
+          overflow-wrap: break-word; /* 设置div换行 */
+          p {
+            img {
+              display: none !important;
+            }
+          }
         }
       }
-      &-name {
-        text-align: center;
-        margin-top: 15px;
-      }
+    }
+    &-box {
+      width: 70%;
+      margin: 0 auto;
+      min-width: 600px;
     }
     &-news {
       width: 100%;
-      background-color: #fff;
-      padding: 39px 50px;
+      padding: 47px 0;
       border-radius: 5px;
       margin-top: 14px;
       &-left {
@@ -460,6 +645,190 @@ export default {
         }
       }
     }
+    &-policy {
+      padding: 40px 0;
+      &-carousel {
+        :deep(.el-carousel__button) {
+          // 指示器按钮
+          width: 7px;
+          height: 7px;
+          border: none;
+          border-radius: 50%;
+          background-color: #fff;
+        }
+        :deep(.is-active .el-carousel__button) {
+          // 指示器激活按钮
+          width: 16px;
+          border-radius: 10px;
+        }
+        .image {
+          width: 100%;
+          height: 100%;
+        }
+      }
+      &-content {
+        margin-top: 50px;
+        .hmpc-left {
+          margin-bottom: 20px;
+          :deep(.el-tabs__item) {
+            font-size: 20px;
+            font-weight: 500;
+            color: #666666;
+          }
+          :deep(.el-tabs__item:hover) {
+            color: #163da5;
+          }
+          :deep(.el-tabs__item.is-active) {
+            color: #163da5;
+          }
+          :deep(.el-tabs__active-bar) {
+            background-color: #163da5;
+          }
+          &-list {
+            padding: 10px 0;
+            &-item {
+              display: flex;
+              justify-content: space-between;
+              margin-bottom: 10px;
+              font-size: 14px;
+              color: #373737;
+              cursor: pointer;
+              &:hover {
+                text-decoration: underline;
+              }
+              .title {
+                width: 80%;
+                white-space: nowrap;
+                overflow: hidden;
+                text-overflow: ellipsis;
+                word-break: break-all;
+              }
+              .date {
+                width: 20%;
+                white-space: nowrap;
+                overflow: hidden;
+                text-overflow: ellipsis;
+                word-break: break-all;
+                text-align: right;
+                color: #797979;
+              }
+            }
+          }
+        }
+        .hmpc-right {
+          margin-bottom: 20px;
+          &-title {
+            font-size: 26px;
+            color: #163da5;
+            margin-bottom: 10px;
+          }
+          &-list {
+            &-btn {
+              width: 100%;
+              text-align: center;
+              height: 47px;
+              line-height: 47px;
+              border-radius: 5px;
+              cursor: pointer;
+              font-size: 18px;
+              margin-bottom: 7px;
+              position: relative;
+              &:hover {
+                opacity: 0.8;
+              }
+              &::before {
+                content: "";
+                display: inline-block;
+                width: 25px;
+                height: 25px;
+                background-size: 100% 100%;
+                background-repeat: no-repeat;
+                background-position: center center;
+                vertical-align: middle;
+                position: absolute;
+                left: calc(45% - 35px);
+                top: 50%;
+                margin-top: -12.5px;
+              }
+              &::after {
+                position: absolute;
+                left: 45%;
+              }
+            }
+            &-btn-1 {
+              background-image: linear-gradient(
+                137deg,
+                #c5fff6 0%,
+                #5debd8 100%
+              );
+              color: #028170;
+              &::before {
+                background-image: url("./../../assets/images/zhengcezixun.svg");
+              }
+              &::after {
+                content: "政策咨询";
+              }
+            }
+            &-btn-2 {
+              background-image: linear-gradient(
+                137deg,
+                #fff6e3 0%,
+                #f7b6a3 100%
+              );
+              color: #ff6253;
+              &::before {
+                background-image: url("./../../assets/images/woyaojiuye.svg");
+              }
+              &::after {
+                content: "我要就业";
+              }
+            }
+            &-btn-3 {
+              background-image: linear-gradient(
+                137deg,
+                #fff6e3 0%,
+                #fae08a 100%
+              );
+              color: #ff8d34;
+              &::before {
+                background-image: url("./../../assets/images/woyaoxuejineng.svg");
+              }
+              &::after {
+                content: "我要学技能";
+              }
+            }
+            &-btn-4 {
+              background-image: linear-gradient(
+                137deg,
+                #eee3ff 0%,
+                #d3b9ff 100%
+              );
+              color: #8454d3;
+              &::before {
+                background-image: url("./../../assets/images/woxiangshengxueli.svg");
+              }
+              &::after {
+                content: "我要升学历";
+              }
+            }
+            &-btn-5 {
+              background-image: linear-gradient(
+                137deg,
+                #c9e9ff 0%,
+                #95d2fc 100%
+              );
+              color: #1b74b4;
+              &::before {
+                background-image: url("./../../assets/images/woxiangchuangye.svg");
+              }
+              &::after {
+                content: "我想创业";
+              }
+            }
+          }
+        }
+      }
+    }
   }
   .home-main-top {
     margin-top: 104px;

+ 125 - 0
src/views/Home/components/EnterpriseCooperation.vue

@@ -0,0 +1,125 @@
+<!--
+ * @Description: 企业合作
+ * @Author: 空白格
+ * @Date: 2022-08-17 16:16:38
+ * @LastEditors: 空白格
+ * @LastEditTime: 2022-08-17 16:49:29
+ * @FilePath: \veterans_client_web\src\views\Home\components\EnterpriseCooperation.vue
+ * @Copyright: Copyright (c) 2016~2022 by 空白格, All Rights Reserved.
+-->
+<template>
+  <div class="institutional-cooperation">
+    <div class="institutional-cooperation-title">企业合作</div>
+    <div class="institutional-cooperation-list">
+      <el-row :gutter="30" v-if="companyList.length">
+        <el-col
+          :xs="24"
+          :sm="12"
+          :md="8"
+          :lg="8"
+          :xl="4"
+          v-for="(item, index) in companyList"
+          :key="index"
+        >
+          <div
+            class="institutional-cooperation-list-item"
+            @click="jumpPage(item.id)"
+          >
+            <el-image :src="item.logoUrl" class="image">
+              <div slot="placeholder" class="image-slot">
+                加载中<span class="dot">...</span>
+              </div>
+              <div slot="error" class="image-slot">
+                <i class="el-icon-picture-outline"></i>
+              </div>
+            </el-image>
+            <div class="name">{{ item.companyName || "-" }}</div>
+          </div>
+        </el-col>
+      </el-row>
+      <el-empty description="企业合作数据为空" v-else></el-empty>
+    </div>
+  </div>
+</template>
+
+<script>
+import { getCompanyList } from "@/api/CooperativeEnterprise";
+export default {
+  name: "EnterpriseCooperation",
+  data() {
+    return {
+      companyList: [],
+      queryParams: {
+        pageNum: 1,
+        pageSize: 12,
+      },
+    };
+  },
+  created() {
+    this.getCompanyList();
+  },
+  methods: {
+    /**
+     * 获取企业列表
+     * @date 2022-08-17
+     * @returns {any}
+     */
+    getCompanyList() {
+      getCompanyList(this.queryParams).then((res) => {
+        console.log(res);
+        this.companyList = res?.data?.rows ?? [];
+      });
+    },
+    jumpPage(companyId) {
+      this.$router.push({
+        path: "/enterprisedetails",
+        query: {
+          companyId,
+        },
+      });
+    },
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+.institutional-cooperation {
+  margin: 40px auto 0;
+  padding-bottom: 50px;
+  &-title {
+    font-size: 26px;
+    color: #163da5;
+    text-align: center;
+    margin-bottom: 32px;
+  }
+  &-list {
+    &-item {
+      width: 100%;
+      padding: 15px 0;
+      background-color: #fff;
+      box-shadow: 0 0 5px 0 rgba(0, 0, 0, 0.06);
+      border-radius: 3px;
+      margin-bottom: 12px;
+      text-align: center;
+      cursor: pointer;
+      .image {
+        width: 55px;
+        height: 55px;
+        .image-slot {
+          font-size: 28px;
+        }
+      }
+      .name {
+        color: #000;
+        font-size: 14px;
+        width: 90%;
+        margin: 0 auto;
+        white-space: nowrap;
+        overflow: hidden;
+        text-overflow: ellipsis;
+        word-break: break-all;
+      }
+    }
+  }
+}
+</style>

+ 97 - 0
src/views/Home/components/FriendshipLink.vue

@@ -0,0 +1,97 @@
+<!--
+ * @Description: 友情链接
+ * @Author: 空白格
+ * @Date: 2022-08-17 16:24:25
+ * @LastEditors: 空白格
+ * @LastEditTime: 2022-08-17 16:54:37
+ * @FilePath: \veterans_client_web\src\views\Home\components\FriendshipLink.vue
+ * @Copyright: Copyright (c) 2016~2022 by 空白格, All Rights Reserved.
+-->
+<template>
+  <div class="friendship-link">
+    <div class="friendship-link-box">
+      <div class="friendship-link-box-label">友情链接</div>
+      <div class="friendship-link-box-list">
+        <div class="flbl-item" v-for="(item, index) in linkList" @click="jumpExtraLink(item.link)" :key="index">
+          {{ item.label }}
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+export default {
+  name: "FriendshipLink",
+  data() {
+    return {
+      linkList: [
+        { label: "贵阳市退役军人事务局", link: "http://tyjrj.guiyang.gov.cn/" },
+        { label: "中国人民共和国退役军人事务部", link: "http://www.mva.gov.cn/" },
+        { label: "中国军网", link: "http://www.81.cn/" },
+        { label: "贵阳市人民政府", link: "http://www.guiyang.gov.cn/" },
+        { label: "全国征兵网", link: "https://www.gfbzb.gov.cn/" },
+        { label: "国防大学防务院", link: "/" },
+      ],
+    };
+  },
+  methods: {
+    jumpExtraLink(link) {
+      window.open(link)
+    }
+  }
+};
+</script>
+
+<style lang="scss" scoped>
+.friendship-link {
+  background-color: #d8f0e9;
+  height: 115px;
+  line-height: 115px;
+  &-box {
+    width: 70%;
+    height: 100%;
+    margin: 0 auto;
+    min-width: 600px;
+    display: flex;
+    align-items: center;
+    &-label {
+      background-color: #659789;
+      color: #fff;
+      height: 42px;
+      line-height: 42px;
+      padding: 0 20px;
+      font-size: 14px;
+      &::before {
+        content: "";
+        display: inline-block;
+        width: 14px;
+        height: 14px;
+        background-image: url("./../../../assets/images/link-icon.svg");
+        background-repeat: no-repeat;
+        background-position: center center;
+        background-size: cover;
+        vertical-align: middle;
+        margin-right: 5px;
+      }
+    }
+    &-list {
+      display: flex;
+      align-items: center;
+      .flbl-item {
+        padding: 0 14px;
+        color: #fff;
+        height: 42px;
+        line-height: 42px;
+        font-size: 14px;
+        background: #7AAD9E;
+        margin-right: 5px;
+        cursor: pointer;
+        &:hover {
+          opacity: 0.8;
+        }
+      }
+    }
+  }
+}
+</style>

+ 121 - 0
src/views/Home/components/InstitutionalCooperation.vue

@@ -0,0 +1,121 @@
+<!--
+ * @Description: 院校合作部分
+ * @Author: 空白格
+ * @Date: 2022-08-17 15:11:17
+ * @LastEditors: 空白格
+ * @LastEditTime: 2022-08-17 16:48:00
+ * @FilePath: \veterans_client_web\src\views\Home\components\InstitutionalCooperation.vue
+ * @Copyright: Copyright (c) 2016~2022 by 空白格, All Rights Reserved.
+-->
+<template>
+  <div class="institutional-cooperation">
+    <div class="institutional-cooperation-title">院校合作</div>
+    <div class="institutional-cooperation-list">
+      <el-row :gutter="30" v-if="schoolList.length">
+        <el-col
+          :xs="24"
+          :sm="12"
+          :md="8"
+          :lg="8"
+          :xl="4"
+          v-for="(item, index) in schoolList"
+          :key="index"
+        >
+          <div class="institutional-cooperation-list-item" @click="jumpPage(item.id)">
+            <el-image :src="item.schoolLogoUrl" class="image">
+              <div slot="placeholder" class="image-slot">
+                加载中<span class="dot">...</span>
+              </div>
+              <div slot="error" class="image-slot">
+                <i class="el-icon-picture-outline"></i>
+              </div>
+            </el-image>
+            <div class="name">{{ item.schoolName || '-' }}</div>
+          </div>
+        </el-col>
+      </el-row>
+      <el-empty description="院校合作数据为空" v-else></el-empty>
+    </div>
+  </div>
+</template>
+
+<script>
+import { getSchoolList } from "@/api/CooperativeColleges";
+export default {
+  name: "InstitutionalCooperation",
+  data() {
+    return {
+      schoolList: [],
+      queryParams: {
+        pageNum: 1,
+        pageSize: 12,
+      },
+    };
+  },
+  created() {
+    this.getSchoolList();
+  },
+  methods: {
+    /**
+     * 获取学校列表
+     * @date 2022-08-17
+     * @returns {any}
+     */
+    getSchoolList() {
+      getSchoolList(this.queryParams).then((res) => {
+        console.log(res);
+        this.schoolList = res?.rows ?? [];
+      });
+    },
+    jumpPage(schoolId) {
+      this.$router.push({
+        path: "/collegesdetails",
+        query: {
+          schoolId,
+        },
+      });
+    },
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+.institutional-cooperation {
+  margin: 40px auto;
+  &-title {
+    font-size: 26px;
+    color: #163da5;
+    text-align: center;
+    margin-bottom: 32px;
+  }
+  &-list {
+    &-item {
+      width: 100%;
+      padding: 15px 0;
+      background-color: #fff;
+      box-shadow: 0 0 5px 0 rgba(0, 0, 0, 0.06);
+      border-radius: 3px;
+      margin-bottom: 12px;
+      text-align: center;
+      cursor: pointer;
+      .image {
+        width: 55px;
+        height: 55px;
+        .image-slot {
+          font-size: 28px;
+        }
+      }
+      .name {
+        color: #000;
+        font-size: 14px;
+        width: 90%;
+        margin: 0 auto;
+        white-space: nowrap;
+        overflow: hidden;
+        text-overflow: ellipsis;
+        word-break: break-all;
+      }
+    }
+  }
+}
+</style>

+ 291 - 2
src/views/Login/LoginIndex.vue

@@ -3,10 +3,299 @@
  * @Author: 空白格
  * @Date: 2022-08-10 11:45:16
  * @LastEditors: 空白格
- * @LastEditTime: 2022-08-10 11:45:16
+ * @LastEditTime: 2022-08-17 17:05:19
  * @FilePath: \veterans_client_web\src\views\Login\LoginIndex.vue
  * @Copyright: Copyright (c) 2016~2022 by 空白格, All Rights Reserved.
 -->
 <template>
-  <div>登录页</div>
+  <div class="login">
+    <div class="login-box">
+      <div class="login-box-form">
+        <div class="login-box-form-title">贵州退役军人教育培训</div>
+        <div class="login-box-form-subtitle">用户登录</div>
+        <el-form
+          :model="form"
+          :rules="rules"
+          ref="loginForm"
+          class="login-box-form-main"
+        >
+          <el-form-item prop="mobile">
+            <el-input
+              v-model="form.mobile"
+              :maxlength="11"
+              type="tel"
+              placeholder="请输入手机号"
+            >
+              <el-image
+                class="el-input__icon"
+                slot="prefix"
+                :src="require('@/assets/images/user-icon.svg')"
+                style="width: 27px; height: 58px"
+              ></el-image>
+            </el-input>
+          </el-form-item>
+          <el-form-item prop="code">
+            <div class="code-verify">
+              <div class="code-verify-input">
+                <el-input
+                  v-model="form.code"
+                  :maxlength="4"
+                  placeholder="请输入验证码"
+                >
+                  <el-image
+                    class="el-input__icon"
+                    slot="prefix"
+                    :src="require('@/assets/images/key-icon.svg')"
+                    style="width: 27px; height: 58px"
+                  ></el-image>
+                </el-input>
+              </div>
+              <div class="code-verify-btn">
+                <template v-if="!validCode.msg">
+                  <el-button
+                    class="code-verify-btn-code"
+                    :disabled="!form.mobile"
+                    @click="getPhoneCode"
+                    >获取验证码</el-button
+                  >
+                </template>
+                <template v-else>
+                  <span>{{ validCode.seconds }}秒后可重新获取</span>
+                </template>
+              </div>
+            </div>
+          </el-form-item>
+          <el-form-item>
+            <el-button
+              class="login-btn"
+              type="primary"
+              :disabled="!form.code || !form.accessToken"
+              :loading="subLoading"
+              @click="submitCode"
+              >登录</el-button
+            >
+          </el-form-item>
+        </el-form>
+      </div>
+    </div>
+  </div>
 </template>
+
+<script>
+import { veteEducCheck } from "@/api/Login";
+export default {
+  name: "LoginIndex",
+  data() {
+    return {
+      form: {
+        mobile: "",
+        code: "",
+        accessToken: "",
+        userId: "",
+      },
+      subLoading: false,
+      validCode: {
+        seconds: 60,
+        msg: false,
+        timer: null,
+      },
+      rules: {
+        mobile: [
+          { required: true, message: "请输入手机号", trigger: "blur" },
+          {
+            pattern:
+              /^(13[0-9]|14[01456879]|15[0-35-9]|16[2567]|17[0-8]|18[0-9]|19[0-35-9])\d{8}$/,
+            message: "请输入正确的手机号",
+            trigger: "blur",
+          },
+        ],
+      },
+    };
+  },
+  methods: {
+    /**
+     * 获取手机验证码
+     * @date 2022-08-17
+     * @returns {any}
+     */
+    getPhoneCode() {
+      this.$refs["loginForm"].validate((valid) => {
+        if (valid) {
+          this.$store
+            .dispatch("GetLoginCode", { mobile: this.form.mobile })
+            .then((res) => {
+              if (res.code === 200) {
+                this.form.accessToken = res.data.accessToken;
+                this.form.userId = res.data.userId;
+                this.codeCountDown();
+              }
+            });
+        }
+      });
+    },
+    /**
+     * 验证码
+     * @date 2022-08-17
+     * @returns {any}
+     */
+    submitCode() {
+      if (this.form.code && this.form.accessToken) {
+        this.subLoading = true;
+        this.$store
+          .dispatch("Login", {
+            accessToken: this.form.accessToken,
+            userId: this.form.userId,
+            code: this.form.code,
+          })
+          .then((res) => {
+            if (res.code === 200) {
+              this.$store
+                .dispatch("GetUserInfo")
+                .then((res) => {
+                  if (res.code === 200) {
+                    this.validateEducCheck();
+                  } else {
+                    this.subLoading = false;
+                  }
+                })
+                .catch(() => {
+                  this.subLoading = false;
+                });
+            } else {
+              this.$message.error(res.msg || '登录失败!')
+            }
+          })
+          .catch(() => {
+            this.subLoading = false;
+          });
+      }
+    },
+    /**
+     * 判断是否进行认证
+     * @date 2022-08-17
+     * @returns {any}
+     */
+    validateEducCheck() {
+      veteEducCheck()
+        .then((res) => {
+          if (res.data != 9) {
+            this.jumpPage();
+          } else {
+            this.$router.push({
+              path: "/applyeducationauth",
+            });
+          }
+          this.subLoading = false;
+        })
+        .catch(() => {
+          this.subLoading = false;
+        });
+    },
+    /**
+     * 跳转指定页面
+     * @date 2022-08-17
+     * @returns {any}
+     */
+    jumpPage() {
+      this.$router.push({
+        path: "/",
+      });
+    },
+    /**
+     * 倒计时
+     * @date 2022-08-17
+     * @returns {any}
+     */
+    codeCountDown() {
+      this.validCode.msg = true;
+      this.validCode.timer = setInterval(() => {
+        this.validCode.seconds--;
+        if (this.validCode.seconds === 0) {
+          clearInterval(this.timer);
+          this.validCode.msg = false;
+        }
+      }, 1000);
+    },
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+.login {
+  width: 100%;
+  min-width: 750px;
+  height: 100vh;
+  background-image: url("./../../assets/images/login-bg.png");
+  background-position: center center;
+  background-size: cover;
+  background-repeat: no-repeat;
+  position: relative;
+  &-box {
+    position: absolute;
+    top: 50vh;
+    right: 270px;
+    margin-top: -263px;
+    padding: 62px 53px;
+    background-color: #fff;
+    box-shadow: 5px 5px 28px -17px rgba(120, 120, 120, 0.3);
+    border-radius: 12px;
+    width: 500px;
+    &-form {
+      &-title {
+        font-size: 42px;
+        text-align: center;
+        color: #1c163f;
+        margin-bottom: 20px;
+      }
+      &-subtitle {
+        font-size: 31px;
+        text-align: center;
+        color: #1c163f;
+        margin-bottom: 20px;
+      }
+      &-main {
+        :deep(.el-input__inner) {
+          height: 58px;
+          line-height: 58px;
+          padding-left: 60px;
+          border-radius: 0;
+        }
+        :deep(.el-input__prefix) {
+          left: 20px;
+          line-height: 58px;
+        }
+        .code-verify {
+          display: flex;
+          width: 100%;
+          &-input {
+            width: calc(100% - 132px);
+            margin-right: 10px;
+          }
+          &-btn {
+            line-height: 58px;
+            color: #e6a23c;
+            &-code {
+              width: 122px;
+              background-color: #5e9c7c;
+              height: 58px;
+              color: #fff;
+              font-size: 14px;
+            }
+          }
+        }
+        .login-btn {
+          width: 100%;
+          height: 64px;
+          margin-top: 40px;
+          font-size: 21px;
+        }
+      }
+    }
+  }
+}
+@media screen and (max-width: 900px) {
+  .login-box {
+    right: 125px;
+  }
+}
+</style>

+ 12 - 0
src/views/PersonalCenter/ApplyEducationAuth/ApplyEducationAuthIndex.vue

@@ -0,0 +1,12 @@
+<!--
+ * @Description: 退役军人认证页面
+ * @Author: 空白格
+ * @Date: 2022-08-17 11:30:23
+ * @LastEditors: 空白格
+ * @LastEditTime: 2022-08-17 11:31:59
+ * @FilePath: \veterans_client_web\src\views\PersonalCenter\ApplyEducationAuth\ApplyEducationAuthIndex.vue
+ * @Copyright: Copyright (c) 2016~2022 by 空白格, All Rights Reserved.
+-->
+<template>
+  <div>退役军人认证1</div>
+</template>

Some files were not shown because too many files changed in this diff