esoftplay-event 0.0.0-n → 0.0.0-p

package/modules/mart/product_detail.tsx

@@ -0,0 +1,275 @@
+// withHooks
+import { applyStyle } from 'esoftplay';
+import { ComponentBadge } from 'esoftplay/cache/component/badge/import';
+import { ComponentButton } from 'esoftplay/cache/component/button/import';
+import { ComponentTouchable } from 'esoftplay/cache/component/touchable/import';
+import { LibCarrousel } from 'esoftplay/cache/lib/carrousel/import';
+import { LibCurl } from 'esoftplay/cache/lib/curl/import';
+import { LibDialog } from 'esoftplay/cache/lib/dialog/import';
+import { LibIcon } from 'esoftplay/cache/lib/icon/import';
+import { LibLazy } from 'esoftplay/cache/lib/lazy/import';
+import { LibNavigation } from 'esoftplay/cache/lib/navigation/import';
+import { LibPicture } from 'esoftplay/cache/lib/picture/import';
+import { LibProgress } from 'esoftplay/cache/lib/progress/import';
+import { LibScroll } from 'esoftplay/cache/lib/scroll/import';
+import { LibSkeleton } from 'esoftplay/cache/lib/skeleton/import';
+import { LibStatusbar } from 'esoftplay/cache/lib/statusbar/import';
+import { LibStyle } from 'esoftplay/cache/lib/style/import';
+import { LibTextstyle } from 'esoftplay/cache/lib/textstyle/import';
+import { LibToastProperty } from 'esoftplay/cache/lib/toast/import';
+import { LibUtils } from 'esoftplay/cache/lib/utils/import';
+import { MartBagProperty } from 'esoftplay/cache/mart/bag/import';
+import { MartBag_add_slideup } from 'esoftplay/cache/mart/bag_add_slideup/import';
+import { MartEmpty } from 'esoftplay/cache/mart/empty/import';
+import { MartHeader } from 'esoftplay/cache/mart/header/import';
+import { MartProduct_detail_description } from 'esoftplay/cache/mart/product_detail_description/import';
+import { MartProduct_detail_general } from 'esoftplay/cache/mart/product_detail_general/import';
+import { MartProduct_editArgs } from 'esoftplay/cache/mart/product_edit/import';
+import { UseCurl } from 'esoftplay/cache/use/curl/import';
+import { UserProfileProperty } from 'esoftplay/cache/user/profile/import';
+import esp from 'esoftplay/esp';
+import useSafeState from 'esoftplay/state';
+
+import React, { useEffect, useRef } from 'react';
+import { Text, TouchableOpacity, View } from 'react-native';
+
+
+export interface MartProduct_detailArgs {
+
+}
+export interface MartProduct_detailProps {
+
+}
+
+export function renderPrice(price: string, price_max: string, currency: string) {
+  let out = LibUtils.money(price, currency)
+  if (price < price_max)
+    out = LibUtils.money(price, currency) + ' - ' + LibUtils.money(price_max, currency)
+  return out
+}
+
+export default function m(props: MartProduct_detailProps): any {
+  const { url } = LibNavigation.getArgsAll(props)
+  const [data, setData] = useSafeState<any>()
+  const [curl, loading, error] = UseCurl(true)
+  const sliding = useRef<MartBag_add_slideup>(null)
+  const width = (LibStyle.width - 60) / 3
+
+  const bagCount = MartBagProperty.countState().useSelector(s => s)
+
+  function loadData() {
+    curl(url, null,
+      (res, msg) => {
+        setData(res)
+      }, 1)
+  }
+
+  function getMaxPoint(options: any, is_mitra: 0 | 1): any {
+    const max = Math.max.apply(null, options.map((item: any) => is_mitra == 1 ? item.point_mitra : item.point_member))
+    return max
+  }
+
+  useEffect(() => {
+    loadData()
+  }, [])
+
+  const renderOptionBundling = (item: any, i: number) => (
+    <View key={i} style={{ alignItems: 'center', marginRight: 10, marginBottom: 10, width }}>
+      <LibPicture source={{ uri: item?.image }} style={{ width, height: 100, borderRadius: 5, marginBottom: 5 }} />
+      <Text allowFontScaling={false} style={{ fontFamily: 'Arial', fontSize: 10, textAlign: 'center', lineHeight: 14 }} >{item?.title}</Text>
+      <Text allowFontScaling={false} numberOfLines={2} ellipsizeMode='tail' style={{ fontFamily: 'Arial', fontSize: 8 }} >x{item?.qty}</Text>
+    </View>
+  )
+
+  const renderImage = (item: any, i: number) => (
+    <ComponentTouchable key={i.toString()} onPress={() => {
+      LibNavigation.navigate("lib/gallery", { images: data.images, index: i })
+    }} >
+      <LibPicture
+        key={i}
+        source={{ uri: item.image }}
+        style={applyStyle({ height: LibStyle.width * 0.8, width: LibStyle.width })} />
+    </ComponentTouchable>
+  )
+
+
+  if (loading || !data) {
+    return (
+      <View style={{ flex: 1 }}>
+        <LibStatusbar style="dark" />
+        <LibSkeleton>
+          <View style={{ flexDirection: 'row', alignItems: 'center', padding: 15, paddingVertical: 10, paddingTop: LibStyle.STATUSBAR_HEIGHT + 17, borderBottomWidth: 1 }}>
+            <LibIcon name='arrow-left' />
+            <View style={{ height: 32, marginLeft: 15, borderRadius: 20, flexDirection: 'row', padding: 5, alignItems: 'center', flex: 1, marginHorizontal: 12 }}>
+              <View style={{ width: '70%', height: 20, borderRadius: 7, backgroundColor: 'white' }} />
+            </View>
+            <View style={{ height: 30, width: 30, borderRadius: 15, marginLeft: 10, backgroundColor: 'white' }} />
+          </View>
+          <View style={{ height: LibStyle.width * 0.8, width: LibStyle.width, backgroundColor: 'white' }} />
+          <LibSkeleton.BoxHalf size={25} />
+          <View style={{ marginTop: 15 }} />
+          <LibSkeleton.BoxHalf size={20} />
+          <View style={{ marginTop: 10 }} />
+          <View style={{ height: 15, width: '20%', borderRadius: 7.5, backgroundColor: 'white', margin: 10 }} />
+          <View style={{ flexDirection: 'row', alignItems: 'center', margin: 10 }}>
+            <View style={{ height: 30, width: '20%', borderRadius: 10, backgroundColor: 'white', marginRight: 5 }} />
+            <View style={{ height: 30, width: '20%', borderRadius: 10, backgroundColor: 'white', marginRight: 5 }} />
+            <View style={{ height: 30, width: '20%', borderRadius: 10, backgroundColor: 'white', marginRight: 5 }} />
+          </View>
+          <View style={{ height: 15, width: '20%', borderRadius: 7.5, backgroundColor: 'white', margin: 10 }} />
+          <View style={{ height: 15, width: '70%', borderRadius: 7.5, backgroundColor: 'white', margin: 10 }} />
+
+          <View style={{ height: 8, backgroundColor: '#F5F5F5', marginVertical: 15 }} />
+          <LibSkeleton.BoxHalf size={15} />
+          <LibSkeleton.BoxFlex size={15} />
+          <View style={{ height: 8, backgroundColor: '#F5F5F5', marginVertical: 15 }} />
+          <LibSkeleton.BoxHalf size={15} />
+        </LibSkeleton>
+      </View>
+    )
+  }
+
+  return (
+    <>
+      {
+        error != '' ?
+          <MartEmpty message={error} />
+          :
+          <LibLazy>
+            <View style={{ flex: 1, backgroundColor: '#fff' }}>
+              <MartHeader title={data?.name} onlyBack rightView={
+                data?.is_mitra == 1 ?
+                  undefined :
+                  () => {
+                    return (
+                      <TouchableOpacity onPress={() => {
+                        UserProfileProperty.isLogin(() => {
+                          LibNavigation.navigate('mart/bag')
+                        })
+                      }}>
+                        <View style={{ marginRight: 20, padding: 4 }}>
+                          <LibIcon.FontAwesome name='shopping-bag' color="#6C432E" style={{ width: 27, height: 22 }} />
+                          <ComponentBadge counter={bagCount} />
+                        </View>
+                      </TouchableOpacity>
+                    )
+                  }
+              } />
+
+              <LibScroll onRefresh={loadData} scrollEventThrottle={16} >
+                <View>
+                  {/* carousel / slider */}
+                  <LibCarrousel
+                    autoplay={false}
+                    pageInfo
+                    style={applyStyle({ height: LibStyle.width * 0.8, width: LibStyle.width })}
+                    pageInfoBackgroundColor={"rgba(255,255,255,0.6)"}
+                    pageInfoTextSeparator="/"
+                    pageInfoBottomContainerStyle={applyStyle({ alignSelf: 'flex-end' })}
+                    pageInfoTextStyle={{ fontSize: 12, color: "#333" }}>
+                    {
+                      LibUtils.checkUndefined(data, 'images.0') && data?.images?.map?.(renderImage)
+                    }
+                  </LibCarrousel>
+
+                  {/* detail general, exp: harga, stok, title */}
+                  <MartProduct_detail_general {...data} />
+
+                  {/* {
+                      data?.point_member > 0 &&
+                      <LibTextstyle text={"Dapatkan " + data?.point_member + " point setiap pembelian Produk ini"} style={{ color: LibStyle.colorPrimaryMart, marginRight: 15, marginLeft: 25 }} textStyle="footnote" />
+                    } */}
+
+                  {
+                    data?.options_bundling && data?.options_bundling?.length > 0 &&
+                    <>
+                      <View style={{ marginTop: 15, height: 8, flex: 1, backgroundColor: '#F5F5F5' }} />
+                      <View style={{ marginTop: 15, backgroundColor: 'white' }}>
+                        <Text allowFontScaling={false} style={{ marginLeft: 20, fontFamily: "Arial", fontSize: 12, fontWeight: "bold", fontStyle: "normal", lineHeight: 13, letterSpacing: 0, textAlign: "left", color: "#03192a" }}>{esp.lang("mart/product_detail", "bundle_product")}</Text>
+                        <View style={applyStyle({ flexDirection: 'row', flexWrap: 'wrap', marginLeft: 20, marginTop: 5 })}>
+                          {
+                            data?.options_bundling?.map?.(renderOptionBundling)
+                          }
+                        </View>
+                      </View>
+                    </>
+                  }
+
+                  {
+                    data?.options?.length > 0 && getMaxPoint(data?.options, data?.is_mitra) != 0 &&
+                    <LibTextstyle text={esp.lang("mart/product_detail", "get_point", getMaxPoint(data?.options, data?.is_mitra))} style={{ color: LibStyle.colorPrimaryMart, marginRight: 15, marginLeft: 25 }} textStyle="footnote" />
+                  }
+
+                  <View style={{ marginTop: 15, height: 8, flex: 1, backgroundColor: '#F5F5F5' }} />
+
+                  {/* deskripsi produk */}
+                  {
+                    data?.description != "" &&
+                    <MartProduct_detail_description description={data?.description} upc_description={data?.upc_description} />
+                  }
+
+                </View>
+                <View />
+              </LibScroll>
+              {
+                data?.is_mitra == 0 ?
+                  <View style={{ flexDirection: 'row', justifyContent: 'space-between', margin: 20, marginBottom: 10, marginTop: 10 }}>
+                    <View style={{ width: LibStyle.width * 0.5 - 30 }}>
+                      <ComponentButton label={esp.lang("mart/product_detail", "add_to_cart")} onPress={() => {
+                        UserProfileProperty.isLogin(() => {
+                          sliding.current!.show(data, false)
+                        })
+                      }} backgroundColor="#fff" fontColor="#724225" borderColor="#724225" />
+                    </View>
+                    <View style={{ width: LibStyle.width * 0.5 - 30 }}>
+                      <ComponentButton label={esp.lang("mart/product_detail", "buy_product")} onPress={() => {
+                        UserProfileProperty.isLogin(() => {
+                          sliding.current!.show(data, true)
+                        })
+                      }} backgroundColor={LibStyle.colorPrimaryMart} fontColor="#fff" />
+                    </View>
+                  </View>
+                  :
+                  <View style={{ flexDirection: 'row', justifyContent: 'space-between', margin: 20, marginBottom: 10, marginTop: 10 }}>
+                    {
+                      data.product_id_dc == 0 &&
+                      <View style={{ width: LibStyle.width * 0.5 - 30 }}>
+                        <ComponentButton label={esp.lang("mart/product_detail", "delete")} onPress={() => {
+                          LibDialog.warningConfirm(esp.lang("mart/product_detail", "confirm"), esp.lang("mart/product_detail", "are_u_sure_delete_this_product"), esp.lang("mart/product_detail", "yes"), () => {
+                            LibProgress.show(esp.lang("mart/product_detail", "Removing_product"))
+                            new LibCurl('mitra/product_delete?id=' + data.id, null,
+                              (res, msg) => {
+                                LibProgress.hide()
+                                LibNavigation.back()
+                              }, (msg) => {
+                                LibToastProperty.show(msg?.message)
+                                LibProgress.hide()
+                              }, 1
+                            )
+                          }, esp.lang("mart/product_detail", "cancel"), () => { })
+                        }} backgroundColor="#fff" fontColor="#724225" borderColor="#724225" />
+                      </View>
+                    }
+                    <View style={data.product_id_dc != 0 ? {} : { width: LibStyle.width * 0.5 - 30 }}>
+                      <ComponentButton label={esp.lang("mart/product_detail", "change_product")} onPress={() => {
+                        LibNavigation.navigate<MartProduct_editArgs>('mart/product_edit', {
+                          id: data.id,
+                          reviewing_message: data.reviewing_message,
+                          reviewing_resubmit: data.reviewing_resubmit,
+                          url: data.url,
+                          barcode: data.barcode,
+                          withBarcode: data.barcode != '' ? 1 : 0,
+                          product_id_dc: data?.product_id_dc || 0
+                        })
+                      }} backgroundColor="#fff" fontColor="#724225" borderColor="#724225" />
+                    </View>
+                  </View>
+              }
+
+            </View>
+          </LibLazy>
+      }
+      <MartBag_add_slideup ref={sliding} />
+    </>
+  )
+}

