add en/vi language
This commit is contained in:
@@ -1,4 +1,5 @@
|
||||
import { IconSymbol } from "@/components/ui/icon-symbol";
|
||||
import { useI18n } from "@/hooks/use-i18n";
|
||||
import React, { useEffect, useState } from "react";
|
||||
import {
|
||||
KeyboardAvoidingView,
|
||||
@@ -29,6 +30,7 @@ const TripCostDetailModal: React.FC<TripCostDetailModalProps> = ({
|
||||
onClose,
|
||||
data,
|
||||
}) => {
|
||||
const { t } = useI18n();
|
||||
const [isEditing, setIsEditing] = useState(false);
|
||||
const [editableData, setEditableData] = useState<Model.TripCost[]>(data);
|
||||
|
||||
@@ -94,7 +96,7 @@ const TripCostDetailModal: React.FC<TripCostDetailModalProps> = ({
|
||||
<View style={styles.container}>
|
||||
{/* Header */}
|
||||
<View style={styles.header}>
|
||||
<Text style={styles.title}>Chi tiết chi phí chuyến đi</Text>
|
||||
<Text style={styles.title}>{t("trip.costDetailModal.title")}</Text>
|
||||
<View style={styles.headerButtons}>
|
||||
{isEditing ? (
|
||||
<>
|
||||
@@ -102,13 +104,17 @@ const TripCostDetailModal: React.FC<TripCostDetailModalProps> = ({
|
||||
onPress={handleCancel}
|
||||
style={styles.cancelButton}
|
||||
>
|
||||
<Text style={styles.cancelButtonText}>Hủy</Text>
|
||||
<Text style={styles.cancelButtonText}>
|
||||
{t("trip.costDetailModal.cancel")}
|
||||
</Text>
|
||||
</TouchableOpacity>
|
||||
<TouchableOpacity
|
||||
onPress={handleSave}
|
||||
style={styles.saveButton}
|
||||
>
|
||||
<Text style={styles.saveButtonText}>Lưu</Text>
|
||||
<Text style={styles.saveButtonText}>
|
||||
{t("trip.costDetailModal.save")}
|
||||
</Text>
|
||||
</TouchableOpacity>
|
||||
</>
|
||||
) : (
|
||||
@@ -140,13 +146,15 @@ const TripCostDetailModal: React.FC<TripCostDetailModalProps> = ({
|
||||
<View key={index} style={styles.itemCard}>
|
||||
{/* Loại */}
|
||||
<View style={styles.fieldGroup}>
|
||||
<Text style={styles.label}>Loại chi phí</Text>
|
||||
<Text style={styles.label}>
|
||||
{t("trip.costDetailModal.costType")}
|
||||
</Text>
|
||||
<TextInput
|
||||
style={[styles.input, !isEditing && styles.inputDisabled]}
|
||||
value={item.type}
|
||||
onChangeText={(value) => updateItem(index, "type", value)}
|
||||
editable={isEditing}
|
||||
placeholder="Nhập loại chi phí"
|
||||
placeholder={t("trip.costDetailModal.enterCostType")}
|
||||
/>
|
||||
</View>
|
||||
|
||||
@@ -155,7 +163,9 @@ const TripCostDetailModal: React.FC<TripCostDetailModalProps> = ({
|
||||
<View
|
||||
style={[styles.fieldGroup, { flex: 1, marginRight: 8 }]}
|
||||
>
|
||||
<Text style={styles.label}>Số lượng</Text>
|
||||
<Text style={styles.label}>
|
||||
{t("trip.costDetailModal.quantity")}
|
||||
</Text>
|
||||
<TextInput
|
||||
style={[styles.input, !isEditing && styles.inputDisabled]}
|
||||
value={String(item.amount ?? "")}
|
||||
@@ -168,20 +178,24 @@ const TripCostDetailModal: React.FC<TripCostDetailModalProps> = ({
|
||||
/>
|
||||
</View>
|
||||
<View style={[styles.fieldGroup, { flex: 1, marginLeft: 8 }]}>
|
||||
<Text style={styles.label}>Đơn vị</Text>
|
||||
<Text style={styles.label}>
|
||||
{t("trip.costDetailModal.unit")}
|
||||
</Text>
|
||||
<TextInput
|
||||
style={[styles.input, !isEditing && styles.inputDisabled]}
|
||||
value={item.unit}
|
||||
onChangeText={(value) => updateItem(index, "unit", value)}
|
||||
editable={isEditing}
|
||||
placeholder="kg, lít..."
|
||||
placeholder={t("trip.costDetailModal.placeholder")}
|
||||
/>
|
||||
</View>
|
||||
</View>
|
||||
|
||||
{/* Chi phí/đơn vị */}
|
||||
<View style={styles.fieldGroup}>
|
||||
<Text style={styles.label}>Chi phí/đơn vị (VNĐ)</Text>
|
||||
<Text style={styles.label}>
|
||||
{t("trip.costDetailModal.costPerUnit")}
|
||||
</Text>
|
||||
<TextInput
|
||||
style={[styles.input, !isEditing && styles.inputDisabled]}
|
||||
value={String(item.cost_per_unit ?? "")}
|
||||
@@ -196,10 +210,13 @@ const TripCostDetailModal: React.FC<TripCostDetailModalProps> = ({
|
||||
|
||||
{/* Tổng chi phí */}
|
||||
<View style={styles.fieldGroup}>
|
||||
<Text style={styles.label}>Tổng chi phí</Text>
|
||||
<Text style={styles.label}>
|
||||
{t("trip.costDetailModal.totalCost")}
|
||||
</Text>
|
||||
<View style={styles.totalContainer}>
|
||||
<Text style={styles.totalText}>
|
||||
{item.total_cost.toLocaleString()} VNĐ
|
||||
{item.total_cost.toLocaleString()}{" "}
|
||||
{t("trip.costDetailModal.vnd")}
|
||||
</Text>
|
||||
</View>
|
||||
</View>
|
||||
@@ -208,9 +225,11 @@ const TripCostDetailModal: React.FC<TripCostDetailModalProps> = ({
|
||||
|
||||
{/* Footer Total */}
|
||||
<View style={styles.footerTotal}>
|
||||
<Text style={styles.footerLabel}>Tổng cộng</Text>
|
||||
<Text style={styles.footerLabel}>
|
||||
{t("trip.costDetailModal.total")}
|
||||
</Text>
|
||||
<Text style={styles.footerAmount}>
|
||||
{tongCong.toLocaleString()} VNĐ
|
||||
{tongCong.toLocaleString()} {t("trip.costDetailModal.vnd")}
|
||||
</Text>
|
||||
</View>
|
||||
</ScrollView>
|
||||
|
||||
Reference in New Issue
Block a user