esoftplay-event 0.0.0-o → 0.0.0-p

package/modules/mart/complaint_detail.tsx

@@ -0,0 +1,290 @@
+// withHooks
+import { ComponentTouchable } from 'esoftplay/cache/component/touchable/import';
+import { LibCurl } from 'esoftplay/cache/lib/curl/import';
+import { LibDialog } from 'esoftplay/cache/lib/dialog/import';
+import { LibLoading } from 'esoftplay/cache/lib/loading/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 { LibSlidingup } from 'esoftplay/cache/lib/slidingup/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 { MartButton } from 'esoftplay/cache/mart/button/import';
+import { MartComplaint_discussArgs } from 'esoftplay/cache/mart/complaint_discuss/import';
+import { MartComplaint_solutionArgs } from 'esoftplay/cache/mart/complaint_solution/import';
+import { MartHeader } from 'esoftplay/cache/mart/header/import';
+import { MartSection_menu } from 'esoftplay/cache/mart/section_menu/import';
+import { UserClass } from 'esoftplay/cache/user/class/import';
+import esp from 'esoftplay/esp';
+import useSafeState from 'esoftplay/state';
+
+import moment from 'esoftplay/moment';
+import useGlobalSubscriber, { UseSubscribeReturn } from 'esoftplay/subscribe';
+import React, { useEffect, useRef } from 'react';
+import { Text, View } from 'react-native';
+moment().locale('id')
+
+
+export interface MartComplaint_detailArgs {
+  url: string,
+  order_id: string,
+  mitra_id: string,
+}
+export interface MartComplaint_detailProps {
+
+}
+const subs = useGlobalSubscriber()
+export function subscribe(): UseSubscribeReturn {
+  return subs
+}
+
+export default function m(props: MartComplaint_detailProps): any {
+  const user = UserClass.state().get()
+  const { order_id, mitra_id, url } = LibNavigation.getArgsAll(props)
+  const [isMitra, setIsMitra] = useSafeState(false)
+  const [data, setData] = useSafeState<any>()
+  const width = (LibStyle.width - 90) / 4
+  const slidingRef = useRef<LibSlidingup>(null)
+
+
+  useEffect(() => {
+    getData()
+  }, [])
+
+  function getData() {
+    new LibCurl(url, null,
+      (res, msg) => {
+        setIsMitra(res.mitra_id == user?.mitra_id)
+        setData(res)
+      }, (msg) => {
+        LibDialog.warning(esp.lang("mart/complaint_detail", "get_err"), msg?.message)
+      }, 1
+    )
+  }
+
+  subs.useSubscribe(() => {
+    getData()
+  })
+
+  function complaintApproveByMitra() {
+    LibProgress.show(esp.lang("mart/complaint_detail", "please_wait"))
+    new LibCurl('mitra/order_complaint_mitra', { sale_id: order_id, solution_mitra: data?.solution_buyer?.id },
+      (res, msg) => {
+        getData()
+        LibProgress.hide()
+        LibDialog.info(esp.lang("mart/complaint_detail", "success"), msg)
+      }, (err) => {
+        LibProgress.hide()
+        LibDialog.warning(esp.lang("mart/complaint_detail", "complaint_err"), err?.message)
+      }, 1
+    )
+  }
+
+  function complaintRefusedByMitra(solution_mitra: string) {
+    LibProgress.show(esp.lang("mart/complaint_detail", "please_wait"))
+    new LibCurl('mitra/order_complaint_mitra', { sale_id: order_id, solution_mitra: solution_mitra },
+      (res, msg) => {
+        getData()
+        LibProgress.hide()
+        LibDialog.info(esp.lang("mart/complaint_detail", "submission_success"), msg)
+      }, (msg) => {
+        LibProgress.hide()
+        LibDialog.warning(esp.lang("mart/complaint_detail", "refuse_err"), msg?.message)
+      }, 1
+    )
+  }
+
+
+  if (!data) {
+    return <LibLoading />
+  }
+
+  const qtyProductOnProblem = data?.products?.reduce((acc: any, curr: any) => acc + parseInt(curr.product_qty), 0)
+
+  const renderImage = (item: any, i: number) => (
+    <ComponentTouchable key={i} onPress={() => { LibNavigation.navigate("lib/gallery", { image: item }) }} style={{ borderRadius: 5, width: width, height: width, marginRight: 10, marginBottom: 10, backgroundColor: LibStyle.colorGrey, alignItems: "center", justifyContent: "center" }} >
+      <LibPicture source={{ uri: item }} style={{ width: width, height: width, borderRadius: 5 }} />
+    </ComponentTouchable>
+  )
+
+  const renderProductItem = (item: any, i: number) => (
+    <View key={i} style={{ flexDirection: "row", alignItems: "center", marginBottom: 10 }} >
+      <LibPicture source={{ uri: item.product_image }} style={{ width: width, height: width, borderRadius: 5, backgroundColor: LibStyle.colorGrey }} />
+      <View style={{ flex: 1, marginLeft: 10 }} >
+        <Text allowFontScaling={false} style={{ fontFamily: "Arial", fontSize: 14, paddingBottom: 5 }} >{item?.product_name}</Text>
+        <Text allowFontScaling={false} style={{ fontFamily: "Arial", fontSize: 14 }} >{item?.product_qty + ' x ' + LibUtils.money(item?.product_price)}</Text>
+      </View>
+      <Text allowFontScaling={false} style={{ fontFamily: "Arial", fontSize: 14 }} >{LibUtils.money(Number(item.product_price) * Number(item.product_qty))}</Text>
+    </View>
+  )
+
+  return (
+    <View style={{ flex: 1 }} >
+      <MartHeader onlyBack title={(isMitra ? esp.lang("mart/complaint_detail", "complaint_from", data?.buyer_name) : esp.lang("mart/complaint_detail", "complaint_to", data?.mitra_name))} />
+      {
+        !data ? <LibLoading /> :
+          <>
+            <LibScroll onRefresh={getData} >
+              <View style={{ backgroundColor: 'white', paddingHorizontal: 15, paddingTop: 10, paddingBottom: 15, borderBottomWidth: 1, borderBottomColor: '#f1f1f1' }} >
+                <Text allowFontScaling={false} style={{ fontFamily: "Arial", fontSize: 16 }} >{data?.status?.desc}</Text>
+                {
+                  data?.status?.id == 1 && isMitra &&
+                  <Text allowFontScaling={false} style={{ fontFamily: "Arial", fontSize: 11, lineHeight: 15, marginTop: 5 }} >{esp.lang("mart/complaint_detail", "respond_waiting_time", moment(data?.created).add(2, 'days').serverFormat('DD MMMM YYYY HH:mm'))}</Text>
+                }
+                {
+                  data?.status?.id == 1 && !isMitra &&
+                  <Text allowFontScaling={false} style={{ fontFamily: "Arial", fontSize: 11, lineHeight: 15, marginTop: 5 }} >{esp.lang("mart/complaint_detail", "if_seller_didnt_respon", moment(data?.created).add(2, 'days').localeFormat('DD MMMM YYYY'))}</Text>
+                }
+              </View>
+              <View style={{ margin: 15 }} >
+                <View style={{ flexDirection: 'row', alignItems: 'center', marginBottom: 15 }} >
+                  <LibPicture source={{ uri: isMitra ? data?.buyer_image : data?.mitra_image }} style={{ width: 40, height: 40, borderRadius: 20, backgroundColor: LibStyle.colorGrey }} />
+                  <View style={{ flex: 1, marginLeft: 10 }} >
+                    <Text allowFontScaling={false} style={{ fontFamily: "Arial", fontSize: 14 }} >{(isMitra ? data?.buyer_name : data?.mitra_name)}</Text>
+                    <Text allowFontScaling={false} style={{ fontFamily: "Arial", fontSize: 14 }} >{isMitra ? esp.lang("mart/complaint_detail", "buyer") : esp.lang("mart/complaint_detail", "seller")}</Text>
+                  </View>
+                  <Text allowFontScaling={false} style={{ fontFamily: "Arial", fontSize: 12 }} >{moment(data?.created).localeFormat('DD MMMM YYYY')}</Text>
+                </View>
+
+                <Text allowFontScaling={false} style={{ fontFamily: "Arial", fontSize: 12, marginTop: 10 }} >{esp.lang("mart/complaint_detail", "invoice_number")}</Text>
+                <Text allowFontScaling={false} style={{ fontFamily: "Arial", fontSize: 14, marginTop: 5 }} >{data?.invoice}</Text>
+
+                <Text allowFontScaling={false} style={{ fontFamily: "Arial", fontSize: 12, marginTop: 10 }} >{esp.lang("mart/complaint_detail", "item_statuss")}</Text>
+                <Text allowFontScaling={false} style={{ fontFamily: "Arial", fontSize: 14, lineHeight: 20, marginTop: 5, color: data?.received == 1 ? LibStyle.colorGreen : LibStyle.colorRed }} >{data?.received == 1 ? esp.lang("mart/complaint_detail", "item_received") : esp.lang("mart/complaint_detail", "item_didnt_received")}</Text>
+
+                <Text allowFontScaling={false} style={{ fontFamily: "Arial", fontSize: 12, marginTop: 10, color: LibStyle.colorPrimaryMart, fontWeight: 'bold' }} >{esp.lang("mart/complaint_detail", "solution_from_buyer")}</Text>
+                {
+                  data?.solution_buyer != '' &&
+                  <Text allowFontScaling={false} style={{ fontFamily: "Arial", fontSize: 14, lineHeight: 20, marginTop: 5 }} >{data?.solution_buyer?.desc}</Text>
+                }
+
+                {
+                  data?.status?.id != 1 &&
+                  <>
+                    <Text allowFontScaling={false} style={{ fontFamily: "Arial", fontSize: 12, marginTop: 10, color: LibStyle.colorPrimaryMart, fontWeight: 'bold' }} >{esp.lang("mart/complaint_detail", "solution_from_seller")}</Text>
+                    {
+                      data?.solution_mitra != '' &&
+                      <Text allowFontScaling={false} style={{ fontFamily: "Arial", fontSize: 14, lineHeight: 20, marginTop: 5 }} >{data?.solution_mitra?.desc}</Text>
+                    }
+                  </>
+                }
+
+
+                {
+                  LibUtils.checkUndefined(data, 'products.0') &&
+                  <View style={{ marginHorizontal: -15, backgroundColor: '#f1f1f1', marginTop: 10, paddingHorizontal: 15, paddingVertical: 10 }} >
+                    <Text allowFontScaling={false} style={{ fontFamily: "Arial", fontSize: 14 }} >{esp.lang("mart/complaint_detail", "product_problem", qtyProductOnProblem)}</Text>
+                  </View>
+                }
+
+                {
+                  LibUtils.checkUndefined(data, 'notes') && data.notes != '' && data.notes != null &&
+                  <>
+                    <Text allowFontScaling={false} style={{ fontFamily: "Arial", fontSize: 12, marginTop: 10, color: LibStyle.colorPrimaryMart, fontWeight: 'bold' }} >{esp.lang("mart/complaint_detail", "reason")}</Text>
+                    <Text allowFontScaling={false} style={{ fontFamily: "Arial", fontSize: 14, lineHeight: 20, marginTop: 5 }} >{data.notes}</Text>
+                  </>
+                }
+
+                {
+                  LibUtils.checkUndefined(data, 'images.0') &&
+                  <Text allowFontScaling={false} style={{ fontFamily: "Arial", fontSize: 12, marginTop: 10 }} >{esp.lang("mart/complaint_detail", "proof")}</Text>
+                }
+                <View style={{ flexDirection: "row", flexWrap: 'wrap', marginTop: 5, paddingBottom: 5 }} >
+                  {
+                    LibUtils.checkUndefined(data, 'images.0') && data.images.map(renderImage)
+                  }
+                </View>
+
+                <View style={{ marginHorizontal: -15, borderBottomWidth: 1, borderBottomColor: '#f1f1f1', borderTopWidth: 1, borderTopColor: '#f1f1f1', paddingHorizontal: 15, paddingTop: 15, paddingBottom: 5 }} >
+                  {
+                    LibUtils.checkUndefined(data, 'products.0') && data.products.map(renderProductItem)
+                  }
+                </View>
+
+                <View style={{ flexDirection: "row", marginTop: 15 }} >
+                  <Text allowFontScaling={false} style={{ flex: 1, fontFamily: "Arial", fontSize: 14 }} >{esp.lang("mart/complaint_detail", "Total_Troubled_Fund")}</Text>
+                  <Text allowFontScaling={false} style={{ fontFamily: "Arial", fontSize: 14, color: LibStyle.colorRed }} >{LibUtils.money(data?.total)}</Text>
+                </View>
+
+              </View>
+            </LibScroll>
+
+            {
+              isMitra ?
+                <>
+                  {
+                    data?.status?.id == 1 ?
+                      <View style={{ flexDirection: "row", justifyContent: "space-between", marginVertical: 5 }} >
+                        <View style={{ width: LibStyle.width * 0.5 - 5 }}>
+                          <MartButton
+                            color={LibStyle.colorPrimaryMart}
+                            textStyle={{ color: LibStyle.colorPrimaryMart }}
+                            colorBackground={'white'}
+                            colorBorder={LibStyle.colorPrimaryMart}
+                            onPress={() => { slidingRef.current!.show() }}
+                            text={esp.lang("mart/complaint_detail", "refuse_submission")}
+                            buttonStyle={{ marginLeft: 10, paddingHorizontal: 10 }} />
+                        </View>
+                        <View style={{ width: LibStyle.width * 0.5 - 5 }}>
+                          <MartButton
+                            textStyle={{ color: "white" }}
+                            onPress={() => {
+                              LibDialog.warningConfirm(esp.lang("mart/complaint_detail", "confirm"), esp.lang("mart/complaint_detail", "sure_aggree_complaint_from_buyer"), esp.lang("mart/complaint_detail", "next"), () => { complaintApproveByMitra() }, esp.lang("mart/complaint_detail", "cancell"), () => { })
+                            }}
+                            text={esp.lang("mart/complaint_detail", "accept_solution")}
+                            buttonStyle={{ marginRight: 10, paddingHorizontal: 10 }} />
+                        </View>
+                      </View>
+                      :
+                      <MartButton
+                        icon={'message-text'}
+                        iconSize={20}
+                        color={LibStyle.colorPrimaryMart}
+                        textStyle={{ color: LibStyle.colorPrimaryMart }}
+                        colorBackground={'white'}
+                        colorBorder={LibStyle.colorPrimaryMart}
+                        onPress={() => { LibNavigation.navigate<MartComplaint_discussArgs>('mart/complaint_discuss', { url_complaint: url }) }}
+                        buttonStyle={{ marginHorizontal: 15, marginVertical: 10 }}
+                        text={esp.lang("mart/complaint_detail", "discuss_with_buyer")} />
+                  }
+                </>
+                :
+                <>
+                  {
+                    data?.status?.id > 1 &&
+                    <MartButton
+                      icon={'message-text'}
+                      iconSize={20}
+                      color={LibStyle.colorPrimaryMart}
+                      textStyle={{ color: LibStyle.colorPrimaryMart }}
+                      colorBackground={'white'}
+                      colorBorder={LibStyle.colorPrimaryMart}
+                      onPress={() => { LibNavigation.navigate<MartComplaint_discussArgs>('mart/complaint_discuss', { url_complaint: url }) }}
+                      buttonStyle={{ marginHorizontal: 15, marginVertical: 10 }}
+                      text={esp.lang("mart/complaint_detail", "discuss_with_seller")} />
+                  }
+                </>
+            }
+          </>
+      }
+      <LibSlidingup ref={slidingRef} >
+        <View style={{ backgroundColor: "white", paddingVertical: 10 }} >
+          <LibTextstyle textStyle="headline" text={esp.lang("mart/complaint_detail", "give_another_solution_for_buyer")} style={{ textAlign: 'center', paddingBottom: 10 }} />
+          <MartSection_menu size="line" />
+          <MartButton
+            text={esp.lang("mart/complaint_detail", "select_solution")}
+            buttonStyle={{ marginHorizontal: 17, marginVertical: 5 }}
+            onPress={() => {
+              LibNavigation.navigateForResult<MartComplaint_solutionArgs>('market/complaint_solution', { exclude_id: data?.solution_buyer.id }).
+                then((x) => {
+                  complaintRefusedByMitra(x.id)
+                  slidingRef.current!.hide()
+                })
+            }} />
+        </View>
+      </LibSlidingup>
+    </View>
+  )
+}

