合并

src/components/personnel/personnel.vue

@@ -0,0 +1,133 @@
+<template>
+  <div id="personnel">
+    <el-row>
+      <el-col :span="24" class="top">
+        <top></top>
+      </el-col>
+      <el-col :span="24" class="logo">
+        <div class="w_1200">
+          <logo :info="info"></logo>
+        </div>
+      </el-col>
+      <el-col :span="24" class="menu">
+        <div class="w_1200">
+          <menuInfo></menuInfo>
+        </div>
+      </el-col>
+      <el-col :span="24" class="main">
+        <div class="w_1200">
+          <el-col :span="5" class="mainMenu">
+            <mainMenu></mainMenu>
+          </el-col>
+          <el-col :span="19" class="mainInfo">
+            <mainInfo :rencaiData="rencaiData" :jobsData="jobsData" :zhuanjiaData="zhuanjiaData" :canmoData="canmoData"></mainInfo>
+          </el-col>
+          <el-col :span="24" class="messFabu">
+            <messFabu :messList="messList"></messFabu>
+          </el-col>
+          <el-col :span="24" class="rencaiShow">
+            <rencaiShow :rencaiShowList="rencaiShowList"></rencaiShow>
+          </el-col>
+        </div>
+      </el-col>
+      <el-col :span="24" class="foot">
+        <div class="w_1200">
+          <foot :info="info"></foot>
+        </div>
+      </el-col>
+    </el-row>
+  </div>
+</template>
+
+<script>
+import top from '@/layout/index/top.vue';
+import logo from '@/layout/index/logo.vue';
+import menuInfo from '@/layout/index/menuInfo.vue';
+import mainMenu from '@/layout/personnel/mainMenu.vue';
+import mainInfo from '@/layout/personnel/mainInfo.vue';
+import messFabu from '@/layout/personnel/messFabu.vue';
+import rencaiShow from '@/layout/personnel/rencaiShow.vue';
+import foot from '@/layout/index/foot.vue';
+export default {
+  name: 'personnel',
+  props: {
+    info: null, //站点信息
+    rencaiData: null, //找人才
+    jobsData: null, //找工作
+    zhuanjiaData: null, //找专家
+    canmoData: null, //找参谋
+    messList: null, //信息发布
+    rencaiShowList: null, //人才展示
+  },
+  components: {
+    top, //头部
+    logo, //logo
+    menuInfo, //导航
+    mainMenu, //左侧导航
+    mainInfo, //右侧数据
+    messFabu, //信息发布
+    rencaiShow, //人才展示
+    foot, //底部
+  },
+  data: () => ({}),
+  created() {},
+  computed: {},
+  methods: {},
+};
+</script>
+
+<style lang="less" scoped>
+.w_1200 {
+  width: 1200px;
+  margin: 0 auto;
+}
+.top {
+  height: 40px;
+  overflow: hidden;
+  background-color: rgba(11, 58, 125, 0.8);
+}
+.logo {
+  height: 200px;
+  overflow: hidden;
+}
+.menu {
+  height: 70px;
+  overflow: hidden;
+}
+.main {
+  height: 1120px;
+  overflow: hidden;
+  margin: 10px 0;
+}
+.main .mainMenu {
+  width: 240px;
+  height: 360px;
+  overflow: hidden;
+  margin: 0 10px 10px 0;
+  background-color: #fff;
+}
+.main .mainInfo {
+  width: 950px;
+  height: 360px;
+  overflow: hidden;
+  background: #fff;
+  margin: 0 0 10px 0;
+}
+.main .messFabu {
+  height: 380px;
+  overflow: hidden;
+  background-color: #fff;
+  margin: 0 0 10px 0;
+}
+.main .rencaiShow {
+  height: 360px;
+  overflow: hidden;
+  background-color: #fff;
+}
+.foot {
+  float: left;
+  width: 100%;
+  height: 120px;
+  overflow: hidden;
+}
+</style>

src/components/service/service.vue

