work on area rug functions.
This commit is contained in:
parent
f6a151337a
commit
49266bbc97
53
components/AreaRugTag.tsx
Normal file
53
components/AreaRugTag.tsx
Normal file
@ -0,0 +1,53 @@
|
||||
import { area_t } from "@/lib/dimensions";
|
||||
import convert, { Area, Length } from "convert";
|
||||
import dayjs, { Dayjs } from "dayjs";
|
||||
import { StyleSheet, Text, View } from "react-native";
|
||||
|
||||
export type AreaRugTagProps = {
|
||||
dimensions: area_t,
|
||||
price_per_area: {
|
||||
price: number,
|
||||
per: {
|
||||
n: number,
|
||||
u: Area,
|
||||
}
|
||||
},
|
||||
date?: Dayjs
|
||||
currencySymbol?: string
|
||||
};
|
||||
|
||||
export const AreaRugTag = (props: AreaRugTagProps) => {
|
||||
const date = props.date || dayjs();
|
||||
const square = props.dimensions.l * props.dimensions.w;
|
||||
const areaUnits = `square ${props.dimensions.u}`;
|
||||
const square2 = convert(square, areaUnits as Area).to(props.price_per_area.per.u)
|
||||
const price = (square2 / props.price_per_area.per.n) * props.price_per_area.price;
|
||||
const sPrice = price.toLocaleString(undefined, {
|
||||
minimumFractionDigits: 2,
|
||||
maximumFractionDigits: 2,
|
||||
})
|
||||
const currencySymbol = props.currencySymbol || "$";
|
||||
return (
|
||||
<View style={styles.component}>
|
||||
<Text aria-label="area rug dimensions" style={styles.dimensions}>{props.dimensions.l} x {props.dimensions.w}</Text>
|
||||
<Text aria-label="area rug price" style={styles.price}>{currencySymbol} {sPrice}</Text>
|
||||
<Text aria-label="area rug date" style={styles.date}>{date.format("YYYY/MM/DD")}</Text>
|
||||
<Text aria-label="this week's color" style={styles.tagColor}>[Curent Tag Color]</Text>
|
||||
</View>
|
||||
)
|
||||
};
|
||||
|
||||
const styles = StyleSheet.create({
|
||||
component: {
|
||||
paddingVertical: 100,
|
||||
flex: 1,
|
||||
},
|
||||
dimensions: {
|
||||
},
|
||||
price: {
|
||||
},
|
||||
date: {
|
||||
},
|
||||
tagColor: {
|
||||
},
|
||||
})
|
@ -24,6 +24,7 @@
|
||||
"@reduxjs/toolkit": "^2.2.6",
|
||||
"class-transformer": "^0.5.1",
|
||||
"convert": "^5.3.0",
|
||||
"dayjs": "^1.11.11",
|
||||
"expo": "~51.0.18",
|
||||
"expo-asset": "^10.0.10",
|
||||
"expo-constants": "~16.0.2",
|
||||
|
@ -38,6 +38,9 @@ dependencies:
|
||||
convert:
|
||||
specifier: ^5.3.0
|
||||
version: 5.3.0
|
||||
dayjs:
|
||||
specifier: ^1.11.11
|
||||
version: 1.11.11
|
||||
expo:
|
||||
specifier: ~51.0.18
|
||||
version: 51.0.18(@babel/core@7.24.7)(@babel/preset-env@7.24.7)
|
||||
|
Loading…
Reference in New Issue
Block a user