diff --git a/src/pages/Transaction/Product.js b/src/pages/Transaction/Product.js
index 90b7403..57da716 100644
--- a/src/pages/Transaction/Product.js
+++ b/src/pages/Transaction/Product.js
@@ -21,7 +21,11 @@ export const Product = observer(() => {
   const store = useStore();
   const modalLoader = useContext(ModalLoaderContext);
   const [form] = Form.useForm();
+  const [formBuyPostPaid] = Form.useForm();
+  const [formBill] = Form.useForm();
   const [visibleModalBuy, setVisibleModalBuy] = useState(false);
+  const [visibleModalBill, setVisibleModalBill] = useState(false);
+  const [visibleModalBuyPostpaid, setVisibleModalBuyPostpaid] = useState(false);
   const [barang, setBarang] = useState({});
 
   useEffect(() => {
@@ -53,19 +57,80 @@ export const Product = observer(() => {
     modalLoader.setLoading(false);
   };
 
-  const handleBuyProduct = async (data, productCode, productId) => {
+  const handleBuyProduct = async (data, productCode, productId, productType, billTrxId) => {
+    modalLoader.setLoading(true);
+    if (productType == "prepaid") {
+      try {
+        const response = await store.transaction.buyProd({
+          ...data,
+          productCode: productCode,
+          productId: productId
+        });
+
+        if (response.status === 201) {
+          message.success(response?.body?.message || "Berhasil Beli Produk");
+        } else {
+          message.error(response?.body?.error || "Gagal Beli Produk", 3);
+        }
+      } catch (e) {
+        console.log("testingan");
+        console.log(e.response, "testingan");
+        console.log(e.result, "testingan1");
+        if (e.response?.body?.error) {
+          message.error(e.response.body.error);
+          setVisibleModalBuy(false);
+          modalLoader.setLoading(false);
+          return;
+        }
+        console.log(e, "apa errornya");
+        message.error("Gagal Beli Product");
+      }
+    } else {
+      try {
+        const response = await store.transaction.buyProd({
+          ...data,
+          productCode: productCode,
+          productId: productId,
+            billTrxId: billTrxId
+        });
+
+        if (response.status === 201) {
+          message.success(response?.body?.message || "Berhasil Bayar Produk");
+        } else {
+          message.error(response?.body?.error || "Gagal Bayar Produk", 3);
+        }
+      } catch (e) {
+        console.log("testingan");
+        console.log(e.response, "testingan");
+        console.log(e.result, "testingan1");
+        if (e.response?.body?.error) {
+          message.error(e.response.body.error);
+          setVisibleModalBuy(false);
+          modalLoader.setLoading(false);
+          return;
+        }
+        console.log(e, "apa errornya");
+        message.error("Gagal Bayar Product");
+      }
+    }
+    setVisibleModalBuyPostpaid(false)
+    setVisibleModalBuy(false);
+    modalLoader.setLoading(false);
+  };
+
+  const handleCheckBill = async (data, productCode, productId) => {
     modalLoader.setLoading(true);
     try {
-      const response = await store.transaction.buyProd({
+      const response = await store.transaction.checkBill({
         ...data,
         productCode: productCode,
         productId: productId
       });
 
       if (response.status === 201) {
-        message.success(response?.body?.message || "Berhasil Beli Produk");
+        message.success(response?.body?.message || "Berhasil Cek Produk");
       } else {
-        message.error(response?.body?.error || "Gagal Beli Produk", 3);
+        message.error(response?.body?.error || "Gagal Cek Produk", 3);
       }
     } catch (e) {
       console.log("testingan");
@@ -78,9 +143,9 @@ export const Product = observer(() => {
         return;
       }
       console.log(e, "apa errornya");
-      message.error("Gagal Beli Product");
+      message.error("Gagal Cek Product");
     }
-    setVisibleModalBuy(false);
+    setVisibleModalBill(false);
     modalLoader.setLoading(false);
   };
 
@@ -164,7 +229,11 @@ export const Product = observer(() => {
             <Col key={index} xs={24} md={16} lg={8}>
               <Card
                 onClick={() => {
-                  setVisibleModalBuy(true);
+                    if (item.product_type == "prepaid") {
+                        setVisibleModalBuy(true);
+                    } else {
+                        setVisibleModalBuyPostpaid(true)
+                    }
                   setBarang(item);
                 }}
                 hoverable
@@ -220,16 +289,16 @@ export const Product = observer(() => {
               marginRight:10
             }}
             onClick={() => {
-              form
-                .validateFields()
-                .then((values) => {
-                  console.log(values, "isi form");
-                  handleBuyProduct(values, barang.product_code, barang.product_id);
-                  form.resetFields();
-                })
-                .catch((info) => {
-                  console.error("Validate Failed:", info);
-                });
+                form
+                    .validateFields()
+                    .then((values) => {
+                      console.log(values, "isi form");
+                      handleBuyProduct(values, barang.product_code, barang.product_id, barang.product_type, "");
+                      form.resetFields();
+                    })
+                    .catch((info) => {
+                      console.error("Validate Failed:", info);
+                    });
             }}
           >
             Beli
@@ -254,6 +323,7 @@ export const Product = observer(() => {
           // </Button>,
         ]}
       >
+
         <Form form={form} layout="vertical">
           <Form.Item
             name="destination"
@@ -277,6 +347,202 @@ export const Product = observer(() => {
           </Form.Item>
         </Form>
       </Modal>
+
+
+      <Modal
+          visible={visibleModalBuyPostpaid}
+          title={`Apakah anda yakin membeli ${barang?.product_name}?`}
+          okText={"Confirm"}
+          onCancel={() => {
+            formBuyPostPaid.resetFields();
+            setVisibleModalBuyPostpaid(false);
+          }}
+          // footer={footerLayoutFilter}
+          footer={[
+            <Button
+                key="back"
+                style={{
+                  backgroundColor: "#e74e5e",
+                  color: "#fff",
+                }}
+                onClick={() => {
+                  formBuyPostPaid.resetFields();
+                  setVisibleModalBuyPostpaid(false);
+                }}
+            >
+              Batal
+            </Button>,
+            <Button
+                key="Beli"
+                style={{
+                  backgroundColor: "#4e79e7",
+                  color: "#fff",
+                  marginRight:10
+                }}
+                onClick={() => {
+                    formBuyPostPaid
+                        .validateFields()
+                        .then((destination, billTrxId) => {
+                          console.log(destination, "isi form");
+                          handleBuyProduct(destination, barang.product_code, barang.product_id, barang.product_type, billTrxId);
+                          formBuyPostPaid.resetFields();
+                            setVisibleModalBuyPostpaid(false);
+                        })
+                        .catch((info) => {
+                          console.error("Validate Failed:", info);
+                        });
+
+                }}
+            >
+              Beli
+            </Button>,
+            // <Button
+            //   key="Beli Stag"
+            //   type="primary"
+            //   onClick={() => {
+            //     form
+            //       .validateFields()
+            //       .then((values) => {
+            //         console.log(values, "isi form");
+            //         handleBuyStag(values, barang.product_code);
+            //         form.resetFields();
+            //       })
+            //       .catch((info) => {
+            //         console.error("Validate Failed:", info);
+            //       });
+            //   }}
+            // >
+            //   Beli Staging
+            // </Button>,
+          ]}
+      >
+        <Row
+            justify={"end"}
+            align={"end"}
+        >
+          <Button
+              onClick={() => {
+                setVisibleModalBill(true);
+                setVisibleModalBuyPostpaid(false)
+              }}
+              style={{
+                backgroundColor: "#4e79e7",
+                color: "#fff",
+              }}
+          >
+            Cek Bill Postpaid
+          </Button>
+        </Row>
+        <Form form={formBuyPostPaid} layout="vertical">
+          <Form.Item
+              name="destination"
+              label="Nomor Tujuan"
+              rules={[
+                {
+                  required: true,
+                  message: "Tolong masukan nomor tujuan!",
+                },
+                // {
+                //   pattern: /^(?:\d*)$/,
+                //   message: "Value should contain just number",
+                // },
+                // {
+                //   pattern: /^[\d]{1,12}$/,
+                //   message: "Value should be 1 - 12 character",
+                // },
+              ]}
+          >
+            <Input />
+          </Form.Item>
+
+          <Form.Item
+              name="bill_trx_id"
+              label="Id Transaksi"
+              rules={[
+                {
+                  required: true,
+                  message: "Tolong masukan Id Transaksi!",
+                }
+              ]}
+          >
+            <Input />
+          </Form.Item>
+        </Form>
+
+      </Modal>
+
+      <Modal
+          visible={visibleModalBill}
+          title={`Cek Bill ${barang?.product_name}`}
+          okText={"Confirm"}
+          onCancel={() => {
+            formBill.resetFields();
+            setVisibleModalBill(false);
+          }}
+          // footer={footerLayoutFilter}
+          footer={[
+            <Button
+                key="back"
+                style={{
+                  backgroundColor: "#e74e5e",
+                  color: "#fff",
+                }}
+                onClick={() => {
+                  formBill.resetFields();
+                  setVisibleModalBill(false);
+                }}
+            >
+              Batal
+            </Button>,
+            <Button
+                key="Cek"
+                style={{
+                  backgroundColor: "#4e79e7",
+                  color: "#fff",
+                  marginRight:10
+                }}
+                onClick={() => {
+                  formBill
+                      .validateFields()
+                      .then((values) => {
+                        console.log(values, "isi form");
+                        handleCheckBill(values, barang.product_code, barang.product_id)
+                        formBill.resetFields();
+                          setVisibleModalBill(false);
+                      })
+                      .catch((info) => {
+                        console.error("Validate Failed:", info);
+                      });
+                }}
+            >
+              Cek Bill
+            </Button>
+          ]}
+      >
+        <Form form={formBill} layout="vertical">
+          <Form.Item
+              name="destination"
+              label="Nomor Tujuan"
+              rules={[
+                {
+                  required: true,
+                  message: "Tolong masukan nomor tujuan!",
+                },
+                // {
+                //   pattern: /^(?:\d*)$/,
+                //   message: "Value should contain just number",
+                // },
+                // {
+                //   pattern: /^[\d]{1,12}$/,
+                //   message: "Value should be 1 - 12 character",
+                // },
+              ]}
+          >
+            <Input />
+          </Form.Item>
+        </Form>
+      </Modal>
+
     </div>
   );
 });
diff --git a/src/store/transaction.js b/src/store/transaction.js
index 8c98ca6..54b9c09 100644
--- a/src/store/transaction.js
+++ b/src/store/transaction.js
@@ -222,6 +222,12 @@ export class Transaction {
     return response;
   }
 
+  async checkBill(data) {
+    const response = await http.post("/transaction/check-bill").send(data);
+    console.log(response)
+    return response;
+  }
+
   async update(id, data) {
     try {
       const response = await http.put(`/product/${id}`).send(data);