@@ -0,0 +1,106 @@
+<template>
+  <div id="service">
+    <el-row>
+      <el-col :span="24" class="top">
+        <top></top>
+      </el-col>
+      <el-col :span="24" class="logo">
+        <div class="w_1200">
+          <logo :info="info"></logo>
+        </div>
+      </el-col>
+      <el-col :span="24" class="menu">
+        <div class="w_1200">
+          <menuInfo></menuInfo>
+        </div>
+      </el-col>
+      <el-col :span="24" class="main">
+        <div class="w_1200">
+          <el-col :span="8" class="video">视频会议中心</el-col>
+          <el-col :span="16" class="zhuanti">专题研讨</el-col>
+          <el-col :span="24" class="changyong">
+            常用服务
+          </el-col>
+        </div>
+      </el-col>
+      <el-col :span="24" class="foot">
+        <div class="w_1200">
+          <foot :info="info"></foot>
+        </div>
+      </el-col>
+    </el-row>
+  </div>
+</template>
+
+<script>
+import top from '@/layout/index/top.vue';
+import logo from '@/layout/index/logo.vue';
+import menuInfo from '@/layout/index/menuInfo.vue';
+import foot from '@/layout/index/foot.vue';
+export default {
+  name: 'service',
+  props: {
+    info: null, //站点信息
+  },
+  components: {
+    top, //头部
+    logo, //logo
+    menuInfo, //导航
+    foot, //底部
+  },
+  data: () => ({}),
+  created() {},
+  computed: {},
+  methods: {},
+};
+</script>
+
+<style lang="less" scoped>
+.w_1200 {
+  width: 1200px;
+  margin: 0 auto;
+}
+.top {
+  height: 40px;
+  overflow: hidden;
+  background-color: rgba(11, 58, 125, 0.8);
+}
+.logo {
+  height: 200px;
+  overflow: hidden;
+}
+.menu {
+  height: 70px;
+  overflow: hidden;
+}
+.main {
+  height: 720px;
+  overflow: hidden;
+  margin: 10px 0;
+}
+.main .video {
+  width: 400px;
+  height: 300px;
+  overflow: hidden;
+  background-color: #fff;
+  margin: 0 10px 10px 0;
+}
+.main .zhuanti {
+  width: 790px;
+  height: 300px;
+  overflow: hidden;
+  background-color: #fff;
+  margin: 0 0 10px 0;
+}
+.main .changyong {
+  height: 410px;
+  overflow: hidden;
+  background-color: #fff;
+}
+.foot {
+  float: left;
+  width: 100%;
+  height: 120px;
+  overflow: hidden;
+}
+</style>

src/layout/personnel/mainInfo.vue

