소스 검색

修改显示

lex-xin 2 달 전
부모
커밋
f52115afe7

BIN
src/components/o-empty/images/empty1.png


+ 1 - 1
src/components/o-empty/index.tsx

@@ -73,7 +73,7 @@ export default defineComponent({
           image = getAssetsHomeFile('notFond.png');
           break;
         default:
-          image = getAssetsHomeFile('empty.png');
+          image = getAssetsHomeFile('empty1.png');
           break;
       }
       return image;

+ 2 - 1
src/components/o-search/index.module.less

@@ -11,6 +11,7 @@
       -webkit-user-select: text !important;
       user-select: text !important;
       font-size: 13px;
+      font-weight: 400;
     }
 
     .van-search__field {
@@ -76,7 +77,7 @@
 
     :global {
       .van-button__text {
-        margin-top: 1px;
+        margin-top: 1.5px;
       }
     }
   }

BIN
src/views/courseList/image/icon-course.png


BIN
src/views/courseList/image/icon_search.png


+ 19 - 9
src/views/courseList/index.module.less

@@ -1,9 +1,11 @@
 .courseList {
   min-height: 100vh;
-  background-color: #fff;
-  background-image: linear-gradient(180deg, #7DEFE6 0%, rgba(251, 233, 213, 0) 198px);
+  background-color: #F8F8F8;;
+  background-image: linear-gradient(180deg, #7DEFE6 0%, rgba(248, 248, 248, 0) 315px);
   padding: 10px 0;
   box-sizing: border-box;
+  display: flex;
+  flex-direction: column;
 }
 
 .periodContent {
@@ -71,11 +73,18 @@
   }
 }
 
+.periodSection {
+  flex: 1;
+  background: #FFFFFF;
+  border-radius: 20px 20px 0px 0px;
+  min-height: 40vh;
+}
+
 .periodHeader {
   display: flex;
   align-items: center;
   justify-content: space-between;
-  padding: 20px 20px 0;
+  padding: 20px 20px 12px;
   .searchGroup {
     padding: 3px 10px 3px 7px;
     border-radius: 19px;
@@ -87,12 +96,13 @@
     align-items: center;
     cursor: pointer;
     .iconSearch {
-      width: 20px;
-      height: 20px;
-      /deep/.van-icon__image {
-        margin: auto;
-        vertical-align: middle;
-      }
+      // width: 20px;
+      margin-right: 5px;
+      height: 12px;
+      // /deep/.van-icon__image {
+      //   margin: auto;
+      //   vertical-align: middle;
+      // }
     }
   }
 }

+ 104 - 102
src/views/courseList/index.tsx

@@ -326,113 +326,115 @@ export default defineComponent({
           </div>
         </div>
 
-        <TransitionGroup name="van-fade">
-          {!data.loading && (
-            <>
-              <div class={styles.periodHeader}>
-                <div key="periodTitle" class={styles.periodTitle}>
-                  <img class={styles.pIcon} src={iconList} />
-                  <div class={styles.pTitle}>课程列表</div>
-                  <div class={styles.pNum}>共{data.list.length}课</div>
+        <div class={styles.periodSection}>
+          <TransitionGroup name="van-fade">
+            {!data.loading && (
+              <>
+                <div class={styles.periodHeader}>
+                  <div key="periodTitle" class={styles.periodTitle}>
+                    <img class={styles.pIcon} src={iconList} />
+                    <div class={styles.pTitle}>课程列表</div>
+                    <div class={styles.pNum}>共{data.list.length}课</div>
+                  </div>
+                  <div class={styles.searchGroup} onClick={() => {
+                    router.push({
+                      path: '/courseListSearch',
+                      query: {
+                        id: route.query.id
+                      }
+                    })
+                  }}>
+                    <img src={iconSearch} class={styles.iconSearch} />
+                    <span class={styles.searchContent}>搜索素材</span>
+                  </div>
                 </div>
-                <div class={styles.searchGroup} onClick={() => {
-                  router.push({
-                    path: '/courseListSearch',
-                    query: {
-                      id: route.query.id
-                    }
-                  })
-                }}>
-                  <img src={iconSearch} class={styles.iconSearch} />
-                  <span class={styles.searchContent}>搜索素材</span>
-                </div>
-              </div>
 
-              <div key="list" class={styles.periodList}>
-                <CellGroup inset>
-                  {data.list.map((item: any) => {
-                    return (
-                      <Cell
-                        border
-                        center
-                        title={item.coursewareDetailName}
-                        // label={
-                        //   !browserInfo.isStudent
-                        //     ? `已使用${item.useNum || 0}次`
-                        //     : ''
-                        // }
-                        onClick={() => handleClick(item)}>
-                        {{
-                          icon: () => (
-                            <div class={styles.periodItem}>
-                              <div class={styles.periodItemModel}>
-                                <img src={isLock.value ? iconCourseLock : iconCourse} />
-                                {item.hasCache ? (
-                                  <img
-                                    class={styles.iconCachePoint}
-                                    src={iconCachePoint}
-                                  />
+                <div key="list" class={styles.periodList}>
+                  <CellGroup inset>
+                    {data.list.map((item: any) => {
+                      return (
+                        <Cell
+                          border
+                          center
+                          title={item.coursewareDetailName}
+                          // label={
+                          //   !browserInfo.isStudent
+                          //     ? `已使用${item.useNum || 0}次`
+                          //     : ''
+                          // }
+                          onClick={() => handleClick(item)}>
+                          {{
+                            icon: () => (
+                              <div class={styles.periodItem}>
+                                <div class={styles.periodItemModel}>
+                                  <img src={isLock.value ? iconCourseLock : iconCourse} />
+                                  {item.hasCache ? (
+                                    <img
+                                      class={styles.iconCachePoint}
+                                      src={iconCachePoint}
+                                    />
+                                  ) : (
+                                    ''
+                                  )}
+                                  {item.downloadStatus === 1 && (
+                                    <div class={styles.downloading}>{`${
+                                      item.progress || 0
+                                    }%`}</div>
+                                  )}
+                                </div>
+                              </div>
+                            ),
+                            value: () => (
+                              <>
+                                {item.knowledgePointList ? (
+                                  <>
+                                    { isLock.value ? <Button
+                                        class={[
+                                          styles.baseBtn,
+                                          styles.look,
+                                          styles.disable
+                                        ]}>
+                                        未解锁
+                                      </Button> : item.hasCache ? (
+                                      <Button
+                                        class={[
+                                          styles.baseBtn,
+                                          styles.look
+                                        ]}>
+                                        查看
+                                      </Button>
+                                    ) : (
+                                      <Button
+                                        class={[
+                                          styles.baseBtn,
+                                          styles.down,
+                                          item.downloadStatus == 1
+                                            ? styles.downing
+                                            : ''
+                                        ]}>
+                                        {item.downloadStatus === 1
+                                          ? `取消下载`
+                                          : '查看'}
+                                      </Button>
+                                    )}
+                                  </>
                                 ) : (
                                   ''
                                 )}
-                                {item.downloadStatus === 1 && (
-                                  <div class={styles.downloading}>{`${
-                                    item.progress || 0
-                                  }%`}</div>
-                                )}
-                              </div>
-                            </div>
-                          ),
-                          value: () => (
-                            <>
-                              {item.knowledgePointList ? (
-                                <>
-                                  { isLock.value ? <Button
-                                      class={[
-                                        styles.baseBtn,
-                                        styles.look,
-                                        styles.disable
-                                      ]}>
-                                      未解锁
-                                    </Button> : item.hasCache ? (
-                                    <Button
-                                      class={[
-                                        styles.baseBtn,
-                                        styles.look
-                                      ]}>
-                                      查看
-                                    </Button>
-                                  ) : (
-                                    <Button
-                                      class={[
-                                        styles.baseBtn,
-                                        styles.down,
-                                        item.downloadStatus == 1
-                                          ? styles.downing
-                                          : ''
-                                      ]}>
-                                      {item.downloadStatus === 1
-                                        ? `取消下载`
-                                        : '查看'}
-                                    </Button>
-                                  )}
-                                </>
-                              ) : (
-                                ''
-                              )}
-                            </>
-                          )
-                        }}
-                      </Cell>
-                    );
-                  })}
-                </CellGroup>
-              </div>
-            </>
-          )}
-        </TransitionGroup>
-        {data.loading && <OLoading />}
-        {!data.loading && !data.list.length && <OEmpty tips="暂无内容" />}
+                              </>
+                            )
+                          }}
+                        </Cell>
+                      );
+                    })}
+                  </CellGroup>
+                </div>
+              </>
+            )}
+          </TransitionGroup>
+          {data.loading && <OLoading />}
+          {!data.loading && !data.list.length && <OEmpty tips="暂无内容" />}
+        </div>
 
         {isLock.value && (
           <OSticky position="bottom">

+ 3 - 1
src/views/courseListSearch/child-node.tsx

@@ -86,6 +86,8 @@ const ChildNode = defineComponent({
       const search: any = props.search
       return name.replace(search, `<span style="color: #01C1B5;">${search}</span>`)
     }
+
+    console.log(props.collapse, "collapse")
     return () => (
       <Collapse
         modelValue={props.collapse}
@@ -115,7 +117,7 @@ const ChildNode = defineComponent({
                 <>
                   {Array.isArray(point?.materialList) &&
                     point.materialList.map((n: any) => (
-                      <Cell center isLink clickable={false} onClick={() => toDetail(n)}>
+                      <Cell center isLink border={false} clickable={false} onClick={() => toDetail(n)}>
                         {{
                           title: () => <div class={styles.materialSection}>
                             <img src={getImage(n)} class={styles.iconMaterial} />

+ 3 - 0
src/views/courseListSearch/index.module.less

@@ -30,6 +30,9 @@
   :global {
     .parentCollapse__item {
       margin: 0 14px 12px;
+      &::after {
+        display: none;
+      }
   
       & >  .van-collapse-item__wrapper {
         margin: 0 14px 12px;

+ 78 - 2
src/views/courseListSearch/index.tsx

@@ -51,6 +51,72 @@ export default defineComponent({
       });
       return tempList;
     };
+
+    const formatSelectFirstChild = (list: any = []) => {
+      for(let i = 0; i < list.length; i++) {
+        if(Array.isArray(list[i].materialList) && list[i].materialList.length > 0) {
+          const materialItem = list[i].materialList[0] || {}
+          if(materialItem) {
+            // materialItem.collapse = materialItem.id
+            // status = true
+            return materialItem
+          }
+        } else {
+          return formatSelectFirstChild(list[i].children || [])
+        }
+      }
+      // list.forEach((item: any) => {
+      //   if(Array.isArray(item.materialList) && item.materialList.length > 0) {
+
+      //   }
+      // })
+    }
+
+    // 
+    function selectFirstChild(pointList: any[], ids: any[]): any[] {
+      return pointList.map(point => {
+        if (point.children) {
+            
+            let id = ''
+            point.children.map((item: any) => {
+              if(!id) {
+                id = ids.includes(item.id) ? item.id : ''
+              }
+              
+            })
+              point.collapse = id
+           return Object.assign(point, {
+              children: selectFirstChild(point.children, ids)
+           })
+        } else {
+           return Object.assign(point, {
+              materialList: point.materialList
+           })
+        }
+     })
+    }
+
+    function filterPointList(pointList: any[], parentData?: { ids: string[]; name: string }): any[] {
+      // 设置父级及以上id数组和父级name
+      return pointList.map(point => {
+         if (point.children) {
+            return Object.assign(point, {
+               children: filterPointList(point.children, { ids: [...(parentData?.ids || []), point.id], name: point.name })
+            })
+         } else {
+            return Object.assign(point, {
+               materialList: point.materialList.map((item: any) => {
+                  item.parentData = {
+                     ids: [...(parentData?.ids || []), point.id],
+                     name: point.name
+                  }
+                  return item
+               })
+            })
+         }
+      })
+   }
+
     /** 获取课件详情 */
     const getDetail = async () => {
       const res: any = await request.get(
@@ -85,10 +151,19 @@ export default defineComponent({
             item.name = item.coursewareDetailName;
             formatDataList(item.children);
           });
+          const firstItem = formatSelectFirstChild(res.data)
+          let list = filterPointList(res.data)
+          list = selectFirstChild(list, firstItem.parentData?.ids || [])
+          data.list = list;
 
-          data.list = res.data;
+          console.log(list, 'list')
+          
+          list.forEach((item: any) => {
+            if(item.id === firstItem.parentData?.ids[0]) {
+              data.parentCollapse = item.id
+            }
+          })
 
-          data.parentCollapse = data.list[0].id
         }
       } catch (error) {
         //
@@ -150,6 +225,7 @@ export default defineComponent({
               {data.list.map((item: any) => (
                 <CollapseItem
                   center
+                  border={true}
                   name={item.coursewareDetailId}
                   clickable={false}
                   class={['parentCollapse__item']}>

+ 11 - 1
src/views/coursewarePlay/component/point.module.less

@@ -32,7 +32,7 @@
       padding-right: 20px;
 
       input {
-        color: rgba(255,255,255,0.9);
+        color: rgba(255,255,255, 1);
       }
     }
   }
@@ -42,6 +42,16 @@
   flex: 1;
   overflow-y: auto;
   padding: 0 20px;
+
+  .lading {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    font-size: 14px;
+    .loadingText {
+      padding-left: 8px;
+    }
+  }
 }
 
 .collapse {

+ 7 - 3
src/views/coursewarePlay/component/points-search.tsx

@@ -9,10 +9,10 @@ import {
   iconSong,
   iconSongActive
 } from '../image/icons.json';
-import { Collapse, CollapseItem, Icon, Image } from 'vant';
+import { Collapse, CollapseItem, Image, Loading } from 'vant';
 import PlayLoading from './play-loading';
 import OSearch from '@/components/o-search';
-import OLoading from '@/components/o-loading';
+// import OLoading from '@/components/o-loading';
 import OEmpty from '@/components/o-empty';
 export default defineComponent({
   name: 'points-list',
@@ -90,7 +90,11 @@ export default defineComponent({
           }} />
         </div>
         <div class={styles.content}>
-          {props.loading && <OLoading />}
+        {props.loading && <div class={styles.lading}>
+            <Loading size={24} color='#fff' /> <span class={styles.loadingText}>加载中...</span>
+          </div>}
+          
+          {/* {props.loading && <OLoading />} */}
           {!props.loading && !props.data.length && <OEmpty tips="暂无搜索结果" />}
           <Collapse
             class={styles.collapse}

+ 8 - 0
src/views/coursewarePlay/index.tsx

@@ -689,6 +689,14 @@ export default defineComponent({
     }
 
     onMounted(async () => {
+      // 键盘唤起  0是顶起 1是覆盖 
+      postMessage({
+        api: 'setSoftInputMode',
+        content: {
+          type: 1
+        }
+      });
+
       isHidden.value = true;
       await sysParamConfig();
       if(data.source === 'search') {

+ 1 - 1
vite.config.ts

@@ -14,7 +14,7 @@ function resolve(dir: string) {
 }
 // https://vitejs.dev/config/
 // https://github.com/vitejs/vite/issues/1930 .env
-const proxyUrl = 'https://dev.gym.lexiaoya.cn';
+const proxyUrl = 'https://test.gym.lexiaoya.cn';
 export default defineConfig({
   base: './',
   plugins: [