搜索功能

src/config/router.gateway.js

@@ -29,6 +29,13 @@ export default [
         //redirect: '/user/login',
         component: () => import(/* webpackChunkName: "user" */ '@/views/gateway/listPage2')
       },
+      {
+        path: '/listPageSearch',
+        name: 'listPageSearch',
+        //component: BlankLayout,
+        //redirect: '/user/login',
+        component: () => import(/* webpackChunkName: "user" */ '@/views/gateway/listPageSearch')
+      },
       {
         path: '/detailedPage',
         name: 'detailedPage',

src/views/gateway/common/header.vue

@@ -14,8 +14,8 @@
 			<div class="h_down clearfloat">
 				<div class="logo left"><img src="img/logo.png" ></div>
 				<div class="sch_downbox right">
-					<input type="" name="" id="" placeholder="请输入要搜索的内容" />
-					<span class="sch_img right"><img src="img/search.png" ></span>
+					<input v-model="searchText" placeholder="请输入要搜索的内容" />
+					<span class="sch_img right" @click="() => {searchText?$to('listPageSearch',{findStr:searchText}):''}"><img src="img/search.png" ></span>
 				</div>
 			</div>
 		</div>

src/views/gateway/detailedPage.vue

@@ -21,7 +21,7 @@
 			<div class="weizhi">
 				<span><img src="img/shouye.png" style="width: 16px;margin: 11px 4px 0 0;"></span>
 				<span>当前位置：</span>
-				<a href="javascript:void(0);" @click="$to('home')">首页{{thisColumn.parent}} -- {{thisColumn.id}}></a>
+				<a href="javascript:void(0);" @click="$to('home')">首页></a>
 				<a href="javascript:void(0);" @click="$to('listPage',{pid:thisColumn.parent?thisColumn.parent:thisColumn.id,id:thisColumn.parent?thisColumn.id:null})">{{parentData.name}} > </a>
 				<!-- <a href="javascript:void(0);" >{{parentData.name}} > </a> -->
 				<a href="javascript:void(0);">{{thisColumn.name}}</a>

src/views/gateway/listPageSearch.vue

@@ -0,0 +1,137 @@
+<template>
+  <div>
+    <headerView/>
+    <div class="er_bann9" ></div>
+    <div class="weizhibox">
+			<div class="weizhi">
+				<span><img src="img/shouye.png" style="width: 16px;margin: 11px 4px 0 0;"></span>
+				<span>当前位置：</span>
+				<a href="javascript:void(0);" @click="$to('home')">首页 ></a>
+				<!-- <a href="javascript:void(0);" @click="$to('listPage',{pid:thisColumn.parent})">{{parentData.name}} > </a> -->
+				<a href="javascript:void(0);" >搜索 </a>
+			</div>
+		</div>
+    <div class="er_contant clearfloat">
+			<div class="er_contl left">
+				<div class="hjk_item">
+					<h3>搜索</h3>
+					<div class="" style="width: 60px;height: 3px;background-color: #3591EB;margin-top: -3px;"></div>
+				</div>
+				<ul>
+            <li class="active2"><a href="javascript:void(0);" class="active3">搜索</a></li>
+				</ul>
+			</div>
+			<div class="cyh_contr right">
+				<ul>
+					<li v-for="(art,artIndex) in articleList" :key="artIndex">
+						<a href="javascript:void(0);" class="cyh_coa clearfloat" @click="$to('detailedPage',{id:art.id})">
+							<div class="cyhl left">
+								<h3 class="elli">{{art.title}}</h3>
+								<p class="over-line2">{{$tfnm(art,'content',104)}}</p>
+							</div>
+							<div class="cyhr right">
+								<div class="cyhr_date">{{getMonthAndDay(art.updateTime || art.createTime)}}</div>
+								<div class="jianttewr">→</div>
+							</div>
+						</a>
+					</li>
+				</ul>
+			</div>
+		</div>
+
+
+    <footerView/>
+  </div>
+</template>
+
+<script>
+import { getwayMixin } from '@/views/gateway/mixins/getwayMixin'
+import { getAction } from '@/api/manage'
+import headerView from '@/views/gateway/common/header'
+import footerView from '@/views/gateway/common/footer'
+
+export default {
+  mixins:[getwayMixin],
+  components:{
+    headerView,
+    footerView
+  },
+  props:{
+  },
+  data(){
+    return {
+      parentData:{},
+      thisColumn:{},
+      columnList:[],
+      articleList: [],
+    }
+  },
+  computed:{
+    pid(){
+      return this.$route.query.pid || '-1';
+    },
+    id(){
+      return this.$route.query.id;
+    },
+    findStr(){
+      if(this.$route.query.findStr){
+        return '*'+this.$route.query.findStr+'*';
+      }else{
+        return '';
+      }
+    },
+  },
+  mounted(){
+    this.loadData();
+  },
+  watch:{
+    pid(){
+      this.loadData();
+    },
+    id(){
+      this.loadData();
+    },
+    findStr(){
+      this.loadData();
+    }
+  },
+  updated(){
+  },
+  methods:{
+    loadData(){
+      //如果没有ID自动选中一个
+      // if(this.id){
+        //查询文章列表
+        let findParam = {}
+        if(this.findStr){
+            findParam.title = this.findStr;
+        }
+        getAction('/gateway/gatewayArticle/list',{pageSize:-1,isRelease:'Y',...findParam}).then((res)=>{
+          if(res.success){
+            let list = res.result.records||res.result;
+            this.articleList = list;
+          }
+        });
+      // }
+    },
+    getDay(dateTime){
+      if(!dateTime) return '';
+      let d = new Date(dateTime);
+      return d.getDate()
+    },
+    getMonthAndDay(dateTime){
+      if(!dateTime) return '';
+      let d = new Date(dateTime);
+      return (d.getMonth()+1)  + '-' + d.getDate();
+    },
+    getYearAndMonth(dateTime){
+      if(!dateTime) return '';
+      let d = new Date(dateTime);
+      return d.getFullYear() + '-' + (d.getMonth()+1)
+    },
+  },
+}
+</script>
+
+<style scoped>
+</style>