Feat: copy to clipboard in WebDAV account management page (Fix: #706)

src/component/Common/Snackbar.js

@@ -100,7 +100,7 @@ MySnackbarContent.propTypes = {
     className: PropTypes.string,
     message: PropTypes.node,
     onClose: PropTypes.func,
-    variant: PropTypes.oneOf(["success", "warning", "error", "info"])
+    variant: PropTypes.oneOf(["alert", "success", "warning", "error", "info"])
         .isRequired,
 };
 

src/component/FileManager/DnD/DragLayer.js

@@ -31,6 +31,7 @@ function getItemStyles(
 
     const transform = `translate(${x}px, ${y}px)`;
     return {
+        opacity: 0.5,
         transform,
         WebkitTransform: transform,
     };

src/component/Setting/WebDAV.js

@@ -19,6 +19,7 @@ import IconButton from "@material-ui/core/IconButton";
 import { Delete } from "@material-ui/icons";
 import CreateWebDAVAccount from "../Modals/CreateWebDAVAccount";
 import TimeAgo from "timeago-react";
+import Link from "@material-ui/core/Link";
 
 const useStyles = makeStyles((theme) => ({
     layout: {
@@ -45,6 +46,9 @@ const useStyles = makeStyles((theme) => ({
     create: {
         marginTop: theme.spacing(2),
     },
+    copy: {
+        marginLeft: 10,
+    },
 }));
 
 export default function WebDAV() {
@@ -59,6 +63,11 @@ export default function WebDAV() {
         [dispatch]
     );
 
+    const copyToClipboard = (text) => {
+        navigator.clipboard.writeText(text);
+        ToggleSnackbar("top", "center", "已复制到剪切板", "success");
+    };
+
     const loadList = () => {
         API.get("/webdav/accounts")
             .then((response) => {
@@ -151,9 +160,7 @@ export default function WebDAV() {
                                     <TableHead>
                                         <TableRow>
                                             <TableCell>备注名</TableCell>
-                                            <TableCell align="right">
-                                                密码
-                                            </TableCell>
+                                            <TableCell>密码</TableCell>
                                             <TableCell align="right">
                                                 根目录
                                             </TableCell>
@@ -174,8 +181,19 @@ export default function WebDAV() {
                                                 >
                                                     {row.Name}
                                                 </TableCell>
-                                                <TableCell align="right">
+                                                <TableCell>
                                                     {row.Password}
+                                                    <Link
+                                                        className={classes.copy}
+                                                        onClick={() =>
+                                                            copyToClipboard(
+                                                                row.Password
+                                                            )
+                                                        }
+                                                        href={"javascript:void"}
+                                                    >
+                                                        复制
+                                                    </Link>
                                                 </TableCell>
                                                 <TableCell align="right">
                                                     {row.Root}