1

src/api/joinUsApi.js

+import request from '../utils/request'
+let curDomain = location.origin
+let groupId = localStorage.getItem("groupID")
+
+
+//获取招聘信息分页列表
+export function getWebRecruitmentTypeList() {
+  return request({
+    url: '/Web/GetWebRecruitmentTypeList',
+    method: "post",
+    data: {
+      Group_Id: groupId,
+      Domain: curDomain,
+    }
+  });
+}
+
+//获取招聘信息分页列表
+export function getWebRecruitmentPage(msg) {
+  return request({
+    url: '/Web/GetWebRecruitmentPage',
+    method: "post",
+    data: {
+      Group_Id: groupId,
+      Domain: curDomain,
+      pageIndex:msg.pageIndex,
+      pageSize:msg.pageSize,
+      TypeId:msg.TypeId,
+    }
+  });
+}
+
+//根据编号获取招聘详情
+export function getWebRecruitment(id) {
+  return request({
+    url: '/Web/GetWebRecruitment',
+    method: "post",
+    data: {
+      // Group_Id: groupId,
+      // Domain: curDomain,
+      Id:id
+    }
+  });
+}
+
+//招聘申请
+export function addWebJobApply(msg) {
+  return request({
+    url: '/Web/AddWebJobApply',
+    method: "post",
+    data: {
+      Group_Id: groupId,
+      Domain: curDomain,
+      LinkMan:msg.LinkMan,
+      LinkTel:msg.LinkTel,
+      Remark:msg.Remark,
+      RecruitmentId:msg.RecruitmentId,
+
+    }
+  });
+}
+

src/pages/aboutUs/aboutUs.vue

@@ -39,6 +39,7 @@ import Header from "../../components/header/header";
 import Banner from "../../components/banner/banner";
 import Footer from "../../components/footer/footerType2";
 import { getWebNavList } from "../../api/indexApi.js";
