修改转场效果

src/router/routes-school.ts

@@ -374,6 +374,22 @@ export default [
           title: '创建相册'
         }
       },
+      {
+        path: '/practice-rewards',
+        name: 'practice-rewards',
+        component: () => import('@/school/practice-rewards/index'),
+        meta: {
+          title: '练习奖励'
+        }
+      },
+      {
+        path: '/practice-detail',
+        name: 'practice-detail',
+        component: () => import('@/school/practice-rewards/detail'),
+        meta: {
+          title: '练习奖励详情'
+        }
+      },
 
       //
     ]

src/school/approval-manage/agency/index.tsx

@@ -138,7 +138,7 @@ export default defineComponent({
                           )
                         }}
                       </Cell>
-                      <Grid class={styles.grid} columnNum={3} border={false}>
+                      <Grid class={styles.grid} columnNum={2} border={false}>
                         <GridItem>
                           <div class={styles.gridItem}>
                             <div class={styles.gridItemTop}>
@@ -155,14 +155,14 @@ export default defineComponent({
                             <div>训练补助</div>
                           </div>
                         </GridItem>
-                        <GridItem>
+                        {/* <GridItem>
                           <div class={styles.gridItem}>
                             <div class={styles.gridItemTop}>
                               <span class={styles.topNum}>{item.trainingSalary}</span>元
                             </div>
                             <div>练习奖励</div>
                           </div>
-                        </GridItem>
+                        </GridItem> */}
                       </Grid>
                     </div>
                   )
@@ -176,7 +176,7 @@ export default defineComponent({
                 class={styles.item}
                 onClick={() => {
                   router.push({
-                    path: '/my-orchestra'
+                    path: '/school-photo'
                   })
                 }}
               >

src/school/approval-manage/index.module.less

@@ -55,7 +55,7 @@
       right: 0;
     }
     .van-cell__label {
-      font-size: 13px;
+      font-size: 14px;
       color: #777;
       white-space: nowrap;
     }
@@ -119,7 +119,7 @@
   font-family: PingFangSC-Regular, PingFang SC;
   font-weight: 400;
   color: #333;
-  line-height: 22px;
+  line-height: 24px;
   padding: 0 25px 25px 25px;
 }
 .listItem {
@@ -139,6 +139,10 @@
       }
     }
   }
+
+  .valueColor {
+    color: #f44541 !important;
+  }
 }
 .grid {
   :global {
@@ -159,6 +163,9 @@
     font-size: 22px;
     margin-right: 2px;
   }
+  & + .gridItem {
+    margin-left: 26px;
+  }
 }
 .itemContent {
   padding: 15px 12px;
@@ -175,9 +182,10 @@
     font-size: 14px;
   }
   .itemContentLabel {
-    font-size: 12px;
+    font-size: 14px;
     color: #777;
     line-height: 20px;
+    padding-bottom: 6px;
   }
 }
 

src/school/approval-manage/index.tsx

