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

feat:upload task ta

This commit is contained in:
Anang Yusman 2025-05-01 15:19:35 +08:00
parent f3120e4cf8
commit ede150383d
11 changed files with 708 additions and 656 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
app/[locale]/(protected)/contributor/task-ta/components/columns.tsx
View File

@ -172,7 +172,9 @@ const useTableColumns = () => {
</DropdownMenuItem>
</Link>
{roleId == 12 && (
<Link href={`/contributor/task-ta/upload-task`}>
<Link
href={`/contributor/task-ta/upload-task/${row.original.id}`}
>
<DropdownMenuItem className="p-2 border-b text-default-700 group focus:bg-default focus:text-primary-foreground rounded-none">
<Upload className="w-4 h-4 me-1.5" />
Upload Tugas

0
app/[locale]/(protected)/contributor/task-ta/upload-task/page.tsx → app/[locale]/(protected)/contributor/task-ta/upload-task/[id]/page.tsx
View File

5
app/[locale]/(protected)/dashboard/executive/page.tsx
View File

@ -265,10 +265,7 @@ export default function ExecutiveDashboard() {
<Card className="rounded-sm p-3 h-[750px]">
<div className="flex flex-row justify-between mx-3">
<p className="text-base font-semibold">
Heatmap Konten Dengan Interaksi
</p>
<p className="text-base font-semibold">
Heatmap Kategori Dengan Interaksi
Heatmap Konten dan Kategori dengan Interaksi
</p>
</div>
<div className="my-5">

2
components/form/content/audio-form.tsx
View File

@ -948,6 +948,8 @@ export default function FormAudio() {
{selectedArticleId && (
<Link
href={`/contributor/content/audio/update-seo/${selectedArticleId}`}
target="_blank"
rel="noopener noreferrer"
>
<Button
className="mb-2"

30
components/form/content/image-form.tsx
View File

@ -16,7 +16,7 @@ import * as z from "zod";
import { Upload } from "tus-js-client";
import Swal from "sweetalert2";
import withReactContent from "sweetalert2-react-content";
import { redirect, useRouter } from "next/navigation";
import { redirect, useParams, useRouter } from "next/navigation";
import {
Select,
SelectContent,
@ -57,7 +57,7 @@ import dynamic from "next/dynamic";
import { getCsrfToken } from "@/service/auth";
import { Link } from "@/i18n/routing";
import { request } from "http";
import { useTranslations } from "next-intl";
import { useLocale, useTranslations } from "next-intl";
interface FileWithPreview extends File {
preview: string;
@ -85,6 +85,8 @@ export default function FormImage() {
const router = useRouter();
const editor = useRef(null);
type ImageSchema = z.infer<typeof imageSchema>;
const params = useParams();
const locale = params?.locale;
const t = useTranslations("Form");
const [selectedFiles, setSelectedFiles] = useState<File[]>([]);
@ -466,7 +468,7 @@ export default function FormImage() {
tags: string;
isYoutube: boolean;
isInternationalMedia: boolean;
attachFromScheduleId?: number; // ✅ Tambahkan properti ini
attachFromScheduleId?: number;
} = {
...data,
title: finalTitle,
@ -951,18 +953,18 @@ export default function FormImage() {
<div className="pt-3">
<div className="flex flex-row justify-between items-center">
{selectedArticleId && (
<Link
href={`/contributor/content/image/update-seo/${selectedArticleId}`}
<Button
className="mb-2"
size="sm"
variant={"outline"}
color="primary"
onClick={() => {
const url = `/${locale}/contributor/content/image/update-seo/${selectedArticleId}`;
window.open(url, "_blank", "noopener,noreferrer");
}}
>
<Button
className="mb-2"
size="sm"
variant={"outline"}
color="primary"
>
{t("update")}
</Button>
</Link>
{t("update")}
</Button>
)}
</div>
</div>

352
components/form/content/image-update-seo.tsx
View File

@ -62,6 +62,8 @@ import {
Legend,
ChartOptions,
} from "chart.js";
import { useTranslations } from "next-intl";
import { Link } from "@/i18n/routing";
ChartJS.register(ArcElement, Tooltip, Legend);
const imageSchema = z.object({
@ -127,6 +129,7 @@ export default function FormImageSeo() {
let progressInfo: any = [];
let counterUpdateProgress = 0;
const t = useTranslations("Form");
const [progressList, setProgressList] = useState<any>([]);
let uploadPersen = 0;
const [isStartUpload, setIsStartUpload] = useState(false);
@ -567,61 +570,174 @@ export default function FormImageSeo() {
return (
<div>
<div className="mx-5 mb-3">
<Card>
<Tabs defaultValue="content" className="">
<TabsList className="grid w-[300px] grid-cols-2 bg-slate-400 my-3 mx-3 ">
<TabsTrigger
value="content"
className="data-[state=active]:text-black text-gray-500 data-[state=active]:rounded-md"
>
Konten
</TabsTrigger>
<TabsTrigger
value="checker"
className="data-[state=active]:text-black text-gray-500 data-[state=active]:rounded-md"
>
Checker
</TabsTrigger>
</TabsList>
<TabsContent value="content">
{articleData !== undefined ? (
<CardContent className="space-y-2 my-3">
<form onSubmit={handleSubmit(onSubmit)}>
<div className="mx-5 mb-3">
<Card className="p-0">
<Tabs defaultValue="content" className="p-0">
<TabsList className="grid w-[300px] grid-cols-2 bg-slate-400 my-3 mx-3 ">
<TabsTrigger
value="content"
className="data-[state=active]:text-black text-gray-500 data-[state=active]:rounded-md"
>
Konten
</TabsTrigger>
<TabsTrigger
value="checker"
className="data-[state=active]:text-black text-gray-500 data-[state=active]:rounded-md"
>
Checker
</TabsTrigger>
</TabsList>
<TabsContent value="content">
{articleData !== undefined ? (
<CardContent className="space-y-2 my-3">
<div className="space-y-1">
<Label htmlFor="name">Judul</Label>
<Input id="name" defaultValue={articleData?.title} />
</div>
<div className="flex flex-row gap-3 w-full">
<div className="w-full">
<Label htmlFor="username">Main Keyword</Label>
<Textarea
id="mainKeyword"
value={articleData?.mainKeyword}
/>
</div>
<div className="w-full">
<Label htmlFor="username">Additional Keyword</Label>
<Textarea
id="additionalKeywords"
value={articleData?.additionalKeywords}
/>
</div>
</div>
<div className="flex flex-row gap-3 w-full">
<div className="w-full">
<Label htmlFor="username">Meta Title</Label>
<Textarea
id="metaTitle"
value={articleData?.metaTitle}
/>
</div>
<div className="w-full">
<Label htmlFor="username">Meta Description</Label>
<Textarea
id="metaDescription"
value={articleData?.metaDescription}
/>
</div>
</div>
<div className="py-3">
<Label>Article</Label>
<Controller
control={control}
name="description"
render={({ field: { onChange, value } }) => (
<CustomEditor
onChange={onChange}
initialData={articleBody}
/>
)}
/>
{errors.description?.message && (
<p className="text-red-400 text-sm">
{errors.description.message}
</p>
)}
</div>
</CardContent>
) : (
""
)}
</TabsContent>
<TabsContent value="checker">
<CardContent className="space-y-2">
<div className="flex items-start justify-start">
<Pie
data={data}
options={options}
className="text-left flex items-start justify-start"
/>
</div>
<div className="space-y-1">
<Label htmlFor="name">Judul</Label>
<Input id="name" defaultValue={articleData?.title} />
</div>
<div className="flex flex-row gap-3 w-full">
<div className="w-full">
<Label htmlFor="username">Main Keyword</Label>
<Textarea
id="mainKeyword"
value={articleData?.mainKeyword}
/>
</div>
<div className="w-full">
<Label htmlFor="username">Additional Keyword</Label>
<Textarea
id="additionalKeywords"
value={articleData?.additionalKeywords}
/>
</div>
</div>
<div className="flex flex-row gap-3 w-full">
<div className="w-full">
<Label htmlFor="username">Meta Title</Label>
<Textarea id="metaTitle" value={articleData?.metaTitle} />
</div>
<div className="w-full">
<Label htmlFor="username">Meta Description</Label>
<Textarea
id="metaDescription"
value={articleData?.metaDescription}
/>
</div>
<Accordion type="single" collapsible className="w-full ">
<AccordionItem
value="error"
className="border border-red-600"
>
<AccordionTrigger>
<div className="flex items-center">
<XIcon className="text-red-600" />
Errors ({errorSEO.length})
</div>
</AccordionTrigger>
<AccordionContent>
{errorSEO.length > 0 ? (
<ul className="list-disc list-inside">
{errorSEO.map((item, index) => (
<li key={index}>{item}</li>
))}
</ul>
) : (
<p>No errors found.</p>
)}
</AccordionContent>
</AccordionItem>
<AccordionItem
value="warning"
className="border border-yellow-600"
>
<AccordionTrigger>
<div className="flex items-center">
<XIcon className="text-yellow-600" />
Warnings ({warningSEO.length})
</div>
</AccordionTrigger>
<AccordionContent>
{warningSEO.length > 0 ? (
<ul className="list-disc list-inside">
{warningSEO.map((item, index) => (
<li key={index}>{item}</li>
))}
</ul>
) : (
<p>No warnings found.</p>
)}
</AccordionContent>
</AccordionItem>
<AccordionItem
value="optimized"
className="border border-green-600"
>
<AccordionTrigger>
<div className="flex items-center">
<XIcon className="text-green-600" />
Optimized ({optimizedSEO.length})
</div>
</AccordionTrigger>
<AccordionContent>
{optimizedSEO.length > 0 ? (
<ul className="list-disc list-inside">
{optimizedSEO.map((item, index) => (
<li key={index}>{item}</li>
))}
</ul>
) : (
<p>No optimizations found.</p>
)}
</AccordionContent>
</AccordionItem>
</Accordion>
</div>
<div className="py-3">
<Label>Article</Label>
<div className="flex flex-row justify-between items-center mb-3">
<Label>Article</Label>
<Button size="md" className="bg-blue-500">
Select Image From Content Bank
</Button>
</div>
<Controller
control={control}
name="description"
@ -639,119 +755,25 @@ export default function FormImageSeo() {
)}
</div>
</CardContent>
) : (
""
)}
</TabsContent>
<TabsContent value="checker">
<CardContent className="space-y-2">
<div className="flex items-start justify-start">
<Pie
data={data}
options={options}
className="text-left flex items-start justify-start"
/>
</div>
<div className="space-y-1">
<Accordion type="single" collapsible className="w-full ">
<AccordionItem
value="error"
className="border border-red-600"
>
<AccordionTrigger>
<div className="flex items-center">
<XIcon className="text-red-600" />
Errors ({errorSEO.length})
</div>
</AccordionTrigger>
<AccordionContent>
{errorSEO.length > 0 ? (
<ul className="list-disc list-inside">
{errorSEO.map((item, index) => (
<li key={index}>{item}</li>
))}
</ul>
) : (
<p>No errors found.</p>
)}
</AccordionContent>
</AccordionItem>
<AccordionItem
value="warning"
className="border border-yellow-600"
>
<AccordionTrigger>
<div className="flex items-center">
<XIcon className="text-yellow-600" />
Warnings ({warningSEO.length})
</div>
</AccordionTrigger>
<AccordionContent>
{warningSEO.length > 0 ? (
<ul className="list-disc list-inside">
{warningSEO.map((item, index) => (
<li key={index}>{item}</li>
))}
</ul>
) : (
<p>No warnings found.</p>
)}
</AccordionContent>
</AccordionItem>
<AccordionItem
value="optimized"
className="border border-green-600"
>
<AccordionTrigger>
<div className="flex items-center">
<XIcon className="text-green-600" />
Optimized ({optimizedSEO.length})
</div>
</AccordionTrigger>
<AccordionContent>
{optimizedSEO.length > 0 ? (
<ul className="list-disc list-inside">
{optimizedSEO.map((item, index) => (
<li key={index}>{item}</li>
))}
</ul>
) : (
<p>No optimizations found.</p>
)}
</AccordionContent>
</AccordionItem>
</Accordion>
</div>
<div className="py-3">
<div className="flex flex-row justify-between items-center mb-3">
<Label>Article</Label>
<Button size="md" className="bg-blue-500">
Select Image From Content Bank
</Button>
</div>
<Controller
control={control}
name="description"
render={({ field: { onChange, value } }) => (
<CustomEditor
onChange={onChange}
initialData={articleBody}
/>
)}
/>
{errors.description?.message && (
<p className="text-red-400 text-sm">
{errors.description.message}
</p>
)}
</div>
</CardContent>
</TabsContent>
</Tabs>
</Card>
</div>
</TabsContent>
</Tabs>
<div className="flex flex-row justify-star gap-3 mx-5">
<div className="mb-3">
<Link href={"/contributor/content/image"}>
<Button type="submit" color="primary" variant="outline">
{t("cancel")}
</Button>
</Link>
</div>
<div className="mb-3">
<Button type="submit" color="primary">
{t("submit")}
</Button>
</div>
</div>
</Card>
</div>
</form>
</div>
);
}

2
components/form/content/teks-form.tsx
View File

@ -945,6 +945,8 @@ export default function FormTeks() {
{selectedArticleId && (
<Link
href={`/contributor/content/teks/update-seo/${selectedArticleId}`}
target="_blank"
rel="noopener noreferrer"
>
<Button
className="mb-2"

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

@ -944,6 +944,8 @@ export default function FormVideo() {
{selectedArticleId && (
<Link
href={`/contributor/content/video/update-seo/${selectedArticleId}`}
target="_blank"
rel="noopener noreferrer"
>
<Button
className="mb-2"

80
components/form/task-ta/task-ta-form.tsx
View File

@ -33,7 +33,7 @@ import {
DialogTitle,
DialogTrigger,
} from "@/components/ui/dialog";
import { ChevronDown, ChevronUp, Trash2 } from "lucide-react";
import { CalendarIcon, ChevronDown, ChevronUp, Trash2 } from "lucide-react";
import { AudioRecorder } from "react-audio-voice-recorder";
import FileUploader from "@/components/form/shared/file-uploader";
import { Upload } from "tus-js-client";
@ -42,6 +42,18 @@ import { getCsrfToken } from "@/service/auth";
import { loading } from "@/lib/swal";
import { useTranslations } from "next-intl";
import dynamic from "next/dynamic";
import { cn } from "@/lib/utils";
import {
Popover,
PopoverContent,
PopoverTrigger,
} from "@/components/ui/popover";
import { Calendar } from "@/components/ui/calendar";
import { addDays, format, setDate } from "date-fns";
import { DateRange } from "react-day-picker";
import TimePicker from "react-time-picker";
import "react-time-picker/dist/TimePicker.css";
import "react-clock/dist/Clock.css";
const taskSchema = z.object({
title: z.string().min(1, { message: "Judul diperlukan" }),
@ -134,6 +146,9 @@ export default function FormTaskTa() {
const [isTextUploadFinish, setIsTextUploadFinish] = useState(false);
const [isAudioUploadFinish, setIsAudioUploadFinish] = useState(false);
const [voiceNoteLink, setVoiceNoteLink] = useState("");
const [date, setDate] = React.useState<DateRange | undefined>({
from: new Date(2024, 0, 1),
});
const [platformTypeVisible, setPlatformTypeVisible] = useState(false);
const [unitSelection, setUnitSelection] = useState({
@ -478,7 +493,7 @@ export default function FormTaskTa() {
};
const upload = new Upload(file, {
endpoint: `${process.env.NEXT_PUBLIC_API}/assignment/file/upload`,
endpoint: `${process.env.NEXT_PUBLIC_API}/assignment-expert/file/upload`,
headers: headers,
retryDelays: [0, 3000, 6000, 12_000, 24_000],
chunkSize: 20_000,
@ -735,6 +750,46 @@ export default function FormTaskTa() {
<Label htmlFor="tugas-harian">Tugas Harian</Label>
</RadioGroup>
</div>
<div className="flex flex-col space-y-2 mt-5">
<Label className="mr-3 mb-1">Tanggal</Label>
<Popover>
<PopoverTrigger asChild className="px-0">
<Button
size="md"
id="date"
variant={"outline"}
className={cn(
"w-[280px] lg:w-[250px] justify-start text-left font-normal border border-slate-300 px-0 md:px-0 lg:px-4",
!date && "text-muted-foreground"
)}
>
<CalendarIcon size={15} className="mr-3" />
{date?.from ? (
date.to ? (
<>
{format(date.from, "LLL dd, y")} -{" "}
{format(date.to, "LLL dd, y")}
</>
) : (
format(date.from, "LLL dd, y")
)
) : (
<span>Pick a date</span>
)}
</Button>
</PopoverTrigger>
<PopoverContent className="w-auto p-0" align="start">
<Calendar
initialFocus
mode="range"
defaultMonth={date?.from}
selected={date}
onSelect={setDate}
numberOfMonths={1}
/>
</PopoverContent>
</Popover>
</div>
<div className="mt-5 space-y-2">
<Label>{t("areas-expertise")}</Label>
<div className="flex flex-wrap gap-4">
@ -779,27 +834,6 @@ export default function FormTaskTa() {
))}
</div>
</div>
{/* <div className="mt-5">
<Label>Broadcast </Label>
<RadioGroup
value={broadcastType} // Nilai terpilih diambil dari state broadcastType
onValueChange={(value) => setBroadcastType(value)} // Mengatur nilai saat radio berubah
className="flex flex-wrap gap-3"
>
<div className="flex items-center gap-2">
<RadioGroupItem value="all" id="all" />
<Label htmlFor="all">Semua</Label>
</div>
<div className="flex items-center gap-2">
<RadioGroupItem value="email" id="email" />
<Label htmlFor="email">Email Blast</Label>
</div>
<div className="flex items-center gap-2">
<RadioGroupItem value="whatsapp" id="whatsapp" />
<Label htmlFor="whatsapp">WhatsApp Blast</Label>
</div>
</RadioGroup>
</div> */}
<div className="mt-5 space-y-2">
<Label>{t("description")}</Label>
<Controller

877
components/form/task-ta/task-ta-new.tsx
View File

File diff suppressed because it is too large Load Diff

10
components/landing-page/navbar.tsx
View File

@ -102,7 +102,7 @@ const Navbar = () => {
Cookies.remove(cookieName);
});
router.push("/");
window.location.href = "/";
};
// const profilePicture = Cookies.get("profile_picture");
@ -1498,7 +1498,7 @@ const Navbar = () => {
<DropdownMenuSeparator />
<DropdownMenuItem className="flex items-center gap-2 text-sm font-medium text-default-600 capitalize my-1 px-3 cursor-pointer">
<div>
{/* <Link href={"/"}>
<Link href={"/"}>
<button
type="submit"
className="w-full flex items-center gap-2"
@ -1507,7 +1507,7 @@ const Navbar = () => {
<Icon icon="heroicons:power" className="w-4 h-4" />
{t("logOut")}
</button>
</Link> */}
</Link>
</div>
</DropdownMenuItem>
</DropdownMenuContent>
@ -1726,7 +1726,7 @@ const Navbar = () => {
<DropdownMenuSeparator />
<DropdownMenuItem className="flex items-center gap-2 text-sm font-medium text-default-600 capitalize my-1 px-3 cursor-pointer">
<div>
{/* <Link href={"/"}>
<Link href={"/"}>
<button
type="submit"
className="w-full flex items-center gap-2"
@ -1735,7 +1735,7 @@ const Navbar = () => {
<Icon icon="heroicons:power" className="w-4 h-4" />
{t("logOut")}
</button>
</Link> */}
</Link>
</div>
</DropdownMenuItem>
</DropdownMenuContent>