+
 export default {
   components: {
     Banner,
@@ -173,4 +174,4 @@ export default {
   //去掉左下角版权
   display: none;
 }
-</style>
\ No newline at end of file
+</style>

src/pages/joinUs/joinUs.vue

@@ -5,39 +5,49 @@
     <div class="bannerBox">
       <div class="banner_title"><span class="jh">甲鹤</span>-加入我们</div>
     </div>
-    <div class="main">
+    <div class="join_main">
       <div class="imgBox">
-        <div class="imgItem">
-          <div class="main_title">社会招聘</div>
-          <img src="imgItem" alt="" />
-        </div>
-        <div class="imgItem">
-          <div class="main_title">校园招聘</div>
-          <img src="imgItem" alt="" />
-        </div>
-        <div class="imgItem">
-          <div class="main_title">实习生招聘</div>
-          <img src="imgItem" alt="" />
+        <div v-for="item in recruitmentTypeList" :key="item.Id" class="imgItem">
+          <div class="main_title">{{item.TypeName}}</div>
+          <img :src="item.ImgCover" alt="" class="imgItem"/>
         </div>
       </div>
       <div class="conBox">
-        <div v-for="item in jobList" :key="item.id" class="jobItem">
+        <div v-for="item in jobList" :key="item.Id" class="jobItem">
           <div class="job_info1">
-            <div class="job_title">{{ item.name }}</div>
+            <div class="job_title">{{ item.PositionName }}</div>
             <div class="job_info1_sub">
-              <div class="job_price">{{ item.price }}</div>
-              <div class="job_other">{{ item.jy }} |{{ item.xueli }}</div>
+              <div class="job_price">{{ item.Salary }}</div>
+              <div class="job_other">{{ item.Experience }}<span>年</span> |{{ item.Education }}</div>
             </div>
           </div>
           <div class="job_info2">
-            <div class="job_title">{{ item.addr }}</div>
-            <div class="job_other">{{ item.time }}</div>
+            <div class="job_title">{{ item.WorkPlace }}</div>
+            <div class="job_other">{{ item.PublishTimeStr }}</div>
           </div>
           <div class="job_info3">
-            <div class="apply_job">申请职位</div>
+            <div class="apply_job" @click="show(item.Id)">申请职位</div>
           </div>
         </div>
       </div>
+
+      <template>
+        <q-dialog ref="dialog" @hide="onDialogHide">
+          <q-card class="q-dialog-plugin">
+            <!--
+              ...内容
+              ...使用q-card-section展现它?
+            -->
+
+            <!-- 按钮示例 -->
+            <q-card-actions align="right">
+<!--              <q-btn color="primary" label="OK" @click="onOKClick" />-->
+              <q-btn color="primary" label="关闭" @click="onCancelClick" />
+            </q-card-actions>
+          </q-card>
+        </q-dialog>
+      </template>
+
       <div class="pageBox">
         <q-pagination
           v-model="currentPage"
@@ -46,7 +56,7 @@
           :max-pages="5"
           boundary-numbers
           @input="changePage"
-          v-if="pageCount > 0"
+          v-if="pageCount > 1"
         >
         </q-pagination>
       </div>
@@ -57,6 +67,7 @@
 <script>
 import Header from "../../components/header/header";
 import Footer from "../../components/footer/footerType2";
+import { getWebRecruitmentTypeList,getWebRecruitmentPage,getWebRecruitment } from "../../api/joinUsApi.js";
 export default {
   components: {
     Header,
@@ -77,38 +88,61 @@ export default {
           Name: "",
         },
       ],
-      //   swiperData: [],
-      workProductList: [],
-      jobList: [
-        {
-          name: "后端开发工程师（Java、C#，Python)",
-          price: "12-24K·14薪",
-          jy: "经验不限",
-          xueli: "本科",
-          addr: "成都·武侯区·新会展中心",
-          time: "2021年4月09日",
-        },
-        {
-          name: "后端开发工程师（Java、C#，Python)",
-          price: "12-24K·14薪",
-          jy: "经验不限",
-          xueli: "本科",
-          addr: "成都·武侯区·新会展中心",
-          time: "2021年4月09日",
-        },
-      ],
+      msg:{
+        pageIndex:1,
+        pageSize:10,
+        TypeId:"",
+      },
+      recruitmentTypeList:[],
+      jobList: [],
+      dialogData:{}
     };
   },
   methods: {
     //翻页
     changePage(val) {
-      //   this.currentPage=val
-      //   this.msg.pageIndex=val
-      //   this.getCoursePageList()
+        this.currentPage=val
+        this.msg.pageIndex=val
+        this.getWebRecruitmentPage()
     },
+    //获取招聘信息分页列表
+    async getWebRecruitmentTypeList(){
+      let res= await getWebRecruitmentTypeList()
+      this.recruitmentTypeList=res.Data
+    },
+    //获取招聘信息分页列表
+    async getWebRecruitmentPage(){
+      let res=await getWebRecruitmentPage(this.msg)
+      this.jobList=res.Data.PageData
+      this.pageCount=res.Data.PageCount
+    },
+    async getWebRecruitment(id){
+      let res=await getWebRecruitment(id)
+    },
+    show (id) {
+      this.$refs.dialog.show()
+      this.getWebRecruitment(id)
+    },
+
+    hide () {
+      this.$refs.dialog.hide()
+    },
+
+    onDialogHide () {
+      // QDialog发出“hide”事件时
+      // 需要发出
+      this.$emit('hide')
+    },
+
+    onCancelClick () {
+      // 我们只需要隐藏对话框
+      this.hide()
+    }
   },
   mounted() {
     this.menuList = JSON.parse(localStorage.getItem("menuList"));
+    this.getWebRecruitmentTypeList();
+    this.getWebRecruitmentPage();
   },
 };
 </script>
@@ -133,7 +167,7 @@ export default {
     }
   }
 }
