change vision image_url format

This commit is contained in:
2023-11-08 19:21:56 +08:00
parent b107aca639
commit 0d27de52a3
3 changed files with 44 additions and 15 deletions

View File

@@ -607,7 +607,7 @@ export default function ChatBOX(props: {
{image.type === "image_url" && ( {image.type === "image_url" && (
<img <img
className="rounded m-1 p-1 border-2 border-gray-400 max-h-32 max-w-xs" className="rounded m-1 p-1 border-2 border-gray-400 max-h-32 max-w-xs"
src={image.image_url} src={image.image_url?.url}
/> />
)} )}
</div> </div>
@@ -647,7 +647,16 @@ export default function ChatBOX(props: {
if (!image_url) { if (!image_url) {
return; return;
} }
setImages([...images, { type: "image_url", image_url }]); setImages([
...images,
{
type: "image_url",
image_url: {
url: image_url,
detail: "low",
},
},
]);
}} }}
> >
Add from URL Add from URL
@@ -673,7 +682,10 @@ export default function ChatBOX(props: {
...images, ...images,
{ {
type: "image_url", type: "image_url",
image_url: String(base64data), image_url: {
url: String(base64data),
detail: "low",
},
}, },
]); ]);
}; };
@@ -690,7 +702,7 @@ export default function ChatBOX(props: {
{image.type === "image_url" && ( {image.type === "image_url" && (
<img <img
className="rounded m-1 p-1 border-2 border-gray-400 w-32" className="rounded m-1 p-1 border-2 border-gray-400 w-32"
src={image.image_url} src={image.image_url?.url}
/> />
)} )}
<span className="flex justify-between"> <span className="flex justify-between">
@@ -700,7 +712,10 @@ export default function ChatBOX(props: {
if (!image_url) { if (!image_url) {
return; return;
} }
images[index].image_url = image_url; images[index].image_url = {
url: image_url,
detail: "low",
};
setImages([...images]); setImages([...images]);
}} }}
> >

View File

@@ -1,7 +1,12 @@
export interface ImageURL {
url: string;
detail: "low" | "high";
}
export interface MessageDetail { export interface MessageDetail {
type: "text" | "image_url"; type: "text" | "image_url";
text?: string; text?: string;
image_url?: string; image_url?: ImageURL;
} }
export interface Message { export interface Message {
role: "system" | "user" | "assistant" | "function"; role: "system" | "user" | "assistant" | "function";

View File

@@ -69,18 +69,23 @@ function EditMessage(props: EditMessageProps) {
<> <>
<img <img
className="max-h-32 max-w-xs cursor-pointer" className="max-h-32 max-w-xs cursor-pointer"
src={mdt.image_url} src={mdt.image_url?.url}
onClick={() => { onClick={() => {
window.open(mdt.image_url, "_blank"); window.open(mdt.image_url?.url, "_blank");
}} }}
/> />
<button <button
className="bg-blue-300 p-1 rounded" className="bg-blue-300 p-1 rounded"
onClick={() => { onClick={() => {
const image_url = prompt("image url", mdt.image_url); const image_url = prompt(
"image url",
mdt.image_url?.url
);
if (image_url) { if (image_url) {
if (typeof chat.content === "string") return; if (typeof chat.content === "string") return;
chat.content[index].image_url = image_url; const obj = chat.content[index].image_url;
if (obj === undefined) return;
obj.url = image_url;
setChatStore({ ...chatStore }); setChatStore({ ...chatStore });
} }
}} }}
@@ -106,8 +111,9 @@ function EditMessage(props: EditMessageProps) {
const base64data = reader.result; const base64data = reader.result;
if (!base64data) return; if (!base64data) return;
if (typeof chat.content === "string") return; if (typeof chat.content === "string") return;
chat.content[index].image_url = const obj = chat.content[index].image_url;
String(base64data); if (obj === undefined) return;
obj.url = String(base64data);
setChatStore({ ...chatStore }); setChatStore({ ...chatStore });
}; };
}; };
@@ -151,7 +157,10 @@ function EditMessage(props: EditMessageProps) {
if (typeof chat.content === "string") return; if (typeof chat.content === "string") return;
chat.content.push({ chat.content.push({
type: "image_url", type: "image_url",
image_url: "", image_url: {
url: "",
detail: "low",
},
}); });
setChatStore({ ...chatStore }); setChatStore({ ...chatStore });
}} }}
@@ -277,9 +286,9 @@ export default function Message(props: Props) {
) : ( ) : (
<img <img
className="cursor-pointer max-w-xs max-h-32 p-1" className="cursor-pointer max-w-xs max-h-32 p-1"
src={mdt.image_url} src={mdt.image_url?.url}
onClick={() => { onClick={() => {
window.open(mdt.image_url, "_blank"); window.open(mdt.image_url?.url, "_blank");
}} }}
/> />
) )