reza fixed compo colors before Video

master
Reza_ashrafi 2 years ago
parent 03cb34fc08
commit 8d7e687d73
  1. 12
      src/screens/ShoppingCart/components/Code.js
  2. 27
      src/screens/ShoppingCart/components/Product.js
  3. 65
      src/screens/ShoppingCart/index.js

@ -4,9 +4,7 @@ import {
Text,
Pressable,
TextInput,
Dimensions,
KeyboardAvoidingView,
Appearance,
} from "react-native";
import { connect } from "react-redux";
import { userFactor } from "../../../redux/actions";
@ -16,8 +14,7 @@ import fontSize from "../../../constants/fontSize";
import Colors from "../../../constants/Colors";
import tw from "tailwind-rn";
function Code({ codeId, setCodeId, userId, factorId }) {
const colorScheme = Appearance.getColorScheme();
function Code({ codeId, setCodeId, userId, factorId, theme }) {
const [value, setValue] = React.useState(codeId || "");
const setOff = () => {
@ -32,7 +29,7 @@ function Code({ codeId, setCodeId, userId, factorId }) {
<View
style={[
tw("flex w-full flex-row-reverse rounded-sm mt-3"),
{ borderWidth: 1.5, borderColor: Colors.theme1[colorScheme].greenCF },
{ borderWidth: 1.5, borderColor: Colors.theme1[theme].greenCF },
]}
>
<TextInput
@ -42,14 +39,14 @@ function Code({ codeId, setCodeId, userId, factorId }) {
{ fontSize: fontSize.tiny, fontFamily: "regular" },
]}
placeholder={"کد تخفیف دارید ؟"}
placeholderTextColor={Colors.theme1[colorScheme].gray20 + 'aa'}
placeholderTextColor={Colors.theme1[theme].gray20 + 'aa'}
/>
<Pressable
onPress={() => setOff()}
style={[
tw("py-3 px-5"),
{
backgroundColor: Colors.theme1[colorScheme].greenCF,
backgroundColor: Colors.theme1[theme].greenCF,
borderTopLeftRadius: 1,
borderBottomLeftRadius: 1,
},
@ -73,6 +70,7 @@ const mapStateToProps = (state) => ({
codeId: state.userFactor.info?.codeId,
userId: state.user.status?.id,
factorId: state.userFactor.info?.id,
theme: state.publicApi.theme
});
const mapDispatchToProps = {

@ -5,7 +5,6 @@ import {
Image,
Dimensions,
Pressable,
Appearance,
ActivityIndicator,
Platform,
} from "react-native";
@ -22,8 +21,7 @@ import tw from "tailwind-rn";
const width = Dimensions.get("window").width;
const ios = Platform.OS === "ios";
function Product({ product, grades, pushToCart, loading, mobile }) {
const colorScheme = Appearance.getColorScheme();
function Product({ product, grades, pushToCart, loading, mobile, theme }) {
return (
<View
style={[
@ -32,7 +30,7 @@ function Product({ product, grades, pushToCart, loading, mobile }) {
),
{
borderBottomWidth: 1,
borderColor: Colors.theme1[colorScheme].grayE3,
borderColor: Colors.theme1[theme].grayE3,
direction: "rtl",
},
]}
@ -56,7 +54,7 @@ function Product({ product, grades, pushToCart, loading, mobile }) {
<Text
style={{
fontSize: mobile ? fontSize.lg : fontSize.xl4,
color: Colors.theme1[colorScheme].green79,
color: Colors.theme1[theme].green79,
marginBottom: 5,
fontFamily: "bold",
}}
@ -66,7 +64,7 @@ function Product({ product, grades, pushToCart, loading, mobile }) {
<Text
style={{
fontSize: mobile ? fontSize.sm : fontSize.lg,
color: Colors.theme1[colorScheme].gray2077,
color: Colors.theme1[theme].gray2077,
marginBottom: 3,
fontFamily: "regular",
}}
@ -76,7 +74,7 @@ function Product({ product, grades, pushToCart, loading, mobile }) {
<Text
style={{
fontSize: mobile ? fontSize.sm : fontSize.lg,
color: Colors.theme1[colorScheme].gray2077,
color: Colors.theme1[theme].gray2077,
fontFamily: "regular",
}}
>
@ -118,7 +116,7 @@ function Product({ product, grades, pushToCart, loading, mobile }) {
<AntDesign
name="close"
size={mobile ? 20 : 30}
color={Colors.theme1[colorScheme].redFF1}
color={Colors.theme1[theme].redFF1}
onPress={() =>
pushToCart(
{
@ -152,14 +150,14 @@ function Product({ product, grades, pushToCart, loading, mobile }) {
}`
),
{
borderColor: Colors.theme1[colorScheme].greenCF,
borderColor: Colors.theme1[theme].greenCF,
},
]}
>
<Text
style={{
fontSize: mobile ? fontSize.xl : fontSize.xl4,
color: Colors.theme1[colorScheme].greenCF,
color: Colors.theme1[theme].greenCF,
fontFamily: "light",
}}
>
@ -170,7 +168,7 @@ function Product({ product, grades, pushToCart, loading, mobile }) {
<ActivityIndicator
style={tw("mx-2")}
size="small"
color={Colors.theme1[colorScheme].greenBA}
color={Colors.theme1[theme].greenBA}
/>
) : (
<Text
@ -178,7 +176,7 @@ function Product({ product, grades, pushToCart, loading, mobile }) {
tw("mx-2.5"),
{
fontSize: fontSize.xl6,
color: Colors.theme1[colorScheme].greenBA,
color: Colors.theme1[theme].greenBA,
fontFamily: "bold",
},
]}
@ -202,14 +200,14 @@ function Product({ product, grades, pushToCart, loading, mobile }) {
}`
),
{
borderColor: Colors.theme1[colorScheme].greenCF,
borderColor: Colors.theme1[theme].greenCF,
},
]}
>
<Text
style={{
fontSize: mobile ? fontSize.xl : fontSize.xl4,
color: Colors.theme1[colorScheme].greenCF,
color: Colors.theme1[theme].greenCF,
fontFamily: "bold",
}}
>
@ -247,6 +245,7 @@ function Product({ product, grades, pushToCart, loading, mobile }) {
const mapStateToProps = (state) => ({
grades: state.publicApi.grades,
mobile: state.publicApi.mobile,
theme: state.publicApi.theme
});
const mapDispatchToProps = {

@ -17,7 +17,6 @@ import { Ionicons } from "@expo/vector-icons";
import { useNavigation } from "@react-navigation/native";
import { asyncAwesomeAlert } from "../../utils/AsyncWrappers";
import separate from "../../utils/separate";
import * as Linking from "expo-linking";
//components
import Product from "./components/Product";
@ -32,10 +31,9 @@ import fontSize from "../../constants/fontSize";
import Colors from "../../constants/Colors";
import tw from "tailwind-rn";
const { width, height } = Dimensions.get("window");
const { height } = Dimensions.get("window");
const PriceStatus = ({ name, value, type }) => {
const colorScheme = Appearance.getColorScheme();
const PriceStatus = ({ name, value, type, theme }) => {
return (
<View style={tw("w-full flex flex-row-reverse justify-between py-2")}>
<Text
@ -43,7 +41,7 @@ const PriceStatus = ({ name, value, type }) => {
tw(""),
{
fontSize: fontSize.tiny,
color: Colors.theme1[colorScheme].gray20,
color: Colors.theme1[theme].gray20,
fontFamily: "bold",
},
]}
@ -56,8 +54,8 @@ const PriceStatus = ({ name, value, type }) => {
{
color:
type === "error"
? Colors.theme1[colorScheme].redFF1
: Colors.theme1[colorScheme].green79,
? Colors.theme1[theme].redFF1
: Colors.theme1[theme].green79,
fontSize: fontSize.xl,
fontFamily: "bold",
},
@ -70,8 +68,8 @@ const PriceStatus = ({ name, value, type }) => {
{
color:
type === "error"
? Colors.theme1[colorScheme].redFF1
: Colors.theme1[colorScheme].green79,
? Colors.theme1[theme].redFF1
: Colors.theme1[theme].green79,
fontSize: fontSize.sm,
fontFamily: "regular",
marginRight: 4,
@ -93,15 +91,22 @@ function ShoppingCart({
getFactorInfo,
loading,
payFactor,
theme
}) {
const navigation = useNavigation();
const colorScheme = Appearance.getColorScheme();
const [position, setPosition] = useState("100%");
const isEmpty = list.filter((product) => product.condition < 2).length === 0;
const hasPhysical =
list.filter((product) => product.condition < 2 && product.productType === 2)
.length !== 0;
const isEmpty = React.useMemo(() => {
return list.filter((product) => product.condition < 2).length === 0;
}, [list]);
const hasPhysical = React.useMemo(() => {
return (
list.filter(
(product) => product.condition < 2 && product.productType === 2
).length !== 0
);
}, [list]);
useEffect(() => {
if (list.length === 0) {
@ -157,20 +162,29 @@ function ShoppingCart({
>
<PriceStatus
name="مبلغ سبد خرید"
value={isEmpty ? 0 : separate(Math.round(factorInfo?.sumPrice || 0))}
value={
isEmpty ? 0 : separate(Math.round(factorInfo?.sumPrice || 0))
}
type="normal"
theme={theme}
/>
<PriceStatus
name="میزان تخفیف"
value={isEmpty ? 0 : separate(Math.round(factorInfo?.offPrice || 0))}
value={
isEmpty ? 0 : separate(Math.round(factorInfo?.offPrice || 0))
}
type="error"
theme={theme}
/>
<PriceStatus
name="مالیات بر ارزش افزوده"
value={
isEmpty ? 0 : separate(Math.round((factorInfo?.sumPrice || 0) * 0.009))
isEmpty
? 0
: separate(Math.round((factorInfo?.sumPrice || 0) * 0.009))
}
type="error"
theme={theme}
/>
</View>
<View
@ -181,7 +195,7 @@ function ShoppingCart({
<Text
style={[
{
color: Colors.theme1[colorScheme].green79,
color: Colors.theme1[theme].green79,
fontSize: fontSize.base,
fontFamily: "bold",
},
@ -193,18 +207,18 @@ function ShoppingCart({
<Text
style={[
{
color: Colors.theme1[colorScheme].green79,
color: Colors.theme1[theme].green79,
fontSize: fontSize.xl,
fontFamily: "bold",
},
]}
>
{isEmpty ? 0 : separate(factorInfo?.payPrice || '')}
{isEmpty ? 0 : separate(factorInfo?.payPrice || "")}
</Text>
<Text
style={[
{
color: Colors.theme1[colorScheme].green79,
color: Colors.theme1[theme].green79,
fontSize: fontSize.sm,
fontFamily: "regular",
marginRight: 4,
@ -221,14 +235,14 @@ function ShoppingCart({
tw(
"w-full rounded-md flex flex-row justify-center items-center py-3 px-3 my-5"
),
{ backgroundColor: Colors.theme1[colorScheme].greenC8 + "1a" },
{ backgroundColor: Colors.theme1[theme].greenC8 + "1a" },
]}
>
<Text
style={[
tw("mr-1"),
{
color: Colors.theme1[colorScheme].green79,
color: Colors.theme1[theme].green79,
fontSize: fontSize.sm,
fontFamily: "regular",
},
@ -239,13 +253,13 @@ function ShoppingCart({
<Ionicons
name="alert-circle-outline"
size={20}
color={Colors.theme1[colorScheme].greenC8}
color={Colors.theme1[theme].greenC8}
/>
</Pressable>
<CustomPressable
title={hasPhysical ? "ادامه فرایند خرید" : "پرداخت"}
backgroundColor={Colors.theme1[colorScheme].greenCF}
backgroundColor={Colors.theme1[theme].greenCF}
color={"white"}
border={{ color: "#196EC0", width: 0 }}
width={"100%"}
@ -279,6 +293,7 @@ const mapStateToProps = (state) => ({
userId: state.user.status?.id,
hasPhysical: state.userProduct.hasPhysical,
loading: state.userProduct.loading,
theme: state.publicApi.theme
});
const mapDispatchToProps = {

Loading…
Cancel
Save