up1

src/views/search.vue

@@ -0,0 +1,205 @@
+<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" @click="handleItem(key, item.id)">
+                {{ item.title }}
+              </h4>
+              <div class="info" v-if="key == 'policy' || key == 'policyRead'">
+                <div>来源：{{ item.source }}</div>
+                <div>发布：{{ item.listDate }}</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>
+    <el-dialog title="" :visible.sync="dialogVisible" width="70%">
+      <h2>{{ formData.title }}</h2>
+      <div class="info" v-if="type != 'information'">
+        <span v-if="type != 'companyNeed' && type != 'scienceResult'"
+          >来源：{{ formData.source }}</span
+        >
+        <span v-if="type == 'companyNeed'">价格：{{ formData.price }}</span>
+        <el-image
+          v-if="type == 'scienceResult'"
+          style="width: 100px; height: 100px"
+          :src="formData.picList ? formData.picList[0] : ''"
+          fit="cover"
+          :preview-src-list="formData.picList"
+        ></el-image>
+        <span
+          >发布：{{
+            formData.listDate || parseTime(formData.createTime, '{y}-{m}-{d}')
+          }}</span
+        >
+        <span v-if="token && type == 'policy'">
+          <el-button type="primary" size="mini">
+            <i class="el-icon-star-on"></i><span>收藏</span>
+          </el-button>
+          <el-button type="info" size="mini">
+            <i class="el-icon-star-on"></i><span>取消收藏</span>
+          </el-button>
+        </span>
+      </div>
+      <!-- <div v-html="formData.text"></div> -->
+      <div id="text">
+        <editor v-model="formData.text" :min-height="192" />
+      </div>
+    </el-dialog>
+  </div>
+</template>
+<script>
+import { mapGetters } from 'vuex';
+import Editor from '@/components/Editor';
+import {
+  search,
+  getPolicyInfo,
+  getPolicyReadInfo,
+  getInfo,
+  getInfo2,
+  getInfo3,
+  add,
+  cancel
+} from '@/api/search';
+export default {
+  components: {
+    Editor
+  },
+  data() {
+    return {
+      list: {},
+      dialogVisible: false,
+      formData: {},
+      type: ''
+    };
+  },
+  computed: {
+    ...mapGetters(['token'])
+  },
+  watch: {
+    dialogVisible(a, b) {
+      if (!a) this.formData = {};
+    },
+    formData: {
+      handler: function() {
+        this.$nextTick(() => {
+          this.formatRichText(this.formData.downloadUrl);
+        });
+      }
+    },
+    deep: true
+  },
+  methods: {
+    handleItem(key, id) {
+      this.type = key;
+      this.dialogVisible = true;
+      if (key == 'policy') {
+        // 政策
+        getPolicyInfo({ policyId: id }).then(({ data }) => {
+          this.formData = data;
+        });
+      } else if (key == 'policyRead') {
+        // 政策解读
+        getPolicyReadInfo({ readId: id }).then(({ data }) => {
+          this.formData = data;
+        });
+      } else if (key == 'information') {
+        // 资讯快报
+        getInfo({ id }).then(({ data }) => {
+          this.formData = data;
+        });
+      } else if (key == 'companyNeed') {
+        // 企业需求
+        getInfo2({ id }).then(({ data }) => {
+          this.formData = data;
+        });
+      } else if (key == 'scienceResult') {
+        // 科学成功
+        getInfo3({ id }).then(({ data }) => {
+          this.formData = data;
+        });
+      }
+    }
+  },
+  created() {
+    let { val: param } = this.$route.query;
+    search({ param }).then(({ data }) => {
+      this.list = data;
+    });
+  }
+};
+</script>
+<style lang="scss" scoped>
+.search_page {
+  /deep/.el-dialog__body {
+    padding-top: 0;
+  }
+  .el-dialog {
+    .info {
+      display: flex;
+      justify-content: space-between;
+    }
+    #text {
+      margin-top: 30px;
+      /deep/.ql-toolbar {
+        display: none;
+      }
+      /deep/.editor {
+        border: 0;
+      }
+    }
+  }
+
+  .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>