jiace-web/src/views/search.vue

<template>
  <div class="search_page">
    <div class="content">
      <div class="item" v-for="(value, key, index) in list" :key="index">
        <!-- 政策 -->
        <div>
          <!-- <el-tag effect="dark" v-if="key == 'policy'">政策</el-tag> -->
          <span class="tag" v-if="key == 'policy'">政策</span>
          <span class="tag" v-else-if="key == 'policyRead'">政策解读</span>
          <span class="tag" v-else-if="key == 'information'">资讯快报</span>
          <span class="tag" v-else-if="key == 'companyNeed'">企业需求</span>
          <span class="tag" v-else-if="key == 'scienceResult'">科学成功</span>
          <el-divider></el-divider>
          <div class="item_i" v-for="(item, index2) in value" :key="index2">
            <div>
              <h4 class="pointer">
                <router-link
                  target="_blank"
                  :to="{ path: '/result', query: { key, id: item.id } }"
                  >{{ item.title }}</router-link
                >
              </h4>
              <div class="info" v-if="key == 'policy' || key == 'policyRead'">
                <div>来源：{{ item.source }}</div>
                <div>发布：{{ item.listDate }}</div>
              </div>
              <div
                class="info"
                style="justify-content: flex-end"
                v-if="key == 'information'"
              >
                <div>发布：{{ parseTime(item.listDate, '{y}-{m}-{d}') }}</div>
              </div>
              <div
                class="info"
                v-else-if="key == 'companyNeed' || key == 'scienceResult'"
              >
                <div>
                  <el-tag type="warning" size="mini" effect="dark">
                    {{ item.fieldName }}
                  </el-tag>
                  <el-tag type="warning" size="mini" effect="dark">
                    {{ item.typeName || item.labelName }}
                  </el-tag>
                </div>
                <div>发布：{{ parseTime(item.createTime, '{y}-{m}-{d}') }}</div>
              </div>
            </div>
            <el-divider></el-divider>
          </div>
        </div>
      </div>
    </div>
    <popup
      :dialogVisible="dialogVisible"
      :type="type"
      :formData="formData"
      @close="dialogVisible = false"
    />
  </div>
</template>
<script>
import {
  search,
  getPolicyInfo,
  getPolicyReadInfo,
  getInfo,
  getInfo2,
  getInfo3
} from '@/api/search';
import popup from './components/dialog';
export default {
  components: {
    popup
  },
  data() {
    return {
      list: {},
      dialogVisible: false,
      formData: {},
      type: ''
    };
  },
  watch: {
    dialogVisible(a, b) {
      if (!a) this.formData = {};
    },
    formData: {
      handler: function() {
        this.$nextTick(() => {
          this.formatRichText(this.formData.downloadUrl);
        });
      }
    },
    deep: true
  },
  methods: {},
  created() {
    let { val: param } = this.$route.query;
    search({ param }).then(({ data }) => {
      this.list = data;
    });
  }
};
</script>
<style lang="scss" scoped>
.search_page {
  .content {
    padding: 20px 30px;
    .item {
      margin-bottom: 40px;
      .tag {
        background-color: #1890ff;
        color: #fff;
        font-size: 18px;
        padding: 10px 25px;
        border-radius: 6px;
      }
      .item_i {
        .info {
          display: flex;
          justify-content: space-between;
          font-size: 14px;
          color: #333;
          .el-tag {
            margin-right: 10px;
          }
        }
      }
    }
  }
}
</style>