新闻详情

src/pages/news/App.vue

@@ -0,0 +1,24 @@
+<template>
+  <div>
+    <login></login>
+    <router-view />
+  </div>
+</template>
+
+<script>
+import login from '@/layout/login.vue';
+export default {
+  name: 'app',
+  components: {
+    login,
+  },
+};
+</script>
+
+<style lang="less">
+body {
+  margin: 0;
+  padding: 0;
+  background: #eeeeee;
+}
+</style>

src/pages/news/main.js

@@ -0,0 +1,21 @@
+import Vue from 'vue';
+import App from './App.vue';
+import router from './router';
+import store from './store/index';
+import '@/plugins/element.js';
+import '@/plugins/axios';
+import '@/plugins/methods';
+import '@/plugins/check-res';
+import '@/plugins/meta';
+import '@/plugins/filters';
+import '@/plugins/loading';
+import './plugins/nuts';
+import '@/plugins/var';
+
+Vue.config.productionTip = false;
+
+new Vue({
+  router,
+  store,
+  render: h => h(App),
+}).$mount('#app');

src/pages/news/plugins/nuts.js

@@ -0,0 +1,13 @@
+import Vue from 'vue';
+import { NavBar, Tabbar, cell, Textinput, button, BackTop, ActionSheet, DatePicker, imagepicker, InfiniteLoading, Scroller } from '@nutui/nutui';
+NavBar.install(Vue);
+Tabbar.install(Vue);
+cell.install(Vue);
+Textinput.install(Vue);
+button.install(Vue);
+BackTop.install(Vue);
+ActionSheet.install(Vue);
+DatePicker.install(Vue);
+imagepicker.install(Vue);
+InfiniteLoading.install(Vue);
+Scroller.install(Vue);

src/pages/news/plugins/var.js

@@ -0,0 +1,10 @@
+import Vue from 'vue';
+
+const Plugin = {
+  install(vue, options) {
+    // 4. 添加实例方法
+    vue.prototype.$limit = 15;
+  },
+};
+
+Vue.use(Plugin);

src/pages/news/router.js

@@ -0,0 +1,15 @@
+import Vue from 'vue';
+import Router from 'vue-router';
+
+Vue.use(Router);
+
+const router = new Router({
+  routes: [
+    {
+      path: '/',
+      component: () => import('./views/detail.vue'),
+    },
+  ],
+});
+
+export default router;

src/pages/news/store/index.js

@@ -0,0 +1,29 @@
+import Vue from 'vue';
+import Vuex from 'vuex';
+import * as profiles from '@/store/profiles';
+import * as jobs from '@/store/jobs';
+import * as hr from '@/store/hr';
+import * as jobinfo from '@/store/jobinfo';
+import * as talks from '@/store/talks';
+import * as resumes from '@/store/resumes';
+import * as letters from '@/store/letters';
+import * as jobfair from '@/store/jobfair';
+import * as school from '@/store/schoolList';
+import * as user from '@/store/user';
+
+Vue.use(Vuex);
+
+export default new Vuex.Store({
+  modules: {
+    profiles: profiles,
+    jobs: jobs,
+    hr: hr,
+    jobinfo: jobinfo,
+    talks: talks,
+    resumes: resumes,
+    letters: letters,
+    jobfair: jobfair,
+    school: school,
+    user: user,
+  },
+});

src/pages/news/views/detail.vue

@@ -0,0 +1,68 @@
+<template>
+  <div id="detail">
+    <el-row>
+      <el-col :span="24" class="top">
+        <p class="title">{{ info.title }}</p>
+        <p class="date">发表于：{{ info.date }}</p>
+      </el-col>
+      <el-col :span="24" class="image">
+        <el-image style="width:100%;height:195px;" :src="info.pic"></el-image>
+      </el-col>
+      <el-col :span="24" class="content">
+        <p>{{ info.content }}</p>
+      </el-col>
+    </el-row>
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'detail',
+  props: {},
+  components: {},
+  data: () => ({
+    info: {
+      title: '我校在吉林省高校就业指导课程教学大赛中取得优异成绩',
+      date: '2019-11-21',
+      pic: require('@/assets/logo.jpg'),
+      content: '详情',
+    },
+  }),
+  created() {},
+  computed: {},
+  methods: {},
+};
+</script>
+
+<style lang="less" scoped>
+p {
+  padding: 0;
+  margin: 0;
+}
+.top {
+  padding: 10px 15px;
+  border-bottom: 1px dashed #ddd;
+}
+.top .title {
+  font-size: 18px;
+  color: #333;
+  font-weight: 600;
+}
+.top .date {
+  font-size: 14px;
+  color: #666;
+  padding: 7px 0 0 0;
+}
+.image {
+  padding: 10px;
+}
+.content {
+  padding: 0 10px 10px 10px;
+}
+.content p {
+  color: rgb(70, 70, 70);
+  font-family: 宋体;
+  font-size: 18px;
+  text-indent: 2rem;
+}
+</style>

vue.config.js

@@ -14,6 +14,7 @@ module.exports = {
     talk: 'src/pages/talk/main.js',
     student: 'src/pages/student/main.js',
     corp: 'src/pages/corp/main.js',
+    news: 'src/pages/news/main.js',
     register: 'src/pages/register/main.js',
   },
   configureWebpack: config => {