asset filter in home, button "cambiar" on csv selectable link variant,

button publish and unpublish on form asset, add next button to form
DemocraciaEnRed · Oct 25, 2024 · 3fa6336 · 3fa6336
1 parent b33b7f5
commit 3fa6336
Show file tree

Hide file tree

Showing 17 changed files with 307 additions and 78 deletions.
diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -31,6 +31,7 @@
     "@radix-ui/react-switch": "^1.0.3",
     "@radix-ui/react-tabs": "^1.1.0",
     "@radix-ui/react-toast": "^1.2.1",
+    "@radix-ui/react-tooltip": "^1.1.3",
     "axios": "^1.7.7",
     "bcrypt": "^5.1.1",
     "class-variance-authority": "^0.7.0",

diff --git a/src/app/api/[...]/asset.js b/src/app/api/[...]/asset.js
@@ -1,7 +1,7 @@
 import { paramsValidate, queryValidate } from "@/lib/validators/data-validate";
 import { assetIdSchema, queryAssetDownloadSchema, queryAssetListSchema } from "@/lib/validators/data-validate/assets";
 import NextApiRouter from "@billyen2012/next-api-router";
-import { archive, create, download, get, list, update } from "../_lib/controllers/assetsController";
+import { archive, create, download, get, list, publish, update } from "../_lib/controllers/assetsController";
 import validate from "@/lib/validators/validate";
 import { authorize } from "../_lib/middlewares/authorize";
 import { userRoles } from "@/lib/utils/constants";
@@ -54,6 +54,13 @@ router.get('/archive/:assetId',
   archive
 )
 
