Merge branch '2023-3-21_CoursewareList-UI' into jenkins

src/views/lessonCourseware/index.tsx

@@ -8,7 +8,9 @@ import {
   Grid,
   GridItem,
   Icon,
+  Picker,
   Popover,
+  Popup,
   showToast,
   Toast
 } from 'vant'
@@ -33,7 +35,7 @@ export default defineComponent({
       actionShow: false,
       actionName: '课程类型' as string | undefined,
       actionKey: '',
-      showRight: route.query.code != 'select' && browser().isTeacher
+      showRight: true // route.query.code != 'select' && browser().isTeacher
     })
     const filterData = (list: any[]) => {
       const schoolTerm = {}
@@ -101,13 +103,23 @@ export default defineComponent({
     }
 
     const actions = computed(() => {
-      return Object.entries(courseEmnu).map(([key, value]) => {
+      const _list = Object.entries(courseEmnu).map(([key, value]) => {
         return {
           id: key,
           name: value,
+          text: value,
+          value: key,
           color: key === data.actionKey ? 'var(--van-primary)' : ''
-        } as ActionSheetAction
+        }
+      })
+      _list.unshift({
+        id: '',
+        name: '课程类型',
+        text: '全部',
+        value: '',
+        color: '' === data.actionKey ? 'var(--van-primary)' : ''
       })
+      return _list
     })
 
     const handleSelect = (action: any) => {
@@ -150,17 +162,16 @@ export default defineComponent({
           )
         })}
         {!data.loading && !Object.values(data.list).length && <OEmpty tips="没有课件" />}
-        <ActionSheet
-          v-model:show={data.actionShow}
-          cancelText="全部课程类型"
-          actions={actions.value}
-          onCancel={() => {
-            data.actionKey = ''
-            data.actionName = '课程类型'
-            getList()
-          }}
-          onSelect={handleSelect}
-        />
+        <Popup position="bottom" round v-model:show={data.actionShow}>
+          <Picker
+            class="popupBottomSearch"
+            columns={actions.value}
+            onCancel={() => (data.actionShow = false)}
+            onConfirm={({ selectedOptions }) => {
+              handleSelect(selectedOptions[0])
+            }}
+          />
+        </Popup>
       </div>
     )
   }