招聘列表

src/layout/jobs-list/jobfair.vue

@@ -0,0 +1,59 @@
+<template>
+  <div id="jobfair">
+    <el-col :span="24">
+      <el-col :span="20" class="title">
+        <p class="textOver"><span class="dian"></span>{{ data.title }}</p>
+        <p class="textOver"><span class="dian"></span>地址:{{ data.city }}{{ data.address }}</p>
+        <p class="textOver"><span class="dian"></span>举办方:{{ data.organizer }}</p>
+      </el-col>
+      <el-col :span="4" class="date">{{ data.time }}</el-col>
+    </el-col>
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'jobfair',
+  props: {
+    data: null,
+  },
+  components: {},
+  data: () => ({}),
+  created() {},
+  computed: {},
+  methods: {},
+};
+</script>
+
+<style lang="less" scoped>
+p {
+  padding: 0;
+  margin: 0;
+}
+.textOver {
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+.dian {
+  display: inline-block;
+  width: 4px;
+  height: 4px;
+  background-color: #4f4f4f;
+  border-radius: 90px;
+  margin: 5px 8px;
+}
+.title {
+  padding: 10px 0;
+}
+.title p {
+  font-size: 16px;
+  color: #4f4f4f;
+}
+.date {
+  font-size: 14px;
+  color: #323131;
+  text-align: right;
+  padding: 10px 0;
+}
+</style>

src/layout/jobs-list/jobinfo.vue

@@ -0,0 +1,59 @@
+<template>
+  <div id="jobinfo">
+    <el-col :span="24">
+      <el-col :span="20" class="title">
+        <p class="textOver"><span class="dian"></span>{{ data.title }}</p>
+        <p class="textOver"><span class="dian"></span>发布方:{{ data.corpname }}</p>
+        <p class="textOver"><span class="dian"></span>发布站点:{{ data.schname }}</p>
+      </el-col>
+      <el-col :span="4" class="date">{{ data.time }}</el-col>
+    </el-col>
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'jobinfo',
+  props: {
+    data: null,
+  },
+  components: {},
+  data: () => ({}),
+  created() {},
+  computed: {},
+  methods: {},
+};
+</script>
+
+<style lang="less" scoped>
+p {
+  padding: 0;
+  margin: 0;
+}
+.textOver {
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+.dian {
+  display: inline-block;
+  width: 4px;
+  height: 4px;
+  background-color: #4f4f4f;
+  border-radius: 90px;
+  margin: 5px 8px;
+}
+.title {
+  padding: 10px 0;
+}
+.title p {
+  font-size: 16px;
+  color: #4f4f4f;
+}
+.date {
+  font-size: 14px;
+  color: #323131;
+  text-align: right;
+  padding: 10px 0;
+}
+</style>

src/layout/jobs-list/post.vue

@@ -0,0 +1,61 @@
+<template>
+  <div id="post">
+    <el-col :span="24">
+      <el-col :span="20" class="title">
+        <p class="textOver"><span class="dian"></span>{{ data.job_name }}</p>
+        <p class="textOver"><span class="dian"></span>需求人数:{{ data.job_number }}</p>
+        <p class="textOver"><span class="dian"></span>薪资:{{ data.salary.text }}</p>
+        <p class="textOver"><span class="dian"></span>福利待遇:{{ data.welfare }}</p>
+        <p class="textOver"><span class="dian"></span>职位诱惑:{{ data.job_tag }}</p>
+      </el-col>
+      <el-col :span="4" class="date">{{ data.time }}</el-col>
+    </el-col>
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'post',
+  props: {
+    data: null,
+  },
+  components: {},
+  data: () => ({}),
+  created() {},
+  computed: {},
+  methods: {},
+};
+</script>
+
+<style lang="less" scoped>
+p {
+  padding: 0;
+  margin: 0;
+}
+.textOver {
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+.dian {
+  display: inline-block;
+  width: 4px;
+  height: 4px;
+  background-color: #4f4f4f;
+  border-radius: 90px;
+  margin: 5px 8px;
+}
+.title {
+  padding: 10px 0;
+}
+.title p {
+  font-size: 16px;
+  color: #4f4f4f;
+}
+.date {
+  font-size: 14px;
+  color: #323131;
+  text-align: right;
+  padding: 10px 0;
+}
+</style>

src/layout/jobs-list/talk.vue

@@ -0,0 +1,59 @@
+<template>
+  <div id="talk">
+    <el-col :span="24">
+      <el-col :span="20" class="title">
+        <p class="textOver"><span class="dian"></span>{{ data.title }}</p>
+        <p class="textOver"><span class="dian"></span>地址:{{ data.address }}</p>
+        <p class="textOver"><span class="dian"></span>宣讲方:{{ data.corpname }}</p>
+      </el-col>
+      <el-col :span="4" class="date">{{ data.time }}</el-col>
+    </el-col>
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'talk',
+  props: {
+    data: null,
+  },
+  components: {},
+  data: () => ({}),
+  created() {},
+  computed: {},
+  methods: {},
+};
+</script>
+
+<style lang="less" scoped>
+p {
+  padding: 0;
+  margin: 0;
+}
+.textOver {
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+.dian {
+  display: inline-block;
+  width: 4px;
+  height: 4px;
+  background-color: #4f4f4f;
+  border-radius: 90px;
+  margin: 5px 8px;
+}
+.title {
+  padding: 10px 0;
+}
+.title p {
+  font-size: 16px;
+  color: #4f4f4f;
+}
+.date {
+  font-size: 14px;
+  color: #323131;
+  text-align: right;
+  padding: 10px 0;
+}
+</style>

src/layout/list/listRight.vue

@@ -15,15 +15,10 @@
         </el-col>
         <el-col :span="24" class="list">
           <el-col :span="24" class="rightList" v-for="(item, index) in rightList" :key="index">
-            <el-col :span="24">
-              <el-col :span="20" class="title">
-                <p class="textOver"><span class="dian"></span>{{ item.title }}</p>
-              </el-col>
-              <el-col :span="4" class="date">{{ item.date }}</el-col>
-            </el-col>
-            <el-col :span="20" class="content">
-              <p v-html="item.content"></p>
-            </el-col>
+            <talk v-if="jobs === 'talk'" :data="item"></talk>
+            <jobfair v-if="jobs === 'jobfair'" :data="item"></jobfair>
+            <jobinfo v-if="jobs === 'jobinfo'" :data="item"></jobinfo>
+            <post v-if="jobs === 'jobs'" :data="item"></post>
           </el-col>
         </el-col>
       </el-col>
@@ -36,6 +31,11 @@
 </template>
 
 <script>
+import talk from '@/layout/jobs-list/talk.vue';
+import jobfair from '@/layout/jobs-list/jobfair.vue';
+import jobinfo from '@/layout/jobs-list/jobinfo.vue';
+import post from '@/layout/jobs-list/post.vue';
+
 export default {
   name: 'listRight',
   props: {
@@ -43,7 +43,12 @@ export default {
     Color: null,
     total: { type: Number, defaultl: 0 },
   },
-  components: {},
+  components: {
+    talk,
+    jobfair,
+    jobinfo,
+    post,
+  },
   data: () => ({
     currentPage: 1,
     pageSize: 8,
@@ -59,6 +64,9 @@ export default {
       if (jobs === 'jobs') returns = '岗位信息';
       return returns;
     },
+    jobs() {
+      return this.$route.params.jobs;
+    },
   },
   methods: {
     search(page) {
@@ -110,7 +118,7 @@ p {
   overflow: hidden;
 }
 .rightList {
-  height: 110px;
+  min-height: 110px;
   border-bottom: 1px dashed #ccc;
 }
 .rightList .title {

src/store/index.js

@@ -9,6 +9,7 @@ import * as jobinfo from './jobinfo';
 import * as posts from './posts';
 import * as linkCor from './link-cor';
 import * as jobfair from './jobfair';
+import * as talk from './talk';
 
 Vue.use(Vuex);
 
@@ -26,5 +27,6 @@ export default new Vuex.Store({
     posts: posts,
     linkCor: linkCor,
     jobfair: jobfair,
+    talk: talk,
   },
 });

src/store/posts.js

@@ -15,19 +15,15 @@ export const actions = {
     let result;
     if (type === 'list') {
       let { schid, corpid, is_practice, is_publish, ...searchInfo } = data;
-      result = await this.$axios.$get(
-        api.list,
-        {},
-        {
-          schid: schid,
-          corpid: corpid,
-          is_practice: is_practice,
-          skip: skip,
-          limit: limit,
-          is_publish: is_publish,
-          ...searchInfo,
-        }
-      );
+      result = await this.$axios.$get(api.list, {
+        schid: schid,
+        corpid: corpid,
+        is_practice: is_practice,
+        skip: skip,
+        limit: limit,
+        is_publish: is_publish,
+        ...searchInfo,
+      });
     }
     if (type === 'fetch') {
       let { id } = data;

src/store/talk.js

@@ -0,0 +1,32 @@
+import Vue from 'vue';
+import Vuex from 'vuex';
+import _ from 'lodash';
+Vue.use(Vuex);
+const api = {
+  list: `/api/jobs/talks`,
+  fetch: id => `/api/jobs/talks/${id}`,
+};
+export const state = () => ({});
+export const mutations = {};
+export const actions = {
+  async getTalk({ state }, { type, data }) {
+    let { skip = 0, limit } = data;
+    let result;
+    if (type !== 'fetch') {
+      let { schid, date, ...searchInfo } = data;
+      result = await this.$axios.$get(_.get(api, type), {
+        schid: schid,
+        skip: skip,
+        limit: limit,
+        date: date,
+        status: '1',
+        ...searchInfo,
+      });
+    }
+    if (type === 'fetch') {
+      let { id } = data;
+      result = await this.$axios.$get(api.fetch(id));
+    }
+    return result;
+  },
+};

src/views/list.vue

@@ -6,7 +6,7 @@
       :info="site"
       :backColor="backColor"
       :Color="Color"
-      :rightList="rightList"
+      :rightList="list"
       :total="total"
       @search="search"
     ></list-detail>
@@ -30,35 +30,19 @@ export default {
     listDetail,
   },
   data: () => ({
-    info: {
-      src: require('@/assets/logo.png'),
-      phone: '0431-12345678',
-      banner: require('@/assets/banner.png'),
-      address: '办公地址：长春市经济技术开发区金川街151号吉林省高等学校毕业生就业指导中心2楼一站式办公大厅',
-      email: '邮编：130012',
-      gongjiao: '公交线路：乘坐120路、227路、20路、260路、80路、130路、281路、154路、190路、125路公交北方市场下车，北方市场南门南行200米。',
-      mobile: '业务咨询电话：0431-84657570 0431-84657571;',
-      date: '办公时间：周一至周五，法定假日不对外办公。',
-      footTitle: '吉ICP备09006292号-1 Copyright 2013 版权所有 吉林省高等学校毕业生就业指导中心 All Rights Reserved',
-    },
     backColor: '#0457c7',
     Color: '#0457c7',
-    rightList: [
-      {
-        title: '我省成功举办“创业有我•就在吉林',
-        date: '2019-12-03',
-        content: '我省成功举办“创业有我•就在吉林我省成功举办“创业有我•就在吉林',
-      },
-    ],
     menu: [],
     sideMenu: masterMenu.children,
     site: {},
     siteTitle: '',
     total: 0,
+    list: [],
   }),
   async created() {
     await this.toGetSite(); //获取主站信息
     await this.loadMenu(); //获取菜单信息
+    await this.search();
   },
   computed: {
     jobs() {
@@ -68,9 +52,31 @@ export default {
       return this.$route.params.type;
     },
   },
+  watch: {
+    jobs: 'search',
+    type: 'search',
+  },
   methods: {
-    ...mapActions(['getSite', 'getMenu', 'getColumn']),
-    async search({ skip = 0, limit = 8 } = {}) {},
+    ...mapActions(['getSite', 'getMenu', 'getColumn', 'getJobfair', 'getTalk', 'getJobInfo', 'getPosts']),
+    async search({ skip = 0, limit = 8 } = {}) {
+      let result;
+      if (this.jobs === 'talk') {
+        result = await this.getTalk({ type: 'list', data: { skip: skip, limit: limit } });
+      } else if (this.jobs === 'jobfair') {
+        result = await this.getJobfair({ type: 'list', data: { skip: skip, limit: limit } });
+      } else if (this.jobs === 'jobs') {
+        result = await this.getPosts({ type: 'list', data: { skip: skip, limit: limit, is_practice: this.type === 'official' ? 0 : 1 } });
+      } else {
+        result = await this.getJobInfo({ type: 'list', data: { skip: skip, limit: limit } });
+      }
+      if (`${result.errcode}` === '0') {
+        //给this=>vue的实例下在中的list属性，赋予result。data的值
+        this.$set(this, `list`, result.data);
+        this.$set(this, `total`, result.total);
+      } else {
+        this.$message.error(result.errmsg ? result.errmsg : 'error');
+      }
+    },
     //站点信息
     async toGetSite() {
       let site = sessionStorage.getItem('site');