update table

This commit is contained in:
2025-10-31 17:38:48 +07:00
parent 5307f44a34
commit 2fac0b8093
5 changed files with 14 additions and 104 deletions

View File

@@ -1,13 +1,6 @@
import { IconSymbol } from "@/components/ui/icon-symbol";
import React, { useRef, useState } from "react";
import {
Animated,
Platform,
Text,
TouchableOpacity,
UIManager,
View,
} from "react-native";
import { Animated, Text, TouchableOpacity, View } from "react-native";
import styles from "./style/NetListTable.styles";
// ---------------------------
@@ -29,14 +22,6 @@ const data: NetItem[] = [
];
const NetListTable: React.FC = () => {
// Bật animation cho Android
if (
Platform.OS === "android" &&
UIManager.setLayoutAnimationEnabledExperimental
) {
UIManager.setLayoutAnimationEnabledExperimental(true);
}
const [collapsed, setCollapsed] = useState(true);
const [contentHeight, setContentHeight] = useState<number>(0);
const animatedHeight = useRef(new Animated.Value(0)).current;
@@ -81,35 +66,21 @@ const NetListTable: React.FC = () => {
>
{/* Header */}
<View style={[styles.row, styles.tableHeader]}>
<Text style={[styles.cell, styles.left, styles.headerText]}>STT</Text>
<Text style={[styles.sttCell, styles.headerText]}>STT</Text>
<Text style={[styles.cell, styles.headerText]}>Trạng thái</Text>
<Text style={[styles.cell, styles.right, styles.headerText]}>
Thao tác
</Text>
</View>
{/* Body */}
{data.map((item) => (
<View key={item.id} style={styles.row}>
{/* Cột STT */}
<Text style={[styles.cell, styles.left]}>{item.stt}</Text>
<Text style={styles.sttCell}>{item.stt}</Text>
{/* Cột Trạng thái */}
<View style={[styles.cell, styles.statusContainer]}>
<View style={styles.statusDot} />
<Text style={styles.statusText}>{item.trangThai}</Text>
</View>
{/* Cột Thao tác */}
<View style={[styles.cell, styles.actions]}>
<IconSymbol name="eye" size={16} color="#333" />
<IconSymbol
name="square.and.pencil"
size={16}
color="#333"
style={{ marginLeft: 10 }}
/>
</View>
</View>
))}
</View>
@@ -118,35 +89,21 @@ const NetListTable: React.FC = () => {
<Animated.View style={{ height: animatedHeight, overflow: "hidden" }}>
{/* Header */}
<View style={[styles.row, styles.tableHeader]}>
<Text style={[styles.cell, styles.left, styles.headerText]}>STT</Text>
<Text style={[styles.sttCell, styles.headerText]}>STT</Text>
<Text style={[styles.cell, styles.headerText]}>Trạng thái</Text>
<Text style={[styles.cell, styles.right, styles.headerText]}>
Thao tác
</Text>
</View>
{/* Body */}
{data.map((item) => (
<View key={item.id} style={styles.row}>
{/* Cột STT */}
<Text style={[styles.cell, styles.left]}>{item.stt}</Text>
<Text style={styles.sttCell}>{item.stt}</Text>
{/* Cột Trạng thái */}
<View style={[styles.cell, styles.statusContainer]}>
<View style={styles.statusDot} />
<Text style={styles.statusText}>{item.trangThai}</Text>
</View>
{/* Cột Thao tác */}
<View style={[styles.cell, styles.actions]}>
<IconSymbol name="eye" size={16} color="#333" />
<IconSymbol
name="square.and.pencil"
size={16}
color="#333"
style={{ marginLeft: 10 }}
/>
</View>
</View>
))}
</Animated.View>