package/modules/mart/product_detail_description.tsx

@@ -0,0 +1,33 @@
+// withHooks
+// noPage
+import esp from 'esoftplay/esp';
+
+import React from 'react';
+import { Text, View } from 'react-native';
+
+
+export interface MartProduct_detail_descriptionArgs {
+
+}
+export interface MartProduct_detail_descriptionProps {
+  upc_description?: string
+  description: string
+}
+export default function m(props: MartProduct_detail_descriptionProps): any {
+  return (
+    <View style={{ marginTop: 15 }}>
+      <Text allowFontScaling={false} style={{ marginLeft: 20, fontFamily: "Arial", fontSize: 12, fontWeight: "bold", fontStyle: "normal", lineHeight: 13, letterSpacing: 0, textAlign: "left", color: "#03192a" }}>{esp.lang("mart/product_detail_description", "description_product")}</Text>
+      <View style={{ marginHorizontal: 20, marginVertical: 20, marginTop: 0 }}>
+        <Text allowFontScaling={false} style={{ fontFamily: "Arial", fontSize: 12, fontWeight: "normal", fontStyle: "normal", lineHeight: 17, letterSpacing: 0, textAlign: "left", color: "#444" }}>{props.upc_description}</Text>
+        <Text allowFontScaling={false} style={{ fontFamily: "Arial", fontSize: 12, fontWeight: "normal", fontStyle: "normal", lineHeight: 17, letterSpacing: 0, textAlign: "left", color: "#444" }}>{props.description}</Text>
+      </View>
+      {/* <ScrollView>
+        <LibWebview
+          source={{ html: props.description }}
+          style={{ marginHorizontal: 5, marginTop: 10 }}
+          onFinishLoad={() => { }}
+        />
+      </ScrollView> */}
+    </View>
+  )
+}

