mediahub
/
mediahub-fe
4
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

feat:pull

This commit is contained in:
Anang Yusman 2025-01-08 02:04:41 +08:00
parent e514cee3b0
commit 8bff567d55
3 changed files with 127 additions and 102 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

168
components/form/content/spit-convert-form.tsx
View File

@ -499,94 +499,92 @@ export default function FormConvertSPIT() {
</Label> </Label>
</div> </div>
<div> <div className="py-3">
<div className="py-3"> <Label>Deskripsi</Label>
<Label>Deskripsi</Label> <Controller
<Controller control={control}
control={control} name="contentDescription"
name="contentDescription" render={({ field: { onChange, value } }) => (
render={({ field: { onChange, value } }) => ( // <JoditEditor
// <JoditEditor // ref={editor}
// ref={editor} // value={detail?.contentDescription}
// value={detail?.contentDescription} // onChange={onChange}
// onChange={onChange} // className="dark:text-black"
// className="dark:text-black" // />
// /> <CustomEditor
<CustomEditor onChange={onChange}
onChange={onChange} initialData={detail?.contentDescription}
initialData={detail?.contentDescription} />
/>
)}
/>
{errors.contentDescription?.message && (
<p className="text-red-400 text-sm">
{errors.contentDescription.message}
</p>
)} )}
</div> />
<div className="my-2"> {errors.contentDescription?.message && (
<Button <p className="text-red-400 text-sm">
size="sm" {errors.contentDescription.message}
onClick={handleRewriteClick} </p>
className="bg-blue-500 text-white py-2 px-4 rounded"
>
Content Rewrite
</Button>
</div>
{showRewriteEditor && (
<div>
{isGeneratedArticle && (
<div className="mt-3 pb-0 flex flex-row ">
{articleIds.map((id: string, index: number) => (
<button
key={index}
className={`mr-3 px-3 py-2 rounded-md ${
selectedArticleId === id
? "bg-green-500 text-white"
: "border-2 border-green-500 text-green-500"
}`}
onClick={() => handleArticleIdClick(id)}
>
{id}
</button>
))}
</div>
)}
<div className="flex items-center space-x-2 mt-3">
<RadioGroupItem value="rewrite" id="rewrite-file" />
<Label htmlFor="rewrite-file">
Select File Hasil Rewrite
</Label>
</div>
<div className="py-3">
<Label>File hasil Rewrite</Label>
<Controller
control={control}
name="contentRewriteDescription"
render={({ field: { onChange, value } }) =>
isLoadingData ? (
<div className="flex justify-center items-center h-40">
<p className="text-gray-500">
Loading Proses Data...
</p>
</div>
) : (
<CustomEditor
onChange={onChange}
initialData={articleBody || value}
/>
)
}
/>
{errors.contentRewriteDescription?.message && (
<p className="text-red-400 text-sm">
{errors.contentRewriteDescription.message}
</p>
)}
</div>
</div>
)} )}
</div> </div>
<div className="my-2">
<Button
size="sm"
onClick={handleRewriteClick}
className="bg-blue-500 text-white py-2 px-4 rounded"
>
Content Rewrite
</Button>
</div>
{showRewriteEditor && (
<div>
{isGeneratedArticle && (
<div className="mt-3 pb-0 flex flex-row ">
{articleIds.map((id: string, index: number) => (
<button
key={index}
className={`mr-3 px-3 py-2 rounded-md ${
selectedArticleId === id
? "bg-green-500 text-white"
: "border-2 border-green-500 text-green-500"
}`}
onClick={() => handleArticleIdClick(id)}
>
{id}
</button>
))}
</div>
)}
<div className="flex items-center space-x-2 mt-3">
<RadioGroupItem value="rewrite" id="rewrite-file" />
<Label htmlFor="rewrite-file">
Select File Hasil Rewrite
</Label>
</div>
<div className="py-3">
<Label>File hasil Rewrite</Label>
<Controller
control={control}
name="contentRewriteDescription"
render={({ field: { onChange, value } }) =>
isLoadingData ? (
<div className="flex justify-center items-center h-40">
<p className="text-gray-500">
Loading Proses Data...
</p>
</div>
) : (
<CustomEditor
onChange={onChange}
initialData={articleBody || value}
/>
)
}
/>
{errors.contentRewriteDescription?.message && (
<p className="text-red-400 text-sm">
{errors.contentRewriteDescription.message}
</p>
)}
</div>
</div>
)}
</RadioGroup> </RadioGroup>
</div> </div>
<div> <div>

23
components/form/content/video-form.tsx
View File

@ -150,7 +150,24 @@ export default function FormVideo() {
const { getRootProps, getInputProps } = useDropzone({ const { getRootProps, getInputProps } = useDropzone({
onDrop: (acceptedFiles) => { onDrop: (acceptedFiles) => {
setFiles(acceptedFiles.map((file) => Object.assign(file))); const validFiles = acceptedFiles.filter((file) => {
const isValidType = ["video/mp4", "video/mov"].includes(file.type);
const isValidSize = file.size <= 100 * 1024 * 1024; // 100MB
return isValidType && isValidSize;
});
if (!validFiles.length) {
alert("Format file harus mp4/mov dan ukuran maksimal 100MB");
return;
}
setFiles(
validFiles.map((file) =>
Object.assign(file, {
preview: URL.createObjectURL(file),
})
)
);
}, },
}); });
@ -1024,10 +1041,10 @@ export default function FormVideo() {
)} )}
</div> </div>
</div> </div>
<div className="px-3 py-3"> {/* <div className="px-3 py-3">
<Label htmlFor="fileInput">Gambar Utama</Label> <Label htmlFor="fileInput">Gambar Utama</Label>
<Input id="fileInput" type="file" onChange={handleImageChange} /> <Input id="fileInput" type="file" onChange={handleImageChange} />
</div> </div> */}
{preview && ( {preview && (
<div className="mt-3 px-3"> <div className="mt-3 px-3">
<img <img

38
components/form/task/task-detail-form.tsx
View File

@ -33,6 +33,8 @@ import {
DialogTrigger, DialogTrigger,
} from "@/components/ui/dialog"; } from "@/components/ui/dialog";
import { ChevronDown, ChevronUp } from "lucide-react"; import { ChevronDown, ChevronUp } from "lucide-react";
import dynamic from "next/dynamic";
import { Link } from "@/components/navigation";
const taskSchema = z.object({ const taskSchema = z.object({
uniqueCode: z.string().min(1, { message: "Judul diperlukan" }), uniqueCode: z.string().min(1, { message: "Judul diperlukan" }),
@ -63,6 +65,13 @@ export type taskDetail = {
is_active: string; is_active: string;
}; };
const ViewEditor = dynamic(
() => {
return import("@/components/editor/view-editor");
},
{ ssr: false }
);
export default function FormTaskDetail() { export default function FormTaskDetail() {
const MySwal = withReactContent(Swal); const MySwal = withReactContent(Swal);
const router = useRouter(); const router = useRouter();
@ -342,6 +351,7 @@ export default function FormTaskDetail() {
<div className="flex items-center gap-2" key={key}> <div className="flex items-center gap-2" key={key}>
<Checkbox <Checkbox
id={key} id={key}
disabled
checked={ checked={
unitSelection[key as keyof typeof unitSelection] unitSelection[key as keyof typeof unitSelection]
} }
@ -373,6 +383,7 @@ export default function FormTaskDetail() {
<div key={polda.id} className="border p-2"> <div key={polda.id} className="border p-2">
<Label className="flex items-center"> <Label className="flex items-center">
<Checkbox <Checkbox
disabled
checked={checkedLevels.has(polda.id)} checked={checkedLevels.has(polda.id)}
onCheckedChange={() => onCheckedChange={() =>
handleCheckboxChange(polda.id) handleCheckboxChange(polda.id)
@ -395,6 +406,7 @@ export default function FormTaskDetail() {
<div className="ml-6 mt-2"> <div className="ml-6 mt-2">
<Label className="block"> <Label className="block">
<Checkbox <Checkbox
disabled
checked={polda?.subDestination?.every( checked={polda?.subDestination?.every(
(polres: any) => (polres: any) =>
checkedLevels.has(polres.id) checkedLevels.has(polres.id)
@ -421,6 +433,7 @@ export default function FormTaskDetail() {
{polda?.subDestination?.map((polres: any) => ( {polda?.subDestination?.map((polres: any) => (
<Label key={polres.id} className="block mt-1"> <Label key={polres.id} className="block mt-1">
<Checkbox <Checkbox
disabled
checked={checkedLevels.has(polres.id)} checked={checkedLevels.has(polres.id)}
onCheckedChange={() => onCheckedChange={() =>
handleCheckboxChange(polres.id) handleCheckboxChange(polres.id)
@ -496,6 +509,7 @@ export default function FormTaskDetail() {
<div className="flex items-center gap-2" key={key}> <div className="flex items-center gap-2" key={key}>
<Checkbox <Checkbox
id={key} id={key}
disabled
checked={taskOutput[key as keyof typeof taskOutput]} checked={taskOutput[key as keyof typeof taskOutput]}
onCheckedChange={(value) => onCheckedChange={(value) =>
setTaskOutput({ ...taskOutput, [key]: value }) setTaskOutput({ ...taskOutput, [key]: value })
@ -508,11 +522,11 @@ export default function FormTaskDetail() {
))} ))}
</div> </div>
</div> </div>
<div className="mt-6"> {/* <div className="mt-6">
<Label>Broadcast </Label> <Label>Broadcast </Label>
<RadioGroup <RadioGroup
value={broadcastType} // Nilai terpilih diambil dari state broadcastType value={broadcastType}
onValueChange={(value) => setBroadcastType(value)} // Mengatur nilai saat radio berubah onValueChange={(value) => setBroadcastType(value)}
className="flex flex-wrap gap-3" className="flex flex-wrap gap-3"
> >
<div className="flex items-center gap-2"> <div className="flex items-center gap-2">
@ -528,19 +542,14 @@ export default function FormTaskDetail() {
<Label htmlFor="whatsapp">WhatsApp Blast</Label> <Label htmlFor="whatsapp">WhatsApp Blast</Label>
</div> </div>
</RadioGroup> </RadioGroup>
</div> </div> */}
<div className="mt-6"> <div className="mt-6">
<Label>Narasi Penugasan</Label> <Label>Narasi Penugasan</Label>
<Controller <Controller
control={control} control={control}
name="naration" name="naration"
render={({ field: { onChange, value } }) => ( render={({ field: { onChange, value } }) => (
<JoditEditor <ViewEditor initialData={detail?.narration} />
ref={editor}
value={detail?.narration}
onChange={onChange}
className="dark:text-black"
/>
)} )}
/> />
{errors.naration?.message && ( {errors.naration?.message && (
@ -551,11 +560,12 @@ export default function FormTaskDetail() {
</div> </div>
</div> </div>
{/* Submit Button */}
<div className="mt-4"> <div className="mt-4">
<Button type="submit" color="primary"> <Link href={"/contributor/task"}>
Submit <Button color="primary" variant={"outline"}>
</Button> Cancel
</Button>
</Link>
</div> </div>
</form> </form>
) : ( ) : (