Commit 151a84a2 by Nguyễn Thị Thúy

complete escrow calculator

parent a957bd76
import React, {useEffect, useRef} from 'react';
import {
View,
Text,
ImageBackground,
StyleSheet,
StatusBar,
SafeAreaView,
View,
} from 'react-native';
import {connect} from 'react-redux';
......@@ -16,7 +11,6 @@ import {enableScreens} from 'react-native-screens';
import NoInternetComponent from './components/NoInternet';
import DropdownAlert from 'react-native-dropdownalert';
import DeviceInfo from 'react-native-device-info';
import VersionChecker from './Screens/VersionChecker';
import R from './assets/R';
import {WIDTHXD, HEIGHTXD} from './Config/Functions';
import DropdownManager from './components/DropdownAlert/DropdownManager';
......@@ -24,78 +18,71 @@ import DropdownManager from './components/DropdownAlert/DropdownManager';
enableScreens();
const RootView = (props) => {
useEffect(() => {
DropdownManager.register(
dropDownAlertRef.current,
dropDownAlertLongTimeRef.current,
);
}, []);
const dropDownAlertRef = useRef(null);
const dropDownAlertLongTimeRef = useRef(null);
useEffect(() => {
DropdownManager.register(
dropDownAlertRef.current,
dropDownAlertLongTimeRef.current,
);
}, []);
const checkVersion = (props) => {
const verCurrent = DeviceInfo.getVersion();
console.log('version current', verCurrent);
};
const dropDownAlertRef = useRef(null);
const dropDownAlertLongTimeRef = useRef(null);
return (
<>
<View style={{flex: 1}}>
<Modal isVisible={props.loadingModal.isVisible}>
<SkypeIndicator color={'white'} />
</Modal>
<StackNavigation />
</View>
{/*<VersionChecker/>*/}
<DropdownAlert
inactiveStatusBarBackgroundColor={R.colors.main}
activeStatusBarBackgroundColor={R.colors.main}
warnImageSrc={R.images.iconWarn}
successImageSrc={R.images.iconSuccess}
errorImageSrc={R.images.iconError}
titleStyle={{color: '#fff'}}
messageStyle={{color: '#fff'}}
closeInterval={1000}
ref={dropDownAlertRef}
warnColor={R.colors.orange400}
defaultContainer={{
borderBottomRightRadius: WIDTHXD(30),
borderBottomLeftRadius: WIDTHXD(30),
paddingTop: HEIGHTXD(30),
paddingVertical: HEIGHTXD(30),
paddingHorizontal: WIDTHXD(20),
}}
/>
<DropdownAlert
inactiveStatusBarBackgroundColor={R.colors.colorMain}
activeStatusBarBackgroundColor={R.colors.colorMain}
warnImageSrc={R.images.iconWarn}
successImageSrc={R.images.iconSuccess}
errorImageSrc={R.images.iconError}
titleStyle={{color: '#fff'}}
messageStyle={{color: '#fff'}}
closeInterval={600000}
ref={dropDownAlertLongTimeRef}
warnColor={R.colors.orange400}
defaultContainer={{
borderBottomRightRadius: WIDTHXD(30),
borderBottomLeftRadius: WIDTHXD(30),
paddingTop: HEIGHTXD(30),
paddingVertical: HEIGHTXD(30),
paddingHorizontal: WIDTHXD(20),
}}
/>
<NoInternetComponent />
</>
);
return (
<>
<View style={{flex: 1}}>
<Modal isVisible={props.loadingModal.isVisible}>
<SkypeIndicator color={'white'}/>
</Modal>
<StackNavigation/>
</View>
<DropdownAlert
inactiveStatusBarBackgroundColor={R.colors.main}
activeStatusBarBackgroundColor={R.colors.main}
warnImageSrc={R.images.iconWarn}
successImageSrc={R.images.iconSuccess}
errorImageSrc={R.images.iconError}
titleStyle={{color: '#fff'}}
messageStyle={{color: '#fff'}}
closeInterval={1000}
ref={dropDownAlertRef}
warnColor={R.colors.orange400}
defaultContainer={{
borderBottomRightRadius: WIDTHXD(30),
borderBottomLeftRadius: WIDTHXD(30),
paddingTop: HEIGHTXD(30),
paddingVertical: HEIGHTXD(30),
paddingHorizontal: WIDTHXD(20),
}}
/>
<DropdownAlert
inactiveStatusBarBackgroundColor={R.colors.colorMain}
activeStatusBarBackgroundColor={R.colors.colorMain}
warnImageSrc={R.images.iconWarn}
successImageSrc={R.images.iconSuccess}
errorImageSrc={R.images.iconError}
titleStyle={{color: '#fff'}}
messageStyle={{color: '#fff'}}
closeInterval={600000}
ref={dropDownAlertLongTimeRef}
warnColor={R.colors.orange400}
defaultContainer={{
borderBottomRightRadius: WIDTHXD(30),
borderBottomLeftRadius: WIDTHXD(30),
paddingTop: HEIGHTXD(30),
paddingVertical: HEIGHTXD(30),
paddingHorizontal: WIDTHXD(20),
}}
/>
<NoInternetComponent/>
</>
);
};
const mapStateToProps = (state) => {
return {
loadingModal: state.ModalLoadingReducer,
};
return {
loadingModal: state.ModalLoadingReducer,
};
};
export default connect(mapStateToProps, {})(RootView);
......@@ -11,186 +11,196 @@ import {getListCategoryProduct} from '../../apis/Functions/Transaction';
import {hideLoading, showLoading} from '../../actions/loadingAction';
import _ from 'lodash';
import {showAlert, TYPE} from '../../components/DropdownAlert/index';
import VersionChecker from '../VersionChecker';
const Home = (props) => {
const [data, setData] = useState({total_deposit: 0, total_withdraw: 0});
const [dataPrice, setDataPrice] = useState([]);
const [dataPriceFilter, setDataPriceFilter] = useState([]);
const [listImage, setListImage] = useState([]);
const [filters, setFilters] = useState([]);
const [filterId, setFilterId] = useState(-1);
const [isSortName, setIsSortName] = useState(null);
const [isSortPercent, setIsSortPercent] = useState(null);
const [isSortPriceOpenClose, setIsSortPriceOpenClose] = useState(null);
const [isSortPriceHighLow, setIsSortPriceHighLow] = useState(null);
const SORT_TYPE = {
DESC: 'DESC',
ASC: 'ASC',
};
useEffect(() => {
getData();
initSocket();
}, []);
useEffect(() => {
const newList =
filterId == -1
? [...dataPrice]
: _.filter([...dataPrice], (item) => item.category_id == filterId);
setDataPriceFilter(newList);
}, [dataPrice]);
const [data, setData] = useState({total_deposit: 0, total_withdraw: 0});
const [dataPrice, setDataPrice] = useState([]);
const [dataPriceFilter, setDataPriceFilter] = useState([]);
const [listImage, setListImage] = useState([]);
const [filters, setFilters] = useState([]);
const [filterId, setFilterId] = useState(-1);
const [isSortName, setIsSortName] = useState(null);
const [isSortPercent, setIsSortPercent] = useState(null);
const [isSortPriceOpenClose, setIsSortPriceOpenClose] = useState(null);
const [isSortPriceHighLow, setIsSortPriceHighLow] = useState(null);
const SORT_TYPE = {
DESC: 'DESC',
ASC: 'ASC',
};
useEffect(() => {
getData();
initSocket();
}, []);
useEffect(() => {
const newList =
filterId == -1
? [...dataPrice]
: _.filter([...dataPrice], (item) => item.category_id == filterId);
setDataPriceFilter(newList);
}, [dataPrice]);
const initSocket = () => {
let io = require('socket.io-client');
let socket = io.connect('http://222.252.22.174:8087', {
transports: ['websocket'],
jsonp: false,
reconnect: true,
});
socket.on('response-update-price', (message) => {
receivedMessage(message);
});
};
const initSocket = () => {
let io = require('socket.io-client');
let socket = io.connect('http://222.252.22.174:8087', {
transports: ['websocket'],
jsonp: false,
reconnect: true,
});
socket.on('response-update-price', (message) => {
receivedMessage(message);
});
};
const receivedMessage = (message) => {
setDataPrice(message);
};
const receivedMessage = (message) => {
setDataPrice(message);
};
const getData = async () => {
props.showLoading();
const res = await getTransaction({});
if (res.data.code == 200 && res.data.data) {
setData(res.data.data);
} else {
showAlert(TYPE.ERROR, I18n.t('Notification'), I18n.t('Can_not_get_data'));
}
const getData = async () => {
props.showLoading();
const res = await getTransaction({});
if (res.data.code == 200 && res.data.data) {
setData(res.data.data);
} else {
showAlert(TYPE.ERROR, I18n.t('Notification'), I18n.t('Can_not_get_data'));
}
const res1 = await getImagesHome({});
if (res1.data.code == 200 && res1.data.data) {
setListImage(res1.data.data);
} else {
showAlert(TYPE.ERROR, I18n.t('Notification'), I18n.t('Can_not_get_data'));
}
const resCategoryProduct = await getListCategoryProduct({
keyword: '',
platform: Platform.OS,
page_size: 20,
page_index: 1,
type: 'PRODUCT',
});
console.log(resCategoryProduct);
const res1 = await getImagesHome({});
if (res1.data.code == 200 && res1.data.data) {
setListImage(res1.data.data);
} else {
showAlert(TYPE.ERROR, I18n.t('Notification'), I18n.t('Can_not_get_data'));
}
const resCategoryProduct = await getListCategoryProduct({
keyword: '',
platform: Platform.OS,
page_size: 20,
page_index: 1,
type: 'PRODUCT',
});
console.log(resCategoryProduct);
if ((resCategoryProduct.data.code = 200 && resCategoryProduct.data.data)) {
let data = [];
data.push({id: -1, name: 'All'});
setFilters(data.concat([...resCategoryProduct.data.data]));
} else {
showAlert(TYPE.ERROR, I18n.t('Notification'), res.data.message);
}
const resPriceHome = await getPriceTable({});
if (resPriceHome.data.code == 200 && resPriceHome.data.data) {
setDataPrice(resPriceHome.data.data);
setDataPriceFilter(resPriceHome.data.data);
} else {
showAlert(TYPE.ERROR, I18n.t('Notification'), I18n.t('Can_not_get_data'));
}
props.hideLoading();
if ((resCategoryProduct.data.code = 200 && resCategoryProduct.data.data)) {
let data = [];
data.push({id: -1, name: 'All'});
setFilters(data.concat([...resCategoryProduct.data.data]));
} else {
showAlert(TYPE.ERROR, I18n.t('Notification'), res.data.message);
}
const resPriceHome = await getPriceTable({});
if (resPriceHome.data.code == 200 && resPriceHome.data.data) {
setDataPrice(resPriceHome.data.data);
setDataPriceFilter(resPriceHome.data.data);
} else {
showAlert(TYPE.ERROR, I18n.t('Notification'), I18n.t('Can_not_get_data'));
}
props.hideLoading();
console.log('filterId', filterId);
console.log('filters', filters);
};
console.log('filterId', filterId);
console.log('filters', filters);
};
const changeFilter = (id) => {
setFilterId(id);
const newList =
id == -1
? [...dataPrice]
: _.filter([...dataPrice], (item) => item.category_id == id);
setDataPriceFilter(newList);
console.log(id, newList);
};
const changeFilter = (id) => {
setFilterId(id);
const newList =
id == -1
? [...dataPrice]
: _.filter([...dataPrice], (item) => item.category_id == id);
setDataPriceFilter(newList);
console.log(id, newList);
};
const onSortByName = () => {
let type = 'ASC';
if (!isSortName || isSortName == SORT_TYPE.ASC) type = SORT_TYPE.DESC;
let newData =
type == SORT_TYPE.ASC
? [...dataPriceFilter].sort((a, b) => (a.name > b.name ? 1 : -1))
: [...dataPriceFilter].sort((a, b) => (a.name < b.name ? 1 : -1));
setDataPriceFilter(newData);
setIsSortPriceOpenClose(null);
setIsSortName(type);
setIsSortPercent(null);
setIsSortPriceHighLow(null);
};
const onSortByPercent = () => {
let type = 'ASC';
if (!isSortPercent || isSortPercent == SORT_TYPE.ASC) type = SORT_TYPE.DESC;
let newData =
type == SORT_TYPE.ASC
? [...dataPriceFilter].sort((a, b) => (a.change > b.change ? 1 : -1))
: [...dataPriceFilter].sort((a, b) => (a.change < b.change ? 1 : -1));
setDataPriceFilter(newData);
setIsSortPriceOpenClose(null);
setIsSortName(null);
setIsSortPercent(type);
setIsSortPriceHighLow(null);
};
const onSortByPriceOpenClose = () => {
let type = 'ASC';
if (!isSortPriceOpenClose || isSortPriceOpenClose == SORT_TYPE.ASC)
type = SORT_TYPE.DESC;
let newData =
type == SORT_TYPE.ASC
? [...dataPriceFilter].sort((a, b) =>
a.open_price > b.open_price ? 1 : -1,
)
: [...dataPriceFilter].sort((a, b) =>
a.open_price < b.open_price ? 1 : -1,
);
setDataPriceFilter(newData);
setIsSortPriceOpenClose(type);
setIsSortName(null);
setIsSortPercent(null);
setIsSortPriceHighLow(null);
};
const onSortByPriceHighLow = () => {
let type = 'ASC';
if (!isSortPriceHighLow || isSortPriceHighLow == SORT_TYPE.ASC)
type = SORT_TYPE.DESC;
let newData =
type == SORT_TYPE.ASC
? [...dataPriceFilter].sort((a, b) =>
a.high_price > b.high_price ? 1 : -1,
)
: [...dataPriceFilter].sort((a, b) =>
a.high_price < b.high_price ? 1 : -1,
);
setDataPriceFilter(newData);
setIsSortPriceOpenClose(null);
setIsSortName(null);
setIsSortPercent(null);
setIsSortPriceHighLow(type);
};
const onSortByName = () => {
let type = 'ASC';
if (!isSortName || isSortName == SORT_TYPE.ASC) {
type = SORT_TYPE.DESC;
}
let newData =
type == SORT_TYPE.ASC
? [...dataPriceFilter].sort((a, b) => (a.name > b.name ? 1 : -1))
: [...dataPriceFilter].sort((a, b) => (a.name < b.name ? 1 : -1));
setDataPriceFilter(newData);
setIsSortPriceOpenClose(null);
setIsSortName(type);
setIsSortPercent(null);
setIsSortPriceHighLow(null);
};
const onSortByPercent = () => {
let type = 'ASC';
if (!isSortPercent || isSortPercent == SORT_TYPE.ASC) {
type = SORT_TYPE.DESC;
}
let newData =
type == SORT_TYPE.ASC
? [...dataPriceFilter].sort((a, b) => (a.change > b.change ? 1 : -1))
: [...dataPriceFilter].sort((a, b) => (a.change < b.change ? 1 : -1));
setDataPriceFilter(newData);
setIsSortPriceOpenClose(null);
setIsSortName(null);
setIsSortPercent(type);
setIsSortPriceHighLow(null);
};
const onSortByPriceOpenClose = () => {
let type = 'ASC';
if (!isSortPriceOpenClose || isSortPriceOpenClose == SORT_TYPE.ASC) {
type = SORT_TYPE.DESC;
}
let newData =
type == SORT_TYPE.ASC
? [...dataPriceFilter].sort((a, b) =>
a.open_price > b.open_price ? 1 : -1,
)
: [...dataPriceFilter].sort((a, b) =>
a.open_price < b.open_price ? 1 : -1,
);
setDataPriceFilter(newData);
setIsSortPriceOpenClose(type);
setIsSortName(null);
setIsSortPercent(null);
setIsSortPriceHighLow(null);
};
const onSortByPriceHighLow = () => {
let type = 'ASC';
if (!isSortPriceHighLow || isSortPriceHighLow == SORT_TYPE.ASC) {
type = SORT_TYPE.DESC;
}
let newData =
type == SORT_TYPE.ASC
? [...dataPriceFilter].sort((a, b) =>
a.high_price > b.high_price ? 1 : -1,
)
: [...dataPriceFilter].sort((a, b) =>
a.high_price < b.high_price ? 1 : -1,
);
setDataPriceFilter(newData);
setIsSortPriceOpenClose(null);
setIsSortName(null);
setIsSortPercent(null);
setIsSortPriceHighLow(type);
};
return (
<HomeView
data={data}
dataPrice={dataPriceFilter}
listImage={listImage}
filterId={filterId}
filters={filters}
setFilterId={changeFilter}
onSortByName={onSortByName}
onSortByPercent={onSortByPercent}
onSortByPriceOpenClose={onSortByPriceOpenClose}
onSortByPriceHighLow={onSortByPriceHighLow}
/>
);
return (
<>
<HomeView
data={data}
dataPrice={dataPriceFilter}
listImage={listImage}
filterId={filterId}
filters={filters}
setFilterId={changeFilter}
onSortByName={onSortByName}
onSortByPercent={onSortByPercent}
onSortByPriceOpenClose={onSortByPriceOpenClose}
onSortByPriceHighLow={onSortByPriceHighLow}
/>
<VersionChecker/>
</>
);
};
const mapStateToProps = (state) => {
return {
user: state.userReducer,
};
return {
user: state.userReducer,
};
};
export default connect(mapStateToProps, {showLoading, hideLoading})(Home);
......@@ -36,7 +36,7 @@ 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'));
}
};
......
......@@ -37,7 +37,7 @@ const ItemCalculator = (props) => {
});
setExpanded(!expanded);
};
console.log(props.item.transaction_type);
console.log(props.item);
return (
<View
......@@ -78,8 +78,8 @@ const ItemCalculator = (props) => {
content={I18n.t(props.item.transaction_type)}
color={
props.item.transaction_type == 'SELL_OUT'
? R.colors.green
: R.colors.red2
? R.colors.red2
: R.colors.green
}
/>
<TextField
......
......@@ -12,11 +12,12 @@ const EscrowCalculator = (props) => {
lotNumber: null,
firstEscrow: 0,
}]);
const [firstEscrow, setFirstEscrow] = useState(null);
const [firstEscrow, setFirstEscrow] = useState(0);
const [firstEscrowTotal, setFirstEscrowTotal] = useState(0);
const [message, setMessage] = useState('');
useEffect(() => {
getProductData()
}, [])
getProductData();
}, []);
const getProductData = async () => {
const res = await getTransactionListByCategory({
......@@ -27,31 +28,56 @@ const EscrowCalculator = (props) => {
type: 'PRICE_TABLE',
category_id: -1,
});
console.log('res', res);
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 = () => {
if(firstEscrowTotal === '' || firstEscrowTotal == 0) {
showAlert(TYPE.WARN, I18n.t('Notification'), I18n.t('EnterContractInfo'));
return
}
if(firstEscrow === '' || firstEscrow == 0) {
showAlert(TYPE.WARN, I18n.t('Notification'), I18n.t('EnterFirstEscrow'));
return
}
if (parseFloat(firstEscrowTotal) <= parseFloat(firstEscrow)) {
setMessage(I18n.t('YouCanTransaction'));
} else {
setMessage(I18n.t('YouCanNotTransaction'));
}
};
const onDelete = () => {
setListInput([{
product: null,
lotNumber: null,
firstEscrow: 0,
}])
setFirstEscrow(0)
setFirstEscrowTotal(0)
setMessage('')
};
const setItemInput = (item, index) => {
let data = [...listInput]
data[index] = item
setListInput(data)
let firstEscrowTotalTmp = 0
let data = [...listInput];
data[index] = item;
setListInput(data);
let firstEscrowTotalTmp = 0;
data.map((item) => {
if(item.firstEscrow) firstEscrowTotalTmp = firstEscrowTotalTmp + item.firstEscrow
})
setFirstEscrowTotal(firstEscrowTotalTmp)
}
if (item.firstEscrow) {
firstEscrowTotalTmp = firstEscrowTotalTmp + item.firstEscrow;
}
});
setFirstEscrowTotal(firstEscrowTotalTmp);
};
const onAdd = () => {
let data = [...listInput];
data.push({
......@@ -73,6 +99,7 @@ const EscrowCalculator = (props) => {
firstEscrowTotal={firstEscrowTotal}
setItemInput={setItemInput}
setFirstEscrow={setFirstEscrow}
message={message}
/>
);
};
......
......@@ -35,11 +35,12 @@ const EscrowCalculatorView = (props) => {
dataProduct={props.dataProduct}
setProduct={(product) => {
item.product = product;
item.firstEscrow = parseFloat(item.lotNumber) * product.escrow;
props.setItemInput(item, index);
}}
setLotNumber={(lotNumber) => {
item.lotNumber = lotNumber.split('.').join('');
item.firstEscrow = parseFloat(item.lotNumber) * 12312;
item.firstEscrow = item.product ? parseFloat(item.lotNumber) * item.product.escrow : 0;
props.setItemInput(item, index);
}}
/>
......@@ -73,10 +74,7 @@ const EscrowCalculatorView = (props) => {
titleStyle={{marginTop: HEIGHTXD(20), fontSize: getFontXD(39)}}
inputStyle={{backgroundColor: R.colors.gray7}}
/>
<Text style={styles.textMessage}>
Bn có th giao dch các hp đồng k trên vi mc ký qu kh dung
hin ti
</Text>
<Text style={styles.textMessage}>{props.message}</Text>
</View>
<View
......
src/assets/images/iconUpgrade.png

4.2 KB | W: | H:

src/assets/images/iconUpgrade.png

2.25 KB | W: | H:

src/assets/images/iconUpgrade.png
src/assets/images/iconUpgrade.png
src/assets/images/iconUpgrade.png
src/assets/images/iconUpgrade.png
  • 2-up
  • Swipe
  • Onion skin
......@@ -257,8 +257,6 @@ export default {
'(estimated according to the current state processing rate of MXV)',
Caculate: 'Caculate',
ConversionUnit: 'Conversion unit',
Delete: 'Delete',
UnitsQuotedFloor: 'Units quoted in the floor',
ConversionPrice: 'Conversion price',
ConvertUSD: 'Convert USD/Ton',
......@@ -274,4 +272,9 @@ export default {
ProfitLoss: 'Profit/Loss',
BUY_IN: 'Buy in',
SELL_OUT: 'Sell out',
YouCanNotTransaction: 'You can not trade the above contracts with the current available escrow',
YouCanTransaction: 'You can trade the above contracts with the current available escrow',
EnterContractInfo: 'Enter contract information',
EnterFirstEscrow: 'Enter first escrow',
};
......@@ -251,7 +251,6 @@ export default {
noteStopLoss: 'Ước tính theo tỷ lệ xử lý trạng thái hiện tại của MXV',
Caculate: 'Tính',
ConversionUnit: 'Đơn vị quy đổi',
Delete: 'Xoá',
UnitsQuotedFloor: 'Đơn vị yết giá trên sàn',
ConversionPrice: 'Giá quy đổi',
ConvertUSD: 'Quy đổi USD/Tấn',
......@@ -269,4 +268,9 @@ export default {
SELL_OUT: 'Bán ra',
EscrowCalculator: 'Tính ký quỹ',
FirstEscrowTotal: 'Ký quỹ khả dụng',
YouCanNotTransaction: 'Bạn không thể giao dịch các hợp đồng kể trên với mức ký quỹ khả dụng hiện tại',
YouCanTransaction: 'Bạn có thể giao dịch các hợp đồng kể trên với mức ký quỹ khả dụng hiện tại',
EnterContractInfo: 'Nhập thông tin hợp đồng',
EnterFirstEscrow: 'Nhập ký quỹ ban đầu',
};
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment