历史版本

src/components/historyList/index.vue

@@ -0,0 +1,94 @@
+<template>
+    <el-dialog v-model="isOpen" append-to-body width="700">
+      <template #header>
+        <div class="my-header">
+          <div class="title">历史版本列表</div>
+        </div>
+      </template>
+      <div class="main-cont">
+        <!-- v-for="(item,index) in treeData.data" :key="index" -->
+        <div class="main-cont-left" >
+            <el-tree-v2
+          ref="treeRef"
+          :data="treeData.data"
+          :show-checkbox="false"
+          :height="320"
+          :props="defaultProps"
+          @node-click="handleNodeClick"
+        >
+          <template #default="{ node }">
+            <span style="display: flex;align-items: center;">
+              <img :src="fileImg" alt="" style="width: 20px;height: 20px;margin-right: 5px;"/>
+              <!-- 放置图片 -->
+              <span>{{ node.label }}</span>
+              <!-- 显示节点标签 -->
+            </span>
+          </template>
+        </el-tree-v2>
+        </div>
+      </div>
+      <template #footer>
+        <span class="dialog-footer">
+          <el-button @click="isOpen = false" class="cancel-button"
+            >取消</el-button
+          >
+          <el-button type="primary" @click="confirm" class="sure-button">
+            确认
+          </el-button>
+        </span>
+      </template>
+    </el-dialog>
+  </template>
+    <script setup>
+  import { reactive, ref, toRaw, toRefs, watch } from "vue";
+  import { ElMessage } from "element-plus";
+  import fileImg from "@/assets/images/file-img.png";
+  import useUserStore from "@/store/modules/user";
+  import { defineEmits } from "vue";
+  const opent = ref(true);
+  const props = defineProps({
+    openFile: {
+      type: Boolean,
+      default: false,
+    },
+    fileUserTreeData: {
+      type: Object,
+      default: () => {},
+    },
+    docId:{
+      type:String,
+      default: '',
+    }
+  });
+  const defaultProps = {
+    children: "",
+    label: "createTime",
+    value: "docId",
+  };
+  const isOpen = ref(props.openFile);
+  watch(
+    () => props.openFile,
+    (newValue) => {
+      isOpen.value = newValue;
+    }
+  );
+  const treeData = reactive({ data: [] });
+  watchEffect(() => {
+    treeData.data=props.fileUserTreeData
+    toRaw(treeData.data);
+  });
+  
+  //树
+  const clickData = ref({});
+  const handleNodeClick = (data) => {
+    clickData.value = data;
+  };
+  //确定按钮
+    const emit = defineEmits(["fileChangeMsg"]);
+  const confirm = () => {
+      isOpen.value  = false
+  };
+  </script>
+  <style lang="scss" scoped>
+  @import "@/assets/styles/tree-common.scss";
+  </style>