@@ -0,0 +1,139 @@
+<template>
+  <div id="mainInfo">
+    <el-row>
+      <el-col :span="24" class="info">
+        <el-tabs v-model="activeName" type="card" @tab-click="handleClick">
+          <el-tab-pane label="找人才" name="first">
+            <el-table :data="rencaiData" stripe style="width: 100%">
+              <el-table-column prop="title" label="简历名称" align="center"> </el-table-column>
+              <el-table-column prop="name" label="姓名" align="center"> </el-table-column>
+              <el-table-column prop="sex" label="性别" align="center"> </el-table-column>
+              <el-table-column prop="age" label="年龄" align="center"> </el-table-column>
+              <el-table-column prop="jingyan" label="工作经验" align="center"> </el-table-column>
+              <el-table-column prop="edu" label="学历" align="center"> </el-table-column>
+              <el-table-column prop="jobs" label="期望职位" align="center"> </el-table-column>
+              <el-table-column prop="date" label="更新时间" align="center"> </el-table-column>
+            </el-table>
+          </el-tab-pane>
+          <el-tab-pane label="找工作" name="second">
+            <el-table :data="jobsData" stripe style="width: 100%">
+              <el-table-column prop="title" label="招聘信息名称" align="center"> </el-table-column>
+              <el-table-column prop="company" label="公司名称" align="center"> </el-table-column>
+              <el-table-column prop="address" label="工作地点" align="center"> </el-table-column>
+              <el-table-column prop="jingyan" label="工作经验" align="center"> </el-table-column>
+              <el-table-column prop="num" label="招聘人数" align="center"> </el-table-column>
+              <el-table-column prop="edu" label="学历" align="center"> </el-table-column>
+              <el-table-column prop="xinzi" label="职位月薪" align="center"> </el-table-column>
+              <el-table-column prop="date" label="发布时间" align="center"> </el-table-column>
+            </el-table>
+          </el-tab-pane>
+          <el-tab-pane label="找专家" name="third">
+            <el-table :data="zhuanjiaData" stripe style="width: 100%">
+              <el-table-column prop="name" label="姓名" align="center"> </el-table-column>
+              <el-table-column prop="sex" label="性别" align="center"> </el-table-column>
+              <el-table-column prop="age" label="年龄" align="center"> </el-table-column>
+              <el-table-column prop="zhicheng" label="职称" align="center"> </el-table-column>
+              <el-table-column prop="zhiwu" label="职务" align="center"> </el-table-column>
+              <el-table-column prop="lingyu" label="可咨询领域" align="center"> </el-table-column>
+            </el-table>
+          </el-tab-pane>
+          <el-tab-pane label="找参谋" name="fourth">
+            <el-table :data="canmoData" stripe style="width: 100%">
+              <el-table-column prop="name" label="名称" align="center"> </el-table-column>
+              <el-table-column prop="type" label="信息类型" align="center"> </el-table-column>
+              <el-table-column prop="person" label="发布人" align="center"> </el-table-column>
+              <el-table-column prop="date" label="发布时间" align="center"> </el-table-column>
+            </el-table>
+          </el-tab-pane>
+          <el-tab-pane label="找合作" name="fifth">找合作</el-tab-pane>
+        </el-tabs>
+        <el-col :span="24" class="more">
+          <el-link><el-image :src="more"></el-image></el-link>
+        </el-col>
+      </el-col>
+    </el-row>
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'mainInfo',
+  props: {
+    rencaiData: null,
+    jobsData: null,
+    zhuanjiaData: null,
+    canmoData: null,
+  },
+  components: {},
+  data: () => ({
+    activeName: 'first',
+    more: require('@/assets/更多.png'),
+  }),
+  created() {},
+  computed: {},
+  methods: {
+    handleClick(tab, event) {
+      console.log(tab, event);
+    },
+  },
+};
+</script>
+
+<style lang="less" scoped>
+.info {
+  height: 360px;
+  padding: 20px;
+  overflow: hidden;
+}
+/deep/.el-tabs--card > .el-tabs__header {
+  margin: 0;
+  border-bottom: none;
+}
+/deep/.el-tabs--card > .el-tabs__header .el-tabs__nav {
+  border: none;
+}
+/deep/.el-tabs--card > .el-tabs__header .el-tabs__item {
+  border-bottom: none;
+  border-left: none;
+}
+/deep/.el-tabs__item {
+  font-size: 22px;
+  font-weight: bold;
+  height: 30px;
+  line-height: 30px;
+  margin: 0 0 10px 0;
+  padding: 0 20px 0 0;
+}
+/deep/.el-tabs--top.el-tabs--card > .el-tabs__header .el-tabs__item:nth-child(2) {
+  padding-left: 0;
+}
+/deep/.el-tabs__item.is-active {
+  color: #22529a;
+}
+/deep/.el-tabs__item:hover {
+  color: #22529a;
+  cursor: pointer;
+}
+.more {
+  position: absolute;
+  top: 20px;
+  right: 20px;
+  text-align: right;
+  height: 30px;
+  padding: 5px 0 0 0;
+}
+/deep/.el-table td {
+  padding: 8px 0;
+}
+/deep/.el-table th {
+  padding: 8px 0;
+  background-color: #f5f4f4;
+}
+/deep/ .el-table th.is-leaf {
+  border-bottom: none;
+  color: #000;
+}
+/deep/.el-table td {
+  border-bottom: none;
+}
+</style>

src/layout/personnel/mainMenu.vue

@@ -0,0 +1,62 @@
+<template>
+  <div id="mainMenu">
+    <el-col class="swfl">
+      <el-image style="width:22px;height:22px;margin:0 5px -5px 0;" :src="src"></el-image>
+      <span>分类导航</span>
+    </el-col>
+    <el-col>
+      <el-menu default-active="1" class="el-menu-vertical-demo" @open="handleOpen" @close="handleClose" text-color="#215299" active-text-color="#215299">
+        <el-menu-item index="1"><span slot="title">招聘信息</span></el-menu-item>
+        <el-menu-item index="2"><span slot="title">就业指导</span></el-menu-item>
+        <el-menu-item index="3"><span slot="title">学习实践</span></el-menu-item>
+        <el-menu-item index="4"><span slot="title">勤工俭学</span></el-menu-item>
+        <el-menu-item index="5"><span slot="title">工作顾问</span></el-menu-item>
+      </el-menu>
+    </el-col>
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'mainMenu',
+  props: {},
+  components: {},
+  data: () => ({
+    src: require('@/assets/swfl.png'),
+  }),
+  created() {},
+  computed: {},
+  methods: {
+    handleOpen(key, keyPath) {
+      console.log(key, keyPath);
+    },
+    handleClose(key, keyPath) {
+      console.log(key, keyPath);
+    },
+  },
+};
+</script>
+
+<style lang="less" scoped>
+.swfl {
+  height: 60px;
+  width: 240px;
+  line-height: 60px;
+  background-color: #22529a;
+  text-align: center;
+}
+.swfl span {
+  font-size: 22px;
+  color: #ffffff;
+}
+/deep/.el-menu-item {
+  height: 60px;
+  text-align: center;
+  line-height: 60px;
+  border-bottom: 1px dashed;
+  font-size: 22px;
+}
+/deep/.el-menu-item:last-child {
+  border-bottom: none;
+}
+</style>

