wishpal_ironfan
/
tiefen_space_app
5
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

修改筛选功能

This commit is contained in:
al 2024-08-30 13:55:31 +08:00
parent a2518f7f4d
commit 219f51ca30
4 changed files with 132 additions and 85 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

92
components/MySlider/index.jsx
View File

@ -1,20 +1,12 @@
import {
View,
Text,
TouchableOpacity,
Modal,
PanResponder,
Dimensions,
} from "react-native";
import { View, Text, PanResponder, Dimensions } from "react-native";
import React, { useState, useEffect, useRef } from "react";
import { useTailwind } from "tailwind-rn";
import { Image } from "expo-image";
export default function MySlider({
lower_bound,
upper_bound,
step,
unit,
lable,
unitSite = "right",
height = 60,
width = Dimensions.get("window").width - 44,
onChange,
@ -296,10 +288,20 @@ export default function MySlider({
right: 24,
}}
>
{unitSite == "left" && (
<Text
style={{
...tailwind("text-white text-lg"),
maxWidth: thumbSize * 2,
color: "#ff75c8",
}}
>
{unit}
</Text>
)}
<Text
style={{
...tailwind("text-white text-lg"),
maxWidth: thumbSize * 2,
color: "#ff75c8",
}}
>
@ -317,46 +319,54 @@ export default function MySlider({
<Text
style={{
...tailwind("text-white text-lg"),
// maxWidth: thumbSize * 2,
color: "#ff75c8",
}}
>
{hasInfinity && rightProcess == 1 ? ">" + upper_bound : rightValue}
{hasInfinity && rightProcess >= 1 ? ">" + upper_bound : rightValue}
</Text>
{unitSite == "right" && (
<Text
style={{
...tailwind("text-white text-lg"),
maxWidth: thumbSize * 2,
color: "#ff75c8",
}}
>
{unit}
</Text>
)}
</View>
<View
style={{
...tailwind(
"absolute text-white text-sm flex flex-row justify-between"
),
width: width - 22,
left: 0,
top: 20,
color: "#ffffff80",
}}
>
<Text
style={{
...tailwind(" text-white text-sm"),
minWidth: thumbSize,
maxWidth: thumbSize * 2,
color: "#ffffff80",
}}
>
{lower_bound}
</Text>
<Text
style={{
...tailwind("text-white text-lg"),
maxWidth: thumbSize * 2,
color: "#ff75c8",
...tailwind(" text-white text-sm"),
minWidth: thumbSize,
color: "#ffffff80",
}}
>
{unit}
{hasInfinity ? ">" + upper_bound : upper_bound}
</Text>
</View>
<Text
style={{
...tailwind("absolute text-white text-sm"),
left: 0,
top: 20,
minWidth: thumbSize,
maxWidth: thumbSize * 2,
color: "#ffffff80",
}}
>
{lower_bound}
</Text>
<Text
style={{
...tailwind("absolute text-white text-sm"),
left: processWidth,
top: 20,
minWidth: thumbSize,
maxWidth: thumbSize * 2,
color: "#ffffff80",
}}
>
{hasInfinity ? ">" + upper_bound : upper_bound}
</Text>
</View>
);
}

9
components/Picker/index.jsx
View File

@ -3,7 +3,12 @@ import RNPickerSelect from "react-native-picker-select";
import { useTailwind } from "tailwind-rn";
import { Icon } from "@rneui/themed";
export default function Picker({ value, items, onChange }) {
export default function Picker({
value,
items,
onChange,
placeholder = { label: "未填写", value: "" },
}) {
const tailwind = useTailwind();
return (
<RNPickerSelect
@ -31,7 +36,7 @@ export default function Picker({ value, items, onChange }) {
doneText="完成"
useNativeAndroidPickerStyle={false}
fixAndroidTouchableBug={true}
placeholder={{ label: "未填写", value: "" }}
placeholder={placeholder}
value={value}
onValueChange={onChange}
items={items}

81
screeens/Search/index.jsx
View File

@ -78,7 +78,7 @@ export default function Search({ navigation, route }) {
default: 160,
step: 1,
type: "slider",
unit: "CM",
unit: "cm",
key: "height",
stepValues: Array(201)
.fill(null)
@ -91,7 +91,7 @@ export default function Search({ navigation, route }) {
default: 50,
step: 1,
type: "slider",
unit: "KG",
unit: "kg",
key: "weight",
stepValues: Array(101)
.fill(null)
@ -101,7 +101,7 @@ export default function Search({ navigation, route }) {
name: "所在地",
upper_bound: 1000,
lower_bound: 10,
default: 24,
default: 0,
step: 1,
type: "select",
items: [
@ -146,7 +146,7 @@ export default function Search({ navigation, route }) {
name: "星座",
upper_bound: 1000,
lower_bound: 10,
default: 24,
default: 0,
step: 1,
type: "select",
key: "constellation",
@ -189,10 +189,10 @@ export default function Search({ navigation, route }) {
},
{
name: "微信价格",
upper_bound: 200,
upper_bound: 10000,
lower_bound: 0,
default: 24,
step: 200 / 8,
step: 10000 / 8,
type: "slider",
unit: "金币",
key: "wechat",
@ -294,12 +294,19 @@ export default function Search({ navigation, route }) {
ignore = true;
};
}, [search]);
const getFiltersResult = async () => {
const getFiltersResult = async (obj) => {
const apiUrl = process.env.EXPO_PUBLIC_API_URL;
const newObj = obj || filtersValue;
let api;
let querryParams;
api = "/api/streamer/filter";
let currentFilterValue = { ...filtersValue };
let currentFilterValue = {
...newObj,
zone_admission_price: {
lower_bound: newObj.zone_admission_price.lower_bound * 100,
upper_bound: newObj.zone_admission_price.upper_bound * 100,
},
};
delete currentFilterValue.comprehensiveUsed;
delete currentFilterValue.priceUsed;
querryParams = currentFilterValue;
@ -308,8 +315,8 @@ export default function Search({ navigation, route }) {
const signature = await generateSignature({
...base,
...querryParams,
offset: 0,
limit: 20,
// offset: 0,
// limit: 20,
});
const response = await fetch(`${apiUrl}${api}?signature=${signature}`, {
method: "POST",
@ -319,8 +326,8 @@ export default function Search({ navigation, route }) {
body: JSON.stringify({
...base,
...querryParams,
offset: 0,
limit: 20,
// offset: 0,
// limit: 20,
}),
});
const data = await response.json();
@ -393,18 +400,23 @@ export default function Search({ navigation, route }) {
priceUsed: { show: false, used: false },
};
}
setFiltersValue((old) => ({
...old,
...obj,
}));
if (!obj.comprehensiveUsed.used && !obj.priceUsed.used) {
setRecommList([]);
setStreamers([]);
setZones([]);
}
setFiltersValue((old) => {
const newObj = {
...old,
...obj,
};
if (!obj.comprehensiveUsed.used && !obj.priceUsed.used) {
setRecommList([]);
setStreamers([]);
setZones([]);
} else {
getFiltersResult(newObj);
}
return newObj;
});
};
//空间组件
const ZoneItem = ({ item }) => {
const ZoneItem = ({ item, onlyOne }) => {
return (
<ListItem
onPress={() =>
@ -449,11 +461,11 @@ export default function Search({ navigation, route }) {
numberOfLines={1}
ellipsizeMode="tail"
>
{item.zones[0].profile}
{item.zones[0]?.profile}
</Text>
</View>
</View>
{zones.length === 1 && (
{onlyOne && (
<View
style={tailwind("flex flex-col bg-[#FFFFFF1A] rounded-xl mb-2")}
>
@ -847,6 +859,7 @@ export default function Search({ navigation, route }) {
minimumTrackTintColor="#ff75c8"
processHeight={5}
unit={item.unit}
unitSite={item.key == "zone" ? "left" : "right"}
thumbImage={require("../../assets/icon/32DP/edit.png")}
/>
</View>
@ -874,6 +887,7 @@ export default function Search({ navigation, route }) {
label: it,
value: it,
}))}
placeholder={{ label: "不限", value: "" }}
value={
item.key == "constellation"
? filtersValue.constellation
@ -1021,7 +1035,8 @@ export default function Search({ navigation, route }) {
borderRadius: 12,
// flex: 1,
// position: "relative",
height: screenDimensions.height - 120,
height:
screenDimensions.height - (Platform.OS != "ios" ? 84 : 120),
}}
>
{priceFilters.map((item, index) => (
@ -1084,13 +1099,14 @@ export default function Search({ navigation, route }) {
minimumTrackTintColor="#ff75c8"
processHeight={5}
unit={item.unit}
unitSite={item.key == "zone" ? "left" : "right"}
thumbImage={require("../../assets/icon/32DP/edit.png")}
/>
</View>
))}
<View
style={{
...tailwind("flex-row justify-around mb-4 p-4"),
...tailwind("flex-row justify-around items-center mb-4 p-4"),
position: "absolute",
bottom: 0,
width: "100%",
@ -1165,7 +1181,7 @@ export default function Search({ navigation, route }) {
}}
style={{
...tailwind("text-white px-4 py-2 rounded-xl"),
// marginVertical: 6,
marginVertical: 6,
backgroundColor: "#ff75c8",
minWidth: 120,
flex: 1,
@ -1192,7 +1208,7 @@ export default function Search({ navigation, route }) {
</Text>
)}
{zones?.map((item, index) => (
<ZoneItem key={index} item={item} />
<ZoneItem key={index} item={item} onlyOne={zones.length == 1} />
))}
{zones.length > 0 && <MyDivider style={tailwind("my-2")} />}
{streamers.length > 0 && (
@ -1209,9 +1225,12 @@ export default function Search({ navigation, route }) {
猜你喜欢
</Text>
)}
{recommList?.map((item, index) => (
<StreamerItem key={index} item={item} />
))}
{recommList
.filter((it) => it.zones.length > 0)
?.map((item, index) => (
<ZoneItem key={index} item={item} onlyOne={false} />
))}
{streamers.length === 0 && recommList.length === 0 && (
<Empty type={search ? "search" : "nodata"} />
)}

35
screeens/SpaceSetting/SpaceSearch/index.jsx
View File

@ -29,6 +29,15 @@ export default function SpaceSearch({ navigation }) {
setIsloading(false);
return;
}
if (/[^0-9]/.test(searchValue)) {
setIsloading(false);
Toast.show({
type: "error",
text1: "请输入六位用户ID",
topOffset: 60,
});
return;
}
const apiUrl = process.env.EXPO_PUBLIC_API_URL;
try {
const base = await baseRequest();
@ -60,6 +69,7 @@ export default function SpaceSearch({ navigation }) {
});
return;
}
console.log("******", _data.data.list);
setData(_data.data.list);
setIsloading(false);
} catch (error) {
@ -112,13 +122,14 @@ export default function SpaceSearch({ navigation }) {
{item?.account?.name}
</Text>
<View style={tailwind("flex flex-row ml-2")}>
{item?.is_ironfan != 1 && (
{item?.is_ironfan == 1 && (
<View
style={{
...tailwind(
"flex flex-row items-center mr-2 bg-[#FF669E] rounded-full px-2"
"flex flex-row items-center mr-2 rounded-full px-2"
),
borderRadius: "50px",
borderRadius: 50,
backgroundColor: "#301024",
}}
numberOfLines={1}
ellipsizeMode="tail"
@ -126,21 +137,22 @@ export default function SpaceSearch({ navigation }) {
<Text
style={{
...tailwind("text-xs text-white"),
borderRadius: "50px",
borderRadius: 50,
color: "#FF669E",
}}
>
空间铁粉
铁粉
</Text>
</View>
)}
{item?.is_superfan != 1 && (
{item?.is_superfan == 1 && (
<View
style={{
...tailwind(
"flex flex-row items-center mr-2 rounded-full px-2"
),
backgroundColor: "#FFD685",
borderRadius: "50px",
backgroundColor: "#331F0B",
borderRadius: 50,
}}
numberOfLines={1}
ellipsizeMode="tail"
@ -148,10 +160,11 @@ export default function SpaceSearch({ navigation }) {
<Text
style={{
...tailwind("text-xs"),
borderRadius: "50px",
color: "#FFD685",
borderRadius: 50,
}}
>
超级粉丝
超丝
</Text>
</View>
)}
@ -221,7 +234,7 @@ export default function SpaceSearch({ navigation }) {
inputContainerStyle={tailwind("h-10 bg-[#FFFFFF1A]")}
inputStyle={tailwind("text-white")}
inputMode="numeric"
placeholder="搜索Ta的昵称或id"
placeholder="请输入六位用户ID"
platform="ios"
cancelButtonProps={tailwind("text-[#FF669E]")}
cancelButtonTitle="清空"