style: add column type image when create/update service

bps-kota-bontang · Aug 27, 2024 · 9e6958c · 9e6958c
1 parent d9c9b0d
commit 9e6958c
Show file tree

Hide file tree

Showing 3 changed files with 19 additions and 9 deletions.
diff --git a/src/components/service/ServiceItem.tsx b/src/components/service/ServiceItem.tsx
@@ -66,12 +66,15 @@ const ServiceItem = ({ service, onItemDeleted }: ServiceItemProps) => {
 
   return (
     <div className="relative bg-white border rounded-md drop-shadow-sm gap-2 flex flex-col ">
-      <Image
-        preview={false}
-        height={48}
-        src={service.imageUrl}
-      />
-      <div className="p-5">
+      {!service.hasLogo ? (
+        <Image
+          className="object-cover object-top"
+          height={100}
+          preview={false}
+          src={service.imageUrl}
+        />
+      ) : null}
+      <div className="p-5 flex flex-1 flex-col">
         <Dropdown
           menu={{
             items: [
@@ -107,7 +110,7 @@ const ServiceItem = ({ service, onItemDeleted }: ServiceItemProps) => {
             size="small"
           />
         </Dropdown>
-        <div>
+        <div className="flex-1 flex items-center">
           {service.hasLogo ? (
             <Image
               preview={false}
@@ -117,12 +120,12 @@ const ServiceItem = ({ service, onItemDeleted }: ServiceItemProps) => {
             />
           ) : null}
         </div>
-        <div className="flex flex-col justify-center flex-1">
+        <div className="flex flex-col flex-1">
           <div className="text-lg text-black font-semibold">{service.name}</div>
           <div className="text-sm text-gray-500 line-clamp-2 mb-5">
             {service.description}
           </div>
-          <div className=" flex flex-col gap-2 mt-auto">
+          <div className=" flex flex-col gap-2">
             <Button type="primary" onClick={() => handleClick(service.link)}>
               Lihat
             </Button>

diff --git a/src/pages/CreateServicePage.tsx b/src/pages/CreateServicePage.tsx
@@ -202,6 +202,9 @@ const CreateServicePage = () => {
                 <Button icon={<UploadOutlined />}>Click to Upload</Button>
               </Upload>
             </Form.Item>
+            <Form.Item name="hasLogo" valuePropName="checked">
+              <Checkbox>Apakah berupa logo?</Checkbox>
+            </Form.Item>
           </Card.Grid>
           <Card.Grid
             style={{

diff --git a/src/pages/DetailServicePage.tsx b/src/pages/DetailServicePage.tsx
@@ -62,6 +62,7 @@ const DetailServicePage = () => {
         teams: service.teams.map((item: { team: Team }) => item.team.id),
         tags: service.tags,
         image: service.imageUrl,
+        hasLogo: service.hasLogo,
         username: service.credential?.username,
         password: service.credential?.password,
         note: service.credential?.note,
@@ -247,6 +248,9 @@ const DetailServicePage = () => {
                 />
               </Upload>
             </Form.Item>
+            <Form.Item name="hasLogo" valuePropName="checked">
+              <Checkbox>Apakah berupa logo?</Checkbox>
+            </Form.Item>
           </Card.Grid>
           <Card.Grid
             style={{