src/layout/personnel/messFabu.vue

@@ -0,0 +1,114 @@
+<template>
+  <div id="messFabu">
+    <el-row>
+      <el-col :span="24" class="info">
+        <el-col :span="24" class="topInfo">
+          <el-col :span="20" class="left">{{ title }}</el-col>
+          <el-col :span="4" class="more">
+            <el-link :underline="false" class="btn">我要发布</el-link>
+            <el-link :underline="false"><el-image :src="more"></el-image></el-link>
+          </el-col>
+        </el-col>
+        <el-col :span="24" class="list">
+          <ul>
+            <li v-for="(item, index) in messList" :key="index">
+              <el-link :underline="false">
+                <el-image style="width:185px;height:247px;" :src="item.pic"></el-image>
+                <p class="title textOver">{{ item.title }}</p>
+              </el-link>
+            </li>
+          </ul>
+        </el-col>
+      </el-col>
+    </el-row>
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'messFabu',
+  props: {
+    messList: null,
+  },
+  components: {},
+  data: () => ({
+    title: '信息发布',
+    more: require('@/assets/更多.png'),
+  }),
+  created() {},
+  computed: {},
+  methods: {},
+};
+</script>
+
+<style lang="less" scoped>
+ul {
+  padding: 0;
+  margin: 0;
+}
+li {
+  padding: 0;
+  margin: 0;
+  list-style: none;
+}
+p {
+  padding: 0;
+  margin: 0;
+}
+.info {
+  width: 100%;
+  height: 380px;
+  overflow: hidden;
+  padding: 20px;
+  background-color: #fff;
+}
+.topInfo {
+  height: 30px;
+  line-height: 30px;
+  margin: 0 0 10px 0;
+}
+.topInfo .left {
+  font-size: 22px;
+  color: #22529a;
+  font-weight: bold;
+}
+.topInfo .more {
+  height: 30px;
+  text-align: right;
+  padding: 6px 0;
+}
+.topInfo .more .btn {
+  position: absolute;
+  width: 60px;
+  right: 50px;
+  top: 18px;
+  font-size: 14px;
+  color: #22529a;
+  font-weight: bold;
+}
+.list {
+  height: 300px;
+  overflow: hidden;
+}
+.list ul li {
+  float: left;
+  width: 185px;
+  height: 300px;
+  margin: 0 10px 0 0;
+}
+.list ul li:last-child {
+  margin: 0;
+}
+.list ul li .title {
+  float: left;
+  width: 175px;
+  font-size: 14px;
+  color: #215299;
+  text-align: center;
+  margin: -4px 0 0px 0;
+  background: #f3f3f3;
+  height: 30px;
+  line-height: 30px;
+  padding: 0 5px;
+}
+</style>

src/layout/personnel/rencaiShow.vue