+router.get('/publish/:assetId',
+  authorize([userRoles.ADMIN, userRoles.GESTOR]),
+  paramsValidate(assetIdSchema),
+  validate,
+  publish
+)
+
 router.get('/download',
   queryValidate(queryAssetDownloadSchema),
   validate,

diff --git a/src/app/api/_lib/controllers/assetsController.js b/src/app/api/_lib/controllers/assetsController.js
@@ -88,7 +88,7 @@ export const create = async function (req, res) {
 
     const asset = await Asset.create(data);
 
-    return res.status(200).json({ message: 'ok' });
+    return res.status(200).json({ asset });
   } catch (error) {
     console.error(error)
     return res.status(500).json({ message: messages.error.default })
@@ -136,6 +136,25 @@ export const archive = async function (req, res) {
   }
 }
 
+export const publish = async function (req, res) {
+  try {
+    const assetId = req.params.assetId;
+    const now = new Date()
+    const asset = await Asset.findById(assetId)
+    if (asset.publish) {
+      asset.set({ publish: false })
+    } else {
+      asset.set({ publish: true })
+    }
+    await asset.save()
+
+    return res.status(200).json(asset);
+  } catch (error) {
+    console.error(error);
+    return res.status(500).json({ message: messages.error.default });
+  }
+}
+
 export const download = async function (req, res) {
   try {
 

diff --git a/src/app/layout.jsx b/src/app/layout.jsx
@@ -2,6 +2,7 @@ import { Inter } from "next/font/google";
 import "./globals.css";
 import Navbar from "@/components/layout/navbar";
 import { Toaster } from "@/components/ui/toaster";
+import { TooltipProvider } from "@radix-ui/react-tooltip";
 
 const inter = Inter({ subsets: ["latin"] });
 
@@ -14,9 +15,11 @@ export default function RootLayout({ children }) {
   return (
     <html lang="en">
       <body className={inter.className}>
-        <Navbar />
-        {children}
-        <Toaster />
+        <TooltipProvider>
+          <Navbar />
+          {children}
+          <Toaster />
+        </TooltipProvider>
       </body>
     </html>
   );

diff --git a/src/app/page.jsx b/src/app/page.jsx
@@ -9,16 +9,15 @@ import DownloadButton from "@/components/admin/asset/download-button";
 
 export const dynamic = "force-dynamic";
 
-export default function Home({ searchParams }) {
+export default function Home({ searchParams: { estado, search, page } }) {
+  const destination = estado;
   return (
     <div>
       <BannerHome />
       <div className="container">
         <div className="mt-3 flex justify-between items-center">
           <h2 className="text-2xl font-bold mr-5 my-5">Buscador de bienes</h2>
-          <DownloadButton
-            filter={{ archivedAt: null, search: searchParams.search }}
-          />
+          <DownloadButton filter={{ archivedAt: null, search: search }} />
         </div>
         <Suspense
           fallback={
@@ -41,9 +40,11 @@ export default function Home({ searchParams }) {
             <TabsContent value="list">
               <AssetListHome
                 filter={{
-                  search: searchParams.search,
-                  page: searchParams.page || 1,
+                  destination,
+                  search,
+                  page: page || 1,
                   limit: 20,
+                  publish: true,
                 }}
               />
             </TabsContent>

diff --git a/src/components/admin/asset/asset-list.jsx b/src/components/admin/asset/asset-list.jsx
@@ -1,7 +1,7 @@
 import React from "react";
-import AssetCard from "./asset-card";
 import { getAssets } from "@/lib/actions/home/fetch-data";
 import AssetPagination from "@/components/asset-pagination";
+import AssetCard from "./assetCard";
 
 async function AssetList({ filter = {} }) {
   const { assets, page, total, pages, nextPage, prevPage, status, message } =

diff --git a/src/components/admin/asset/asset-serch.jsx b/src/components/admin/asset/asset-serch.jsx
@@ -8,6 +8,8 @@ import {
   DropdownMenu,
   DropdownMenuContent,
   DropdownMenuItem,
+  DropdownMenuRadioGroup,
+  DropdownMenuRadioItem,
   DropdownMenuTrigger,
 } from "@/components/ui/dropdown-menu";
 import { FilterIcon } from "lucide-react";
@@ -16,6 +18,7 @@ const AssetSerch = () => {
   const router = useRouter();
   const pathname = usePathname();
   const searchParams = useSearchParams();
+  const [filter, setFilter] = useState("todos");
   const [searchValue, setSearchValue] = useState(
     searchParams.get("search") || ""
   );
@@ -49,6 +52,23 @@ const AssetSerch = () => {
 
     router.push(`${pathname}${query}`);
   };
+
+  const handleFilter = (value) => {
+    const params = new URLSearchParams(searchParams.entries());
+
+    if (!value) {
+      params.delete("estado");
+    } else {
+      params.set("estado", value);
+      params.delete("page");
+    }
+    const estado = params.toString();
+    const query = estado ? `?${estado}` : "";
+
+    router.push(`${pathname}${query}`);
+    setFilter(value);
+  };
+
   return (
     <div className="flex flex-row w-full gap-3">
       <div className="w-4/5">
@@ -61,20 +81,31 @@ const AssetSerch = () => {
           className="shadow-md rounded-lg"
         />
       </div>
-      <div className="w-1/5">
-        <DropdownMenu>
-          <DropdownMenuTrigger className="w-full flex justify-center text-start">
-            <span className="p-2 pl-4 w-full bg-white flex flex-row gap-3 shadow-md rounded-lg">
-              <FilterIcon className="text-orange-500" /> Filtrar
-            </span>
-          </DropdownMenuTrigger>
-          <DropdownMenuContent>
-            <DropdownMenuItem>Supiti</DropdownMenuItem>
-            <DropdownMenuItem>Upiti</DropdownMenuItem>
-            <DropdownMenuItem>Uapiti</DropdownMenuItem>
-          </DropdownMenuContent>
-        </DropdownMenu>
-      </div>
+      {!pathname.startsWith("/admin") && (
+        <div className="w-1/5">
+          <DropdownMenu>
+            <DropdownMenuTrigger className="w-full flex justify-center text-start">
+              <span className="p-2 pl-4 w-full bg-white flex flex-row gap-3 shadow-md rounded-lg">
+                <FilterIcon className="text-orange-500" /> Filtrar
+              </span>
+            </DropdownMenuTrigger>
+            <DropdownMenuContent>
+              <DropdownMenuRadioGroup
+                value={filter}
+                onValueChange={handleFilter}
+              >
+                <DropdownMenuRadioItem value="">Todos</DropdownMenuRadioItem>
+                <DropdownMenuRadioItem value="subasta">
+                  Subasta
+                </DropdownMenuRadioItem>
+                <DropdownMenuRadioItem value="reutilizacion">
+                  Reutilizacion
+                </DropdownMenuRadioItem>
+              </DropdownMenuRadioGroup>
+            </DropdownMenuContent>
+          </DropdownMenu>
+        </div>
+      )}
     </div>
   );
 };

diff --git a/src/components/admin/asset/assetCard/card-actions.jsx b/src/components/admin/asset/assetCard/card-actions.jsx
@@ -0,0 +1,77 @@
+import React from "react";
+import { Button, buttonVariants } from "@/components/ui/button";
+import { Pencil, Archive, ArchiveX, BookX, BookUp } from "lucide-react";
+import Link from "next/link";
+import {
+  archiveAsset,
+  togglePublish,
+} from "@/lib/actions/admin/asset-actions/asset";
+import { ToastAction } from "@/components/ui/toast";
+import {
+  Tooltip,
+  TooltipContent,
+  TooltipTrigger,
+} from "@/components/ui/tooltip";
+import { useToast } from "@/components/ui/use-toast";
+
+const CardActions = ({ asset, pathname }) => {
+  const { toast } = useToast();
+  return (
+    <div className="flex flex-col gap-2">
+      <Tooltip delayDuration={300}>
+        <TooltipTrigger>
+          <Link href={`/admin/bien/editar/${asset._id}`}>
+            <Pencil />
+          </Link>
+        </TooltipTrigger>
+        <TooltipContent>
+          <p>Editar</p>
+        </TooltipContent>
+      </Tooltip>
+      <Tooltip>
+        <TooltipTrigger>
+          <div
+            onClick={() =>
+              toast({
+                description: `Confirmar para ${
+                  pathname.includes("archivados") ? "des" : ""
+                }archivar el bien`,
+                action: (
+                  <ToastAction
+                    onClick={() => archiveAsset(asset._id)}
+                    altText="Confirmar"
+                  >
+                    Confirmar
+                  </ToastAction>
+                ),
+              })
+            }
+          >
+            {pathname.includes("archivados") ? <ArchiveX /> : <Archive />}
+          </div>
+        </TooltipTrigger>
+        <TooltipContent>
+          <p>{asset.archivedAt ? "Desarchivar" : "Archivar"}</p>
+        </TooltipContent>
+      </Tooltip>
+      <Tooltip>
+        <TooltipTrigger>
+          <div
+            type="button"
+            onClick={() => {
+              togglePublish(asset._id);
+            }}
+            className="submitButton w-full my-2"
+          >
+            {asset.publish ? <BookX /> : <BookUp />}
+          </div>
+        </TooltipTrigger>
+        <TooltipContent>
+          <p>{asset.publish ? "Despublicar" : "Publicar"}</p>
+        </TooltipContent>
+      </Tooltip>
+    </div>
+  );
+};
+
+export default CardActions;