-.main {
+.join_main {
   width: 62.5vw;
   margin: 5.729vw auto 0;
   .imgBox {
@@ -154,6 +188,7 @@ export default {
         position: absolute;
         top: 1.5vw;
         left: 1vw;
+        z-index: 5;
       }
     }
   }
@@ -178,6 +213,7 @@ export default {
         flex-wrap: wrap;
         align-content: space-between;
         .job_title {
+          width: 100%;
           font-size: 0.9375vw;
           font-family: Microsoft YaHei;
           color: #45766d;
@@ -205,6 +241,7 @@ export default {
         flex-wrap: wrap;
         align-content: space-between;
         .job_title {
+          width: 100%;
           font-size: 0.9375vw;
           font-family: Microsoft YaHei;
           color: #45766d;
@@ -242,4 +279,4 @@ export default {
   justify-content: center;
   align-items: center;
 }
-</style>
\ No newline at end of file
+</style>

src/pages/mediaCenter/mediaCenterDetail.vue

+<template>
+  <div>
+    <div class="main">
+        <div class="titleBox">
+          <div>{{detailData.title}}</div>
+          <div></div>
+        </div>
+    </div>
+  </div>
+</template>
+
+<script>
+
+    export default {
+      name: "mediaCenterDetail.vue",
+      data(){
+          return{
+            detailData:{
+
+            }
+          }
+      },
+      methods:{
+
+      },
+      mounted() {
+
+      }
+
+    }
+</script>
+
+<style lang="scss" scoped>
+.mian{
+  width: 62.5vw;
+  magin: 5.208vw auto 3.906vw;
+
+
+}
+</style>

src/pages/mediaCenter/newsList.vue

+<template>
+  <div class="jiahe">
+    <Header :menuList="menuList" :curMenu="menuList[4].Name" :type="2" />
+    <div class="bannerBox">
+      <div class="banner_title"><span class="jh">甲鹤</span>-媒体中心</div>
+    </div>
+    <div class="main">
+      <div class="inputBox">
+        <q-input
+          v-model="msg.Title"
+          label="可搜索新闻类型/名称"
+          filled
+          clearable
+          type="search"
+          class="inputBorder"
+          @change="changeSearchText"
+          @clear="clearSearch"
+        >
+          <template v-slot:prepend>
+            <q-icon name="search" />
+          </template>
+        </q-input>
+        <q-select
+          outlined
+          v-model="selectText"
+          :options="options"
+          option-label="TypeName"
+          clearable
+          class="inputBorder"
+          label="可查询新闻类型/名称"
+        >
+        </q-select>
+      </div>
+      <div class="newsLsitBox" v-if="newsList.length > 0">
+        <div v-for="item in newsList" :key="item.Id" class="newsLsitItem">
+          <div class="itemTime">{{ item.CreateTime }}</div>
+          <div class="itemTitle">{{ item.Title }}</div>
+        </div>
+      </div>
+      <div v-if="newsList.length == 0" style="textalign: center">暂无数据</div>
+      <div class="pageBox" v-if="pageCount > 1">
+        <q-pagination
+          v-model="currentPage"
+          color="light-green-10"
+          :max="pageCount"
+          :max-pages="6"
+          :boundary-numbers="true"
+          @input="changePage"
+        >
+        </q-pagination>
+      </div>
+    </div>
+    <!-- 品牌漫画 -->
+
+    <Footer />
+  </div>
+</template>
+<script>
+  import Header from "../../components/header/header";
+  import Footer from "../../components/footer/footerType2";
+  import {
+    getWebNewsTypeList,
+    getNewsList,
+    getWebCartoonPage,
+    getWebMonthlyPage,
+  } from "../../api/mediaCenterApi";
+  export default {
+    components: {
+      Header,
+      Footer,
+    },
+    data() {
+      return {
+        menuList: [
+          {},
+          {},
+          {},
+          {},
+          {
+            Name: "",
+          },
+        ],
+        currentPage: 1,
+        pageCount: 0,
+        msg: {
+          pageIndex: 1,
+          pageSize: 5,
+          Title: "",
+          TypeId: "",
+        },
+        swiperData: [],
+        searchText: "",
+        selectText: "",
+        options: [],
+        newsList: [],
+        currentPage_cartoon: 1,
+        pageCount_cartoon: 0,
+        // 品牌周刊
+        swiperList: [],
+        // 漫画
+        cartoonmsg: {
+          pageIndex: 1,
+          pageSize: 5,
+        },
+        cartoonList: [],
+        // 周刊（月刊）
+        monthlymsg: {
+          pageIndex: 1,
+          pageSize: 3,
+        },
+        monthlyList: [],
+        max_page: 1,
+        slide: 1,
+      };
+    },
+    watch: {
+      selectText(val) {
+        if (val == null) {
+          this.msg.TypeId = "";
+        } else {
+          this.msg.TypeId = val.Id;
+        }
+        this.getNewsList();
+      },
+    },
+    methods: {
+      // 搜索框
+      changeSearchText() {
+        this.getNewsList();
+      },
+      // 清空搜索框
+      clearSearch() {
+        this.msg.Title = "";
+        this.getNewsList();
+      },
+      //翻页
+      changePage(val) {
+        this.currentPage = val;
+        this.msg.pageIndex = val;
+        this.getNewsList();
+      },
+      //翻页-品牌漫画
+      changePage_cartoon(val) {
+        this.currentPage_cartoon = val;
+        this.cartoonmsg.pageIndex = val;
+        this.getWebCartoonPage();
+      },
+      //获取新闻类型列表
+      async getWebNewsTypeList() {
+        let res = await getWebNewsTypeList();
+        this.options = res.Data;
+      },
+      //获取媒体列表
+      async getNewsList() {
+        let res = await getNewsList(this.msg);
+        this.newsList = res.Data.PageData;
+        this.pageCount = res.Data.PageCount;
+      },
+      // 数据分割为n个一组
+      resetDataFun(stuCount, col) {
+        if (stuCount.length > 0) {
+          var objList = new Object();
+          var arr = new Array();
+          var cow =
+            stuCount.length / col == 0
+              ? stuCount.length / col
+              : Math.ceil(stuCount.length / col);
+          for (var i = 1; i <= cow; i++) {
+            var tempArr = [];
+            var temp;
+            if (col * i > stuCount.length) {
+              temp = stuCount.length;
+            } else {
+              temp = col * i;
+            }
+            for (var j = col * (i - 1); j < temp; j++) {
+              tempArr.push(stuCount[j]);
+            }
+            var newObj = new Object();
+            newObj.data = tempArr;
+            arr.push(newObj);
+          }
+          objList.data = arr;
+          this.resetData = objList;
+        }
+      },
+      //获取品牌动漫分页列表
+      async getWebCartoonPage() {
+        let res = await getWebCartoonPage(this.cartoonmsg);
+        this.cartoonList = res.Data.PageData;
+      },
+      //获取品牌月刊(周刊)分页列表
+      async getWebMonthlyPage() {
+        let res = await getWebMonthlyPage(this.monthlymsg);
+        this.max_page = res.Data.PageCount;
+        this.monthlyList = res.Data.PageData;
+      },
+      prePage_weekly() {
+        if (this.monthlymsg.pageIndex > 1) {
+          this.monthlymsg.pageIndex--;
+          Datathis.$refs.carousel.previous();
+          this.getWebMonthlyPage();
+        }
+      },
+      nextPage_weekly() {
+        if (this.monthlymsg.pageIndex < this.max_page) {
+          this.monthlymsg.pageIndex++;
+          this.$refs.carousel.next();
+          this.getWebMonthlyPage();
+        }
+      },
+    },
+    mounted() {
+      this.menuList = JSON.parse(localStorage.getItem("menuList"));
+      this.getWebNewsTypeList();
+      this.getNewsList();
+      this.getWebCartoonPage();
+      this.getWebMonthlyPage();
+    },
+  };
+</script>
+<style lang="scss" scoped>
+  .jiahe {
+    background-color: #f6f6f6;
+  }
+  .bannerBox {
+    width: 100%;
+    height: 16.666vw;
+    background-image: url("../../assets/images/mediaCenter/mediaCenterBanner.png");
+    background-repeat: no-repeat;
+    background-size: contain;
+    display: flex;
+    align-items: center;
+    .banner_title {
+      margin-left: 10.208vw;
+      font-size: 5.208vw;
+      color: #111111;
+      .jh {
+        font-family: "pingfang-b" !important;
+      }
+    }
+  }
+  .main {
+    width: 62.5vw;
+    margin: 5.208vw auto;
+    .title {
+      font-size: 1.5625vw;
+      // font-family: Microsoft YaHei;
+      // font-weight: bold;
+      font-family: "pingfang-b" !important;
+      color: #111111;
+      text-align: center;
+      margin-bottom: 2.6vw;
+    }
+    .topNews {
+      height: 18.385vw;
+      display: flex;
+      justify-content: space-between;
+      .left {
+        width: 27.604vw;
+        height: 100%;
+        background-color: #000;
+      }
+      .right {
+        width: 32.5vw;
+        height: 100%;
+        .name {
+          font-size: 1.145vw;
+          // font-family: Microsoft YaHei;
+          // font-weight: bold;
+          font-family: "pingfang-b" !important;
+          color: #111111;
+          margin-top: 2.6vw;
+          margin-bottom: 2vw;
+        }
+        .desc {
+          font-size: 0.625vw;
+          // font-family: Microsoft YaHei;
+          // font-weight: 400;
+          color: #444444;
+        }
+        .time {
+          font-size: 0.729vw;
+          // font-family: Microsoft YaHei;
+          // font-weight: bold;
+          font-family: "pingfang-b" !important;
+          color: #444444;
+          margin-top: 1vw;
+          margin-bottom: 3.125vw;
+        }
+        .more {
+          width: 6.25vw;
+          height: 2.3vw;
+          background: #45766d;
+          display: flex;
+          justify-content: center;
+          align-items: center;
+          font-size: 0.833vw;
+          font-family: PingFang SC;
+          font-weight: 500;
+          color: #ffffff;
+        }
+      }
+    }
+  }
+  .inputBox {
+    display: flex;
+    justify-content: space-between;
+    margin-top: 3.125vw;
+    .inputBorder {
+      width: 30.486vw;
+      background-color: #e9e9e9;
+      border-radius: 4px;
+    }
+  }
+  .newsLsitBox {
+    .newsLsitItem {
+      height: 4.427vw;
+      display: flex;
+      align-items: center;
+      border-bottom: 1px solid #e6e6e6;
+      font-family: "pingfang-b" !important;
+      .itemTime {
+        font-size: 0.937vw;
+        color: #666666;
+      }
+      .itemTitle {
+        font-size: 1.041vw;
+        color: #666666;
+        margin-left: 3.645vw;
+        white-space: nowrap;
+        text-overflow: ellipsis;
+        overflow: hidden;
+      }
+    }
+  }
+  .pageBox {
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    margin-top: 30125vw;
+  }
+  .cartoonbgBox {
+    height: 39.0625vw;
+    background-image: url("../../assets/images/mediaCenter/cartoon_bg.png");
+    background-repeat: no-repeat;
+    .cartoonBox {
+      width: 62.5vw;
+      height: 100%;
+      margin: 0 auto;
+      .cartoonBox_title {
+        height: 9.062vw;
+        display: flex;
+        justify-content: center;
+        align-items: center;
+        font-size: 1.562vw;
+        font-family: "pingfang-b" !important;
+        color: #111111;
+      }
+      .cartoonBox_con {
+        height: 21.458vw;
+        display: flex;
+        justify-content: space-between;
+        position: relative;
+        .listCon {
+          width: 27.083vw;
+          height: 100%;
+          .listConItem {
+            height: 4.166vw;
+            border-bottom: 1px solid #cccccc;
+            display: flex;
+            align-items: center;
+            font-family: "pingfang-b" !important;
+            .itemTime {
+              min-width: 5.2vw;
+              font-size: 0.729vw;
+              color: #666666;
+              white-space: nowrap;
+              text-overflow: ellipsis;
+              overflow: hidden;
+            }
+            .itemTitle {
+              font-size: 0.9375vw;
+              color: #666666;
+              margin-left: 1vw;
+              white-space: nowrap;
+              text-overflow: ellipsis;
+              overflow: hidden;
+            }
+          }
+        }
+        .cartoonCon{
+          position: absolute;
+          top: 50%;
+          transform: translateY(-50%);
+          right: 0;
+          display: flex;
+          .cartoon_img{
+            width: 10.572vw;
+            height: 21.458vw;
+            background-color: #000;
+            margin-left: 0.781vw;
+            border-radius: 1vw;
+            overflow: hidden;
+          }
+        }
+      }
+    }
+  }
+  .pageBox2 {
+    height: 8.541vw;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+  }
+  .weeklyBox {
+    width: 62.5vw;
+    margin: 5.208vw auto;
+    text-align: center;
+    position: relative;
+    font-size: 1.562vw;
+    font-family: "pingfang-b" !important;
+    color: #111111;
+    .iconBox {
+      position: absolute;
+      top: 0;
+      right: 0;
+      display: flex;
+      .iconItem {
+        width: 2.604vw;
+        height: 2.604vw;
+        border: 1px solid #d2d7dd;
+        font-size: 1.2vw;
+        // color: #CCCCCC;
+        color: #333;
+        background-color: #D2D7DD;
+        display: flex;
+        justify-content: center;
+        align-items: center;
+      }
+    }
+    .weekly_title {
+      margin-bottom: 2.083vw;
+    }
+  }
+  // 品牌周刊
+  .activeColor{
+    color: #45766D !important;
+  }
+  .eduConbox {
+    display: flex;
+    flex-wrap: wrap;
+    .itemBox {
+      width: 20vw;
+      height: 18.437vw;
+      background-color: #fff;
+      margin-right: 1.25vw;
+      box-shadow: 0px 1px 6px 0px rgba(104, 104, 104, 0.1);
+      .itemImg {
+        width: 20vw;
+        height: 13.229vw;
+      }
+      .infoBox {
+        padding: 1.406vw 0.937vw 0;
+        .courseName {
+          font-size: 0.833vw;
+          text-align: left;
+          font-family: "pingfang-b" !important;
+          color: #000000;
+        }
+      }
+    }
+    & .itemBox:nth-child(3n) {
+      margin-right: 0;
+    }
+  }
+
+</style>

src/router/routes.js

@@ -12,6 +12,7 @@ const routes = [
       { path: '/studyServe', component: () => import('src/pages/studyServe/studyServe.vue') },
       { path: '/workServe', component: () => import('src/pages/workServe/workServe.vue') },
       { path: '/mediaCenter', component: () => import('src/pages/mediaCenter/mediaCenter.vue') },
+      { path: '/mediaCenterDetail', component: () => import('src/pages/mediaCenter/mediaCenterDetail.vue') },
       { path: '/aboutUs', component: () => import('src/pages/aboutUs/aboutUs.vue') },
       { path: '/joinUs', component: () => import('src/pages/joinUs/joinUs.vue') },
     ]