package/modules/mart/product_detail_general.tsx

@@ -0,0 +1,113 @@
+// withHooks
+// noPage
+import { applyStyle } from 'esoftplay';
+import { LibPicture } from 'esoftplay/cache/lib/picture/import';
+import { LibStyle } from 'esoftplay/cache/lib/style/import';
+import { LibTextstyle } from 'esoftplay/cache/lib/textstyle/import';
+import { LibUtils } from 'esoftplay/cache/lib/utils/import';
+import { MartProduct_detailProperty } from 'esoftplay/cache/mart/product_detail/import';
+import { MartProduct_itemProperty } from 'esoftplay/cache/mart/product_item/import';
+import { MartSection_menu } from 'esoftplay/cache/mart/section_menu/import';
+
+import esp from 'esoftplay/esp';
+import React from 'react';
+import { Text, TouchableOpacity, View } from 'react-native';
+
+
+export interface MartProduct_detail_generalArgs {
+
+}
+export interface MartProduct_detail_generalProps {
+  price: string
+  price_max: string
+  id: string,
+  sale_max: string
+  currency: string
+  sale: string
+  name: string
+  stocks: string
+  rating_value: number
+  rating_count: number
+  merchant: any,
+  sold: number,
+  preorder: number,
+  options: any[]
+}
+export default function m(props: MartProduct_detail_generalProps): any {
+  return (
+    <View>
+      <View style={{ marginHorizontal: 17, alignContent: 'center', alignSelf: 'center', flexDirection: 'row', alignItems: "center", paddingTop: 10 }} >
+        <View style={{ flex: 1 }} >
+          {
+            props?.options?.length > 0 ?
+              <LibTextstyle textStyle="headline" text={MartProduct_itemProperty.renderPrice(props.options)} style={{ fontFamily: "Arial", fontSize: 20, fontWeight: "bold", fontStyle: "normal", lineHeight: 20, letterSpacing: 0, textAlign: "left", color: "#03192a" }} />
+              :
+              <>
+                <LibTextstyle textStyle="headline" text={MartProduct_detailProperty.renderPrice(props.sale, props.sale_max, props.currency)} style={{ fontFamily: "Arial", fontSize: 20, fontWeight: "bold", fontStyle: "normal", lineHeight: 20, letterSpacing: 0, textAlign: "left", color: "#03192a" }} />
+                {props.price != props.sale &&
+                  <LibTextstyle textStyle="footnote" text={MartProduct_detailProperty.renderPrice(props.price, props.price_max, props.currency)} style={applyStyle({ color: LibStyle.colorRed, textDecorationLine: 'line-through', textDecorationStyle: 'solid' })} />
+                }
+              </>
+          }
+        </View>
+      </View>
+      <Text allowFontScaling={false} numberOfLines={1} ellipsizeMode={"tail"} style={{ marginHorizontal: 17, margin: 15, fontFamily: "Arial", fontSize: 16, fontWeight: "normal", fontStyle: "normal", lineHeight: 16, letterSpacing: 0, textAlign: "left", color: "#03192a" }}>{props?.name}</Text>
+      {
+        props.preorder > 0 &&
+        <View style={{ flexDirection: 'row' }} >
+          <View style={{ marginHorizontal: 25, marginBottom: 10, backgroundColor: LibUtils.hexToRgba(LibStyle.colorPrimaryMarket, 0.3), paddingVertical: 5, paddingHorizontal: 15, borderRadius: 15 }} >
+            <Text allowFontScaling={false} style={{ fontFamily: "Arial", fontSize: 10, fontWeight: "normal", fontStyle: "normal", letterSpacing: 0, color: "#03192a" }}>{esp.lang("mart/product_detail_general", "preorder")}</Text>
+          </View>
+        </View>
+      }
+      {
+        props?.options?.length > 0 ?
+          <>
+            <MartSection_menu title={esp.lang("mart/product_detail_general", "stock")} smooth />
+            {
+              <TouchableOpacity activeOpacity={1} style={{ flexDirection: 'row', flexWrap: 'wrap', marginHorizontal: 17 }} >
+                {
+                  props?.options?.map?.((item: any, i: number) => (
+                    <View key={i} style={{ backgroundColor: '#f9f9f9', marginHorizontal: 10, marginLeft: 0, paddingVertical: 6, paddingHorizontal: 10, borderRadius: 4, marginBottom: 10 }} >
+                      <LibTextstyle textStyle="footnote" text={item?.stocks + " " + String(item?.pcs_label).toLowerCase()} />
+                    </View>
+                  ))
+                }
+              </TouchableOpacity>
+            }
+          </>
+          :
+          <>
+            {props.stocks && <Text allowFontScaling={false} style={{ marginHorizontal: 17, margin: 15, marginTop: 0, fontFamily: "Arial", fontSize: 10, fontWeight: "normal", fontStyle: "normal", lineHeight: 13, letterSpacing: 0, textAlign: "left", color: "#707070" }}>{esp.lang("mart/product_detail_general", "stocks", LibUtils.number(props?.stocks))}</Text>}
+          </>
+      }
+
+      <View style={{ marginHorizontal: 17, margin: 15, marginTop: 0, flexDirection: 'row', justifyContent: 'space-between' }}>
+        {
+          (props?.rating_value && props?.rating_count) &&
+          <View style={{ flexDirection: 'row', alignContent: 'center', alignItems: 'center' }}>
+            <LibPicture source={esp.assets('market/ic_star.png')} style={{ height: 13, width: 13 }} />
+            <Text allowFontScaling={false} style={{ marginLeft: 4, fontFamily: "Arial", fontSize: 10, fontWeight: "normal", fontStyle: "normal", lineHeight: 13, letterSpacing: 0, textAlign: "left", color: "#000" }}>{props?.rating_value}</Text>
+            <Text allowFontScaling={false} style={{ marginLeft: 4, fontFamily: "Arial", fontSize: 10, fontWeight: "normal", fontStyle: "normal", lineHeight: 13, letterSpacing: 0, textAlign: "left", color: "#707070" }}>{"(" + props?.rating_count + ")"}</Text>
+          </View>
+        }
+        {/* <View style={{ flexDirection: 'row', alignContent: 'center', alignItems: 'center' }}>
+          <Text allowFontScaling={false} style={{ marginLeft: 4, fontFamily: "Arial", fontSize: 10, fontWeight: "normal", fontStyle: "normal", lineHeight: 13, letterSpacing: 0, textAlign: "left", color: "#000" }}>Diskusi</Text>
+          <Text allowFontScaling={false} style={{ marginLeft: 4, fontFamily: "Arial", fontSize: 10, fontWeight: "normal", fontStyle: "normal", lineHeight: 13, letterSpacing: 0, textAlign: "left", color: "#707070" }}>5</Text>
+        </View> */}
+        {
+          props.sold &&
+          <View style={{ flexDirection: 'row', alignContent: 'center', alignItems: 'center' }}>
+            <Text allowFontScaling={false} style={{ marginLeft: 4, fontFamily: "Arial", fontSize: 10, fontWeight: "normal", fontStyle: "normal", lineHeight: 13, letterSpacing: 0, textAlign: "left", color: "#000" }}>{esp.lang("mart/product_detail_general", "sold")}</Text>
+            <Text allowFontScaling={false} style={{ marginLeft: 4, fontFamily: "Arial", fontSize: 10, fontWeight: "normal", fontStyle: "normal", lineHeight: 13, letterSpacing: 0, textAlign: "left", color: "#707070" }}>{LibUtils.number(props.sold)}</Text>
+          </View>
+        }
+      </View>
+
+      {/* <View style={{ marginLeft: 25, marginRight: 25, flexDirection: 'row', alignContent: 'center', alignItems: 'center' }}>
+        <LibPicture source={esp.assets('market/034-store.png')} style={{ marginRight: 15, width: 20, height: 20 }} resizeMode="cover" />
+        <Text allowFontScaling={false} style={{ fontFamily: "Arial", fontSize: 10, fontWeight: "bold", fontStyle: "normal", lineHeight: 13, letterSpacing: 0, textAlign: "left", color: "#03192a" }}>{props.merchant.name}</Text>
+      </View> */}
+    </View>
+  )
+}

