cloudfile-ui/src/components/previewTemp/previewTemp.vue

<template>
  <div>
    <!-- <el-dialog
      v-model="props.showPreview"
      width="30%"
      @close="close"
      title="11"
    > -->
    <jjtOnlyOffice :option="obj" :usersArr="usersArr" />
    <!-- </el-dialog> -->
  </div>
</template>

<script setup>
import jjtOnlyOffice from "@/components/OnlyOffice/index.vue";
import { ref, toRaw, onMounted, inject, onActivated, watch } from "vue";
import { useRouter, useRoute, onBeforeRouteUpdate } from "vue-router";
import { getTemplateUsers } from "@/api/biz/template.js";
import { ElMessage } from "element-plus";
import useUserStore from "@/store/modules/user";
const props = defineProps({
  option: {
    type: Object,
    default: () => {},
  },
  showPreview: {
    type: Boolean,
    default: false,
  },
});
const usersArr = ref([])
const obj = ref({
  key: "",
  url: "", //在线文档地址
  isEdit: true, //是否允许编辑
  fileType: "", //文件扩展名
  title: "", //文件标题
  user: {
    id: null, //用户ID
    name: "", //用户姓名
  },
  userdata: "",
  editUrl: "", //回调地址
});
const close = () => {};
function handleOpen(itemObj) {
  // console.log('isEdit',isEdit);
  obj.value.isEdit = false;
  obj.value.isCopy = true;
  obj.value.url = `${window.location.origin}${
    import.meta.env.VITE_APP_BASE_API
  }/api/view/${itemObj.fileId}`;
  obj.value.title = itemObj.tmplName;
  obj.value.key = itemObj.fileId;
  switch (itemObj.tmplType) {
    case "word":
      obj.value.fileType = "docx";
      break;
    case "excel":
      obj.value.fileType = "xlsx";
      break;
    case "ppt":
      obj.value.fileType = "pptx";
      break;
  }

  obj.value.editUrl = `${window.location.origin}${
    import.meta.env.VITE_APP_BASE_API
  }/only-office/tmpl/callback/${itemObj.tmplId}?name=${useUserStore().uname}`;
  // option.value.editUrl = `http://8.142.173.95:19527/only-office/callback/${obj.docId}?name=${useUserStore().uname}`;
  obj.value.user = {
    id: useUserStore().uid, //用户ID
    name: useUserStore().uname, //用户姓名
  };
}
const getUsers = async () => {
  const res = await getTemplateUsers();
  console.log("res",res.data);
  usersArr.value = res.data
};
onMounted(() => {
  let route = useRoute();
  getUsers()
  console.log("route", route.query);
  if (route.query.str) {
    const objPre = JSON.parse(route.query.str);
    // console.log("objPre", objPre);
    obj.value = objPre;
  } else if (route.query.itemStr) {
    const itemObj = JSON.parse(route.query.itemStr);
    // console.log("itemObj", itemObj);
    handleOpen(itemObj);
  } else {
    obj.value = props.option;
    // console.log("obj", obj.value);
  }
});
</script>

<style lang="scss" scoped>
</style>