修改搜索条件

src/school/companion-teacher/compontent/teacher.tsx

@@ -93,8 +93,8 @@ export default defineComponent({
           <OHeader title="交接伴学指导" desotry={false} />
           <OSearch
             placeholder="请输入伴学指导姓名"
-            inputBackground="white"
-            background="#F8F8F8"
+            // inputBackground="white"
+            // background="#F8F8F8"
             onSearch={(val: any) => {
               form.params.keyword = val
               onSearch()
@@ -108,6 +108,9 @@ export default defineComponent({
             finishedText=" "
             class={[styles.liveList]}
             onLoad={getList}
+            style={{
+              paddingTop: '12px'
+            }}
             immediateCheck={false}
           >
             {form.list.map((item: any) => (

src/school/manage-teacher/index.tsx

@@ -144,7 +144,7 @@ export default defineComponent({
             v-slots={{
               left: () => (
                 <div
-                  class={['searchItem-left', form.oPopover ? 'searchItem--active' : '']}
+                  class={['searchItem-left', form.oPopover ? 'searchItem-active' : '']}
                   onClick={() => (form.oPopover = true)}
                 >
                   <span>{form.statusText}</span>

src/school/mass-message/component/class-list/index.tsx

@@ -169,17 +169,9 @@ export default defineComponent({
       >
         {forms.orchestraList.length > 0 && (
           <Sticky position="top" offsetTop={props.height} style={{ width: '100%' }}>
-            <div
-              style={{
-                padding: '12px 13px',
-                background: '#f6f6f6',
-                display: 'flex',
-                alignItems: 'center'
-              }}
-            >
-              <div class={styles.searchBand} onClick={() => (forms.showPopover = true)}>
-                <div class={['van-ellipsis', styles.bandName]}>{forms.orchestraName}</div>
-                <Icon name={forms.showPopover ? 'arrow-up' : 'arrow-down'} />
+            <div class={'searchGroup-single'}>
+              <div class={['searchItem', forms.showPopover ? 'searchItem-active' : '']}>
+                <span>{forms.orchestraName}</span>
               </div>
             </div>
           </Sticky>

src/school/mass-message/component/manage-list/index.tsx

@@ -154,8 +154,8 @@ export default defineComponent({
       >
         <Sticky position="top" offsetTop={props.height} style={{ width: '100%' }}>
           <OSearch
-            inputBackground="white"
-            background="#F8F8F8"
+            // inputBackground="white"
+            // background="#F8F8F8"
             placeholder="伴学指导名称/手机号"
             onSearch={(val: any) => {
               forms.params.keyword = val
@@ -170,6 +170,9 @@ export default defineComponent({
             finished={forms.listState.finished}
             finishedText=" "
             onLoad={getList}
+            style={{
+              paddingTop: '12px'
+            }}
             immediateCheck={false}
           >
             <CheckboxGroup class={[styles.gridContainer, styles.gridClass]} v-model={forms.check}>

src/school/mass-message/component/student-list/index.tsx

@@ -142,8 +142,8 @@ export default defineComponent({
       >
         <Sticky position="top" offsetTop={props.height} style={{ width: '100%' }}>
           <OSearch
-            inputBackground="white"
-            background="#F8F8F8"
+            // inputBackground="white"
+            // background="#F8F8F8"
             placeholder="学员名称/手机号"
             onSearch={(val: any) => {
               forms.params.keyword = val
@@ -158,6 +158,9 @@ export default defineComponent({
             finished={forms.listState.finished}
             finishedText=" "
             onLoad={getList}
+            style={{
+              paddingTop: '12px'
+            }}
             immediateCheck={false}
           >
             <CheckboxGroup class={[styles.gridContainer, styles.gridClass]} v-model={forms.check}>

src/school/mass-message/component/teacher-list/teacher-list.tsx

@@ -155,8 +155,8 @@ export default defineComponent({
       >
         <Sticky position="top" offsetTop={props.height} style={{ width: '100%' }}>
           <OSearch
-            inputBackground="white"
-            background="#F8F8F8"
+            // inputBackground="white"
+            // background="#F8F8F8"
             placeholder="伴学名称/手机号"
             onSearch={(val: any) => {
               forms.params.keyword = val
@@ -170,6 +170,9 @@ export default defineComponent({
             // v-model:loading={forms.listState.loading}
             finished={forms.listState.finished}
             finishedText=" "
+            style={{
+              paddingTop: '12px'
+            }}
             onLoad={getList}
             immediateCheck={false}
           >

src/school/mass-message/list.tsx

@@ -95,8 +95,8 @@ export default defineComponent({
         {/* var(--van-tab-line-height) */}
 
         <OSearch
-          background="#f6f8f9"
-          inputBackground="white"
+          // background="#f6f8f9"
+          // inputBackground="white"
           placeholder="请输入群聊/学员名称/伴学指导名称"
           onSearch={(val: string) => {
             state.params.keyword = val
@@ -127,6 +127,9 @@ export default defineComponent({
                 finishedText=" "
                 class={[styles.liveList]}
                 onLoad={getList}
+                style={{
+                  paddingTop: '12px'
+                }}
                 immediateCheck={false}
               >
                 {state.list.map((item: any) => (

src/school/orchestra/index.tsx

@@ -139,7 +139,7 @@ export default defineComponent({
           <div class="searchGroup-single">
             <span
               onClick={() => (form.showPopover = true)}
-              class={['searchItem', form.showPopover ? 'searchItem--active' : '']}
+              class={['searchItem', form.showPopover ? 'searchItem-active' : '']}
             >
               {formatType(form.params.type)}
             </span>

src/school/orchestra/modal/teacher-list.tsx

@@ -138,8 +138,8 @@ export default defineComponent({
         <OSticky position="top" mode={props.mode}>
           {props.header && <OHeader title="选择伴学指导" />}
           <OSearch
-            inputBackground="white"
-            background="#F8F8F8"
+            // inputBackground="white"
+            // background="#F8F8F8"
             placeholder="伴学指导名称"
             onSearch={(val: any) => {
               forms.params.keyword = val
@@ -154,6 +154,9 @@ export default defineComponent({
             finished={forms.listState.finished}
             finishedText=" "
             onLoad={getList}
+            style={{
+              paddingTop: '12px'
+            }}
             immediateCheck={false}
           >
             {forms.list.map((item: any) => (

src/school/practice-rewards/detail.tsx

@@ -158,7 +158,7 @@ export default defineComponent({
 
         <div class={'searchGroup-single'} style="padding-top: 0;">
           <div
-            class={['searchItem', state.subjectStatus && styles['searchItem--active']]}
+            class={['searchItem', state.subjectStatus && styles['searchItem-active']]}
             onClick={() => {
               state.subjectStatus = !state.subjectStatus
             }}

src/school/train-planning/modal/practice-class/index.tsx

@@ -172,7 +172,7 @@ export default defineComponent({
           {!props.orchestraId && (
             <div class="searchGroup-single">
               <div
-                class={['searchItem', forms.showPopover && 'searchItem--active']}
+                class={['searchItem', forms.showPopover && 'searchItem-active']}
                 onClick={() => (forms.showPopover = true)}
               >
                 <span>{forms.orchestraName}</span>

src/student/trade-record/component/paid-list.tsx

@@ -1,5 +1,6 @@
 import dayjs from 'dayjs'
 import {
+  ActionSheet,
   Button,
   Cell,
   CellGroup,
@@ -44,7 +45,7 @@ export default defineComponent({
       currentData: [dayjs().year() + ''],
       typeShow: false,
       currentType: 'ALL',
-      typeArray: [{ text: '全部', value: 'ALL' }] as any,
+      typeArray: [{ name: '全部', value: 'ALL' }] as any,
       resionList: [] as any,
       list: [] as any,
       listState: {
@@ -122,7 +123,7 @@ export default defineComponent({
           select = item
         }
       })
-      return select.text
+      return select.name
     }
 
     const onDetails = (item: any) => {
@@ -140,30 +141,33 @@ export default defineComponent({
 
       Object.keys(orderType).forEach((key) => {
         form.typeArray.push({
-          text: orderType[key],
+          name: orderType[key],
           value: key
         })
       })
     })
     return () => (
       <div>
-        <div class={styles.searchGroup}>
-          <div class={styles.searchBand} onClick={() => (form.timeShow = true)}>
-            {form.currentData[0]}年 <Icon name={form.timeShow ? 'arrow-up' : 'arrow-down'} />
+        <div class={'searchGroup'}>
+          <div
+            class={['searchItem', form.timeShow && 'searchItem-active']}
+            onClick={() => (form.timeShow = true)}
+          >
+            <span>{form.currentData[0]}年</span>
+            <i class="arrow"></i>
           </div>
           <div
-            class={styles.searchBand}
+            class={['searchItem', form.typeShow && 'searchItem-active']}
             onClick={() => (form.typeShow = true)}
-            style="margin-left: 16px"
           >
-            {formatOrderType(form.currentType)}
-            <Icon name={form.typeShow ? 'arrow-up' : 'arrow-down'} />
+            <span>{formatOrderType(form.currentType)}</span>
+            <i class="arrow"></i>
           </div>
         </div>
 
         <div
           style={{
-            height: 'calc(100vh -  var(--van-tabs-line-height) - 1.12rem)',
+            height: 'calc(100vh -  var(--van-tabs-line-height) - 1.17333rem)',
             overflow: 'hidden',
             overflowY: 'auto'
           }}
@@ -173,7 +177,7 @@ export default defineComponent({
               v-model:modelValue={form.listState.refreshing}
               onRefresh={() => onSearch(true)}
               style={{
-                minHeight: 'calc(100vh -  var(--van-tabs-line-height) - 1.12rem)'
+                minHeight: 'calc(100vh -  var(--van-tabs-line-height) - 1.17333rem)'
               }}
             >
               <List
@@ -182,6 +186,7 @@ export default defineComponent({
                 finishedText=" "
                 class={[styles.liveList]}
                 onLoad={getList}
+                style={{ paddingTop: '12px' }}
                 immediateCheck={false}
               >
                 {form.list.map((item: any) => (
@@ -250,23 +255,17 @@ export default defineComponent({
           />
         </Popup>
 
-        <Popup
+        <ActionSheet
           v-model:show={form.typeShow}
-          position="bottom"
-          round
+          actions={form.typeArray}
           teleport={'body'}
-          class={'popupBottomSearch'}
-        >
-          <Picker
-            columns={form.typeArray}
-            onCancel={() => (form.typeShow = false)}
-            onConfirm={(val: any) => {
-              form.currentType = val.selectedValues[0]
-              form.typeShow = false
-              onSearch()
-            }}
-          />
-        </Popup>
+          cancelText="取消"
+          onSelect={(val: any) => {
+            form.currentType = val.value
+            form.typeShow = false
+            onSearch()
+          }}
+        />
       </div>
     )
   }

src/student/trade-record/component/refund-list.tsx

@@ -1,5 +1,17 @@
 import dayjs from 'dayjs'
-import { Button, Cell, CellGroup, DatePicker, Icon, Image, List, Picker, Popup, Sticky } from 'vant'
+import {
+  ActionSheet,
+  Button,
+  Cell,
+  CellGroup,
+  DatePicker,
+  Icon,
+  Image,
+  List,
+  Picker,
+  Popup,
+  Sticky
+} from 'vant'
 import { defineComponent, onMounted, reactive } from 'vue'
 import styles from '../index.module.less'
 import iconOrder from '../images/icon_order.png'
@@ -26,7 +38,7 @@ export default defineComponent({
       currentData: [dayjs().year() + ''],
       typeShow: false,
       currentType: 'ALL',
-      typeArray: [{ text: '全部', value: 'ALL' }] as any,
+      typeArray: [{ name: '全部', value: 'ALL' }] as any,
       list: [] as any,
       listState: {
         dataShow: true, // 判断是否有数据
@@ -90,7 +102,7 @@ export default defineComponent({
           select = item
         }
       })
-      return select.text
+      return select.name
     }
     const onDetails = (item: any) => {
       router.push({
@@ -106,14 +118,14 @@ export default defineComponent({
 
       Object.keys(orderType).forEach((key) => {
         form.typeArray.push({
-          text: orderType[key],
+          name: orderType[key],
           value: key
         })
       })
     })
     return () => (
       <div>
-        <div class={styles.searchGroup}>
+        {/* <div class={styles.searchGroup}>
           <div class={styles.searchBand} onClick={() => (form.timeShow = true)}>
             {form.currentData[0]}年 <Icon name={form.timeShow ? 'arrow-up' : 'arrow-down'} />
           </div>
@@ -125,11 +137,27 @@ export default defineComponent({
             {formatOrderType(form.currentType)}
             <Icon name={form.typeShow ? 'arrow-up' : 'arrow-down'} />
           </div>
+        </div> */}
+        <div class={'searchGroup'}>
+          <div
+            class={['searchItem', form.timeShow && 'searchItem-active']}
+            onClick={() => (form.timeShow = true)}
+          >
+            <span>{form.currentData[0]}年</span>
+            <i class="arrow"></i>
+          </div>
+          <div
+            class={['searchItem', form.typeShow && 'searchItem-active']}
+            onClick={() => (form.typeShow = true)}
+          >
+            <span>{formatOrderType(form.currentType)}</span>
+            <i class="arrow"></i>
+          </div>
         </div>
 
         <div
           style={{
-            height: 'calc(100vh -  var(--van-tabs-line-height) - 1.12rem)',
+            height: 'calc(100vh -  var(--van-tabs-line-height) - 1.17333rem)',
             overflow: 'hidden',
             overflowY: 'auto'
           }}
@@ -139,7 +167,7 @@ export default defineComponent({
               v-model:modelValue={form.listState.refreshing}
               onRefresh={() => onSearch(true)}
               style={{
-                minHeight: 'calc(100vh -  var(--van-tabs-line-height) - 1.12rem)'
+                minHeight: 'calc(100vh -  var(--van-tabs-line-height) - 1.17333rem)'
               }}
             >
               <List
@@ -198,23 +226,17 @@ export default defineComponent({
           />
         </Popup>
 
-        <Popup
+        <ActionSheet
           v-model:show={form.typeShow}
-          position="bottom"
-          round
+          actions={form.typeArray}
+          cancelText="取消"
           teleport={'body'}
-          class={'popupBottomSearch'}
-        >
-          <Picker
-            columns={form.typeArray}
-            onCancel={() => (form.typeShow = false)}
-            onConfirm={(val: any) => {
-              form.currentType = val.selectedValues[0]
-              form.typeShow = false
-              onSearch()
-            }}
-          />
-        </Popup>
+          onSelect={(val: any) => {
+            form.currentType = val.value
+            form.typeShow = false
+            onSearch()
+          }}
+        />
       </div>
     )
   }

src/student/trade-record/component/wait-pay.tsx

@@ -1,5 +1,6 @@
 import dayjs from 'dayjs'
 import {
+  ActionSheet,
   Button,
   Cell,
   CellGroup,
@@ -38,7 +39,7 @@ export default defineComponent({
       currentData: [dayjs().year() + ''],
       typeShow: false,
       currentType: 'ALL',
-      typeArray: [{ text: '全部', value: 'ALL' }] as any,
+      typeArray: [{ name: '全部', value: 'ALL' }] as any,
       list: [] as any,
       listState: {
         dataShow: true, // 判断是否有数据
@@ -102,7 +103,7 @@ export default defineComponent({
           select = item
         }
       })
-      return select.text
+      return select.name
     }
 
     const onCancelOrder = async (item: any) => {
@@ -159,14 +160,14 @@ export default defineComponent({
 
       Object.keys(orderType).forEach((key) => {
         form.typeArray.push({
-          text: orderType[key],
+          name: orderType[key],
           value: key
         })
       })
     })
     return () => (
       <div>
-        <div class={styles.searchGroup}>
+        {/* <div class={styles.searchGroup}>
           <div class={styles.searchBand} onClick={() => (form.timeShow = true)}>
             {form.currentData[0]}年 <Icon name={form.timeShow ? 'arrow-up' : 'arrow-down'} />
           </div>
@@ -178,11 +179,27 @@ export default defineComponent({
             {formatOrderType(form.currentType)}
             <Icon name={form.typeShow ? 'arrow-up' : 'arrow-down'} />
           </div>
+        </div> */}
+        <div class={'searchGroup'}>
+          <div
+            class={['searchItem', form.timeShow && 'searchItem-active']}
+            onClick={() => (form.timeShow = true)}
+          >
+            <span>{form.currentData[0]}年</span>
+            <i class="arrow"></i>
+          </div>
+          <div
+            class={['searchItem', form.typeShow && 'searchItem-active']}
+            onClick={() => (form.typeShow = true)}
+          >
+            <span>{formatOrderType(form.currentType)}</span>
+            <i class="arrow"></i>
+          </div>
         </div>
 
         <div
           style={{
-            height: 'calc(100vh -  var(--van-tabs-line-height) - 1.12rem)',
+            height: 'calc(100vh -  var(--van-tabs-line-height) - 1.17333rem)',
             overflow: 'hidden',
             overflowY: 'auto'
           }}
@@ -192,7 +209,7 @@ export default defineComponent({
               v-model:modelValue={form.listState.refreshing}
               onRefresh={() => onSearch(false)}
               style={{
-                minHeight: 'calc(100vh -  var(--van-tabs-line-height) - 1.12rem)'
+                minHeight: 'calc(100vh -  var(--van-tabs-line-height) - 1.17333rem)'
               }}
             >
               <List
@@ -285,23 +302,17 @@ export default defineComponent({
           />
         </Popup>
 
-        <Popup
+        <ActionSheet
           v-model:show={form.typeShow}
-          position="bottom"
-          round
+          actions={form.typeArray}
+          cancelText="取消"
           teleport={'body'}
-          class={'popupBottomSearch'}
-        >
-          <Picker
-            columns={form.typeArray}
-            onCancel={() => (form.typeShow = false)}
-            onConfirm={(val: any) => {
-              form.currentType = val.selectedValues[0]
-              form.typeShow = false
-              onSearch()
-            }}
-          />
-        </Popup>
+          onSelect={(val: any) => {
+            form.currentType = val.value
+            form.typeShow = false
+            onSearch()
+          }}
+        />
       </div>
     )
   }

src/styles/index.less

@@ -390,7 +390,7 @@ input {
       }
     }
     span {
-      max-width: 70px;
+      max-width: 80px;
       white-space: nowrap;
       overflow: hidden;
       text-overflow: ellipsis;
@@ -445,7 +445,7 @@ input {
       content: '';
     }
 
-    &.searchItem--active {
+    &.searchItem-active {
       color: var(--van-primary-color);
 
       &::after {
@@ -490,7 +490,7 @@ input {
     text-overflow: ellipsis;
   }
 
-  &.searchItem--active {
+  &.searchItem-active {
     color: var(--van-primary-color);
 
     &::after {

src/teacher/attendance/index.tsx

@@ -163,42 +163,43 @@ export default defineComponent({
     }
     return () => (
       <div class={!showContact.value && 'emptyRootContainer'}>
-        <OSticky position="top">
+        <OSticky
+          position="top"
+          onGetHeight={(height: any) => {
+            document.documentElement.style.setProperty('--header-height', height + 'px')
+          }}
+        >
           <OHeader />
-          <div class={styles.chioseWrap}>
-            <div style={{ padding: '12px 13px', background: '#F8F8F8' }}>
-              <div
-                class={styles.searchBand}
-                onClick={() => {
-                  state.showPopoverTime = true
-                }}
-              >
-                {forms.timeName}
-                <Icon name={state.showPopoverTime ? 'arrow-up' : 'arrow-down'} />
-              </div>
+          <div class={'searchGroup'}>
+            <div
+              class={[
+                'searchItem searchItem-normal',
+                state.showPopoverTime ? 'searchItem-active' : ''
+              ]}
+              onClick={() => {
+                state.showPopoverTime = true
+              }}
+            >
+              <span>{forms.timeName}</span>
+              <i class="arrow"></i>
             </div>
-
-            <div style={{ padding: '12px 13px', background: '#F8F8F8' }}>
-              <div
-                class={[styles.searchBand, styles.orchestraBand]}
-                onClick={() => {
-                  state.showPopoverOrchestra = true
-                }}
-              >
-                <p class={['van-ellipsis', styles.bandName]}>{forms.orchestraName}</p>
-                <Icon name={state.showPopoverOrchestra ? 'arrow-up' : 'arrow-down'} />
-              </div>
+            <div
+              class={['searchItem', state.showPopoverOrchestra ? 'searchItem-active' : '']}
+              onClick={() => {
+                state.showPopoverOrchestra = true
+              }}
+            >
+              <span>{forms.orchestraName}</span>
+              <i class="arrow"></i>
             </div>
-            <div style={{ padding: '12px 13px', background: '#F8F8F8' }}>
-              <div
-                class={[styles.searchBand, styles.orchestraBand]}
-                onClick={() => {
-                  state.showPopoverSubject = true
-                }}
-              >
-                <p>{forms.courseTypeName}</p>
-                <Icon name={state.showPopoverSubject ? 'arrow-up' : 'arrow-down'} />
-              </div>
+            <div
+              class={['searchItem', state.showPopoverSubject ? 'searchItem-active' : '']}
+              onClick={() => {
+                state.showPopoverSubject = true
+              }}
+            >
+              <span>{forms.courseTypeName}</span>
+              <i class="arrow"></i>
             </div>
           </div>
         </OSticky>
@@ -207,13 +208,16 @@ export default defineComponent({
           <OFullRefresh
             v-model:modelValue={refreshing.value}
             onRefresh={onRefresh}
-            style="min-height: 100vh;"
+            style="min-height: calc(100vh - var(--header-height));"
           >
             <List
               loading-text=" "
               // v-model:loading={loading.value}
               finished={finished.value}
               finished-text="没有更多了"
+              style={{
+                paddingTop: '12px'
+              }}
               onLoad={getList}
             >
               {list.value.map((item: any) => (

src/views/exercise-record/exercis-detail.tsx

@@ -215,8 +215,18 @@ export default defineComponent({
                 </div>
               </div>
             </div>
-            <div class={styles.chioseWrap}>
-              <div style={{ padding: '12px 13px', background: 'transparent' }}>
+            <div class={'searchGroup-single'}>
+              <div
+                class={['searchItem', state.showPopoverTime ? 'searchItem-active' : '']}
+                onClick={() => {
+                  state.showPopoverTime = true
+                }}
+              >
+                <span>{forms.practiceMonthName}</span>
+              </div>
+            </div>
+            {/* <div class={styles.chioseWrap}> */}
+            {/* <div style={{ padding: '12px 13px', background: 'transparent' }}>
                 <div
                   class={styles.searchBand}
                   onClick={() => {
@@ -226,9 +236,9 @@ export default defineComponent({
                   {forms.practiceMonthName}
                   <Icon name={state.showPopoverTime ? 'arrow-up' : 'arrow-down'} />
                 </div>
-              </div>
+              </div> */}
 
-              {/* <div style={{ padding: '12px 13px', background: 'transparent' }}>
+            {/* <div style={{ padding: '12px 13px', background: 'transparent' }}>
                 <Popover
                   v-model:show={state.showPopoverOrchestra}
                   actions={state.actions}
@@ -246,7 +256,7 @@ export default defineComponent({
                   }}
                 </Popover>
               </div> */}
-            </div>
+            {/* </div> */}
           </div>
           {showContact.value ? (
             <OFullRefresh

src/views/exercise-record/index.tsx

@@ -39,12 +39,12 @@ export default defineComponent({
       subjects: [] as any,
       actionSorts: [
         {
-          text: '按天数',
+          name: '按天数',
           value: 'PRACTICE_DAY',
           color: '#f67146'
         },
         {
-          text: '按时长',
+          name: '按时长',
           value: 'PRACTICE_TIMES',
           color: '#333'
         }
@@ -116,7 +116,7 @@ export default defineComponent({
 
     const checkSort = (val: any) => {
       forms.sortType = val.value
-      forms.sortTypeName = val.text
+      forms.sortTypeName = val.name
       state.actionSorts.forEach((element) => {
         if (element.value == val.value) {
           element.color = '#f67146'
@@ -124,6 +124,7 @@ export default defineComponent({
           element.color = '#333'
         }
       })
+      state.showPopoverSort = false
       refreshing.value = true
       getList()
     }
@@ -207,75 +208,42 @@ export default defineComponent({
                 getList()
               }}
             ></OSearch>
-            <div class={styles.chioseWrap}>
+            <div class={'searchGroup'}>
               <div
-                class={styles.searchBandWrap}
-                style={{ padding: '12px 8px', background: '#F8F8F8' }}
+                class={['searchItem', state.showPopoverTime ? 'searchItem-active' : '']}
+                onClick={() => {
+                  state.showPopoverTime = true
+                }}
               >
-                <div
-                  class={styles.searchBand}
-                  onClick={() => {
-                    state.showPopoverTime = true
-                  }}
-                >
-                  <p>{forms.practiceMonthName}</p>
-
-                  <Icon name={state.showPopoverTime ? 'arrow-up' : 'arrow-down'} />
-                </div>
+                <span>{forms.practiceMonthName}</span>
+                <i class="arrow"></i>
               </div>
-
               <div
-                class={styles.searchBandWrap}
-                style={{ padding: '12px 8px', background: '#F8F8F8' }}
+                class={['searchItem', state.showPopoverOrchestra ? 'searchItem-active' : '']}
+                onClick={() => {
+                  state.showPopoverOrchestra = true
+                }}
               >
-                <div
-                  class={styles.searchBand}
-                  onClick={() => {
-                    state.showPopoverOrchestra = true
-                  }}
-                >
-                  <p> {forms.orchestraName}</p>
-
-                  <Icon name={state.showPopoverOrchestra ? 'arrow-up' : 'arrow-down'} />
-                </div>
+                <span>{forms.orchestraName}</span>
+                <i class="arrow"></i>
               </div>
               <div
-                class={styles.searchBandWrap}
-                style={{ padding: '12px 6px', background: '#F8F8F8' }}
+                class={['searchItem', state.showPopoverSubject ? 'searchItem-active' : '']}
+                onClick={() => {
+                  state.showPopoverSubject = true
+                }}
               >
-                <div
-                  class={styles.searchBand}
-                  onClick={() => {
-                    state.showPopoverSubject = true
-                  }}
-                >
-                  <p>{forms.subjectName}</p>
-
-                  <Icon name={state.showPopoverSubject ? 'arrow-up' : 'arrow-down'} />
-                </div>
+                <span>{forms.subjectName}</span>
+                <i class="arrow"></i>
               </div>
-
               <div
-                class={styles.searchBandWrap}
-                style={{ padding: '12px 6px', background: '#F8F8F8' }}
+                class={['searchItem', state.showPopoverSort ? 'searchItem-active' : '']}
+                onClick={() => {
+                  state.showPopoverSort = true
+                }}
               >
-                <Popover
-                  v-model:show={state.showPopoverSort}
-                  actions={state.actionSorts}
-                  showArrow={false}
-                  placement="bottom-end"
-                  offset={[0, 12]}
-                  onSelect={checkSort}
-                >
-                  {{
-                    reference: () => (
-                      <div class={styles.searchBand}>
-                        <p> {forms.sortTypeName}</p>
-                        <Icon name={state.showPopoverSort ? 'arrow-up' : 'arrow-down'} />
-                      </div>
-                    )
-                  }}
-                </Popover>
+                <span>{forms.sortTypeName}</span>
+                <i class="arrow"></i>
               </div>
             </div>
           </div>
@@ -290,6 +258,9 @@ export default defineComponent({
               loading-text=" "
               // v-model:loading={loading.value}
               finished={finished.value}
+              style={{
+                paddingTop: '12px'
+              }}
               finished-text="没有更多了"
               onLoad={getList}
             >
@@ -321,12 +292,12 @@ export default defineComponent({
           />
         </Popup>
 
-        {/* <ActionSheet
-          v-model:show={state.showPopoverOrchestra}
-          title="选择乐团"
-          actions={state.actions}
-          onSelect={checkOrchestra}
-        ></ActionSheet> */}
+        <ActionSheet
+          v-model:show={state.showPopoverSort}
+          actions={state.actionSorts}
+          onSelect={checkSort}
+          cancelText="取消"
+        ></ActionSheet>
         <Popup
           v-model:show={state.showPopoverOrchestra}
           position="bottom"

src/views/unit-test/index.tsx

@@ -185,8 +185,8 @@ export default defineComponent({
         >
           <OSearch
             placeholder="请输入测验名称"
-            inputBackground="white"
-            background="#f6f8f9"
+            // inputBackground="white"
+            // background="#f6f8f9"
             onSearch={(val: any) => {
               form.params.keyword = val
               onSearch()
@@ -222,6 +222,9 @@ export default defineComponent({
               finished={form.listState.finished}
               finishedText=" "
               class={[styles.liveList]}
+              style={{
+                paddingTop: '12px'
+              }}
               onLoad={getList}
               immediateCheck={false}
             >

src/views/unit-test/unit-list/index.tsx

@@ -123,8 +123,8 @@ export default defineComponent({
           </OHeader>
           <OSearch
             placeholder="请输入测验名称"
-            inputBackground="white"
-            background="#f6f8f9"
+            // inputBackground="white"
+            // background="#f6f8f9"
             onSearch={(val: any) => {
               form.params.keyword = val
               onSearch()
@@ -132,11 +132,10 @@ export default defineComponent({
             v-slots={{
               left: () => (
                 <div
-                  class={styles.searchBand}
-                  style={{ marginRight: '13px' }}
+                  class={['searchItem-left', form.oPopover ? 'searchItem-active' : '']}
                   onClick={() => (form.oPopover = true)}
                 >
-                  {form.statusText} <Icon name={form.oPopover ? 'arrow-up' : 'arrow-down'} />
+                  <span>{form.statusText} </span>
                 </div>
               )
             }}
@@ -155,6 +154,9 @@ export default defineComponent({
               finishedText=" "
               class={[styles.liveList]}
               onLoad={getList}
+              style={{
+                paddingTop: '12px'
+              }}
               immediateCheck={false}
             >
               {form.list.map((item: any) => (
@@ -171,7 +173,7 @@ export default defineComponent({
           cancelText="取消"
           actions={
             [
-              { name: '班级类型', id: 'ALL', color: 'red' },
+              { name: '班级类型', id: 'ALL' },
               { name: '单技班', id: 'SINGLE' },
               { name: '乐理班', id: 'MUSIC_THEORY' },
               { name: '合奏班', id: 'INSTRUMENTAL_ENSEMBLE' }