From ccff5038882d85fc2c023ffe3c33ded4a4213842 Mon Sep 17 00:00:00 2001 From: al Date: Wed, 4 Sep 2024 12:23:56 +0800 Subject: [PATCH] =?UTF-8?q?=E5=AE=8C=E5=96=84=E7=AD=9B=E9=80=89=E5=8A=9F?= =?UTF-8?q?=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==