diff --git a/src/component/PartnerComponent.js b/src/component/PartnerComponent.js
index cfddd6f..7e3adf0 100644
--- a/src/component/PartnerComponent.js
+++ b/src/component/PartnerComponent.js
@@ -402,7 +402,7 @@ export const PartnerComponent = observer((props) => {
                     },
               ]}
             >
-              <Input />
+            <Input.Password />
             </Form.Item>
           )}
           {!idData && (
diff --git a/src/pages/Login/Login.js b/src/pages/Login/Login.js
index a0df820..7e406ac 100644
--- a/src/pages/Login/Login.js
+++ b/src/pages/Login/Login.js
@@ -23,9 +23,17 @@ export const Login = observer(() => {
       }
       message.error(e.message);
     }
-    store.authentication.userData.role === "Retail"
-      ? history.push(LINKS.TRANSACTION)
-      : history.push(LINKS.HOME);
+    
+    if (
+      store.authentication.userData.role === "Sales" ||
+      store.authentication.userData.role === "Supervisor"
+    ) {
+      history.push(LINKS.MEMBERSHIP);
+    } else if (store.authentication.userData.role === "Retail") {
+      history.push(LINKS.TRANSACTION);
+    } else {
+      history.push(LINKS.HOME);
+    }
   };
 
   return (
diff --git a/src/pages/Membership/DetailUser.js b/src/pages/Membership/DetailUser.js
index 159bc47..9f4fb16 100644
--- a/src/pages/Membership/DetailUser.js
+++ b/src/pages/Membership/DetailUser.js
@@ -10,7 +10,7 @@ import {
   Typography,
   Tabs,
   List,
-  Divider
+  Divider,
 } from "antd";
 import { BreadcumbComponent } from "../../component/BreadcumbComponent";
 import { LINKS } from "../../routes/app";
@@ -206,23 +206,101 @@ export const DetailUser = observer(() => {
   ];
 
   const styleSaldoTitle = store.ui.mediaQuery.isDesktop
-      ? {
+    ? {
         display: "flex",
         justifyContent: "center",
       }
-      : { fontSize: "0.75rem" };
+    : { fontSize: "0.75rem" };
   const styleSaldoContent = store.ui.mediaQuery.isDesktop
-      ? {
+    ? {
         fontSize: "1.25rem",
         display: "flex",
         justifyContent: "center",
       }
-      : null;
+    : null;
   return (
     <div className={["ppob-container"].join(" ")}>
       <BreadcumbComponent data={routeData} />
       <Card>
-        <Title strong>Detail User</Title>
+        <Row style={{marginBottom:10}}>
+          <Title strong level={2} >Detail User</Title>
+          <Col lg={20} xs={20} style={{ textAlign: "right" }}>
+            {store.authentication.userData.role === "Admin" && (
+              <Space
+                size="middle"
+                align={"center"}
+                wrap={true}
+                style={{ textAlign: "center" }}
+              >
+                <Button
+                  type={
+                    store.membership.dataDetail.isActive === true
+                      ? "danger"
+                      : "primary"
+                  }
+                  onClick={() =>
+                    changeStatus(
+                      store.membership.dataDetail.id,
+                      store.membership.dataDetail.isActive
+                    )
+                  }
+                >
+                  {store.membership.dataDetail.isActive === true
+                    ? "Inactive"
+                    : "Active"}
+                </Button>
+                <Button
+                  onClick={() => {
+                    setInitialData({
+                      id: store.membership.dataDetail.id,
+                      name: store.membership.dataDetail.userDetail.name,
+                      username: store.membership.dataDetail.username,
+                      phone_number:
+                        store.membership.dataDetail.userDetail.phone_number,
+                      roleId: store.membership.dataDetail.roles.id,
+                      isChangePassword: false,
+                    });
+                    setVisibleModal(true);
+                  }}
+                >
+                  Edit
+                </Button>
+                <Button
+                  onClick={() => {
+                    setInitialData({
+                      id: store.membership.dataDetail.id,
+                      name: store.membership.dataDetail.userDetail.name,
+                      username: store.membership.dataDetail.username,
+                      phone_number:
+                        store.membership.dataDetail.userDetail.phone_number,
+                      roleId: store.membership.dataDetail.roles.id,
+                      isChangePassword: true,
+                    });
+                    setVisibleModal(true);
+                  }}
+                >
+                  Ganti Password
+                </Button>
+                <Button
+                  type={
+                    store.membership.dataDetail.isActive === true
+                      ? "danger"
+                      : "primary"
+                  }
+                  onClick={() =>
+                    changeStatus(
+                      store.membership.dataDetail.id,
+                      store.membership.dataDetail.isActive
+                    )
+                  }
+                >
+                  Withdraw Profit
+                </Button>
+              </Space>
+            )}
+          </Col>
+        </Row>
+
         <Row style={{ marginBottom: 20 }}>
           <Col lg={12} xs={24}>
             <Row>
@@ -266,86 +344,6 @@ export const DetailUser = observer(() => {
           </Col>
           <Col lg={12} xs={24}>
             <Row>
-              <Col lg={24} xs={24} style={{marginBottom: 30}}>
-                {store.authentication.userData.role === "Admin" && (
-                    <Title strong level={3}>
-                      Action User Detail
-                    </Title>
-                )}
-                {store.authentication.userData.role === "Admin" && (
-                    <Space
-                        size="middle"
-                        align={"center"}
-                        wrap={true}
-                        style={{ textAlign: "center" }}
-                    >
-                      <Button
-                          type={
-                            store.membership.dataDetail.isActive === true
-                                ? "danger"
-                                : "primary"
-                          }
-                          onClick={() =>
-                              changeStatus(
-                                  store.membership.dataDetail.id,
-                                  store.membership.dataDetail.isActive
-                              )
-                          }
-                      >
-                        {store.membership.dataDetail.isActive === true
-                            ? "Inactive"
-                            : "Active"}
-                      </Button>
-                      <Button
-                          onClick={() => {
-                            setInitialData({
-                              id: store.membership.dataDetail.id,
-                              name: store.membership.dataDetail.userDetail.name,
-                              username: store.membership.dataDetail.username,
-                              phone_number:
-                              store.membership.dataDetail.userDetail.phone_number,
-                              roleId: store.membership.dataDetail.roles.id,
-                              isChangePassword: false,
-                            });
-                            setVisibleModal(true);
-                          }}
-                      >
-                        Edit
-                      </Button>
-                      <Button
-                          onClick={() => {
-                            setInitialData({
-                              id: store.membership.dataDetail.id,
-                              name: store.membership.dataDetail.userDetail.name,
-                              username: store.membership.dataDetail.username,
-                              phone_number:
-                              store.membership.dataDetail.userDetail.phone_number,
-                              roleId: store.membership.dataDetail.roles.id,
-                              isChangePassword: true,
-                            });
-                            setVisibleModal(true);
-                          }}
-                      >
-                        Ganti Password
-                      </Button>
-                      <Button
-                          type={
-                            store.membership.dataDetail.isActive === true
-                                ? "danger"
-                                : "primary"
-                          }
-                          onClick={() =>
-                              changeStatus(
-                                  store.membership.dataDetail.id,
-                                  store.membership.dataDetail.isActive
-                              )
-                          }
-                      >
-                        Withdraw Profit
-                      </Button>
-                    </Space>
-                )}
-              </Col>
               <Col lg={24} xs={24}>
                 <Row>
                   <Col lg={12} xs={12}>
@@ -360,7 +358,9 @@ export const DetailUser = observer(() => {
                           {new Intl.NumberFormat("id-ID", {
                             style: "currency",
                             currency: "IDR",
-                          }).format(store.authentication.profileData?.wallet || 0)}
+                          }).format(
+                            store.authentication.profileData?.wallet || 0
+                          )}
                         </Text>
                       </Col>
                       <Col></Col>
@@ -378,7 +378,9 @@ export const DetailUser = observer(() => {
                           {new Intl.NumberFormat("id-ID", {
                             style: "currency",
                             currency: "IDR",
-                          }).format(store.authentication.profileData?.profit || 0)}
+                          }).format(
+                            store.authentication.profileData?.profit || 0
+                          )}
                         </Text>
                       </Col>
                       <Col></Col>
@@ -429,12 +431,18 @@ export const DetailUser = observer(() => {
                     key="1"
                     hasEmpty
                     columns={column}
-                    dataSource={store.transaction.dataDetailHistoryTransactionDetailUser}
+                    dataSource={
+                      store.transaction.dataDetailHistoryTransactionDetailUser
+                    }
                     bordered
                     pagination={{
-                      pageSize: store.transaction.pageSizeHistoryTransactionDetailUser,
-                      total: store.transaction.total_dataDetailHistoryTransactionDetailUser,
-                      current: store.transaction.pageHistoryTransactionDetailUser + 1,
+                      pageSize:
+                        store.transaction.pageSizeHistoryTransactionDetailUser,
+                      total:
+                        store.transaction
+                          .total_dataDetailHistoryTransactionDetailUser,
+                      current:
+                        store.transaction.pageHistoryTransactionDetailUser + 1,
                       showSizeChanger: true,
                       simple: false,
                     }}
diff --git a/src/pages/Membership/Membership.js b/src/pages/Membership/Membership.js
index 48da62c..f147f7e 100644
--- a/src/pages/Membership/Membership.js
+++ b/src/pages/Membership/Membership.js
@@ -51,6 +51,7 @@ export const Membership = observer(() => {
         modalLoader.setLoading(true);
         const isAdmin = store.authentication.userData.role === "Admin";
         await getData();
+        await store.membership.getData();
         await store.membership.getDataBySuperior();
         await store.partner.getData();
         await store.role.getData(isAdmin);
@@ -220,7 +221,7 @@ export const Membership = observer(() => {
           <Button
             onClick={async () => {
               await store.transaction.getDataHistoryTopUp(record.id);
-              await store.transaction.getDetailHistoryTransaction(record.id)
+              await store.transaction.getDetailHistoryTransaction(record.id);
               //await store.transaction.getDataHistoryTransaction()
               history.push(LINKS.USER_DETAIL.replace(":id", record.id));
               console.log(record.id);
@@ -335,7 +336,11 @@ export const Membership = observer(() => {
               key="1"
               hasEmpty
               columns={columns}
-              dataSource={store.membership.data}
+              dataSource={
+                store.authentication.userData.role === "Admin"
+                  ? store.membership.dataMember
+                  : store.membership.data
+              }
               bordered
               pagination={{
                 pageSize: store.membership.pageSize,
diff --git a/src/pages/Transaction/Product.js b/src/pages/Transaction/Product.js
index 311d29b..1077e5c 100644
--- a/src/pages/Transaction/Product.js
+++ b/src/pages/Transaction/Product.js
@@ -1,6 +1,16 @@
 import React, { useContext, useEffect, useState } from "react";
 import { useStore } from "../../utils/useStore";
-import { Card, Col, Form, Input, message, Modal, Row, Select } from "antd";
+import {
+  Card,
+  Col,
+  Form,
+  Input,
+  message,
+  Modal,
+  Row,
+  Select,
+  Button,
+} from "antd";
 import { observer } from "mobx-react-lite";
 import { ModalLoaderContext } from "../../utils/modal";
 
@@ -12,6 +22,7 @@ export const Product = observer(() => {
   const modalLoader = useContext(ModalLoaderContext);
   const [form] = Form.useForm();
   const [visibleModalBuy, setVisibleModalBuy] = useState(false);
+  const [barang, setBarang] = useState({});
 
   useEffect(() => {
     const init = async () => {
@@ -45,7 +56,7 @@ export const Product = observer(() => {
   const handleBuyProduct = async (data, productCode) => {
     modalLoader.setLoading(true);
     try {
-      const response = await store.transaction.buyProduct({
+      const response = await store.transaction.buyProd({
         ...data,
         productCode: productCode,
       });
@@ -116,6 +127,7 @@ export const Product = observer(() => {
               <Card
                 onClick={() => {
                   setVisibleModalBuy(true);
+                  setBarang(item);
                 }}
                 hoverable
                 style={{
@@ -126,7 +138,7 @@ export const Product = observer(() => {
                   marginBottom: 10,
                 }}
               >
-                <span style={{ color: "black" }}>{item.product_name}</span>
+                <span style={{ color: "black" }}>{item?.product_name}</span>
                 <br />
                 <span style={{ color: "grey", fontSize: 10 }}>
                   {new Intl.NumberFormat("id-ID", {
@@ -135,56 +147,105 @@ export const Product = observer(() => {
                   }).format(item?.price)}
                 </span>
               </Card>
-
-              <Modal
-                visible={visibleModalBuy}
-                title={`Are you sure buy ${item.product_name}?`}
-                okText={"Confirm"}
-                cancelText="Cancel"
-                onCancel={() => {
-                  form.resetFields();
-                  handleCancel();
-                }}
-                onOk={() => {
-                  form
-                    .validateFields()
-                    .then((values) => {
-                      console.log(values, "isi form");
-                      handleBuyProduct(values, item.product_code);
-                      form.resetFields();
-                    })
-                    .catch((info) => {
-                      console.error("Validate Failed:", info);
-                    });
-                }}
-              >
-                <Form form={form} layout="vertical">
-                  <Form.Item
-                    name="destination"
-                    label="Destination"
-                    rules={[
-                      {
-                        required: true,
-                        message: "Please input Destination Number!",
-                      },
-                      {
-                        pattern: /^(?:\d*)$/,
-                        message: "Value should contain just number",
-                      },
-                      {
-                        pattern: /^[\d]{2,12}$/,
-                        message: "Value should be less than 12 character",
-                      },
-                    ]}
-                  >
-                    <Input />
-                  </Form.Item>
-                </Form>
-              </Modal>
             </Col>
           ))}
         </Row>
       )}
+      <Modal
+        visible={visibleModalBuy}
+        title={`Are you sure buy ${barang?.product_name}?`}
+        okText={"Confirm"}
+        onCancel={() => {
+          form.resetFields();
+          setVisibleModalBuy(false);
+        }}
+        // footer={footerLayoutFilter}
+        footer={[
+          <Button
+            key="back"
+            style={{
+              backgroundColor: "#e74e5e",
+              color: "#fff",
+            }}
+            onClick={() => {
+              form.resetFields();
+              handleCancel();
+            }}
+          >
+            Cancel
+          </Button>,
+          <Button
+            key="submit"
+            style={{
+              backgroundColor: "#4e79e7",
+              color: "#fff",
+            }}
+            onClick={() => {
+              form
+                .validateFields()
+                .then((values) => {
+                  console.log(values, "isi form");
+                  handleBuyProduct(values, barang.product_code);
+                  form.resetFields();
+                })
+                .catch((info) => {
+                  console.error("Validate Failed:", info);
+                });
+            }}
+          >
+            Buy Prod
+          </Button>,
+          <Button
+            key="link"
+            href="https://google.com"
+            type="primary"
+            // loading={loading}
+            // onClick={this.handleOk}
+          >
+            Buy Staging
+          </Button>,
+        ]}
+        // cancelText="Cancel"
+        // onCancel={() => {
+        //   form.resetFields();
+        //   handleCancel();
+        // }}
+        // onOk={() => {
+        //   form
+        //     .validateFields()
+        //     .then((values) => {
+        //       console.log(values, "isi form");
+        //       handleBuyProduct(values, item.product_code);
+        //       form.resetFields();
+        //     })
+        //     .catch((info) => {
+        //       console.error("Validate Failed:", info);
+        //     });
+        // }}
+      >
+        <Form form={form} layout="vertical">
+          <Form.Item
+            name="destination"
+            label="Destination"
+            rules={[
+              {
+                required: true,
+                message: "Please input Destination Number!",
+              },
+              {
+                pattern: /^(?:\d*)$/,
+                message: "Value should contain just number",
+              },
+              {
+                pattern: /^[\d]{2,12}$/,
+                message: "Value should be less than 12 character",
+              },
+            ]}
+          >
+            <Input />
+          </Form.Item>
+        </Form>
+      </Modal>
     </div>
   );
 });
diff --git a/src/store/membership.js b/src/store/membership.js
index 2c86220..435138f 100644
--- a/src/store/membership.js
+++ b/src/store/membership.js
@@ -8,6 +8,7 @@ export class Membership {
     totalData = 0;
 
     dataDetail = {};
+    dataMember=[];
 
 
     //filter
@@ -22,10 +23,10 @@ export class Membership {
     async getData() {
         try {
             const response = await http.get(`/users?page=${this.page}&pageSize=${this.pageSize}&superior=${this.filterMembership}&type=${this.filterPartner}`);
-            // console.log(this.filterMembership)
+             console.log(this.filterMembership)
             // console.log(this.filterPartner)
              console.log(response)
-            this.data = response.body.data.map((item, idx) => {
+            this.dataMember = response.body.data.map((item, idx) => {
                 item.key = idx;
                 item.name = item?.user_detail?.name;
                 item.phone_number = item?.user_detail?.phone_number;
diff --git a/src/store/transaction.js b/src/store/transaction.js
index 8cddde4..d540353 100644
--- a/src/store/transaction.js
+++ b/src/store/transaction.js
@@ -176,6 +176,15 @@ export class Transaction {
     }
   }
 
+  async buyProd(data) {
+    try {
+      const response = await http.post("//transaction/order-prod").send(data);
+      return response;
+    } catch (e) {
+      console.error(e);
+    }
+  }
+
   async update(id, data) {
     try {
       const response = await http.put(`/product/${id}`).send(data);