diff --git a/solidui-web/src/apis/index.ts b/solidui-web/src/apis/index.ts index 8ef634b..6c06079 100644 --- a/solidui-web/src/apis/index.ts +++ b/solidui-web/src/apis/index.ts @@ -83,6 +83,16 @@ const project = { ApiService.put(`/solidui/projects/${id}?projectName=${name}`), load: (id: string) => ApiService.get(`/solidui/projects/${id}`), + changeBgImage: (id: string, backgroundImage: string) => + ApiService.put( + `/solidui/projects/${id}`, + { backgroundImage }, + { + headers: { + "Content-Type": "application/x-www-form-urlencoded", + }, + }, + ), }; const datasource = { @@ -132,7 +142,10 @@ const datasource = { `/solidui/metadataQuery/queryDatabases?dataSourceName=${params.dataSourceName}&typeName=${params.typeName}`, ), tables: ( - params: { dataSourceName: string | undefined; database: string | undefined } = { + params: { + dataSourceName: string | undefined; + database: string | undefined; + } = { dataSourceName: "", database: "", }, @@ -144,7 +157,7 @@ const datasource = { params: { dataSourceName: string; database: string; tableName: string } = { dataSourceName: "", database: "", - tableName: "" + tableName: "", }, ) => ApiService.get( diff --git a/solidui-web/src/pages/Project/_components/ProjectCard.tsx b/solidui-web/src/pages/Project/_components/ProjectCard.tsx index 6465918..3455d91 100644 --- a/solidui-web/src/pages/Project/_components/ProjectCard.tsx +++ b/solidui-web/src/pages/Project/_components/ProjectCard.tsx @@ -29,7 +29,7 @@ import { message, } from "antd"; import { UserOutlined } from "@ant-design/icons"; -import { Delete, Editor, Close } from "@icon-park/react"; +import { Delete, Editor, Close, Pic } from "@icon-park/react"; import classNames from "classnames"; import Apis from "@/apis"; import { ProjectDataType } from "@/types"; @@ -50,11 +50,12 @@ export interface ProjectCardProps { } export default function ProjectCard(props: ProjectCardProps) { - const inputRef = useRef() + const inputRef = useRef(); const navigate = useNavigate(); const [form] = Form.useForm(); const [editOpen, setEditOpen] = useState(false); + const [picOpen, setPicOpen] = useState(false); const { className, @@ -98,40 +99,37 @@ export default function ProjectCard(props: ProjectCardProps) { const clazzName = classNames("solidui-card__project", className); - const [showText, setShowText] = useState(true) - const [text, setText] = useState(item.projectName) - - const [inputValue, setInputValue] = useState('') + const [showText, setShowText] = useState(true); + const [text, setText] = useState(item.projectName); + + const [inputValue, setInputValue] = useState(""); const onDoubleClick = () => { - setShowText(false) - setInputValue(text) + setShowText(false); + setInputValue(text); // console.log('inputRef', inputRef) setTimeout(() => { - inputRef.current?.focus() + inputRef.current?.focus(); }, 100); - } + }; const onConfirm = () => { // console.log('确定') - setShowText(true) - setText(inputValue) + setShowText(true); + setText(inputValue); // console.log(text != inputValue) - if(text != inputValue){ + if (text != inputValue) { onFinish(inputValue); } - } + }; const onCancel = () => setShowText(true); const onFinish = async (values) => { - const res = await Apis.project.update( - `${item.id}`, - values, - ); + const res = await Apis.project.update(`${item.id}`, values); if (res.ok) { message.success("rename ok"); setEditOpen(false); onUpdate(); } - } + }; const [isHovered, setIsHovered] = useState(false); const textHoverStyle = { @@ -149,9 +147,9 @@ export default function ProjectCard(props: ProjectCardProps) { width: "100%", height: "2px", backgroundColor: "blue", - content: '""' - }; - + content: '""', + }; + return (
{/*
{item.projectName}
*/} -
+
+ {item.image && } +
{popup ? (
@@ -211,6 +211,19 @@ export default function ProjectCard(props: ProjectCardProps) { strokeLinecap="square" onClick={__handleDelete} /> + { + setPicOpen(true); + // form.setFieldValue("name", item.projectName); + }} + /> {/* } /> -
setIsHovered(true)} - onMouseLeave={() => setIsHovered(false)} > - { - showText ?

{item.projectName}

: '' - } - { - isHovered ? : '' - } - - -
- { inputRef.current = ref }} type="text" value={inputValue} onChange={(e) => setInputValue(e.target.value)} onBlur={onConfirm} style={{width:'100%', color: '#ffffff', outline: 'none' ,borderTop: 'none',borderLeft: 'none',borderRight: 'none',borderBottomColor:'blue',backgroundColor:'#6c6c6c'}} onKeyDown={(e) => { if (e.keyCode === 13) onConfirm() }}/> - -
+
setIsHovered(true)} + onMouseLeave={() => setIsHovered(false)} + > + {showText ? ( +

+ {item.projectName} +

+ ) : ( + "" + )} + {isHovered ? : ""} + +
+ { + inputRef.current = ref; + }} + type="text" + value={inputValue} + onChange={(e) => setInputValue(e.target.value)} + onBlur={onConfirm} + style={{ + width: "100%", + color: "#ffffff", + outline: "none", + borderTop: "none", + borderLeft: "none", + borderRight: "none", + borderBottomColor: "blue", + backgroundColor: "#6c6c6c", + }} + onKeyDown={(e) => { + if (e.keyCode === 13) onConfirm(); + }} + /> +
{item.userName}
{item.updateTime}
@@ -382,6 +423,86 @@ export default function ProjectCard(props: ProjectCardProps) {
+ modal} + > +
+
+ Change background image + + { + setPicOpen(false); + }} + /> + +
+
+
+
{ + const res = await Apis.project.changeBgImage( + `${item.id}`, + values.backgroundImage, + ); + if (res.ok) { + message.success("rename ok"); + setPicOpen(false); + onUpdate(); + } + }} + > + + + +
+
+
+
+ + +
+
+
); }