修改首页/登录页/新建新闻/公告详情页面

src/router/index.js

@@ -130,6 +130,15 @@ const routes = [
           title: '我的'
         }
       },
+      {
+        path: 'setting',
+        name: 'SettingIndex',
+        component: () =>
+          import('@/views/PersonalCenter/Setting/SettingIndex.vue'),
+        meta: {
+          title: '设置'
+        }
+      },
       {
         path: 'applyeducationauth',
         name: 'ApplyEducationAuthIndex',
@@ -147,6 +156,24 @@ const routes = [
         meta: {
           title: '新闻中心'
         }
+      },
+      {
+        path: 'newsdetails',
+        name: 'NewsDetailsIndex',
+        component: () =>
+          import('@/views/NewsCenter/NewsDetails/NewsDetailsIndex.vue'),
+        meta: {
+          title: '新闻详情'
+        }
+      },
+      {
+        path: 'noticedetails',
+        name: 'NoticeDetailsIndex',
+        component: () =>
+          import('@/views/NewsCenter/NoticeDetails/NoticeDetailsIndex.vue'),
+        meta: {
+          title: '通知详情'
+        }
       }
     ]
   },

src/views/AdaptiveTraining/AdaptiveTrainingIndex copy.vue

@@ -0,0 +1,475 @@
+<!--
+ * @Description: 适应性培训备份
+ * @Author: 空白格
+ * @Date: 2022-08-22 11:24:50
+ * @LastEditors: 空白格
+ * @LastEditTime: 2022-08-22 11:24:50
+ * @FilePath: \veterans_client_web\src\views\AdaptiveTraining\AdaptiveTrainingIndex copy.vue
+ * @Copyright: Copyright (c) 2016~2022 by 空白格, All Rights Reserved.
+-->
+<template>
+  <div class="app-main adaptive-training">
+    <BannerBreadcrumb title="适应性培训" />
+    <div class="app-main-box">
+      <!-- banner -->
+      <div class="adaptive-training-banner">
+        <div class="adaptive-training-banner-title">适应性培训</div>
+        <div class="adaptive-training-banner-subtitle">
+          -退役军人思想政治教育 -退役军人就业创业指导
+        </div>
+        <div class="adaptive-training-banner-describe">
+          适应性培训课程包含思想政治教育、法律法规政策介绍，就业创业指导、求职技巧指导、服务项目指引等，需看完线上课程后完成适应性培训。
+        </div>
+      </div>
+      <!-- 统计 -->
+      <div class="adaptive-training-statistics">
+        <div class="adaptive-training-statistics-box">
+          <div class="atsb-tab">
+            <div
+              class="atsb-tab-item"
+              v-for="(item, index) in tabList"
+              :key="index"
+              :class="{ 'atsb-tab-active': tabCur === item.value }"
+              @click="tabClick(item)"
+            >
+              {{ item.label }}
+            </div>
+          </div>
+          <template v-if="tabCur === 1">
+            <div class="atsb-total">
+              <div class="atsb-total-item">
+                <p>已看课程</p>
+                <p>
+                  <span>{{ trainingTotal.play || 0 }}</span
+                  >个
+                </p>
+              </div>
+              <div class="atsb-total-item">
+                <p>还需观看</p>
+                <p>
+                  <span>{{ trainingTotal.playNot || 0 }}</span
+                  >个
+                </p>
+              </div>
+            </div>
+          </template>
+          <template v-else>
+            <div class="atsb-total" v-if="trainingTotal.status === 0">
+              <div class="atsb-total-item">
+                <p>未参加线下培训</p>
+                <p>（注：必须参加线下培训才能通过适应性培训）</p>
+              </div>
+            </div>
+            <div class="atsb-total" v-else>
+              <div class="atsb-total-item">
+                <p>已参加线下培训</p>
+                <p>（注：必须参加线下培训才能通过适应性培训）</p>
+              </div>
+            </div>
+          </template>
+        </div>
+      </div>
+      <!-- 列表 -->
+      <template v-if="tabCur === 1">
+        <div
+          class="app-main-box-content adaptive-training-list"
+          v-loading="onlineObj.loading"
+          v-if="onlineObj.list.length"
+        >
+          <el-row :gutter="16">
+            <el-col
+              :xs="24"
+              :sm="24"
+              :md="12"
+              :lg="12"
+              :xl="12"
+              v-for="(item, index) in onlineObj.list"
+              :key="index"
+            >
+              <div class="adaptive-training-list-item">
+                <div class="left">
+                  <el-image :src="item.titleImg" class="image" fit="cover">
+                    <div slot="placeholder" class="image-slot">
+                      加载中<span class="dot">...</span>
+                    </div>
+                  </el-image>
+                </div>
+                <div class="right">
+                  <div class="name">{{ item.adaptName }}</div>
+                  <div class="total">
+                    共{{ item.amount || 0 }}节课，已学完{{
+                      item.finishCount || 0
+                    }}节课，学习进度{{ item.finishPercent || 0 }}%
+                  </div>
+                </div>
+              </div>
+            </el-col>
+          </el-row>
+          <div class="pagination" v-if="onlineObj.total">
+            <el-pagination
+              background
+              layout="prev, pager, next"
+              :page-size="onlineObj.queryParams.pageSize"
+              :total="onlineObj.total"
+              @current-change="onlineCurrentChange"
+            />
+          </div>
+        </div>
+        <el-empty description="列表数据为空" v-else></el-empty>
+      </template>
+      <template v-else>
+        <div
+          class="app-main-box-content adaptive-training-list"
+          v-loading="offlineObj.loading"
+          v-if="offlineObj.list.length"
+        >
+          <el-row :gutter="16">
+            <el-col
+              :xs="24"
+              :sm="24"
+              :md="12"
+              :lg="12"
+              :xl="12"
+              v-for="(item, index) in offlineObj.list"
+              :key="index"
+            >
+              <div class="adaptive-training-list-item">
+                <div class="offline">
+                  <p class="name">{{ item.adaptName || "-" }}</p>
+                  <div class="bottom">
+                    <div>{{ item.adaptAddress || "-" }}</div>
+                    <div>{{ parseTime(item.createTime) || "-" }}</div>
+                  </div>
+                </div>
+              </div>
+            </el-col>
+          </el-row>
+          <div class="pagination" v-if="offlineObj.total">
+            <el-pagination
+              background
+              layout="prev, pager, next"
+              :page-size="offlineObj.queryParams.pageSize"
+              :total="offlineObj.total"
+              @current-change="offlineCurrentChange"
+            />
+          </div>
+        </div>
+        <el-empty description="列表数据为空" v-else></el-empty>
+      </template>
+    </div>
+  </div>
+</template>
+
+<script>
+import BannerBreadcrumb from "@/components/BannerBreadcrumb";
+import {
+  getTrainingList,
+  getTrainingTotal,
+  getOfflineTrainingList,
+} from "@/api/AdaptiveTraining";
+import { mapState } from "vuex";
+import { parseTime } from "@/utils/utils";
+export default {
+  name: "AdaptiveTrainingIndex",
+  components: {
+    BannerBreadcrumb,
+  },
+  data() {
+    return {
+      tabCur: 1,
+      tabList: [
+        { label: "适应性培训", value: 1 },
+        { label: "线下培训", value: 2 },
+      ],
+      // 线上课程
+      onlineObj: {
+        queryParams: {
+          pageNum: 1,
+          pageSize: 8,
+        },
+        loading: false,
+        total: 0,
+        list: [],
+      },
+      // 线下课程
+      offlineObj: {
+        queryParams: {
+          pageNum: 1,
+          pageSize: 8,
+        },
+        loading: false,
+        total: 0,
+        list: [],
+      },
+      trainingTotal: {
+        play: 0,
+        playNot: 0,
+        status: 0,
+      },
+      parseTime: parseTime,
+    };
+  },
+  computed: {
+    ...mapState({
+      isLogin: (state) => state.user.isLogin,
+    }),
+  },
+  created() {
+    this.getOnlineList();
+    this.getOfflineList();
+    if (this.isLogin) {
+      this.getTrainingTotal();
+    }
+  },
+  methods: {
+    tabClick(item) {
+      this.tabCur = item.value;
+    },
+    /**
+     * 获取适应性培训
+     * @date 2022-08-12
+     * @returns {any}
+     */
+    getOnlineList() {
+      this.onlineObj.loading = true;
+      getTrainingList(this.onlineObj.queryParams).then((res) => {
+        this.onlineObj.list = res.rows;
+        this.onlineObj.total = Number(res.total);
+        this.onlineObj.loading = false;
+      });
+    },
+    /**
+     * 线上分页触发
+     * @date 2022-08-12
+     * @param {any} page
+     * @returns {any}
+     */
+    onlineCurrentChange(page) {
+      this.onlineObj.queryParams.pageNum = page;
+      this.getOnlineList();
+    },
+    /**
+     * 获取适应性培训统计
+     * @date 2022-08-15
+     * @returns {any}
+     */
+    getTrainingTotal() {
+      getTrainingTotal().then((res) => {
+        if (res.code === 200) {
+          this.trainingTotal = res.data;
+        }
+      });
+    },
+    /**
+     * 获取线下课程列表
+     * @date 2022-08-15
+     * @returns {any}
+     */
+    getOfflineList() {
+      this.offlineObj.loading = true;
+      getOfflineTrainingList(this.offlineObj.queryParams).then((res) => {
+        this.offlineObj.list = res.rows;
+        this.offlineObj.total = Number(res.total);
+        this.offlineObj.loading = false;
+      });
+    },
+    /**
+     * 线下分页触发
+     * @date 2022-08-15
+     * @param {any} page
+     * @returns {any}
+     */
+    offlineCurrentChange(page) {
+      this.offlineObj.queryParams.pageNum = page;
+      this.getOfflineList();
+    },
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+.adaptive-training {
+  padding-bottom: 30px;
+  &-banner {
+    width: 100%;
+    height: 300px;
+    background: url("./../../assets/images/adaptive-training-banner.png")
+      no-repeat center center;
+    background-size: 100% 100%;
+    &-title {
+      text-align: center;
+      position: relative;
+      font-size: 40px;
+      padding-top: 20px;
+      width: 300px;
+      margin: 0 auto;
+      text-align: justify;
+      text-align-last: justify;
+      color: #fff;
+      &::before {
+        content: "";
+        display: block;
+        width: 26px;
+        height: 26px;
+        background: url("./../../assets/images/star-icon.svg") no-repeat center
+          center;
+        background-size: 100% 100%;
+        position: absolute;
+        left: -30px;
+        top: 30px;
+      }
+    }
+    &-subtitle {
+      width: 90%;
+      margin: 20px auto;
+      padding: 20px 0;
+      text-align: center;
+      color: #fff;
+      font-size: 22px;
+      font-family: SourceHanSansCN;
+      border-top: 1px solid #fff;
+      border-bottom: 1px solid #fff;
+    }
+    &-describe {
+      width: 90%;
+      height: 60px;
+      line-height: 60px;
+      text-align: center;
+      margin: 28px auto 0;
+      background: #4d3be0;
+      opacity: 0.8;
+      border: solid 1px #fff;
+      color: #fff;
+      font-size: 14px;
+    }
+  }
+  &-statistics {
+    background-color: #fff;
+    height: 270px;
+    &-box {
+      height: 270px;
+      background-image: url(./../../assets/images/adaptive-training-bg.png);
+      background-repeat: no-repeat;
+      background-position: top center;
+      background-size: 100% 196px;
+      .atsb-tab {
+        display: flex;
+        width: 400px;
+        margin: 0 auto;
+        justify-content: space-between;
+        padding-top: 20px;
+        margin-bottom: 18px;
+        &-item {
+          font-size: 30px;
+          color: #000;
+          border-bottom: 3px solid #fff;
+          padding-bottom: 10px;
+          cursor: pointer;
+          &:hover {
+            color: #335ceb;
+            border-bottom: 3px solid #335ceb;
+          }
+        }
+        &-active {
+          color: #335ceb;
+          border-bottom: 3px solid #335ceb;
+        }
+      }
+      .atsb-total {
+        width: calc(100% - 80px);
+        height: 140px;
+        background: #fff;
+        margin: 0 auto;
+        box-shadow: 0 0 12px 0 rgba(0, 0, 0, 0.11);
+        border-radius: 10px;
+        display: flex;
+        justify-content: center;
+        align-items: center;
+        &-item {
+          text-align: center;
+          &:first-child {
+            margin-right: 15%;
+          }
+          p {
+            color: #656565;
+            font-size: 22px;
+            span {
+              color: #505050;
+              font-size: 40px;
+            }
+            &:last-child {
+              font-size: 20px;
+              margin-top: 10px;
+            }
+          }
+        }
+      }
+    }
+  }
+  &-list {
+    margin-top: 10px;
+    &-item {
+      height: 91px;
+      display: flex;
+      box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
+      padding: 18px 15px;
+      cursor: pointer;
+      margin-bottom: 20px;
+      .left {
+        width: 122px;
+        height: 89px;
+        margin-right: 10px;
+        .image {
+          width: 100%;
+          height: 100%;
+          border-radius: 4px;
+          border: solid 1px #e0e0e0;
+        }
+      }
+      .right {
+        display: flex;
+        flex-direction: column;
+        .name {
+          font-size: 20px;
+          color: #424242;
+          line-height: 30px;
+          margin-bottom: 20px;
+        }
+        .total {
+          font-size: 14px;
+          color: #6f6f6f;
+          padding-left: 10px;
+        }
+      }
+      .offline {
+        width: 100%;
+        display: flex;
+        flex-direction: column;
+        .name {
+          font-size: 20px;
+          color: #424242;
+          line-height: 30px;
+          flex: 1;
+        }
+        .bottom {
+          display: flex;
+          justify-content: space-between;
+          font-size: 14px;
+          color: #6f6f6f;
+          padding-left: 10px;
+        }
+      }
+    }
+    .pagination {
+      text-align: center;
+      margin-top: 20px;
+      :deep(.el-pager .active) {
+        background-color: #ff3939;
+      }
+      :deep(.el-pagination.is-background .el-pager li:not(.disabled).active) {
+        background-color: #ff3939;
+      }
+    }
+  }
+}
+</style>

src/views/AdaptiveTraining/AdaptiveTrainingIndex.vue

@@ -3,165 +3,60 @@
  * @Author: 空白格
  * @Date: 2022-08-12 15:23:44
  * @LastEditors: 空白格
- * @LastEditTime: 2022-08-15 10:04:08
+ * @LastEditTime: 2022-08-22 13:53:11
  * @FilePath: \veterans_client_web\src\views\AdaptiveTraining\AdaptiveTrainingIndex.vue
  * @Copyright: Copyright (c) 2016~2022 by 空白格, All Rights Reserved.
 -->
 <template>
   <div class="app-main adaptive-training">
-    <BannerBreadcrumb title="适应性培训" />
-    <div class="app-main-box">
-      <!-- banner -->
-      <div class="adaptive-training-banner">
-        <div class="adaptive-training-banner-title">适应性培训</div>
-        <div class="adaptive-training-banner-subtitle">
-          -退役军人思想政治教育 -退役军人就业创业指导
-        </div>
-        <div class="adaptive-training-banner-describe">
-          适应性培训课程包含思想政治教育、法律法规政策介绍，就业创业指导、求职技巧指导、服务项目指引等，需看完线上课程后完成适应性培训。
-        </div>
+    <!-- banner -->
+    <div class="adaptive-training-banner">
+      <div class="adaptive-training-banner-title">适应性培训</div>
+      <div class="adaptive-training-banner-subtitle">
+        -退役军人思想政治教育 -退役军人就业创业指导
       </div>
-      <!-- 统计 -->
-      <div class="adaptive-training-statistics">
-        <div class="adaptive-training-statistics-box">
-          <div class="atsb-tab">
-            <div
-              class="atsb-tab-item"
-              v-for="(item, index) in tabList"
-              :key="index"
-              :class="{ 'atsb-tab-active': tabCur === item.value }"
-              @click="tabClick(item)"
-            >
-              {{ item.label }}
-            </div>
-          </div>
-          <template v-if="tabCur === 1">
-            <div class="atsb-total">
-              <div class="atsb-total-item">
-                <p>已看课程</p>
-                <p>
-                  <span>{{ trainingTotal.play || 0 }}</span
-                  >个
-                </p>
-              </div>
-              <div class="atsb-total-item">
-                <p>还需观看</p>
-                <p>
-                  <span>{{ trainingTotal.playNot || 0 }}</span
-                  >个
-                </p>
-              </div>
-            </div>
-          </template>
-          <template v-else>
-            <div class="atsb-total" v-if="trainingTotal.status === 0">
-              <div class="atsb-total-item">
-                <p>未参加线下培训</p>
-                <p>（注：必须参加线下培训才能通过适应性培训）</p>
-              </div>
-            </div>
-            <div class="atsb-total" v-else>
-              <div class="atsb-total-item">
-                <p>已参加线下培训</p>
-                <p>（注：必须参加线下培训才能通过适应性培训）</p>
-              </div>
-            </div>
-          </template>
-        </div>
+      <div class="adaptive-training-banner-describe">
+        适应性培训课程包含思想政治教育、法律法规政策介绍，就业创业指导、求职技巧指导、服务项目指引等，需看完线上课程后完成适应性培训。
       </div>
-      <!-- 列表 -->
-      <template v-if="tabCur === 1">
+    </div>
+    <!-- tab -->
+    <div class="adaptive-training-tab">
+      <div class="app-main-box adaptive-training-tab-content">
         <div
-          class="app-main-box-content adaptive-training-list"
-          v-loading="onlineObj.loading"
-          v-if="onlineObj.list.length"
+          class="attc-item"
+          v-for="(item, index) in tabList"
+          :key="index"
+          :class="{ 'active': tabCur === item.value }"
+          @click="tabClick(item.value)"
         >
-          <el-row :gutter="16">
-            <el-col
-              :xs="24"
-              :sm="24"
-              :md="12"
-              :lg="12"
-              :xl="12"
-              v-for="(item, index) in onlineObj.list"
-              :key="index"
-            >
-              <div class="adaptive-training-list-item">
-                <div class="left">
-                  <el-image :src="item.titleImg" class="image" fit="cover">
-                    <div slot="placeholder" class="image-slot">
-                      加载中<span class="dot">...</span>
-                    </div>
-                  </el-image>
-                </div>
-                <div class="right">
-                  <div class="name">{{ item.adaptName }}</div>
-                  <div class="total">
-                    共{{ item.amount || 0 }}节课，已学完{{
-                      item.finishCount || 0
-                    }}节课，学习进度{{ item.finishPercent || 0 }}%
-                  </div>
-                </div>
-              </div>
-            </el-col>
-          </el-row>
-          <div class="pagination" v-if="onlineObj.total">
-            <el-pagination
-              background
-              layout="prev, pager, next"
-              :page-size="onlineObj.queryParams.pageSize"
-              :total="onlineObj.total"
-              @current-change="onlineCurrentChange"
-            />
-          </div>
+          {{ item.label }}
         </div>
-        <el-empty description="列表数据为空" v-else></el-empty>
-      </template>
-      <template v-else>
-        <div
-          class="app-main-box-content adaptive-training-list"
-          v-loading="offlineObj.loading"
-          v-if="offlineObj.list.length"
-        >
-          <el-row :gutter="16">
-            <el-col
-              :xs="24"
-              :sm="24"
-              :md="12"
-              :lg="12"
-              :xl="12"
-              v-for="(item, index) in offlineObj.list"
-              :key="index"
-            >
-              <div class="adaptive-training-list-item">
-                <div class="offline">
-                  <p class="name">{{ item.adaptName || "-" }}</p>
-                  <div class="bottom">
-                    <div>{{ item.adaptAddress || "-" }}</div>
-                    <div>{{ parseTime(item.createTime) || "-" }}</div>
-                  </div>
-                </div>
-              </div>
-            </el-col>
-          </el-row>
-          <div class="pagination" v-if="offlineObj.total">
-            <el-pagination
-              background
-              layout="prev, pager, next"
-              :page-size="offlineObj.queryParams.pageSize"
-              :total="offlineObj.total"
-              @current-change="offlineCurrentChange"
-            />
+      </div>
+    </div>
+    <!-- 内容 -->
+    <div class="app-main-box adaptive-training-content">
+      <template v-if="tabCur === 1">
+        <div class="adaptive-training-content-statistics">
+          <div class="atcs-left">
+            <div class="atcs-left-item">
+              已看课程<span>{{ trainingTotal.play || 0 }}</span
+              >节
+            </div>
+            <div class="atcs-left-item">
+              还需观看<span>{{ trainingTotal.playNot || 0 }}</span
+              >节
+            </div>
+          </div>
+          <div class="atcs-right">
+            <el-button class="atcs-right-btn">开始学习</el-button>
           </div>
         </div>
-        <el-empty description="列表数据为空" v-else></el-empty>
       </template>
     </div>
   </div>
 </template>
 
 <script>
-import BannerBreadcrumb from "@/components/BannerBreadcrumb";
 import {
   getTrainingList,
   getTrainingTotal,
@@ -171,9 +66,6 @@ import { mapState } from "vuex";
 import { parseTime } from "@/utils/utils";
 export default {
   name: "AdaptiveTrainingIndex",
-  components: {
-    BannerBreadcrumb,
-  },
   data() {
     return {
       tabCur: 1,
@@ -214,7 +106,7 @@ export default {
       isLogin: (state) => state.user.isLogin,
     }),
   },
-  created() {
+  mounted() {
     this.getOnlineList();
     this.getOfflineList();
     if (this.isLogin) {
@@ -222,8 +114,8 @@ export default {
     }
   },
   methods: {
-    tabClick(item) {
-      this.tabCur = item.value;
+    tabClick(value) {
+      this.tabCur = value;
     },
     /**
      * 获取适应性培训
@@ -289,10 +181,9 @@ export default {
 
 <style lang="scss" scoped>
 .adaptive-training {
-  padding-bottom: 30px;
   &-banner {
     width: 100%;
-    height: 300px;
+    height: 424px;
     background: url("./../../assets/images/adaptive-training-banner.png")
       no-repeat center center;
     background-size: 100% 100%;
@@ -300,24 +191,12 @@ export default {
       text-align: center;
       position: relative;
       font-size: 40px;
-      padding-top: 20px;
+      padding-top: 80px;
       width: 300px;
       margin: 0 auto;
       text-align: justify;
       text-align-last: justify;
       color: #fff;
-      &::before {
-        content: "";
-        display: block;
-        width: 26px;
-        height: 26px;
-        background: url("./../../assets/images/star-icon.svg") no-repeat center
-          center;
-        background-size: 100% 100%;
-        position: absolute;
-        left: -30px;
-        top: 30px;
-      }
     }
     &-subtitle {
       width: 90%;
@@ -343,131 +222,69 @@ export default {
       font-size: 14px;
     }
   }
-  &-statistics {
+  &-tab {
     background-color: #fff;
-    height: 270px;
-    &-box {
-      height: 270px;
-      background-image: url(./../../assets/images/adaptive-training-bg.png);
-      background-repeat: no-repeat;
-      background-position: top center;
-      background-size: 100% 196px;
-      .atsb-tab {
-        display: flex;
-        width: 400px;
-        margin: 0 auto;
-        justify-content: space-between;
-        padding-top: 20px;
-        margin-bottom: 18px;
-        &-item {
-          font-size: 30px;
-          color: #000;
-          border-bottom: 3px solid #fff;
-          padding-bottom: 10px;
-          cursor: pointer;
-          &:hover {
-            color: #335ceb;
-            border-bottom: 3px solid #335ceb;
-          }
-        }
-        &-active {
-          color: #335ceb;
-          border-bottom: 3px solid #335ceb;
-        }
+    &-content {
+      margin: 0 auto;
+      display: flex;
+      .attc-item {
+        font-size: 20px;
+        color: #000000;
+        margin-right: 120px;
+        line-height: 60px;
+        cursor: pointer;
       }
-      .atsb-total {
-        width: calc(100% - 80px);
-        height: 140px;
-        background: #fff;
-        margin: 0 auto;
-        box-shadow: 0 0 12px 0 rgba(0, 0, 0, 0.11);
-        border-radius: 10px;
-        display: flex;
-        justify-content: center;
-        align-items: center;
-        &-item {
-          text-align: center;
-          &:first-child {
-            margin-right: 15%;
-          }
-          p {
-            color: #656565;
-            font-size: 22px;
-            span {
-              color: #505050;
-              font-size: 40px;
-            }
-            &:last-child {
-              font-size: 20px;
-              margin-top: 10px;
-            }
-          }
-        }
+      .active {
+        color: #335ceb;
+        border-bottom: solid 2px #335ceb;
       }
     }
   }
-  &-list {
-    margin-top: 10px;
-    &-item {
-      height: 91px;
+  &-content {
+    &-statistics {
+      height: 100px;
+      padding: 0 19px;
       display: flex;
-      box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
-      padding: 18px 15px;
-      cursor: pointer;
-      margin-bottom: 20px;
-      .left {
-        width: 122px;
-        height: 89px;
-        margin-right: 10px;
-        .image {
-          width: 100%;
-          height: 100%;
-          border-radius: 4px;
-          border: solid 1px #e0e0e0;
-        }
-      }
-      .right {
-        display: flex;
-        flex-direction: column;
-        .name {
-          font-size: 20px;
-          color: #424242;
-          line-height: 30px;
-          margin-bottom: 20px;
-        }
-        .total {
-          font-size: 14px;
-          color: #6f6f6f;
-          padding-left: 10px;
-        }
-      }
-      .offline {
-        width: 100%;
+      align-items: center;
+      justify-content: space-between;
+      background: #fff;
+      .atcs-left {
         display: flex;
-        flex-direction: column;
-        .name {
+        align-items: center;
+        &-item {
+          padding: 0 38px;
           font-size: 20px;
-          color: #424242;
-          line-height: 30px;
-          flex: 1;
-        }
-        .bottom {
+          color: #656565;
           display: flex;
-          justify-content: space-between;
-          font-size: 14px;
-          color: #6f6f6f;
-          padding-left: 10px;
+          align-items: center;
+          &:last-child {
+            position: relative;
+            &::before {
+              content: '';
+              display: inline-block;
+              width: 2px;
+              height: 22px;
+              background: #656565;
+              position: absolute;
+              left: 0;
+            }
+          }
+          span {
+            font-size: 30px;
+            color: #ff700b;
+            padding: 0 10px;
+          }
         }
       }
-    }
-    .pagination {
-      text-align: center;
-      margin-top: 20px;
-      :deep(.el-pager .active) {
-        background-color: #ff3939;
-      }
-      :deep(.el-pagination.is-background .el-pager li:not(.disabled).active) {
-        background-color: #ff3939;
+      .atcs-right {
+        &-btn {
+          background: #FF700B;
+          color: #fff;
+          border: solid 1px #FF700B;
+          &:hover {
+            opacity: 0.8;
+          }
+        }
       }
     }
   }

src/views/Home/HomeIndex.vue

@@ -3,7 +3,7 @@
  * @Author: 空白格
  * @Date: 2022-08-10 11:26:40
  * @LastEditors: 空白格
- * @LastEditTime: 2022-08-22 10:22:23
+ * @LastEditTime: 2022-08-22 15:19:59
  * @FilePath: \veterans_client_web\src\views\Home\HomeIndex.vue
  * @Copyright: Copyright (c) 2016~2022 by 空白格, All Rights Reserved.
 -->
@@ -18,23 +18,98 @@
       <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 class="hmlc-content" v-html="latestNews.artContent"></div> -->
         </div>
       </div>
       <div class="home-main-box">
-        <!-- 新闻部分 -->
-        <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="395px">
+        <div class="home-main-news-box">
+          <!-- 新闻部分 -->
+          <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="395px">
+                  <el-carousel-item
+                    v-for="(item, index) in newsList"
+                    :key="index"
+                  >
+                    <el-image
+                      class="image"
+                      :src="
+                        item.artImage ||
+                        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="fill"
+                        ></el-image>
+                      </div>
+                    </el-image>
+                    <div class="title">
+                      {{ item.artTitle || "" }}
+                    </div>
+                  </el-carousel-item>
+                </el-carousel>
+              </div>
+            </el-col>
+            <el-col :xs="24" :sm="24" :md="12" :lg="12" :xl="12">
+              <div class="home-main-news-right">
+                <el-tabs v-model="activeName" @tab-click="handleClick">
+                  <el-tab-pane label="新闻动态" name="first">
+                    <ul class="news-infomation">
+                      <li
+                        class="news-infomation-item"
+                        v-for="(item, index) in newsList"
+                        :key="index"
+                      >
+                        <div class="title">{{ item.artTitle }}</div>
+                        <div class="date">
+                          {{ parseTime(item.createTime, "{y}-{m}-{d}") }}
+                        </div>
+                      </li>
+                    </ul>
+                  </el-tab-pane>
+                  <el-tab-pane label="通知公告" name="second">
+                    <ul class="news-infomation">
+                      <li
+                        class="news-infomation-item"
+                        v-for="(item, index) in noticeList"
+                        :key="index"
+                      >
+                        <div class="title">{{ item.content }}</div>
+                        <div class="date">
+                          {{ parseTime(item.releasTime, "{y}-{m}-{d}") }}
+                        </div>
+                      </li>
+                    </ul>
+                  </el-tab-pane>
+                </el-tabs>
+                <div class="more-btn" @click="jumpPage('/newscenter')">
+                  更多
+                </div>
+              </div>
+            </el-col>
+          </el-row>
+        </div>
+        <div class="home-main-policy-box">
+          <!-- 政策咨询部分 -->
+          <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 newsList"
+                  v-for="(item, index) in policyObj.bannerList"
                   :key="index"
                 >
                   <el-image
                     class="image"
                     :src="
-                      item.artImage ||
+                      item.bannerUrl ||
                       require('@/assets/images/default-news.jpg')
                     "
                     fit="cover"
@@ -46,7 +121,7 @@
                       <el-image
                         class="image"
                         :src="require('@/assets/images/default-news.jpg')"
-                        fit="fill"
+                        fit="cover"
                       ></el-image>
                     </div>
                   </el-image>
@@ -55,140 +130,74 @@
                   </div>
                 </el-carousel-item>
               </el-carousel>
-            </div>
-          </el-col>
-          <el-col :xs="24" :sm="24" :md="12" :lg="12" :xl="12">
-            <div class="home-main-news-right">
-              <el-tabs v-model="activeName" @tab-click="handleClick">
-                <el-tab-pane label="新闻动态" name="first">
-                  <ul class="news-infomation">
-                    <li
-                      class="news-infomation-item"
-                      v-for="(item, index) in newsList"
-                      :key="index"
-                    >
-                      <div class="title">{{ item.artTitle }}</div>
-                      <div class="date">
-                        {{ parseTime(item.createTime, "{y}-{m}-{d}") }}
-                      </div>
-                    </li>
-                  </ul>
-                </el-tab-pane>
-                <el-tab-pane label="通知公告" name="second">
-                  <ul class="news-infomation">
-                    <li
-                      class="news-infomation-item"
-                      v-for="(item, index) in noticeList"
-                      :key="index"
-                    >
-                      <div class="title">{{ item.content }}</div>
-                      <div class="date">
-                        {{ parseTime(item.releasTime, "{y}-{m}-{d}") }}
-                      </div>
-                    </li>
-                  </ul>
-                </el-tab-pane>
-              </el-tabs>
-              <div class="more-btn" @click="jumpPage('/newscenter')">更多</div>
-            </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"
+            </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"
                     >
-                      <div
-                        class="hmpc-left-list"
-                        v-if="policyObj.policyList.length"
+                      <el-tab-pane
+                        v-for="(item, index) in policyObj.policyTypeList"
+                        :key="index"
+                        :label="item.label"
+                        :name="item.text"
                       >
                         <div
-                          class="hmpc-left-list-item"
-                          v-for="(item, index) in policyObj.policyList"
-                          :key="index"
+                          class="hmpc-left-list"
+                          v-if="policyObj.policyList.length"
                         >
-                          <div class="title">{{ item.artTitle }}</div>
-                          <div class="date">
-                            {{ parseTime(item.artPostTime, "{y}-{m}-{d}") }}
+                          <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>
-                      </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>
+                        <el-empty description="列表为空" v-else></el-empty>
+                      </el-tab-pane>
+                    </el-tabs>
+                    <div class="more-btn" @click="jumpPage('/policyadvice')">
+                      更多
+                    </div>
                   </div>
-                </div>
-              </el-col>
-            </el-row>
-          </el-col>
-        </el-row>
+                </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>
+        </div>
         <!-- 院校合作 -->
         <institutional-cooperation />
         <!-- 企业合作 -->
@@ -472,13 +481,13 @@ export default {
         }
       }
     }
-    &-box {
+    &-news-box {
+      background-color: #f4f4f4;
+    }
+    &-news {
       width: 70%;
       margin: 0 auto;
       min-width: 600px;
-    }
-    &-news {
-      width: 100%;
       padding: 47px 0;
       border-radius: 5px;
       margin-top: 14px;
@@ -580,7 +589,13 @@ export default {
         }
       }
     }
+    &-policy-box {
+      background: #F7F7F7;
+    }
     &-policy {
+      width: 70%;
+      margin: 0 auto;
+      min-width: 600px;
       padding: 40px 0;
       &-carousel {
         :deep(.el-carousel__button) {
@@ -605,6 +620,7 @@ export default {
         margin-top: 50px;
         .hmpc-left {
           margin-bottom: 20px;
+          position: relative;
           :deep(.el-tabs__item) {
             font-size: 20px;
             font-weight: 500;
@@ -649,11 +665,19 @@ export default {
               }
             }
           }
+          .more-btn {
+            position: absolute;
+            right: 0;
+            top: 12px;
+            color: #727272;
+            font-size: 14px;
+            cursor: pointer;
+          }
         }
         .hmpc-right {
           margin-bottom: 20px;
           &-title {
-            font-size: 26px;
+            font-size: 20px;
             color: #163da5;
             margin-bottom: 10px;
           }
@@ -665,7 +689,7 @@ export default {
               line-height: 47px;
               border-radius: 5px;
               cursor: pointer;
-              font-size: 18px;
+              font-size: 14px;
               margin-bottom: 7px;
               position: relative;
               &:hover {
@@ -772,12 +796,12 @@ export default {
     position: fixed;
     top: 50%;
     right: 0;
-    margin-top: -214px;
+    margin-top: -183px;
     z-index: 1000;
     &-fixed {
       &-item {
-        width: 95px;
-        height: 95px;
+        width: 80px;
+        height: 80px;
         display: flex;
         justify-content: center;
         align-items: center;
@@ -792,15 +816,15 @@ export default {
           background: #73aa8d;
         }
         .image {
-          width: 48px;
-          height: 48px;
+          width: 35px;
+          height: 35px;
         }
       }
       &-item-last {
-        height: 42px;
+        height: 40px;
         .image {
-          width: 26px;
-          height: 26px;
+          width: 20px;
+          height: 20px;
         }
       }
     }

src/views/Home/components/EnterpriseCooperation.vue

@@ -3,41 +3,55 @@
  * @Author: 空白格
  * @Date: 2022-08-17 16:16:38
  * @LastEditors: 空白格
- * @LastEditTime: 2022-08-17 16:49:29
+ * @LastEditTime: 2022-08-22 15:17:08
  * @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)"
+    <div class="institutional-cooperation-box">
+      <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"
           >
-            <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
+              class="institutional-cooperation-list-item"
+              @click="
+                jumpPage('/enterprisedetails', {
+                  companyId: 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-col :span="24" align="center" v-if="isLookMore">
+            <!-- <el-button
+            class="look-more"
+            @click="jumpPage('/cooperativeenterprise')"
+            >查看更多</el-button
+          > -->
+            <el-button class="look-more" @click="lookMore">查看更多</el-button>
+          </el-col>
+        </el-row>
+        <el-empty description="企业合作数据为空" v-else></el-empty>
+      </div>
     </div>
   </div>
 </template>
@@ -53,6 +67,8 @@ export default {
         pageNum: 1,
         pageSize: 12,
       },
+      total: 0,
+      isLookMore: false,
     };
   },
   created() {
@@ -66,26 +82,60 @@ export default {
      */
     getCompanyList() {
       getCompanyList(this.queryParams).then((res) => {
-        console.log(res);
-        this.companyList = res?.data?.rows ?? [];
+        if (this.queryParams.pageNum === 1) {
+          this.companyList = res?.data?.rows ?? [];
+        } else {
+          this.companyList = this.companyList.concat(res?.data?.rows ?? []);
+        }
+        this.total = Number(res?.data?.total);
+        let curPage = this.queryParams.pageNum * this.queryParams.pageSize;
+        if (curPage < this.total) {
+          this.isLookMore = true;
+        } else {
+          this.isLookMore = false;
+        }
       });
     },
-    jumpPage(companyId) {
+    /**
+     * 跳转指定页面
+     * @date 2022-08-22
+     * @param {any} path
+     * @param {any} query
+     * @returns {any}
+     */
+    jumpPage(path, query) {
       this.$router.push({
-        path: "/enterprisedetails",
-        query: {
-          companyId,
-        },
+        path,
+        query,
       });
     },
+    /**
+     * 查看更多
+     * @date 2022-08-22
+     * @returns {any}
+     */
+    lookMore() {
+      let curPage = this.queryParams.pageNum * this.queryParams.pageSize;
+      if (curPage < this.total) {
+        this.queryParams.pageNum = this.queryParams.pageNum += 1;
+        this.getCompanyList();
+      } else {
+        this.isLookMore = false;
+      }
+    },
   },
 };
 </script>
 
 <style lang="scss" scoped>
 .institutional-cooperation {
-  margin: 40px auto 0;
-  padding-bottom: 50px;
+  background: #f7f7f7;
+  &-box {
+    width: 70%;
+    margin: 0 auto;
+    min-width: 600px;
+    padding: 47px 0;
+  }
   &-title {
     font-size: 26px;
     color: #163da5;
@@ -121,5 +171,13 @@ export default {
       }
     }
   }
+  .look-more {
+    background: #cffaee;
+    color: #68bda5;
+    font-size: 16px;
+    border: solid 1px #cffaee;
+    font-family: SourceHanSansCN;
+    margin-top: 20px;
+  }
 }
 </style>

src/views/Home/components/HeaderBanner.vue

@@ -3,15 +3,24 @@
  * @Author: 空白格
  * @Date: 2022-08-22 09:14:32
  * @LastEditors: 空白格
- * @LastEditTime: 2022-08-22 09:17:40
+ * @LastEditTime: 2022-08-22 14:38:38
  * @FilePath: \veterans_client_web\src\views\Home\components\HeaderBanner.vue
  * @Copyright: Copyright (c) 2016~2022 by 空白格, All Rights Reserved.
 -->
 <template>
   <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-carousel arrow="never" height="400px" direction="vertical" :autoplay="false">
+      <el-carousel-item
+        class="home-carousel-item"
+        v-for="(item, index) in bannerList"
+        :key="index"
+      >
+        <el-image class="image" :src="item.bannerUrl" fit="cover">
+          <div slot="placeholder" class="image-slot">
+            加载图片中<span class="dot">...</span>
+          </div>
+        </el-image>
+        <el-image class="image-text" :src="item.bannerTxtUrl" fit="cover">
           <div slot="placeholder" class="image-slot">
             加载图片中<span class="dot">...</span>
           </div>
@@ -27,11 +36,16 @@ export default {
   name: "HeaderBanner",
   data() {
     return {
-      bannerList: [],
+      bannerList: [
+        {
+          bannerUrl: require("@/assets/images/banner-1.png"),
+          bannerTxtUrl: require("@/assets/images/banner-1-text.png"),
+        },
+      ],
     };
   },
   created() {
-    this.getBanner();
+    // this.getBanner();
   },
   methods: {
     /**
@@ -51,18 +65,29 @@ export default {
 <style lang="scss" scoped>
 .home {
   &-carousel {
+    &-item {
+      position: relative;
+      .image-text {
+        width: 900px;
+        height: 270px;
+        position: absolute;
+        left: 300px;
+        top: 80px;
+      }
+    }
     .image {
       width: 100%;
       height: 100%;
     }
     .image-slot {
-      line-height: 400px;
+      line-height: 300px;
       text-align: center;
     }
     :deep(.el-carousel__arrow) {
       border: solid 1px rgba($color: #fff, $alpha: 0.7);
     }
     :deep(.el-carousel__button) {
+      display: none;
       // 指示器按钮
       width: 10px;
       height: 10px;

src/views/Home/components/InstitutionalCooperation.vue

@@ -3,38 +3,49 @@
  * @Author: 空白格
  * @Date: 2022-08-17 15:11:17
  * @LastEditors: 空白格
- * @LastEditTime: 2022-08-17 16:48:00
+ * @LastEditTime: 2022-08-22 15:18:39
  * @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 class="institutional-cooperation-box">
+      <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('/collegesdetails', { schoolId: 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-col :span="24" align="center" v-if="isLookMore">
+            <!-- <el-button class="look-more" @click="jumpPage('/cooperativecolleges')"
+            >查看更多</el-button
+          > -->
+            <el-button class="look-more" @click="lookMore">查看更多</el-button>
+          </el-col>
+        </el-row>
+        <el-empty description="院校合作数据为空" v-else></el-empty>
+      </div>
     </div>
   </div>
 </template>
@@ -50,6 +61,8 @@ export default {
         pageNum: 1,
         pageSize: 12,
       },
+      total: 0,
+      isLookMore: false,
     };
   },
   created() {
@@ -63,25 +76,60 @@ export default {
      */
     getSchoolList() {
       getSchoolList(this.queryParams).then((res) => {
-        console.log(res);
-        this.schoolList = res?.rows ?? [];
+        if (this.queryParams.pageNum === 1) {
+          this.schoolList = res?.rows ?? [];
+        } else {
+          this.schoolList = this.schoolList.concat(res?.rows ?? []);
+        }
+        this.total = Number(res?.total ?? 0);
+        let curPage = this.queryParams.pageNum * this.queryParams.pageSize;
+        if (curPage < this.total) {
+          this.isLookMore = true;
+        } else {
+          this.isLookMore = false;
+        }
       });
     },
-    jumpPage(schoolId) {
+    /**
+     * 跳转指定页面
+     * @date 2022-08-22
+     * @param {any} path
+     * @param {any} query
+     * @returns {any}
+     */
+    jumpPage(path, query) {
       this.$router.push({
-        path: "/collegesdetails",
-        query: {
-          schoolId,
-        },
+        path,
+        query,
       });
     },
+    /**
+     * 查看更多
+     * @date 2022-08-22
+     * @returns {any}
+     */
+    lookMore() {
+      let curPage = this.queryParams.pageNum * this.queryParams.pageSize;
+      if (curPage < this.total) {
+        this.queryParams.pageNum = this.queryParams.pageNum += 1;
+        this.getSchoolList();
+      } else {
+        this.isLookMore = false;
+      }
+    },
   },
 };
 </script>
 
 <style lang="scss" scoped>
 .institutional-cooperation {
-  margin: 40px auto;
+  background: #f4f4f4;
+  &-box {
+    width: 70%;
+    margin: 0 auto;
+    min-width: 600px;
+    padding: 47px 0;
+  }
   &-title {
     font-size: 26px;
     color: #163da5;
@@ -117,5 +165,13 @@ export default {
       }
     }
   }
+  .look-more {
+    background: #cffaee;
+    color: #68bda5;
+    font-size: 16px;
+    border: solid 1px #cffaee;
+    font-family: SourceHanSansCN;
+    margin-top: 20px;
+  }
 }
 </style>

src/views/Home/components/MenuNavigation.vue

@@ -3,7 +3,7 @@
  * @Author: 空白格
  * @Date: 2022-08-22 09:22:47
  * @LastEditors: 空白格
- * @LastEditTime: 2022-08-22 09:29:26
+ * @LastEditTime: 2022-08-22 14:42:47
  * @FilePath: \veterans_client_web\src\views\Home\components\MenuNavigation.vue
  * @Copyright: Copyright (c) 2016~2022 by 空白格, All Rights Reserved.
 -->
@@ -102,7 +102,7 @@ export default {
   &-menu {
     background-color: #416050;
     width: 100%;
-    line-height: 104px;
+    line-height: 80px;
     &-list {
       width: 70%;
       min-width: 600px;
@@ -112,7 +112,7 @@ export default {
       margin: 0 auto;
       &-item {
         color: #fff;
-        font-size: 22px;
+        font-size: 20px;
         padding: 0 30px;
         cursor: pointer;
         &:hover {

src/views/Login/LoginIndex.vue

@@ -3,7 +3,7 @@
  * @Author: 空白格
  * @Date: 2022-08-10 11:45:16
  * @LastEditors: 空白格
- * @LastEditTime: 2022-08-17 17:05:19
+ * @LastEditTime: 2022-08-22 10:30:43
  * @FilePath: \veterans_client_web\src\views\Login\LoginIndex.vue
  * @Copyright: Copyright (c) 2016~2022 by 空白格, All Rights Reserved.
 -->
@@ -232,10 +232,11 @@ export default {
   position: relative;
   &-box {
     position: absolute;
-    top: 50vh;
-    right: 270px;
+    top: 50%;
+    left: 50%;
+    margin-left: -300px;
     margin-top: -263px;
-    padding: 62px 53px;
+    padding: 62px 50px;
     background-color: #fff;
     box-shadow: 5px 5px 28px -17px rgba(120, 120, 120, 0.3);
     border-radius: 12px;
@@ -293,9 +294,4 @@ export default {
     }
   }
 }
-@media screen and (max-width: 900px) {
-  .login-box {
-    right: 125px;
-  }
-}
 </style>

src/views/NewsCenter/NewsDetails/NewsDetailsIndex.vue

@@ -0,0 +1,12 @@
+<!--
+ * @Description: 新闻详情
+ * @Author: 空白格
+ * @Date: 2022-08-22 15:30:47
+ * @LastEditors: 空白格
+ * @LastEditTime: 2022-08-22 15:30:47
+ * @FilePath: \veterans_client_web\src\views\NewsCenter\NewsDetails\NewsDetailsIndex.vue
+ * @Copyright: Copyright (c) 2016~2022 by 空白格, All Rights Reserved.
+-->
+<template>
+  <div>新闻详情</div>
+</template>

src/views/NewsCenter/NoticeDetails/NoticeDetailsIndex.vue

@@ -0,0 +1,12 @@
+<!--
+ * @Description: 通知详情
+ * @Author: 空白格
+ * @Date: 2022-08-22 15:31:43
+ * @LastEditors: 空白格
+ * @LastEditTime: 2022-08-22 15:31:44
+ * @FilePath: \veterans_client_web\src\views\NewsCenter\NoticeDetails\NoticeDetailsIndex.vue
+ * @Copyright: Copyright (c) 2016~2022 by 空白格, All Rights Reserved.
+-->
+<template>
+  <div>通知详情</div>
+</template>

src/views/PersonalCenter/PersonalCenterIndex.vue

@@ -3,7 +3,7 @@
  * @Author: 空白格
  * @Date: 2022-08-15 10:09:03
  * @LastEditors: 空白格
- * @LastEditTime: 2022-08-16 13:42:52
+ * @LastEditTime: 2022-08-22 11:24:18
  * @FilePath: \veterans_client_web\src\views\PersonalCenter\PersonalCenterIndex.vue
  * @Copyright: Copyright (c) 2016~2022 by 空白格, All Rights Reserved.
 -->
@@ -90,6 +90,7 @@
               class="pcml-item"
               v-for="(item, index) in menuList"
               :key="index"
+              @click="jumpPage(item.path)"
             >
               <div class="pcml-item-icon">
                 <el-image :src="item.icon"></el-image>
@@ -210,11 +211,26 @@ export default {
           label: "我的面试",
           path: "",
         },
+        {
+          icon: require("@/assets/images/personal-center-icon/_jiuyechuangye.svg"),
+          label: "我的创业计划",
+          path: "",
+        },
+        {
+          icon: require("@/assets/images/personal-center-icon/jinengx.svg"),
+          label: "我的技能培训",
+          path: "",
+        },
         {
           icon: require("@/assets/images/personal-center-icon/pingjia.svg"),
           label: "我的评价",
           path: "",
         },
+        {
+          icon: require("@/assets/images/personal-center-icon/shezhi.svg"),
+          label: "设置",
+          path: "/setting",
+        },
       ],
       skillTrainList: [],
     };
@@ -261,6 +277,18 @@ export default {
         }
       });
     },
+    /**
+     * 跳转指定页面
+     * @date 2022-08-22
+     * @param {any} path
+     * @param {any} query
+     * @returns {any}
+     */
+    jumpPage(path, query) {
+      if (path) {
+        this.$router.push(path, query);
+      }
+    },
   },
 };
 </script>
@@ -386,9 +414,6 @@ export default {
         border-bottom: 1px solid #d5d5d5;
         padding: 5px 0 15px;
         cursor: pointer;
-        &:last-child {
-          border-bottom: none;
-        }
         &-icon {
           width: 34px;
           height: 33px;

src/views/PersonalCenter/Setting/SettingIndex.vue

@@ -0,0 +1,12 @@
+<!--
+ * @Description: 设置页面
+ * @Author: 空白格
+ * @Date: 2022-08-22 11:08:49
+ * @LastEditors: 空白格
+ * @LastEditTime: 2022-08-22 11:08:50
+ * @FilePath: \veterans_client_web\src\views\PersonalCenter\Setting\SettingIndex.vue
+ * @Copyright: Copyright (c) 2016~2022 by 空白格, All Rights Reserved.
+-->
+<template>
+  <div>设置</div>
+</template>

src/views/SkillTraining/SkillTrainingIndex.vue

@@ -3,7 +3,7 @@
  * @Author: 空白格
  * @Date: 2022-08-11 17:53:41
  * @LastEditors: 空白格
- * @LastEditTime: 2022-08-16 13:33:13
+ * @LastEditTime: 2022-08-22 11:03:38
  * @FilePath: \veterans_client_web\src\views\SkillTraining\SkillTrainingIndex.vue
  * @Copyright: Copyright (c) 2016~2022 by 空白格, All Rights Reserved.
 -->
@@ -11,55 +11,6 @@
   <div class="app-main skill-training">
     <BannerBreadcrumb title="技能培训" />
     <div class="app-main-box skill-training-content">
-      <!-- 轮播课程 -->
-      <div class="app-main-box-content skill-training-content-slider">
-        <el-row>
-          <el-col :xs="24" :sm="24" :md="18" :lg="18" :xl="18">
-            <div class="stcs-left">
-              <el-carousel height="200px" :autoplay="false" arrow="never">
-                <el-carousel-item
-                  class="stcs-left-item"
-                  v-for="(item, index) in classNoticeList"
-                  :key="index"
-                >
-                  <div class="stcs-left-item-left">
-                    <el-image :src="item.img" class="image" fit="cover">
-                      <div slot="placeholder" class="image-slot">
-                        加载中<span class="dot">...</span>
-                      </div>
-                    </el-image>
-                  </div>
-                  <div class="stcs-left-item-right">
-                    <div class="class-name">{{ item.name }}</div>
-                    <div class="school-name">{{ item.schoolName }}</div>
-                    <div class="description" v-html="item.description"></div>
-                    <div class="sign-up">
-                      <el-button
-                        round
-                        class="sign-up-btn"
-                        @click="signUp(item.id)"
-                        >报名</el-button
-                      >
-                    </div>
-                  </div>
-                </el-carousel-item>
-              </el-carousel>
-            </div>
-          </el-col>
-          <el-col :xs="24" :sm="24" :md="6" :lg="6" :xl="6">
-            <div class="stcs-right">
-              <div class="stcs-right-title">我的培训</div>
-              <div class="stcs-right-duration">
-                <div class="stcs-right-duration-left">学习<br />时长</div>
-                <div class="stcs-right-duration-right">
-                  <span>{{ learnTime || 0 }}</span
-                  >小时
-                </div>
-              </div>
-            </div>
-          </el-col>
-        </el-row>
-      </div>
       <!-- 技能包 -->
       <div
         class="app-main-box-content skill-training-content-package"