From b8e7a67ee89b734df907d83df9ccf67e5c1665f1 Mon Sep 17 00:00:00 2001 From: al Date: Fri, 16 Aug 2024 23:55:29 +0800 Subject: [PATCH 01/15] =?UTF-8?q?=E6=96=B0=E5=A2=9Emyslider?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- components/MySlider/index.jsx | 195 ++++++++++++++++++++++++++++++++++ screeens/Search/index.jsx | 13 +++ 2 files changed, 208 insertions(+) create mode 100644 components/MySlider/index.jsx diff --git a/components/MySlider/index.jsx b/components/MySlider/index.jsx new file mode 100644 index 0000000..654fa86 --- /dev/null +++ b/components/MySlider/index.jsx @@ -0,0 +1,195 @@ +import { + View, + Text, + TouchableOpacity, + Modal, + 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({ + min, + max, + step, + height = 60, + width = Dimensions.get("window").width, + onChange = () => {}, + onAfterChange = () => {}, + defaultValue = 0, + disabled = false, + thumbSize = 30, + leftValue = 20, + rightValue = 80, + thumbImage = null, + maximumTrackTintColor = "#dcdbdb", + minimumTrackTintColor = "#577BFF", + processHeight = 7, +}) { + const leftProcess = useRef(0); + const rightProcess = useRef(0); + const [processWidth, setProcessWidth] = useState(330); + const tailwind = useTailwind(); + const leftWatcher = useRef(null); + const rightWatcher = useRef(null); + useEffect(() => { + leftWatcher.current = PanResponder.create({ + // 建立监视器 + onStartShouldSetPanResponder: () => true, + onPanResponderGrant: _onPanResponderGrantLeft, // 按下 + onPanResponderMove: _onPanResponderMoveLeft, // 移动 + onPanResponderEnd: _onPanResponderEndLeft, // 结束 + }); + rightWatcher.current = PanResponder.create({ + // 建立监视器 + onStartShouldSetPanResponder: () => true, + onPanResponderGrant: _onPanResponderGrantRight, // 按下 + onPanResponderMove: _onPanResponderMoveRight, // 移动 + onPanResponderEnd: _onPanResponderEndRight, // 结束 + }); + const currentLeftProcess = leftValue / (max - min); + const currentRightProcess = rightValue / (max - min); + leftProcess.current = currentLeftProcess; + rightProcess.current = currentRightProcess; + // setRightProcess(rightProcess); + setProcessWidth(width - thumbSize); + console.log("rightProcess", rightProcess.current); + }, []); + + // 左侧滑块事件 + const _onPanResponderGrantLeft = (e, gestureState) => { + const process = (gestureState.x0 - thumbSize / 2) / processWidth; + _changeProcess(process, "left"); + }; + + const _onPanResponderEndLeft = (e, gestureState) => { + if (onAfterChange) { + onAfterChange(gestureState.x0); + } + }; + const _onPanResponderMoveLeft = (e, gestureState) => { + const process = + (gestureState.x0 - thumbSize / 2 + gestureState.dx) / processWidth; + _changeProcess(process, "left"); + }; + + // 右侧滑块事件 + const _onPanResponderGrantRight = (e, gestureState) => { + const process = (gestureState.x0 - thumbSize / 2) / processWidth; + _changeProcess(process, "right"); + }; + + const _onPanResponderEndRight = (e, gestureState) => { + if (onAfterChange) { + onAfterChange(gestureState.x0); + } + }; + const _onPanResponderMoveRight = (e, gestureState) => { + const process = + (gestureState.x0 - thumbSize / 2 + gestureState.dx) / processWidth; + _changeProcess(process, "right"); + // console.log("process", processWidth); + }; + const _changeProcess = (changeProcess, direction) => { + // 判断滑动开关 + if (disabled) return; + if (changeProcess >= 0 && changeProcess <= 1) { + onChange(changeProcess); + + // 按步长比例变化刻度 + const v = changeProcess * (max - min); + const newValue = Math.round(v / step) * step; + + const newProcess = newValue / (max - min); + if (process !== newProcess) { + if (direction == "left") { + if (newProcess < rightProcess.current) + leftProcess.current = newProcess; + } else { + if (newProcess > leftProcess.current) { + console.log("newValue", newProcess, rightProcess.current); + rightProcess.current = newProcess; + } + } + } + } + }; + return ( + + + + + + + + + ); +} diff --git a/screeens/Search/index.jsx b/screeens/Search/index.jsx index db8303f..21a6801 100644 --- a/screeens/Search/index.jsx +++ b/screeens/Search/index.jsx @@ -9,6 +9,7 @@ import Toast from "react-native-toast-message"; import baseRequest from "../../utils/baseRequest"; import { generateSignature } from "../../utils/crypto"; import MyDivider from "../../components/MyDivider/index"; +import MySlider from "../../components/MySlider"; export default function Search({ navigation, route }) { const tailwind = useTailwind(); @@ -342,6 +343,18 @@ export default function Search({ navigation, route }) { value={search} /> + {}} + maximumTrackTintColor="#dcdbdb" + minimumTrackTintColor="#577bff" + processHeight={5} + thumbImage={require("../../assets/icon/32DP/edit.png")} + /> {zones.length > 0 && ( -- 2.41.0 From b95d707f718cb58e4c5e2651684872310834ed9b Mon Sep 17 00:00:00 2001 From: al Date: Wed, 21 Aug 2024 17:54:04 +0800 Subject: [PATCH 02/15] =?UTF-8?q?=E4=BF=AE=E6=94=B9=E6=A0=B7=E5=BC=8F?= =?UTF-8?q?=E5=92=8C=E6=96=B0=E5=A2=9E=E6=96=B0=E7=9A=84=E5=86=85=E5=AE=B9?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- components/MySlider/index.jsx | 172 ++++- components/SubmitWechatModal/index.jsx | 12 +- package.json | 4 +- .../EditUserProfile/EditUserName/index.jsx | 7 +- screeens/My/index.jsx | 4 + screeens/Search/index.jsx | 678 +++++++++++++++++- .../AlreadyAddWechat/index.jsx | 36 +- .../HaveNotAddWechat/index.jsx | 36 +- utils/tools.js | 20 + yarn.lock | 26 +- 10 files changed, 888 insertions(+), 107 deletions(-) create mode 100644 utils/tools.js diff --git a/components/MySlider/index.jsx b/components/MySlider/index.jsx index 654fa86..603bb72 100644 --- a/components/MySlider/index.jsx +++ b/components/MySlider/index.jsx @@ -10,25 +10,30 @@ import React, { useState, useEffect, useRef } from "react"; import { useTailwind } from "tailwind-rn"; import { Image } from "expo-image"; export default function MySlider({ - min, - max, + lower_bound, + upper_bound, step, + unit, + lable, height = 60, - width = Dimensions.get("window").width, - onChange = () => {}, + width = Dimensions.get("window").width - 48, + onChange, onAfterChange = () => {}, defaultValue = 0, disabled = false, - thumbSize = 30, - leftValue = 20, - rightValue = 80, + thumbSize = 25, + leftValue = 0, + rightValue = 0, thumbImage = null, maximumTrackTintColor = "#dcdbdb", minimumTrackTintColor = "#577BFF", processHeight = 7, }) { - const leftProcess = useRef(0); - const rightProcess = useRef(0); + // const leftProcess = useRef(0); + // const rightProcess = useRef(0); + + const [leftProcess, setLeftProcess] = useState(0); + const [rightProcess, setRightProcess] = useState(0); const [processWidth, setProcessWidth] = useState(330); const tailwind = useTailwind(); const leftWatcher = useRef(null); @@ -48,18 +53,29 @@ export default function MySlider({ onPanResponderMove: _onPanResponderMoveRight, // 移动 onPanResponderEnd: _onPanResponderEndRight, // 结束 }); - const currentLeftProcess = leftValue / (max - min); - const currentRightProcess = rightValue / (max - min); - leftProcess.current = currentLeftProcess; - rightProcess.current = currentRightProcess; + const currentLeftProcess = 0; + const currentRightProcess = 1; + // leftProcess.current = currentLeftProcess; + setLeftProcess(currentLeftProcess); + // rightProcess.current = currentRightProcess; + setRightProcess(currentRightProcess); // setRightProcess(rightProcess); - setProcessWidth(width - thumbSize); - console.log("rightProcess", rightProcess.current); + setProcessWidth(width - thumbSize * 2); + console.log("rightProcess", currentRightProcess); }, []); - + useEffect(() => { + onChange({ + lower_bound: Math.floor( + leftProcess * (upper_bound - lower_bound) + lower_bound + ), + upper_bound: Math.floor( + rightProcess * (upper_bound - lower_bound) + lower_bound + ), + }); + }, [leftProcess, rightProcess]); // 左侧滑块事件 const _onPanResponderGrantLeft = (e, gestureState) => { - const process = (gestureState.x0 - thumbSize / 2) / processWidth; + const process = (gestureState.x0 - 40 - thumbSize / 2) / processWidth; _changeProcess(process, "left"); }; @@ -70,13 +86,14 @@ export default function MySlider({ }; const _onPanResponderMoveLeft = (e, gestureState) => { const process = - (gestureState.x0 - thumbSize / 2 + gestureState.dx) / processWidth; + (gestureState.x0 - 40 - thumbSize / 2 + gestureState.dx) / processWidth; _changeProcess(process, "left"); + console.log("newValue_left", gestureState.x0, gestureState.dx, process); }; // 右侧滑块事件 const _onPanResponderGrantRight = (e, gestureState) => { - const process = (gestureState.x0 - thumbSize / 2) / processWidth; + const process = (gestureState.x0 - 40 - thumbSize / 2) / processWidth; _changeProcess(process, "right"); }; @@ -87,7 +104,7 @@ export default function MySlider({ }; const _onPanResponderMoveRight = (e, gestureState) => { const process = - (gestureState.x0 - thumbSize / 2 + gestureState.dx) / processWidth; + (gestureState.x0 - 40 - thumbSize / 2 + gestureState.dx) / processWidth; _changeProcess(process, "right"); // console.log("process", processWidth); }; @@ -95,21 +112,21 @@ export default function MySlider({ // 判断滑动开关 if (disabled) return; if (changeProcess >= 0 && changeProcess <= 1) { - onChange(changeProcess); - // 按步长比例变化刻度 - const v = changeProcess * (max - min); + const v = changeProcess * (upper_bound - lower_bound); const newValue = Math.round(v / step) * step; - const newProcess = newValue / (max - min); + const newProcess = newValue / (upper_bound - lower_bound); if (process !== newProcess) { if (direction == "left") { - if (newProcess < rightProcess.current) - leftProcess.current = newProcess; + if (newProcess < rightProcess) { + setLeftProcess(newProcess); + } } else { - if (newProcess > leftProcess.current) { - console.log("newValue", newProcess, rightProcess.current); - rightProcess.current = newProcess; + if (newProcess > leftProcess) { + console.log("newValue", newProcess, rightProcess); + // rightProcess.current = newProcess; + setRightProcess(newProcess); } } } @@ -125,13 +142,14 @@ export default function MySlider({ // }, // ]} style={{ - ...tailwind(), - height: "max-content", + height: "upper_bound-content", width, // flex: 1, flexDirection: "row", justifyContent: "center", alignItems: "center", + marginBottom: 36, + marginTop: 12, }} > @@ -143,20 +161,23 @@ export default function MySlider({ width: processWidth, // marginRight: thumbSize / 2, position: "absolute", - left: 0, + marginTop: -processHeight / 2, left: thumbSize / 2, zIndex: 1, + borderRadius: 50, }} /> @@ -167,11 +188,14 @@ export default function MySlider({ style={{ width: thumbSize, height: thumbSize, - backgroundColor: "#fff", borderRadius: 50, position: "absolute", - left: leftProcess.current * processWidth, + left: leftProcess * processWidth, + marginTop: -processHeight / 2, zIndex: 10, + backgroundColor: "#ff75c8", + borderColor: "#ffffff", + borderWidth: 2, }} {...leftWatcher.current?.panHandlers} /> @@ -185,11 +209,83 @@ export default function MySlider({ backgroundColor: "#fff", borderRadius: 50, position: "absolute", - left: rightProcess.current * processWidth, + left: rightProcess * processWidth, zIndex: 10, + backgroundColor: "#ff75c8", + borderColor: "#ffffff", + borderWidth: 2, }} {...rightWatcher.current?.panHandlers} - /> + > + + + {Math.floor(leftProcess * (upper_bound - lower_bound) + lower_bound)} + + + - + + + {Math.floor(rightProcess * (upper_bound - lower_bound) + lower_bound)} + + + {unit} + + + + {lower_bound} + + + {upper_bound} + ); } diff --git a/components/SubmitWechatModal/index.jsx b/components/SubmitWechatModal/index.jsx index b7855a9..1a3ee26 100644 --- a/components/SubmitWechatModal/index.jsx +++ b/components/SubmitWechatModal/index.jsx @@ -130,7 +130,17 @@ export default function SubmitWechatModal({ Alert.alert(null, "请填写您的微信"); return; } - + if ( + userWechat.match( + /wxid_|[\u4e00-\u9fa5]|[\u3002|\uff1f|\uff01|\uff0c|\u3001|\uff1b|\uff1a|\u201c|\u201d|\u2018|\u2019|\uff08|\uff09|\u300a|\u300b|\u3010|\u3011|\u007e]/g + ) + ) { + Toast.show({ + content: "请提交可被搜索的有效微信", + position: "top", + }); + return; + } //付款函数 const payCoin = async () => { const apiUrl = process.env.EXPO_PUBLIC_API_URL; diff --git a/package.json b/package.json index d2fc5c9..d1610e6 100644 --- a/package.json +++ b/package.json @@ -57,8 +57,8 @@ "formik": "^2.4.4", "jsencrypt": "^3.3.2", "mime": "^3.0.0", - "react": "18.2.0", - "react-dom": "18.2.0", + "react": "^18.2.0", + "react-dom": "^18.2.0", "react-native": "0.74.5", "react-native-draggable-grid": "^2.2.1", "react-native-gesture-handler": "~2.16.1", diff --git a/screeens/EditUserProfile/EditUserName/index.jsx b/screeens/EditUserProfile/EditUserName/index.jsx index 0855c00..8dfdfdd 100644 --- a/screeens/EditUserProfile/EditUserName/index.jsx +++ b/screeens/EditUserProfile/EditUserName/index.jsx @@ -7,6 +7,7 @@ import Toast from "react-native-toast-message"; import baseRequest from "../../../utils/baseRequest"; import { get, save } from "../../../utils/storeInfo"; import { generateSignature } from "../../../utils/crypto"; +import { utf8Length } from "../../../utils/tools"; export default function EditUserName({ navigation }) { const tailwind = useTailwind(); @@ -31,10 +32,10 @@ export default function EditUserName({ navigation }) { topOffset: 60, }); return; - } else if (name.length > 10) { + } else if (utf8Length(name) > 10) { Toast.show({ type: "error", - text1: "昵称不得超过10个字", + text1: "昵称过长", topOffset: 60, }); return; @@ -124,7 +125,7 @@ export default function EditUserName({ navigation }) { placeholder="请输入新昵称" placeholderTextColor="#FFFFFF80" underlineColorAndroid="transparent" - maxLength={8} + maxLength={20} onChangeText={(value) => setName(value)} value={name} style={tailwind( diff --git a/screeens/My/index.jsx b/screeens/My/index.jsx index 3f55137..31589b5 100644 --- a/screeens/My/index.jsx +++ b/screeens/My/index.jsx @@ -303,6 +303,10 @@ export default function My({ navigation }) { { setSearch(search); if (!search) return; @@ -95,13 +269,89 @@ export default function Search({ navigation, route }) { console.error(error); } }; + let ignore = false; getResult(); return () => { ignore = true; }; }, [search]); - + const getFiltersResult = async () => { + const apiUrl = process.env.EXPO_PUBLIC_API_URL; + let api; + let querryParams; + api = "/api/streamer/filter"; + let currentFilterValue = { ...filtersValue }; + delete currentFilterValue.comprehensiveUsed; + delete currentFilterValue.priceUsed; + querryParams = currentFilterValue; + try { + const base = await baseRequest(); + const signature = await generateSignature({ + ...base, + ...querryParams, + offset: 0, + limit: 20, + }); + console.log( + JSON.stringify({ + ...base, + ...querryParams, + offset: 0, + limit: 20, + }) + ); + const response = await fetch(`${apiUrl}${api}?signature=${signature}`, { + method: "POST", + headers: { + "Content-Type": "application/json", + }, + body: JSON.stringify({ + ...base, + ...querryParams, + offset: 0, + limit: 20, + }), + }); + const data = await response.json(); + if (data.ret === -1) { + Toast.show({ + type: "error", + text1: data.msg, + topOffset: 60, + }); + return; + } + console.log("xxxx", data.data.streamer_list); + const zonesData = data.data.streamer_list.filter( + (item) => item.zones.length > 0 + ); + setStreamers(data.data.streamer_list); + setZones(zonesData); + setRecommList(data.data.recomm_list); + setIsloading(false); + } catch (error) { + console.error(error); + } + }; + //重置筛选值 + const handleResetFiltersValue = (type) => { + setFiltersValue({ + age: { lower_bound: 18, upper_bound: 60 }, + fans: { lower_bound: 1, upper_bound: 200 }, + weight: { lower_bound: 140, upper_bound: 200 }, + height: { lower_bound: 35, upper_bound: 100 }, + city: "", + constellation: "", + is_active_within_a_week: 0, + priceUsed: + type == "zone_admission_price" ? false : filtersValue.priceUsed, + comprehensiveUsed: + type == "comprehensive" ? false : filtersValue.priceUsed, + }); + setRecommList([]); + setStreamers([]); + }; //空间组件 const ZoneItem = ({ item }) => { return ( @@ -343,39 +593,391 @@ export default function Search({ navigation, route }) { value={search} /> - {}} - maximumTrackTintColor="#dcdbdb" - minimumTrackTintColor="#577bff" - processHeight={5} - thumbImage={require("../../assets/icon/32DP/edit.png")} - /> - - {zones.length > 0 && ( - - 空间 - - )} - {zones?.map((item, index) => ( - - ))} - {zones.length > 0 && } - {streamers.length > 0 && ( - - 用户 - - )} - {streamers?.map((item, index) => ( - - ))} - {zones.length === 0 && streamers.length === 0 && ( - - )} + + + { + setIsFilterVisible({ + ...isFilterVisible, + comprehensive: !isFilterVisible.comprehensive, + }); + }} + style={{ + ...tailwind("px-2 rounded-xl flex-row items-center"), + borderColor: "#ff75c8", + borderWidth: filtersValue.comprehensiveUsed ? 1 : 0, + boxSizing: "border-box", + width: 110, + }} + > + + 综合筛选 + + {filtersValue.comprehensiveUsed && ( + handleResetFiltersValue("comprehensive")} + style={{ width: 24 }} + > + + + )} + + { + setIsFilterVisible({ + ...isFilterVisible, + zone_admission_price: !isFilterVisible.zone_admission_price, + }); + }} + style={{ + ...tailwind("px-2 rounded-xl flex-row items-center"), + borderColor: "#ff75c8", + borderWidth: filtersValue.priceUsed ? 1 : 0, + boxSizing: "border-box", + width: 110, + }} + > + + 价格筛选 + + {filtersValue.priceUsed && ( + handleResetFiltersValue("zone_admission_price")} + style={{ width: 24 }} + > + + + )} + + + + + + {filters.map((item, index) => ( + + + {item.name} + + {item.type == "slider" ? ( + { + if (item.key == "age") { + setFiltersValue({ ...filtersValue, age: value }); + } else if (item.key == "fans") { + setFiltersValue({ ...filtersValue, fans: value }); + } else if (item.key == "height") { + setFiltersValue({ ...filtersValue, height: value }); + } else if (item.key == "weight") { + setFiltersValue({ ...filtersValue, weight: value }); + } + }} + maximumTrackTintColor="#ff75c81a" + minimumTrackTintColor="#ff75c8" + processHeight={5} + unit={item.unit} + thumbImage={require("../../assets/icon/32DP/edit.png")} + /> + ) : item.type == "checkbox" ? ( + + setFiltersValue((old) => ({ + ...old, + is_active_within_a_week: old.is_active_within_a_week + ? 0 + : 1, + })) + } + iconType="material-community" + checkedIcon="checkbox-marked" + uncheckedIcon="checkbox-blank-outline" + checkedColor="#FF669E" + containerStyle={tailwind("p-0 m-0 bg-transparent")} + size={24} + /> + ) : ( + ({ + label: it, + value: it, + }))} + value={ + item.key == "constellation" + ? filtersValue.constellation + : filtersValue.city + } + onChange={(value) => + setFiltersValue((old) => { + let newValue = { ...old }; + if (item.key == "constellation") { + newValue.constellation = value; + } else { + newValue.city = value; + } + return newValue; + }) + } + /> + )} + + ))} + + handleResetFiltersValue("comprehensive")} + > + + 重置 + + + { + setFiltersValue((old) => ({ + ...old, + comprehensiveUsed: true, + })); + setIsFilterVisible({ + zone_admission_price: false, + comprehensive: false, + }); + getFiltersResult(); + console.log("00000000"); + }} + style={{ + ...tailwind("text-white px-4 py-2 rounded-xl"), + marginVertical: 6, + backgroundColor: "#ff75c8", + width: 120, + }} + > + + 确定 + + + + + + + + {priceFilters.map((item) => ( + + + {item.name} + + { + if (item.key == "zone") { + setFiltersValue({ + ...filtersValue, + zone_admission_price: value, + }); + } else if (item.key == "wechat") { + setFiltersValue({ + ...filtersValue, + wechat_coin_price: value, + }); + } + }} + maximumTrackTintColor="#ff75c81a" + minimumTrackTintColor="#ff75c8" + processHeight={5} + unit={item.unit} + thumbImage={require("../../assets/icon/32DP/edit.png")} + /> + + ))} + + + handleResetFiltersValue("zone_admission_price") + } + > + + 重置 + + + { + setFiltersValue((old) => ({ + ...old, + priceUsed: true, + })); + setIsFilterVisible({ + zone_admission_price: false, + comprehensive: false, + }); + getFiltersResult(); + // console.log("00000000"); + }} + style={{ + ...tailwind("text-white px-4 py-2 rounded-xl"), + marginVertical: 6, + backgroundColor: "#ff75c8", + width: 120, + }} + > + + 确定 + + + + + + + + {zones.length > 0 && ( + + 空间 + + )} + {zones?.map((item, index) => ( + + ))} + {zones.length > 0 && } + {streamers.length > 0 && ( + + 用户 + + )} + {streamers?.map((item, index) => ( + + ))} + {streamers.length > 0 && } + {recommList.length > 0 && ( + + 猜你喜欢 + + )} + {recommList?.map((item, index) => ( + + ))} + {streamers.length === 0 && recommList.length === 0 && ( + + )} + ); diff --git a/screeens/WechatWaitingToAdd/AlreadyAddWechat/index.jsx b/screeens/WechatWaitingToAdd/AlreadyAddWechat/index.jsx index dd51a01..f41f1a1 100644 --- a/screeens/WechatWaitingToAdd/AlreadyAddWechat/index.jsx +++ b/screeens/WechatWaitingToAdd/AlreadyAddWechat/index.jsx @@ -229,13 +229,37 @@ export default function AlreadyAddWechat({}) { cachePolicy="disk" /> - - {item?.account?.name} - + + {item?.account?.name} + + + + ID {item?.account?.user_id} + + + - - {item?.account?.name} - + + {item?.account?.name} + + + + ID {item?.account?.user_id} + + + Date: Fri, 23 Aug 2024 14:06:27 +0800 Subject: [PATCH 03/15] =?UTF-8?q?=E6=96=B0=E5=A2=9E=E7=AD=9B=E9=80=89?= =?UTF-8?q?=E5=8A=9F=E8=83=BD?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- components/MySlider/index.jsx | 73 ++++--- screeens/Search/index.jsx | 387 +++++++++++++++++++++++----------- tailwind.css | 36 +--- tailwind.json | 43 +--- 4 files changed, 319 insertions(+), 220 deletions(-) diff --git a/components/MySlider/index.jsx b/components/MySlider/index.jsx index 603bb72..bfb5554 100644 --- a/components/MySlider/index.jsx +++ b/components/MySlider/index.jsx @@ -22,6 +22,9 @@ export default function MySlider({ defaultValue = 0, disabled = false, thumbSize = 25, + stepValues = [], + itemKey, + hasInfinity, leftValue = 0, rightValue = 0, thumbImage = null, @@ -34,6 +37,7 @@ export default function MySlider({ const [leftProcess, setLeftProcess] = useState(0); const [rightProcess, setRightProcess] = useState(0); + const [stepNum, setStepNum] = useState(stepValues.length - 1); const [processWidth, setProcessWidth] = useState(330); const tailwind = useTailwind(); const leftWatcher = useRef(null); @@ -53,26 +57,20 @@ export default function MySlider({ onPanResponderMove: _onPanResponderMoveRight, // 移动 onPanResponderEnd: _onPanResponderEndRight, // 结束 }); - const currentLeftProcess = 0; - const currentRightProcess = 1; - // leftProcess.current = currentLeftProcess; - setLeftProcess(currentLeftProcess); - // rightProcess.current = currentRightProcess; - setRightProcess(currentRightProcess); - // setRightProcess(rightProcess); setProcessWidth(width - thumbSize * 2); - console.log("rightProcess", currentRightProcess); }, []); useEffect(() => { - onChange({ - lower_bound: Math.floor( - leftProcess * (upper_bound - lower_bound) + lower_bound - ), - upper_bound: Math.floor( - rightProcess * (upper_bound - lower_bound) + lower_bound - ), - }); - }, [leftProcess, rightProcess]); + // if(itemKey) + const currentLeftProcess = 0; + const currentRightProcess = + (stepValues.indexOf(rightValue) * step - lower_bound) / + (upper_bound - lower_bound); + setLeftProcess(currentLeftProcess); + setRightProcess(currentRightProcess); + }, [leftValue, rightValue]); + // useEffect(() => { + + // }, [leftProcess, rightProcess]); // 左侧滑块事件 const _onPanResponderGrantLeft = (e, gestureState) => { const process = (gestureState.x0 - 40 - thumbSize / 2) / processWidth; @@ -88,7 +86,6 @@ export default function MySlider({ const process = (gestureState.x0 - 40 - thumbSize / 2 + gestureState.dx) / processWidth; _changeProcess(process, "left"); - console.log("newValue_left", gestureState.x0, gestureState.dx, process); }; // 右侧滑块事件 @@ -106,7 +103,6 @@ export default function MySlider({ const process = (gestureState.x0 - 40 - thumbSize / 2 + gestureState.dx) / processWidth; _changeProcess(process, "right"); - // console.log("process", processWidth); }; const _changeProcess = (changeProcess, direction) => { // 判断滑动开关 @@ -115,18 +111,36 @@ export default function MySlider({ // 按步长比例变化刻度 const v = changeProcess * (upper_bound - lower_bound); const newValue = Math.round(v / step) * step; - - const newProcess = newValue / (upper_bound - lower_bound); + const newProcess = Math.round(newValue) / (upper_bound - lower_bound); + setStepNum(stepNum + 1); if (process !== newProcess) { if (direction == "left") { if (newProcess < rightProcess) { setLeftProcess(newProcess); + setStepNum((old) => old + 1); + onChange({ + lower_bound: Math.round( + leftProcess * (upper_bound - lower_bound) + lower_bound + ), + upper_bound: rightValue, + }); } } else { if (newProcess > leftProcess) { - console.log("newValue", newProcess, rightProcess); // rightProcess.current = newProcess; setRightProcess(newProcess); + setStepNum((old) => old - 1); + onChange({ + lower_bound: leftValue, + upper_bound: + stepValues[ + Math.round( + (newProcess * (upper_bound - lower_bound) + lower_bound) / + step + ) + ], + }); + // setStepNum(stepNum - 1); } } } @@ -232,7 +246,7 @@ export default function MySlider({ color: "#ff75c8", }} > - {Math.floor(leftProcess * (upper_bound - lower_bound) + lower_bound)} + {Math.round(leftProcess * (upper_bound - lower_bound) + lower_bound)} - {Math.floor(rightProcess * (upper_bound - lower_bound) + lower_bound)} + {hasInfinity && rightProcess == 1 + ? ">" + upper_bound + : stepValues[ + Math.round( + (rightProcess * (upper_bound - lower_bound) + lower_bound) / + step + ) + ]} - {upper_bound} + {hasInfinity ? ">" + upper_bound : upper_bound} ); diff --git a/screeens/Search/index.jsx b/screeens/Search/index.jsx index 6cb2782..93eab1e 100644 --- a/screeens/Search/index.jsx +++ b/screeens/Search/index.jsx @@ -4,6 +4,7 @@ import { Image as NativeImage, ScrollView, TouchableOpacity, + Dimensions, } from "react-native"; import React, { useState, useEffect, useRef } from "react"; import { useTailwind } from "tailwind-rn"; @@ -26,13 +27,15 @@ import { generateSignature } from "../../utils/crypto"; import MyDivider from "../../components/MyDivider/index"; import MySlider from "../../components/MySlider"; import Picker from "../../components/Picker"; +import { get } from "../../utils/storeInfo"; export default function Search({ navigation, route }) { const tailwind = useTailwind(); const insets = useSafeAreaInsets(); const searchRef = useRef(null); - + const screenDimensions = Dimensions.get("screen"); const [search, setSearch] = useState(""); + const [isMember, setIsMember] = useState(0); const [streamers, setStreamers] = useState([]); const [recommList, setRecommList] = useState([]); const [zones, setZones] = useState([]); @@ -46,21 +49,25 @@ export default function Search({ navigation, route }) { name: "年龄", upper_bound: 60, lower_bound: 18, - default: 24, + default: 19, step: 1, type: "slider", unit: "岁", key: "age", + stepValues: Array(61) + .fill(null) + .map((_, index) => index), }, { name: "全网粉丝", upper_bound: 200, lower_bound: 1, default: 24, - step: 1, + step: 200 / 10, type: "slider", unit: "万", key: "fans", + stepValues: [1, 3, 5, 10, 20, 50, 75, 100, 150, 200, 1000], }, { name: "身高", @@ -71,6 +78,9 @@ export default function Search({ navigation, route }) { type: "slider", unit: "CM", key: "height", + stepValues: Array(201) + .fill(null) + .map((_, index) => index), }, { name: "体重", @@ -81,6 +91,9 @@ export default function Search({ navigation, route }) { type: "slider", unit: "KG", key: "weight", + stepValues: Array(101) + .fill(null) + .map((_, index) => index), }, { name: "所在地", @@ -166,34 +179,36 @@ export default function Search({ navigation, route }) { upper_bound: 200, lower_bound: 0, default: 24, - step: 1, + step: 200 / 7, type: "slider", unit: "¥", key: "zone", + stepValues: [0, 1, 10, 50, 100, 150, 200, 4000], }, { name: "微信价格", - upper_bound: 10000, + upper_bound: 200, lower_bound: 0, default: 24, - step: 1, + step: 200 / 8, type: "slider", unit: "金币", key: "wechat", + stepValues: [0, 10, 100, 200, 500, 1000, 5000, 10000, 100000], }, ]; const [filtersValue, setFiltersValue] = useState({ age: { lower_bound: 18, upper_bound: 60 }, - fans: { lower_bound: 1, upper_bound: 200 }, + fans: { lower_bound: 1, upper_bound: 1000 }, height: { lower_bound: 140, upper_bound: 200 }, weight: { lower_bound: 35, upper_bound: 100 }, city: "", constellation: "", is_active_within_a_week: 0, - zone_admission_price: { lower_bound: 0, upper_bound: 9999 }, - wechat_coin_price: { lower_bound: 0, upper_bound: 9999 }, - priceUsed: false, - comprehensiveUsed: false, + zone_admission_price: { lower_bound: 0, upper_bound: 4000 }, + wechat_coin_price: { lower_bound: 0, upper_bound: 100000 }, + priceUsed: { show: false, used: false }, + comprehensiveUsed: { show: false, used: false }, }); const updateSearch = (search) => { setSearch(search); @@ -204,6 +219,7 @@ export default function Search({ navigation, route }) { //进入页面默认focus useEffect(() => { searchRef.current.focus(); + getIsMember(); }, []); //搜索框文本变化时进行搜索 @@ -293,14 +309,6 @@ export default function Search({ navigation, route }) { offset: 0, limit: 20, }); - console.log( - JSON.stringify({ - ...base, - ...querryParams, - offset: 0, - limit: 20, - }) - ); const response = await fetch(`${apiUrl}${api}?signature=${signature}`, { method: "POST", headers: { @@ -322,7 +330,6 @@ export default function Search({ navigation, route }) { }); return; } - console.log("xxxx", data.data.streamer_list); const zonesData = data.data.streamer_list.filter( (item) => item.zones.length > 0 ); @@ -334,23 +341,65 @@ export default function Search({ navigation, route }) { console.error(error); } }; + const getIsMember = async () => { + const apiUrl = process.env.EXPO_PUBLIC_API_URL; + let api; + api = "/api/account/list_by_mid"; + const account = await get("account"); + try { + const base = await baseRequest(); + const signature = await generateSignature({ + ...base, + mid: account.mid, + }); + const response = await fetch(`${apiUrl}${api}?signature=${signature}`, { + method: "POST", + headers: { + "Content-Type": "application/json", + }, + body: JSON.stringify({ + ...base, + mid: account.mid, + }), + }); + const data = await response.json(); + setIsMember(data.data.account.is_a_member); + } catch (error) { + console.error(error); + } + }; //重置筛选值 const handleResetFiltersValue = (type) => { - setFiltersValue({ - age: { lower_bound: 18, upper_bound: 60 }, - fans: { lower_bound: 1, upper_bound: 200 }, - weight: { lower_bound: 140, upper_bound: 200 }, - height: { lower_bound: 35, upper_bound: 100 }, - city: "", - constellation: "", - is_active_within_a_week: 0, - priceUsed: - type == "zone_admission_price" ? false : filtersValue.priceUsed, - comprehensiveUsed: - type == "comprehensive" ? false : filtersValue.priceUsed, - }); - setRecommList([]); - setStreamers([]); + let obj = {}; + if (type == "comprehensive") { + obj = { + ...filtersValue, + age: { lower_bound: 18, upper_bound: 60 }, + fans: { lower_bound: 1, upper_bound: 1000 }, + weight: { lower_bound: 35, upper_bound: 100 }, + height: { lower_bound: 140, upper_bound: 200 }, + city: "", + constellation: "", + is_active_within_a_week: 0, + comprehensiveUsed: { show: false, used: false }, + }; + } else { + obj = { + ...filtersValue, + zone_admission_price: { lower_bound: 0, upper_bound: 4000 }, + wechat_coin_price: { lower_bound: 0, upper_bound: 100000 }, + priceUsed: { show: false, used: false }, + }; + } + setFiltersValue((old) => ({ + ...old, + ...obj, + })); + if (!obj.comprehensiveUsed.used && !obj.priceUsed.used) { + setRecommList([]); + setStreamers([]); + setZones([]); + } }; //空间组件 const ZoneItem = ({ item }) => { @@ -591,10 +640,13 @@ export default function Search({ navigation, route }) { showLoading={isloading} onChangeText={updateSearch} value={search} + disabled={ + filtersValue.comprehensiveUsed.used || filtersValue.priceUsed.used + } /> - + { setIsFilterVisible({ @@ -605,7 +657,7 @@ export default function Search({ navigation, route }) { style={{ ...tailwind("px-2 rounded-xl flex-row items-center"), borderColor: "#ff75c8", - borderWidth: filtersValue.comprehensiveUsed ? 1 : 0, + borderWidth: filtersValue.comprehensiveUsed.used ? 1 : 0, boxSizing: "border-box", width: 110, }} @@ -614,12 +666,14 @@ export default function Search({ navigation, route }) { style={{ ...tailwind("text-white text-lg font-medium"), marginVertical: 6, - color: filtersValue.comprehensiveUsed ? "#ff75c8" : "#ffffff80", + color: filtersValue.comprehensiveUsed.used + ? "#ff75c8" + : "#ffffff80", }} > 综合筛选 - {filtersValue.comprehensiveUsed && ( + {filtersValue.comprehensiveUsed.used && ( handleResetFiltersValue("comprehensive")} style={{ width: 24 }} @@ -644,7 +698,7 @@ export default function Search({ navigation, route }) { style={{ ...tailwind("px-2 rounded-xl flex-row items-center"), borderColor: "#ff75c8", - borderWidth: filtersValue.priceUsed ? 1 : 0, + borderWidth: filtersValue.priceUsed.used ? 1 : 0, boxSizing: "border-box", width: 110, }} @@ -653,12 +707,12 @@ export default function Search({ navigation, route }) { style={{ ...tailwind("text-white text-lg font-medium"), marginVertical: 6, - color: filtersValue.priceUsed ? "#ff75c8" : "#ffffff80", + color: filtersValue.priceUsed.used ? "#ff75c8" : "#ffffff80", }} > 价格筛选 - {filtersValue.priceUsed && ( + {filtersValue.priceUsed.used && ( handleResetFiltersValue("zone_admission_price")} style={{ width: 24 }} @@ -674,19 +728,37 @@ export default function Search({ navigation, route }) { )} - + - + }, + onScroll: (event) => { + const { y } = event.nativeEvent.contentOffset; + if (y < -50) { + setIsFilterVisible({ + zone_admission_price: false, + comprehensive: false, + }); + } + }, + }} + isVisible={isFilterVisible.comprehensive} + style={{ + paddingTop: 110, + }} + > + {filters.map((item, index) => ( { if (item.key == "age") { - setFiltersValue({ ...filtersValue, age: value }); + setFiltersValue((old) => ({ ...old, age: value })); } else if (item.key == "fans") { - setFiltersValue({ ...filtersValue, fans: value }); + setFiltersValue((old) => ({ ...old, fans: value })); } else if (item.key == "height") { - setFiltersValue({ ...filtersValue, height: value }); + setFiltersValue((old) => ({ ...old, height: value })); } else if (item.key == "weight") { - setFiltersValue({ ...filtersValue, weight: value }); + setFiltersValue((old) => ({ ...old, weight: value })); } }} maximumTrackTintColor="#ff75c81a" @@ -777,44 +868,56 @@ export default function Search({ navigation, route }) { )} ))} - - handleResetFiltersValue("comprehensive")} - > - + {isMember == 1 && ( + handleResetFiltersValue("comprehensive")} > - 重置 - - + + 重置 + + + )} { - setFiltersValue((old) => ({ - ...old, - comprehensiveUsed: true, - })); setIsFilterVisible({ zone_admission_price: false, comprehensive: false, }); + if (!isMember) { + navigation.navigate("WebWithoutHeader", { + uri: process.env.EXPO_PUBLIC_WEB_URL + "/vip", + }); + return; + } + setFiltersValue((old) => ({ + ...old, + comprehensiveUsed: { show: false, used: true }, + })); + getFiltersResult(); - console.log("00000000"); }} style={{ ...tailwind("text-white px-4 py-2 rounded-xl"), marginVertical: 6, backgroundColor: "#ff75c8", - width: 120, + minWidth: 120, }} > - 确定 + {!isMember ? "开通VIP后即可筛选" : "确定"} { + const { y } = event.nativeEvent.contentOffset; + if (y < -50) { + setIsFilterVisible({ + zone_admission_price: false, + comprehensive: false, + }); + } + }, + }} isVisible={isFilterVisible.zone_admission_price} style={{ - paddingTop: 120, + paddingTop: 110, }} > {priceFilters.map((item) => ( @@ -867,20 +990,31 @@ export default function Search({ navigation, route }) { height={40} lower_bound={item.lower_bound} upper_bound={item.upper_bound} - leftValue={item.lower_bound} - rightValue={item.upper_bound} + leftValue={ + item.key == "zone" + ? filtersValue.zone_admission_price.lower_bound + : filtersValue.wechat_coin_price.lower_bound + } + rightValue={ + item.key == "zone" + ? filtersValue.zone_admission_price.upper_bound + : filtersValue.wechat_coin_price.upper_bound + } + stepValues={item.stepValues} step={item.step} + hasInfinity={true} + itemKey={item.key} onChange={(value) => { if (item.key == "zone") { - setFiltersValue({ - ...filtersValue, + setFiltersValue((old) => ({ + ...old, zone_admission_price: value, - }); + })); } else if (item.key == "wechat") { - setFiltersValue({ - ...filtersValue, + setFiltersValue((old) => ({ + ...old, wechat_coin_price: value, - }); + })); } }} maximumTrackTintColor="#ff75c81a" @@ -891,46 +1025,61 @@ export default function Search({ navigation, route }) { /> ))} - - - handleResetFiltersValue("zone_admission_price") - } - > - + {isMember == 1 && ( + + handleResetFiltersValue("zone_admission_price") + } > - 重置 - - + + 重置 + + + )} { - setFiltersValue((old) => ({ - ...old, - priceUsed: true, - })); setIsFilterVisible({ zone_admission_price: false, comprehensive: false, }); + if (!isMember) { + navigation.navigate("WebWithoutHeader", { + uri: process.env.EXPO_PUBLIC_WEB_URL + "/vip", + }); + return; + } + setFiltersValue((old) => ({ + ...old, + priceUsed: { show: false, used: true }, + })); + getFiltersResult(); - // console.log("00000000"); }} style={{ ...tailwind("text-white px-4 py-2 rounded-xl"), marginVertical: 6, backgroundColor: "#ff75c8", - width: 120, + minWidth: 120, }} > - 确定 + {!isMember ? "开通VIP后即可筛选" : "确定"} - + {zones.length > 0 && ( @@ -965,7 +1114,7 @@ export default function Search({ navigation, route }) { {streamers?.map((item, index) => ( ))} - {streamers.length > 0 && } + {recommList.length > 0 && } {recommList.length > 0 && ( 猜你喜欢 diff --git a/tailwind.css b/tailwind.css index d74cb09..de581d6 100644 --- a/tailwind.css +++ b/tailwind.css @@ -149,10 +149,6 @@ margin-left: 1rem } -.ml-\[3\.2rem\] { - margin-left: 3.2rem -} - .ml-auto { margin-left: auto } @@ -241,8 +237,8 @@ display: contents } -.h-1 { - height: 0.25rem +.hidden { + display: none } .h-10 { @@ -357,14 +353,6 @@ width: 66.666667% } -.w-2\/5 { - width: 40% -} - -.w-20 { - width: 5rem -} - .w-28 { width: 7rem } @@ -592,11 +580,6 @@ background-color: rgb(23 22 26 / var(--tw-bg-opacity)) } -.bg-\[\#17171A\] { - --tw-bg-opacity: 1; - background-color: rgb(23 23 26 / var(--tw-bg-opacity)) -} - .bg-\[\#1E1C29\] { --tw-bg-opacity: 1; background-color: rgb(30 28 41 / var(--tw-bg-opacity)) @@ -617,11 +600,6 @@ background-color: rgb(255 102 158 / var(--tw-bg-opacity)) } -.bg-\[\#FF7DCB\] { - --tw-bg-opacity: 1; - background-color: rgb(255 125 203 / var(--tw-bg-opacity)) -} - .bg-\[\#FFFFFF1A\] { background-color: #FFFFFF1A } @@ -712,21 +690,11 @@ padding-right: 0.25rem } -.px-1\.5 { - padding-left: 0.375rem; - padding-right: 0.375rem -} - .px-10 { padding-left: 2.5rem; padding-right: 2.5rem } -.px-12 { - padding-left: 3rem; - padding-right: 3rem -} - .px-2 { padding-left: 0.5rem; padding-right: 0.5rem diff --git a/tailwind.json b/tailwind.json index 15af680..aeec9ad 100644 --- a/tailwind.json +++ b/tailwind.json @@ -192,11 +192,6 @@ "marginLeft": 16 } }, - "ml-[3.2rem]": { - "style": { - "marginLeft": 51.2 - } - }, "ml-auto": { "style": { "marginLeft": "auto" @@ -307,9 +302,9 @@ "display": "contents" } }, - "h-1": { + "hidden": { "style": { - "height": 4 + "display": "none" } }, "h-10": { @@ -452,16 +447,6 @@ "width": "66.666667%" } }, - "w-2/5": { - "style": { - "width": "40%" - } - }, - "w-20": { - "style": { - "width": 80 - } - }, "w-28": { "style": { "width": 112 @@ -792,12 +777,6 @@ "backgroundColor": "rgb(23 22 26 / var(--tw-bg-opacity))" } }, - "bg-[#17171A]": { - "style": { - "--tw-bg-opacity": 1, - "backgroundColor": "rgb(23 23 26 / var(--tw-bg-opacity))" - } - }, "bg-[#1E1C29]": { "style": { "--tw-bg-opacity": 1, @@ -822,12 +801,6 @@ "backgroundColor": "rgb(255 102 158 / var(--tw-bg-opacity))" } }, - "bg-[#FF7DCB]": { - "style": { - "--tw-bg-opacity": 1, - "backgroundColor": "rgb(255 125 203 / var(--tw-bg-opacity))" - } - }, "bg-[#FFFFFF1A]": { "style": { "backgroundColor": "#FFFFFF1A" @@ -956,24 +929,12 @@ "paddingRight": 4 } }, - "px-1.5": { - "style": { - "paddingLeft": 6, - "paddingRight": 6 - } - }, "px-10": { "style": { "paddingLeft": 40, "paddingRight": 40 } }, - "px-12": { - "style": { - "paddingLeft": 48, - "paddingRight": 48 - } - }, "px-2": { "style": { "paddingLeft": 8, -- 2.41.0 From f0ea1ec904e5b334cb7a385f45371cdf94d7cb9c Mon Sep 17 00:00:00 2001 From: al Date: Fri, 23 Aug 2024 19:03:05 +0800 Subject: [PATCH 04/15] =?UTF-8?q?=E6=94=B9=E5=96=84=E7=AD=9B=E9=80=89?= =?UTF-8?q?=E5=8A=9F=E8=83=BD?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- components/MySlider/index.jsx | 140 +++++++++++++++++++++++++++------- screeens/My/index.jsx | 4 +- screeens/Search/index.jsx | 90 +++++++++++++++++++--- 3 files changed, 195 insertions(+), 39 deletions(-) diff --git a/components/MySlider/index.jsx b/components/MySlider/index.jsx index bfb5554..03699cd 100644 --- a/components/MySlider/index.jsx +++ b/components/MySlider/index.jsx @@ -16,7 +16,7 @@ export default function MySlider({ unit, lable, height = 60, - width = Dimensions.get("window").width - 48, + width = Dimensions.get("window").width - 44, onChange, onAfterChange = () => {}, defaultValue = 0, @@ -42,6 +42,8 @@ export default function MySlider({ const tailwind = useTailwind(); const leftWatcher = useRef(null); const rightWatcher = useRef(null); + const currentLeftValue = useRef(leftValue); + const currentRightValue = useRef(rightValue); useEffect(() => { leftWatcher.current = PanResponder.create({ // 建立监视器 @@ -61,12 +63,16 @@ export default function MySlider({ }, []); useEffect(() => { // if(itemKey) - const currentLeftProcess = 0; + const currentLeftProcess = + (stepValues.indexOf(leftValue) * step - lower_bound) / + (upper_bound - lower_bound); const currentRightProcess = (stepValues.indexOf(rightValue) * step - lower_bound) / (upper_bound - lower_bound); setLeftProcess(currentLeftProcess); setRightProcess(currentRightProcess); + currentLeftValue.current = leftValue; + currentRightValue.current = rightValue; }, [leftValue, rightValue]); // useEffect(() => { @@ -114,24 +120,35 @@ export default function MySlider({ const newProcess = Math.round(newValue) / (upper_bound - lower_bound); setStepNum(stepNum + 1); if (process !== newProcess) { + const currentRightProcess = + (stepValues.indexOf(currentRightValue.current) * step - lower_bound) / + (upper_bound - lower_bound); if (direction == "left") { - if (newProcess < rightProcess) { + if (newProcess < currentRightProcess) { setLeftProcess(newProcess); setStepNum((old) => old + 1); onChange({ - lower_bound: Math.round( - leftProcess * (upper_bound - lower_bound) + lower_bound - ), - upper_bound: rightValue, + lower_bound: + stepValues[ + Math.round( + (newProcess * (upper_bound - lower_bound) + lower_bound) / + step + ) + ], + upper_bound: currentRightValue.current, }); } } else { - if (newProcess > leftProcess) { + const currentLeftProcess = + (stepValues.indexOf(currentLeftValue.current) * step - + lower_bound) / + (upper_bound - lower_bound); + if (newProcess > currentLeftProcess) { // rightProcess.current = newProcess; setRightProcess(newProcess); setStepNum((old) => old - 1); onChange({ - lower_bound: leftValue, + lower_bound: currentLeftValue.current, upper_bound: stepValues[ Math.round( @@ -167,6 +184,38 @@ export default function MySlider({ }} > + {/* 格子步数 */} + {hasInfinity && ( + + {stepValues.map((item, index) => ( + = leftValue && item <= rightValue + ? minimumTrackTintColor + : maximumTrackTintColor, + width: thumbSize / 2, + height: thumbSize / 2, + borderRadius: 50, + }} + > + ))} + + )} + {/* 左侧控件 */} + > + + + {/* 右侧控件 */} + > + + + - {Math.round(leftProcess * (upper_bound - lower_bound) + lower_bound)} + {hasInfinity && leftProcess == 1 + ? ">" + upper_bound + : stepValues[ + Math.round( + (leftProcess * (upper_bound - lower_bound) + lower_bound) / + step + ) + ]} - + { setIsFilterVisible({ @@ -736,6 +742,12 @@ export default function Search({ navigation, route }) { > + setIsFilterVisible({ + zone_admission_price: false, + comprehensive: false, + }) + } backdropStyle={{ backgroundColor: "#0000004d" }} scrollViewProps={{ contentContainerStyle: { @@ -755,12 +767,13 @@ export default function Search({ navigation, route }) { }} isVisible={isFilterVisible.comprehensive} style={{ - paddingTop: 110, + paddingTop: Platform.OS != "ios" ? 55 : 110, }} > {filters.map((item, index) => ( ({ ...old, weight: value })); } }} - maximumTrackTintColor="#ff75c81a" + maximumTrackTintColor="#382435" minimumTrackTintColor="#ff75c8" processHeight={5} unit={item.unit} @@ -870,9 +883,34 @@ export default function Search({ navigation, route }) { ))} + {Platform.OS != "ios" && ( + + + setIsFilterVisible({ + zone_admission_price: false, + comprehensive: false, + }) + } + /> + + )} {isMember == 1 && ( + setIsFilterVisible({ + zone_admission_price: false, + comprehensive: false, + }) + } scrollViewProps={{ contentContainerStyle: { // paddingTop: 20, @@ -953,7 +998,7 @@ export default function Search({ navigation, route }) { }} isVisible={isFilterVisible.zone_admission_price} style={{ - paddingTop: 110, + paddingTop: Platform.OS != "ios" ? 55 : 110, }} > - {priceFilters.map((item) => ( + {priceFilters.map((item, index) => ( + {Platform.OS != "ios" && ( + + + setIsFilterVisible({ + zone_admission_price: false, + comprehensive: false, + }) + } + /> + + )} {isMember == 1 && ( Date: Fri, 23 Aug 2024 20:52:07 +0800 Subject: [PATCH 05/15] =?UTF-8?q?=E4=BF=AE=E5=A4=8D=E6=BB=91=E5=9D=97?= =?UTF-8?q?=E8=BE=B9=E7=95=8C=E9=97=AE=E9=A2=98?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- components/MySlider/index.jsx | 150 +++++++++++++++++----------------- screeens/Search/index.jsx | 105 +++++++++++++----------- 2 files changed, 130 insertions(+), 125 deletions(-) diff --git a/components/MySlider/index.jsx b/components/MySlider/index.jsx index 03699cd..07e5e30 100644 --- a/components/MySlider/index.jsx +++ b/components/MySlider/index.jsx @@ -48,16 +48,16 @@ export default function MySlider({ leftWatcher.current = PanResponder.create({ // 建立监视器 onStartShouldSetPanResponder: () => true, - onPanResponderGrant: _onPanResponderGrantLeft, // 按下 + // onPanResponderGrant: _onPanResponderGrantLeft, // 按下 onPanResponderMove: _onPanResponderMoveLeft, // 移动 - onPanResponderEnd: _onPanResponderEndLeft, // 结束 + // onPanResponderEnd: _onPanResponderEndLeft, // 结束 }); rightWatcher.current = PanResponder.create({ // 建立监视器 onStartShouldSetPanResponder: () => true, - onPanResponderGrant: _onPanResponderGrantRight, // 按下 + // onPanResponderGrant: _onPanResponderGrantRight, // 按下 onPanResponderMove: _onPanResponderMoveRight, // 移动 - onPanResponderEnd: _onPanResponderEndRight, // 结束 + // onPanResponderEnd: _onPanResponderEndRight, // 结束 }); setProcessWidth(width - thumbSize * 2); }, []); @@ -78,87 +78,81 @@ export default function MySlider({ // }, [leftProcess, rightProcess]); // 左侧滑块事件 - const _onPanResponderGrantLeft = (e, gestureState) => { - const process = (gestureState.x0 - 40 - thumbSize / 2) / processWidth; - _changeProcess(process, "left"); - }; + // const _onPanResponderGrantLeft = (e, gestureState) => { + // const process = (gestureState.x0 - 40 - thumbSize / 2) / processWidth; + // _changeProcess(process, "left"); + // }; - const _onPanResponderEndLeft = (e, gestureState) => { - if (onAfterChange) { - onAfterChange(gestureState.x0); - } - }; + // const _onPanResponderEndLeft = (e, gestureState) => { + // // if (onAfterChange) { + // // onAfterChange(gestureState.x0); + // // } + // }; const _onPanResponderMoveLeft = (e, gestureState) => { const process = - (gestureState.x0 - 40 - thumbSize / 2 + gestureState.dx) / processWidth; + (gestureState.x0 - 30 - thumbSize / 2 + gestureState.dx) / processWidth; _changeProcess(process, "left"); }; // 右侧滑块事件 - const _onPanResponderGrantRight = (e, gestureState) => { - const process = (gestureState.x0 - 40 - thumbSize / 2) / processWidth; - _changeProcess(process, "right"); - }; + // const _onPanResponderGrantRight = (e, gestureState) => { + // const process = (gestureState.x0 - 40 - thumbSize / 2) / processWidth; + // _changeProcess(process, "right"); + // }; - const _onPanResponderEndRight = (e, gestureState) => { - if (onAfterChange) { - onAfterChange(gestureState.x0); - } - }; const _onPanResponderMoveRight = (e, gestureState) => { const process = - (gestureState.x0 - 40 - thumbSize / 2 + gestureState.dx) / processWidth; + (gestureState.x0 + 30 - thumbSize / 2 + gestureState.dx) / processWidth; _changeProcess(process, "right"); }; const _changeProcess = (changeProcess, direction) => { // 判断滑动开关 if (disabled) return; - if (changeProcess >= 0 && changeProcess <= 1) { - // 按步长比例变化刻度 - const v = changeProcess * (upper_bound - lower_bound); - const newValue = Math.round(v / step) * step; - const newProcess = Math.round(newValue) / (upper_bound - lower_bound); - setStepNum(stepNum + 1); - if (process !== newProcess) { - const currentRightProcess = - (stepValues.indexOf(currentRightValue.current) * step - lower_bound) / + // 按步长比例变化刻度 + changeProcess = + changeProcess > 1 ? 1 : changeProcess < 0 ? 0 : changeProcess; + const v = changeProcess * (upper_bound - lower_bound); + const newValue = Math.round(v / step) * step; + const newProcess = Math.round(newValue) / (upper_bound - lower_bound); + setStepNum(stepNum + 1); + if (process !== newProcess) { + const currentRightProcess = + (stepValues.indexOf(currentRightValue.current) * step - lower_bound) / + (upper_bound - lower_bound); + if (direction == "left") { + if (newProcess < currentRightProcess) { + setLeftProcess(newProcess); + setStepNum((old) => old + 1); + onChange({ + lower_bound: + stepValues[ + Math.round( + (newProcess * (upper_bound - lower_bound) + lower_bound) / + step + ) + ], + upper_bound: currentRightValue.current, + }); + } + } else { + const currentLeftProcess = + (stepValues.indexOf(currentLeftValue.current) * step - lower_bound) / (upper_bound - lower_bound); - if (direction == "left") { - if (newProcess < currentRightProcess) { - setLeftProcess(newProcess); - setStepNum((old) => old + 1); - onChange({ - lower_bound: - stepValues[ - Math.round( - (newProcess * (upper_bound - lower_bound) + lower_bound) / - step - ) - ], - upper_bound: currentRightValue.current, - }); - } - } else { - const currentLeftProcess = - (stepValues.indexOf(currentLeftValue.current) * step - - lower_bound) / - (upper_bound - lower_bound); - if (newProcess > currentLeftProcess) { - // rightProcess.current = newProcess; - setRightProcess(newProcess); - setStepNum((old) => old - 1); - onChange({ - lower_bound: currentLeftValue.current, - upper_bound: - stepValues[ - Math.round( - (newProcess * (upper_bound - lower_bound) + lower_bound) / - step - ) - ], - }); - // setStepNum(stepNum - 1); - } + + if (newProcess > currentLeftProcess) { + setRightProcess(newProcess); + setStepNum((old) => old - 1); + onChange({ + lower_bound: currentLeftValue.current, + upper_bound: + stepValues[ + Math.round( + (newProcess * (upper_bound - lower_bound) + lower_bound) / + step + ) + ], + }); + // setStepNum(stepNum - 1); } } } @@ -180,7 +174,7 @@ export default function MySlider({ justifyContent: "center", alignItems: "center", marginBottom: 36, - marginTop: 12, + marginTop: 24, }} > @@ -293,7 +287,6 @@ export default function MySlider({ alignItems: "center", // borderWidth: 2, }} - {...rightWatcher.current?.panHandlers} > @@ -312,8 +306,8 @@ export default function MySlider({ style={{ ...tailwind("flex flex-row justify-between items-center"), position: "absolute", - top: -46, - right: 12, + top: -48, + right: 24, }} > - {hasInfinity && leftProcess == 1 + {/* {hasInfinity && leftProcess == 1 ? ">" + upper_bound : stepValues[ Math.round( (leftProcess * (upper_bound - lower_bound) + lower_bound) / step ) - ]} + ]} */} + {leftValue} - {hasInfinity && rightProcess == 1 + {/* {hasInfinity && Math.floor(rightProcess) == 1 ? ">" + upper_bound : stepValues[ Math.round( (rightProcess * (upper_bound - lower_bound) + lower_bound) / step ) - ]} + ]} */} + {rightValue} {item.name} {item.type == "slider" ? ( - { - if (item.key == "age") { - setFiltersValue((old) => ({ ...old, age: value })); - } else if (item.key == "fans") { - setFiltersValue((old) => ({ ...old, fans: value })); - } else if (item.key == "height") { - setFiltersValue((old) => ({ ...old, height: value })); - } else if (item.key == "weight") { - setFiltersValue((old) => ({ ...old, weight: value })); + + + rightValue={ + item.key == "age" + ? filtersValue.age.upper_bound + : item.key == "height" + ? filtersValue.height.upper_bound + : item.key == "weight" + ? filtersValue.weight.upper_bound + : filtersValue.fans.upper_bound + } + step={item.step} + hasInfinity={item.key == "fans"} + stepValues={item.stepValues} + onChange={(value) => { + if (item.key == "age") { + setFiltersValue((old) => ({ ...old, age: value })); + } else if (item.key == "fans") { + setFiltersValue((old) => ({ ...old, fans: value })); + } else if (item.key == "height") { + setFiltersValue((old) => ({ + ...old, + height: value, + })); + } else if (item.key == "weight") { + setFiltersValue((old) => ({ + ...old, + weight: value, + })); + } + }} + maximumTrackTintColor="#382435" + minimumTrackTintColor="#ff75c8" + processHeight={5} + unit={item.unit} + thumbImage={require("../../assets/icon/32DP/edit.png")} + /> + ) : item.type == "checkbox" ? ( Date: Fri, 23 Aug 2024 21:02:09 +0800 Subject: [PATCH 06/15] =?UTF-8?q?=E4=BF=AE=E5=A4=8D=E9=97=AE=E9=A2=98?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- components/MySlider/index.jsx | 33 ++++++++------------------------- 1 file changed, 8 insertions(+), 25 deletions(-) diff --git a/components/MySlider/index.jsx b/components/MySlider/index.jsx index 07e5e30..5474231 100644 --- a/components/MySlider/index.jsx +++ b/components/MySlider/index.jsx @@ -90,7 +90,7 @@ export default function MySlider({ // }; const _onPanResponderMoveLeft = (e, gestureState) => { const process = - (gestureState.x0 - 30 - thumbSize / 2 + gestureState.dx) / processWidth; + (gestureState.x0 - thumbSize / 2 + gestureState.dx) / processWidth; _changeProcess(process, "left"); }; @@ -102,7 +102,7 @@ export default function MySlider({ const _onPanResponderMoveRight = (e, gestureState) => { const process = - (gestureState.x0 + 30 - thumbSize / 2 + gestureState.dx) / processWidth; + (gestureState.x0 - thumbSize / 2 + gestureState.dx) / processWidth; _changeProcess(process, "right"); }; const _changeProcess = (changeProcess, direction) => { @@ -116,10 +116,10 @@ export default function MySlider({ const newProcess = Math.round(newValue) / (upper_bound - lower_bound); setStepNum(stepNum + 1); if (process !== newProcess) { - const currentRightProcess = - (stepValues.indexOf(currentRightValue.current) * step - lower_bound) / - (upper_bound - lower_bound); if (direction == "left") { + const currentRightProcess = + (stepValues.indexOf(currentRightValue.current) * step - lower_bound) / + (upper_bound - lower_bound); if (newProcess < currentRightProcess) { setLeftProcess(newProcess); setStepNum((old) => old + 1); @@ -264,7 +264,6 @@ export default function MySlider({ width: thumbSize, height: thumbSize, borderRadius: 50, - marginTop: -processHeight / 2, backgroundColor: "#ff75c8", borderColor: "#ffffff", borderWidth: 2, @@ -287,6 +286,7 @@ export default function MySlider({ alignItems: "center", // borderWidth: 2, }} + {...rightWatcher.current?.panHandlers} > @@ -317,15 +316,7 @@ export default function MySlider({ color: "#ff75c8", }} > - {/* {hasInfinity && leftProcess == 1 - ? ">" + upper_bound - : stepValues[ - Math.round( - (leftProcess * (upper_bound - lower_bound) + lower_bound) / - step - ) - ]} */} - {leftValue} + {hasInfinity && leftProcess == 1 ? ">" + upper_bound : leftValue} - {/* {hasInfinity && Math.floor(rightProcess) == 1 - ? ">" + upper_bound - : stepValues[ - Math.round( - (rightProcess * (upper_bound - lower_bound) + lower_bound) / - step - ) - ]} */} - {rightValue} + {hasInfinity && rightProcess == 1 ? ">" + upper_bound : rightValue} Date: Fri, 23 Aug 2024 21:38:23 +0800 Subject: [PATCH 07/15] =?UTF-8?q?=E5=A4=84=E7=90=86=E9=87=8D=E5=8F=A0?= =?UTF-8?q?=E9=97=AE=E9=A2=98?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- components/MySlider/index.jsx | 155 ++++++++++++++++------------------ screeens/Search/index.jsx | 10 ++- 2 files changed, 80 insertions(+), 85 deletions(-) diff --git a/components/MySlider/index.jsx b/components/MySlider/index.jsx index 5474231..8ed6e0d 100644 --- a/components/MySlider/index.jsx +++ b/components/MySlider/index.jsx @@ -19,6 +19,7 @@ export default function MySlider({ width = Dimensions.get("window").width - 44, onChange, onAfterChange = () => {}, + handleFunc = () => {}, defaultValue = 0, disabled = false, thumbSize = 25, @@ -48,16 +49,16 @@ export default function MySlider({ leftWatcher.current = PanResponder.create({ // 建立监视器 onStartShouldSetPanResponder: () => true, - // onPanResponderGrant: _onPanResponderGrantLeft, // 按下 + onPanResponderGrant: _onPanResponderGrantLeft, // 按下 onPanResponderMove: _onPanResponderMoveLeft, // 移动 - // onPanResponderEnd: _onPanResponderEndLeft, // 结束 + onPanResponderEnd: _onPanResponderEndLeft, // 结束 }); rightWatcher.current = PanResponder.create({ // 建立监视器 onStartShouldSetPanResponder: () => true, - // onPanResponderGrant: _onPanResponderGrantRight, // 按下 + onPanResponderGrant: _onPanResponderGrantRight, // 按下 onPanResponderMove: _onPanResponderMoveRight, // 移动 - // onPanResponderEnd: _onPanResponderEndRight, // 结束 + onPanResponderEnd: _onPanResponderEndRight, // 结束 }); setProcessWidth(width - thumbSize * 2); }, []); @@ -78,27 +79,32 @@ export default function MySlider({ // }, [leftProcess, rightProcess]); // 左侧滑块事件 - // const _onPanResponderGrantLeft = (e, gestureState) => { - // const process = (gestureState.x0 - 40 - thumbSize / 2) / processWidth; - // _changeProcess(process, "left"); - // }; + const _onPanResponderGrantLeft = (e, gestureState) => { + // const process = (gestureState.x0 - 40 - thumbSize / 2) / processWidth; + // _changeProcess(process, "left"); + handleFunc && handleFunc(); + }; - // const _onPanResponderEndLeft = (e, gestureState) => { - // // if (onAfterChange) { - // // onAfterChange(gestureState.x0); - // // } - // }; + const _onPanResponderEndLeft = (e, gestureState) => { + handleFunc && handleFunc(); + }; const _onPanResponderMoveLeft = (e, gestureState) => { const process = - (gestureState.x0 - thumbSize / 2 + gestureState.dx) / processWidth; + (gestureState.x0 - thumbSize * 2 + gestureState.dx) / processWidth; _changeProcess(process, "left"); }; // 右侧滑块事件 - // const _onPanResponderGrantRight = (e, gestureState) => { - // const process = (gestureState.x0 - 40 - thumbSize / 2) / processWidth; - // _changeProcess(process, "right"); - // }; + const _onPanResponderGrantRight = (e, gestureState) => { + // const process = (gestureState.x0 - 40 - thumbSize / 2) / processWidth; + // _changeProcess(process, "right"); + handleFunc && handleFunc(); + }; + const _onPanResponderEndRight = (e, gestureState) => { + // const process = (gestureState.x0 - 40 - thumbSize / 2) / processWidth; + // _changeProcess(process, "right"); + handleFunc && handleFunc(); + }; const _onPanResponderMoveRight = (e, gestureState) => { const process = @@ -121,18 +127,21 @@ export default function MySlider({ (stepValues.indexOf(currentRightValue.current) * step - lower_bound) / (upper_bound - lower_bound); if (newProcess < currentRightProcess) { - setLeftProcess(newProcess); - setStepNum((old) => old + 1); - onChange({ - lower_bound: - stepValues[ - Math.round( - (newProcess * (upper_bound - lower_bound) + lower_bound) / - step - ) - ], - upper_bound: currentRightValue.current, - }); + // console.log("currentRightProcess", newProcess, currentRightProcess); + const newLower = + stepValues[ + Math.round( + (newProcess * (upper_bound - lower_bound) + lower_bound) / step + ) + ]; + if (newLower <= currentRightValue.current - 3) { + setLeftProcess(newProcess); + setStepNum((old) => old + 1); + onChange({ + lower_bound: newLower, + upper_bound: currentRightValue.current, + }); + } } } else { const currentLeftProcess = @@ -140,18 +149,21 @@ export default function MySlider({ (upper_bound - lower_bound); if (newProcess > currentLeftProcess) { - setRightProcess(newProcess); - setStepNum((old) => old - 1); - onChange({ - lower_bound: currentLeftValue.current, - upper_bound: - stepValues[ - Math.round( - (newProcess * (upper_bound - lower_bound) + lower_bound) / - step - ) - ], - }); + const newUpper = + stepValues[ + Math.round( + (newProcess * (upper_bound - lower_bound) + lower_bound) / step + ) + ]; + if (newUpper >= currentLeftValue.current + 3) { + setRightProcess(newProcess); + setStepNum((old) => old - 1); + onChange({ + lower_bound: currentLeftValue.current, + upper_bound: newUpper, + }); + } + // setStepNum(stepNum - 1); } } @@ -244,62 +256,37 @@ export default function MySlider({ cachePolicy="disk" // style={tailwind("w-full h-full rounded-lg overflow-hidden")} style={{ - width: thumbSize * 3, - height: thumbSize * 3, position: "absolute", - left: leftProcess * processWidth - thumbSize, + left: leftProcess * processWidth, zIndex: 10, - display: "flex", - justifyContent: "center", - alignItems: "center", - // borderWidth: 2, + width: thumbSize, + height: thumbSize, + borderRadius: 50, + backgroundColor: "#ff75c8", + borderColor: "#ffffff", + borderWidth: 2, }} {...leftWatcher.current?.panHandlers} - > - - + > {/* 右侧控件 */} - - + > { + setDontScroll((old) => !old); + }} leftValue={ item.key == "age" ? filtersValue.age.lower_bound @@ -990,6 +994,7 @@ export default function Search({ navigation, route }) { }) } scrollViewProps={{ + scrollEnabled: dontScroll, contentContainerStyle: { // paddingTop: 20, backgroundColor: "black", @@ -1057,6 +1062,9 @@ export default function Search({ navigation, route }) { } stepValues={item.stepValues} step={item.step} + handleFunc={() => { + setDontScroll((old) => !old); + }} hasInfinity={true} itemKey={item.key} onChange={(value) => { -- 2.41.0 From a2518f7f4d38c298e01a5ba1827eb4f842904d6d Mon Sep 17 00:00:00 2001 From: al Date: Wed, 28 Aug 2024 17:50:15 +0800 Subject: [PATCH 08/15] =?UTF-8?q?=E6=94=B9=E5=96=84=E4=BC=9A=E5=91=98?= =?UTF-8?q?=E6=88=90=E5=91=98=E5=8A=9F=E8=83=BD?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- App.jsx | 12 + .../SpaceMember/AllSpaceMember/index.jsx | 12 +- .../SpaceMember/IronfanSpaceMember/index.jsx | 10 +- .../SpaceMember/SuperFanSpaceMember/index.jsx | 10 +- screeens/SpaceSetting/SpaceSearch/index.jsx | 245 ++++++++++++++++++ screeens/SpaceSetting/index.jsx | 9 + 6 files changed, 291 insertions(+), 7 deletions(-) create mode 100644 screeens/SpaceSetting/SpaceSearch/index.jsx diff --git a/App.jsx b/App.jsx index 3904b6d..d6fa3e9 100644 --- a/App.jsx +++ b/App.jsx @@ -47,6 +47,8 @@ import SpaceIntroduce from "./screeens/SpaceIntroduce"; import StreamerSpace from "./screeens/StreamerSpace"; import CreateSpace from "./screeens/CreateSpace"; import SpaceSetting from "./screeens/SpaceSetting"; +import NoticeDetail from "./screeens/Message/NoticeDetail"; +import SpaceSearch from "./screeens/SpaceSetting/SpaceSearch"; import ShareSpace from "./screeens/ShareSpace"; import EditSpacePost from "./screeens/EditSpacePost"; import VisibleToOneselfSpacePosts from "./screeens/VisibleToOneselfSpacePosts"; @@ -521,6 +523,11 @@ const App = () => { component={Search} options={{ headerShown: false }} /> + { component={SpaceSetting} options={{ headerShown: false }} /> + { - if (zid === undefined) return; + if (zid === undefined || !more) return; const apiUrl = process.env.EXPO_PUBLIC_API_URL; try { const base = await baseRequest(); const body = { zid: zid, member_type: 1, + offset: offset, + limit: 20, ...base, }; const signature = await generateSignature(body); const _response = await fetch( - `${apiUrl}/api/zone/member_list?signature=${signature}`, + `${apiUrl}/api/zone/member_list_v2?signature=${signature}`, { method: "POST", headers: { @@ -52,6 +55,8 @@ export default function AllSpaceMember({ zid }) { return; } setData(_data.data.list); + setOffset(_data.data.offset); + setMore(_data.data.more); } catch (error) { console.error(error); } @@ -147,6 +152,7 @@ export default function AllSpaceMember({ zid }) { onRefresh={() => handleRefresh()} /> } + ononEndReached={() => getData()} ListEmptyComponent={} ListHeaderComponent={() => ( { - if (zid === undefined) return; + if (zid === undefined || !more) return; const apiUrl = process.env.EXPO_PUBLIC_API_URL; try { const base = await baseRequest(); const body = { zid: zid, member_type: 2, + offset: offset, + limit: 20, ...base, }; const signature = await generateSignature(body); @@ -52,6 +55,8 @@ export default function IronfanSpaceMember({ zid }) { return; } setData(_data.data.list); + setOffset(_data.data.offset); + setMore(_data.data.more); } catch (error) { console.error(error); } @@ -147,6 +152,7 @@ export default function IronfanSpaceMember({ zid }) { onRefresh={() => handleRefresh()} /> } + ononEndReached={() => getData()} ListEmptyComponent={} ListHeaderComponent={() => ( { - if (zid === undefined) return; + if (zid === undefined || !more) return; const apiUrl = process.env.EXPO_PUBLIC_API_URL; try { const base = await baseRequest(); const body = { zid: zid, member_type: 3, + offset: offset, + limit: 20, ...base, }; const signature = await generateSignature(body); @@ -52,6 +55,8 @@ export default function SuperFanSpaceMember({ zid }) { return; } setData(_data.data.list); + setOffset(_data.data.offset); + setMore(_data.data.more); } catch (error) { console.error(error); } @@ -147,6 +152,7 @@ export default function SuperFanSpaceMember({ zid }) { onRefresh={() => handleRefresh()} /> } + ononEndReached={() => getData()} ListEmptyComponent={} ListHeaderComponent={() => ( { + if (searchValue.length != 6) { + setIsloading(false); + return; + } + const apiUrl = process.env.EXPO_PUBLIC_API_URL; + try { + const base = await baseRequest(); + const body = { + member_user_id: Number(searchValue), + ...base, + }; + console.log(body); + const signature = await generateSignature(body); + const _response = await fetch( + `${apiUrl}/api/zone/search_zone_member?signature=${signature}`, + { + method: "POST", + headers: { + "Content-Type": "application/json", + }, + body: JSON.stringify(body), + } + ); + + const _data = await _response.json(); + if (_data.ret === -1) { + console.log("_data", _data); + setIsloading(false); + Toast.show({ + type: "error", + text1: _data.msg, + topOffset: 60, + }); + return; + } + setData(_data.data.list); + setIsloading(false); + } catch (error) { + console.error(error); + } + }; + //进入页面默认focus + useEffect(() => { + searchRef.current.focus(); + getData(); + }, []); + //搜索框文本变化时进行搜索 + useEffect(() => { + if (!search) { + setData([]); + return; + } + let ignore = false; + getData(search); + return () => { + ignore = true; + }; + }, [search]); + const updateSearch = (search) => { + setSearch(search); + if (!search) return; + setIsloading(true); + }; + //单个成员组件 + const RenderItem = ({ item }) => { + return ( + + + + + + + + {item?.account?.name} + + + {item?.is_ironfan != 1 && ( + + + 空间铁粉 + + + )} + {item?.is_superfan != 1 && ( + + + 超级粉丝 + + + )} + + + + + + + {item?.account?.user_id} + + + + + + {formatTimestamp(item?.join_ct)} + + + + + + + + ); + }; + + return ( + + + navigation.goBack()} + /> + <>} + searchIcon={() => <>} + showLoading={isloading} + onChangeText={updateSearch} + value={search} + /> + + + + {data?.map((item, index) => ( + + ))} + {data.length === 0 && } + + + + ); +} diff --git a/screeens/SpaceSetting/index.jsx b/screeens/SpaceSetting/index.jsx index 95a08d2..88f16fa 100644 --- a/screeens/SpaceSetting/index.jsx +++ b/screeens/SpaceSetting/index.jsx @@ -101,6 +101,15 @@ export default function SpaceSetting({ navigation, route }) { onPress={() => navigation.goBack()} /> ), + headerRight: () => ( + navigation.navigate("SpaceSearch")} + /> + ), title: "空间成员", headerTitleStyle: { color: "white" }, headerStyle: { backgroundColor: "#07050A" }, -- 2.41.0 From 219f51ca300f5dc27e56fad2027519a77f27e29c Mon Sep 17 00:00:00 2001 From: al Date: Fri, 30 Aug 2024 13:55:31 +0800 Subject: [PATCH 09/15] =?UTF-8?q?=E4=BF=AE=E6=94=B9=E7=AD=9B=E9=80=89?= =?UTF-8?q?=E5=8A=9F=E8=83=BD?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- components/MySlider/index.jsx | 92 ++++++++++++--------- components/Picker/index.jsx | 9 +- screeens/Search/index.jsx | 81 +++++++++++------- screeens/SpaceSetting/SpaceSearch/index.jsx | 35 +++++--- 4 files changed, 132 insertions(+), 85 deletions(-) diff --git a/components/MySlider/index.jsx b/components/MySlider/index.jsx index 8ed6e0d..3e31971 100644 --- a/components/MySlider/index.jsx +++ b/components/MySlider/index.jsx @@ -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" && ( + + {unit} + + )} @@ -317,46 +319,54 @@ export default function MySlider({ - {hasInfinity && rightProcess == 1 ? ">" + upper_bound : rightValue} + {hasInfinity && rightProcess >= 1 ? ">" + upper_bound : rightValue} + + {unitSite == "right" && ( + + {unit} + + )} + + + + {lower_bound} - {unit} + {hasInfinity ? ">" + upper_bound : upper_bound} - - {lower_bound} - - - {hasInfinity ? ">" + upper_bound : upper_bound} - ); } diff --git a/components/Picker/index.jsx b/components/Picker/index.jsx index a07370d..d0ce503 100644 --- a/components/Picker/index.jsx +++ b/components/Picker/index.jsx @@ -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 ( { + 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 ( @@ -449,11 +461,11 @@ export default function Search({ navigation, route }) { numberOfLines={1} ellipsizeMode="tail" > - {item.zones[0].profile} + {item.zones[0]?.profile} - {zones.length === 1 && ( + {onlyOne && ( @@ -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")} /> @@ -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")} /> ))} )} {zones?.map((item, index) => ( - + ))} {zones.length > 0 && } {streamers.length > 0 && ( @@ -1209,9 +1225,12 @@ export default function Search({ navigation, route }) { 猜你喜欢 )} - {recommList?.map((item, index) => ( - - ))} + {recommList + .filter((it) => it.zones.length > 0) + ?.map((item, index) => ( + + ))} + {streamers.length === 0 && recommList.length === 0 && ( )} diff --git a/screeens/SpaceSetting/SpaceSearch/index.jsx b/screeens/SpaceSetting/SpaceSearch/index.jsx index ed2195b..ca7351b 100644 --- a/screeens/SpaceSetting/SpaceSearch/index.jsx +++ b/screeens/SpaceSetting/SpaceSearch/index.jsx @@ -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} - {item?.is_ironfan != 1 && ( + {item?.is_ironfan == 1 && ( - 空间铁粉 + 铁粉 )} - {item?.is_superfan != 1 && ( + {item?.is_superfan == 1 && ( - 超级粉丝 + 超丝 )} @@ -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="清空" -- 2.41.0 From 0d752ffc474fd6adc1798a205f557af5a3ea21b0 Mon Sep 17 00:00:00 2001 From: al Date: Fri, 30 Aug 2024 13:58:27 +0800 Subject: [PATCH 10/15] =?UTF-8?q?=E6=96=B0=E5=A2=9E=E6=B6=88=E6=81=AF?= =?UTF-8?q?=E9=A1=B5=E9=9D=A2?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- App.jsx | 2 +- screeens/HomeTab/index.jsx | 9 +- screeens/NoticeDetail/ActiveNotice/index.js | 47 ++++ screeens/NoticeDetail/NoticeNav/index.jsx | 234 ++++++++++++++++++ screeens/NoticeDetail/SystemNotice/index.jsx | 66 +++++ .../components/NoticeItem/index.jsx | 96 +++++++ screeens/NoticeDetail/index.jsx | 57 +++++ 7 files changed, 506 insertions(+), 5 deletions(-) create mode 100644 screeens/NoticeDetail/ActiveNotice/index.js create mode 100644 screeens/NoticeDetail/NoticeNav/index.jsx create mode 100644 screeens/NoticeDetail/SystemNotice/index.jsx create mode 100644 screeens/NoticeDetail/components/NoticeItem/index.jsx create mode 100644 screeens/NoticeDetail/index.jsx diff --git a/App.jsx b/App.jsx index d6fa3e9..b0aba83 100644 --- a/App.jsx +++ b/App.jsx @@ -47,7 +47,7 @@ import SpaceIntroduce from "./screeens/SpaceIntroduce"; import StreamerSpace from "./screeens/StreamerSpace"; import CreateSpace from "./screeens/CreateSpace"; import SpaceSetting from "./screeens/SpaceSetting"; -import NoticeDetail from "./screeens/Message/NoticeDetail"; +import NoticeDetail from "./screeens/NoticeDetail"; import SpaceSearch from "./screeens/SpaceSetting/SpaceSearch"; import ShareSpace from "./screeens/ShareSpace"; import EditSpacePost from "./screeens/EditSpacePost"; diff --git a/screeens/HomeTab/index.jsx b/screeens/HomeTab/index.jsx index 1c64d07..c142409 100644 --- a/screeens/HomeTab/index.jsx +++ b/screeens/HomeTab/index.jsx @@ -1,7 +1,8 @@ import React, { useState, useEffect, useCallback } from "react"; import { Image, TouchableOpacity, View } from "react-native"; import { createBottomTabNavigator } from "@react-navigation/bottom-tabs"; -import Stream from "../Stream"; +// import Stream from "../Stream"; +import NoticeNav from "../NoticeDetail"; import My from "../My"; import Posts from "../Posts"; import Space from "../Space"; @@ -121,10 +122,10 @@ export default function HomeTab({ navigation, route }) { /> )} { if (focused) { diff --git a/screeens/NoticeDetail/ActiveNotice/index.js b/screeens/NoticeDetail/ActiveNotice/index.js new file mode 100644 index 0000000..f4cfe36 --- /dev/null +++ b/screeens/NoticeDetail/ActiveNotice/index.js @@ -0,0 +1,47 @@ +import { ScrollView } from "react-native"; +import React, { useState, useCallback } from "react"; +import { useTailwind } from "tailwind-rn"; +import { useSafeAreaInsets } from "react-native-safe-area-context"; +import NoticeItem from "../components/NoticeItem"; +import { Icon } from "@rneui/themed"; +export default function ActiveNotice({ navigation }) { + const tailwind = useTailwind(); + const insets = useSafeAreaInsets(); + + return ( + + + } + /> + + } + /> + + } + /> + + } + /> + + } + /> + + } + /> + + ); +} diff --git a/screeens/NoticeDetail/NoticeNav/index.jsx b/screeens/NoticeDetail/NoticeNav/index.jsx new file mode 100644 index 0000000..0970452 --- /dev/null +++ b/screeens/NoticeDetail/NoticeNav/index.jsx @@ -0,0 +1,234 @@ +import { + View, + TouchableOpacity, + Image as NativeImage, + Text, +} from "react-native"; +import React, { useState, useCallback } from "react"; +import { useTailwind } from "tailwind-rn"; +import { useSafeAreaInsets } from "react-native-safe-area-context"; + +export default function Message({ navigation }) { + const tailwind = useTailwind(); + const insets = useSafeAreaInsets(); + + return ( + + {/* 广告轮播 */} + + {/* 官方消息 */} + + navigation.navigate("SystemNotice")} + style={{ + ...tailwind("flex flex-row items-center py-4 mb-2 rounded-xl"), + backgroundColor: "#ffffff1a", + }} + > + + + + + + + + 系统通知 + + + 官方 + + + + 官方消息通知 + + + + + 11:00 + + + + 1 + + + + + + navigation.navigate("ActiveNotice")} + style={{ + ...tailwind("flex flex-row items-center py-4 rounded-xl"), + backgroundColor: "#ffffff1a", + }} + > + + + + + + + + 活动消息 + + + 官方 + + + + 展示相关活动推送信息 + + + + + 11:00 + + + + 99 + + + + + + + {/* 私聊消息 */} + + + navigation.navigate("MessageDetail", { + mid: 1, + }) + } + style={{ + ...tailwind("flex flex-row items-center py-4 mb-2 rounded-xl"), + backgroundColor: "#333333", + }} + > + + + + + + + + 铁粉空间官网 + + + 官方客服 + + + + 请回复您的相关消息 + + + + + 11:00 + + + + 1 + + + + + + + + ); +} diff --git a/screeens/NoticeDetail/SystemNotice/index.jsx b/screeens/NoticeDetail/SystemNotice/index.jsx new file mode 100644 index 0000000..e428593 --- /dev/null +++ b/screeens/NoticeDetail/SystemNotice/index.jsx @@ -0,0 +1,66 @@ +import { ScrollView } from "react-native"; +import React, { useState, useCallback } from "react"; +import { useTailwind } from "tailwind-rn"; +import { useSafeAreaInsets } from "react-native-safe-area-context"; +import NoticeItem from "../components/NoticeItem"; +import { Icon } from "@rneui/themed"; +export default function SystemNotice({ navigation }) { + const tailwind = useTailwind(); + const insets = useSafeAreaInsets(); + + return ( + + + } + /> + + } + /> + + } + /> + + } + /> + + } + /> + + } + /> + + ); +} diff --git a/screeens/NoticeDetail/components/NoticeItem/index.jsx b/screeens/NoticeDetail/components/NoticeItem/index.jsx new file mode 100644 index 0000000..3232ba1 --- /dev/null +++ b/screeens/NoticeDetail/components/NoticeItem/index.jsx @@ -0,0 +1,96 @@ +import { + View, + TouchableOpacity, + Image as NativeImage, + Text, +} from "react-native"; +import React from "react"; +import { useTailwind } from "tailwind-rn"; +import { useSafeAreaInsets } from "react-native-safe-area-context"; +export default function NoticeItem({ leftIcon, hasLink }) { + const tailwind = useTailwind(); + const insets = useSafeAreaInsets(); + + return ( + + + {/* 头像 */} + + {/* */} + {leftIcon} + + + {/* 内容 */} + + {/* 文本内容 */} + + + 您的个人资料已审核通过。 + + + {/* 链接跳转 */} + {hasLink && ( + {}} + style={{ + ...tailwind("rounded-xl p-2 flex flex-row items-center my-2"), + backgroundColor: "#ffffff1a", + }} + > + + {/* */} + + + + {hasLink.text} + + + + )} + + {/* 时间 */} + + + 11:00 + + + + + + + ); +} diff --git a/screeens/NoticeDetail/index.jsx b/screeens/NoticeDetail/index.jsx new file mode 100644 index 0000000..26900bb --- /dev/null +++ b/screeens/NoticeDetail/index.jsx @@ -0,0 +1,57 @@ +import React from "react"; +import { createNativeStackNavigator } from "@react-navigation/native-stack"; +import { Icon } from "@rneui/themed"; +import ActiveNotice from "./ActiveNotice"; +import SystemNotice from "./SystemNotice"; +import NoticeNav from "./NoticeNav"; +const SpaceSettingStack = createNativeStackNavigator(); + +export default function NoticeDetail({ navigation, route }) { + return ( + + ({ + headerShown: false, + })} + /> + ({ + headerLeft: () => ( + navigation.goBack()} + /> + ), + title: "系统通知", + headerTitleStyle: { color: "white" }, + headerStyle: { backgroundColor: "#07050A" }, + })} + /> + ({ + headerLeft: () => ( + navigation.goBack()} + /> + ), + title: "活动信息", + headerTitleStyle: { color: "white" }, + headerStyle: { backgroundColor: "#07050A" }, + })} + /> + + ); +} -- 2.41.0 From 95871ca0db08b9bf7dd1787235c0dc75ee11d25e Mon Sep 17 00:00:00 2001 From: al Date: Mon, 2 Sep 2024 16:50:45 +0800 Subject: [PATCH 11/15] =?UTF-8?q?=E4=BF=AE=E5=A4=8D=E6=8A=A5=E9=94=99?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- screeens/HomeTab/index.jsx | 29 ++++++++++++++++++--- screeens/SpaceSetting/SpaceSearch/index.jsx | 2 +- 2 files changed, 27 insertions(+), 4 deletions(-) diff --git a/screeens/HomeTab/index.jsx b/screeens/HomeTab/index.jsx index c142409..da10f04 100644 --- a/screeens/HomeTab/index.jsx +++ b/screeens/HomeTab/index.jsx @@ -1,8 +1,8 @@ import React, { useState, useEffect, useCallback } from "react"; import { Image, TouchableOpacity, View } from "react-native"; import { createBottomTabNavigator } from "@react-navigation/bottom-tabs"; -// import Stream from "../Stream"; -import NoticeNav from "../NoticeDetail"; +import Stream from "../Stream"; +// import NoticeNav from "../NoticeDetail"; import My from "../My"; import Posts from "../Posts"; import Space from "../Space"; @@ -122,6 +122,29 @@ export default function HomeTab({ navigation, route }) { /> )} { + if (focused) { + return ( + + ); + } else { + return ( + + ); + } + }, + }} + /> + {/* + /> */} { - if (searchValue.length != 6) { + if (searchValue?.length != 6) { setIsloading(false); return; } -- 2.41.0 From ccff5038882d85fc2c023ffe3c33ded4a4213842 Mon Sep 17 00:00:00 2001 From: al Date: Wed, 4 Sep 2024 12:23:56 +0800 Subject: [PATCH 12/15] =?UTF-8?q?=E5=AE=8C=E5=96=84=E7=AD=9B=E9=80=89?= =?UTF-8?q?=E5=8A=9F=E8=83=BD?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- components/MySlider/index.jsx | 42 +-- screeens/Search/index.jsx | 310 ++++++++++++++------ screeens/SpaceSetting/SpaceSearch/index.jsx | 4 +- yarn.lock | 20 +- 4 files changed, 241 insertions(+), 135 deletions(-) diff --git a/components/MySlider/index.jsx b/components/MySlider/index.jsx index 3e31971..47eb34d 100644 --- a/components/MySlider/index.jsx +++ b/components/MySlider/index.jsx @@ -7,20 +7,15 @@ export default function MySlider({ step, unit, unitSite = "right", - height = 60, width = Dimensions.get("window").width - 44, onChange, - onAfterChange = () => {}, handleFunc = () => {}, - defaultValue = 0, disabled = false, thumbSize = 25, stepValues = [], - itemKey, hasInfinity, - leftValue = 0, - rightValue = 0, - thumbImage = null, + leftValue = lower_bound, + rightValue = stepValues[stepValues.length - 1], maximumTrackTintColor = "#dcdbdb", minimumTrackTintColor = "#577BFF", processHeight = 7, @@ -67,17 +62,12 @@ export default function MySlider({ currentLeftValue.current = leftValue; currentRightValue.current = rightValue; }, [leftValue, rightValue]); - // useEffect(() => { - - // }, [leftProcess, rightProcess]); // 左侧滑块事件 - const _onPanResponderGrantLeft = (e, gestureState) => { - // const process = (gestureState.x0 - 40 - thumbSize / 2) / processWidth; - // _changeProcess(process, "left"); + const _onPanResponderGrantLeft = () => { handleFunc && handleFunc(); }; - const _onPanResponderEndLeft = (e, gestureState) => { + const _onPanResponderEndLeft = () => { handleFunc && handleFunc(); }; const _onPanResponderMoveLeft = (e, gestureState) => { @@ -87,14 +77,10 @@ export default function MySlider({ }; // 右侧滑块事件 - const _onPanResponderGrantRight = (e, gestureState) => { - // const process = (gestureState.x0 - 40 - thumbSize / 2) / processWidth; - // _changeProcess(process, "right"); + const _onPanResponderGrantRight = () => { handleFunc && handleFunc(); }; - const _onPanResponderEndRight = (e, gestureState) => { - // const process = (gestureState.x0 - 40 - thumbSize / 2) / processWidth; - // _changeProcess(process, "right"); + const _onPanResponderEndRight = () => { handleFunc && handleFunc(); }; @@ -119,7 +105,6 @@ export default function MySlider({ (stepValues.indexOf(currentRightValue.current) * step - lower_bound) / (upper_bound - lower_bound); if (newProcess < currentRightProcess) { - // console.log("currentRightProcess", newProcess, currentRightProcess); const newLower = stepValues[ Math.round( @@ -155,21 +140,12 @@ export default function MySlider({ upper_bound: newUpper, }); } - - // setStepNum(stepNum - 1); } } } }; return ( {stepValues.map((item, index) => ( @@ -217,10 +191,8 @@ export default function MySlider({ { setSearch(search); if (!search) return; @@ -221,8 +225,42 @@ export default function Search({ navigation, route }) { //进入页面默认focus useEffect(() => { searchRef.current.focus(); - getIsMember(); }, []); + useFocusEffect( + useCallback(() => { + const getIsMember = async () => { + const apiUrl = process.env.EXPO_PUBLIC_API_URL; + let api; + api = "/api/account/list_by_mid"; + const account = await get("account"); + try { + const base = await baseRequest(); + const signature = await generateSignature({ + ...base, + mid: account.mid, + }); + const response = await fetch( + `${apiUrl}${api}?signature=${signature}`, + { + method: "POST", + headers: { + "Content-Type": "application/json", + }, + body: JSON.stringify({ + ...base, + mid: account.mid, + }), + } + ); + const data = await response.json(); + setIsMember(data.data.account.is_a_member); + } catch (error) { + console.error(error); + } + }; + getIsMember(); + }, []) + ); //搜索框文本变化时进行搜索 useEffect(() => { @@ -235,6 +273,14 @@ export default function Search({ navigation, route }) { return /^\d+$/.test(str); }; const getResult = async () => { + if (filtersValue.comprehensiveUsed.used || filtersValue.priceUsed.used) { + setFiltersValue((old) => ({ + ...old, + comprehensiveUsed: { show: false, used: false }, + priceUsed: { show: false, used: false }, + })); + } + const apiUrl = process.env.EXPO_PUBLIC_API_URL; const isSearchInt = isNumeric(search); let api; @@ -281,13 +327,13 @@ export default function Search({ navigation, route }) { ); setStreamers(data.data.list); setZones(zonesData); + setRecommList([]); } setIsloading(false); } catch (error) { console.error(error); } }; - let ignore = false; getResult(); return () => { @@ -295,8 +341,16 @@ export default function Search({ navigation, route }) { }; }, [search]); const getFiltersResult = async (obj) => { + if (search != "") { + setSearch(""); + } + setFiltersValue({ + ...filtersValue, + ...currentFiltersChangeValue, + // comprehensiveUsed: { show: false, used: true }, + }); const apiUrl = process.env.EXPO_PUBLIC_API_URL; - const newObj = obj || filtersValue; + const newObj = obj || { ...filtersValue, ...currentFiltersChangeValue }; let api; let querryParams; api = "/api/streamer/filter"; @@ -310,6 +364,7 @@ export default function Search({ navigation, route }) { delete currentFilterValue.comprehensiveUsed; delete currentFilterValue.priceUsed; querryParams = currentFilterValue; + try { const base = await baseRequest(); const signature = await generateSignature({ @@ -350,36 +405,9 @@ export default function Search({ navigation, route }) { console.error(error); } }; - const getIsMember = async () => { - const apiUrl = process.env.EXPO_PUBLIC_API_URL; - let api; - api = "/api/account/list_by_mid"; - const account = await get("account"); - try { - const base = await baseRequest(); - const signature = await generateSignature({ - ...base, - mid: account.mid, - }); - const response = await fetch(`${apiUrl}${api}?signature=${signature}`, { - method: "POST", - headers: { - "Content-Type": "application/json", - }, - body: JSON.stringify({ - ...base, - mid: account.mid, - }), - }); - const data = await response.json(); - setIsMember(data.data.account.is_a_member); - } catch (error) { - console.error(error); - } - }; - //重置筛选值 + // 重置重置筛选值 const handleResetFiltersValue = (type) => { - let obj = {}; + let obj = filtersValue; if (type == "comprehensive") { obj = { ...filtersValue, @@ -392,7 +420,7 @@ export default function Search({ navigation, route }) { is_active_within_a_week: 0, comprehensiveUsed: { show: false, used: false }, }; - } else { + } else if (type == "zone_admission_price") { obj = { ...filtersValue, zone_admission_price: { lower_bound: 0, upper_bound: 4000 }, @@ -400,6 +428,51 @@ export default function Search({ navigation, route }) { priceUsed: { show: false, used: false }, }; } + setCurrentFiltersChangeValue((old) => { + const newObj = { + ...old, + ...obj, + }; + return newObj; + }); + }; + //重置筛选查询值 + const handleResetFiltersSearchValue = (type) => { + let obj = filtersValue; + if (type == "comprehensive") { + obj = { + ...filtersValue, + age: { lower_bound: 18, upper_bound: 60 }, + fans: { lower_bound: 1, upper_bound: 1000 }, + weight: { lower_bound: 35, upper_bound: 100 }, + height: { lower_bound: 140, upper_bound: 200 }, + city: "", + constellation: "", + is_active_within_a_week: 0, + comprehensiveUsed: { show: false, used: false }, + }; + } else if (type == "zone_admission_price") { + obj = { + ...filtersValue, + zone_admission_price: { lower_bound: 0, upper_bound: 4000 }, + wechat_coin_price: { lower_bound: 0, upper_bound: 100000 }, + priceUsed: { show: false, used: false }, + }; + } else { + obj = { + age: { lower_bound: 18, upper_bound: 60 }, + fans: { lower_bound: 1, upper_bound: 1000 }, + weight: { lower_bound: 35, upper_bound: 100 }, + height: { lower_bound: 140, upper_bound: 200 }, + city: "", + constellation: "", + is_active_within_a_week: 0, + comprehensiveUsed: { show: false, used: false }, + zone_admission_price: { lower_bound: 0, upper_bound: 4000 }, + wechat_coin_price: { lower_bound: 0, upper_bound: 100000 }, + priceUsed: { show: false, used: false }, + }; + } setFiltersValue((old) => { const newObj = { ...old, @@ -654,15 +727,12 @@ export default function Search({ navigation, route }) { showLoading={isloading} onChangeText={updateSearch} value={search} - disabled={ - filtersValue.comprehensiveUsed.used || filtersValue.priceUsed.used - } /> @@ -674,11 +744,14 @@ export default function Search({ navigation, route }) { }); }} style={{ - ...tailwind("px-2 rounded-xl flex-row items-center"), + ...tailwind( + "pl-4 mr-4 flex-1 rounded-xl flex-row items-center justify-around" + ), borderColor: "#ff75c8", borderWidth: filtersValue.comprehensiveUsed.used ? 1 : 0, boxSizing: "border-box", - width: 110, + // width: 110, + // width: "50%", }} > {filtersValue.comprehensiveUsed.used && ( handleResetFiltersValue("comprehensive")} - style={{ width: 24 }} + onPress={() => handleResetFiltersSearchValue("comprehensive")} + style={{ + width: 48, + height: 32, + display: "flex", + alignItems: "flex-center", + justifyContent: "center", + backgroundColor: "#301024", + borderRadius: 12, + marginRight: -8, + }} > @@ -733,8 +818,19 @@ export default function Search({ navigation, route }) { {filtersValue.priceUsed.used && ( handleResetFiltersValue("zone_admission_price")} - style={{ width: 24 }} + onPress={() => + handleResetFiltersSearchValue("zone_admission_price") + } + style={{ + width: 48, + height: 32, + display: "flex", + alignItems: "flex-center", + justifyContent: "center", + backgroundColor: "#301024", + borderRadius: 12, + marginRight: -8, + }} > { if (item.key == "age") { - setFiltersValue((old) => ({ ...old, age: value })); + setCurrentFiltersChangeValue((old) => ({ + ...old, + age: value, + })); + // setFiltersValue((old) => ({ ...old, age: value })); } else if (item.key == "fans") { - setFiltersValue((old) => ({ ...old, fans: value })); + setCurrentFiltersChangeValue((old) => ({ + ...old, + fans: value, + })); + // setFiltersValue((old) => ({ ...old, fans: value })); } else if (item.key == "height") { - setFiltersValue((old) => ({ + setCurrentFiltersChangeValue((old) => ({ ...old, height: value, })); + // setFiltersValue((old) => ({ + // ...old, + // height: value, + // })); } else if (item.key == "weight") { - setFiltersValue((old) => ({ + setCurrentFiltersChangeValue((old) => ({ ...old, weight: value, })); + // setFiltersValue((old) => ({ + // ...old, + // weight: value, + // })); } }} maximumTrackTintColor="#382435" @@ -865,14 +977,23 @@ export default function Search({ navigation, route }) { ) : item.type == "checkbox" ? ( - setFiltersValue((old) => ({ - ...old, - is_active_within_a_week: old.is_active_within_a_week - ? 0 - : 1, - })) + checked={ + currentFiltersChangeValue?.is_active_within_a_week + } + onPress={ + () => + setCurrentFiltersChangeValue((old) => ({ + ...old, + is_active_within_a_week: old.is_active_within_a_week + ? 0 + : 1, + })) + // setFiltersValue((old) => ({ + // ...old, + // is_active_within_a_week: old.is_active_within_a_week + // ? 0 + // : 1, + // })) } iconType="material-community" checkedIcon="checkbox-marked" @@ -890,11 +1011,11 @@ export default function Search({ navigation, route }) { placeholder={{ label: "不限", value: "" }} value={ item.key == "constellation" - ? filtersValue.constellation - : filtersValue.city + ? currentFiltersChangeValue?.constellation + : currentFiltersChangeValue?.city } onChange={(value) => - setFiltersValue((old) => { + setCurrentFiltersChangeValue((old) => { let newValue = { ...old }; if (item.key == "constellation") { newValue.constellation = value; @@ -929,12 +1050,13 @@ export default function Search({ navigation, route }) { name="close" size={32} color="white" - onPress={() => + onPress={() => { setIsFilterVisible({ zone_admission_price: false, comprehensive: false, - }) - } + }); + setCurrentFiltersChangeValue(filtersValue); + }} /> )} @@ -971,12 +1093,12 @@ export default function Search({ navigation, route }) { }); return; } + + getFiltersResult(); setFiltersValue((old) => ({ ...old, comprehensiveUsed: { show: false, used: true }, })); - - getFiltersResult(); }} style={{ ...tailwind("text-white px-4 py-2 rounded-xl"), @@ -1067,13 +1189,17 @@ export default function Search({ navigation, route }) { upper_bound={item.upper_bound} leftValue={ item.key == "zone" - ? filtersValue.zone_admission_price.lower_bound - : filtersValue.wechat_coin_price.lower_bound + ? currentFiltersChangeValue?.zone_admission_price + ?.lower_bound + : currentFiltersChangeValue?.wechat_coin_price + ?.lower_bound } rightValue={ item.key == "zone" - ? filtersValue.zone_admission_price.upper_bound - : filtersValue.wechat_coin_price.upper_bound + ? currentFiltersChangeValue?.zone_admission_price + ?.upper_bound + : currentFiltersChangeValue?.wechat_coin_price + ?.upper_bound } stepValues={item.stepValues} step={item.step} @@ -1084,15 +1210,23 @@ export default function Search({ navigation, route }) { itemKey={item.key} onChange={(value) => { if (item.key == "zone") { - setFiltersValue((old) => ({ + setCurrentFiltersChangeValue((old) => ({ ...old, zone_admission_price: value, })); + // setFiltersValue((old) => ({ + // ...old, + // zone_admission_price: value, + // })); } else if (item.key == "wechat") { - setFiltersValue((old) => ({ + setCurrentFiltersChangeValue((old) => ({ ...old, wechat_coin_price: value, })); + // setFiltersValue((old) => ({ + // ...old, + // wechat_coin_price: value, + // })); } }} maximumTrackTintColor="#382435" @@ -1128,12 +1262,13 @@ export default function Search({ navigation, route }) { name="close" size={32} color="white" - onPress={() => + onPress={() => { setIsFilterVisible({ zone_admission_price: false, comprehensive: false, - }) - } + }); + setCurrentFiltersChangeValue(filtersValue); + }} /> )} @@ -1172,12 +1307,11 @@ export default function Search({ navigation, route }) { }); return; } + getFiltersResult(); setFiltersValue((old) => ({ ...old, priceUsed: { show: false, used: true }, })); - - getFiltersResult(); }} style={{ ...tailwind("text-white px-4 py-2 rounded-xl"), @@ -1219,7 +1353,9 @@ export default function Search({ navigation, route }) { {streamers?.map((item, index) => ( ))} - {recommList.length > 0 && } + {recommList.length > 0 && streamers.length > 0 && ( + + )} {recommList.length > 0 && ( 猜你喜欢 diff --git a/screeens/SpaceSetting/SpaceSearch/index.jsx b/screeens/SpaceSetting/SpaceSearch/index.jsx index 66137ac..aaf39f4 100644 --- a/screeens/SpaceSetting/SpaceSearch/index.jsx +++ b/screeens/SpaceSetting/SpaceSearch/index.jsx @@ -57,6 +57,7 @@ export default function SpaceSearch({ navigation }) { body: JSON.stringify(body), } ); + console.log("******", JSON.stringify(body)); const _data = await _response.json(); if (_data.ret === -1) { @@ -69,7 +70,6 @@ export default function SpaceSearch({ navigation }) { }); return; } - console.log("******", _data.data.list); setData(_data.data.list); setIsloading(false); } catch (error) { @@ -164,7 +164,7 @@ export default function SpaceSearch({ navigation }) { borderRadius: 50, }} > - 超丝 + 超粉 )} diff --git a/yarn.lock b/yarn.lock index 8d17f7a..8ef9021 100644 --- a/yarn.lock +++ b/yarn.lock @@ -6492,13 +6492,13 @@ react-devtools-core@^4.27.7: shell-quote "^1.6.1" ws "^7" -react-dom@^18.2.0: - version "18.3.1" - resolved "https://registry.npmmirror.com/react-dom/-/react-dom-18.3.1.tgz#c2265d79511b57d479b3dd3fdfa51536494c5cb4" - integrity sha512-5m4nQKp+rZRb09LNH59GM4BxTh9251/ylbKIbpe7TpGxfJ+9kv6BLkLBXIjjspbgbnIBNqlI23tRnTWT0snUIw== +react-dom@18.2.0: + version "18.2.0" + resolved "https://registry.npmmirror.com/react-dom/-/react-dom-18.2.0.tgz#22aaf38708db2674ed9ada224ca4aa708d821e3d" + integrity sha512-6IMTriUmvsjHUjNtEDudZfuDQUoWXVxKHhlEGSk81n4YFS+r/Kl99wXiwlVXtPBtJenozv2P+hxDsw9eA7Xo6g== dependencies: loose-envify "^1.1.0" - scheduler "^0.23.2" + scheduler "^0.23.0" react-fast-compare@^2.0.1: version "2.0.4" @@ -6750,10 +6750,10 @@ react-shallow-renderer@^16.15.0: object-assign "^4.1.1" react-is "^16.12.0 || ^17.0.0 || ^18.0.0" -react@^18.2.0: - version "18.3.1" - resolved "https://registry.npmmirror.com/react/-/react-18.3.1.tgz#49ab892009c53933625bd16b2533fc754cab2891" - integrity sha512-wS+hAgJShR0KhEvPJArfuPVN1+Hz1t0Y6n5jLrGQbkb4urgPE/0Rve+1kMB1v/oWgHgm4WIcV+i7F2pTVj+2iQ== +react@18.2.0: + version "18.2.0" + resolved "https://registry.npmmirror.com/react/-/react-18.2.0.tgz#555bd98592883255fa00de14f1151a917b5d77d5" + integrity sha512-/3IjMdb2L9QbBdWiW5e3P2/npwMBaU9mHCSCUzNln0ZCYbcfTsGbTJrU/kGemdH2IWmB2ioZ+zkxtmq6g09fGQ== dependencies: loose-envify "^1.1.0" @@ -7042,7 +7042,7 @@ scheduler@0.24.0-canary-efb381bbf-20230505: dependencies: loose-envify "^1.1.0" -scheduler@^0.23.2: +scheduler@^0.23.0: version "0.23.2" resolved "https://registry.npmmirror.com/scheduler/-/scheduler-0.23.2.tgz#414ba64a3b282892e944cf2108ecc078d115cdc3" integrity sha512-UOShsPwz7NrMUqhR6t0hWjFduvOzbtv7toDH1/hIrfRNIDBnnBWd0CwJTGvTpngVlmwGCdP9/Zl/tVrDqcuYzQ== -- 2.41.0 From 30b43de2bac417665925b2b8f68693e29461b5bb Mon Sep 17 00:00:00 2001 From: al Date: Wed, 4 Sep 2024 18:11:20 +0800 Subject: [PATCH 13/15] =?UTF-8?q?=E6=94=B9=E5=96=84=E7=AD=9B=E9=80=89?= =?UTF-8?q?=E4=BB=A3=E7=A0=81?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- screeens/Search/index.jsx | 238 +++++++++----------- screeens/SpaceSetting/SpaceSearch/index.jsx | 9 +- 2 files changed, 106 insertions(+), 141 deletions(-) diff --git a/screeens/Search/index.jsx b/screeens/Search/index.jsx index eec8309..1639ce3 100644 --- a/screeens/Search/index.jsx +++ b/screeens/Search/index.jsx @@ -30,6 +30,21 @@ import MyDivider from "../../components/MyDivider/index"; import MySlider from "../../components/MySlider"; import Picker from "../../components/Picker"; import { get } from "../../utils/storeInfo"; +const filterComprehensiveItems = { + age: { lower_bound: 18, upper_bound: 60 }, + fans: { lower_bound: 1, upper_bound: 1000 }, + weight: { lower_bound: 35, upper_bound: 100 }, + height: { lower_bound: 140, upper_bound: 200 }, + city: "", + constellation: "", + is_active_within_a_week: 0, + comprehensiveUsed: { show: false, used: false }, +}; +const filterPriceItems = { + zone_admission_price: { lower_bound: 0, upper_bound: 4000 }, + wechat_coin_price: { lower_bound: 0, upper_bound: 100000 }, + priceUsed: { show: false, used: false }, +}; export default function Search({ navigation, route }) { const tailwind = useTailwind(); const insets = useSafeAreaInsets(); @@ -201,21 +216,13 @@ export default function Search({ navigation, route }) { }, ]; const [filtersValue, setFiltersValue] = useState({ - age: { lower_bound: 18, upper_bound: 60 }, - fans: { lower_bound: 1, upper_bound: 1000 }, - height: { lower_bound: 140, upper_bound: 200 }, - weight: { lower_bound: 35, upper_bound: 100 }, - city: "", - constellation: "", - is_active_within_a_week: 0, - zone_admission_price: { lower_bound: 0, upper_bound: 4000 }, - wechat_coin_price: { lower_bound: 0, upper_bound: 100000 }, - priceUsed: { show: false, used: false }, - comprehensiveUsed: { show: false, used: false }, + ...filterComprehensiveItems, + ...filterPriceItems, + }); + const [currentFiltersChangeValue, setCurrentFiltersChangeValue] = useState({ + ...filterComprehensiveItems, + ...filterPriceItems, }); - const [currentFiltersChangeValue, setCurrentFiltersChangeValue] = useState( - {} - ); const updateSearch = (search) => { setSearch(search); if (!search) return; @@ -274,13 +281,9 @@ export default function Search({ navigation, route }) { }; const getResult = async () => { if (filtersValue.comprehensiveUsed.used || filtersValue.priceUsed.used) { - setFiltersValue((old) => ({ - ...old, - comprehensiveUsed: { show: false, used: false }, - priceUsed: { show: false, used: false }, - })); + handleResetFiltersValue(); + handleResetFiltersSearchValue(); } - const apiUrl = process.env.EXPO_PUBLIC_API_URL; const isSearchInt = isNumeric(search); let api; @@ -344,10 +347,11 @@ export default function Search({ navigation, route }) { if (search != "") { setSearch(""); } - setFiltersValue({ - ...filtersValue, - ...currentFiltersChangeValue, - // comprehensiveUsed: { show: false, used: true }, + setFiltersValue((old) => { + return { + ...old, + ...obj, + }; }); const apiUrl = process.env.EXPO_PUBLIC_API_URL; const newObj = obj || { ...filtersValue, ...currentFiltersChangeValue }; @@ -405,27 +409,61 @@ export default function Search({ navigation, route }) { console.error(error); } }; + // 更新MySlider值 + const handleChangePriceSliderValue = useCallback((value, item) => { + if (item.key == "zone") { + setCurrentFiltersChangeValue((old) => ({ + ...old, + zone_admission_price: value, + })); + } else if (item.key == "wechat") { + setCurrentFiltersChangeValue((old) => ({ + ...old, + wechat_coin_price: value, + })); + } + }, []); + const handleChangeComprehensiveSliderValue = useCallback((value, item) => { + if (item.key == "age") { + setCurrentFiltersChangeValue((old) => ({ + ...old, + age: value, + })); + } else if (item.key == "fans") { + setCurrentFiltersChangeValue((old) => ({ + ...old, + fans: value, + })); + } else if (item.key == "height") { + setCurrentFiltersChangeValue((old) => ({ + ...old, + height: value, + })); + } else if (item.key == "weight") { + setCurrentFiltersChangeValue((old) => ({ + ...old, + weight: value, + })); + } + }, []); + // 重置重置筛选值 const handleResetFiltersValue = (type) => { let obj = filtersValue; if (type == "comprehensive") { obj = { ...filtersValue, - age: { lower_bound: 18, upper_bound: 60 }, - fans: { lower_bound: 1, upper_bound: 1000 }, - weight: { lower_bound: 35, upper_bound: 100 }, - height: { lower_bound: 140, upper_bound: 200 }, - city: "", - constellation: "", - is_active_within_a_week: 0, - comprehensiveUsed: { show: false, used: false }, + ...filterComprehensiveItems, }; } else if (type == "zone_admission_price") { obj = { ...filtersValue, - zone_admission_price: { lower_bound: 0, upper_bound: 4000 }, - wechat_coin_price: { lower_bound: 0, upper_bound: 100000 }, - priceUsed: { show: false, used: false }, + ...filterPriceItems, + }; + } else { + obj = { + ...filterComprehensiveItems, + ...filterPriceItems, }; } setCurrentFiltersChangeValue((old) => { @@ -442,35 +480,17 @@ export default function Search({ navigation, route }) { if (type == "comprehensive") { obj = { ...filtersValue, - age: { lower_bound: 18, upper_bound: 60 }, - fans: { lower_bound: 1, upper_bound: 1000 }, - weight: { lower_bound: 35, upper_bound: 100 }, - height: { lower_bound: 140, upper_bound: 200 }, - city: "", - constellation: "", - is_active_within_a_week: 0, - comprehensiveUsed: { show: false, used: false }, + ...filterComprehensiveItems, }; } else if (type == "zone_admission_price") { obj = { ...filtersValue, - zone_admission_price: { lower_bound: 0, upper_bound: 4000 }, - wechat_coin_price: { lower_bound: 0, upper_bound: 100000 }, - priceUsed: { show: false, used: false }, + ...filterPriceItems, }; } else { obj = { - age: { lower_bound: 18, upper_bound: 60 }, - fans: { lower_bound: 1, upper_bound: 1000 }, - weight: { lower_bound: 35, upper_bound: 100 }, - height: { lower_bound: 140, upper_bound: 200 }, - city: "", - constellation: "", - is_active_within_a_week: 0, - comprehensiveUsed: { show: false, used: false }, - zone_admission_price: { lower_bound: 0, upper_bound: 4000 }, - wechat_coin_price: { lower_bound: 0, upper_bound: 100000 }, - priceUsed: { show: false, used: false }, + ...filterComprehensiveItems, + ...filterPriceItems, }; } setFiltersValue((old) => { @@ -767,16 +787,18 @@ export default function Search({ navigation, route }) { {filtersValue.comprehensiveUsed.used && ( handleResetFiltersSearchValue("comprehensive")} + onPress={() => { + handleResetFiltersValue("comprehensive"); + handleResetFiltersSearchValue("comprehensive"); + }} style={{ - width: 48, + width: "34%", height: 32, display: "flex", alignItems: "flex-center", justifyContent: "center", backgroundColor: "#301024", borderRadius: 12, - marginRight: -8, }} > {filtersValue.priceUsed.used && ( - handleResetFiltersSearchValue("zone_admission_price") - } + onPress={() => { + handleResetFiltersValue("zone_admission_price"); + handleResetFiltersSearchValue("zone_admission_price"); + }} style={{ - width: 48, + width: "34%", height: 32, display: "flex", alignItems: "flex-center", justifyContent: "center", backgroundColor: "#301024", borderRadius: 12, - marginRight: -8, }} > !old); }} leftValue={ - item.key == "age" - ? currentFiltersChangeValue?.age?.lower_bound - : item.key == "height" - ? currentFiltersChangeValue?.height?.lower_bound - : item.key == "weight" - ? currentFiltersChangeValue?.weight?.lower_bound - : currentFiltersChangeValue?.fans?.lower_bound + currentFiltersChangeValue[item.key]?.lower_bound } rightValue={ - item.key == "age" - ? currentFiltersChangeValue?.age?.upper_bound - : item.key == "height" - ? currentFiltersChangeValue?.height?.upper_bound - : item.key == "weight" - ? currentFiltersChangeValue?.weight?.upper_bound - : currentFiltersChangeValue?.fans?.upper_bound + currentFiltersChangeValue[item.key]?.upper_bound } step={item.step} hasInfinity={item.key == "fans"} stepValues={item.stepValues} - onChange={(value) => { - if (item.key == "age") { - setCurrentFiltersChangeValue((old) => ({ - ...old, - age: value, - })); - // setFiltersValue((old) => ({ ...old, age: value })); - } else if (item.key == "fans") { - setCurrentFiltersChangeValue((old) => ({ - ...old, - fans: value, - })); - // setFiltersValue((old) => ({ ...old, fans: value })); - } else if (item.key == "height") { - setCurrentFiltersChangeValue((old) => ({ - ...old, - height: value, - })); - // setFiltersValue((old) => ({ - // ...old, - // height: value, - // })); - } else if (item.key == "weight") { - setCurrentFiltersChangeValue((old) => ({ - ...old, - weight: value, - })); - // setFiltersValue((old) => ({ - // ...old, - // weight: value, - // })); - } - }} + onChange={(value) => + handleChangeComprehensiveSliderValue(value, item) + } maximumTrackTintColor="#382435" minimumTrackTintColor="#ff75c8" processHeight={5} @@ -1094,7 +1074,10 @@ export default function Search({ navigation, route }) { return; } - getFiltersResult(); + getFiltersResult({ + ...currentFiltersChangeValue, + priceUsed: filtersValue.priceUsed, + }); setFiltersValue((old) => ({ ...old, comprehensiveUsed: { show: false, used: true }, @@ -1208,27 +1191,9 @@ export default function Search({ navigation, route }) { }} hasInfinity={true} itemKey={item.key} - onChange={(value) => { - if (item.key == "zone") { - setCurrentFiltersChangeValue((old) => ({ - ...old, - zone_admission_price: value, - })); - // setFiltersValue((old) => ({ - // ...old, - // zone_admission_price: value, - // })); - } else if (item.key == "wechat") { - setCurrentFiltersChangeValue((old) => ({ - ...old, - wechat_coin_price: value, - })); - // setFiltersValue((old) => ({ - // ...old, - // wechat_coin_price: value, - // })); - } - }} + onChange={(value) => + handleChangePriceSliderValue(value, item) + } maximumTrackTintColor="#382435" minimumTrackTintColor="#ff75c8" processHeight={5} @@ -1307,7 +1272,10 @@ export default function Search({ navigation, route }) { }); return; } - getFiltersResult(); + getFiltersResult({ + ...currentFiltersChangeValue, + comprehensiveUsed: filtersValue.comprehensiveUsed, + }); setFiltersValue((old) => ({ ...old, priceUsed: { show: false, used: true }, diff --git a/screeens/SpaceSetting/SpaceSearch/index.jsx b/screeens/SpaceSetting/SpaceSearch/index.jsx index aaf39f4..0f89292 100644 --- a/screeens/SpaceSetting/SpaceSearch/index.jsx +++ b/screeens/SpaceSetting/SpaceSearch/index.jsx @@ -33,7 +33,7 @@ export default function SpaceSearch({ navigation }) { setIsloading(false); Toast.show({ type: "error", - text1: "请输入六位用户ID", + text1: "请输入完整用户ID", topOffset: 60, }); return; @@ -45,7 +45,6 @@ export default function SpaceSearch({ navigation }) { member_user_id: Number(searchValue), ...base, }; - console.log(body); const signature = await generateSignature(body); const _response = await fetch( `${apiUrl}/api/zone/search_zone_member?signature=${signature}`, @@ -57,11 +56,9 @@ export default function SpaceSearch({ navigation }) { body: JSON.stringify(body), } ); - console.log("******", JSON.stringify(body)); - const _data = await _response.json(); if (_data.ret === -1) { - console.log("_data", _data); + // console.log("_data", _data); setIsloading(false); Toast.show({ type: "error", @@ -234,7 +231,7 @@ export default function SpaceSearch({ navigation }) { inputContainerStyle={tailwind("h-10 bg-[#FFFFFF1A]")} inputStyle={tailwind("text-white")} inputMode="numeric" - placeholder="请输入六位用户ID" + placeholder="请输入完整用户ID" platform="ios" cancelButtonProps={tailwind("text-[#FF669E]")} cancelButtonTitle="清空" -- 2.41.0 From da5463f0dbb1e078897e6ad376b268ea6d94c366 Mon Sep 17 00:00:00 2001 From: al Date: Sat, 7 Sep 2024 00:15:17 +0800 Subject: [PATCH 14/15] =?UTF-8?q?=E6=9B=B4=E6=96=B0=E6=88=90=E5=91=98?= =?UTF-8?q?=E6=90=9C=E7=B4=A2=E5=8A=9F=E8=83=BD?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- screeens/Search/index.jsx | 50 ++++------ .../SpaceMember/AllSpaceMember/index.jsx | 2 +- .../SpaceMember/IronfanSpaceMember/index.jsx | 2 +- .../SpaceMember/SuperFanSpaceMember/index.jsx | 2 +- screeens/SpaceSetting/SpaceSearch/index.jsx | 95 ++++++++++++------- utils/storeInfo.js | 2 +- 6 files changed, 80 insertions(+), 73 deletions(-) diff --git a/screeens/Search/index.jsx b/screeens/Search/index.jsx index 1639ce3..697be7a 100644 --- a/screeens/Search/index.jsx +++ b/screeens/Search/index.jsx @@ -424,27 +424,13 @@ export default function Search({ navigation, route }) { } }, []); const handleChangeComprehensiveSliderValue = useCallback((value, item) => { - if (item.key == "age") { - setCurrentFiltersChangeValue((old) => ({ + setCurrentFiltersChangeValue((old) => { + let newCurrentFiltersChangeValue = { ...old, - age: value, - })); - } else if (item.key == "fans") { - setCurrentFiltersChangeValue((old) => ({ - ...old, - fans: value, - })); - } else if (item.key == "height") { - setCurrentFiltersChangeValue((old) => ({ - ...old, - height: value, - })); - } else if (item.key == "weight") { - setCurrentFiltersChangeValue((old) => ({ - ...old, - weight: value, - })); - } + }; + newCurrentFiltersChangeValue[item.key] = value; + return { ...old, ...newCurrentFiltersChangeValue }; + }); }, []); // 重置重置筛选值 @@ -962,12 +948,18 @@ export default function Search({ navigation, route }) { } onPress={ () => - setCurrentFiltersChangeValue((old) => ({ - ...old, - is_active_within_a_week: old.is_active_within_a_week + // setCurrentFiltersChangeValue((old) => ({ + // ...old, + // is_active_within_a_week: old.is_active_within_a_week + // ? 0 + // : 1, + // })) + handleChangeComprehensiveSliderValue( + currentFiltersChangeValue.is_active_within_a_week ? 0 : 1, - })) + item + ) // setFiltersValue((old) => ({ // ...old, // is_active_within_a_week: old.is_active_within_a_week @@ -995,15 +987,7 @@ export default function Search({ navigation, route }) { : currentFiltersChangeValue?.city } onChange={(value) => - setCurrentFiltersChangeValue((old) => { - let newValue = { ...old }; - if (item.key == "constellation") { - newValue.constellation = value; - } else { - newValue.city = value; - } - return newValue; - }) + handleChangeComprehensiveSliderValue(value, item) } /> )} diff --git a/screeens/SpaceSetting/SpaceMember/AllSpaceMember/index.jsx b/screeens/SpaceSetting/SpaceMember/AllSpaceMember/index.jsx index a37e37e..db5908d 100644 --- a/screeens/SpaceSetting/SpaceMember/AllSpaceMember/index.jsx +++ b/screeens/SpaceSetting/SpaceMember/AllSpaceMember/index.jsx @@ -152,7 +152,7 @@ export default function AllSpaceMember({ zid }) { onRefresh={() => handleRefresh()} /> } - ononEndReached={() => getData()} + onEndReached={() => getData()} ListEmptyComponent={} ListHeaderComponent={() => ( handleRefresh()} /> } - ononEndReached={() => getData()} + onEndReached={() => getData()} ListEmptyComponent={} ListHeaderComponent={() => ( handleRefresh()} /> } - ononEndReached={() => getData()} + onEndReached={() => getData()} ListEmptyComponent={} ListHeaderComponent={() => ( { - if (searchValue?.length != 6) { - setIsloading(false); - return; - } + // if (searchValue?.length != 6) { + // return; + // } if (/[^0-9]/.test(searchValue)) { - setIsloading(false); Toast.show({ type: "error", - text1: "请输入完整用户ID", + text1: "请输入正确的用户ID", topOffset: 60, }); return; } const apiUrl = process.env.EXPO_PUBLIC_API_URL; try { + setIsloading(true); const base = await baseRequest(); const body = { member_user_id: Number(searchValue), ...base, }; + console.log("vvvvvv", JSON.stringify(body)); + const signature = await generateSignature(body); const _response = await fetch( `${apiUrl}/api/zone/search_zone_member?signature=${signature}`, @@ -58,7 +60,6 @@ export default function SpaceSearch({ navigation }) { ); const _data = await _response.json(); if (_data.ret === -1) { - // console.log("_data", _data); setIsloading(false); Toast.show({ type: "error", @@ -68,10 +69,10 @@ export default function SpaceSearch({ navigation }) { return; } setData(_data.data.list); - setIsloading(false); } catch (error) { console.error(error); } + setIsloading(false); }; //进入页面默认focus useEffect(() => { @@ -79,21 +80,20 @@ export default function SpaceSearch({ navigation }) { getData(); }, []); //搜索框文本变化时进行搜索 - useEffect(() => { - if (!search) { - setData([]); - return; - } - let ignore = false; - getData(search); - return () => { - ignore = true; - }; - }, [search]); + // useEffect(() => { + // if (!search) { + // setData([]); + // return; + // } + // let ignore = false; + // // getData(search); + // return () => { + // ignore = true; + // }; + // }, [search]); const updateSearch = (search) => { setSearch(search); if (!search) return; - setIsloading(true); }; //单个成员组件 const RenderItem = ({ item }) => { @@ -225,22 +225,45 @@ export default function SpaceSearch({ navigation }) { color="white" onPress={() => navigation.goBack()} /> - <>} - searchIcon={() => <>} - showLoading={isloading} - onChangeText={updateSearch} - value={search} - /> + + <>} + showCancel={false} + searchIcon={() => <>} + showLoading={isloading} + onChangeText={updateSearch} + value={search} + /> + getData(search)} + > + + 搜索 + + + diff --git a/utils/storeInfo.js b/utils/storeInfo.js index ee19cd2..eed4124 100644 --- a/utils/storeInfo.js +++ b/utils/storeInfo.js @@ -29,7 +29,7 @@ export async function storeAppInfo() { if (Platform.OS === "android") { if (!notFirstTimeOpenApp) return ""; return Application.getAndroidId(); - } else { + } else if (Platform.OS === "ios") { return await Application.getIosIdForVendorAsync(); } } -- 2.41.0 From bc7c1b113a6c336b0fe30c7ee33406a3f2e40b5b Mon Sep 17 00:00:00 2001 From: yezian Date: Mon, 9 Sep 2024 13:12:18 +0800 Subject: [PATCH 15/15] =?UTF-8?q?=E4=BF=AE=E5=A4=8D=E6=A0=B7=E5=BC=8Fbug?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- screeens/Search/index.jsx | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/screeens/Search/index.jsx b/screeens/Search/index.jsx index 697be7a..82ee457 100644 --- a/screeens/Search/index.jsx +++ b/screeens/Search/index.jsx @@ -778,10 +778,10 @@ export default function Search({ navigation, route }) { handleResetFiltersSearchValue("comprehensive"); }} style={{ - width: "34%", + paddingHorizontal: 10, height: 32, display: "flex", - alignItems: "flex-center", + alignItems: "center", justifyContent: "center", backgroundColor: "#301024", borderRadius: 12, @@ -831,10 +831,10 @@ export default function Search({ navigation, route }) { handleResetFiltersSearchValue("zone_admission_price"); }} style={{ - width: "34%", + paddingHorizontal: 10, height: 32, display: "flex", - alignItems: "flex-center", + alignItems: "center", justifyContent: "center", backgroundColor: "#301024", borderRadius: 12, -- 2.41.0