优化前端复制模块.

This commit is contained in:
lijiahangmax
2024-03-17 21:25:38 +08:00
parent 2819df9c31
commit 127f4df302
16 changed files with 62 additions and 77 deletions

View File

@@ -92,7 +92,7 @@
import { usePagination } from '@/types/table'; import { usePagination } from '@/types/table';
import useVisible from '@/hooks/visible'; import useVisible from '@/hooks/visible';
import useLoading from '@/hooks/loading'; import useLoading from '@/hooks/loading';
import useCopy from '@/hooks/copy'; import { copy } from '@/hooks/copy';
import columns from './table.columns'; import columns from './table.columns';
import { getExecTemplatePage } from '@/api/exec/exec-template'; import { getExecTemplatePage } from '@/api/exec/exec-template';
@@ -100,7 +100,6 @@
const { visible, setVisible } = useVisible(); const { visible, setVisible } = useVisible();
const { loading, setLoading } = useLoading(); const { loading, setLoading } = useLoading();
const { copy } = useCopy();
const pagination = usePagination(); const pagination = usePagination();
const tableRenderData = ref<ExecTemplateQueryResponse[]>([]); const tableRenderData = ref<ExecTemplateQueryResponse[]>([]);

View File

@@ -38,14 +38,18 @@
:bordered="false"> :bordered="false">
<!-- 修改前 --> <!-- 修改前 -->
<template #beforeValue="{ record }"> <template #beforeValue="{ record }">
<span class="copy-left" title="复制" @click="copy(record.beforeValue)"> <span class="copy-left"
title="复制"
@click="copy(record.beforeValue, '已复制')">
<icon-copy /> <icon-copy />
</span> </span>
<span>{{ record.beforeValue }}</span> <span>{{ record.beforeValue }}</span>
</template> </template>
<!-- 修改后 --> <!-- 修改后 -->
<template #afterValue="{ record }"> <template #afterValue="{ record }">
<span class="copy-left" title="复制" @click="copy(record.afterValue)"> <span class="copy-left"
title="复制"
@click="copy(record.afterValue, '已复制')">
<icon-copy /> <icon-copy />
</span> </span>
<span>{{ record.afterValue }}</span> <span>{{ record.afterValue }}</span>
@@ -82,7 +86,7 @@
import useVisible from '@/hooks/visible'; import useVisible from '@/hooks/visible';
import { getHistoryValuePage } from '@/api/meta/history-value'; import { getHistoryValuePage } from '@/api/meta/history-value';
import { usePagination } from '@/types/table'; import { usePagination } from '@/types/table';
import useCopy from '@/hooks/copy'; import { copy } from '@/hooks/copy';
import columns from './table.columns'; import columns from './table.columns';
import { Message } from '@arco-design/web-vue'; import { Message } from '@arco-design/web-vue';
@@ -92,7 +96,6 @@
}); });
const emits = defineEmits(['updated']); const emits = defineEmits(['updated']);
const { copy } = useCopy();
const pagination = usePagination(); const pagination = usePagination();
const { visible, setVisible } = useVisible(); const { visible, setVisible } = useVisible();
const { loading, setLoading } = useLoading(); const { loading, setLoading } = useLoading();

View File

@@ -99,10 +99,9 @@
import { connectStatusKey, connectTypeKey } from '../types/const'; import { connectStatusKey, connectTypeKey } from '../types/const';
import { useDictStore } from '@/store'; import { useDictStore } from '@/store';
import { dateFormat } from '@/utils'; import { dateFormat } from '@/utils';
import useCopy from '@/hooks/copy'; import { copy } from '@/hooks/copy';
const { getDictValue } = useDictStore(); const { getDictValue } = useDictStore();
const { copy } = useCopy();
const { visible, setVisible } = useVisible(); const { visible, setVisible } = useVisible();
const { loading, setLoading } = useLoading(); const { loading, setLoading } = useLoading();

View File