package/modules/mart/complaint_discuss.tsx

@@ -0,0 +1,364 @@
+// withHooks
+import { ComponentTouchable } from 'esoftplay/cache/component/touchable/import';
+import { LibCollaps } from 'esoftplay/cache/lib/collaps/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 { LibInfinite } from 'esoftplay/cache/lib/infinite/import';
+import { LibInput } from 'esoftplay/cache/lib/input/import';
+import { LibKeyboard_avoid } from 'esoftplay/cache/lib/keyboard_avoid/import';
+import { LibLoading } from 'esoftplay/cache/lib/loading/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 { LibSlidingup } from 'esoftplay/cache/lib/slidingup/import';
+import { LibStyle } from 'esoftplay/cache/lib/style/import';
+import { LibUtils } from 'esoftplay/cache/lib/utils/import';
+import { MartComplaint_detailProperty } from 'esoftplay/cache/mart/complaint_detail/import';
+import { MartEmpty } from 'esoftplay/cache/mart/empty/import';
+import { MartHeader } from 'esoftplay/cache/mart/header/import';
+import { MartImage_picker } from 'esoftplay/cache/mart/image_picker/import';
+import { UserClass } from 'esoftplay/cache/user/class/import';
+import esp from 'esoftplay/esp';
+import useSafeState from 'esoftplay/state';
+
+import moment from 'esoftplay/moment';
+import React, { useEffect, useRef } from 'react';
+import { Text, TouchableOpacity, View } from 'react-native';
+
+moment().locale('id')
+
+
+export interface MartComplaint_discussArgs {
+  url_complaint: string
+}
+export interface MartComplaint_discussProps {
+
+}
+
+export interface CommunityItem {
+  title: string
+  value: string
+  color?: string
+}
+
+export interface SolutionItem {
+  text: string
+  color?: string
+}
+
+function Item(props: CommunityItem) {
+  return (
+    <View style={{ flexDirection: 'row', justifyContent: 'space-between', marginBottom: 6 }}>
+      <Text allowFontScaling={false} style={{ flex: 1, fontFamily: "SFProText", fontSize: 12, fontWeight: "bold", fontStyle: "normal", letterSpacing: 0, color: "#4b4b4b" }}>{props.title}</Text>
+      <Text allowFontScaling={false} ellipsizeMode={'tail'} numberOfLines={2} style={{ flex: 1, fontFamily: "SFProText", fontSize: 10, fontWeight: "normal", fontStyle: "normal", letterSpacing: 0, color: props.color ? props.color : "#4b4b4b" }}>{props.value}</Text>
+    </View>
+  )
+}
+
+export default function m(props: MartComplaint_discussProps): any {
+  const user = UserClass.state().get()
+  const { url_complaint } = LibNavigation.getArgsAll(props)
+  const width = LibStyle.width * 0.7
+  let textMsg = useRef('').current
+  const input = useRef<LibInput>(null)
+  const imagePicker = useRef<LibSlidingup>(null)
+  const [upData, setUpData] = useSafeState<any>([])
+  const [data, setData] = useSafeState<any>()
+  const [config, setConfig] = useSafeState<any>({})
+  const [isMitra, setIsMitra] = useSafeState(false)
+
+  useEffect(() => {
+    getComplaintDetail()
+  }, [])
+  
+  function getComplaintDetail() {
+    new LibCurl(url_complaint, null,
+      (res, msg) => {
+        setIsMitra(res?.mitra_id == user?.mitra_id)
+        getComplaintConfig(res?.id)
+        setData(res)
+      }, (err) => {
+      }, 1
+    )
+  }
+
+  function getComplaintConfig(complaint_id: string) {
+    new LibCurl('mitra/order_complaint_config?complaint_id=' + complaint_id, null,
+      (res) => {
+        setConfig(res)
+      }, (msg) => {
+
+      }, 1
+    )
+  }
+
+  function callAdmin() {
+    LibDialog.warningConfirm(esp.lang("mart/complaint_discuss", "call_admin"), esp.lang("mart/complaint_discuss", "call_admin_for_help"), esp.lang("mart/complaint_discuss", "yes"), () => {
+      LibProgress.show(esp.lang("mart/complaint_discuss", "please_wait"))
+      new LibCurl('mitra/order_complaint_admin', { id: data?.id },
+        (res, msg) => {
+          getComplaintConfig(data?.id)
+          LibProgress.hide()
+        }, (msg) => {
+          LibDialog.warning(esp.lang("mart/complaint_discuss", "eror"), msg?.message)
+        }, 1
+      )
+    }, esp.lang("mart/complaint_discuss", "cancel"), () => { })
+  }
+
+  function sendMessage() {
+    let post = {
+      complaint_id: data?.id,
+      message: textMsg
+    }
+    let newMsg = {
+      id: "",
+      complaint_id: data?.id,
+      sender_id: user?.id,
+      sender_name: user?.mitra_id == data?.mitra_id ? data?.mitra_name : data?.buyer_name,
+      message: textMsg,
+      file: "",
+      created: moment().serverFormat("YYYY-MM-DD HH:mm"),
+      message_alert: "",
+      sender_image: user?.mitra_id == data?.mitra_id ? data?.mitra_image : user?.image
+    }
+
+    let _upData = [...upData]
+    _upData.unshift(newMsg)
+    setUpData([..._upData])
+
+    new LibCurl('mitra/order_complaint_conversation', post,
+      (res, msg) => {
+        input.current?.setText('')
+      }, (msg) => {
+
+      }, 1
+    )
+  }
+
+  function sendAttach(imageUrl: string) {
+    let fileName = imageUrl.split('/').splice(-1).pop()
+    let post = {
+      complaint_id: data.id,
+      message: fileName?.toString(),
+      file: imageUrl
+    }
+    let newMsg = {
+      id: "",
+      complaint_id: data.id,
+      sender_id: user?.id,
+      sender_name: user?.mitra_id == data.mitra_id ? data.mitra_name : data.buyer_name,
+      message: "",
+      file: imageUrl,
+      created: moment().serverFormat("YYYY-MM-DD HH:mm"),
+      message_alert: "",
+      sender_image: user?.mitra_id == data.mitra_id ? data.mitra_image : user.image
+    }
+
+    let _upData = [...upData]
+    _upData.unshift(newMsg)
+    setUpData([..._upData])
+
+    new LibCurl('mitra/order_complaint_conversation', post,
+      (res, msg) => {
+        input.current?.setText('')
+        imagePicker.current?.hide()
+      }, (msg) => {
+        imagePicker.current?.hide()
+      }, 1
+    )
+  }
+
+  function solveComplaint() {
+    let post: any = {
+      complaint_id: data?.id,
+    }
+    if (isMitra) {
+      post.mitra_id = user?.mitra_id
+    }
+    LibProgress.show(esp.lang("mart/complaint_discuss", "please_wait"))
+    new LibCurl('mitra/order_complaint_solve', post,
+      (res, msg) => {
+        MartComplaint_detailProperty.subscribe().trigger()
+        LibProgress.hide()
+        LibNavigation.back()
+      }, (msg) => {
+        LibProgress.hide()
+        LibDialog.warning(esp.lang("mart/complaint_discuss", "solve"), msg?.message)
+      }, 1
+    )
+  }
+
+  if (!data) {
+    return <LibLoading />
+  }
+
+  const renderItem = (item: any, i: number) => {
+    let isReceived = item?.sender_id == user?.id
+    if (item?.message_alert != "") {
+      return (
+        <View style={{ paddingRight: !isReceived ? 66 : 16, paddingLeft: !isReceived ? 16 : 66, flexDirection: 'row', marginVertical: 10, transform: [{ scaleY: -1 }] }} >
+          {isReceived && <View style={{ flex: 1 }} />}
+          <Text allowFontScaling={false} style={{ fontFamily: "SFProText", textAlign: !isReceived ? 'left' : 'right', fontSize: 11, fontWeight: "normal", fontStyle: "normal", lineHeight: 16, letterSpacing: 0, color: "#a3a3a3" }}>{item.message_alert}</Text>
+          {!isReceived && <View style={{ flex: 1 }} />}
+        </View>
+      )
+    } else if (item?.file != "" && item?.file != null) {
+      return (
+        <View style={{ paddingLeft: !isReceived ? 10 : 0, paddingRight: !isReceived ? 0 : 10, marginVertical: 5, flexDirection: 'row', transform: [{ scaleY: -1 }] }} >
+          {
+            !isReceived &&
+            <LibPicture source={{ uri: item?.sender_image }} style={{ marginRight: 6, width: 36, height: 36, borderRadius: 18, backgroundColor: LibStyle.colorPrimaryMart, alignSelf: 'flex-end' }} />
+          }
+          <View style={{ flex: 1 }} >
+            <View style={{ flexDirection: 'row', alignItems: 'flex-end', justifyContent: !isReceived ? 'flex-start' : 'flex-end' }} >
+              <ComponentTouchable onPress={() => LibNavigation.navigate("lib/gallery", { image: item?.file })} >
+                <LibPicture source={{ uri: item?.file }} style={{ width: 120, height: 180, borderRadius: 2 }} />
+              </ComponentTouchable>
+            </View>
+          </View>
+          {
+            isReceived &&
+            <LibPicture source={{ uri: item?.sender_image }} style={{ marginLeft: 6, width: 36, height: 36, borderRadius: 18, backgroundColor: LibStyle.colorPrimaryMart, alignSelf: 'flex-end' }} />
+          }
+        </View>
+      )
+    } else {
+      return (
+        <View style={{ paddingLeft: !isReceived ? 10 : 0, paddingRight: !isReceived ? 0 : 10, marginVertical: 5, flexDirection: 'row', transform: [{ scaleY: -1 }] }} >
+          {
+            !isReceived &&
+            <LibPicture source={{ uri: item?.sender_image }} style={{ marginRight: 6, width: 36, height: 36, borderRadius: 18, backgroundColor: LibStyle.colorPrimaryMart, alignSelf: 'flex-end' }} />
+          }
+          <View style={{ flex: 1 }} >
+            <View style={{ flexDirection: 'row', alignItems: 'flex-end', justifyContent: !isReceived ? 'flex-start' : 'flex-end' }} >
+              <View style={[{ maxWidth: width, backgroundColor: 'white', padding: 10, borderRadius: 5, marginBottom: 4 }, LibStyle.elevation(2)]} >
+                <View style={{ flexDirection: 'row', flexWrap: 'wrap' }}>
+                  <Text selectable selectionColor={LibStyle.colorPrimaryMart} allowFontScaling={false} style={{ fontFamily: "Arial", fontSize: 12, fontWeight: "normal", fontStyle: "normal", lineHeight: 15, letterSpacing: 0, color: "#909090", textAlign: 'left' }} >{item?.message}</Text>
+                </View>
+                <View style={{ marginTop: 10, flexDirection: 'row', justifyContent: "space-between" }} >
+                  <Text allowFontScaling={false} style={{ marginRight: 20, fontFamily: "Arial", fontSize: 10, fontWeight: "normal", fontStyle: "normal", lineHeight: 15, letterSpacing: 0, color: "#909090" }} >{item?.sender_name}</Text>
+                  <Text allowFontScaling={false} style={{ fontFamily: "Arial", fontSize: 10, fontWeight: "normal", fontStyle: "normal", lineHeight: 15, letterSpacing: 0, color: "#909090" }} >{moment(item?.created).localeFormat('DD/MM/YYYY')}</Text>
+                </View>
+              </View>
+            </View>
+          </View>
+          {
+            isReceived &&
+            <LibPicture source={{ uri: item?.sender_image }} style={{ marginLeft: 6, width: 36, height: 36, borderRadius: 18, backgroundColor: LibStyle.colorPrimaryMart, alignSelf: 'flex-end' }} />
+          }
+        </View>
+      )
+    }
+  }
+
+  return (
+    <LibKeyboard_avoid style={{ flex: 1 }} >
+      <View style={{ flex: 1 }} >
+        <MartHeader
+          onlyBack
+          title={esp.lang("mart/complaint_discuss", "Resolution_Center")} />
+        <LibCollaps
+          header={(show) => {
+            return (
+              <View style={{ padding: 10, marginLeft: 5, justifyContent: 'space-between', flexDirection: 'row', borderRadius: 5, backgroundColor: '#fff' }}>
+                <Text allowFontScaling={false} style={{ fontFamily: "SFProText", fontSize: 14, fontWeight: "bold", fontStyle: "normal", letterSpacing: 0, color: "#4b4b4b" }}>{esp.lang("mart/complaint_discuss", "complaint_detail")}</Text>
+                <LibIcon name={!show ? "chevron-down" : "chevron-up"} />
+              </View>
+            )
+          }}>
+          <View style={{ width: LibStyle.width, padding: 15, backgroundColor: '#fff' }}>
+            <Item title={esp.lang("mart/complaint_discuss", "invoice")} value={data?.invoice} />
+            <Item title={esp.lang("mart/complaint_discuss", "member_solution")} value={data?.solution_buyer?.desc} />
+            <Item title={esp.lang("mart/complaint_discuss", "merchant_solution")} value={data?.solution_mitra?.desc} />
+            <Item title={esp.lang("mart/complaint_discuss", "Total_Troubled_Fund")} value={LibUtils.money(data?.total)} />
+            <Text allowFontScaling={false} style={{ marginTop: 8, textAlign: 'center', fontFamily: "SFProText", fontSize: 12, fontStyle: "normal", letterSpacing: 0, color: "#4b4b4b" }}>{esp.lang("mart/complaint_discuss", "please_discuss_first")}</Text>
+          </View>
+        </LibCollaps>
+
+        <LibInfinite
+          url={'mitra/order_complaint_conversation?complaint_id=' + data.id}
+          style={{ transform: [{ scaleY: - 1 }] }}
+          onDataChange={(data: any) => setUpData(data)}
+          injectData={upData}
+          refreshEnabled={false}
+
+          errorView={(e: string) => (<MartEmpty message={e} />)}
+          removeClippedSubviews={false}
+          renderItem={renderItem}
+        />
+
+        {
+          data?.status?.id < 4 &&
+          <View style={{ flexDirection: 'row', alignItems: 'center', justifyContent: 'space-between', marginBottom: 10, marginHorizontal: 15 }} >
+            {
+              config?.admin_join == 0 &&
+              <TouchableOpacity onPress={callAdmin} style={{ flexDirection: 'row', alignItems: 'center', backgroundColor: LibStyle.colorPrimaryMart, borderRadius: 20, padding: 10, width: LibStyle.width * 0.5 - 20, justifyContent: 'center' }} >
+                <LibIcon name="face-agent" color={'white'} size={18} />
+                <Text allowFontScaling={false} style={{ fontFamily: 'Arial', fontSize: 12, paddingLeft: 10, color: 'white' }} >{esp.lang("mart/complaint_discuss", "call_admin")}</Text>
+              </TouchableOpacity>
+            }
+            {
+              // isMitra && data?.solve == 1 &&
+              isMitra &&
+              <TouchableOpacity onPress={() => {
+                LibDialog.warningConfirm(esp.lang("mart/complaint_discuss", "confirm"), esp.lang("mart/complaint_discuss", "refund_fund"), esp.lang("mart/complaint_discuss", "return_now"), () => {
+                  solveComplaint()
+                }, esp.lang("mart/complaint_discuss", "cancel"), () => { })
+              }} style={{ flexDirection: 'row', alignItems: 'center', backgroundColor: LibStyle.colorPrimaryMart, borderRadius: 20, padding: 10, width: LibStyle.width * 0.5 - 20, justifyContent: 'center' }} >
+                <Text allowFontScaling={false} style={{ fontFamily: 'Arial', fontSize: 12, paddingRight: 10, color: 'white' }} >{esp.lang("mart/complaint_discuss", "refund")}</Text>
+                <LibIcon name="send" color={'white'} size={18} />
+              </TouchableOpacity>
+            }
+            {
+              !isMitra && data?.solve == 1 &&
+              <TouchableOpacity onPress={() => {
+                LibDialog.warningConfirm(esp.lang("mart/complaint_discuss", "complete_complaint"), esp.lang("mart/complaint_discuss", "confirm_complete_complaint"), esp.lang("mart/complaint_discuss", "next"), () => {
+                  solveComplaint()
+                }, esp.lang("mart/complaint_discuss", "back"), () => { })
+              }} style={{ flexDirection: 'row', alignItems: 'center', backgroundColor: LibStyle.colorPrimaryMart, borderRadius: 20, padding: 10, width: LibStyle.width * 0.5 - 20, justifyContent: 'center' }} >
+                <Text allowFontScaling={false} style={{ fontFamily: 'Arial', fontSize: 12, paddingRight: 10, color: 'white' }} >{esp.lang("mart/complaint_discuss", "complete_complaint")}</Text>
+                <LibIcon name="check-all" color={'white'} size={18} />
+              </TouchableOpacity>
+            }
+          </View>
+        }
+
+        <View style={{ flexDirection: 'row', alignItems: 'center', marginHorizontal: 10, marginBottom: 10, marginTop: 5, backgroundColor: 'white' }} >
+          <View style={{ flexDirection: 'row', flex: 1, borderWidth: 1, borderColor: '#999', height: 36, borderRadius: 18, justifyContent: 'center' }} >
+            <LibInput
+              ref={input}
+              base
+              editable={!(data?.status?.id > 3)}
+              placeholder={esp.lang("mart/complaint_discuss", "input_message")}
+              defaultValue={data?.status?.id > 3 ? esp.lang("mart/complaint_discuss", "this_complaint_done") : ''}
+              onChangeText={(x) => { textMsg = x }}
+              multiline
+              allowFontScaling={false}
+              style={{ flex: 1, marginHorizontal: 10 }}
+            />
+            <TouchableOpacity disabled={data?.status?.id > 3} onPress={() => imagePicker.current!.show()} activeOpacity={1} style={{ alignItems: 'center', justifyContent: 'center', marginHorizontal: 10 }} >
+              <LibIcon name="paperclip" size={20} color='#999' />
+            </TouchableOpacity>
+          </View>
+          <TouchableOpacity disabled={data?.status?.id > 3} onPress={() => {
+            if (textMsg != '') {
+              sendMessage()
+            }
+          }} activeOpacity={1} style={{ marginLeft: 5, alignItems: 'center', justifyContent: 'center' }} >
+            <LibIcon name="send-circle" size={40} color='#999' />
+          </TouchableOpacity>
+        </View>
+
+        <MartImage_picker
+          _ref={imagePicker}
+          onFinish={(x: any) => {
+            sendAttach(x)
+          }}
+        />
+
+      </View >
+    </LibKeyboard_avoid>
+  )
+}