package/modules/mart/product_edit.tsx

@@ -0,0 +1,86 @@
+// withHooks
+import { LibCurl } from 'esoftplay/cache/lib/curl/import';
+import { LibDialog } from 'esoftplay/cache/lib/dialog/import';
+import { LibNavigation } from 'esoftplay/cache/lib/navigation/import';
+import { LibProgress } from 'esoftplay/cache/lib/progress/import';
+import { LibStyle } from 'esoftplay/cache/lib/style/import';
+import { LibTextstyle } from 'esoftplay/cache/lib/textstyle/import';
+import { LibToastProperty } from 'esoftplay/cache/lib/toast/import';
+import { MarketReview } from 'esoftplay/cache/market/review/import';
+import { MartHeader } from 'esoftplay/cache/mart/header/import';
+import { MartProduct_input, MartProduct_inputForm, MartProduct_inputProperty } from 'esoftplay/cache/mart/product_input/import';
+import { UseForm } from 'esoftplay/cache/use/form/import';
+import esp from 'esoftplay/esp';
+
+import React, { useEffect, useRef } from 'react';
+import { TouchableOpacity, View } from 'react-native';
+
+
+export interface MartProduct_editArgs {
+  id: string | number,
+  url?: string,
+  reviewing_message?: string
+  reviewing_resubmit?: string
+  barcode?: string,
+  withBarcode?: number,
+  product_id_dc?: number
+}
+export interface MartProduct_editProps {
+
+}
+export default function m(props: MartProduct_editProps): any {
+  const { barcode, withBarcode, id, url, reviewing_message, reviewing_resubmit, product_id_dc } = LibNavigation.getArgsAll(props)
+  const [form, setForm, reForm, delForm] = UseForm<MartProduct_inputForm>("mart_product_input")
+  const reviewRef = useRef<MarketReview>(null)
+
+  useEffect(() => {
+    return () => delForm()
+  }, [])
+
+  function doEdit() {
+    if (form) {
+      LibProgress.show(esp.lang("mart/product_edit", "please_wait"))
+      const _url = product_id_dc != 0 ? 'mitra/product_edit_dc?id=' + form.id + '&product_id_dc=' + product_id_dc : 'mitra/product_edit?id=' + form.id
+      new LibCurl(_url, MartProduct_inputProperty.buildPost(form),
+        (res, msg) => {
+          LibProgress.hide()
+          LibNavigation.back()
+          LibToastProperty.show(msg)
+        },
+        (msg) => {
+          LibToastProperty.show(msg?.message)
+          LibProgress.hide()
+        }, 1
+      )
+    }
+  }
+
+  return (
+    <View style={{ flex: 1, backgroundColor: "white" }} >
+      <MartHeader
+        leftIcon={{
+          name: "arrow-left", onPress: () => {
+            LibDialog.warningConfirm(esp.lang("mart/product_edit", "sure_out?"), esp.lang("mart/product_edit", "Your_data_will_not_be_saved_if_you_return_to_the_previous_page"), esp.lang("mart/product_edit", "sure"), () => {
+              LibNavigation.back()
+            }, esp.lang("mart/product_edit", "cancel"), () => { })
+          }
+        }}
+        title={esp.lang("mart/product_edit", "change_product")} rightView={() => (
+          <TouchableOpacity
+            onPress={() => {
+              if (MartProduct_inputProperty.validateEmptyInput(form)) {
+                if (reviewing_resubmit) {
+                  reviewRef.current!.show(reviewing_message, reviewing_resubmit, doEdit)
+                } else {
+                  doEdit()
+                }
+              }
+            }}
+            style={{ paddingRight: 17 }} >
+            <LibTextstyle text={esp.lang("mart/product_edit", "save")} textStyle="footnote" style={{ color: LibStyle.colorPrimaryMart, fontWeight: "bold" }} />
+          </TouchableOpacity>)} />
+      <MartProduct_input id={id} barcode={barcode} withBarcode={withBarcode} canEdit={withBarcode == 0 ? false : true} buttonRequest={withBarcode ? true : false} />
+      <MarketReview ref={reviewRef} />
+    </View>
+  )
+}