@@ -0,0 +1,104 @@
+<template>
+  <div id="rencaiShow">
+    <el-row>
+      <el-col :span="24" class="info">
+        <el-col :span="24" class="topInfo">
+          <el-col :span="20" class="left">{{ title }}</el-col>
+          <el-col :span="4" class="more">
+            <el-link :underline="false"><el-image :src="more"></el-image></el-link>
+          </el-col>
+        </el-col>
+        <el-col :span="24" class="list">
+          <ul>
+            <li v-for="(item, index) in rencaiShowList" :key="index">
+              <el-link :underline="false">
+                <el-image style="width:185px;height:247px;" :src="item.pic"></el-image>
+                <p class="title textOver">{{ item.title }}</p>
+              </el-link>
+            </li>
+          </ul>
+        </el-col>
+      </el-col>
+    </el-row>
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'rencaiShow',
+  props: {
+    rencaiShowList: null,
+  },
+  components: {},
+  data: () => ({
+    title: '人才展示',
+    more: require('@/assets/更多.png'),
+  }),
+  created() {},
+  computed: {},
+  methods: {},
+};
+</script>
+
+<style lang="less" scoped>
+ul {
+  padding: 0;
+  margin: 0;
+}
+li {
+  padding: 0;
+  margin: 0;
+  list-style: none;
+}
+p {
+  padding: 0;
+  margin: 0;
+}
+.info {
+  width: 100%;
+  height: 380px;
+  overflow: hidden;
+  padding: 20px;
+  background-color: #fff;
+}
+.topInfo {
+  height: 30px;
+  line-height: 30px;
+  margin: 0 0 10px 0;
+}
+.topInfo .left {
+  font-size: 22px;
+  color: #22529a;
+  font-weight: bold;
+}
+.topInfo .more {
+  height: 30px;
+  text-align: right;
+  padding: 6px 0;
+}
+.list {
+  height: 300px;
+  overflow: hidden;
+}
+.list ul li {
+  float: left;
+  width: 185px;
+  height: 300px;
+  margin: 0 10px 0 0;
+}
+.list ul li:last-child {
+  margin: 0;
+}
+.list ul li .title {
+  float: left;
+  width: 175px;
+  font-size: 14px;
+  color: #215299;
+  text-align: center;
+  margin: -4px 0 0px 0;
+  background: #f3f3f3;
+  height: 30px;
+  line-height: 30px;
+  padding: 0 5px;
+}
+</style>

src/layout/policy/rightcont.vue

@@ -15,11 +15,9 @@
           <el-pagination
             @size-change="handleSizeChange"
             @current-change="handleCurrentChange"
-            :current-page="currentPage4"
-            :page-sizes="[10, 20, 30, 40]"
-            :page-size="2"
+            :current-page="currentPage"
             layout="total,  prev, pager, next, jumper"
-            :total="20"
+            :total="1"
           >
           </el-pagination>
         </el-col>
@@ -36,7 +34,9 @@ export default {
     contentList: null,
   },
   components: {},
