详情模板暂存

src/template/websiteTemplate/detailTemplate.vue

@@ -0,0 +1,77 @@
+<template>
+  <div>
+    <el-button
+        type="text"
+        size="mini"
+        @click="detailClick((drawerVisible = true))"
+    >详情</el-button
+    >
+    <el-drawer
+        title="详情"
+        :visible.sync="dialogFormVisible"
+        size="60%"
+        direction="rtl"
+        append-to-body
+        :show-close="false"
+        @close="onClose"
+    >
+      <template v-slot:title>
+        <div style="display: flex; justify-content: space-between">
+          <div>详情</div>
+          <slot name="operation"></slot>
+        </div>
+      </template>
+      <div class="drawer__panel" style="margin-bottom: 0;!important;">
+        <el-descriptions :column="column?column:4" size="mini">
+          <el-descriptions-item label-class-name="my-label-layout" content-class-name="my-content" v-for="item in mainAData" :key="item.index" :label="item.label">
+            <span :style="item.style?item.style():''">{{item.value !== ''?item.value:'--'}}</span>
+          </el-descriptions-item>
+        </el-descriptions>
+      </div>
+      <div class="drawer__panel">
+        <div v-for="item in richText">
+          <p style="font-size: 14px">{{item.title}}</p>
+          <div class="content_style">
+            <div :ref="item.ref" class="fwb"></div>
+          </div>
+        </div>
+      </div>
+    </el-drawer>
+  </div>
+</template>
+
+<script>
+export default {
+  name: "detailTemplate",
+  props:['column','mainAreaData','mainAData','richText'],
+  data(){
+    return {
+      drawerVisible:false
+    }
+  },
+  computed:{
+    mainAData () {
+      try {
+        let data = this.mainAreaData.filter(e=>{
+          if(e.label != '备注' && e.label != '优势信息' && e.label != '劣势信息') {
+            return e
+          }
+        })
+        return data
+      } catch (error) {
+
+      }
+    },
+  },
+  methods:{
+    detailClick(){},
+    onClose(){
+
+    }
+  }
+}
+</script>
+
+<style scoped>
+
+</style>