@@ -17,7 +17,7 @@ export default defineComponent({
   setup() {
     const router = useRouter()
     const headerHeight = ref(0)
-    
+
     return () => (
       <div>
         <OSticky
@@ -35,14 +35,24 @@ export default defineComponent({
           sticky
           offsetTop={headerHeight.value}
           swipeable
-          titleActiveColor='var(--van-primary)'
+          titleActiveColor="var(--van-primary)"
         >
           {state.user?.data?.manageAdmin && (
-            <Tab name="wait" title={`处理事项${approvalManageStrips.agencty ? " (" + approvalManageStrips.agencty +")" : ''}`}>
+            <Tab
+              name="wait"
+              title={`处理事项${
+                approvalManageStrips.agencty ? ' (' + approvalManageStrips.agencty + ')' : ''
+              }`}
+            >
               <Agency />
             </Tab>
           )}
-          <Tab name="end" title={`我的审批${approvalManageStrips.approval ? " (" + approvalManageStrips.approval +")" : ''}`}>
+          <Tab
+            name="end"
+            title={`我的审批${
+              approvalManageStrips.approval ? ' (' + approvalManageStrips.approval + ')' : ''
+            }`}
+          >
             <MyApproval />
           </Tab>
         </Tabs>

src/school/approval-manage/subsidy/details.tsx

@@ -17,6 +17,7 @@ export default defineComponent({
   name: 'subsidy-detail',
   setup() {
     const record: ICourseSalaryRecordDetailItem = courseSalaryRecordDetailItem.value! || ''
+    console.log(record)
     if (Array.isArray(record?.courseScheduleTeacherAttendanceList)) {
       record.courseScheduleTeacherAttendanceList.forEach((n: any) => {
         n.times =
@@ -53,10 +54,18 @@ export default defineComponent({
                 border={false}
                 center
                 class={styles.listItem}
+                valueClass={styles.valueColor}
                 title="课件使用未达标"
                 value={`-${record.reduceSalary}元`}
               />
-              <Cell border={false} center class={styles.listItem} title="早退" value={`-0.00元`} />
+              <Cell
+                border={false}
+                center
+                class={styles.listItem}
+                valueClass={styles.valueColor}
+                title="早退"
+                value={`-0.00元`}
+              />
               <Cell
                 border={false}
                 center
@@ -86,9 +95,15 @@ export default defineComponent({
                       </span>
                       <span
                         class={styles.itemContentTitleDetail}
-                        style={{ color: 1 ? '#358AF5' : '#F44541' }}
+                        style={{
+                          color:
+                            item.coursewarePlayTime >= item.adviseStudyTimeSecond
+                              ? '#358AF5'
+                              : '#F44541'
+                        }}
                       >
-                        课件使用：{getSecondRPM(item.coursewarePlayTime)}/{getSecondRPM(item.adviseStudyTimeSecond)}分钟
+                        课件使用：{getSecondRPM(item.coursewarePlayTime)}/
+                        {getSecondRPM(item.adviseStudyTimeSecond)}分钟
                       </span>
                     </div>
                     <div class={styles.itemContentLabel}>{item.orchestraName}</div>

src/school/approval-manage/subsidy/exercise-detail.tsx

@@ -1,7 +1,7 @@
 import { Cell, Grid, GridItem, NavBar, Popup, Sticky } from 'vant'
 import { defineComponent, onMounted, reactive, ref } from 'vue'
 import styles from '../index.module.less'
-import iconA from '../images/icon-photo.png'
+import iconTeacher from '@/common/images/icon_teacher.png'
 import { useRoute, useRouter } from 'vue-router'
 import request from '@/helpers/request'
 import { state } from '@/state'
@@ -66,19 +66,32 @@ export default defineComponent({
             <div class={styles.item}>
               <Cell center class={styles.rewardItem}>
                 {{
-                  icon: () => <img class={styles.itemPicture} src={data.record.avatar || iconA} />,
+                  icon: () => (
+                    <img class={styles.itemPicture} src={data.record.avatar || iconTeacher} />
+                  ),
                   title: () => (
                     <div class={styles.itemTitle}>
                       <span>{data.record.userName}</span>
                     </div>
                   ),
                   value: () => (
-                    <div class={styles.gridItem}>
-                      <div class={styles.gridItemTop}>
-                        <span class={styles.topNum}>{data.record.actualSalary}</span>元
+                    <>
+                      <div class={styles.gridItem}>
+                        <div class={styles.gridItemTop}>
+                          <span class={styles.topNum} style={{ color: '#333' }}>
+                            {data.record.expectSalary || 0}
+                          </span>
+                          元
+                        </div>
+                        <div class={styles.valeLabel}>预计补助</div>
                       </div>
-                      <div class={styles.valeLabel}>实际补助</div>
-                    </div>
+                      <div class={styles.gridItem}>
+                        <div class={styles.gridItemTop}>
+                          <span class={styles.topNum}>{data.record.actualSalary || 0}</span>元
+                        </div>
+                        <div class={styles.valeLabel}>实际补助</div>
+                      </div>
+                    </>
                   )
                 }}
               </Cell>
@@ -110,7 +123,10 @@ export default defineComponent({
                   <GridItem>
                     <div class={styles.gridItem}>
                       <div class={styles.gridItemTop}>
-                        <span class={styles.topNum}>{item.expectSalary || 0}</span>元
+                        <span class={styles.topNum} style={{ color: '#333' }}>
+                          {item.expectSalary || 0}
+                        </span>
+                        元
                       </div>
                       <div>预计补助</div>
                     </div>
@@ -118,7 +134,10 @@ export default defineComponent({
                   <GridItem>
                     <div class={styles.gridItem}>
                       <div class={styles.gridItemTop}>
-                        <span class={styles.topNum}>{item.reduceSalary || 0}</span>元
+                        <span class={styles.topNum} style={{ color: '#333' }}>
+                          {item.reduceSalary || 0}
+                        </span>
+                        元
                       </div>
                       <div>考勤扣款</div>
                     </div>

src/school/approval-manage/subsidy/grant-detail.tsx

@@ -70,7 +70,9 @@ export default defineComponent({
             <div class={styles.item}>
               <Cell
                 center
-                value={`${data.manageSalary.photoNum || 0}/${data.manageSalary.expectPhotoNum || 0}`}
+                value={`训练照片${data.manageSalary.photoNum || 0}/${
+                  data.manageSalary.expectPhotoNum || 0
+                }`}
               >
                 {{
                   title: () => (

src/school/approval-manage/subsidy/index.tsx

@@ -117,7 +117,7 @@ export default defineComponent({
                     )
                   }}
                 </Cell>
-                <Grid class={styles.grid} columnNum={3} border={false}>
+                <Grid class={styles.grid} columnNum={2} border={false}>
                   <GridItem>
                     <div class={styles.gridItem}>
                       <div class={styles.gridItemTop}>
@@ -134,14 +134,14 @@ export default defineComponent({
                       <div>训练补助</div>
                     </div>
                   </GridItem>
-                  <GridItem>
+                  {/* <GridItem>
                     <div class={styles.gridItem}>
                       <div class={styles.gridItemTop}>
                         <span class={styles.topNum}>{data.trainingSalary || 0}</span>元
                       </div>
                       <div>练习奖励</div>
                     </div>
-                  </GridItem>
+                  </GridItem> */}
                 </Grid>
               </div>
             )}
@@ -149,7 +149,14 @@ export default defineComponent({
             {!!data.manageSalaryInfo && (
               <div class={styles.item}>
                 <Cell
-                  style={{ '--van-cell-value-color': '#F44541' }}
+                  style={{
+                    '--van-cell-value-color':
+                      data.manageSalaryInfo.photoNum ||
+                      0 >= data.manageSalaryInfo.expectPhotoNum ||
+                      0
+                        ? '#333'
+                        : '#F44541'
+                  }}
                   center
                   value={`训练照片${data.manageSalaryInfo.photoNum || 0}/${
                     data.manageSalaryInfo.expectPhotoNum || 0
@@ -182,7 +189,7 @@ export default defineComponent({
                     <div class={styles.gridItem}>
                       <div class={styles.gridItemTop}>
                         <span class={styles.topNum} style={{ color: '#333' }}>
-                          {data.manageSalaryInfo.standardSalary || 0}
+                          {data.manageSalaryInfo.coursewareNum || 0}
                         </span>
                         课时
                       </div>
@@ -202,7 +209,7 @@ export default defineComponent({
               </div>
             )}
 
-            {!!data.practiceSalaryInfo && (
+            {/* {!!data.practiceSalaryInfo && (
               <div class={styles.item}>
                 <Cell center isLink to={`/subsidy-reward-detail?id=${recordId.value}`}>
                   {{
@@ -248,7 +255,7 @@ export default defineComponent({
                   </GridItem>
                 </Grid>
               </div>
-            )}
+            )} */}
 
             <div class={styles.item}>
               <Cell center>

src/school/practice-rewards/detail.tsx

@@ -0,0 +1,191 @@
+import OHeader from '@/components/o-header'
+import { Cell, CellGroup, Grid, GridItem, Image, Picker, Popup, Tag } from 'vant'
+import { defineComponent, onMounted, reactive } from 'vue'
+import styles from './index.module.less'
+import iconStudent from '@/common/images/icon_student.png'
+import request from '@/helpers/request'
+
+export default defineComponent({
+  name: 'practice-detail',
+  setup() {
+    const state = reactive({
+      subjectStatus: false,
+      subjectList: [],
+      isClick: false,
+      list: [] as any,
+      listState: {
+        dataShow: true, // 判断是否有数据
+        loading: false,
+        finished: false,
+        refreshing: false,
+        height: 0 // 页面头部高度，为了处理下拉刷新用的
+      },
+      params: {
+        type: null,
+        page: 1,
+        rows: 20
+      }
+    })
+
+    // 获取声部
+    const getSubjects = async () => {
+      try {
+        const { data } = await request.post('/api-school/subjectBasicConfig/page', {
+          data: {
+            page: 1,
+            rows: 50
+          }
+        })
+        state.subjectList = data.rows || []
+      } catch {
+        //
+      }
+    }
+
+    // api-school/schoolWeekSalaryRecord/detailInfo/trainingPage
+    const getList = async () => {
+      try {
+        if (state.isClick) return
+        state.isClick = true
+        const res = await request.post(
+          '/api-school/schoolWeekSalaryRecord/detailInfo/trainingPage',
+          {
+            data: {
+              ...state.params
+            }
+          }
+        )
+        state.listState.loading = false
+        state.listState.refreshing = false
+        const result = res.data || {}
+        // 处理重复请求数据
+        if (state.list.length > 0 && result.current === 1) {
+          return
+        }
+        state.list = state.list.concat(result.rows || [])
+        state.listState.finished = result.current >= result.pages
+        state.params.page = result.current + 1
+        state.listState.dataShow = state.list.length > 0
+        state.isClick = false
+      } catch {
+        state.listState.dataShow = false
+        state.listState.finished = true
+        state.listState.refreshing = false
+        state.isClick = false
+      }
+    }
+
+    onMounted(() => {
+      getSubjects()
+    })
+    return () => (
+      <>
+        <OHeader />
+
+        <div class={styles.item}>
+          <Cell center>
+            {{
+              title: () => (
+                <div class={styles.itemTitle}>
+                  <div class={styles.titleLine}></div>
+                  <span>练习奖励</span>
+                </div>
+              )
+            }}
+          </Cell>
+          <Grid class={styles.grid} columnNum={3} border={false}>
+            <GridItem class={styles.gridBorderRight}>
+              <div class={styles.gridItem}>
+                <div class={styles.gridItemTop}>
+                  <span class={styles.topNum} style={{ color: '#333' }}>
+                    0
+                  </span>
+                  元/人
+                </div>
+                <div>奖励标准</div>
+              </div>
+            </GridItem>
+            <GridItem class={styles.gridBorderRight}>
+              <div class={styles.gridItem}>
+                <div class={styles.gridItemTop}>
+                  <span class={styles.topNum} style={{ color: '#333' }}>
+                    0
+                  </span>
+                  人
+                </div>
+                <div>练习达标人数</div>
+              </div>
+            </GridItem>
+            <GridItem>
+              <div class={styles.gridItem}>
+                <div class={styles.gridItemTop}>
+                  <span class={styles.topNum}>0</span>元
+                </div>
+                <div>奖励金额</div>
+              </div>
+            </GridItem>
+          </Grid>
+        </div>
+
+        <div class={styles.searchGroup}>
+          <span
+            class={[styles.searchItem, state.subjectStatus && styles['searchItem--active']]}
+            onClick={() => {
+              state.subjectStatus = !state.subjectStatus
+            }}
+          >
+            <div>全部声部</div>
+          </span>
+        </div>
+        {/* {form.listState.dataShow ? (
+          <OFullRefresh
+            v-model:modelValue={form.listState.refreshing}
+            onRefresh={onRefresh}
+            style={{
+              minHeight: `calc(100vh - ${form.listState.height}px)`
+            }}
+          >
+            <List
+              // v-model:loading={form.listState.loading}
+              finished={form.listState.finished}
+              finishedText=" "
+              class={[styles.liveList]}
+              onLoad={getList}
+              immediateCheck={false}
+            ></List> */}
+        <CellGroup inset class={styles.cellGroup}>
+          <Cell center>
+            {{
+              icon: () => <Image src={iconStudent} class={styles.img} />,
+              title: () => (
+                <div class={styles.userInfo}>
+                  <div class={styles.userName}>测试</div>
+                  <div class={styles.subjectNames}>
+                    <Tag type="primary">长笛</Tag>
+                  </div>
+                </div>
+              ),
+              value: () => (
+                <div class={styles.mins}>
+                  <div class={styles.nums}>
+                    <span>70</span> 分钟
+                  </div>
+                  <div class={styles.text}>练习时长</div>
+                </div>
+              )
+            }}
+          </Cell>
+        </CellGroup>
+
+        <Popup v-model:show={state.subjectStatus} position="bottom" round>
+          <Picker
+            columns={state.subjectList}
+            onCancel={() => (state.subjectStatus = false)}
+            onConfirm={(val: any) => {}}
+            columnsFieldNames={{ text: 'subjectName', value: 'subjectId' }}
+          />
+        </Popup>
+      </>
+    )
+  }
+})

src/school/practice-rewards/index.module.less

@@ -0,0 +1,281 @@
+.btn {
+  border-radius: 13px;
+  border: 1px solid #f67146;
+  font-size: 14px;
+  font-weight: 500;
+  color: #f67146;
+  line-height: 20px;
+  padding: 3px 9px;
+}
+.gridGroup {
+  margin: 12px 13px;
+  border-radius: 10px;
+  overflow: hidden;
+  :global {
+    .van-cell {
+      padding: 13px 12px;
+    }
+  }
+
+  .itemTitle {
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    font-size: 14px;
+    font-weight: 500;
+    color: #777777;
+    line-height: 20px;
+
+    .status {
+      font-size: 14px;
+      font-weight: 500;
+      color: #777777;
+      line-height: 20px;
+    }
+    .red {
+      color: #f44541;
+    }
+  }
+}
+
+.headerContainer {
+  background-color: #fff;
+  padding: 12px 13px 20px;
+  .headerContent {
+    position: relative;
+    padding: 15px 20px 25px;
+    background: linear-gradient(135deg, #ff9a60 0%, #ff6040 100%);
+    border-radius: 10px;
+    font-size: 16px;
+    font-weight: bold;
+    color: #fff;
+
+    &::after {
+      display: block;
+      position: absolute;
+      left: 0;
+      bottom: 0;
+      content: ' ';
+      height: 56px;
+      width: 100%;
+      background: url('./images/icon-bg.png') no-repeat center bottom;
+      background-size: contain;
+    }
+
+    .iconEye {
+      position: absolute;
+      right: 20px;
+      top: 14px;
+      display: inline-block;
+      font-size: 24px;
+    }
+  }
+  .priceCount {
+    padding: 10px 0 15px;
+    font-size: 38px;
+    font-family: DINA;
+    font-weight: bold;
+    color: #ffffff;
+    line-height: 45px;
+  }
+  .countRewards {
+    padding-top: 15px;
+    font-weight: 500;
+    font-size: 14px;
+    span {
+      font-weight: bold;
+      font-family: DINA;
+    }
+  }
+}
+
+.grid {
+  :global {
+    .van-grid-item__content {
+      padding: 15px 0 20px;
+    }
+  }
+  .gridBorderRight::after {
+    content: ' ';
+    position: absolute;
+    box-sizing: border-box;
+    height: 40px;
+    pointer-events: none;
+    top: 50%;
+    margin-top: -20px;
+    right: 0;
+    border: 1px solid var(--van-border-color);
+    transform: scale(0.5);
+  }
+}
+.gridItem {
+  position: relative;
+  text-align: center;
+  font-size: 12px;
+  color: #777;
+  width: 100%;
+  .gridItemTop {
+    margin-bottom: 6px;
+  }
+  .topNum {
+    color: #f67146;
+    font-size: 24px;
+    margin-right: 2px;
+    font-weight: bold;
+  }
+  & + .gridItem {
+    margin-left: 26px;
+  }
+}
+
+.item {
+  border-radius: 10px;
+  margin: 12px 13px 12px 13px;
+  overflow: hidden;
+  background: #fff;
+  :global {
+    .van-cell {
+      padding-top: 12px;
+      padding-bottom: 12px;
+    }
+    .van-cell::after {
+      left: 0;
+      right: 0;
+    }
+    .van-cell__label {
+      font-size: 14px;
+      color: #777;
+      white-space: nowrap;
+    }
+  }
+  .titleLine {
+    width: 4px;
+    height: 12px;
+    background: #ff8057;
+    border-radius: 2px;
+    margin-right: 6px;
+  }
+  .itemTitle {
+    display: flex;
+    align-items: center;
+    font-size: 16px;
+    .titleIcon {
+      width: 18px;
+      height: 18px;
+      margin-right: 6px;
+    }
+  }
+  .itemTag {
+    padding: 0 8px;
+    height: 19px;
+    line-height: 19px;
+    background: #ff8057;
+    border-radius: 4px;
+    color: #fff;
+    font-size: 12px;
+    margin-left: 6px;
+  }
+  .itemPicture {
+    width: 44px;
+    height: 44px;
+    margin-right: 8px;
+    border-radius: 50%;
+    overflow: hidden;
+  }
+  :global(.van-cell__value) {
+    display: flex;
+    justify-content: flex-end;
+    padding-right: 8px;
+    .valeLabel {
+      margin-top: -12px;
+    }
+    .topNum {
+      font-size: 19px;
+    }
+  }
+}
+
+.searchGroup {
+  padding: 0 13px 14px;
+}
+.searchItem {
+  position: relative;
+  box-sizing: border-box;
+  max-width: 100%;
+  padding: 6px 24px 6px 13px;
+  background-color: #fff;
+  border-radius: 16px;
+  display: inline-block;
+  font-size: 14px;
+  color: #333333;
+  line-height: 20px;
+  transition: all 0.2s ease-in-out;
+  &::after {
+    position: absolute;
+    top: 50%;
+    right: 13px;
+    margin-top: -5px;
+    border: 3px solid;
+    border-color: transparent transparent #aaaaaa #aaaaaa;
+    transform: rotate(-45deg);
+    transition: all 0.2s ease-in-out;
+    opacity: 0.8;
+    content: '';
+  }
+
+  &.searchItem--active {
+    color: var(--van-primary-color);
+
+    &::after {
+      margin-top: -1px;
+      transform: rotate(135deg);
+      border-color: transparent transparent currentColor currentColor;
+    }
+  }
+}
+
+.cellGroup {
+  border-radius: 10px;
+  :global {
+    .van-cell {
+      padding: 18px 20px 18px 12px;
+    }
+  }
+  .img {
+    width: 44px;
+    height: 44px;
+    border-radius: 50%;
+    overflow: hidden;
+  }
+
+  .userInfo {
+    padding-left: 10px;
+    .userName {
+      font-size: 16px;
+      font-weight: 500;
+      color: #333333;
+      line-height: 22px;
+    }
+    .subjectNames {
+      line-height: 1.2;
+    }
+  }
+
+  .mins {
+    font-size: 11px;
+    color: #333333;
+    line-height: 16px;
+    .nums {
+      span {
+        font-size: 19px;
+        font-family: DINA;
+        font-weight: bold;
+        color: #333333;
+        line-height: 22px;
+      }
+    }
+    .text {
+      color: #777777;
+    }
+  }
+}

src/school/practice-rewards/index.tsx

@@ -0,0 +1,144 @@
+import { defineComponent, reactive, onMounted, computed } from 'vue'
+import { Cell, Grid, GridItem, Progress, Icon, List } from 'vant'
+import OEmpty from '@/components/o-empty'
+import styles from './index.module.less'
+import OSticky from '@/components/o-sticky'
+import OHeader from '@/components/o-header'
+import request from '@/helpers/request'
+import dayjs from 'dayjs'
+import { moneyFormat } from '@/helpers/utils'
+
+export default defineComponent({
+  name: 'practice-rewards',
+  setup() {
+    const state = reactive({
+      list: [] as any,
+      listState: {
+        dataShow: true, // 判断是否有数据
+        loading: false,
+        finished: false
+      },
+      statistics: {
+        totalTrainingSalary: 0,
+        waitSalary: 0
+      }
+    })
+
+    const salaryRate = computed(() => {
+      const salary = state.statistics
+      if (salary.totalTrainingSalary) {
+        return salary.waitSalary / salary.totalTrainingSalary
+      } else {
+        return 0
+      }
+    })
+
+    const getStatistics = async () => {
+      try {
+        const { data } = await request.post('/api-school/schoolWeekSalaryRecord/statistics')
+        console.log(data)
+        state.statistics = {
+          totalTrainingSalary: data.totalTrainingSalary || 0,
+          waitSalary: data.waitSalary || 0
+        }
+      } catch {
+        //
+      }
+    }
+
+    const getList = async () => {
+      try {
+        const res = await request.post('/api-school/schoolWeekSalaryRecord/trainingList', {
+          data: {}
+        })
+        const result = res.data || []
+        // 处理重复请求数据
+        if (state.list.length > 0 && result.current === 1) {
+          return
+        }
+        state.list = res.data || []
+        state.listState.dataShow = state.list.length > 0
+      } catch {
+        state.listState.dataShow = false
+      }
+    }
+
+    onMounted(() => {
+      getStatistics()
+      getList()
+    })
+    return () => (
+      <>
+        <OSticky position="top" style={{ background: '#fff' }}>
+          <OHeader border={false}>
+            {{ right: () => <span class={styles.btn}>结算记录</span> }}
+          </OHeader>
+          <div class={styles.headerContainer}>
+            <div class={styles.headerContent}>
+              {/* closed-eye eye-o */}
+              <Icon class={styles.iconEye} name="eye-o" />
+              <div class={styles.priceTitle}>待结算金额 (元)</div>
+              <div class={styles.priceCount}>{moneyFormat(state.statistics.waitSalary)}</div>
+              <Progress
+                color="#fff"
+                trackColor="#E7441A"
+                showPivot={false}
+                percentage={salaryRate.value}
+                strokeWidth={8}
+              />
+              <div class={styles.countRewards}>
+                累计奖励 (元) ：<span>{moneyFormat(state.statistics.totalTrainingSalary)}</span>
+              </div>
+            </div>
+          </div>
+        </OSticky>
+        {state.listState.dataShow ? (
+          state.list.map((item: any) => (
+            <div class={styles.gridGroup}>
+              <Cell center isLink>
+                {{
+                  title: () => (
+                    <div class={styles.itemTitle}>
+                      <span>
+                        {dayjs(item.startTime).format('YYYY-MM-DD')} 至{' '}
+                        {dayjs(item.endTime).format('YYYY-MM-DD')}
+                      </span>
+                      <span class={[styles.status, !item.settleFlag && styles.red]}>
+                        {!item.settleFlag ? '待结算' : '已结算'}
+                      </span>
+                    </div>
+                  )
+                }}
+              </Cell>
+              <Grid class={styles.grid} columnNum={2} border={false}>
+                <GridItem class={styles.gridBorderRight}>
+                  <div class={[styles.gridItem]}>
+                    <div class={styles.gridItemTop}>
+                      <span class={styles.topNum} style={{ color: '#333' }}>
+                        {item.targetNum || 0}
+                      </span>
+                    </div>
+                    <div>练习达标人数</div>
+                  </div>
+                </GridItem>
+                <GridItem>
+                  <div class={styles.gridItem}>
+                    <div class={styles.gridItemTop}>
+                      <span class={styles.topNum} style={{ color: '#333' }}>
+                        {item.totalSalary}
+                      </span>
+                      元
+                    </div>
+                    <div>奖励金额</div>
+                  </div>
+                </GridItem>
+              </Grid>
+            </div>
+          ))
+        ) : (
+          <OEmpty btnStatus={false} tips="暂无练习奖励记录" />
+        )}
+      </>
+    )
+  }
+})

src/views/coursewarePlay/index.tsx

@@ -542,7 +542,7 @@ export default defineComponent({
         }
       }
     ]
-    const swiperType = ref(effects[2])
+    const swiperType = ref(effects[3])
     // 上一个知识点, 下一个知识点
     const handlePreAndNext = (type: string) => {
       setTimeout(() => {