-  data: () => ({ currentPage4: 1 }),
+  data: () => ({
+    currentPage: 1,
+  }),
   created() {},
   computed: {},
   methods: {
@@ -69,15 +69,6 @@ li {
   color: #22529a;
   margin: 0 0 20px 0;
 }
-.title {
-  font-size: 16px;
-  color: #60636d;
-}
-
-.date {
-  font-size: 16px;
-  color: #a8abb7;
-}
 .info {
   height: 570px;
   overflow: hidden;
@@ -92,11 +83,26 @@ li {
   width: 100%;
   padding: 0 0 13px 0;
 }
+.info ul li .title {
+  font-size: 16px;
+  color: #60636d;
+}
 .info ul li .date {
+  font-size: 16px;
+  color: #a8abb7;
   text-align: right;
 }
+.info ul li:hover {
+  cursor: pointer;
+}
+.info ul li:hover .title {
+  color: #22529a;
+}
+.info ul li:hover .date {
+  color: #22529a;
+}
 .page {
-  height: 50px;
+  padding: 11px 0;
   text-align: center;
 }
 </style>

src/router/index.js

@@ -9,11 +9,6 @@ const routes = [
     name: 'index',
     component: () => import('../views/index.vue'),
   },
-  {
-    path: '/test',
-    name: 'test',
-    component: () => import('../views/test.vue'),
-  },
   // 科技超市
   {
     path: '/supermaket/supermarket',
@@ -75,6 +70,13 @@ const routes = [
     component: () => import('../views/government/government.vue'),
   },
   //科技政策
+  //科技人才
+  {
+    path: '/personnel/personnel',
+    name: 'personnel',
+    component: () => import('../views/personnel/personnel.vue'),
+  },
+  // 科技政策
   {
     path: '/policy/policy',
     name: 'policy',
@@ -86,6 +88,12 @@ const routes = [
     name: 'shuju',
     component: () => import('../views/shuju/shuju.vue'),
   },
+  //科技服务
+  {
+    path: '/service/service',
+    name: 'service',
+    component: () => import('../views/service/service.vue'),
+  },
 ];
 
 const router = new VueRouter({

src/views/personnel/personnel.vue

@@ -0,0 +1,145 @@
+<template>
+  <div id="personnel">
+    <personnel-detail
+      :info="info"
+      :rencaiData="rencaiData"
+      :jobsData="jobsData"
+      :zhuanjiaData="zhuanjiaData"
+      :canmoData="canmoData"
+      :messList="messList"
+      :rencaiShowList="rencaiShowList"
+    ></personnel-detail>
+  </div>
+</template>
+
+<script>
+import personnelDetail from '@/components/personnel/personnel.vue';
+export default {
+  name: 'personnel',
+  props: {},
+  components: {
+    personnelDetail,
+  },
+  data: () => ({
+    info: {
+      logo: require('@/assets/logo.png'),
+      banquan: '版权所有：吉林省计算中心',
+      jishu: '技术支持：长春市福瑞科技有限公司',
+      youbian: '邮编：130000',
+      chuanzhen: '传真：239823982',
+      address: '地址：吉林省长春市朝阳区前进大街1244号',
+      phone: '电话：0431-1234567',
+      email: '邮箱：123456@163.com',
+    },
+    rencaiData: [
+      {
+        title: '标题',
+        name: '顾红伟',
+        sex: '男',
+        age: '24',
+        jingyan: '无经验',
+        edu: '本科',
+        jobs: 'IT',
+        date: '2019-12-34',
+      },
+      {
+        title: '六条数据',
+        name: '顾红伟',
+        sex: '男',
+        age: '24',
+        jingyan: '无经验',
+        edu: '本科',
+        jobs: 'IT',
+        date: '2019-12-34',
+      },
+    ],
+    jobsData: [
+      {
+        title: '标题',
+        company: '长春福瑞科技有限公司',
+        address: '吉林省长春市',
+        jingyan: '无经验',
+        num: '2',
+        edu: '本科',
+        xinzi: '1k-2k',
+        date: '2019-12-31',
+      },
+    ],
+    zhuanjiaData: [
+      {
+        name: '不知道',
+        sex: '男',
+        age: '20',
+        zhicheng: '初级职称',
+        zhiwu: '董事长',
+        lingyu: '计算机',
+      },
+    ],
+    canmoData: [
+      {
+        name: '标题',
+        type: '其他',
+        person: 'HSD',
+        date: '2019-12-31',
+      },
+    ],
+    messList: [
+      {
+        pic: require('@/assets/message1.jpg'),
+        title: '标题',
+      },
+      {
+        pic: require('@/assets/message2.jpg'),
+        title: '标题',
+      },
+      {
+        pic: require('@/assets/message3.jpg'),
+        title: '标题',
+      },
+      {
+        pic: require('@/assets/message4.jpg'),
+        title: '标题',
+      },
+      {
+        pic: require('@/assets/message5.jpg'),
+        title: '标题',
+      },
+      {
+        pic: require('@/assets/message6.jpg'),
+        title: '标题',
+      },
+    ],
+    rencaiShowList: [
+      {
+        pic: require('@/assets/talent1.jpg'),
+        title: '标题',
+      },
+      {
+        pic: require('@/assets/talent1.jpg'),
+        title: '标题',
+      },
+      {
+        pic: require('@/assets/talent1.jpg'),
+        title: '标题',
+      },
+      {
+        pic: require('@/assets/talent1.jpg'),
+        title: '标题',
+      },
+      {
+        pic: require('@/assets/talent1.jpg'),
+        title: '标题',
+      },
+      {
+        pic: require('@/assets/talent1.jpg'),
+        title: '标题',
+      },
+    ],
+  }),
+  created() {},
+  computed: {},
+  methods: {},
+};
+</script>
+
+<style lang="less" scoped></style>

src/views/service/service.vue

@@ -0,0 +1,33 @@
+<template>
+  <div id="service">
+    <service-detail :info="info"></service-detail>
+  </div>
+</template>
+
+<script>
+import serviceDetail from '@/components/service/service.vue';
+export default {
+  name: 'service',
+  props: {},
+  components: {
+    serviceDetail,
+  },
+  data: () => ({
+    info: {
+      logo: require('@/assets/logo.png'),
+      banquan: '版权所有：吉林省计算中心',
+      jishu: '技术支持：长春市福瑞科技有限公司',
+      youbian: '邮编：130000',
+      chuanzhen: '传真：239823982',
+      address: '地址：吉林省长春市朝阳区前进大街1244号',
+      phone: '电话：0431-1234567',
+      email: '邮箱：123456@163.com',
+    },
+  }),
+  created() {},
+  computed: {},
+  methods: {},
+};
+</script>
+
+<style lang="less" scoped></style>

src/views/test.vue

@@ -1,19 +0,0 @@
-<template>
-  <div id="test">
-    <p>sedfc</p>
-  </div>
-</template>
-
-<script>
-export default {
-  name: 'test',
-  props: {},
-  components: {},
-  data: () => ({}),
-  created() {},
-  computed: {},
-  methods: {},
-};
-</script>
-
-<style lang="less" scoped></style>