我的收藏模块

src/views/components/dialog/index.vue

@@ -0,0 +1,120 @@
+<template>
+  <!-- 预览弹出层 -->
+  <el-dialog
+    title=""
+    :visible.sync="dialogVisible"
+    width="70%"
+    :before-close="close"
+  >
+    <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"
+          v-if="formData.collected == 0"
+          @click="addItem"
+        >
+          <i class="el-icon-star-on"></i><span>收藏</span>
+        </el-button>
+        <el-button
+          type="info"
+          size="mini"
+          v-if="formData.collected == 1"
+          @click="cancelItem"
+        >
+          <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>
+</template>
+
+<script>
+import { mapGetters } from 'vuex';
+import { add, cancel } from '@/api/search';
+import Editor from '@/components/Editor';
+export default {
+  components: {
+    Editor
+  },
+  data() {
+    return {};
+  },
+  props: {
+    dialogVisible: {
+      type: Boolean,
+      required: true
+    },
+    type: {
+      type: String,
+      required: true
+    },
+    formData: {
+      type: Object,
+      required: true
+    }
+  },
+  computed: {
+    ...mapGetters(['token'])
+  },
+  methods: {
+    addItem() {
+      add({ policyId: this.formData.id }).then(res => {
+        this.formData.collected = 1;
+        this.msgSuccess('操作成功');
+      });
+    },
+    cancelItem() {
+      cancel({ policyId: this.formData.id }).then(res => {
+        this.formData.collected = 0;
+        this.msgSuccess('操作成功');
+      });
+    },
+    close() {
+      this.$emit('close');
+    }
+  }
+};
+</script>
+
+<style lang="scss" scoped>
+/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;
+    }
+  }
+}
+</style>