|
|
@@ -1,19 +1,38 @@
|
|
|
<template>
|
|
|
- <div class="common-layout">
|
|
|
- <el-container>
|
|
|
- <el-header class="nav" style="position: sticky; top: 0; left: 0; width: 100%; z-index: 999">
|
|
|
- <div class="nav-top">
|
|
|
- <div>
|
|
|
- <img class="logoImg" src="@/assets/images/logos.png" /><span>聚合智慧文档管理系统</span>
|
|
|
- </div>
|
|
|
- <div class="search">
|
|
|
- <el-input v-model="searchText" maxlength="32" class="w-50 m-2" size="small" placeholder="搜索文件"
|
|
|
- suffix-icon="Search" clearable @change="toSearch" @@keyup.enter="toSearch" />
|
|
|
- </div>
|
|
|
- <div>
|
|
|
- <el-dropdown @command="handleCommand" class="right-menu-item hover-effect" trigger="click">
|
|
|
- <div class="avatar-wrapper">
|
|
|
- <img :src="
|
|
|
+ <div class="common-layout">
|
|
|
+ <el-container>
|
|
|
+ <el-header
|
|
|
+ class="nav"
|
|
|
+ style="position: sticky; top: 0; left: 0; width: 100%; z-index: 999"
|
|
|
+ >
|
|
|
+ <div class="nav-top">
|
|
|
+ <div>
|
|
|
+ <img class="logoImg" src="@/assets/images/logos.png" /><span
|
|
|
+ >聚合智慧文档管理系统</span
|
|
|
+ >
|
|
|
+ </div>
|
|
|
+ <div class="search">
|
|
|
+ <el-input
|
|
|
+ v-model="searchText"
|
|
|
+ maxlength="32"
|
|
|
+ class="w-50 m-2"
|
|
|
+ size="small"
|
|
|
+ placeholder="搜索文件"
|
|
|
+ suffix-icon="Search"
|
|
|
+ clearable
|
|
|
+ @change="toSearch"
|
|
|
+ @@keyup.enter="toSearch"
|
|
|
+ />
|
|
|
+ </div>
|
|
|
+ <div>
|
|
|
+ <el-dropdown
|
|
|
+ @command="handleCommand"
|
|
|
+ class="right-menu-item hover-effect"
|
|
|
+ trigger="click"
|
|
|
+ >
|
|
|
+ <div class="avatar-wrapper">
|
|
|
+ <img
|
|
|
+ :src="
|
|
|
userStore.avatar
|
|
|
? userStore.avatar
|
|
|
: '@/assets/images/profile.png'
|
|
|
@@ -43,771 +62,833 @@
|
|
|
$route.path == item.path
|
|
|
? 'acitve-img-style img-style'
|
|
|
: 'img-style'
|
|
|
- ">
|
|
|
- <img :src="$route.path == item.path ? item.beimgs : item.imgs" />
|
|
|
- <div class="text-style" v-if="$route.path != item.path">
|
|
|
- {{ item.label }}
|
|
|
- </div>
|
|
|
- <span class="yuandian" v-if="
|
|
|
+ "
|
|
|
+ >
|
|
|
+ <img
|
|
|
+ :src="$route.path == item.path ? item.beimgs : item.imgs"
|
|
|
+ />
|
|
|
+ <div class="text-style" v-if="$route.path != item.path">
|
|
|
+ {{ item.label }}
|
|
|
+ </div>
|
|
|
+ <span
|
|
|
+ class="yuandian"
|
|
|
+ v-if="
|
|
|
websoctStore.messOne?.fromId &&
|
|
|
item.path == '/index' &&
|
|
|
$route.path != item.path &&
|
|
|
clickId !== index
|
|
|
- "></span>
|
|
|
- </div>
|
|
|
- </router-link><br />
|
|
|
- </div>
|
|
|
- </el-aside>
|
|
|
- <el-main class="main">
|
|
|
- <div class="tab_box">
|
|
|
- <!-- <el-tabs
|
|
|
+ "
|
|
|
+ ></span>
|
|
|
+ </div> </router-link
|
|
|
+ ><br />
|
|
|
+ </div>
|
|
|
+ </el-aside>
|
|
|
+ <el-main class="main">
|
|
|
+ <div class="tab_box">
|
|
|
+ <!-- <el-tabs
|
|
|
v-model="editableTabsValue"
|
|
|
@tab-change="clickTab"
|
|
|
@tab-add="addTab"
|
|
|
type="card"
|
|
|
class="common-tabs"
|
|
|
> -->
|
|
|
- <el-tabs v-model="editableTabsValue" @tab-add="addTab" type="card" class="common-tabs">
|
|
|
- <el-tab-pane label="首页"> </el-tab-pane>
|
|
|
- <el-tab-pane v-for="(item, index) in toRaw(editableTabs)" :key="item.path"
|
|
|
- :label="item.label" :name="item.path" :data-item="JSON.stringify(item)">
|
|
|
- <template #label>
|
|
|
- <!-- <div class="tab_pane" @click="paneClick(item)">
|
|
|
- <div class="tab_text">{{ item.label }}</div>
|
|
|
- <img src="@/assets/images/close.png" @click="closeTab(item, index, $event)"
|
|
|
- alt="" />
|
|
|
- </div> -->
|
|
|
- <router-link
|
|
|
+ <el-tabs
|
|
|
+ v-model="editableTabsValue"
|
|
|
+ @tab-add="addTab"
|
|
|
+ type="card"
|
|
|
+ class="common-tabs"
|
|
|
+ >
|
|
|
+ <el-tab-pane label="首页"> </el-tab-pane>
|
|
|
+ <el-tab-pane
|
|
|
+ v-for="(item, index) in toRaw(editableTabs)"
|
|
|
+ :key="item.path"
|
|
|
+ :label="item.label"
|
|
|
+ :name="item.path"
|
|
|
+ :data-item="JSON.stringify(item)"
|
|
|
+ >
|
|
|
+ <template #label>
|
|
|
+ <div class="tab_pane" @click="paneClick(item)">
|
|
|
+ <div class="tab_text">{{ item.label }}</div>
|
|
|
+ <img
|
|
|
+ src="@/assets/images/close.png"
|
|
|
+ @click="closeTab(item, index, $event)"
|
|
|
+ alt=""
|
|
|
+ />
|
|
|
+ </div>
|
|
|
+ <!-- <router-link
|
|
|
:key="item"
|
|
|
:data-path="item.path"
|
|
|
:to="{
|
|
|
path: item.path,
|
|
|
- query: {row:item.clickRowId},
|
|
|
+ query: { row: item.clickRowId },
|
|
|
}"
|
|
|
@click="paneClick(item)"
|
|
|
class="tags-view-item"
|
|
|
>
|
|
|
- {{item.label}}
|
|
|
- </router-link>
|
|
|
- </template>
|
|
|
- </el-tab-pane>
|
|
|
- <!-- 文件的iframe -->
|
|
|
- <div v-for="item in iFrameData" :key="item.id">
|
|
|
- <el-tab-pane :label="item.name" v-if="item.src">
|
|
|
- <template #label>
|
|
|
- <div class="tab_pane" @click="filePaneClick(item)">
|
|
|
- <div class="tab_text">{{ item.name }}</div>
|
|
|
- <img src="@/assets/images/close.png"
|
|
|
- @click="closeFileTab(item, index, $event)" alt="" />
|
|
|
- </div>
|
|
|
- </template>
|
|
|
- </el-tab-pane>
|
|
|
- </div>
|
|
|
- </el-tabs>
|
|
|
- </div>
|
|
|
- <div v-show="isAlive">
|
|
|
- <router-view v-slot="{ Component }">
|
|
|
- <KeepAlive :exclude="['identifyFont', 'allback', 'search']">
|
|
|
- <component :is="Component" />
|
|
|
- </KeepAlive>
|
|
|
- </router-view>
|
|
|
- </div>
|
|
|
- <div v-show="!isAlive" style="width: 100%">
|
|
|
- <div v-for="item in iFrameData" :key="item.id">
|
|
|
- <div style="width: 100%" v-show="item.show">
|
|
|
- <iframe :src="item.src" frameborder="0" :id="`iframe${item.id}`" width="100%"
|
|
|
- height="800px" class="iframeBox" v-show="item.show"></iframe>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </el-main>
|
|
|
- </el-container>
|
|
|
- </el-container>
|
|
|
- </div>
|
|
|
+ {{ item.label }}
|
|
|
+ </router-link> -->
|
|
|
+ </template>
|
|
|
+ </el-tab-pane>
|
|
|
+ <!-- 文件的iframe -->
|
|
|
+ <div v-for="item in iFrameData" :key="item.id">
|
|
|
+ <el-tab-pane :label="item.name" v-if="item.src">
|
|
|
+ <template #label>
|
|
|
+ <div class="tab_pane" @click="filePaneClick(item)">
|
|
|
+ <div class="tab_text">{{ item.name }}</div>
|
|
|
+ <img
|
|
|
+ src="@/assets/images/close.png"
|
|
|
+ @click="closeFileTab(item, index, $event)"
|
|
|
+ alt=""
|
|
|
+ />
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ </el-tab-pane>
|
|
|
+ </div>
|
|
|
+ </el-tabs>
|
|
|
+ </div>
|
|
|
+ <div v-show="isAlive">
|
|
|
+ <router-view v-slot="{ Component }">
|
|
|
+ <KeepAlive :exclude="['identifyFont', 'allback', 'search']">
|
|
|
+ <component :is="Component" />
|
|
|
+ </KeepAlive>
|
|
|
+ </router-view>
|
|
|
+ </div>
|
|
|
+ <div v-show="!isAlive" style="width: 100%">
|
|
|
+ <div v-for="item in iFrameData" :key="item.id">
|
|
|
+ <div style="width: 100%" v-show="item.show">
|
|
|
+ <iframe
|
|
|
+ :src="item.src"
|
|
|
+ frameborder="0"
|
|
|
+ :id="`iframe${item.id}`"
|
|
|
+ width="100%"
|
|
|
+ height="800px"
|
|
|
+ class="iframeBox"
|
|
|
+ v-show="item.show"
|
|
|
+ ></iframe>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </el-main>
|
|
|
+ </el-container>
|
|
|
+ </el-container>
|
|
|
+ </div>
|
|
|
</template>
|
|
|
|
|
|
<script setup>
|
|
|
- import {
|
|
|
- nextTick,
|
|
|
- onMounted,
|
|
|
- provide,
|
|
|
- ref
|
|
|
- } from "vue";
|
|
|
- import {
|
|
|
- ElMessageBox,
|
|
|
- ElMessage
|
|
|
- } from "element-plus";
|
|
|
- import useAppStore from "@/store/modules/app";
|
|
|
- import useUserStore from "@/store/modules/user";
|
|
|
- import useSettingsStore from "@/store/modules/settings";
|
|
|
- import Cookies from "js-cookie";
|
|
|
- import chat from "@/assets/images/chat.png";
|
|
|
- import bechat from "@/assets/images/bechat.png";
|
|
|
- import zuijin from "@/assets/images/zuijin.png";
|
|
|
- import bezuijin from "@/assets/images/bezuijin.png";
|
|
|
- import colloect from "@/assets/images/colloect.png";
|
|
|
- import becolloect from "@/assets/images/becolloect.png";
|
|
|
- import system from "@/assets/images/system.png";
|
|
|
- import issystem from "@/assets/images/issystem.png";
|
|
|
- import my from "@/assets/images/my.png";
|
|
|
- import bemy from "@/assets/images/bemy.png";
|
|
|
- import bumen from "@/assets/images/bumen.png";
|
|
|
- import bebumen from "@/assets/images/bebumen.png";
|
|
|
- import common from "@/assets/images/common.png";
|
|
|
- import becommon from "@/assets/images/becommon.png";
|
|
|
- import chuanshu from "@/assets/images/chuanshu.png";
|
|
|
- import bechuanshu from "@/assets/images/bechuanshu.png";
|
|
|
- import highsearch from "@/assets/images/highsearch.png";
|
|
|
- import behighsearch from "@/assets/images/behighsearch.png";
|
|
|
- import manyBody from "@/assets/images/manyBody.png";
|
|
|
- import manyBodyFalse from "@/assets/images/manyBodyFalse.png";
|
|
|
- import {
|
|
|
- AppMain,
|
|
|
- Navbar,
|
|
|
- Settings,
|
|
|
- TagsView
|
|
|
- } from "./components";
|
|
|
- import {
|
|
|
- flieSearch
|
|
|
- } from "@/api/search/search.js";
|
|
|
- import {
|
|
|
- useRouter,
|
|
|
- useRoute
|
|
|
- } from "vue-router";
|
|
|
- import useWebsoctStore from "@/store/modules/websocket";
|
|
|
- import {
|
|
|
- toRaw
|
|
|
- } from "@vue/reactivity";
|
|
|
- import iFrame from "@/components/iFrame/index.vue";
|
|
|
- const websoctStore = useWebsoctStore();
|
|
|
- const router = useRouter(); //注册路由
|
|
|
- const route = useRoute();
|
|
|
- const appStore = useAppStore();
|
|
|
- const userStore = useUserStore();
|
|
|
- const settingsStore = useSettingsStore();
|
|
|
- const searchText = ref(""); //搜索ipt的值
|
|
|
- const selectValue = ref(1); //文档空间类型
|
|
|
- const wangzhi = import.meta.env.VITE_APP_BASE_API;
|
|
|
- const isAlive = ref(true);
|
|
|
- const toFileData = ref();
|
|
|
- const uid = useUserStore().uid;
|
|
|
- const iFrameData = ref([{
|
|
|
- id: 1,
|
|
|
- // src: `${window.location.origin}/fileEdit?clickRowId=113`,
|
|
|
- show: false,
|
|
|
- name: "file1",
|
|
|
- },
|
|
|
- {
|
|
|
- id: 2,
|
|
|
- src: ``,
|
|
|
- // src: `http://192.168.1.9:81/fileEdit?clickRowId=1198`,
|
|
|
- show: false,
|
|
|
- name: "file2",
|
|
|
- },
|
|
|
- {
|
|
|
- id: 3,
|
|
|
- src: ``,
|
|
|
- show: false,
|
|
|
- name: "",
|
|
|
- },
|
|
|
- {
|
|
|
- id: 4,
|
|
|
- src: ``,
|
|
|
- show: false,
|
|
|
- name: "",
|
|
|
- },
|
|
|
- ]);
|
|
|
- //--------tabs-----------------
|
|
|
- let tabIndex = 2;
|
|
|
- const editableTabsValue = ref("/index");
|
|
|
- const editableTabs = ref([]);
|
|
|
-
|
|
|
- // const removeTab = (targetName) => {
|
|
|
- // const tabs = editableTabs.value;
|
|
|
- // let activeName = editableTabsValue.value;
|
|
|
- // if (activeName === targetName) {
|
|
|
- // tabs.forEach((tab, index) => {
|
|
|
- // if (tab.name === targetName) {
|
|
|
- // const nextTab = tabs[index + 1] || tabs[index - 1];
|
|
|
- // if (nextTab) {
|
|
|
- // activeName = nextTab.name;
|
|
|
- // }
|
|
|
- // }
|
|
|
- // });
|
|
|
- // }
|
|
|
-
|
|
|
- // editableTabsValue.value = activeName;
|
|
|
- // editableTabs.value = tabs.filter((tab) => tab.name !== targetName);
|
|
|
- // };
|
|
|
- //-------------------------
|
|
|
-
|
|
|
- function reload() {
|
|
|
- isAlive.value = false;
|
|
|
- console.log(11);
|
|
|
- nextTick(() => {
|
|
|
- isAlive.value = true;
|
|
|
- });
|
|
|
- }
|
|
|
-
|
|
|
- provide("reload", reload);
|
|
|
-
|
|
|
- function toggleSideBar() {
|
|
|
- appStore.toggleSideBar();
|
|
|
- }
|
|
|
- const logingName = ref("");
|
|
|
- onMounted(() => {
|
|
|
- logingName.value = Cookies.get("username");
|
|
|
- // console.log('router',router)
|
|
|
- });
|
|
|
-
|
|
|
- function handleCommand(command) {
|
|
|
- switch (command) {
|
|
|
- case "setLayout":
|
|
|
- setLayout();
|
|
|
- break;
|
|
|
- case "logout":
|
|
|
- logout();
|
|
|
- break;
|
|
|
- default:
|
|
|
- break;
|
|
|
- }
|
|
|
- }
|
|
|
-
|
|
|
- function logout() {
|
|
|
- ElMessageBox.confirm("确定注销并退出系统吗？", "提示", {
|
|
|
- confirmButtonText: "确定",
|
|
|
- cancelButtonText: "取消",
|
|
|
- type: "warning",
|
|
|
- })
|
|
|
- .then(() => {
|
|
|
- userStore.logOut().then(() => {
|
|
|
- location.href = "/index";
|
|
|
- });
|
|
|
- })
|
|
|
- .catch(() => {});
|
|
|
- }
|
|
|
-
|
|
|
- // 跳转到全文搜索
|
|
|
- const toSearch = async () => {
|
|
|
- if (!searchText.value) return;
|
|
|
- // console.log('searchText = ',searchText.value);
|
|
|
- const query = {
|
|
|
- keyword: searchText.value,
|
|
|
- isAsc: "asc",
|
|
|
- orderByColumn: "createTime",
|
|
|
- pageSize: 3,
|
|
|
- pageNum: 1,
|
|
|
- };
|
|
|
- const res = await flieSearch(query);
|
|
|
- // console.log("res", res);
|
|
|
- if (res) {
|
|
|
- // console.log("res", res);
|
|
|
- // console.log("router", route.path);
|
|
|
- if (route.path != "/search") {
|
|
|
- router.push({
|
|
|
- path: "/search",
|
|
|
- query: {
|
|
|
- searchData: JSON.stringify(res),
|
|
|
- searchText: searchText.value,
|
|
|
- },
|
|
|
- });
|
|
|
- } else {
|
|
|
- router.replace({
|
|
|
- path: "/allback",
|
|
|
- query: {
|
|
|
- searchData: JSON.stringify(res),
|
|
|
- searchText: searchText.value,
|
|
|
- },
|
|
|
- });
|
|
|
- }
|
|
|
- }
|
|
|
- };
|
|
|
- const emits = defineEmits(["setLayout"]);
|
|
|
-
|
|
|
- function setLayout() {
|
|
|
- emits("setLayout");
|
|
|
+import { nextTick, onMounted, provide, ref } from "vue";
|
|
|
+import { ElMessageBox, ElMessage } from "element-plus";
|
|
|
+import useAppStore from "@/store/modules/app";
|
|
|
+import useUserStore from "@/store/modules/user";
|
|
|
+import useSettingsStore from "@/store/modules/settings";
|
|
|
+import Cookies from "js-cookie";
|
|
|
+import chat from "@/assets/images/chat.png";
|
|
|
+import bechat from "@/assets/images/bechat.png";
|
|
|
+import zuijin from "@/assets/images/zuijin.png";
|
|
|
+import bezuijin from "@/assets/images/bezuijin.png";
|
|
|
+import colloect from "@/assets/images/colloect.png";
|
|
|
+import becolloect from "@/assets/images/becolloect.png";
|
|
|
+import system from "@/assets/images/system.png";
|
|
|
+import issystem from "@/assets/images/issystem.png";
|
|
|
+import my from "@/assets/images/my.png";
|
|
|
+import bemy from "@/assets/images/bemy.png";
|
|
|
+import bumen from "@/assets/images/bumen.png";
|
|
|
+import bebumen from "@/assets/images/bebumen.png";
|
|
|
+import common from "@/assets/images/common.png";
|
|
|
+import becommon from "@/assets/images/becommon.png";
|
|
|
+import chuanshu from "@/assets/images/chuanshu.png";
|
|
|
+import bechuanshu from "@/assets/images/bechuanshu.png";
|
|
|
+import highsearch from "@/assets/images/highsearch.png";
|
|
|
+import behighsearch from "@/assets/images/behighsearch.png";
|
|
|
+import manyBody from "@/assets/images/manyBody.png";
|
|
|
+import manyBodyFalse from "@/assets/images/manyBodyFalse.png";
|
|
|
+import { AppMain, Navbar, Settings, TagsView } from "./components";
|
|
|
+import { flieSearch } from "@/api/search/search.js";
|
|
|
+import { useRouter, useRoute } from "vue-router";
|
|
|
+import useWebsoctStore from "@/store/modules/websocket";
|
|
|
+import { toRaw } from "@vue/reactivity";
|
|
|
+import iFrame from "@/components/iFrame/index.vue";
|
|
|
+const websoctStore = useWebsoctStore();
|
|
|
+const router = useRouter(); //注册路由
|
|
|
+const route = useRoute();
|
|
|
+const appStore = useAppStore();
|
|
|
+const userStore = useUserStore();
|
|
|
+const settingsStore = useSettingsStore();
|
|
|
+const searchText = ref(""); //搜索ipt的值
|
|
|
+const selectValue = ref(1); //文档空间类型
|
|
|
+const wangzhi = import.meta.env.VITE_APP_BASE_API;
|
|
|
+const isAlive = ref(true);
|
|
|
+const toFileData = ref();
|
|
|
+const uid = useUserStore().uid;
|
|
|
+const iFrameData = ref([
|
|
|
+ {
|
|
|
+ id: 1,
|
|
|
+ // src: `${window.location.origin}/fileEdit?clickRowId=113`,
|
|
|
+ show: false,
|
|
|
+ name: "file1",
|
|
|
+ docId:''
|
|
|
+ },
|
|
|
+ {
|
|
|
+ id: 2,
|
|
|
+ src: ``,
|
|
|
+ // src: `http://192.168.1.9:81/fileEdit?clickRowId=1198`,
|
|
|
+ show: false,
|
|
|
+ name: "file2",
|
|
|
+ docId:''
|
|
|
+ },
|
|
|
+ {
|
|
|
+ id: 3,
|
|
|
+ src: ``,
|
|
|
+ show: false,
|
|
|
+ name: "",
|
|
|
+ docId:''
|
|
|
+ },
|
|
|
+ {
|
|
|
+ id: 4,
|
|
|
+ src: ``,
|
|
|
+ show: false,
|
|
|
+ name: "",
|
|
|
+ docId:''
|
|
|
+ },
|
|
|
+ {
|
|
|
+ id: 5,
|
|
|
+ src: ``,
|
|
|
+ show: false,
|
|
|
+ name: "",
|
|
|
+ docId:''
|
|
|
+ },
|
|
|
+ {
|
|
|
+ id: 6,
|
|
|
+ src: ``,
|
|
|
+ show: false,
|
|
|
+ name: "",
|
|
|
+ docId:''
|
|
|
+ },
|
|
|
+ {
|
|
|
+ id: 7,
|
|
|
+ src: ``,
|
|
|
+ show: false,
|
|
|
+ name: "",
|
|
|
+ docId:''
|
|
|
+ },
|
|
|
+ {
|
|
|
+ id: 8,
|
|
|
+ src: ``,
|
|
|
+ show: false,
|
|
|
+ name: "",
|
|
|
+ docId:''
|
|
|
+ },
|
|
|
+ {
|
|
|
+ id: 9,
|
|
|
+ src: ``,
|
|
|
+ show: false,
|
|
|
+ name: "",
|
|
|
+ docId:''
|
|
|
+ },
|
|
|
+ {
|
|
|
+ id: 10,
|
|
|
+ src: ``,
|
|
|
+ show: false,
|
|
|
+ name: "",
|
|
|
+ docId:''
|
|
|
+ },
|
|
|
+]);
|
|
|
+//--------tabs-----------------
|
|
|
+let tabIndex = 2;
|
|
|
+const editableTabsValue = ref("/index");
|
|
|
+const editableTabs = ref([]);
|
|
|
+
|
|
|
+// const removeTab = (targetName) => {
|
|
|
+// const tabs = editableTabs.value;
|
|
|
+// let activeName = editableTabsValue.value;
|
|
|
+// if (activeName === targetName) {
|
|
|
+// tabs.forEach((tab, index) => {
|
|
|
+// if (tab.name === targetName) {
|
|
|
+// const nextTab = tabs[index + 1] || tabs[index - 1];
|
|
|
+// if (nextTab) {
|
|
|
+// activeName = nextTab.name;
|
|
|
+// }
|
|
|
+// }
|
|
|
+// });
|
|
|
+// }
|
|
|
+
|
|
|
+// editableTabsValue.value = activeName;
|
|
|
+// editableTabs.value = tabs.filter((tab) => tab.name !== targetName);
|
|
|
+// };
|
|
|
+//-------------------------
|
|
|
+
|
|
|
+function reload() {
|
|
|
+ isAlive.value = false;
|
|
|
+ console.log(11);
|
|
|
+ nextTick(() => {
|
|
|
+ isAlive.value = true;
|
|
|
+ });
|
|
|
+}
|
|
|
+
|
|
|
+provide("reload", reload);
|
|
|
+
|
|
|
+function toggleSideBar() {
|
|
|
+ appStore.toggleSideBar();
|
|
|
+}
|
|
|
+const logingName = ref("");
|
|
|
+onMounted(() => {
|
|
|
+ logingName.value = Cookies.get("username");
|
|
|
+ // console.log('router',router)
|
|
|
+});
|
|
|
+
|
|
|
+function handleCommand(command) {
|
|
|
+ switch (command) {
|
|
|
+ case "setLayout":
|
|
|
+ setLayout();
|
|
|
+ break;
|
|
|
+ case "logout":
|
|
|
+ logout();
|
|
|
+ break;
|
|
|
+ default:
|
|
|
+ break;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+function logout() {
|
|
|
+ ElMessageBox.confirm("确定注销并退出系统吗？", "提示", {
|
|
|
+ confirmButtonText: "确定",
|
|
|
+ cancelButtonText: "取消",
|
|
|
+ type: "warning",
|
|
|
+ })
|
|
|
+ .then(() => {
|
|
|
+ userStore.logOut().then(() => {
|
|
|
+ location.href = "/index";
|
|
|
+ });
|
|
|
+ })
|
|
|
+ .catch(() => {});
|
|
|
+}
|
|
|
+
|
|
|
+// 跳转到全文搜索
|
|
|
+const toSearch = async () => {
|
|
|
+ if (!searchText.value) return;
|
|
|
+ // console.log('searchText = ',searchText.value);
|
|
|
+ const query = {
|
|
|
+ keyword: searchText.value,
|
|
|
+ isAsc: "asc",
|
|
|
+ orderByColumn: "createTime",
|
|
|
+ pageSize: 3,
|
|
|
+ pageNum: 1,
|
|
|
+ };
|
|
|
+ const res = await flieSearch(query);
|
|
|
+ // console.log("res", res);
|
|
|
+ if (res) {
|
|
|
+ // console.log("res", res);
|
|
|
+ // console.log("router", route.path);
|
|
|
+ if (route.path != "/search") {
|
|
|
+ router.push({
|
|
|
+ path: "/search",
|
|
|
+ query: {
|
|
|
+ searchData: JSON.stringify(res),
|
|
|
+ searchText: searchText.value,
|
|
|
+ },
|
|
|
+ });
|
|
|
+ } else {
|
|
|
+ router.replace({
|
|
|
+ path: "/allback",
|
|
|
+ query: {
|
|
|
+ searchData: JSON.stringify(res),
|
|
|
+ searchText: searchText.value,
|
|
|
+ },
|
|
|
+ });
|
|
|
+ }
|
|
|
+ }
|
|
|
+};
|
|
|
+const emits = defineEmits(["setLayout"]);
|
|
|
+
|
|
|
+function setLayout() {
|
|
|
+ emits("setLayout");
|
|
|
+}
|
|
|
+const clickId = ref("");
|
|
|
+const menuList = reactive({
|
|
|
+ data: [
|
|
|
+ {
|
|
|
+ label: "会话消息",
|
|
|
+ path: "/index",
|
|
|
+ imgs: chat,
|
|
|
+ beimgs: bechat,
|
|
|
+ },
|
|
|
+ // {
|
|
|
+ // label: "接口",
|
|
|
+ // path: "/swagger",
|
|
|
+ // imgs: chat,
|
|
|
+ // beimgs: bechat,
|
|
|
+ // disabled:true
|
|
|
+ // },
|
|
|
+ {
|
|
|
+ label: "最近文件",
|
|
|
+ path: "/recent",
|
|
|
+ imgs: zuijin,
|
|
|
+ beimgs: bezuijin,
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: "收藏文件",
|
|
|
+ path: "/collect",
|
|
|
+ imgs: colloect,
|
|
|
+ beimgs: becolloect,
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: "我的文件",
|
|
|
+ path: "/myfile",
|
|
|
+ imgs: my,
|
|
|
+ beimgs: bemy,
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: "部门文件",
|
|
|
+ path: "/department",
|
|
|
+ imgs: bumen,
|
|
|
+ beimgs: bebumen,
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: "公共文件",
|
|
|
+ path: "/publicment",
|
|
|
+ imgs: common,
|
|
|
+ beimgs: becommon,
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: "高级搜索",
|
|
|
+ path: "/highsearch",
|
|
|
+ imgs: highsearch,
|
|
|
+ beimgs: behighsearch,
|
|
|
+ },
|
|
|
+ // {
|
|
|
+ // label: "传输列表",
|
|
|
+ // path: "/transFile",
|
|
|
+ // imgs: chuanshu,
|
|
|
+ // beimgs: bechuanshu,
|
|
|
+ // },
|
|
|
+ // {
|
|
|
+ // label: "系统管理",
|
|
|
+ // path: "/admin",
|
|
|
+ // imgs: system,
|
|
|
+ // beimgs: issystem,
|
|
|
+ // },
|
|
|
+ {
|
|
|
+ label: "我的协作",
|
|
|
+ path: "/myjoin",
|
|
|
+ imgs: manyBody,
|
|
|
+ beimgs: manyBodyFalse,
|
|
|
+ },
|
|
|
+ ],
|
|
|
+});
|
|
|
+const clickPath = (index, items) => {
|
|
|
+ items = toRaw(items);
|
|
|
+ // toFileData.value = null
|
|
|
+ console.log("clickPathitems", items);
|
|
|
+ // editableTabs.value = arr;
|
|
|
+ const arr = toRaw(editableTabs.value);
|
|
|
+ if (!arr.some((item) => item.label == items.label)) {
|
|
|
+ editableTabs.value.push({
|
|
|
+ label: items.label,
|
|
|
+ path: items.path,
|
|
|
+ });
|
|
|
+ //需要jSON去转 否则页面无变化 离谱得很
|
|
|
+ editableTabs.value = JSON.parse(JSON.stringify(editableTabs.value));
|
|
|
+ } else {
|
|
|
+ toFileData.value = null;
|
|
|
+ clickTab(items.path);
|
|
|
+ }
|
|
|
+ editableTabsValue.value = items.path;
|
|
|
+ // console.log("editableTabs", editableTabs.value);
|
|
|
+};
|
|
|
+const clickTab = (item) => {
|
|
|
+ console.log("item", toRaw(item));
|
|
|
+ setTimeout(() => {
|
|
|
+ console.log("toFileData.value", toFileData.value);
|
|
|
+ if (toFileData.value) {
|
|
|
+ console.log(
|
|
|
+ "tofolder",
|
|
|
+ JSON.stringify(toRaw(toFileData.value.clickRowId))
|
|
|
+ );
|
|
|
+ router.push({
|
|
|
+ path: toFileData.value.path,
|
|
|
+ query: {
|
|
|
+ // row: JSON.stringify(toRaw(toFileData.value.clickRowId)),
|
|
|
+ },
|
|
|
+ });
|
|
|
+ // router.push({
|
|
|
+ // path: toFileData.value.path,
|
|
|
+ // query: {
|
|
|
+ // row: toFileData.value.row,
|
|
|
+ // },
|
|
|
+ // });
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ let regExp = new RegExp(/^\//);
|
|
|
+ let regFile = new RegExp(/^tofile/);
|
|
|
+ if (!regExp.test(toRaw(item))) {
|
|
|
+ const data = JSON.parse(toRaw(item));
|
|
|
+ console.log("data", data);
|
|
|
+ router.push({
|
|
|
+ // path: "/fileEdit" + data.docId,
|
|
|
+ path: "/fileEdit",
|
|
|
+ query: {
|
|
|
+ clickRowId: data.docId,
|
|
|
+ // row:JSON.stringify(toFileData.value)
|
|
|
+ // copyRow: JSON.stringify(data),
|
|
|
+ },
|
|
|
+ });
|
|
|
+ } else {
|
|
|
+ router.push({
|
|
|
+ path: item,
|
|
|
+ });
|
|
|
+ }
|
|
|
+ }, 0);
|
|
|
+};
|
|
|
+const paneClick = (item) => {
|
|
|
+ // 可以拿到当前的标签对象
|
|
|
+ isAlive.value = true;
|
|
|
+ console.log("paneItem", item);
|
|
|
+ if (item.clickRowId) {
|
|
|
+ // 判断是菜单还是目录
|
|
|
+ toFileData.value = item;
|
|
|
+ } else {
|
|
|
+ toFileData.value = null;
|
|
|
+ }
|
|
|
+ clickTab(item.path);
|
|
|
+ // console.log("isAlive", isAlive.value);
|
|
|
+};
|
|
|
+// 点击文件标签
|
|
|
+const filePaneClick = (item) => {
|
|
|
+ console.log("filePaneClickitem", item);
|
|
|
+ const row = toRaw(item);
|
|
|
+ const arr = iFrameData.value.map((par) => {
|
|
|
+ if (par.id === row.id) {
|
|
|
+ par.show = true;
|
|
|
+ // document.getElementById('iframe'+par.id).window.document.iframe[0]
|
|
|
+ const outIframe = document.getElementById("iframe" + par.id);
|
|
|
+ const inIframe =
|
|
|
+ outIframe.contentDocument.getElementsByTagName("iframe")[0];
|
|
|
+ setTimeout(() => {
|
|
|
+ console.error(outIframe.parentElement);
|
|
|
+ inIframe.style.height = outIframe.style.height =
|
|
|
+ outIframe.parentElement.offsetHeight + "px";
|
|
|
+ inIframe.style.width = outIframe.style.width =
|
|
|
+ outIframe.parentElement.offsetWidth + "px";
|
|
|
+
|
|
|
+ // console.log('dom',outIframe.parentElement.offsetWidth);
|
|
|
+ // console.log('inIframe',inIframe);
|
|
|
+ }, 500);
|
|
|
+ } else {
|
|
|
+ par.show = false;
|
|
|
+ }
|
|
|
+ return toRaw(par);
|
|
|
+ });
|
|
|
+ iFrameData.value = arr;
|
|
|
+ // console.log("Clicknewfilearr", iFrameData.value);
|
|
|
+ isAlive.value = false;
|
|
|
+ // console.log("isAlive", isAlive.value);
|
|
|
+};
|
|
|
+// 创建文件的标签
|
|
|
+const addFileTab = (data) => {
|
|
|
+ console.log("fileTabdata", data);
|
|
|
+ const thisData = toRaw(data);
|
|
|
+ const oldIFrameData = iFrameData.value;
|
|
|
+ const canAdd = oldIFrameData.some((par) => par.src == ""); //是否达到上限
|
|
|
+ if (!canAdd) return ElMessage.error("已到最大数量，请先关闭其他文件！");
|
|
|
+ const hasThis = oldIFrameData.some((par) => par.docId == data.docId);//是否已存在
|
|
|
+ if (hasThis) return
|
|
|
+ const arr = oldIFrameData.map((par) => {
|
|
|
+ if (!par.src) {
|
|
|
+ if (thisData.docId) {
|
|
|
+ par.src = `${window.location.origin}/fileEdit?clickRowId=${thisData.docId}`;
|
|
|
+ par.name = data.fileName;
|
|
|
+ par.docId = data.docId
|
|
|
+ par.show = true
|
|
|
+ thisData.docId = "";
|
|
|
+ }
|
|
|
+ }else{
|
|
|
+ par.show = false
|
|
|
}
|
|
|
- const clickId = ref("");
|
|
|
- const menuList = reactive({
|
|
|
- data: [{
|
|
|
- label: "会话消息",
|
|
|
- path: "/index",
|
|
|
- imgs: chat,
|
|
|
- beimgs: bechat,
|
|
|
- },
|
|
|
- // {
|
|
|
- // label: "接口",
|
|
|
- // path: "/swagger",
|
|
|
- // imgs: chat,
|
|
|
- // beimgs: bechat,
|
|
|
- // disabled:true
|
|
|
- // },
|
|
|
- {
|
|
|
- label: "最近文件",
|
|
|
- path: "/recent",
|
|
|
- imgs: zuijin,
|
|
|
- beimgs: bezuijin,
|
|
|
- },
|
|
|
- {
|
|
|
- label: "收藏文件",
|
|
|
- path: "/collect",
|
|
|
- imgs: colloect,
|
|
|
- beimgs: becolloect,
|
|
|
- },
|
|
|
- {
|
|
|
- label: "我的文件",
|
|
|
- path: "/myfile",
|
|
|
- imgs: my,
|
|
|
- beimgs: bemy,
|
|
|
- },
|
|
|
- {
|
|
|
- label: "部门文件",
|
|
|
- path: "/department",
|
|
|
- imgs: bumen,
|
|
|
- beimgs: bebumen,
|
|
|
- },
|
|
|
- {
|
|
|
- label: "公共文件",
|
|
|
- path: "/publicment",
|
|
|
- imgs: common,
|
|
|
- beimgs: becommon,
|
|
|
- },
|
|
|
- {
|
|
|
- label: "高级搜索",
|
|
|
- path: "/highsearch",
|
|
|
- imgs: highsearch,
|
|
|
- beimgs: behighsearch,
|
|
|
- },
|
|
|
- {
|
|
|
- label: "传输列表",
|
|
|
- path: "/transFile",
|
|
|
- imgs: chuanshu,
|
|
|
- beimgs: bechuanshu,
|
|
|
- },
|
|
|
- {
|
|
|
- label: "系统管理",
|
|
|
- path: "/admin",
|
|
|
- imgs: system,
|
|
|
- beimgs: issystem,
|
|
|
- },
|
|
|
- {
|
|
|
- label: "我的协作",
|
|
|
- path: "/myjoin",
|
|
|
- imgs: manyBody,
|
|
|
- beimgs: manyBodyFalse,
|
|
|
- },
|
|
|
- ],
|
|
|
- });
|
|
|
- const clickPath = (index, items) => {
|
|
|
- items = toRaw(items);
|
|
|
- // toFileData.value = null
|
|
|
- console.log("clickPathitems", items);
|
|
|
- // editableTabs.value = arr;
|
|
|
- const arr = toRaw(editableTabs.value);
|
|
|
- if (!arr.some((item) => item.label == items.label)) {
|
|
|
- editableTabs.value.push({
|
|
|
- label: items.label,
|
|
|
- path: items.path
|
|
|
- });
|
|
|
- //需要jSON去转 否则页面无变化 离谱得很
|
|
|
- editableTabs.value = JSON.parse(JSON.stringify(editableTabs.value));
|
|
|
- } else {
|
|
|
- toFileData.value = null;
|
|
|
- clickTab(items.path);
|
|
|
- }
|
|
|
- editableTabsValue.value = items.path;
|
|
|
- // console.log("editableTabs", editableTabs.value);
|
|
|
- };
|
|
|
- const clickTab = (item) => {
|
|
|
- console.log("item", toRaw(item));
|
|
|
- setTimeout(() => {
|
|
|
- console.log("toFileData.value", toFileData.value);
|
|
|
- if (toFileData.value) {
|
|
|
- console.log(
|
|
|
- "tofolder",
|
|
|
- JSON.stringify(toRaw(toFileData.value.clickRowId))
|
|
|
- );
|
|
|
- router.push({
|
|
|
- path: toFileData.value.path,
|
|
|
- query: {
|
|
|
- row: JSON.stringify(toRaw(toFileData.value.clickRowId)),
|
|
|
- },
|
|
|
- });
|
|
|
- // router.push({
|
|
|
- // path: toFileData.value.path,
|
|
|
- // query: {
|
|
|
- // row: toFileData.value.row,
|
|
|
- // },
|
|
|
- // });
|
|
|
- return;
|
|
|
- }
|
|
|
- let regExp = new RegExp(/^\//);
|
|
|
- let regFile = new RegExp(/^tofile/);
|
|
|
- if (!regExp.test(toRaw(item))) {
|
|
|
- const data = JSON.parse(toRaw(item));
|
|
|
- console.log("data", data);
|
|
|
- router.push({
|
|
|
- // path: "/fileEdit" + data.docId,
|
|
|
- path: "/fileEdit",
|
|
|
- query: {
|
|
|
- clickRowId: data.docId,
|
|
|
- // row:JSON.stringify(toFileData.value)
|
|
|
- // copyRow: JSON.stringify(data),
|
|
|
- },
|
|
|
- });
|
|
|
- } else {
|
|
|
- router.push({
|
|
|
- path: item,
|
|
|
- });
|
|
|
- }
|
|
|
- }, 0);
|
|
|
- };
|
|
|
- const paneClick = (item) => {
|
|
|
- // 可以拿到当前的标签对象
|
|
|
- isAlive.value = true;
|
|
|
- console.log("paneItem", item);
|
|
|
- if (item.clickRowId) {
|
|
|
- // 判断是菜单还是目录
|
|
|
- toFileData.value = item;
|
|
|
- } else {
|
|
|
- toFileData.value = null;
|
|
|
- }
|
|
|
- clickTab(item.path);
|
|
|
- console.log("isAlive", isAlive.value);
|
|
|
- };
|
|
|
- // 点击文件标签
|
|
|
- const filePaneClick = (item) => {
|
|
|
- console.log("filePaneClickitem", item);
|
|
|
- const row = toRaw(item);
|
|
|
- const arr = iFrameData.value.map((par) => {
|
|
|
- if (par.id === row.id) {
|
|
|
- par.show = true;
|
|
|
- // document.getElementById('iframe'+par.id).window.document.iframe[0]
|
|
|
- const outIframe = document.getElementById("iframe" + par.id);
|
|
|
- const inIframe =
|
|
|
- outIframe.contentDocument.getElementsByTagName("iframe")[0];
|
|
|
- setTimeout(() => {
|
|
|
- console.error(outIframe.parentElement);
|
|
|
- inIframe.style.height = outIframe.style.height =
|
|
|
- outIframe.parentElement.offsetHeight + "px";
|
|
|
- inIframe.style.width = outIframe.style.width =
|
|
|
- outIframe.parentElement.offsetWidth + "px";
|
|
|
-
|
|
|
- // console.log('dom',outIframe.parentElement.offsetWidth);
|
|
|
- // console.log('inIframe',inIframe);
|
|
|
- }, 500);
|
|
|
- } else {
|
|
|
- par.show = false;
|
|
|
- }
|
|
|
- return toRaw(par);
|
|
|
- });
|
|
|
- iFrameData.value = arr;
|
|
|
- // console.log("Clicknewfilearr", iFrameData.value);
|
|
|
- isAlive.value = false;
|
|
|
- // console.log("isAlive", isAlive.value);
|
|
|
- };
|
|
|
- // 创建文件的标签
|
|
|
- const addFileTab = (data) => {
|
|
|
- console.log("fileTabdata", data);
|
|
|
- const thisData = toRaw(data);
|
|
|
- const oldIFrameData = iFrameData.value;
|
|
|
- const canAdd = oldIFrameData.some((par) => par.src == "");
|
|
|
- if (!canAdd) return ElMessage.error("已到最大数量，请先关闭其他文件！");
|
|
|
- const arr = oldIFrameData.map((par) => {
|
|
|
- if (!par.src) {
|
|
|
- if (thisData.docId) {
|
|
|
- par.src = `${window.location.origin}/fileEdit?clickRowId=${thisData.docId}`;
|
|
|
- par.name = data.fileName;
|
|
|
- thisData.docId = "";
|
|
|
- }
|
|
|
- }
|
|
|
- return toRaw(par);
|
|
|
- });
|
|
|
- iFrameData.value = arr;
|
|
|
- console.log("addFileTab", arr);
|
|
|
- };
|
|
|
- //创建tab标签事件
|
|
|
- const addTab = (data) => {
|
|
|
- console.log("addTab", data);
|
|
|
- const arr = toRaw(editableTabs.value);
|
|
|
- if (!arr.some((item) => item.label == data.fileName)) {
|
|
|
- // editableTabs.value.push({
|
|
|
- // label: data.fileName,
|
|
|
- // path: JSON.stringify(data),
|
|
|
- // });
|
|
|
- editableTabs.value.push({
|
|
|
- label: data.fileName,
|
|
|
- path: JSON.stringify(data),
|
|
|
- });
|
|
|
- //需要jSON去转 否则页面无变化 离谱得很
|
|
|
- editableTabs.value = JSON.parse(JSON.stringify(editableTabs.value));
|
|
|
- // editableTabsValue.value = data.path;
|
|
|
- }
|
|
|
- };
|
|
|
- const addFolderAdd = (data) => {
|
|
|
- console.log("data", data);
|
|
|
- const arr = toRaw(editableTabs.value);
|
|
|
- if (!arr.some((item) => item.label == data.row.dirName)) {
|
|
|
- editableTabs.value.push({
|
|
|
- label: data.name,
|
|
|
- path: data.path,
|
|
|
- clickRowId: data.row,
|
|
|
- });
|
|
|
- //需要jSON去转 否则页面无变化 离谱得很
|
|
|
- editableTabs.value = JSON.parse(JSON.stringify(editableTabs.value));
|
|
|
- }
|
|
|
- console.log("editableTabs", toRaw(editableTabs.value));
|
|
|
- };
|
|
|
- provide("addTab", addTab);
|
|
|
- provide("addFolderAdd", addFolderAdd);
|
|
|
- provide("addFileTab", addFileTab);
|
|
|
- // TODO 删除tab事件
|
|
|
- const closeTab = (item, index, e) => {
|
|
|
- e.preventDefault();
|
|
|
- e.stopPropagation();
|
|
|
- editableTabs.value.splice(index, 1);
|
|
|
- editableTabs.value = JSON.parse(JSON.stringify(editableTabs.value));
|
|
|
- const nextTab =
|
|
|
- editableTabs.value[index + 1] || editableTabs.value[index - 1];
|
|
|
- clickTab(nextTab.path);
|
|
|
- // console.log("item", item);
|
|
|
- // console.log("index", index);
|
|
|
- // console.log("e", e);
|
|
|
- };
|
|
|
- // TODO 删除tab事件
|
|
|
- const closeFileTab = (item, index, e) => {
|
|
|
- e.preventDefault();
|
|
|
- e.stopPropagation();
|
|
|
- const data = toRaw(item);
|
|
|
- console.log("closeFileTab", data);
|
|
|
- const arr = iFrameData.value.map((par) => {
|
|
|
- if (par.id === data.id) {
|
|
|
- par.src = "";
|
|
|
- par.show = false;
|
|
|
- par.name = "";
|
|
|
- }
|
|
|
- return toRaw(par);
|
|
|
- });
|
|
|
- iFrameData.value = arr;
|
|
|
- // console.log("index", index);
|
|
|
- // console.log("e", e);
|
|
|
- };
|
|
|
+ return toRaw(par);
|
|
|
+ });
|
|
|
+ iFrameData.value = arr;
|
|
|
+ isAlive.value = false;
|
|
|
+ console.log("addFileTab", arr);
|
|
|
+};
|
|
|
+//创建tab标签事件
|
|
|
+const addTab = (data) => {
|
|
|
+ console.log("addTab", data);
|
|
|
+ const arr = toRaw(editableTabs.value);
|
|
|
+ if (!arr.some((item) => item.label == data.fileName)) {
|
|
|
+ // editableTabs.value.push({
|
|
|
+ // label: data.fileName,
|
|
|
+ // path: JSON.stringify(data),
|
|
|
+ // });
|
|
|
+ editableTabs.value.push({
|
|
|
+ label: data.fileName,
|
|
|
+ path: JSON.stringify(data),
|
|
|
+ });
|
|
|
+ //需要jSON去转 否则页面无变化 离谱得很
|
|
|
+ editableTabs.value = JSON.parse(JSON.stringify(editableTabs.value));
|
|
|
+ // editableTabsValue.value = data.path;
|
|
|
+ }
|
|
|
+};
|
|
|
+const addFolderAdd = (data) => {
|
|
|
+ console.log("data", data);
|
|
|
+ const arr = toRaw(editableTabs.value);
|
|
|
+ if (!arr.some((item) => item.label == data.row.dirName)) {
|
|
|
+ editableTabs.value.push({
|
|
|
+ label: data.name,
|
|
|
+ path: data.path,
|
|
|
+ clickRowId: data.row,
|
|
|
+ });
|
|
|
+ //需要jSON去转 否则页面无变化 离谱得很
|
|
|
+ editableTabs.value = JSON.parse(JSON.stringify(editableTabs.value));
|
|
|
+ }
|
|
|
+ console.log("editableTabs", toRaw(editableTabs.value));
|
|
|
+};
|
|
|
+provide("addTab", addTab);
|
|
|
+provide("addFolderAdd", addFolderAdd);
|
|
|
+provide("addFileTab", addFileTab);
|
|
|
+// TODO 删除tab事件
|
|
|
+const closeTab = (item, index, e) => {
|
|
|
+ e.preventDefault();
|
|
|
+ e.stopPropagation();
|
|
|
+ editableTabs.value.splice(index, 1);
|
|
|
+ editableTabs.value = JSON.parse(JSON.stringify(editableTabs.value));
|
|
|
+ const nextTab =
|
|
|
+ editableTabs.value[index + 1] || editableTabs.value[index - 1];
|
|
|
+ clickTab(nextTab.path);
|
|
|
+ // console.log("item", item);
|
|
|
+ // console.log("index", index);
|
|
|
+ // console.log("e", e);
|
|
|
+};
|
|
|
+// TODO 删除tab事件
|
|
|
+const closeFileTab = (item, index, e) => {
|
|
|
+ e.preventDefault();
|
|
|
+ e.stopPropagation();
|
|
|
+ const data = toRaw(item);
|
|
|
+ console.log("closeFileTab", data);
|
|
|
+ const arr = iFrameData.value.map((par) => {
|
|
|
+ if (par.id === data.id) {
|
|
|
+ par.src = "";
|
|
|
+ par.show = false;
|
|
|
+ par.name = "";
|
|
|
+ }
|
|
|
+ return toRaw(par);
|
|
|
+ });
|
|
|
+ iFrameData.value = arr;
|
|
|
+ // console.log("index", index);
|
|
|
+ // console.log("e", e);
|
|
|
+};
|
|
|
</script>
|
|
|
|
|
|
<style lang="scss" scoped>
|
|
|
- @import "@/assets/styles/mixin.scss";
|
|
|
- @import "@/assets/styles/variables.module.scss";
|
|
|
-
|
|
|
- //整体布局css
|
|
|
- .common-layout,
|
|
|
- .el-container {
|
|
|
- height: 94vh;
|
|
|
- }
|
|
|
-
|
|
|
- :deep .el-main {
|
|
|
- --el-main-padding: 8px !important;
|
|
|
- }
|
|
|
-
|
|
|
- .nav {
|
|
|
- background: #06286c;
|
|
|
- height: 48px;
|
|
|
-
|
|
|
- .nav-top {
|
|
|
- width: 98%;
|
|
|
- display: flex;
|
|
|
- justify-content: space-between;
|
|
|
-
|
|
|
- &>div:first-child {
|
|
|
- font-family: "Inter-SemiBold";
|
|
|
- }
|
|
|
-
|
|
|
- &>div:first-child,
|
|
|
- &>div:last-child {
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
- color: #fff;
|
|
|
-
|
|
|
- &>img {
|
|
|
- width: 48px;
|
|
|
- height: 48px;
|
|
|
- }
|
|
|
- }
|
|
|
-
|
|
|
- .logoImg {
|
|
|
- width: 150px !important;
|
|
|
- height: 100%;
|
|
|
- margin-right: 10px;
|
|
|
- }
|
|
|
- }
|
|
|
-
|
|
|
- .head-img {
|
|
|
- border-radius: 12px;
|
|
|
- width: 24px;
|
|
|
- height: 24px;
|
|
|
- margin-right: 10px;
|
|
|
- }
|
|
|
-
|
|
|
- .avatar-wrapper {
|
|
|
- color: #fff;
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
- }
|
|
|
-
|
|
|
- .search {
|
|
|
-
|
|
|
- .w-50,
|
|
|
- :deep .el-input {
|
|
|
- width: 400px;
|
|
|
- height: 32px;
|
|
|
- border-radius: 4px;
|
|
|
- margin-top: 8px;
|
|
|
- background: #6f85b5 !important;
|
|
|
- --el-input-border-color: #6f85b5;
|
|
|
- }
|
|
|
-
|
|
|
- ::v-deep .el-input__inner {
|
|
|
- color: #fff !important;
|
|
|
- }
|
|
|
- }
|
|
|
-
|
|
|
- :deep .el-input__wrapper {
|
|
|
- background: #1f3f7e !important;
|
|
|
- }
|
|
|
- }
|
|
|
-
|
|
|
- .asides {
|
|
|
- padding: 8px 10px !important;
|
|
|
- font-size: 14px;
|
|
|
- color: #000;
|
|
|
- background: #fff;
|
|
|
- }
|
|
|
-
|
|
|
- .main {
|
|
|
- background: #c7cbd8;
|
|
|
- }
|
|
|
-
|
|
|
- // tabs标签
|
|
|
- .tab_box {
|
|
|
- width: 100%;
|
|
|
- height: 32px;
|
|
|
- border-radius: 4px 4px 4px 4px;
|
|
|
- background-color: #fff;
|
|
|
- margin-bottom: 8px;
|
|
|
-
|
|
|
- .common-tabs {
|
|
|
- height: 32px;
|
|
|
- // display: flex;
|
|
|
- // align-items: center;
|
|
|
- }
|
|
|
-
|
|
|
- .tab_pane {
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
- justify-content: space-between;
|
|
|
-
|
|
|
- img {
|
|
|
- margin-left: 8px;
|
|
|
- width: 10px;
|
|
|
- height: 10px;
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
-
|
|
|
- :deep(.common-tabs .el-tabs__item) {
|
|
|
- height: 24px !important;
|
|
|
- padding: 0px 8px !important;
|
|
|
- margin-top: 4px !important;
|
|
|
- margin-left: 4px !important;
|
|
|
- border: 1px solid #c1cce3 !important;
|
|
|
- color: #505870 !important;
|
|
|
- font-size: 12px !important;
|
|
|
- line-height: 24px;
|
|
|
- font-weight: 400 !important;
|
|
|
- }
|
|
|
-
|
|
|
- // tag选中颜色
|
|
|
- :deep(.common-tabs .el-tabs__item.is-active) {
|
|
|
- color: #fff !important;
|
|
|
- font-weight: normal;
|
|
|
- background-color: #6f85b5;
|
|
|
- }
|
|
|
-
|
|
|
- //侧边栏css
|
|
|
- .acitve-img-style {
|
|
|
- background-color: #f5f7f9;
|
|
|
- border-radius: 4px;
|
|
|
- }
|
|
|
-
|
|
|
- .img-style {
|
|
|
- width: 72px;
|
|
|
- height: 72px;
|
|
|
- display: flex;
|
|
|
- margin-bottom: 8px;
|
|
|
- flex-direction: column;
|
|
|
- align-items: center;
|
|
|
- justify-content: center;
|
|
|
-
|
|
|
- &>img {
|
|
|
- width: 40px;
|
|
|
- height: 40px;
|
|
|
- }
|
|
|
- }
|
|
|
-
|
|
|
- .text-style {
|
|
|
- text-align: center;
|
|
|
- color: #000;
|
|
|
- }
|
|
|
+@import "@/assets/styles/mixin.scss";
|
|
|
+@import "@/assets/styles/variables.module.scss";
|
|
|
+
|
|
|
+//整体布局css
|
|
|
+.common-layout,
|
|
|
+.el-container {
|
|
|
+ height: 94vh;
|
|
|
+}
|
|
|
+
|
|
|
+:deep .el-main {
|
|
|
+ --el-main-padding: 8px !important;
|
|
|
+}
|
|
|
+
|
|
|
+.nav {
|
|
|
+ background: #06286c;
|
|
|
+ height: 48px;
|
|
|
+
|
|
|
+ .nav-top {
|
|
|
+ width: 98%;
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-between;
|
|
|
+
|
|
|
+ & > div:first-child {
|
|
|
+ font-family: "Inter-SemiBold";
|
|
|
+ }
|
|
|
+
|
|
|
+ & > div:first-child,
|
|
|
+ & > div:last-child {
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ color: #fff;
|
|
|
+
|
|
|
+ & > img {
|
|
|
+ width: 48px;
|
|
|
+ height: 48px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .logoImg {
|
|
|
+ width: 150px !important;
|
|
|
+ height: 100%;
|
|
|
+ margin-right: 10px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .head-img {
|
|
|
+ border-radius: 12px;
|
|
|
+ width: 24px;
|
|
|
+ height: 24px;
|
|
|
+ margin-right: 10px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .avatar-wrapper {
|
|
|
+ color: #fff;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ }
|
|
|
+
|
|
|
+ .search {
|
|
|
+ .w-50,
|
|
|
+ :deep .el-input {
|
|
|
+ width: 400px;
|
|
|
+ height: 32px;
|
|
|
+ border-radius: 4px;
|
|
|
+ margin-top: 8px;
|
|
|
+ background: #6f85b5 !important;
|
|
|
+ --el-input-border-color: #6f85b5;
|
|
|
+ }
|
|
|
+
|
|
|
+ ::v-deep .el-input__inner {
|
|
|
+ color: #fff !important;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ :deep .el-input__wrapper {
|
|
|
+ background: #1f3f7e !important;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+.asides {
|
|
|
+ padding: 8px 10px !important;
|
|
|
+ font-size: 14px;
|
|
|
+ color: #000;
|
|
|
+ background: #fff;
|
|
|
+}
|
|
|
+
|
|
|
+.main {
|
|
|
+ background: #c7cbd8;
|
|
|
+}
|
|
|
+
|
|
|
+// tabs标签
|
|
|
+.tab_box {
|
|
|
+ width: 100%;
|
|
|
+ height: 32px;
|
|
|
+ border-radius: 4px 4px 4px 4px;
|
|
|
+ background-color: #fff;
|
|
|
+ margin-bottom: 8px;
|
|
|
+
|
|
|
+ .common-tabs {
|
|
|
+ height: 32px;
|
|
|
+ // display: flex;
|
|
|
+ // align-items: center;
|
|
|
+ }
|
|
|
+
|
|
|
+ .tab_pane {
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: space-between;
|
|
|
+
|
|
|
+ img {
|
|
|
+ margin-left: 8px;
|
|
|
+ width: 10px;
|
|
|
+ height: 10px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+:deep(.common-tabs .el-tabs__item) {
|
|
|
+ height: 24px !important;
|
|
|
+ padding: 0px 8px !important;
|
|
|
+ margin-top: 4px !important;
|
|
|
+ margin-left: 4px !important;
|
|
|
+ border: 1px solid #c1cce3 !important;
|
|
|
+ color: #505870 !important;
|
|
|
+ font-size: 12px !important;
|
|
|
+ line-height: 24px;
|
|
|
+ font-weight: 400 !important;
|
|
|
+}
|
|
|
+
|
|
|
+// tag选中颜色
|
|
|
+:deep(.common-tabs .el-tabs__item.is-active) {
|
|
|
+ color: #fff !important;
|
|
|
+ font-weight: normal;
|
|
|
+ background-color: #6f85b5;
|
|
|
+}
|
|
|
+
|
|
|
+//侧边栏css
|
|
|
+.acitve-img-style {
|
|
|
+ background-color: #f5f7f9;
|
|
|
+ border-radius: 4px;
|
|
|
+}
|
|
|
+
|
|
|
+.img-style {
|
|
|
+ width: 72px;
|
|
|
+ height: 72px;
|
|
|
+ display: flex;
|
|
|
+ margin-bottom: 8px;
|
|
|
+ flex-direction: column;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: center;
|
|
|
+
|
|
|
+ & > img {
|
|
|
+ width: 40px;
|
|
|
+ height: 40px;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+.text-style {
|
|
|
+ text-align: center;
|
|
|
+ color: #000;
|
|
|
+}
|
|
|
</style>
|
|
|
<style lang="scss" scoped>
|
|
|
- .el-popper.is-light.type_popper {
|
|
|
- background-color: #1f3f7e !important;
|
|
|
- border-radius: 4px 4px 4px 4px !important;
|
|
|
- border: none !important;
|
|
|
- // padding: 0 16px !important;
|
|
|
- // box-sizing: border-box !important;
|
|
|
- }
|
|
|
-
|
|
|
- .el-popper__arrow::before {
|
|
|
- content: none;
|
|
|
- }
|
|
|
-
|
|
|
- //鼠标移动上去的选中色
|
|
|
- .type_popper {
|
|
|
-
|
|
|
- .el-select-dropdown__item.hover,
|
|
|
- .el-select-dropdown__item:hover {
|
|
|
- background: #6f85b5 !important;
|
|
|
- }
|
|
|
-
|
|
|
- //下拉框的文本颜色
|
|
|
- .el-select-dropdown__item {
|
|
|
- color: #a4b0d8 !important;
|
|
|
- }
|
|
|
-
|
|
|
- //选中之后的颜色
|
|
|
- .el-select-dropdown__item.selected {
|
|
|
- background: #6f85b5 !important;
|
|
|
- color: #fff !important;
|
|
|
- }
|
|
|
- }
|
|
|
-
|
|
|
- .yuandian {
|
|
|
- width: 8px;
|
|
|
- height: 8px;
|
|
|
- position: absolute;
|
|
|
- right: 8px;
|
|
|
- top: 6px;
|
|
|
- background: #fa5151;
|
|
|
- border-radius: 4px;
|
|
|
- }
|
|
|
-
|
|
|
- ::v-deep .qualityManual-container-office {
|
|
|
- width: 1000px !important;
|
|
|
- height: 1000px !important;
|
|
|
-
|
|
|
- iframe {
|
|
|
- width: 1000px !important;
|
|
|
- height: 1000px !important;
|
|
|
- }
|
|
|
- }
|
|
|
+.el-popper.is-light.type_popper {
|
|
|
+ background-color: #1f3f7e !important;
|
|
|
+ border-radius: 4px 4px 4px 4px !important;
|
|
|
+ border: none !important;
|
|
|
+ // padding: 0 16px !important;
|
|
|
+ // box-sizing: border-box !important;
|
|
|
+}
|
|
|
+
|
|
|
+.el-popper__arrow::before {
|
|
|
+ content: none;
|
|
|
+}
|
|
|
+
|
|
|
+//鼠标移动上去的选中色
|
|
|
+.type_popper {
|
|
|
+ .el-select-dropdown__item.hover,
|
|
|
+ .el-select-dropdown__item:hover {
|
|
|
+ background: #6f85b5 !important;
|
|
|
+ }
|
|
|
+
|
|
|
+ //下拉框的文本颜色
|
|
|
+ .el-select-dropdown__item {
|
|
|
+ color: #a4b0d8 !important;
|
|
|
+ }
|
|
|
+
|
|
|
+ //选中之后的颜色
|
|
|
+ .el-select-dropdown__item.selected {
|
|
|
+ background: #6f85b5 !important;
|
|
|
+ color: #fff !important;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+.yuandian {
|
|
|
+ width: 8px;
|
|
|
+ height: 8px;
|
|
|
+ position: absolute;
|
|
|
+ right: 8px;
|
|
|
+ top: 6px;
|
|
|
+ background: #fa5151;
|
|
|
+ border-radius: 4px;
|
|
|
+}
|
|
|
+
|
|
|
+::v-deep .qualityManual-container-office {
|
|
|
+ width: 1000px !important;
|
|
|
+ height: 1000px !important;
|
|
|
+
|
|
|
+ iframe {
|
|
|
+ width: 1000px !important;
|
|
|
+ height: 1000px !important;
|
|
|
+ }
|
|
|
+}
|
|
|
</style>
|