@@ -194,7 +194,7 @@
import { Message } from '@arco-design/web-vue'; import { Message } from '@arco-design/web-vue';
import columns from '../types/table.columns'; import columns from '../types/table.columns';
import useLoading from '@/hooks/loading'; import useLoading from '@/hooks/loading';
import useCopy from '@/hooks/copy'; import { copy } from '@/hooks/copy';
import UserSelector from '@/components/user/user/selector/index.vue'; import UserSelector from '@/components/user/user/selector/index.vue';
import HostSelector from '@/components/asset/host/selector/index.vue'; import HostSelector from '@/components/asset/host/selector/index.vue';
import ConnectLogClearModal from './connect-log-clear-modal.vue'; import ConnectLogClearModal from './connect-log-clear-modal.vue';
@@ -209,7 +209,6 @@
const rowSelection = useRowSelection(); const rowSelection = useRowSelection();
const { loading, setLoading } = useLoading(); const { loading, setLoading } = useLoading();
const { toOptions, getDictValue } = useDictStore(); const { toOptions, getDictValue } = useDictStore();
const { copy } = useCopy();
const formModel = reactive<HostConnectLogQueryRequest>({ const formModel = reactive<HostConnectLogQueryRequest>({
userId: undefined, userId: undefined,

View File

@@ -179,7 +179,7 @@
import { Message } from '@arco-design/web-vue'; import { Message } from '@arco-design/web-vue';
import columns from '../types/table.columns'; import columns from '../types/table.columns';
import useLoading from '@/hooks/loading'; import useLoading from '@/hooks/loading';
import useCopy from '@/hooks/copy'; import { copy } from '@/hooks/copy';
import { permission10toString } from '@/utils/file'; import { permission10toString } from '@/utils/file';
import UserSelector from '@/components/user/user/selector/index.vue'; import UserSelector from '@/components/user/user/selector/index.vue';
import HostSelector from '@/components/asset/host/selector/index.vue'; import HostSelector from '@/components/asset/host/selector/index.vue';
@@ -191,7 +191,6 @@
const rowSelection = useRowSelection(); const rowSelection = useRowSelection();
const { loading, setLoading } = useLoading(); const { loading, setLoading } = useLoading();
const { toOptions, getDictValue } = useDictStore(); const { toOptions, getDictValue } = useDictStore();
const { copy } = useCopy();
const formModel = reactive<HostSftpLogQueryRequest>({ const formModel = reactive<HostSftpLogQueryRequest>({
userId: undefined, userId: undefined,

View File

@@ -151,15 +151,13 @@
import { deleteHostIdentity, getHostIdentityPage } from '@/api/asset/host-identity'; import { deleteHostIdentity, getHostIdentityPage } from '@/api/asset/host-identity';
import { Message, Modal } from '@arco-design/web-vue'; import { Message, Modal } from '@arco-design/web-vue';
import usePermission from '@/hooks/permission'; import usePermission from '@/hooks/permission';
import useCopy from '@/hooks/copy'; import { copy } from '@/hooks/copy';
import { GrantKey, GrantRouteName } from '@/views/asset/grant/types/const';
import HostKeySelector from '@/components/asset/host-key/selector/index.vue'; import HostKeySelector from '@/components/asset/host-key/selector/index.vue';
const emits = defineEmits(['openAdd', 'openUpdate', 'openKeyView']); const emits = defineEmits(['openAdd', 'openUpdate', 'openKeyView']);
const list = ref<HostIdentityQueryResponse[]>([]); const list = ref<HostIdentityQueryResponse[]>([]);
const { copy } = useCopy();
const cardColLayout = useColLayout(); const cardColLayout = useColLayout();
const pagination = usePagination(); const pagination = usePagination();
const { loading, setLoading } = useLoading(); const { loading, setLoading } = useLoading();

View File

@@ -143,19 +143,17 @@
import { reactive, ref, onMounted } from 'vue'; import { reactive, ref, onMounted } from 'vue';
import { deleteHostIdentity, getHostIdentityPage } from '@/api/asset/host-identity'; import { deleteHostIdentity, getHostIdentityPage } from '@/api/asset/host-identity';
import { Message } from '@arco-design/web-vue'; import { Message } from '@arco-design/web-vue';
import useLoading from '@/hooks/loading';
import columns from '../types/table.columns'; import columns from '../types/table.columns';
import useLoading from '@/hooks/loading';
import usePermission from '@/hooks/permission';
import { copy } from '@/hooks/copy';
import { usePagination } from '@/types/table'; import { usePagination } from '@/types/table';
import HostKeySelector from '@/components/asset/host-key/selector/index.vue'; import HostKeySelector from '@/components/asset/host-key/selector/index.vue';
import useCopy from '@/hooks/copy';
import usePermission from '@/hooks/permission';
import { GrantKey, GrantRouteName } from '@/views/asset/grant/types/const';
const emits = defineEmits(['openAdd', 'openUpdate', 'openKeyView']); const emits = defineEmits(['openAdd', 'openUpdate', 'openKeyView']);
const tableRenderData = ref<HostIdentityQueryResponse[]>([]); const tableRenderData = ref<HostIdentityQueryResponse[]>([]);
const { copy } = useCopy();
const pagination = usePagination(); const pagination = usePagination();
const { loading, setLoading } = useLoading(); const { loading, setLoading } = useLoading();
const { hasAnyPermission } = usePermission(); const { hasAnyPermission } = usePermission();

View File

@@ -177,8 +177,7 @@
import { deleteHost, getHostPage } from '@/api/asset/host'; import { deleteHost, getHostPage } from '@/api/asset/host';
import { Message, Modal } from '@arco-design/web-vue'; import { Message, Modal } from '@arco-design/web-vue';
import { tagColor } from '../types/const'; import { tagColor } from '../types/const';
import useCopy from '@/hooks/copy'; import { copy } from '@/hooks/copy';
import { GrantKey, GrantRouteName } from '@/views/asset/grant/types/const';
import TagMultiSelector from '@/components/meta/tag/multi-selector/index.vue'; import TagMultiSelector from '@/components/meta/tag/multi-selector/index.vue';
const emits = defineEmits(['openAdd', 'openUpdate', 'openUpdateConfig', 'openHostGroup']); const emits = defineEmits(['openAdd', 'openUpdate', 'openUpdateConfig', 'openHostGroup']);
@@ -187,7 +186,6 @@
const cardColLayout = useColLayout(); const cardColLayout = useColLayout();
const pagination = usePagination(); const pagination = usePagination();
const { copy } = useCopy();
const { loading, setLoading } = useLoading(); const { loading, setLoading } = useLoading();
const formRef = ref(); const formRef = ref();

View File

@@ -105,10 +105,11 @@
</template> </template>
<!-- 地址 --> <!-- 地址 -->
<template #address="{ record }"> <template #address="{ record }">
<span class="copy-left" @click="copy(record.address)" title="复制"> <span class="span-blue text-copy"
<icon-copy /> title="复制"
@click="copy(record.address)">
{{ record.address }}
</span> </span>
<span class="span-blue">{{ record.address }}</span>
</template> </template>
<!-- 标签 --> <!-- 标签 -->
<template #tags="{ record }"> <template #tags="{ record }">
@@ -171,10 +172,9 @@
import { tagColor } from '../types/const'; import { tagColor } from '../types/const';
import { usePagination } from '@/types/table'; import { usePagination } from '@/types/table';
import useLoading from '@/hooks/loading'; import useLoading from '@/hooks/loading';
import useCopy from '@/hooks/copy'; import { copy } from '@/hooks/copy';
import columns from '../types/table.columns'; import columns from '../types/table.columns';
import { dataColor } from '@/utils'; import { dataColor } from '@/utils';
import { GrantKey, GrantRouteName } from '@/views/asset/grant/types/const';
import TagMultiSelector from '@/components/meta/tag/multi-selector/index.vue'; import TagMultiSelector from '@/components/meta/tag/multi-selector/index.vue';
const tagSelector = ref(); const tagSelector = ref();
@@ -182,8 +182,6 @@
const { loading, setLoading } = useLoading(); const { loading, setLoading } = useLoading();
const emits = defineEmits(['openAdd', 'openUpdate', 'openUpdateConfig', 'openHostGroup']); const emits = defineEmits(['openAdd', 'openUpdate', 'openUpdateConfig', 'openHostGroup']);
const { copy } = useCopy();
const pagination = usePagination(); const pagination = usePagination();
const formModel = reactive<HostQueryRequest>({ const formModel = reactive<HostQueryRequest>({

View File

@@ -122,13 +122,12 @@
import useLoading from '@/hooks/loading'; import useLoading from '@/hooks/loading';
import columns from '../types/table.columns'; import columns from '../types/table.columns';
import { usePagination } from '@/types/table'; import { usePagination } from '@/types/table';
import useCopy from '@/hooks/copy'; import { copy } from '@/hooks/copy';
const emits = defineEmits(['openAdd', 'openUpdate', 'openExec']); const emits = defineEmits(['openAdd', 'openUpdate', 'openExec']);
const pagination = usePagination(); const pagination = usePagination();
const { loading, setLoading } = useLoading(); const { loading, setLoading } = useLoading();
const { copy } = useCopy();
const tableRenderData = ref<ExecTemplateQueryResponse[]>([]); const tableRenderData = ref<ExecTemplateQueryResponse[]>([]);
const formModel = reactive<ExecTemplateQueryRequest>({ const formModel = reactive<ExecTemplateQueryRequest>({

View File

@@ -14,33 +14,33 @@
<span class="snippet-item-title-name"> <span class="snippet-item-title-name">
{{ item.name }} {{ item.name }}
</span> </span>
<!-- 操作 --> <!-- 操作 -->
<div class="snippet-item-title-actions"> <div class="snippet-item-title-actions">
<a-space> <a-space>
<!-- 粘贴 --> <!-- 粘贴 -->
<a-tag class="pointer usn" <a-tag class="pointer usn"
size="small" size="small"
:checkable="true" :checkable="true"
:checked="true" :checked="true"
@click.stop.prevent="paste"> @click.stop.prevent="paste">
<template #icon> <template #icon>
<icon-paste /> <icon-paste />
</template> </template>
粘贴 粘贴
</a-tag> </a-tag>
<!-- 执行 --> <!-- 执行 -->
<a-tag class="pointer usn" <a-tag class="pointer usn"
size="small" size="small"
:checkable="true" :checkable="true"
:checked="true" :checked="true"
@click.stop="exec"> @click.stop="exec">
<template #icon> <template #icon>
<icon-thunderbolt /> <icon-thunderbolt />
</template> </template>
执行 执行
</a-tag> </a-tag>
</a-space> </a-space>
</div> </div>
</div> </div>
<!-- 命令 --> <!-- 命令 -->
<span class="snippet-item-command" <span class="snippet-item-command"
@@ -116,7 +116,7 @@
import type { CommandSnippetQueryResponse } from '@/api/asset/command-snippet'; import type { CommandSnippetQueryResponse } from '@/api/asset/command-snippet';
import { useTerminalStore } from '@/store'; import { useTerminalStore } from '@/store';
import { useDebounceFn } from '@vueuse/core'; import { useDebounceFn } from '@vueuse/core';
import useCopy from '@/hooks/copy'; import { copy } from '@/hooks/copy';
import { inject } from 'vue'; import { inject } from 'vue';
import { openUpdateSnippetKey, removeSnippetKey } from '../types/const'; import { openUpdateSnippetKey, removeSnippetKey } from '../types/const';
@@ -124,7 +124,6 @@
item: CommandSnippetQueryResponse item: CommandSnippetQueryResponse
}>(); }>();
const { copy } = useCopy();
const { getAndCheckCurrentSshSession } = useTerminalStore(); const { getAndCheckCurrentSshSession } = useTerminalStore();
let clickCount = 0; let clickCount = 0;
@@ -169,7 +168,7 @@
// 复制命令 // 复制命令
const copyCommand = () => { const copyCommand = () => {
copy(props.item.command, false); copy(props.item.command, '已复制');
}; };
// 粘贴 // 粘贴

View File

@@ -32,15 +32,16 @@
</template> </template>
<!-- 文件名称 --> <!-- 文件名称 -->
<template #fileName="{ record }"> <template #fileName="{ record }">
<span :title="record.name" <span :title="record.name">
class="pointer"
@click="clickFilename(record)">
<!-- 文件图标 --> <!-- 文件图标 -->
<span class="file-name-icon" :title="formatFileType(record.attr).label"> <span class="file-name-icon" :title="formatFileType(record.attr).label">
<component :is="formatFileType(record.attr).icon" /> <component :is="formatFileType(record.attr).icon" />
</span> </span>
<!-- 文件名称 --> <!-- 文件名称 -->
<span>{{ record.name }}</span> <span :class="[ record.isDir ? 'pointer' : 'text-copy']"
@click="clickFilename(record)">
{{ record.name }}
</span>
</span> </span>
</template> </template>
<!-- 文件大小 --> <!-- 文件大小 -->
@@ -147,7 +148,7 @@
import { useRowSelection } from '@/types/table'; import { useRowSelection } from '@/types/table';
import { dateFormat } from '@/utils'; import { dateFormat } from '@/utils';
import { setAutoFocus } from '@/utils/dom'; import { setAutoFocus } from '@/utils/dom';
import useCopy from '@/hooks/copy'; import { copy } from '@/hooks/copy';
import columns from './types/table.columns'; import columns from './types/table.columns';
import { FILE_TYPE, openSftpChmodModalKey, openSftpMoveModalKey } from '../../types/terminal.const'; import { FILE_TYPE, openSftpChmodModalKey, openSftpMoveModalKey } from '../../types/terminal.const';
@@ -166,7 +167,6 @@
const openSftpChmodModal = inject(openSftpChmodModalKey) as (sessionId: string, path: string, permission: number) => void; const openSftpChmodModal = inject(openSftpChmodModalKey) as (sessionId: string, path: string, permission: number) => void;
const rowSelection = useRowSelection({ width: 40 }); const rowSelection = useRowSelection({ width: 40 });
const { copy } = useCopy();
// 切换页面自动清空过滤 // 切换页面自动清空过滤
watch(() => props.list, () => { watch(() => props.list, () => {

View File

@@ -70,10 +70,10 @@
import type { ISshSession, TerminalTabItem, SidebarAction } from '../../types/terminal.type'; import type { ISshSession, TerminalTabItem, SidebarAction } from '../../types/terminal.type';
import { computed, onMounted, onUnmounted, ref } from 'vue'; import { computed, onMounted, onUnmounted, ref } from 'vue';
import { useDictStore, useTerminalStore } from '@/store'; import { useDictStore, useTerminalStore } from '@/store';
import useCopy from '@/hooks/copy'; import { copy } from '@/hooks/copy';
import { ActionBarItems, connectStatusKey } from '../../types/terminal.const'; import { ActionBarItems, connectStatusKey } from '../../types/terminal.const';
import IconActions from '../layout/icon-actions.vue';
import ShellEditorModal from '@/components/view/shell-editor/modal/index.vue'; import ShellEditorModal from '@/components/view/shell-editor/modal/index.vue';
import IconActions from '../layout/icon-actions.vue';
import SshSearchModal from './ssh-search-modal.vue'; import SshSearchModal from './ssh-search-modal.vue';
import SshContextMenu from './ssh-context-menu.vue'; import SshContextMenu from './ssh-context-menu.vue';
@@ -81,7 +81,6 @@
tab: TerminalTabItem tab: TerminalTabItem
}>(); }>();
const { copy } = useCopy();
const { getDictValue } = useDictStore(); const { getDictValue } = useDictStore();
const { preference, sessionManager } = useTerminalStore(); const { preference, sessionManager } = useTerminalStore();

View File

@@ -137,7 +137,7 @@
import useLoading from '@/hooks/loading'; import useLoading from '@/hooks/loading';
import columns from '../types/table.columns'; import columns from '../types/table.columns';
import { usePagination, useRowSelection } from '@/types/table'; import { usePagination, useRowSelection } from '@/types/table';
import useCopy from '@/hooks/copy'; import { copy } from '@/hooks/copy';
import DictKeySelector from '@/components/system/dict-key/selector/index.vue'; import DictKeySelector from '@/components/system/dict-key/selector/index.vue';
const emits = defineEmits(['openAdd', 'openUpdate', 'openHistory']); const emits = defineEmits(['openAdd', 'openUpdate', 'openHistory']);
@@ -145,7 +145,6 @@
const selectedKeys = ref<number[]>([]); const selectedKeys = ref<number[]>([]);
const tableRenderData = ref<DictValueQueryResponse[]>([]); const tableRenderData = ref<DictValueQueryResponse[]>([]);
const { copy } = useCopy();
const pagination = usePagination(); const pagination = usePagination();
const rowSelection = useRowSelection(); const rowSelection = useRowSelection();
const { loading, setLoading } = useLoading(); const { loading, setLoading } = useLoading();

View File

@@ -72,7 +72,7 @@
import { operatorLogModuleKey, operatorLogTypeKey, operatorRiskLevelKey, operatorLogResultKey, dictKeys } from '../types/const'; import { operatorLogModuleKey, operatorLogTypeKey, operatorRiskLevelKey, operatorLogResultKey, dictKeys } from '../types/const';
import columns from '../types/table.columns'; import columns from '../types/table.columns';
import { getLogDetail } from '../types/const'; import { getLogDetail } from '../types/const';
import useCopy from '@/hooks/copy'; import { copy } from '@/hooks/copy';
import useLoading from '@/hooks/loading'; import useLoading from '@/hooks/loading';
import { usePagination } from '@/types/table'; import { usePagination } from '@/types/table';
import { useDictStore } from '@/store'; import { useDictStore } from '@/store';
@@ -101,7 +101,6 @@
const pagination = usePagination(); const pagination = usePagination();
const { loading, setLoading } = useLoading(); const { loading, setLoading } = useLoading();
const { getDictValue } = useDictStore(); const { getDictValue } = useDictStore();
const { copy } = useCopy();
const jsonView = ref(); const jsonView = ref();
const tableColumns = ref(); const tableColumns = ref();

View File

@@ -134,7 +134,7 @@
import { ref, onMounted } from 'vue'; import { ref, onMounted } from 'vue';
import { operatorLogModuleKey, operatorLogTypeKey, operatorRiskLevelKey, operatorLogResultKey, getLogDetail } from '../types/const'; import { operatorLogModuleKey, operatorLogTypeKey, operatorRiskLevelKey, operatorLogResultKey, getLogDetail } from '../types/const';
import columns from '../types/table.columns'; import columns from '../types/table.columns';
import useCopy from '@/hooks/copy'; import { copy } from '@/hooks/copy';
import useLoading from '@/hooks/loading'; import useLoading from '@/hooks/loading';
import { usePagination, useRowSelection } from '@/types/table'; import { usePagination, useRowSelection } from '@/types/table';
import { useDictStore } from '@/store'; import { useDictStore } from '@/store';
@@ -149,7 +149,6 @@
const rowSelection = useRowSelection(); const rowSelection = useRowSelection();
const { loading, setLoading } = useLoading(); const { loading, setLoading } = useLoading();
const { getDictValue } = useDictStore(); const { getDictValue } = useDictStore();
const { copy } = useCopy();
const clearModal = ref(); const clearModal = ref();
const jsonView = ref(); const jsonView = ref();