reza completed rating without api

master
Reza_ashrafi 2 years ago
parent bc979ff1f6
commit dd9eb2270e
  1. 1
      package.json
  2. 56
      src/screens/Product/components/Book.js
  3. 53
      src/screens/Product/components/Rates.js
  4. 7
      yarn.lock

@ -42,6 +42,7 @@
"react-native-awesome-alerts": "^1.5.2",
"react-native-openanything": "^0.0.6",
"react-native-qrcode-scanner": "^1.5.4",
"react-native-ratings": "^8.1.0",
"react-native-raw-bottom-sheet": "^2.2.0",
"react-native-restart": "^0.0.22",
"react-native-safe-area-context": "3.3.2",

@ -18,7 +18,6 @@ import { Entypo } from "@expo/vector-icons";
import separate from "../../../utils/separate";
//components
import CustomPressable from "../../../components/Pressable";
import Description from "./Description";
import LinkBox from "./LinkBox";
import Comments from "./Comments";
@ -27,6 +26,7 @@ import ProductReview from "../../../components/BottomSheetComponents/ProductRevi
import ProductQuestion from "../../../components/BottomSheetComponents/ProductQuestion";
import Blur from "../../../components/Blur";
import ImageSlider from "../../../components/ImageSlider";
import Rates from "./Rates";
//style
import tw from "tailwind-rn";
@ -67,13 +67,12 @@ function Book({
(product) => product?.productId === book?.product[0]?.id
)[0];
console.log(book);
return (
<ScrollView
style={[tw("flex flex-1 relative")]}
>
<ScrollView style={[tw("flex flex-1 relative")]}>
{!mobile && <View style={tw("mt-5")}></View>}
{(!book || userFavoriteLoading ) && (
{(!book || userFavoriteLoading) && (
<View
style={[
tw("absolute left-0 top-0 rounded-md overflow-hidden"),
@ -609,28 +608,31 @@ function Book({
component={<ProductQuestion />}
height={height / 2}
/>
{product.rates && (
<View
style={tw("flex flex-row-reverse justify-between items-center my-6")}
>
<Text
style={[
{
fontSize: fontSize.sm,
color: "#275077",
fontFamily: "regular",
},
tw(""),
]}
{(product.rate || 4) && (
<>
<View
style={tw(
"flex flex-row-reverse justify-between items-center my-6"
)}
>
امتیازات و نظرات
</Text>
<Entypo name="chevron-small-left" size={20} color="#196EC0" />
</View>
<Text
style={[
{
fontSize: fontSize.sm,
color: "#275077",
fontFamily: "regular",
},
tw(""),
]}
>
امتیازات و نظرات
</Text>
<Entypo name="chevron-small-left" size={20} color="#196EC0" />
</View>
<Rates rate={book?.rate || 4} />
<Comments comments={book?.comments} />
</>
)}
{/* <Rates rates={book.rates} /> */}
<Comments comments={book?.comments} />
</ScrollView>
);
}
@ -639,7 +641,7 @@ const mapStateToProps = (state) => ({
userProducts: state.userProduct.list,
userId: state.user.status?.id,
userProductsLoading: state.userProduct.loading,
userFavoriteLoading : state.userFavorite.loading,
userFavoriteLoading: state.userFavorite.loading,
mobile: state.publicApi.mobile,
});

@ -1,38 +1,55 @@
import React from "react";
import { View, Text, Dimensions } from "react-native";
import { View, Text, Dimensions, Appearance } from "react-native";
import { Rating } from 'react-native-ratings';
//assets
import tw from "tailwind-rn";
import fontSize from "../../../constants/fontSize";
import Colors from "../../../constants/Colors";
const width = Dimensions.get("window").width;
export default function Rates({ rates }) {
export default function Rates({ rate }) {
const ratingCompleted = (rating) => {
return;
}
return (
<View style={tw("flex flex-row-reverse")}>
<View
style={[
tw("flex items-center justify-center"),
{ width: "25%" },
]}
>
<View style={[tw("flex items-center justify-center"), { width: "25%" }]}>
<Text
style={[
{ fontSize: fontSize.xl6, color: "#05335F", fontFamily: "bold" },
]}
>
{rates.mid}
{rate}
</Text>
<Rating
type='star'
ratingCount={5}
imageSize={15}
onFinishRating={(rating) => ratingCompleted(rating)}
/>
<Text
style={{
fontSize: fontSize.sm,
color: "#707070",
fontFamily: "light",
marginTop : 5
}}
>
{"از" + " " + rates.allRates + " " + "نفر"}
{`از بین ${1150} نفر`}
</Text>
</View>
<View style={[tw("flex flex-1"), { width: "60%" }]}>
{rates.fields.map((field, index) => (
{[
{ name: "بخش ۱", value: 40 },
{ name: "بخش ۱", value: 20 },
{ name: "بخش ۱", value: 70 },
{ name: "بخش ۱", value: 10 },
{ name: "بخش ۱", value: 50 },
].map((field, index) => (
<Progress key={index} data={field} />
))}
</View>
@ -40,9 +57,13 @@ export default function Rates({ rates }) {
);
}
const Progress = ({ data }) => {
const Progress = ({ data, ...props }) => {
const colorScheme = React.useMemo(() => {
return Appearance.getColorScheme();
},[props.useless]);
return (
<View style={[tw("flex flex-1 flex-row items-center py-0.5")]}>
<View style={[tw("flex flex-1 flex-row items-center py-1.5")]}>
<Text
style={{
fontSize: fontSize.sm,
@ -55,13 +76,13 @@ const Progress = ({ data }) => {
<View
style={[
tw("rounded-md ml-2 flex-1"),
{ height: 6, backgroundColor: "#D3E9FF" },
{ height: 6, backgroundColor: Colors.theme1[colorScheme].greenFF1 },
]}
>
<View
style={[
tw("h-full rounded-md my-auto"),
{ width: data.value + "%", backgroundColor: "#2B8DEB" },
tw("h-full rounded-md"),
{ width: data.value + "%", backgroundColor: Colors.theme1[colorScheme].greenCF },
]}
></View>
</View>

@ -5332,6 +5332,13 @@ react-native-qrcode-scanner@^1.5.4:
prop-types "^15.5.10"
react-native-permissions "^2.0.2"
react-native-ratings@^8.1.0:
version "8.1.0"
resolved "https://registry.yarnpkg.com/react-native-ratings/-/react-native-ratings-8.1.0.tgz#3fa9ad29128dc3a88e59518ba151e61c59dd0647"
integrity sha512-+QOJ4G3NjVkI1D+tk4EGx1dCvVfbD2nQdkrj9cXrcAoEiwmbep4z4bZbCKmWMpQ5h2dqbxABU8/eBnbDmvAc3g==
dependencies:
lodash "^4.17.15"
react-native-raw-bottom-sheet@^2.2.0:
version "2.2.0"
resolved "https://registry.yarnpkg.com/react-native-raw-bottom-sheet/-/react-native-raw-bottom-sheet-2.2.0.tgz#d11dabb86aadb014273767ef7b554924b13633c5"

Loading…
Cancel
Save