Skip to content

Commit

Permalink
Merge pull request #500 from zsnmwy/code_copy
Browse files Browse the repository at this point in the history 
fix/dashboard: code copy
  • Loading branch information
@qmhu
qmhu authored Aug 20, 2022
2 parents 702aa9c + be8a94c commit 8d76942
Show file tree
Hide file tree
Showing 5 changed files with 112 additions and 62 deletions.
84 changes: 42 additions & 42 deletions pkg/web/package-lock.json
View file

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

6 changes: 3 additions & 3 deletions pkg/web/package.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -51,9 +51,9 @@
},
"dependencies": {
"@emotion/react": "^11.10.0",
"@mantine/core": "5.1.4",
"@mantine/hooks": "5.1.4",
"@mantine/prism": "^5.1.4",
"@mantine/core": "^5.2.0",
"@mantine/hooks": "^5.2.0",
"@mantine/prism": "^5.2.0",
"@reduxjs/toolkit": "^1.6.0",
"axios": "^0.26.1",
"axios-jsonp": "^1.0.4",
Expand Down
29 changes: 21 additions & 8 deletions pkg/web/src/pages/Recommend/ReplicaRecommend/index.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -14,6 +14,7 @@ import { useNavigate } from 'react-router-dom';
import JsYaml from 'js-yaml';
import { useTranslation } from 'react-i18next';
import { Prism } from '@mantine/prism';
import { copyToClipboard } from "../../../utils/copyToClipboard";

const Editor = React.lazy(() => import('components/common/Editor'));

Expand Down Expand Up @@ -251,20 +252,32 @@ export const SelectTable = () => {
</Dialog>
<Dialog
width={850}
header={t('执行以下命令')}
header={t('查看命令')}
visible={commandDialogVisible}
cancelBtn={null}
onConfirm={() => {
setCommandDialogVisible(false);
setCurrentSelection(null);
}}
cancelBtn={
<Button
onClick={async () => {
try {
await copyToClipboard(
`patchData=\`kubectl get recommend ${currentSelection?.metadata?.name} -n ${currentSelection?.spec?.targetRef?.namespace} -o jsonpath='{.status.recommendedInfo}'\`;kubectl patch ${currentSelection?.spec?.targetRef?.kind} ${currentSelection?.spec?.targetRef?.name} -n ${currentSelection?.spec?.targetRef?.namespace} --patch \"\${patchData}\"`,
);
await MessagePlugin.success('Copy command to clipboard.');
} catch (err) {
await MessagePlugin.error(`Failed to copy: ${err}`);
}
}}
>
Copy Code
</Button>
}
confirmBtn={false}
onClose={() => {
setCommandDialogVisible(false);
setCurrentSelection(null);
}}
>
<Prism withLineNumbers language='tsx'>
{`patchData=\`kubectl get recommend ${currentSelection?.metadata?.name} -n ${currentSelection?.spec?.targetRef?.namespace} -o jsonpath='{.status.recommendedInfo}'\`;kubectl patch ${currentSelection?.spec?.targetRef?.kind} ${currentSelection?.spec?.targetRef?.name} -n ${currentSelection?.spec?.targetRef?.namespace} --patch \"\${patchData}\"`}
<Prism withLineNumbers language='bash' noCopy={true}>
{`patchData=\`kubectl get recommend ${currentSelection?.metadata?.name} -n ${currentSelection?.spec?.targetRef?.namespace} -o jsonpath='{.status.recommendedInfo}'\`\nkubectl patch ${currentSelection?.spec?.targetRef?.kind} ${currentSelection?.spec?.targetRef?.name} -n ${currentSelection?.spec?.targetRef?.namespace} --patch \"\${patchData}\"`}
</Prism>
</Dialog>
</>
Expand Down
32 changes: 23 additions & 9 deletions pkg/web/src/pages/Recommend/ResourcesRecommend/index.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -14,6 +14,7 @@ import { useNavigate } from 'react-router-dom';
import JsYaml from 'js-yaml';
import { useTranslation } from 'react-i18next';
import { Prism } from '@mantine/prism';
import { copyToClipboard } from "../../../utils/copyToClipboard";

const Editor = React.lazy(() => import('components/common/Editor'));

Expand Down Expand Up @@ -144,14 +145,15 @@ export const SelectTable = () => {
colKey: 'status.currentInfo',
cell({ row }) {
console.log('row', row);
if (typeof row.status.currentInfo == 'string') {
if (typeof row.status.currentInfo === 'string') {
const containers = JSON.parse(row?.status?.currentInfo).spec?.template?.spec?.containers || [];
if (containers.length > 0) {
return (
<Space direction='vertical'>
{containers.map((o: any, i: number) => (
<Tag key={i} theme='primary' variant='light'>
{o.name} / {o.resources.requests.cpu} / {Math.floor(parseFloat(o.resources.requests.memory) / 1048576)}Mi
{o.name} / {o.resources.requests.cpu} /{' '}
{Math.floor(parseFloat(o.resources.requests.memory) / 1048576)}Mi
</Tag>
))}
</Space>
Expand Down Expand Up @@ -282,18 +284,30 @@ export const SelectTable = () => {
width={850}
header={t('查看命令')}
visible={commandDialogVisible}
cancelBtn={null}
onConfirm={() => {
setCommandDialogVisible(false);
setCurrentSelection(null);
}}
cancelBtn={
<Button
onClick={async () => {
try {
await copyToClipboard(
`patchData=\`kubectl get recommend ${currentSelection?.metadata?.name} -n ${currentSelection?.spec?.targetRef?.namespace} -o jsonpath='{.status.recommendedInfo}'\`;kubectl patch ${currentSelection?.spec?.targetRef?.kind} ${currentSelection?.spec?.targetRef?.name} -n ${currentSelection?.spec?.targetRef?.namespace} --patch \"\${patchData}\"`,
);
await MessagePlugin.success('Copy command to clipboard.');
} catch (err) {
await MessagePlugin.error(`Failed to copy: ${err}`);
}
}}
>
Copy Code
</Button>
}
confirmBtn={false}
onClose={() => {
setCommandDialogVisible(false);
setCurrentSelection(null);
}}
>
<Prism withLineNumbers language='tsx'>
{`patchData=\`kubectl get recommend ${currentSelection?.metadata?.name} -n ${currentSelection?.spec?.targetRef?.namespace} -o jsonpath='{.status.recommendedInfo}'\`;kubectl patch ${currentSelection?.spec?.targetRef?.kind} ${currentSelection?.spec?.targetRef?.name} -n ${currentSelection?.spec?.targetRef?.namespace} --patch \"\${patchData}\"`}
<Prism withLineNumbers language='bash' noCopy={true}>
{`patchData=\`kubectl get recommend ${currentSelection?.metadata?.name} -n ${currentSelection?.spec?.targetRef?.namespace} -o jsonpath='{.status.recommendedInfo}'\`\nkubectl patch ${currentSelection?.spec?.targetRef?.kind} ${currentSelection?.spec?.targetRef?.name} -n ${currentSelection?.spec?.targetRef?.namespace} --patch \"\${patchData}\"`}
</Prism>
</Dialog>
</>
Expand Down
23 changes: 23 additions & 0 deletions pkg/web/src/utils/copyToClipboard.ts
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,23 @@
export const copyToClipboard = (textToCopy: string) => {
// navigator clipboard api needs a secure context (https)
if (navigator.clipboard && window.isSecureContext) {
// navigator clipboard api method'
return navigator.clipboard.writeText(textToCopy);
}
// text area method
const textArea = document.createElement('textarea');
textArea.value = textToCopy;
// make the textarea out of viewport
textArea.style.position = 'fixed';
textArea.style.left = '-999999px';
textArea.style.top = '-999999px';
document.body.appendChild(textArea);
textArea.focus();
textArea.select();
return new Promise<void>((res, rej) => {
// here the magic happens
// eslint-disable-next-line no-unused-expressions
document.execCommand('copy') ? res() : rej();
textArea.remove();
});
};

0 comments on commit 8d76942

Please sign in to comment.