update caculatorprofitloss

src/Config/constants.js

-import I18n from '../helper/i18/i18n'
+import I18n from '../helper/i18/i18n';
 export const RadioBuySale = [
-    {label: I18n.t('Buy'), value: 0},
-    {label: I18n.t('Sale'), value: 1}
-]
+  {label: I18n.t('Buy'), value: 'BUY_IN'},
+  {label: I18n.t('Sale'), value: 'SELL_OUT'},
+];

src/Screens/Tool/CalculatorProfitLoss/CalculatorProfitLoss.js

@@ -4,8 +4,13 @@ import {RadioBuySale} from '../../../Config/constants';
 import I18n from '../../../helper/i18/i18n';
 import {checkFormatArray} from '../../../Config/Functions';
 import {showAlert, TYPE} from '../../../components/DropdownAlert';
-import {getTransactionListByCategory} from '../../../apis/Functions/Transaction';
+import {
+  getTransactionListByCategory,
+  getProfitLost,
+} from '../../../apis/Functions/Transaction';
 import {Platform} from 'react-native';
+import {showLoading, hideLoading} from '../../../actions/loadingAction';
+import {connect} from 'react-redux';
 
 const CalculatorProfitLoss = (props) => {
   const [dataProduct, setDataProduct] = useState([]);
@@ -16,8 +21,8 @@ const CalculatorProfitLoss = (props) => {
   const [openPrice, setOpenPrice] = useState(null);
   const [closeStatusPrice, setCloseStatusPrice] = useState(null);
   useEffect(() => {
-        getProductData()
-    }, [])
+    getProductData();
+  }, []);
 
   const getProductData = async () => {
     const res = await getTransactionListByCategory({
@@ -31,12 +36,11 @@ const CalculatorProfitLoss = (props) => {
     if (res.status == 200 && res.data.code == 200) {
       setDataProduct(res.data.data);
     } else {
-            showAlert(TYPE.ERROR, I18n.t('Notification', I18n.t('Can_not_get_data')))
+      showAlert(TYPE.ERROR, I18n.t('Notification', I18n.t('Can_not_get_data')));
     }
   };
 
-
-    const onCalculator = () => {
+  const onCalculator = async () => {
     const titles = [
       I18n.t('Product'),
       I18n.t('LotTransactionNumber'),
@@ -51,28 +55,56 @@ const CalculatorProfitLoss = (props) => {
     ]);
 
     if (index === true) {
-            let newData = [...dataCalculator]
-            newData.push({
-                name: product.name,
-                status: RadioBuySale[transactionType].label,
-                slot_number: 6,
-                profit_loss_usd: 639324325,
-                profit_loss_vnd: 1234349235455,
-            })
-            setDataCalculator(newData)
-            setLotTransactionNumber(null)
-            setOpenPrice(null)
-            setCloseStatusPrice(null)
+      props.showLoading();
+
+      const res = await getProfitLost({
+        commodity_id: product.id,
+        platform: Platform.OS,
+        transaction_type: transactionType,
+        lot_number: lotTransactionNumber,
+        open_price: openPrice,
+        close_price: closeStatusPrice,
+      });
+      props.hideLoading();
+      if (res.status == 200 && res.data.code == 200) {
+        const newList = [res.data.data].concat(dataCalculator);
+        setDataCalculator(newList);
+        setLotTransactionNumber(null);
+        setOpenPrice(null);
+        setCloseStatusPrice(null);
+      } else {
+        showAlert(
+          TYPE.ERROR,
+          I18n.t('Notification', I18n.t('Can_not_get_data')),
+        );
+      }
+
+      // let newData = [...dataCalculator]
+      // newData.push({
+      //     name: product.name,
+      //     status: RadioBuySale[transactionType].label,
+      //     slot_number: 6,
+      //     profit_loss_usd: 639324325,
+      //     profit_loss_vnd: 1234349235455,
+      // })
+      // setDataCalculator(newData)
+      // setLotTransactionNumber(null)
+      // setOpenPrice(null)
+      // setCloseStatusPrice(null)
     } else {
-            showAlert(TYPE.ERROR, I18n.t('Notification'), `${I18n.t('Please_fill_in')}${titles[index]}`)
+      showAlert(
+        TYPE.ERROR,
+        I18n.t('Notification'),
+        `${I18n.t('Please_fill_in')}${titles[index]}`,
+      );
     }
   };
 
   const onDelete = () => {
-        setDataCalculator([])
-        setLotTransactionNumber(null)
-        setOpenPrice(null)
-        setCloseStatusPrice(null)
+    setDataCalculator([]);
+    setLotTransactionNumber(null);
+    setOpenPrice(null);
+    setCloseStatusPrice(null);
   };
 
   const setLotNumber = (text) => {
@@ -105,4 +137,11 @@ const CalculatorProfitLoss = (props) => {
   );
 };
 
-export default CalculatorProfitLoss;
+const mapStateToProps = (state) => {
+  return {
+    user: state.userReducer,
+  };
+};
+export default connect(mapStateToProps, {showLoading, hideLoading})(
+  CalculatorProfitLoss,
+);

src/Screens/Tool/CalculatorProfitLoss/CalculatorProfitLossView.js

 import React, {Component} from 'react';
-import {View, Text, StyleSheet, TouchableOpacity, FlatList, ScrollView} from 'react-native';
+import {
+  View,
+  Text,
+  StyleSheet,
+  TouchableOpacity,
+  FlatList,
+  ScrollView,
+} from 'react-native';
 import HeaderBack from '../../../components/Header/HeaderBack';
-import {getFontXD, HEIGHTXD, toPriceVnd, WIDTHXD} from '../../../Config/Functions';
+import {
+  getFontXD,
+  HEIGHTXD,
+  toPriceVnd,
+  WIDTHXD,
+} from '../../../Config/Functions';
 import I18n from '../../../helper/i18/i18n';
 import PickerItem from '../../../components/Picker/PickerItem';
 import R from '../../../assets/R';
@@ -9,17 +21,19 @@ import RadioForm from 'react-native-simple-radio-button';
 import {RadioBuySale} from '../../../Config/constants';
 import TextMoney from '../../../components/Input/InputMoney';
 import ItemCalculator from './ItemCalculator';
+import AppText from '../../../components/AppText';
 
 const CalculatorProfitLossView = (props) => {
   return (
     <View style={{flex: 1, flexDirection: 'column', backgroundColor: 'white'}}>
-            <HeaderBack title={'CalculatorProfitLoss'} isWhite={true}/>
+      <HeaderBack title={'CalculatorProfitLoss'} isWhite={true} />
       <ScrollView>
-                <View style={{paddingHorizontal: WIDTHXD(60), paddingVertical: HEIGHTXD(60)}}>
-                    <Text
-                        style={styles.textTitle}>
-                        {I18n.t('Product')}
-                    </Text>
+        <View
+          style={{
+            paddingHorizontal: WIDTHXD(60),
+            paddingVertical: HEIGHTXD(60),
+          }}>
+          <Text style={styles.textTitle}>{I18n.t('Product')}</Text>
           <PickerItem
             data={props.dataProduct}
             onValueChange={(value, item) => {
@@ -29,10 +43,9 @@ const CalculatorProfitLossView = (props) => {
             iconSize={WIDTHXD(40)}
             iconColor={R.colors.black}
           />
-                    <Text
-                        style={[styles.textTitle, {marginTop: HEIGHTXD(30)}]}>
+          <AppText style={[styles.textTitle, {marginTop: HEIGHTXD(30)}]}>
             {I18n.t('Tradding')}
-                    </Text>
+          </AppText>
           <View style={{width: WIDTHXD(600), height: HEIGHTXD(85)}}>
             <RadioForm
               radio_props={RadioBuySale}
@@ -70,22 +83,30 @@ const CalculatorProfitLossView = (props) => {
             value={toPriceVnd(props.closeStatusPrice)}
             titleStyle={{marginTop: HEIGHTXD(20), fontSize: getFontXD(39)}}
           />
-                    <View style={{
+          <View
+            style={{
               width: '100%',
               flexDirection: 'row',
               justifyContent: 'center',
               alignItems: 'center',
               marginTop: HEIGHTXD(50),
             }}>
-                        <TouchableOpacity onPress={() => {
+            <TouchableOpacity
+              onPress={() => {
                 props.onDelete();
-                        }} style={[styles.btn, {backgroundColor: R.colors.red2, marginRight: WIDTHXD(72)}]}>
+              }}
+              style={[
+                styles.btn,
+                {backgroundColor: R.colors.red2, marginRight: WIDTHXD(72)},
+              ]}>
               <Text style={styles.txtButton}>{I18n.t('Delete')}</Text>
             </TouchableOpacity>
-                        <TouchableOpacity onPress={() => {
+            <TouchableOpacity
+              onPress={() => {
                 props.onCalculator();
-                        }} style={styles.btn}>
-                            <Text style={styles.txtButton}>{I18n.t('Calculator')}</Text>
+              }}
+              style={styles.btn}>
+              <Text style={styles.txtButton}>{I18n.t('Caculate')}</Text>
             </TouchableOpacity>
           </View>
         </View>
@@ -93,8 +114,12 @@ const CalculatorProfitLossView = (props) => {
           style={{paddingBottom: HEIGHTXD(15), backgroundColor: R.colors.white}}
           keyExtractor={(item) => item.id}
           data={props.dataCalculator}
-                    renderItem={({item, index}) => <ItemCalculator item={item}
-                                                                   isLastItem={index === props.dataCalculator.length - 1}/>}
+          renderItem={({item, index}) => (
+            <ItemCalculator
+              item={item}
+              isLastItem={index === props.dataCalculator.length - 1}
+            />
+          )}
         />
       </ScrollView>
     </View>

src/Screens/Tool/CalculatorProfitLoss/ItemCalculator.js

@@ -4,12 +4,18 @@ import {
   TouchableOpacity,
   Text,
   LayoutAnimation,
-    StyleSheet
+  StyleSheet,
 } from 'react-native';
 import R from '../../../assets/R';
 
 import Ionicons from 'react-native-vector-icons/Ionicons';
-import {getFontXD, getLineHeightXD, HEIGHTXD, toPriceVnd, WIDTHXD} from '../../../Config/Functions';
+import {
+  getFontXD,
+  getLineHeightXD,
+  HEIGHTXD,
+  toPriceVnd,
+  WIDTHXD,
+} from '../../../Config/Functions';
 import I18n from '../../../helper/i18/i18n';
 import TextField from '../../../components/TextField';
 import {RadioBuySale} from '../../../Config/constants';
@@ -29,66 +35,78 @@ const ItemCalculator = (props) => {
         springDamping: 1.7,
       },
     });
-        setExpanded(!expanded)
+    setExpanded(!expanded);
   };
+  console.log(props.item.transaction_type);
 
   return (
-        <View style={[styles.container, {marginBottom: props.isLastItem? HEIGHTXD(100) : HEIGHTXD(30)}]}>
+    <View
+      style={[
+        styles.container,
+        {marginBottom: props.isLastItem ? HEIGHTXD(100) : HEIGHTXD(30)},
+      ]}>
       <TouchableOpacity
         onPress={() => changeLayout()}
-                style={[styles.flexTitle, { borderBottomWidth: expanded === true ? 0.3 : 0, paddingHorizontal: WIDTHXD(30) }]}
-            >
+        style={[
+          styles.flexTitle,
+          {
+            borderBottomWidth: expanded === true ? 0.3 : 0,
+            paddingHorizontal: WIDTHXD(30),
+          },
+        ]}>
         <Text style={styles.title}>{props.item.name}</Text>
         {expanded === true ? (
           <Ionicons
-                        name='chevron-up'
+            name="chevron-up"
             size={WIDTHXD(50)}
-                        style={{ marginRight: WIDTHXD(25) }}
+            style={{marginRight: WIDTHXD(25)}}
             color={R.colors.iconGray}
           />
         ) : (
           <Ionicons
-                        name='chevron-down'
+            name="chevron-down"
             size={WIDTHXD(50)}
-                        style={{ marginRight: WIDTHXD(25) }}
+            style={{marginRight: WIDTHXD(25)}}
             color={R.colors.iconGray}
           />
         )}
       </TouchableOpacity>
-            {expanded ?
+      {expanded ? (
         <View style={{paddingVertical: HEIGHTXD(20)}}>
           <TextField
             title={I18n.t('Status')}
-                        content={props.item.status}
-                        color={props.item.status == RadioBuySale[0].label ? R.colors.green : R.colors.red2}
+            content={I18n.t(props.item.transaction_type)}
+            color={
+              props.item.transaction_type == 'SELL_OUT'
+                ? R.colors.green
+                : R.colors.red2
+            }
           />
           <TextField
             title={I18n.t('SlotNumber')}
-                        content={props.item.slot_number}
+            content={props.item.lot_number}
           />
           <TextField
             title={`${I18n.t('ProfitLoss')} (USD)`}
-                        content={toPriceVnd(props.item.profit_loss_usd)}
+            content={toPriceVnd(props.item.profit.USD)}
           />
           <TextField
             title={`${I18n.t('ProfitLoss')} (VNĐ)`}
-                        content={toPriceVnd(props.item.profit_loss_vnd)}
+            content={toPriceVnd(props.item.profit.VND)}
           />
         </View>
-                : null
-            }
+      ) : null}
     </View>
-    )
-
-}
-export default ItemCalculator
+  );
+};
+export default ItemCalculator;
 const styles = StyleSheet.create({
   container: {
     backgroundColor: R.colors.white,
     borderColor: R.colors.borderGray,
     borderWidth: 0.3,
     marginHorizontal: WIDTHXD(40),
-        marginBottom: HEIGHTXD(30)
+    marginBottom: HEIGHTXD(30),
   },
   flexTitle: {
     flexDirection: 'row',
@@ -102,4 +120,4 @@ const styles = StyleSheet.create({
     lineHeight: getLineHeightXD(56),
     color: R.colors.black,
   },
-})
+});

src/apis/Functions/General.js

@@ -15,3 +15,8 @@ export const sendRequest = async (body) =>
   PostData(url.urlSendRequest, body)
     .then((res) => res)
     .catch((err) => err);
+
+export const getProfitLost = async (body) =>
+  PostData(url.urlProfitLost, body)
+    .then((res) => res)
+    .catch((err) => err);

src/apis/Functions/Transaction.js

-import {GetData} from '../helpers';
+import {GetData, PostData} from '../helpers';
 
 import url from '../url';
 
@@ -16,3 +16,8 @@ export const getContractDescription = async (id) =>
   GetData(`${url.urlGetContractDescription}${id}`)
     .then((res) => res)
     .catch((err) => err);
+
+export const getProfitLost = async (body) =>
+  PostData(url.urlProfitLost, body)
+    .then((res) => res)
+    .catch((err) => err);

src/apis/url.js

@@ -53,4 +53,6 @@ export default {
 
   urlFeedback: root + 'api/v1/customers/send-feedback',
   urlSendRequest: root + 'api/v1/customers/send-request',
+
+  urlProfitLost: root + 'api/v1/customers/calculate-profit',
 };

src/components/TextField.js

-import React from 'react'
-import {
-    View,
-    Text,
-    StyleSheet
-} from 'react-native'
+import React from 'react';
+import {View, Text, StyleSheet} from 'react-native';
 import R from '../assets/R';
 import {getFontXD, HEIGHTXD, WIDTHXD} from '../Config/Functions';
 
 const TextField = (props) => {
-    const {color} = props
+  const {color} = props;
   return (
-        <View style={[styles.row, { paddingVertical: WIDTHXD(15) }]}>
+    <View style={[styles.row, {paddingVertical: WIDTHXD(15)}]}>
       <Text style={styles.title}>{props.title}</Text>
       <Text style={[styles.content, color && {color}]}>{props.content}</Text>
     </View>
-    )
-}
-export default TextField
+  );
+};
+export default TextField;
 const styles = StyleSheet.create({
   row: {
     paddingHorizontal: HEIGHTXD(30),
@@ -25,11 +21,11 @@ const styles = StyleSheet.create({
   title: {
     flex: 2.7,
     fontSize: getFontXD(36),
-        color: R.colors.color777
+    color: R.colors.color777,
   },
   content: {
     flex: 3.5,
     fontSize: getFontXD(36),
     color: R.colors.black,
   },
-})
+});

src/helper/i18/locales/en.js

@@ -272,4 +272,6 @@ export default {
   CloseStatusPrice: 'Close stauts price',
   SlotNumber: 'Slot number',
   ProfitLoss: 'Profit/Loss',
+  BUY_IN: 'Buy in',
+  SELL_OUT: 'Sell out',
 };

src/helper/i18/locales/vn.js

@@ -257,4 +257,14 @@ export default {
   ConvertUSD: 'Quy đổi  USD/Tấn',
   Saturday: 'Thứ 7',
   Sunday: 'Chủ nhật',
+  LotTransactionNumber: 'Số lot giao dịch',
+  OpenPrice: 'Giá mở trạng thái',
+  CloseStatusPrice: 'Giá đóng trạng thái',
+  Buy: 'Mua',
+  Sale: 'Bán',
+  SlotNumber: 'Số lót',
+  ProfitLoss: 'Lãi/lỗ',
+  CalculatorProfitLoss: 'Tính lãi lỗ',
+  BUY_IN: 'Mua vào',
+  SELL_OUT: 'Bán ra',
 };