Merge branch 'master' of http://121.37.12.51:13000/jialong.yu/FE_IASF_client

src/mixins/article/index.js

@@ -30,7 +30,7 @@ export default {
           const ids = href.split('-') // 栏目文章是用-分割的，栏目是必选，文章不是必选。选择了文章则跳转到文章页，否则跳转到栏目页
           // 站点id：站内链接取当前站点，其他站点链接取siteSelection
           const site = cType === 1 ?
-            (this.$route.query.siteId || this.site) :
+            (this.site) :
             to.siteSelection
           if (ids[1]) { // 文章
             href = '/article?articleId=' + ids[1]
@@ -54,7 +54,7 @@ export default {
         }
       } else if (typeId !== 4 || (typeId === 4 && !to.children.length)) {
         // 常规栏目跳转到column页，长页栏目直接获取path
-        this.$router.push(`/${typeId === 3 ? to.path : 'column'}?id=${to.id}&siteId=${this.$route.query.siteId || this.site}`).catch(err => {})
+        this.$router.push(`/${typeId === 3 ? to.path : 'column'}?id=${to.id}&siteId=${this.site}`).catch(err => {})
       }
     },
     // 跳转文章页面
@@ -66,7 +66,7 @@ export default {
           const ids = href.split('-') // 栏目文章是用-分割的，栏目是必选，文章不是必选。选择了文章则跳转到文章页，否则跳转到栏目页
           // 站点id：站内链接取当前站点，其他站点链接取siteSelection
           const site = cType === 1 ?
-            (this.$route.query.siteId || this.site) :
+            (this.site) :
             item.siteSelection
           if (ids[1]) { // 文章
             href = '/article?articleId=' + ids[1]
@@ -89,7 +89,7 @@ export default {
           location.href = href
         }
       } else {
-        this.$router.push(`/article?articleId=${item.id}&site=${this.$route.query.siteId || this.site}&id=${item.columnId}`)
+        this.$router.push(`/article?articleId=${item.id}&site=${this.site}&id=${item.columnId}`)
       }
     }
   }

src/pages/column/index.vue

