Merge branch 'dev-sabda-v2' of https://gitlab.com/hanifsalafi/mediahub_redesign
This commit is contained in:
commit
c187ba7486
|
|
@ -244,6 +244,11 @@ export default function FormAudioUpdate() {
|
|||
const details = response?.data?.data;
|
||||
|
||||
setDetail(details);
|
||||
setSelectedTarget(String(details.category.id));
|
||||
|
||||
setValue("title", details.title);
|
||||
setValue("description", details.description);
|
||||
setValue("creatorName", details.creatorName);
|
||||
|
||||
if (details?.files) {
|
||||
setPrefFiles(details.files);
|
||||
|
|
@ -266,15 +271,15 @@ export default function FormAudioUpdate() {
|
|||
setTags(details.tags.split(",").map((tag: string) => tag.trim()));
|
||||
}
|
||||
|
||||
const matchingCategory = categories.find(
|
||||
(category) => category.id === details.categoryId
|
||||
);
|
||||
// const matchingCategory = categories.find(
|
||||
// (category) => category.id === details.categoryId
|
||||
// );
|
||||
|
||||
if (matchingCategory) {
|
||||
setSelectedTarget(matchingCategory.name);
|
||||
}
|
||||
// if (matchingCategory) {
|
||||
// setSelectedTarget(matchingCategory.name);
|
||||
// }
|
||||
|
||||
setSelectedTarget(details.categoryId);
|
||||
// setSelectedTarget(details.categoryId);
|
||||
|
||||
const filesData = details.files || [];
|
||||
const fileUrls = filesData.map((file: { secondaryUrl: string }) =>
|
||||
|
|
@ -350,6 +355,10 @@ export default function FormAudioUpdate() {
|
|||
|
||||
const response = await createMedia(requestData);
|
||||
console.log("Form Data Submitted:", requestData);
|
||||
if (response?.error) {
|
||||
error(response?.message);
|
||||
return false;
|
||||
}
|
||||
|
||||
const formMedia = new FormData();
|
||||
const thumbnail = files[0];
|
||||
|
|
@ -403,48 +412,50 @@ export default function FormAudioUpdate() {
|
|||
"X-XSRF-TOKEN": csrfToken,
|
||||
};
|
||||
|
||||
const upload = new Upload(file, {
|
||||
endpoint: `${process.env.NEXT_PUBLIC_API}/media/file/upload`,
|
||||
headers: headers,
|
||||
retryDelays: [0, 3000, 6000, 12_000, 24_000],
|
||||
chunkSize: 20_000,
|
||||
metadata: {
|
||||
mediaid: id,
|
||||
filename: file.name,
|
||||
filetype: file.type,
|
||||
duration,
|
||||
isWatermark: "false", // hardcode
|
||||
},
|
||||
onBeforeRequest: function (req) {
|
||||
var xhr = req.getUnderlyingObject();
|
||||
xhr.withCredentials = true;
|
||||
},
|
||||
onError: async (e: any) => {
|
||||
console.log("Error upload :", e);
|
||||
error(e);
|
||||
},
|
||||
onChunkComplete: (
|
||||
chunkSize: any,
|
||||
bytesAccepted: any,
|
||||
bytesTotal: any
|
||||
) => {
|
||||
const uploadPersen = Math.floor((bytesAccepted / bytesTotal) * 100);
|
||||
progressInfo[idx].percentage = uploadPersen;
|
||||
counterUpdateProgress++;
|
||||
console.log(counterUpdateProgress);
|
||||
setProgressList(progressInfo);
|
||||
setCounterProgress(counterUpdateProgress);
|
||||
},
|
||||
onSuccess: async () => {
|
||||
uploadPersen = 100;
|
||||
progressInfo[idx].percentage = 100;
|
||||
counterUpdateProgress++;
|
||||
setCounterProgress(counterUpdateProgress);
|
||||
successTodo();
|
||||
},
|
||||
});
|
||||
if (!file.secondaryUrl || file.secondaryUrl == "") {
|
||||
const upload = new Upload(file, {
|
||||
endpoint: `${process.env.NEXT_PUBLIC_API}/media/file/upload`,
|
||||
headers: headers,
|
||||
retryDelays: [0, 3000, 6000, 12_000, 24_000],
|
||||
chunkSize: 20_000,
|
||||
metadata: {
|
||||
mediaid: id,
|
||||
filename: file.name,
|
||||
filetype: file.type,
|
||||
duration,
|
||||
isWatermark: "false", // hardcode
|
||||
},
|
||||
onBeforeRequest: function (req) {
|
||||
var xhr = req.getUnderlyingObject();
|
||||
xhr.withCredentials = true;
|
||||
},
|
||||
onError: async (e: any) => {
|
||||
console.log("Error upload :", e);
|
||||
error(e);
|
||||
},
|
||||
onChunkComplete: (
|
||||
chunkSize: any,
|
||||
bytesAccepted: any,
|
||||
bytesTotal: any
|
||||
) => {
|
||||
const uploadPersen = Math.floor((bytesAccepted / bytesTotal) * 100);
|
||||
progressInfo[idx].percentage = uploadPersen;
|
||||
counterUpdateProgress++;
|
||||
console.log(counterUpdateProgress);
|
||||
setProgressList(progressInfo);
|
||||
setCounterProgress(counterUpdateProgress);
|
||||
},
|
||||
onSuccess: async () => {
|
||||
uploadPersen = 100;
|
||||
progressInfo[idx].percentage = 100;
|
||||
counterUpdateProgress++;
|
||||
setCounterProgress(counterUpdateProgress);
|
||||
successTodo();
|
||||
},
|
||||
});
|
||||
|
||||
upload.start();
|
||||
upload.start();
|
||||
}
|
||||
}
|
||||
|
||||
const onSubmit = (data: AudioSchema) => {
|
||||
|
|
@ -659,7 +670,7 @@ export default function FormAudioUpdate() {
|
|||
<Input
|
||||
size="md"
|
||||
type="text"
|
||||
defaultValue={detail?.title}
|
||||
value={field?.value}
|
||||
onChange={field.onChange}
|
||||
placeholder="Enter Title"
|
||||
/>
|
||||
|
|
@ -675,7 +686,7 @@ export default function FormAudioUpdate() {
|
|||
<div className="py-3 w-full space-y-2">
|
||||
<Label>{t("category")}</Label>
|
||||
<Select
|
||||
defaultValue={detail?.categoryId.name} // Nilai default berdasarkan detail
|
||||
value={selectedTarget}
|
||||
onValueChange={(id) => {
|
||||
console.log("Selected Category:", id);
|
||||
setSelectedTarget(id);
|
||||
|
|
@ -686,7 +697,11 @@ export default function FormAudioUpdate() {
|
|||
</SelectTrigger>
|
||||
<SelectContent>
|
||||
{categories.map((category) => (
|
||||
<SelectItem key={category.id} value={category.id}>
|
||||
<SelectItem
|
||||
key={String(category.id)}
|
||||
value={String(category.id)}
|
||||
>
|
||||
{" "}
|
||||
{category.name}
|
||||
</SelectItem>
|
||||
))}
|
||||
|
|
@ -701,10 +716,7 @@ export default function FormAudioUpdate() {
|
|||
control={control}
|
||||
name="description"
|
||||
render={({ field: { onChange, value } }) => (
|
||||
<CustomEditor
|
||||
onChange={onChange}
|
||||
initialData={detail?.description || value}
|
||||
/>
|
||||
<CustomEditor onChange={onChange} initialData={value} />
|
||||
)}
|
||||
/>
|
||||
{errors.description?.message && (
|
||||
|
|
@ -929,7 +941,7 @@ export default function FormAudioUpdate() {
|
|||
<Input
|
||||
size="md"
|
||||
type="text"
|
||||
defaultValue={detail?.creatorName}
|
||||
value={field?.value}
|
||||
onChange={field.onChange}
|
||||
placeholder="Enter Title"
|
||||
/>
|
||||
|
|
|
|||
|
|
@ -266,6 +266,11 @@ export default function FormImageUpdate() {
|
|||
const details = response?.data?.data;
|
||||
|
||||
setDetail(details);
|
||||
setSelectedTarget(String(details.category.id));
|
||||
|
||||
setValue("title", details.title);
|
||||
setValue("description", details.description);
|
||||
setValue("creatorName", details.creatorName);
|
||||
|
||||
if (details?.files) {
|
||||
setFiles(details.files);
|
||||
|
|
@ -288,15 +293,15 @@ export default function FormImageUpdate() {
|
|||
setTags(details.tags.split(",").map((tag: string) => tag.trim()));
|
||||
}
|
||||
|
||||
const matchingCategory = categories.find(
|
||||
(category) => category.id === details.categoryId
|
||||
);
|
||||
// const matchingCategory = categories.find(
|
||||
// (category) => category.id === details.categoryId
|
||||
// );
|
||||
|
||||
if (matchingCategory) {
|
||||
setSelectedTarget(matchingCategory.name);
|
||||
}
|
||||
// if (matchingCategory) {
|
||||
// setSelectedTarget(matchingCategory.name);
|
||||
// }
|
||||
|
||||
setSelectedTarget(details.categoryId); // Untuk dropdown
|
||||
// setSelectedTarget(details.categoryId); // Untuk dropdown
|
||||
}
|
||||
}
|
||||
initState();
|
||||
|
|
@ -367,6 +372,10 @@ export default function FormImageUpdate() {
|
|||
|
||||
const response = await createMedia(requestData);
|
||||
console.log("Form Data Submitted:", requestData);
|
||||
if (response?.error) {
|
||||
error(response?.message);
|
||||
return false;
|
||||
}
|
||||
|
||||
const formMedia = new FormData();
|
||||
const thumbnail = files[0];
|
||||
|
|
@ -387,6 +396,7 @@ export default function FormImageUpdate() {
|
|||
|
||||
close();
|
||||
// showProgress();
|
||||
console.log("files:", files);
|
||||
files.map(async (item: any, index: number) => {
|
||||
await uploadResumableFile(
|
||||
index,
|
||||
|
|
@ -425,48 +435,50 @@ export default function FormImageUpdate() {
|
|||
"X-XSRF-TOKEN": csrfToken,
|
||||
};
|
||||
|
||||
const upload = new Upload(file, {
|
||||
endpoint: `${process.env.NEXT_PUBLIC_API}/media/file/upload`,
|
||||
headers: headers,
|
||||
retryDelays: [0, 3000, 6000, 12_000, 24_000],
|
||||
chunkSize: 20_000,
|
||||
metadata: {
|
||||
mediaid: id,
|
||||
filename: file.name,
|
||||
filetype: file.type,
|
||||
duration,
|
||||
isWatermark: "true", // hardcode
|
||||
},
|
||||
onBeforeRequest: function (req) {
|
||||
var xhr = req.getUnderlyingObject();
|
||||
xhr.withCredentials = true;
|
||||
},
|
||||
onError: async (e: any) => {
|
||||
console.log("Error upload :", e);
|
||||
error(e);
|
||||
},
|
||||
onChunkComplete: (
|
||||
chunkSize: any,
|
||||
bytesAccepted: any,
|
||||
bytesTotal: any
|
||||
) => {
|
||||
const uploadPersen = Math.floor((bytesAccepted / bytesTotal) * 100);
|
||||
progressInfo[idx].percentage = uploadPersen;
|
||||
counterUpdateProgress++;
|
||||
console.log(counterUpdateProgress);
|
||||
setProgressList(progressInfo);
|
||||
setCounterProgress(counterUpdateProgress);
|
||||
},
|
||||
onSuccess: async () => {
|
||||
uploadPersen = 100;
|
||||
progressInfo[idx].percentage = 100;
|
||||
counterUpdateProgress++;
|
||||
setCounterProgress(counterUpdateProgress);
|
||||
successTodo();
|
||||
},
|
||||
});
|
||||
if (!file.secondaryUrl || file.secondaryUrl == "") {
|
||||
const upload = new Upload(file, {
|
||||
endpoint: `${process.env.NEXT_PUBLIC_API}/media/file/upload`,
|
||||
headers: headers,
|
||||
retryDelays: [0, 3000, 6000, 12_000, 24_000],
|
||||
chunkSize: 20_000,
|
||||
metadata: {
|
||||
mediaid: id,
|
||||
filename: file.name,
|
||||
filetype: file.type,
|
||||
duration,
|
||||
isWatermark: "true", // hardcode
|
||||
},
|
||||
onBeforeRequest: function (req) {
|
||||
var xhr = req.getUnderlyingObject();
|
||||
xhr.withCredentials = true;
|
||||
},
|
||||
onError: async (e: any) => {
|
||||
console.log("Error upload :", e);
|
||||
error(e);
|
||||
},
|
||||
onChunkComplete: (
|
||||
chunkSize: any,
|
||||
bytesAccepted: any,
|
||||
bytesTotal: any
|
||||
) => {
|
||||
const uploadPersen = Math.floor((bytesAccepted / bytesTotal) * 100);
|
||||
progressInfo[idx].percentage = uploadPersen;
|
||||
counterUpdateProgress++;
|
||||
console.log(counterUpdateProgress);
|
||||
setProgressList(progressInfo);
|
||||
setCounterProgress(counterUpdateProgress);
|
||||
},
|
||||
onSuccess: async () => {
|
||||
uploadPersen = 100;
|
||||
progressInfo[idx].percentage = 100;
|
||||
counterUpdateProgress++;
|
||||
setCounterProgress(counterUpdateProgress);
|
||||
successTodo();
|
||||
},
|
||||
});
|
||||
|
||||
upload.start();
|
||||
upload.start();
|
||||
}
|
||||
}
|
||||
|
||||
const onSubmit = (data: ImageSchema) => {
|
||||
|
|
@ -671,7 +683,7 @@ export default function FormImageUpdate() {
|
|||
<Input
|
||||
size="md"
|
||||
type="text"
|
||||
defaultValue={detail?.title}
|
||||
value={field?.value}
|
||||
onChange={field.onChange}
|
||||
placeholder="Enter Title"
|
||||
/>
|
||||
|
|
@ -687,21 +699,21 @@ export default function FormImageUpdate() {
|
|||
<div className="py-3 w-full space-y-2">
|
||||
<Label>{t("category")}</Label>
|
||||
<Select
|
||||
defaultValue={detail?.category.id} // Gunakan ID sebagai defaultValue
|
||||
value={selectedTarget}
|
||||
onValueChange={(id) => {
|
||||
console.log("Selected Category ID:", id);
|
||||
setSelectedTarget(id); // Perbarui ID kategori
|
||||
setSelectedTarget(id);
|
||||
}}
|
||||
>
|
||||
<SelectTrigger size="md">
|
||||
<SelectValue placeholder="Pilih">
|
||||
{categories.find((cat) => cat.id === selectedTarget)
|
||||
?.name || "Pilih"}
|
||||
</SelectValue>
|
||||
<SelectValue placeholder="Pilih" />
|
||||
</SelectTrigger>
|
||||
<SelectContent>
|
||||
{categories.map((category) => (
|
||||
<SelectItem key={category.id} value={category.id}>
|
||||
<SelectItem
|
||||
key={String(category.id)}
|
||||
value={String(category.id)}
|
||||
>
|
||||
{category.name}
|
||||
</SelectItem>
|
||||
))}
|
||||
|
|
@ -716,10 +728,7 @@ export default function FormImageUpdate() {
|
|||
control={control}
|
||||
name="description"
|
||||
render={({ field: { onChange, value } }) => (
|
||||
<CustomEditor
|
||||
onChange={onChange}
|
||||
initialData={detail?.description || value}
|
||||
/>
|
||||
<CustomEditor onChange={onChange} initialData={value} />
|
||||
)}
|
||||
/>
|
||||
{errors.description?.message && (
|
||||
|
|
@ -892,7 +901,7 @@ export default function FormImageUpdate() {
|
|||
<Input
|
||||
size="md"
|
||||
type="text"
|
||||
defaultValue={detail?.creatorName}
|
||||
value={field?.value}
|
||||
onChange={field.onChange}
|
||||
placeholder="Enter Title"
|
||||
/>
|
||||
|
|
|
|||
|
|
@ -239,6 +239,11 @@ export default function FormTeksUpdate() {
|
|||
const details = response?.data?.data;
|
||||
|
||||
setDetail(details);
|
||||
setSelectedTarget(String(details.category.id));
|
||||
|
||||
setValue("title", details.title);
|
||||
setValue("description", details.description);
|
||||
setValue("creatorName", details.creatorName);
|
||||
|
||||
if (details?.files) {
|
||||
setFiles(details.files);
|
||||
|
|
@ -260,15 +265,15 @@ export default function FormTeksUpdate() {
|
|||
setTags(details.tags.split(",").map((tag: string) => tag.trim()));
|
||||
}
|
||||
|
||||
const matchingCategory = categories.find(
|
||||
(category) => category.id === details.categoryId
|
||||
);
|
||||
// const matchingCategory = categories.find(
|
||||
// (category) => category.id === details.categoryId
|
||||
// );
|
||||
|
||||
if (matchingCategory) {
|
||||
setSelectedTarget(matchingCategory.name);
|
||||
}
|
||||
// if (matchingCategory) {
|
||||
// setSelectedTarget(matchingCategory.name);
|
||||
// }
|
||||
|
||||
setSelectedTarget(details.categoryId); // Untuk dropdown
|
||||
// setSelectedTarget(details.categoryId); // Untuk dropdown
|
||||
}
|
||||
}
|
||||
initState();
|
||||
|
|
@ -339,6 +344,10 @@ export default function FormTeksUpdate() {
|
|||
|
||||
const response = await createMedia(requestData);
|
||||
console.log("Form Data Submitted:", requestData);
|
||||
if (response?.error) {
|
||||
error(response?.message);
|
||||
return false;
|
||||
}
|
||||
|
||||
const formMedia = new FormData();
|
||||
const thumbnail = files[0];
|
||||
|
|
@ -397,48 +406,50 @@ export default function FormTeksUpdate() {
|
|||
"X-XSRF-TOKEN": csrfToken,
|
||||
};
|
||||
|
||||
const upload = new Upload(file, {
|
||||
endpoint: `${process.env.NEXT_PUBLIC_API}/media/file/upload`,
|
||||
headers: headers,
|
||||
retryDelays: [0, 3000, 6000, 12_000, 24_000],
|
||||
chunkSize: 20_000,
|
||||
metadata: {
|
||||
mediaid: id,
|
||||
filename: file.name,
|
||||
filetype: file.type,
|
||||
duration,
|
||||
isWatermark: "true", // hardcode
|
||||
},
|
||||
onBeforeRequest: function (req) {
|
||||
var xhr = req.getUnderlyingObject();
|
||||
xhr.withCredentials = true;
|
||||
},
|
||||
onError: async (e: any) => {
|
||||
console.log("Error upload :", e);
|
||||
error(e);
|
||||
},
|
||||
onChunkComplete: (
|
||||
chunkSize: any,
|
||||
bytesAccepted: any,
|
||||
bytesTotal: any
|
||||
) => {
|
||||
const uploadPersen = Math.floor((bytesAccepted / bytesTotal) * 100);
|
||||
progressInfo[idx].percentage = uploadPersen;
|
||||
counterUpdateProgress++;
|
||||
console.log(counterUpdateProgress);
|
||||
setProgressList(progressInfo);
|
||||
setCounterProgress(counterUpdateProgress);
|
||||
},
|
||||
onSuccess: async () => {
|
||||
uploadPersen = 100;
|
||||
progressInfo[idx].percentage = 100;
|
||||
counterUpdateProgress++;
|
||||
setCounterProgress(counterUpdateProgress);
|
||||
successTodo();
|
||||
},
|
||||
});
|
||||
if (!file.secondaryUrl || file.secondaryUrl == "") {
|
||||
const upload = new Upload(file, {
|
||||
endpoint: `${process.env.NEXT_PUBLIC_API}/media/file/upload`,
|
||||
headers: headers,
|
||||
retryDelays: [0, 3000, 6000, 12_000, 24_000],
|
||||
chunkSize: 20_000,
|
||||
metadata: {
|
||||
mediaid: id,
|
||||
filename: file.name,
|
||||
filetype: file.type,
|
||||
duration,
|
||||
isWatermark: "true", // hardcode
|
||||
},
|
||||
onBeforeRequest: function (req) {
|
||||
var xhr = req.getUnderlyingObject();
|
||||
xhr.withCredentials = true;
|
||||
},
|
||||
onError: async (e: any) => {
|
||||
console.log("Error upload :", e);
|
||||
error(e);
|
||||
},
|
||||
onChunkComplete: (
|
||||
chunkSize: any,
|
||||
bytesAccepted: any,
|
||||
bytesTotal: any
|
||||
) => {
|
||||
const uploadPersen = Math.floor((bytesAccepted / bytesTotal) * 100);
|
||||
progressInfo[idx].percentage = uploadPersen;
|
||||
counterUpdateProgress++;
|
||||
console.log(counterUpdateProgress);
|
||||
setProgressList(progressInfo);
|
||||
setCounterProgress(counterUpdateProgress);
|
||||
},
|
||||
onSuccess: async () => {
|
||||
uploadPersen = 100;
|
||||
progressInfo[idx].percentage = 100;
|
||||
counterUpdateProgress++;
|
||||
setCounterProgress(counterUpdateProgress);
|
||||
successTodo();
|
||||
},
|
||||
});
|
||||
|
||||
upload.start();
|
||||
upload.start();
|
||||
}
|
||||
}
|
||||
|
||||
const onSubmit = (data: TeksSchema) => {
|
||||
|
|
@ -615,7 +626,7 @@ export default function FormTeksUpdate() {
|
|||
<Input
|
||||
size="md"
|
||||
type="text"
|
||||
defaultValue={detail?.title}
|
||||
value={field?.value}
|
||||
onChange={field.onChange}
|
||||
placeholder="Enter Title"
|
||||
/>
|
||||
|
|
@ -631,7 +642,7 @@ export default function FormTeksUpdate() {
|
|||
<div className="py-3 w-full space-y-2">
|
||||
<Label>{t("category")}</Label>
|
||||
<Select
|
||||
defaultValue={detail?.categoryId.name} // Nilai default berdasarkan detail
|
||||
value={selectedTarget}
|
||||
onValueChange={(id) => {
|
||||
console.log("Selected Category:", id);
|
||||
setSelectedTarget(id);
|
||||
|
|
@ -642,7 +653,11 @@ export default function FormTeksUpdate() {
|
|||
</SelectTrigger>
|
||||
<SelectContent>
|
||||
{categories.map((category) => (
|
||||
<SelectItem key={category.id} value={category.id}>
|
||||
<SelectItem
|
||||
key={String(category.id)}
|
||||
value={String(category.id)}
|
||||
>
|
||||
{" "}
|
||||
{category.name}
|
||||
</SelectItem>
|
||||
))}
|
||||
|
|
@ -656,10 +671,7 @@ export default function FormTeksUpdate() {
|
|||
control={control}
|
||||
name="description"
|
||||
render={({ field: { onChange, value } }) => (
|
||||
<CustomEditor
|
||||
onChange={onChange}
|
||||
initialData={detail?.description || value}
|
||||
/>
|
||||
<CustomEditor onChange={onChange} initialData={value} />
|
||||
)}
|
||||
/>
|
||||
{errors.description?.message && (
|
||||
|
|
@ -832,7 +844,7 @@ export default function FormTeksUpdate() {
|
|||
<Input
|
||||
size="md"
|
||||
type="text"
|
||||
defaultValue={detail?.creatorName}
|
||||
value={field?.value}
|
||||
onChange={field.onChange}
|
||||
placeholder="Enter Title"
|
||||
/>
|
||||
|
|
|
|||
|
|
@ -262,6 +262,11 @@ export default function FormVideoUpdate() {
|
|||
const details = response?.data?.data;
|
||||
|
||||
setDetail(details);
|
||||
setSelectedTarget(String(details.category.id));
|
||||
|
||||
setValue("title", details.title);
|
||||
setValue("description", details.description);
|
||||
setValue("creatorName", details.creatorName);
|
||||
|
||||
if (details?.files) {
|
||||
setFiles(details.files);
|
||||
|
|
@ -283,15 +288,15 @@ export default function FormVideoUpdate() {
|
|||
setTags(details.tags.split(",").map((tag: string) => tag.trim()));
|
||||
}
|
||||
|
||||
const matchingCategory = categories.find(
|
||||
(category) => category.id === details.categoryId
|
||||
);
|
||||
// const matchingCategory = categories.find(
|
||||
// (category) => category.id === details.categoryId
|
||||
// );
|
||||
// console.log("LALALALAL", matchingCategory)
|
||||
// if (matchingCategory) {
|
||||
// setSelectedTarget(String(matchingCategory.id));
|
||||
// }
|
||||
|
||||
if (matchingCategory) {
|
||||
setSelectedTarget(matchingCategory.name);
|
||||
}
|
||||
|
||||
setSelectedTarget(details.categoryId); // Untuk dropdown
|
||||
// setSelectedTarget(details.categoryId); // Untuk dropdown
|
||||
|
||||
const filesData = details.files || [];
|
||||
const fileUrls = filesData.map((files: { url: string }) =>
|
||||
|
|
@ -727,7 +732,7 @@ export default function FormVideoUpdate() {
|
|||
<Input
|
||||
size="md"
|
||||
type="text"
|
||||
defaultValue={detail?.title}
|
||||
value={field?.value}
|
||||
onChange={field.onChange}
|
||||
placeholder="Enter Title"
|
||||
/>
|
||||
|
|
@ -743,7 +748,7 @@ export default function FormVideoUpdate() {
|
|||
<div className="py-3 w-full space-y-2">
|
||||
<Label>{t("category")}</Label>
|
||||
<Select
|
||||
defaultValue={detail?.categoryId.name} // Nilai default berdasarkan detail
|
||||
value={selectedTarget} // Nilai default berdasarkan detail
|
||||
onValueChange={(id) => {
|
||||
console.log("Selected Category:", id);
|
||||
setSelectedTarget(id);
|
||||
|
|
@ -754,7 +759,10 @@ export default function FormVideoUpdate() {
|
|||
</SelectTrigger>
|
||||
<SelectContent>
|
||||
{categories.map((category) => (
|
||||
<SelectItem key={category.id} value={category.id}>
|
||||
<SelectItem
|
||||
key={String(category.id)}
|
||||
value={String(category.id)}
|
||||
>
|
||||
{category.name}
|
||||
</SelectItem>
|
||||
))}
|
||||
|
|
@ -769,10 +777,7 @@ export default function FormVideoUpdate() {
|
|||
control={control}
|
||||
name="description"
|
||||
render={({ field: { onChange, value } }) => (
|
||||
<CustomEditor
|
||||
onChange={onChange}
|
||||
initialData={detail?.description || value}
|
||||
/>
|
||||
<CustomEditor onChange={onChange} initialData={value} />
|
||||
)}
|
||||
/>
|
||||
{errors.description?.message && (
|
||||
|
|
@ -945,7 +950,7 @@ export default function FormVideoUpdate() {
|
|||
<Input
|
||||
size="md"
|
||||
type="text"
|
||||
defaultValue={detail?.creatorName}
|
||||
value={field?.value}
|
||||
onChange={field.onChange}
|
||||
placeholder="Enter Title"
|
||||
/>
|
||||
|
|
|
|||
|
|
@ -113,6 +113,7 @@ export type taskDetail = {
|
|||
broadcastType: string;
|
||||
narration: string;
|
||||
is_active: string;
|
||||
isAssignmentAccepted: boolean;
|
||||
isDone: any;
|
||||
};
|
||||
|
||||
|
|
@ -1340,7 +1341,7 @@ export default function FormTaskTaDetail() {
|
|||
""
|
||||
)}
|
||||
</div> */}
|
||||
<div className="flex flex-wrap gap-2">
|
||||
<div className="flex flex-wrap justify-end gap-2">
|
||||
{/* <div className="">
|
||||
<Button
|
||||
type="button"
|
||||
|
|
@ -1351,13 +1352,14 @@ export default function FormTaskTaDetail() {
|
|||
Beri Tanggapan
|
||||
</Button>
|
||||
</div> */}
|
||||
{/* <div className="">
|
||||
<div className="">
|
||||
<Button
|
||||
type="button"
|
||||
className="btn btn-primary lg:mx-3"
|
||||
style={
|
||||
statusAcceptance ||
|
||||
detail?.createdBy?.id !== Number(userId)
|
||||
detail?.isAssignmentAccepted == true ||
|
||||
detail?.createdBy?.id == Number(userId)
|
||||
? {
|
||||
display: "none",
|
||||
}
|
||||
|
|
@ -1367,7 +1369,7 @@ export default function FormTaskTaDetail() {
|
|||
>
|
||||
Terima Tugas
|
||||
</Button>
|
||||
</div> */}
|
||||
</div>
|
||||
<div
|
||||
className="task-response w-100 lg:px-3"
|
||||
// style={
|
||||
|
|
|
|||
|
|
@ -8,7 +8,6 @@ import {
|
|||
listPopUp,
|
||||
listStaticBanner,
|
||||
} from "@/service/landing/landing";
|
||||
import Link from "next/link";
|
||||
import { useParams, usePathname, useRouter } from "next/navigation";
|
||||
import {
|
||||
Carousel,
|
||||
|
|
@ -48,6 +47,7 @@ import "swiper/css";
|
|||
import "swiper/css/navigation";
|
||||
import "swiper/css/pagination";
|
||||
import { ChevronLeft, ChevronRight } from "lucide-react";
|
||||
import { Link } from "@/i18n/routing";
|
||||
|
||||
type HeroModalProps = {
|
||||
onClose: () => void;
|
||||
|
|
@ -67,6 +67,12 @@ const HeroModal = ({
|
|||
const locale = params?.locale;
|
||||
const swiperRef = useRef<SwiperClass | null>(null);
|
||||
|
||||
let prefixPath = poldaName
|
||||
? `/polda/${poldaName}`
|
||||
: satkerName
|
||||
? `/satker/${satkerName}`
|
||||
: "";
|
||||
|
||||
useEffect(() => {
|
||||
async function fetchCategories() {
|
||||
const url = "https://netidhub.com/api/csrf";
|
||||
|
|
@ -167,7 +173,7 @@ const HeroModal = ({
|
|||
{list?.categoryName || "Liputan Kegiatan"}
|
||||
</span>
|
||||
|
||||
<Link href={`${locale}/image/detail/${list?.slug}`}>
|
||||
<Link href={`${prefixPath}/image/detail/${list?.slug}`}>
|
||||
<h2 className="text-lg leading-tight">{list?.title}</h2>
|
||||
</Link>
|
||||
|
||||
|
|
@ -226,6 +232,12 @@ const HeroNew = (props: { group?: string }) => {
|
|||
const [newContent, setNewContent] = useState<any>();
|
||||
const [selectedTab, setSelectedTab] = useState("image");
|
||||
|
||||
let prefixPath = poldaName
|
||||
? `/polda/${poldaName}`
|
||||
: satkerName
|
||||
? `/satker/${satkerName}`
|
||||
: "";
|
||||
|
||||
useEffect(() => {
|
||||
fecthNewContent();
|
||||
}, [selectedTab]);
|
||||
|
|
@ -263,7 +275,6 @@ const HeroNew = (props: { group?: string }) => {
|
|||
setNewContent(response?.data?.data?.content);
|
||||
};
|
||||
|
||||
|
||||
useEffect(() => {
|
||||
const timer = setTimeout(() => {
|
||||
setIsLoading(false);
|
||||
|
|
@ -415,7 +426,18 @@ const HeroNew = (props: { group?: string }) => {
|
|||
<div className="absolute inset-0 bg-black/40 z-10" />
|
||||
|
||||
{/* Konten judul, dll */}
|
||||
<div className="absolute bottom-20 left-8 lg:left-32 z-20 text-white w-[85%] lg:w-[45%]">
|
||||
<Link
|
||||
href={
|
||||
Number(list?.fileTypeId) == 1
|
||||
? `${prefixPath}/image/detail/${list?.slug}`
|
||||
: Number(list?.fileTypeId) == 2
|
||||
? `${prefixPath}/video/detail/${list?.slug}`
|
||||
: Number(list?.fileTypeId) == 3
|
||||
? `${prefixPath}/document/detail/${list?.slug}`
|
||||
: `${prefixPath}/audio/detail/${list?.slug}`
|
||||
}
|
||||
className="absolute bottom-20 left-8 lg:left-32 z-20 text-white w-[85%] lg:w-[45%] cursor-pointer"
|
||||
>
|
||||
<span className="text-red-600 text-lg font-bold uppercase">
|
||||
{list?.categoryName}
|
||||
</span>
|
||||
|
|
@ -424,7 +446,7 @@ const HeroNew = (props: { group?: string }) => {
|
|||
{formatDateToIndonesian(new Date(list?.createdAt))}{" "}
|
||||
{list?.timezone || "WIB"} | 👁 {list?.clickCount}
|
||||
</p>
|
||||
</div>
|
||||
</Link>
|
||||
|
||||
{/* Tombol navigasi di atas gambar */}
|
||||
<CarouselPrevious className="absolute left-6 top-[45%] z-30 -translate-y-1/2 hover:bg-black/70 text-white p-2 rounded-full">
|
||||
|
|
@ -458,12 +480,12 @@ const HeroNew = (props: { group?: string }) => {
|
|||
<Link
|
||||
href={
|
||||
Number(item?.fileTypeId) == 1
|
||||
? `${locale}/image/detail/${item?.slug}`
|
||||
? `${prefixPath}/image/detail/${item?.slug}`
|
||||
: Number(item?.fileTypeId) == 2
|
||||
? `${locale}/video/detail/${item?.slug}`
|
||||
? `${prefixPath}/video/detail/${item?.slug}`
|
||||
: Number(item?.fileTypeId) == 3
|
||||
? `${locale}/document/detail/${item?.slug}`
|
||||
: `${locale}/audio/detail/${item?.slug}`
|
||||
? `${prefixPath}/document/detail/${item?.slug}`
|
||||
: `${prefixPath}/audio/detail/${item?.slug}`
|
||||
}
|
||||
>
|
||||
<span className="py-1 rounded-lg flex text-red-600 font-bold uppercase w-fit">
|
||||
|
|
|
|||
|
|
@ -4,7 +4,14 @@ import { useParams, useRouter } from "next/navigation";
|
|||
import router from "next/router";
|
||||
import React, { useEffect, useState } from "react";
|
||||
import { Icon } from "@iconify/react/dist/iconify.js";
|
||||
import { Select, SelectContent, SelectGroup, SelectItem, SelectTrigger, SelectValue } from "../ui/select";
|
||||
import {
|
||||
Select,
|
||||
SelectContent,
|
||||
SelectGroup,
|
||||
SelectItem,
|
||||
SelectTrigger,
|
||||
SelectValue,
|
||||
} from "../ui/select";
|
||||
import Image from "next/image";
|
||||
import { getHeroData } from "@/service/landing/landing";
|
||||
import { title } from "process";
|
||||
|
|
@ -21,7 +28,16 @@ const ScrollableContent = () => {
|
|||
const params = useParams();
|
||||
const locale = params?.locale;
|
||||
const t = useTranslations("LandingPage");
|
||||
const [content, setContent] = useState<any>();
|
||||
const [contentPolda, setContentPolda] = useState<any>();
|
||||
const [contentSatker, setContentSatker] = useState<any>();
|
||||
const poldaName = params?.polda_name;
|
||||
const satkerName = params?.satker_name;
|
||||
|
||||
let prefixPath = poldaName
|
||||
? `/polda/${poldaName}`
|
||||
: satkerName
|
||||
? `/satker/${satkerName}`
|
||||
: "";
|
||||
|
||||
useEffect(() => {
|
||||
async function fetchCategories() {
|
||||
|
|
@ -42,15 +58,23 @@ const ScrollableContent = () => {
|
|||
}
|
||||
|
||||
fetchCategories();
|
||||
initFetch();
|
||||
initFetchPolda();
|
||||
initFetchSatker();
|
||||
}, []);
|
||||
|
||||
const initFetch = async () => {
|
||||
const response = await getHeroData(locale == "en");
|
||||
const initFetchPolda = async () => {
|
||||
const response = await getHeroData(locale == "en", "polda");
|
||||
console.log(response);
|
||||
let data = response?.data?.data?.content;
|
||||
|
||||
setContent(data);
|
||||
setContentPolda(data);
|
||||
};
|
||||
const initFetchSatker = async () => {
|
||||
const response = await getHeroData(locale == "en", "satker");
|
||||
console.log(response);
|
||||
let data = response?.data?.data?.content;
|
||||
|
||||
setContentSatker(data);
|
||||
};
|
||||
|
||||
return (
|
||||
|
|
@ -66,14 +90,23 @@ const ScrollableContent = () => {
|
|||
</h1>
|
||||
<div className="w-[10%] h-1 bg-[#bb3523] mt-2"></div>
|
||||
<div className="w-full h-1 bg-[#bb3523] mx-auto"></div>
|
||||
<p className="text-sm md:text-base text-black dark:text-gray-100 mt-4">{t("officialCoverage")}</p>
|
||||
<p className="text-sm md:text-base text-black dark:text-gray-100 mt-4">
|
||||
{t("officialCoverage")}
|
||||
</p>
|
||||
|
||||
<div className="mt-6 flex flex-col md:flex-row justify-center gap-4">
|
||||
<div className="flex flex-row items-center w-full rounded-lg gap-2 overflow-hidden">
|
||||
<Select value={contentType} onValueChange={setContentType}>
|
||||
<SelectTrigger className="w-[180px] h-[55px]">
|
||||
<span className="text-black">
|
||||
<svg className="mx-2 dark:" width="25" height="24" viewBox="0 0 25 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<svg
|
||||
className="mx-2 dark:"
|
||||
width="25"
|
||||
height="24"
|
||||
viewBox="0 0 25 24"
|
||||
fill="none"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
>
|
||||
<path
|
||||
d="M20 7.5H5C4.6023 7.5004 4.221 7.65856 3.93978 7.93978C3.65856 8.221 3.5004 8.6023 3.5 9V19.5C3.5004 19.8977 3.65856 20.279 3.93978 20.5602C4.221 20.8414 4.6023 20.9996 5 21H20C20.3977 20.9996 20.779 20.8414 21.0602 20.5602C21.3414 20.279 21.4996 19.8977 21.5 19.5V9C21.4996 8.6023 21.3414 8.221 21.0602 7.93978C20.779 7.65856 20.3977 7.5004 20 7.5ZM10.25 17.25V11.25L15.5 14.25L10.25 17.25ZM5 4.5H20V6H5V4.5ZM6.5 1.5H18.5V3H6.5V1.5Z"
|
||||
fill="currentColor"
|
||||
|
|
@ -94,17 +127,32 @@ const ScrollableContent = () => {
|
|||
</Select>
|
||||
<div className="flex items-center flex-1 border border-gray-300 rounded-lg overflow-hidden">
|
||||
<span className="material-icons text-black dark:text-white px-4">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24">
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
width="1em"
|
||||
height="1em"
|
||||
viewBox="0 0 24 24"
|
||||
>
|
||||
<path
|
||||
fill="currentColor"
|
||||
d="m19.6 21l-6.3-6.3q-.75.6-1.725.95T9.5 16q-2.725 0-4.612-1.888T3 9.5t1.888-4.612T9.5 3t4.613 1.888T16 9.5q0 1.1-.35 2.075T14.7 13.3l6.3 6.3zM9.5 14q1.875 0 3.188-1.312T14 9.5t-1.312-3.187T9.5 5T6.313 6.313T5 9.5t1.313 3.188T9.5 14"
|
||||
/>
|
||||
</svg>
|
||||
</span>
|
||||
<input type="text" placeholder={t("searchCoverageHere")} className="w-full py-4 px-2 text-sm text-gray-700 dark:text-gray-100 focus:outline-none" onChange={(e) => setSearch(e.target.value)} />
|
||||
<input
|
||||
type="text"
|
||||
placeholder={t("searchCoverageHere")}
|
||||
className="w-full py-4 px-2 text-sm text-gray-700 dark:text-gray-100 focus:outline-none"
|
||||
onChange={(e) => setSearch(e.target.value)}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<button onClick={() => router.push(`/${contentType}/filter?title=${search}`)} className="flex justify-center items-center px-6 w-full lg:w-[20%] py-4 bg-[#bb3523] gap-2 text-white rounded-lg hover:bg-red-700">
|
||||
<button
|
||||
onClick={() =>
|
||||
router.push(`/${contentType}/filter?title=${search}`)
|
||||
}
|
||||
className="flex justify-center items-center px-6 w-full lg:w-[20%] py-4 bg-[#bb3523] gap-2 text-white rounded-lg hover:bg-red-700"
|
||||
>
|
||||
{t("searchCoverage")}
|
||||
<Icon icon="ri:arrow-right-s-line" fontSize={20} />
|
||||
</button>
|
||||
|
|
@ -113,82 +161,133 @@ const ScrollableContent = () => {
|
|||
<div className="flex flex-col md:flex-row gap-6 py-8">
|
||||
{/* Berita Polda */}
|
||||
<div className="w-full md:w-1/2 px-4">
|
||||
<h2 className="text-lg md:text-xl font-bold text-[#bb3523] mb-2 uppercase">{t("regionNews")}</h2>
|
||||
<h2 className="text-lg md:text-xl font-bold text-[#bb3523] mb-2 uppercase">
|
||||
{t("regionNews")}
|
||||
</h2>
|
||||
<div className="w-[10%] h-1 bg-[#bb3523]"></div>
|
||||
<div className="w-full h-1 bg-[#bb3523] mx-auto mb-4"></div>
|
||||
<div className="grid gap-4">
|
||||
{(seeAllValuePolda ? content : content?.slice(0, 3))?.map((item: any, index: number) => (
|
||||
<div key={index} className={`bg-white rounded-lg shadow-md overflow-hidden ${index === 0 ? "" : "flex"}`}>
|
||||
<div className={`relative ${index === 0 ? "w-full h-48" : " w-1/2 h-[150px]"}`}>
|
||||
{(seeAllValuePolda ? contentPolda : contentPolda?.slice(0, 3))?.map(
|
||||
(item: any, index: number) => (
|
||||
<div
|
||||
key={index}
|
||||
className={`bg-white rounded-lg shadow-md overflow-hidden ${
|
||||
index === 0 ? "" : "flex"
|
||||
}`}
|
||||
>
|
||||
<div
|
||||
className={`relative ${
|
||||
index === 0 ? "w-full h-48" : " w-1/2 h-[150px]"
|
||||
}`}
|
||||
>
|
||||
<Link
|
||||
href={
|
||||
Number(item?.fileTypeId) == 1
|
||||
? `${prefixPath}/image/detail/${item?.slug}`
|
||||
: Number(item?.fileTypeId) == 2
|
||||
? `${prefixPath}/video/detail/${item?.slug}`
|
||||
: Number(item?.fileTypeId) == 3
|
||||
? `${prefixPath}/document/detail/${item?.slug}`
|
||||
: `${prefixPath}/audio/detail/${item?.slug}`
|
||||
}
|
||||
>
|
||||
<Image
|
||||
src={item?.smallThumbnailLink}
|
||||
alt={item?.title}
|
||||
layout="fill"
|
||||
objectFit="cover"
|
||||
/>
|
||||
<div className="absolute top-2 right-2 bg-[#c03724] rounded-full p-1 shadow">
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
width="24"
|
||||
height="24"
|
||||
viewBox="0 0 24 24"
|
||||
>
|
||||
<g fill="none">
|
||||
<path d="m12.593 23.258l-.011.002l-.071.035l-.02.004l-.014-.004l-.071-.035q-.016-.005-.024.005l-.004.01l-.017.428l.005.02l.01.013l.104.074l.015.004l.012-.004l.104-.074l.012-.016l.004-.017l-.017-.427q-.004-.016-.017-.018m.265-.113l-.013.002l-.185.093l-.01.01l-.003.011l.018.43l.005.012l.008.007l.201.093q.019.005.029-.008l.004-.014l-.034-.614q-.005-.018-.02-.022m-.715.002a.02.02 0 0 0-.027.006l-.006.014l-.034.614q.001.018.017.024l.015-.002l.201-.093l.01-.008l.004-.011l.017-.43l-.003-.012l-.01-.01z" />
|
||||
<path
|
||||
fill="white"
|
||||
d="M20 6a2 2 0 0 1 2 2v11.333a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2zm-8.268 7.944L7.136 18.54l-.066.06l-.07.054v.68h13v-.68l-.07-.053l-.066-.06l-2.24-2.24l-.353.354l.055.055a1 1 0 0 1-1.32 1.497l-.094-.083zM17 3a2 2 0 0 1 1.995 1.85L19 5H5a1 1 0 0 0-.993.883L4 6v12a2 2 0 0 1-1.995-1.85L2 16V6a3 3 0 0 1 2.824-2.995L5 3zm3 5H7v7.848L10.848 12a1.25 1.25 0 0 1 1.768 0l3.241 3.24l.884-.883a1.25 1.25 0 0 1 1.768 0L20 15.848zm-3.5 1.5a1.5 1.5 0 1 1 0 3a1.5 1.5 0 0 1 0-3"
|
||||
/>
|
||||
</g>
|
||||
</svg>
|
||||
</div>
|
||||
</Link>
|
||||
</div>
|
||||
{/* <Link
|
||||
href={
|
||||
Number(item?.fileTypeId) == 1
|
||||
? `${prefixPath}/image/detail/${item?.slug}`
|
||||
: Number(item?.fileTypeId) == 2
|
||||
? `${prefixPath}/video/detail/${item?.slug}`
|
||||
: Number(item?.fileTypeId) == 3
|
||||
? `${prefixPath}/document/detail/${item?.slug}`
|
||||
: `${prefixPath}/audio/detail/${item?.slug}`
|
||||
}
|
||||
> */}
|
||||
<Link
|
||||
href={
|
||||
Number(item?.fileTypeId) == 1
|
||||
? `${locale}/image/detail/${item?.slug}`
|
||||
? `${prefixPath}/image/detail/${item?.slug}`
|
||||
: Number(item?.fileTypeId) == 2
|
||||
? `${locale}/video/detail/${item?.slug}`
|
||||
? `${prefixPath}/video/detail/${item?.slug}`
|
||||
: Number(item?.fileTypeId) == 3
|
||||
? `${locale}/document/detail/${item?.slug}`
|
||||
: `${locale}/audio/detail/${item?.slug}`
|
||||
? `${prefixPath}/document/detail/${item?.slug}`
|
||||
: `${prefixPath}/audio/detail/${item?.slug}`
|
||||
}
|
||||
className={`${
|
||||
index === 0 ? "p-4" : "p-3 w-[50%] cursor-pointer"
|
||||
}`}
|
||||
>
|
||||
<Image src={item?.smallThumbnailLink} alt={item?.title} layout="fill" objectFit="cover" />
|
||||
<div className="absolute top-2 right-2 bg-[#c03724] rounded-full p-1 shadow">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24">
|
||||
<g fill="none">
|
||||
<path d="m12.593 23.258l-.011.002l-.071.035l-.02.004l-.014-.004l-.071-.035q-.016-.005-.024.005l-.004.01l-.017.428l.005.02l.01.013l.104.074l.015.004l.012-.004l.104-.074l.012-.016l.004-.017l-.017-.427q-.004-.016-.017-.018m.265-.113l-.013.002l-.185.093l-.01.01l-.003.011l.018.43l.005.012l.008.007l.201.093q.019.005.029-.008l.004-.014l-.034-.614q-.005-.018-.02-.022m-.715.002a.02.02 0 0 0-.027.006l-.006.014l-.034.614q.001.018.017.024l.015-.002l.201-.093l.01-.008l.004-.011l.017-.43l-.003-.012l-.01-.01z" />
|
||||
<path
|
||||
fill="white"
|
||||
d="M20 6a2 2 0 0 1 2 2v11.333a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2zm-8.268 7.944L7.136 18.54l-.066.06l-.07.054v.68h13v-.68l-.07-.053l-.066-.06l-2.24-2.24l-.353.354l.055.055a1 1 0 0 1-1.32 1.497l-.094-.083zM17 3a2 2 0 0 1 1.995 1.85L19 5H5a1 1 0 0 0-.993.883L4 6v12a2 2 0 0 1-1.995-1.85L2 16V6a3 3 0 0 1 2.824-2.995L5 3zm3 5H7v7.848L10.848 12a1.25 1.25 0 0 1 1.768 0l3.241 3.24l.884-.883a1.25 1.25 0 0 1 1.768 0L20 15.848zm-3.5 1.5a1.5 1.5 0 1 1 0 3a1.5 1.5 0 0 1 0-3"
|
||||
/>
|
||||
</g>
|
||||
</svg>
|
||||
</div>
|
||||
<p className="text-sm text-[#bb3523] font-bold mb-1">
|
||||
{item.categoryName}
|
||||
</p>
|
||||
<h3 className="text-sm font-semibold text-gray-800">
|
||||
{item.title}
|
||||
</h3>
|
||||
<p className="text-xs text-gray-500 mt-1 truncate">
|
||||
{htmlToString(item.description)}
|
||||
</p>
|
||||
</Link>
|
||||
</div>
|
||||
{/* <Link
|
||||
href={
|
||||
Number(item?.fileTypeId) == 1
|
||||
? `${locale}/image/detail/${item?.slug}`
|
||||
: Number(item?.fileTypeId) == 2
|
||||
? `${locale}/video/detail/${item?.slug}`
|
||||
: Number(item?.fileTypeId) == 3
|
||||
? `${locale}/document/detail/${item?.slug}`
|
||||
: `${locale}/audio/detail/${item?.slug}`
|
||||
}
|
||||
> */}
|
||||
<div className={`${index === 0 ? "p-4" : "p-3 w-[50%]"}`}>
|
||||
<p className="text-sm text-[#bb3523] font-bold mb-1">{item.categoryName}</p>
|
||||
<h3 className="text-sm font-semibold text-gray-800">{item.title}</h3>
|
||||
<p className="text-xs text-gray-500 mt-1 truncate">{htmlToString(item.description)}</p>
|
||||
</div>
|
||||
)
|
||||
)}
|
||||
{contentPolda?.length > 3 && (
|
||||
<div className="flex items-center flex-row justify-start mt-6">
|
||||
<Button
|
||||
onClick={() => setSeeAllValuePolda(!seeAllValuePolda)}
|
||||
className="bg-white hover:bg-[#bb3523] text-[#bb3523] hover:text-white border-2 border-[#bb3523]"
|
||||
>
|
||||
{seeAllValuePolda ? t("seeLess") : t("seeMore")}{" "}
|
||||
<span className="text-[#bb3523] hover:text-white">
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
width="24"
|
||||
height="24"
|
||||
viewBox="0 0 24 24"
|
||||
>
|
||||
<path
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
strokeLinecap="round"
|
||||
strokeLinejoin="round"
|
||||
strokeWidth="2.5"
|
||||
d="m10 17l5-5m0 0l-5-5"
|
||||
/>
|
||||
</svg>
|
||||
</span>
|
||||
</Button>
|
||||
</div>
|
||||
))}
|
||||
{/* <button className="w-fit px-2 mt-2 py-2 border flex flex-row gap-2 border-[#bb3523] bg-white text-[#bb3523] rounded-lg font-semibold hover:bg-[#bb3523] hover:border-white hover:text-white transition">
|
||||
LEBIH SEDIKIT
|
||||
<span className="text-[#bb3523] hover:text-white">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24">
|
||||
<path fill="none" stroke="currentColor" strokeLinecap="round" strokeLinejoin="round" strokeWidth="2.5" d="m10 17l5-5m0 0l-5-5" />
|
||||
</svg>
|
||||
</span>
|
||||
</button>{" "} */}
|
||||
{/* Tombol See More / See Less */}
|
||||
{content?.length > 3 && (
|
||||
<div className="flex items-center flex-row justify-start mt-6">
|
||||
<Button onClick={() => setSeeAllValuePolda(!seeAllValuePolda)} className="bg-white hover:bg-[#bb3523] text-[#bb3523] hover:text-white border-2 border-[#bb3523]">
|
||||
{seeAllValuePolda ? t("seeLess") : t("seeMore")} <span className="text-[#bb3523] hover:text-white">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24">
|
||||
<path fill="none" stroke="currentColor" strokeLinecap="round" strokeLinejoin="round" strokeWidth="2.5" d="m10 17l5-5m0 0l-5-5" />
|
||||
</svg>
|
||||
</span>
|
||||
</Button>
|
||||
</div>
|
||||
)}
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Berita SATKER */}
|
||||
<div className="w-full md:w-1/2 px-4">
|
||||
<h2 className="text-lg md:text-xl font-bold mb-2 text-[#bb3523] uppercase">{t("divisionNews")}</h2>
|
||||
<h2 className="text-lg md:text-xl font-bold mb-2 text-[#bb3523] uppercase">
|
||||
{t("divisionNews")}
|
||||
</h2>
|
||||
<div className="w-[10%] h-1 bg-[#bb3523]"></div>
|
||||
<div className="w-full h-1 bg-[#bb3523] mx-auto mb-4"></div>
|
||||
<div className="grid gap-4">
|
||||
|
|
@ -201,12 +300,12 @@ const ScrollableContent = () => {
|
|||
<Link
|
||||
href={
|
||||
Number(item?.fileTypeId) == 1
|
||||
? `${locale}/image/detail/${item?.slug}`
|
||||
? `${prefixPath}/image/detail/${item?.slug}`
|
||||
: Number(item?.fileTypeId) == 2
|
||||
? `${locale}/video/detail/${item?.slug}`
|
||||
? `${prefixPath}/video/detail/${item?.slug}`
|
||||
: Number(item?.fileTypeId) == 3
|
||||
? `${locale}/document/detail/${item?.slug}`
|
||||
: `${locale}/audio/detail/${item?.slug}`
|
||||
? `${prefixPath}/document/detail/${item?.slug}`
|
||||
: `${prefixPath}/audio/detail/${item?.slug}`
|
||||
}
|
||||
>
|
||||
<Image src={item.thumbnailLink} alt={item.title} layout="fill" objectFit="cover" />
|
||||
|
|
@ -238,23 +337,45 @@ const ScrollableContent = () => {
|
|||
</svg>
|
||||
</span>
|
||||
</button> */}
|
||||
{(seeAllValueSatker ? content : content?.slice(0, 3))?.map((item: any, index: number) => (
|
||||
<div key={index} className={`bg-white rounded-lg shadow-md overflow-hidden ${index === 0 ? "" : "flex"}`}>
|
||||
<div className={`relative ${index === 0 ? "w-full h-48" : " w-1/2 h-[150px]"}`}>
|
||||
{(seeAllValueSatker
|
||||
? contentSatker
|
||||
: contentSatker?.slice(0, 3)
|
||||
)?.map((item: any, index: number) => (
|
||||
<div
|
||||
key={index}
|
||||
className={`bg-white rounded-lg shadow-md overflow-hidden ${
|
||||
index === 0 ? "" : "flex"
|
||||
}`}
|
||||
>
|
||||
<div
|
||||
className={`relative ${
|
||||
index === 0 ? "w-full h-48" : " w-1/2 h-[150px]"
|
||||
}`}
|
||||
>
|
||||
<Link
|
||||
href={
|
||||
Number(item?.fileTypeId) == 1
|
||||
? `${locale}/image/detail/${item?.slug}`
|
||||
? `${prefixPath}/image/detail/${item?.slug}`
|
||||
: Number(item?.fileTypeId) == 2
|
||||
? `${locale}/video/detail/${item?.slug}`
|
||||
? `${prefixPath}/video/detail/${item?.slug}`
|
||||
: Number(item?.fileTypeId) == 3
|
||||
? `${locale}/document/detail/${item?.slug}`
|
||||
: `${locale}/audio/detail/${item?.slug}`
|
||||
? `${prefixPath}/document/detail/${item?.slug}`
|
||||
: `${prefixPath}/audio/detail/${item?.slug}`
|
||||
}
|
||||
>
|
||||
<Image src={item?.smallThumbnailLink} alt={item?.title} layout="fill" objectFit="cover" />
|
||||
<Image
|
||||
src={item?.smallThumbnailLink}
|
||||
alt={item?.title}
|
||||
layout="fill"
|
||||
objectFit="cover"
|
||||
/>
|
||||
<div className="absolute top-2 right-2 bg-[#c03724] rounded-full p-1 shadow">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24">
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
width="24"
|
||||
height="24"
|
||||
viewBox="0 0 24 24"
|
||||
>
|
||||
<g fill="none">
|
||||
<path d="m12.593 23.258l-.011.002l-.071.035l-.02.004l-.014-.004l-.071-.035q-.016-.005-.024.005l-.004.01l-.017.428l.005.02l.01.013l.104.074l.015.004l.012-.004l.104-.074l.012-.016l.004-.017l-.017-.427q-.004-.016-.017-.018m.265-.113l-.013.002l-.185.093l-.01.01l-.003.011l.018.43l.005.012l.008.007l.201.093q.019.005.029-.008l.004-.014l-.034-.614q-.005-.018-.02-.022m-.715.002a.02.02 0 0 0-.027.006l-.006.014l-.034.614q.001.018.017.024l.015-.002l.201-.093l.01-.008l.004-.011l.017-.43l-.003-.012l-.01-.01z" />
|
||||
<path
|
||||
|
|
@ -269,35 +390,66 @@ const ScrollableContent = () => {
|
|||
{/* <Link
|
||||
href={
|
||||
Number(item?.fileTypeId) == 1
|
||||
? `${locale}/image/detail/${item?.slug}`
|
||||
? `${prefixPath}/image/detail/${item?.slug}`
|
||||
: Number(item?.fileTypeId) == 2
|
||||
? `${locale}/video/detail/${item?.slug}`
|
||||
? `${prefixPath}/video/detail/${item?.slug}`
|
||||
: Number(item?.fileTypeId) == 3
|
||||
? `${locale}/document/detail/${item?.slug}`
|
||||
: `${locale}/audio/detail/${item?.slug}`
|
||||
? `${prefixPath}/document/detail/${item?.slug}`
|
||||
: `${prefixPath}/audio/detail/${item?.slug}`
|
||||
}
|
||||
> */}
|
||||
<div className={`${index === 0 ? "p-4" : "p-3 w-[50%]"}`}>
|
||||
<p className="text-sm text-[#bb3523] font-bold mb-1">{item.categoryName}</p>
|
||||
<h3 className="text-sm font-semibold text-gray-800">{item.title}</h3>
|
||||
<p className="text-xs text-gray-500 mt-1 truncate">{htmlToString(item.description)}</p>
|
||||
</div>
|
||||
<Link
|
||||
href={
|
||||
Number(item?.fileTypeId) == 1
|
||||
? `${prefixPath}/image/detail/${item?.slug}`
|
||||
: Number(item?.fileTypeId) == 2
|
||||
? `${prefixPath}/video/detail/${item?.slug}`
|
||||
: Number(item?.fileTypeId) == 3
|
||||
? `${prefixPath}/document/detail/${item?.slug}`
|
||||
: `${prefixPath}/audio/detail/${item?.slug}`
|
||||
}
|
||||
className={`${index === 0 ? "p-4" : "p-3 w-[50%]"}`}
|
||||
>
|
||||
<p className="text-sm text-[#bb3523] font-bold mb-1">
|
||||
{item.categoryName}
|
||||
</p>
|
||||
<h3 className="text-sm font-semibold text-gray-800">
|
||||
{item.title}
|
||||
</h3>
|
||||
<p className="text-xs text-gray-500 mt-1 truncate">
|
||||
{htmlToString(item.description)}
|
||||
</p>
|
||||
</Link>
|
||||
</div>
|
||||
))}
|
||||
{/* Tombol See More / See Less */}
|
||||
{content?.length > 3 && (
|
||||
<div className="flex items-center flex-row justify-start mt-6">
|
||||
<Button onClick={() => setSeeAllValueSatker(!seeAllValueSatker)} className="bg-white hover:bg-[#bb3523] text-[#bb3523] hover:text-white border-2 border-[#bb3523]">
|
||||
|
||||
|
||||
{seeAllValueSatker ? t("seeLess") : t("seeMore")} <span className="text-[#bb3523] hover:text-white">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24">
|
||||
<path fill="none" stroke="currentColor" strokeLinecap="round" strokeLinejoin="round" strokeWidth="2.5" d="m10 17l5-5m0 0l-5-5" />
|
||||
</svg>
|
||||
</span>
|
||||
</Button>
|
||||
</div>
|
||||
)}
|
||||
{/* Tombol See More / See Less */}
|
||||
{contentSatker?.length > 3 && (
|
||||
<div className="flex items-center flex-row justify-start mt-6">
|
||||
<Button
|
||||
onClick={() => setSeeAllValueSatker(!seeAllValueSatker)}
|
||||
className="bg-white hover:bg-[#bb3523] text-[#bb3523] hover:text-white border-2 border-[#bb3523]"
|
||||
>
|
||||
{seeAllValueSatker ? t("seeLess") : t("seeMore")}{" "}
|
||||
<span className="text-[#bb3523] hover:text-white">
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
width="24"
|
||||
height="24"
|
||||
viewBox="0 0 24 24"
|
||||
>
|
||||
<path
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
strokeLinecap="round"
|
||||
strokeLinejoin="round"
|
||||
strokeWidth="2.5"
|
||||
d="m10 17l5-5m0 0l-5-5"
|
||||
/>
|
||||
</svg>
|
||||
</span>
|
||||
</Button>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -31,9 +31,9 @@ export async function getCsrfToken() {
|
|||
// }
|
||||
}
|
||||
|
||||
export async function getHeroData(isInt: Boolean = false) {
|
||||
export async function getHeroData(isInt: Boolean = false, unitType= "") {
|
||||
return await httpGetInterceptor(
|
||||
`media/public/list?enablePage=1&sort=desc&sortBy=createdAt&size=5&page=0&typeId=1&title=&categoryId=&fileFormats=&tags=&group=&startDate=&endDate=&month=&year=&isInt=${isInt}`
|
||||
`media/public/list?enablePage=1&sort=desc&sortBy=createdAt&size=5&page=0&typeId=1&title=&categoryId=&fileFormats=&tags=&group=&startDate=&endDate=&month=&year=&isInt=${isInt}${unitType==""?"":unitType=='polda'?'&isAllPolda=true':'&isAllSatker=true'}`
|
||||
);
|
||||
}
|
||||
|
||||
|
|
|
|||
Loading…
Reference in New Issue