refactor: 手机端-全库搜索重构

src/pages/phone/databaseSearch/index.vue

@@ -0,0 +1,241 @@
+<template>
+  <div id="database-search">
+    <div class="search-head">
+      <div class="head-title">
+        <span class="left-title" @click="back"> < </span>
+        <span class="right-title">全库搜索</span>
+      </div>
+      <van-search
+          v-model="searchQuery.selectValue"
+          show-action
+          placeholder="请输入搜索关键词"
+          @search="onSearch"
+      >
+        <template #action>
+          <div @click="onSearch">搜索</div>
+        </template>
+      </van-search>
+    </div>
+
+    <PhoneScroll
+        ref="scroll"
+        height="calc(100vh - 100px)"
+        :data="list"
+        :page="searchQuery.page"
+        :pageSize="searchQuery.pageSize"
+        :total="total"
+        :loading="loading"
+        pullUpLoad
+        pullDownRefresh
+        :getDataHandler="getData">
+      <div style="padding-top: 10px">
+        <div class="card-content" v-for="item in list" :key="item.id" @click="jumpDetails(item) ">
+          <div class="standTitle">
+            <div class="title">
+              <span v-html="item.title"></span>
+            </div>
+          </div>
+
+          <div class="standContent">
+            <div class="standState">标准类别:
+              <span v-if="item.indexType === 'stand'">国内标准</span>
+              <span v-if="item.indexType === 'FOREIGN'">海外标准</span>
+              <span v-if="item.indexType === 'bussstand'">企业标准</span>
+            </div>
+            <div class="standSubTime">发布日期: {{item.issue_time}} </div>
+          </div>
+        </div>
+      </div>
+    </PhoneScroll>
+  </div>
+</template>
+
+<script>
+import PhoneScroll from "@/components/hzwlComponents/phone/PhoneScroll";
+
+export default {
+  name: "index",
+  components: {
+    PhoneScroll
+  },
+  data () {
+    return {
+      searchQuery: {
+        selectIndex: 'fulltextserch',
+        selectValue: '',
+        selectType: 'titleSearch',
+        clientType:2,
+        page: 1,
+        pageSize: 20
+      },
+      total: 0,
+      list: [],
+      loading: false,
+      url: {
+        searchSarBykey: 'search/searchCenter/searchSarBykey'
+      }
+    }
+  },
+  created() {
+    // this.searchQuery.selectValue = this.$route.query.searchKey
+    // this.getData()
+  },
+  beforeRouteEnter (to, from, next) {
+    next(vm => {
+      if (from.name === 'phoneHome') {
+        vm.searchQuery.selectValue = vm.$route.query.searchKey
+        vm.onSearch()
+      }
+    })
+  },
+  methods: {
+    onSearch () {
+      this.list = []
+      this.getData(1)
+    },
+    getData (page) {
+      return new Promise((resolve, reject) => {
+        const config = {
+          _this: this,
+          loading: 'loading'
+        }
+        if (page) {
+          this.searchQuery.page = page
+        }
+        this.$http._postData(this.url.searchSarBykey, this.searchQuery, config).then(res => {
+          if (res.ok) {
+            this.total = res.data.count
+            if (this.searchQuery.page === 1) {
+              this.list = res.data.list
+            } else {
+              this.list = [...this.list, ...res.data.list]
+            }
+          }
+        }).finally(() => {
+          resolve()
+        })
+      })
+    },
+    back(){
+      this.$router.push('/phoneHome')
+    },
+    jumpDetails(item){
+      if(item.indexType === 'stand' ){
+        this.$router.push({
+          name: 'domesticDetails',
+          query: {
+            id: item.id,
+            pageType: 'INLAND_STAND'
+          }
+        })
+      }else if(item.indexType === 'FOREIGN'){
+        this.$router.push({
+          name: 'domesticDetails',
+          query: {
+            id: item.id,
+            pageType: 'FOREIGN_STAND'
+          }
+        })
+      } else if (item.indexType === 'bussstand') {
+        this.$router.push({
+          name: 'domesticDetails',
+          query: {
+            id: item.id,
+            pageType: 'BUSS'
+          }
+        })
+      }
+    },
+  }
+}
+</script>
+
+<style scoped lang="less">
+#database-search {
+  width: 100%;
+  height: 100%;
+  margin: 0;
+  padding: 0;
+  background: #F6F6F6;
+
+  .search-head {
+    width: 100%;
+    height: 100px;
+    background: #3170A8;
+  }
+
+  .head-title {
+    color: #FFFFFF;
+    line-height: 40px;
+    font-size: 18px;
+
+    .left-title {
+      margin-left: 10px;
+    }
+
+    .right-title {
+      float: right;
+      margin-right: 40%;
+    }
+  }
+
+  .van-search {
+    background: #3170A8;
+    padding: 10px 12px 0 12px;
+  }
+
+  .van-search__content {
+    background: #8DB2D0;
+  }
+
+  .van-search__action {
+    color: #FFFFFF;
+  }
+
+  .card-content {
+    width: 95%;
+    height: auto;
+    margin: 10px;
+    background-color: #FFFFFF;
+    border-radius: 5px;
+    box-shadow: 1px 1px 10px rgba(0, 0, 0, 0.1);
+
+    .standTitle {
+      .title {
+        font-size: 3.4vw;
+        color: #333333;
+        font-weight: 600;
+        height: auto;
+        line-height: 20px;
+        padding: 5px 10px;
+        text-align: left;
+        border-bottom: 1px solid #cccccc;
+      }
+    }
+
+    .standContent {
+      font-size: 3.4vw;
+      color: #555555;
+      font-weight: 450;
+      margin-top: 5px;
+
+      .standState {
+        padding-left: 10px;
+        height: 35px;
+        line-height: 35px;
+      }
+
+      .standSubTime {
+        font-size: 3.4vw;
+        padding-left: 10px;
+        height: 35px;
+        line-height: 35px;
+      }
+    }
+  }
+
+  .card-content:first-child{
+    margin-top: 0;
+  }
+}
+</style>

src/router/index.js

@@ -96,12 +96,22 @@ const routes = [
     component: () =>
       import('@/pages/phone/phoneHome')
   },
+    /*
   {
     path: '/databaseSearch',
     name: 'databaseSearch',
     component: () =>
       import('@/pages/phone/databaseSearch')
   },
+  */
+  {
+    path: '/databaseSearch',
+    name: 'databaseSearch',
+    component: () => import('@/pages/phone/databaseSearch/index'),
+    meta: {
+      keepAlive: true
+    }
+  },
   {
     path: '/standDynamics',
     name: 'standDynamics',