手机端页面

2022-05-26 17:40:10 +08:00
parent 70cd152344
commit 6a79131ad1
13 changed files with 772 additions and 1 deletions
@@ -0,0 +1,166 @@
+<!--全库检索-->
+<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="searchKey"
+      show-action
+      placeholder="请输入搜索关键词"
+      @search="onSearch"
+    >
+      <template #action>
+        <div @click="onSearch">搜索</div>
+      </template>
+    </van-search>
+  </div>
+  <div v-if="loading">
+    <van-loading size="24px" color="#3170A8">加载中...</van-loading>
+  </div>
+  <div v-else-if="!loading && standList.length" class="card-content" v-for="item in standList" :key="item.id">
+    <div class="standTitle">
+      <div class="title">{{item.title}}</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 v-else-if="!loading  && !standList.length">
+    <van-empty description="暂无数据" />
+  </div>
+ </div>
+</template>
+
+<script>
+export default {
+  name: "databaseSearch",
+  data(){
+    return{
+      searchKey: '',
+      standList: [],
+      loading: true,
+    }
+  },
+  methods: {
+    onSearch(){
+      this.$http.post('search/searchCenter/searchSarBykey',{
+        selectIndex: 'fulltextserch',
+        selectValue: this.searchKey,
+        selectType: 'titleSearch',
+        page: 1,
+        pageSize: 20
+      },{
+        _this: this,
+      }, res => {
+        this.standList = res.data.list
+        console.log(this.standList);
+        this.loading = false
+      }, e => {
+          console.log(e)
+      })
+    },
+    //返回上一个页面
+    back(){
+      this.$router.push('/phoneHome')
+    },
+  },
+  mounted(){
+    this.searchKey = this.$route.query.searchKey
+    this.onSearch()
+  }
+};
+</script>
+
+<style lang="less" scoped>
+#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{
+    .van-cell-group--inset{
+      margin: 10px 16px 0 16px;
+    }
+    .card-cell{
+      /deep/.van-cell::after{
+        display: none;
+      }
+    }
+  }
+  .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{
+        color: #333333;
+        font-weight: 600;
+        height: auto;
+        line-height: 20px;
+        padding: 5px 10px;
+        text-align: left;
+        border-bottom: 1px solid #cccccc;
+      }
+    }
+    .standContent{
+      color: #555555;
+      font-weight: 450;
+      margin-top: 5px;
+      .standState{
+        padding-left: 10px;
+        height: 35px;
+        line-height: 35px;
+      }
+      .standSubTime{
+        padding-left: 10px;
+        height: 35px;
+        line-height: 35px;
+      }
+    }
+  }
+  .van-loading {
+    position: absolute;
+    top: 52%;
+    left: 37%;
+  }
+}
+</style>