@@ -267,9 +267,13 @@ export default {
     },
     // 判断是否是出版物模板，如果是则跳转
     handlePublication() {
-      this.$post(`${this.api.getsSublevelColumnsUnderALevel}?id=${this.id}&siteId=${this.site}`).then(({ data }) => {
+      if (this.info.templateId === 11) { // 出版社直接跳转到单个的出版社页面（/publication/single），否则就查询子级是否是出版社模板（templateId = 11），是的话就跳转到/publication/index，必须是每个子级都是出版社才跳转，后者是前者的集合（专利、专著、论文）
-        data.length && data.every(e => e.templateId == 11) && this.$router.push(`/publication?siteId=${this.site}&id=${this.id}`) // 如果子级每个栏目都是出版物类型
+        this.$router.push(`/publication/single?siteId=${this.site}&id=${this.id}&type=${this.info.listStyleId}`)
-      }).catch(err => {})
+      } else {
+        this.$post(`${this.api.getsSublevelColumnsUnderALevel}?id=${this.id}&siteId=${this.site}`).then(({ data }) => {
+          data.length && data.every(e => e.templateId == 11) && this.$router.push(`/publication?siteId=${this.site}&id=${this.id}`) // 如果子级每个栏目都是出版物类型
+        }).catch(err => {})
+      }
     },
     // 获取banner 规则：当前栏目有上传的，用当前的，没有上传的话，读取上级的（上级没有读上上级，以此类推）都没有的读取默认的
     getBanner(data) {

src/pages/publication/index.vue

@@ -55,6 +55,7 @@ export default {
       this.id &&
         this.$post(`${this.api.findColumn}?id=${this.id}`)
           .then(({ data }) => {
+            if (!data.columnBanner) data.columnBanner = require('@/assets/images/publication-bg.png');
             this.info = data
           })
           .catch((res) => { })

src/pages/publication/monograph.vue

@@ -10,14 +10,12 @@
           placeholder="请选择出版时间"
           format="yyyy"
           value-format="yyyy"
+          clearable
           @change="initData">
         </el-date-picker>
       </div>
       <div class="search">
-        <input type="text" placeholder="请输入著作名称/出版社名称/编写人员" v-model="form.monographQueryKeyWord">
+        <input type="text" placeholder="请输入著作名称/出版社名称/编写人员" v-model="form.monographQueryKeyWord" clearable>
-        <i class="icon">
-          <img src="@/assets/images/search-white.png" alt="">
-        </i>
       </div>
     </div>
 
@@ -96,73 +94,11 @@ export default {
 </script>
 
 <style lang="scss" scoped>
-.forms {
+@import "../../styles/page/publication.scss";
-  display: flex;
-  align-items: center;
-  padding: 15px;
-  margin-bottom: 20px;
-  background-color: #fff;
-  .item {
-    display: inline-flex;
-    align-items: center;
-    margin-right: 30px;
-  }
-  .label {
-    font-size: 16px;
-    color: #333;
-    white-space: nowrap;
-  }
-  /deep/.el-input__inner {
-    width: 100%;
-    height: 48px;
-    line-height: 48px;
-    border: 0;
-    background: #F7F7F7;
-  }
-  .search {
-    display: inline-flex;
-    width: 34%;
-    input {
-      width: 100%;
-      height: 48px;
-      padding: 0 15px;
-      font-size: 14px;
-      color: #333;
-      background: #F7F7F7;
-      border: 0;
-      border-top-left-radius: 6px;
-      border-bottom-left-radius: 6px;
-      &:focus {
-        outline: none;
-      }
-    }
-  }
-  .icon {
-    display: inline-flex;
-    justify-content: center;
-    align-items: center;
-    width: 62px;
-    height: 48px;
-    background: #1583FF;
-    border-radius: 0px 6px 6px 0px;
-    cursor: pointer;
-  }
-}
 /deep/.patent-table {
   thead tr, thead th {
     color: #fff;
     background-color: #1583FF;
   }
 }
-@media (max-width: 1200px) {
-  .forms {
-    padding: 1.25rem;
-    flex-direction: column;
-    .item, .search,div {
-      width: 80%;margin: 0 auto;
-      justify-content: center;
-      margin-top: 20px;
-    }
-  } 
-}
 </style>

src/pages/publication/patent.vue

@@ -3,7 +3,7 @@
     <div class="forms">
       <div class="item">
         <span class="label">专利类别：</span>
-        <el-select v-model="form.patentClassId" @change="initData">
+        <el-select v-model="form.patentClassId" clearable @change="initData">
           <el-option
             v-for="item in patentClasses"
             :key="item.id"
@@ -19,16 +19,12 @@
           type="date"
           placeholder="选择日期"
           format="yyyy-MM-dd"
-          :clearable="false"
           value-format="yyyy-MM-dd"
           @change="initData">
         </el-date-picker>
       </div>
       <div class="search">
-        <input type="text" placeholder="请输入专利名称/发明人姓名/申请号员" v-model="form.patentQueryKeyWord">
+        <input type="text" placeholder="请输入专利名称/发明人姓名/申请号员" v-model="form.patentQueryKeyWord" clearable>
-        <i class="icon">
-          <img src="@/assets/images/search-white.png" alt="">
-        </i>
       </div>
     </div>
 
@@ -114,73 +110,11 @@ export default {
 </script>
 
 <style lang="scss" scoped>
-.forms {
+@import "../../styles/page/publication.scss";
-  display: flex;
-  align-items: center;
-  padding: 15px;
-  margin-bottom: 20px;
-  background-color: #fff;
-  .item {
-    display: inline-flex;
-    align-items: center;
-    margin-right: 30px;
-  }
-  .label {
-    font-size: 16px;
-    color: #333;
-    white-space: nowrap;
-  }
-  /deep/.el-input__inner {
-    width: 100%;
-    height: 48px;
-    line-height: 48px;
-    border: 0;
-    background: #F7F7F7;
-  }
-  .search {
-    display: inline-flex;
-    width: 34%;
-    input {
-      width: 100%;
-      height: 48px;
-      padding: 0 15px;
-      font-size: 14px;
-      color: #333;
-      background: #F7F7F7;
-      border: 0;
-      border-top-left-radius: 6px;
-      border-bottom-left-radius: 6px;
-      &:focus {
-        outline: none;
-      }
-    }
-  }
-  .icon {
-    display: inline-flex;
-    justify-content: center;
-    align-items: center;
-    width: 62px;
-    height: 48px;
-    background: #1583FF;
-    border-radius: 0px 6px 6px 0px;
-    cursor: pointer;
-  }
-}
 /deep/.patent-table {
   thead tr, thead th {
     color: #fff;
     background-color: #1583FF;
   }
 }
-@media (max-width: 1200px) {
-  .forms {
-    padding: 1.25rem;
-    flex-direction: column;
-    .item, .search,div {
-      width: 80%;margin: 0 auto;
-      justify-content: center;
-      margin-top: 20px;
-    }
-  } 
-}
 </style>

src/pages/publication/single.vue

@@ -0,0 +1,115 @@
+<template>
+  <div class="wrap">
+    <div class="banner">
+      <img width="100%" height="280" src="@/assets/images/publication-bg.png" alt="" />
+      <div class="texts">
+        <p class="text">{{ info.columnName }}</p>
+      </div>
+    </div>
+
+    <div class="tab-content">
+      <Breadcrumb style="margin-bottom: 30px" ref="breadcrumb" :data.sync="routes"/>
+      <!-- 根据栏目的listStyleId判断是哪个列表样式，这个出版物页面只显示下面三个列表样式 -->
+      <!-- 论文 -->
+      <Thesis v-if="type === 46" :id.sync="id" />
+      <!-- 专利 -->
+      <Patent v-if="type === 44" :id.sync="id" />
+      <!-- 专著 -->
+      <Monograph v-if="type === 45" :id.sync="id" />
+    </div>
+  </div>
+</template>
+
+<script>
+import mixins from '@/mixins/article'
+import Thesis from './thesis'
+import Patent from './patent'
+import Monograph from './monograph'
+import Breadcrumb from '@/components/breadcrumb'
+export default {
+  mixins: [mixins],
+  data() {
+    return {
+      routes: [
+        {
+          name: '科学研究'
+        },
+        {
+          name: '科研成果'
+        }
+      ],
+      info: {},
+      type: +this.$route.query.type, // 栏目的listStyleId
+    }
+  },
+  components: {
+    Breadcrumb,
+    Thesis,
+    Patent,
+    Monograph
+  },
+  mounted() {
+    this.getInfo()
+  },
+  methods: {
+    // 获取栏目详情
+    getInfo() {
+      this.id &&
+        this.$post(`${this.api.findColumn}?id=${this.id}`)
+          .then(({ data }) => {
+            this.info = data
+          })
+          .catch((res) => { })
+    },
+  }
+};
+</script>
+
+<style lang="scss" scoped>
+.wrap {
+  background-color: #f9f9f9;
+}
+.banner {
+  position: relative;
+  height: 280px;
+  color: #fff;
+  .texts {
+    position: absolute;
+    top: 123px;
+    left: 243px;
+  }
+
+  .text {
+    font-size: 3.42rem;
+    font-weight: 600;
+    @include ellipsis;
+  }
+
+  .sub {
+    margin-top: 10px;
+    font-size: 2rem;
+  }
+}
+.tab-content {
+  width: 1000px;
+  padding: 20px 0;
+  margin: 0 auto;
+}
+@media (max-width: 1200px) {
+  .banner {
+    .texts {
+      .text {
+        font-size: 1.5rem;
+      }
+    }
+  }
+}
+@media (max-width: 320px) {
+  .banner {
+    .texts {
+      left: 6rem;
+      top: 6rem;
+    }
+  }
+}
+</style>

src/pages/publication/thesis.vue

@@ -10,14 +10,12 @@
           placeholder="请选择出版时间"
           format="yyyy"
           value-format="yyyy"
+          clearable
           @change="initData">
         </el-date-picker>
       </div>
       <div class="search">
-        <input type="text" placeholder="请输入论文题目/期刊名称/作者名称" v-model="form.paperQueryKeyWord">
+        <input type="text" placeholder="请输入论文题目/期刊名称/作者名称" v-model="form.paperQueryKeyWord" clearable>
-        <i class="icon">
-          <img src="@/assets/images/search-white.png" alt="">
-        </i>
       </div>
     </div>
 
@@ -89,58 +87,7 @@ export default {
 </script>
 
 <style lang="scss" scoped>
-.forms {
+@import "../../styles/page/publication.scss";
-  display: flex;
-  align-items: center;
-  padding: 15px;
-  margin-bottom: 20px;
-  background-color: #fff;
-  .item {
-    display: inline-flex;
-    align-items: center;
-    margin-right: 30px;
-  }
-  .label {
-    font-size: 16px;
-    color: #333;
-    white-space: nowrap;
-  }
-  /deep/.el-input__inner {
-    width: 100%;
-    height: 48px;
-    line-height: 48px;
-    border: 0;
-    background: #F7F7F7;
-  }
-  .search {
-    display: inline-flex;
-    width: 34%;
-    input {
-      width: 100%;
-      height: 48px;
-      padding: 0 15px;
-      font-size: 14px;
-      color: #333;
-      background: #F7F7F7;
-      border: 0;
-      border-top-left-radius: 6px;
-      border-bottom-left-radius: 6px;
-      &:focus {
-        outline: none;
-      }
-    }
-  }
-  .icon {
-    display: inline-flex;
-    justify-content: center;
-    align-items: center;
-    width: 62px;
-    height: 48px;
-    background: #1583FF;
-    border-radius: 0px 6px 6px 0px;
-    cursor: pointer;
-  }
-}
 .list {
   li {
     padding: 30px;
@@ -158,15 +105,4 @@ export default {
     line-height: 30px;
   }
 }
-@media (max-width: 1200px) {
-  .forms {
-    padding: 1.25rem;
-    flex-direction: column;
-    .item, .search,div {
-      width: 80%;margin: 0 auto;
-      justify-content: center;
-      margin-top: 20px;
-    }
-  } 
-}
 </style>

src/router/modules/publication.js

@@ -5,10 +5,12 @@ export default {
   component: BasicLayout,
   children: [
     {
-      name,
       path: `/${name}`,
       component: () => import(`@/pages/${name}`),
-      meta: { title: '' }
+    },
+    {
+      path: `single`,
+      component: () => import(`@/pages/${name}/single`),
     },
   ]
 };

src/styles/page/publication.scss

@@ -0,0 +1,64 @@
+.forms {
+  display: flex;
+  align-items: center;
+  padding: 15px;
+  margin-bottom: 20px;
+  background-color: #fff;
+  .item {
+    display: inline-flex;
+    align-items: center;
+    margin-right: 30px;
+  }
+  .label {
+    font-size: 16px;
+    color: #333;
+    white-space: nowrap;
+  }
+  /deep/.el-input__inner {
+    width: 100%;
+    height: 38px;
+    line-height: 38px;
+    border: 0;
+    background: #F7F7F7;
+  }
+  .search {
+    display: inline-flex;
+    width: 34%;
+    input {
+      width: 100%;
+      height: 38px;
+      padding: 0 15px;
+      font-size: 14px;
+      color: #333;
+      background: #F7F7F7;
+      border: 0;
+      border-top-left-radius: 6px;
+      border-bottom-left-radius: 6px;
+      &:focus {
+        outline: none;
+      }
+    }
+  }
+  .icon {
+    display: inline-flex;
+    justify-content: center;
+    align-items: center;
+    width: 62px;
+    height: 38px;
+    background: #1583FF;
+    border-radius: 0px 6px 6px 0px;
+    cursor: pointer;
+  }
+}
+
+@media (max-width: 1200px) {
+  .forms {
+    padding: 1.25rem;
+    flex-direction: column;
+    .item, .search,div {
+      width: 80%;margin: 0 auto;
+      justify-content: center;
+      margin-top: 20px;
+    }
+  } 
+}