🌈 style(ID1000944): 【蜘蛛管家】-退款/售后- UI还原

【【蜘蛛管家】-退款/售后- UI还原】 https://www.tapd.cn/53459131/bugtrace/bugs/view/1153459131001000944

src/pages/index/index.module.scss

@@ -11,11 +11,12 @@
     padding: 20px;
     box-sizing: border-box;
     align-items: center;
+    background-color: #fff;
 
     .search_collect {
       font-size: 26px;
-            border: 2px solid #007AFF;
+      border: 2px solid #007aff;
-            color: #007AFF;
+      color: #007aff;
       border-radius: 50px;
       width: 132px;
       height: 44px;
@@ -33,7 +34,6 @@
     padding-bottom: calc($customTabBarHeight + env(safe-area-inset-bottom));
     height: calc(100vh - $customTabBarHeight - env(safe-area-inset-bottom) - 100px);
   }
-
 }
 
 //246

src/pages/refundPage/index.module.scss

@@ -30,7 +30,7 @@ page {
   margin-right: 32px;
   font-size: 28px;
   font-weight: 400;
-  color: #000000;
+  color: #000;
 }
 
 .activeshai {
@@ -50,7 +50,7 @@ page {
 }
 
 .scrllStyle {
-  height: 500px;
+  flex: 1 1 auto;
 }
 
 .safeBox {
@@ -58,7 +58,9 @@ page {
 }
 
 .popupBox {
-  padding-bottom: env(safe-area-inset-bottom);
+  display: flex;
+  flex-flow: column nowrap;
+  height: 75vh;
   width: 100%;
 
   .thirdBox {
@@ -72,8 +74,10 @@ page {
     }
 
     .timeBox2 {
+      display: flex;
+      justify-content: center;
+      align-items: center;
       margin-top: 24px;
-      background-color: #f6f6f6;
       height: 68px;
       background: #e9e9e9;
       border-radius: 8px;
@@ -82,15 +86,7 @@ page {
       line-height: 68px;
       position: relative;
       font-size: 28px;
-      font-weight: 400;
+      color: #848484;
-      color: #000000;
-
-      .more {
-        position: absolute;
-        right: 30px;
-        top: 5px;
-        font-size: 40px;
-      }
     }
 
     .flexModebox {
@@ -98,39 +94,19 @@ page {
       display: flex;
       flex-wrap: wrap;
 
-      .activemodeBox {
-        margin-bottom: 16px;
-        margin-right: 16px;
-        // width: 152px;
-        // height: 68px;
-        padding: 17px 34px 17px 34px;
-        background: rgba(51, 127, 255, 0.1);
-        border-radius: 8px;
-        font-size: 28px;
-        font-weight: 400;
-        color: #337fff;
-        text-align: center;
-        // line-height: 68px;
-        border: 1px solid #337fff;
-        box-sizing: border-box;
-      }
-
       .modeBox {
         margin-bottom: 16px;
         margin-right: 16px;
+        min-width: 152px;
         padding: 17px 34px 17px 34px;
-        // width: 152px;
+        color: #848484;
-        // height: 68px;
         background: #f6f6f6;
         border-radius: 8px;
         font-size: 28px;
         font-weight: 400;
-        color: #000000;
         border: 1px solid #f6f6f6;
         text-align: center;
-        // line-height: 68px;
         box-sizing: border-box;
-        // opacity: 0.4;
       }
     }
   }
@@ -140,9 +116,6 @@ page {
     // width: 750px;
     height: 160px;
     background: #ffffff;
-    position: fixed;
-    bottom: 0;
-    z-index: 99;
     display: flex;
     padding-top: 16px;
     align-items: center;
@@ -194,3 +167,9 @@ page {
   //     width: 100%;
   // }
 }
+.activemodeBox {
+  background: rgba(51, 127, 255, 0.1) !important;
+  color: #337fff !important;
+  font-weight: 550 !important;
+  border: 1px solid #337fff !important;
+}

src/pages/refundPage/index.tsx

@@ -269,6 +269,7 @@ const RefundPage = () => {
     setStart(myDate.toLocaleDateString())
     getOrderList()
     setEnd('')
+    closePopup()
   }
   const handSure = () => {
     pageNum.current.page = 1
@@ -307,7 +308,6 @@ const RefundPage = () => {
         <Search placeholder="搜索商品/名称/颜色/订单号" showBtn={false} changeOnSearch={getSearchData} >
           <View className={styles.flexBox} onClick={() => showSelctPopup()}>
             <IconFont name="icon-shaixuan" size={35} color={!isDisabled ? '#0D7CFF' : ''} customClassName={styles.activeshaixuan} />
-            {/* <View className={classnames('iconfont', 'icon-shaixuan', !isDisabled ? styles.icon_shaixuan : styles.activeshaixuan)}></View> */}
             <View className={classnames(isDisabled ? styles.shaixuan : styles.activeshai)}>筛选</View>
           </View>
         </Search>
@@ -334,7 +334,7 @@ const RefundPage = () => {
           })}
         </InfiniteScroll>
       </View>
-      <Popup title="筛选订单" show={showPopup} onClose={() => closePopup()}>
+      <Popup title="筛选订单" show={showPopup} onClose={closePopup}>
         <View className={styles.popupBox}>
           <ScrollView className={styles.scrllStyle} scrollY>
             <View className={styles.thirdBox}>
@@ -343,7 +343,7 @@ const RefundPage = () => {
                 {
                   stageList.map((item, index) => {
                     return (
-                      <View onClick={() => { handCheckStange(item) }} className={classnames(item.checked ? styles.activemodeBox : styles.modeBox)} key={index}>{item.name}</View>
+                      <View onClick={() => { handCheckStange(item) }} className={classnames(styles.modeBox, item.checked && styles.activemodeBox)} key={index}>{item.name}</View>
                     )
                   })
                 }
@@ -355,7 +355,7 @@ const RefundPage = () => {
                 {
                   modeList.map((item, index) => {
                     return (
-                      <View onClick={() => { handCheckMode(item) }} className={classnames(item.checked ? styles.activemodeBox : styles.modeBox)} key={index}>{item.name}</View>
+                      <View onClick={() => { handCheckMode(item) }} className={classnames(styles.modeBox, item.checked && styles.activemodeBox)} key={index}>{item.name}</View>
                     )
                   })
                 }
@@ -367,7 +367,7 @@ const RefundPage = () => {
                 {
                   typeList.map((item, index) => {
                     return (
-                      <View onClick={() => { handType(item) }} className={classnames(item.checked ? styles.activemodeBox : styles.modeBox)} key={index}>{item.name}</View>
+                      <View onClick={() => { handType(item) }} className={classnames(styles.modeBox, item.checked && styles.activemodeBox)} key={index}>{item.name}</View>
                     )
                   })
                 }
@@ -375,23 +375,19 @@ const RefundPage = () => {
             </View>
             <View className={styles.thirdBox}>
               <View className={styles.thirdTopfont}>售后时间</View>
-              <View className={styles.timeBox2} onClick={() => { setShowTime(true) }}>{timeArea}
+              <View className={classnames(styles.timeBox2, timeArea !== '自定义起始时间' && styles.activemodeBox)} onClick={() => { setShowTime(true) }}>{timeArea}
                 <View className={styles.more}>
                   {
-                    timeArea == '自定义起始时间'
+                    timeArea == '自定义起始时间' && <IconFont name="icon-chakanquanbukehu" color="#848484" size={40} customClassName={styles.more}></IconFont>
-                                        && <IconFont name="icon-chakanquanbukehu" color="#000000" size={40} customClassName={styles.more}></IconFont>
                   }
                 </View>
               </View>
             </View>
-            <View className={styles.safeBox}></View>
           </ScrollView>
           <View className={styles.bottomBox}>
-
             <Button className={styles.resetBox} onClick={() => { handReset() }}> 重置</Button >
             <Button className={classnames(isDisabled ? styles.button2 : styles.activeButton)} disabled={isDisabled} onClick={() => handSure()}> 确认</Button >
           </View>
-          {/* <View className={styles.areaBox}></View> */}
         </View>
       </Popup>
       <TimePickerPopup