ui走查

src/views/home/component/CurrentStudent.tsx

@@ -107,7 +107,7 @@ export default defineComponent({
         series: [
           {
             type: 'pie',
-            radius: ['40%', '62%'],
+            radius: ['60%', '82%'],
             itemStyle: {
               borderRadius: 2,
               borderColor: '#fff',

src/views/home/component/DetailData.tsx

@@ -12,12 +12,25 @@ import { Badge, Image } from 'vant';
 import { ISubjectGradeDistribution } from '../type';
 
 const colors = [
-  '#5B8FF9',
-  '#F6BD16',
-  '#5AD8A6',
-  '#E8684A',
-  '#5D7092',
-  '#6DC8EC'
+  '#21B3D7',
+  '#DF8010',
+  '#17BDA6',
+  
+  '#21B3D7',
+  '#DF8010',
+  '#17BDA6',
+
+  '#21B3D7',
+  '#DF8010',
+  '#17BDA6',
+
+  '#21B3D7',
+  '#DF8010',
+  '#17BDA6',
+
+  '#21B3D7',
+  '#DF8010',
+  '#17BDA6',
 ];
 
 export default defineComponent({
@@ -102,13 +115,13 @@ export default defineComponent({
         <div class={styles.detailDataContainer}>
           <div class={styles.detailLeft}>
             <div>
-              <div class={styles.tableTitle}>声部</div>
+              <div style={{background: '#F8F8F8'}} class={styles.tableTitle}>声部</div>
               {subjects.value.map(item => (
                 <div class={styles.tableTr}>{item.subjectName}</div>
               ))}
             </div>
             <div class={styles.center}>
-              <div class={styles.tableTitle}>总人数</div>
+              <div style={{background: '#F2F2F2'}} class={styles.tableTitle}>总人数</div>
               {subjects.value.map(item => (
                 <div class={styles.tableTr}>{item['总人数']}</div>
               ))}

src/views/home/component/MusicGroup.tsx

@@ -18,23 +18,21 @@ import icon_3 from '../image/icon_3.png';
 type EChartsOption = echarts.EChartsOption;
 
 const colors = [
-  '91, 143, 249',
-  '90, 216, 166',
-  '232, 104, 74',
-  '93, 112, 146',
-  '109, 200, 236',
-  '255, 149, 48',
-  '184, 123, 221',
-  '146, 222, 151',
+  '134, 186, 255',
+  '255, 219, 145',
+  '133, 223, 207',
 
-  '91, 143, 249',
-  '90, 216, 166',
-  '232, 104, 74',
-  '93, 112, 146',
-  '109, 200, 236',
-  '255, 149, 48',
-  '184, 123, 221',
-  '146, 222, 151'
+  '134, 186, 255',
+  '255, 219, 145',
+  '133, 223, 207',
+
+  '134, 186, 255',
+  '255, 219, 145',
+  '133, 223, 207',
+
+  '134, 186, 255',
+  '255, 219, 145',
+  '133, 223, 207'
 ];
 
 export default defineComponent({
@@ -47,7 +45,7 @@ export default defineComponent({
   },
   setup(props) {
     const activeSubject = ref('');
-    const echratsRef = ref()
+    const echratsRef = ref();
     const { data } = toRefs(props);
 
     /** 根据声部 过滤数据源 */
@@ -67,7 +65,7 @@ export default defineComponent({
       () => {
         nextTick(() => {
           handleInit();
-        })
+        });
       }
     );
 
@@ -153,8 +151,8 @@ export default defineComponent({
           type: 'value',
           boundaryGap: [0, 0.01],
           minInterval: 1,
-          splitLine:{
-            lineStyle:{
+          splitLine: {
+            lineStyle: {
               type: 'dashed',
               color: '#f2f2f2'
             }
@@ -191,6 +189,7 @@ export default defineComponent({
             label: {
               show: true,
               position: 'right',
+              color: '#777',
               formatter: _item => {
                 return _item.value ? `${_item.value}` : '';
               }
@@ -235,11 +234,17 @@ export default defineComponent({
           style={{ display: data.value.length ? '' : 'none' }}
           class={styles.musicGroupContainer}>
           <div class={styles.musicGroupEcharts} ref={echratsRef}></div>
-          <div class={styles.tags}>
+          <div
+            class={styles.tags}
+            onTouchmove={(e: Event) => e.stopPropagation()}
+            onMousemove={(e: Event) => e.stopPropagation()}>
             {Object.values(musicGroups.value).map(item => (
               <div class={styles.tag}>
-                <Badge dot color={`rgb(${item.color})`} />
-                <div>{item.text}</div>
+                <Badge
+                  dot
+                  color={`linear-gradient(180deg, rgba(${item.color}, .5) 0%, rgba(${item.color}, 1) 100%)`}
+                />
+                <div style={{ whiteSpace: 'nowrap' }}>{item.text}</div>
               </div>
             ))}
           </div>

src/views/home/component/Subjects.tsx

@@ -62,6 +62,11 @@ export default defineComponent({
           bottom: 5,
           containLabel: true
         },
+        tooltip: {
+          trigger: 'item',
+          confine: true,
+          borderWidth: 0
+        },
         xAxis: {
           type: 'category',
           axisTick: {

src/views/home/index.module.less

@@ -19,7 +19,7 @@ body {
             }
             .van-tabs__line {
                 bottom: 0.74rem;
-                width: var(--line-width, 62px);
+                width: var(--line-width, 1.5rem);
                 height: 6px;
                 background: linear-gradient(250deg, rgba(45, 199, 170, 0.22) 0%, #2DC7AA 100%);
                 border-radius: 0;
@@ -77,7 +77,6 @@ body {
         margin: 0 7px;
         font-size: 14px;
         color: #333;
-        font-weight: bold;
     }
 }
 
@@ -127,6 +126,10 @@ body {
             width: 14px;
             height: 4px;
             border-radius: 2px;
+            bottom: .5rem;
+        }
+        .van-tab{
+            padding: 0 12px;
         }
     }
 
@@ -156,7 +159,7 @@ body {
         font-size: 12px;
         color: #777;
         line-height: 16px;
-
+        padding: 10px 0;
         .tag {
             display: flex;
             align-items: center;
@@ -196,21 +199,23 @@ body {
     }
 
     .tags {
-        flex: 1;
         display: flex;
-        justify-content: space-evenly;
-        flex-wrap: wrap;
         font-size: 12px;
         color: #777;
         line-height: 16px;
-        padding: 12px;
-
+        padding: 12px 0 12px 36px;
+        margin-right: 12px;
+        overflow-x: auto;
+        &::-webkit-scrollbar {
+            width: 0;
+            display: none;
+        }
         .tag {
             display: flex;
             align-items: center;
             justify-content: center;
             padding: 6px 5px;
-
+            margin-right: 14px;
             :global {
                 .van-badge--dot {
                     transform: none;
@@ -252,7 +257,7 @@ body {
         font-size: 10px;
         line-height: 14px;
         white-space: nowrap;
-
+        margin: 0 1px;
         &>div:first-child {
             position: absolute;
             left: 0;
@@ -289,8 +294,8 @@ body {
     align-items: center;
 
     .attendanceEcharts {
-        width: 170px;
-        height: 170px;
+        width: 150px;
+        height: 150px;
     }
 
     .tags {
@@ -351,7 +356,10 @@ body {
         }
 
         .van-grid-item:first-child {
-            border-right: 1px dashed #777;
+            border-right: 1Px dashed #777;
+        }
+        .van-badge__wrapper{
+            padding-left: 10px;
         }
     }
 
@@ -365,5 +373,10 @@ body {
     .progressItem {
         padding: 5px 15px;
         line-height: 34px;
+        :global{
+            .van-progress{
+                border-radius: 2Px;
+            }
+        }
     }
 }

src/views/schedule-manage/detial/index.module.less

@@ -1,5 +1,5 @@
 .detail {
-    padding: 12px;
+    padding: 12px 12px 2.2rem 12px;
 }
 
 .listItem {
@@ -23,11 +23,11 @@
 
         .timeTitle {
             margin-left: 4px;
-            color: var(--text-color);
+            color: #333;
         }
 
         .time {
-            color: var(--text-color-2);
+            color: #777;
         }
 
         .timeBtn {
@@ -64,7 +64,7 @@
         }
 
         .van-cell__value {
-            color: var(--text-color);
+            color: #333;
         }
     }
 }
@@ -93,14 +93,14 @@
     color: #777;
     line-height: 20px;
     min-height: 40px;
-    padding: 0.32rem;
+    padding: 0.32rem 0.32rem 0 0;
     margin-bottom: 15px;
 }
 
 .itemTitleDes {
     display: flex;
     align-items: center;
-    color: var(--text-color);
+    color: #333;
     font-size: 15px;
 
     .line {
@@ -116,7 +116,7 @@
     position: fixed;
     left: 0;
     right: 0;
-    bottom: 20px;
+    bottom: 36px;
     display: flex;
     justify-content: space-evenly;
     padding: 0 13px;
@@ -133,6 +133,9 @@
             font-size: 16px;
             font-weight: 600;
         }
+        .van-button:before{
+            display: none;
+        }
     }
 }
 

src/views/schedule-manage/detial/index.tsx

@@ -90,6 +90,29 @@ export default defineComponent({
           }}
         </Skeleton>
 
+
+        <div class={styles.item}>
+          <div class={styles.itemTitleDes}>
+            <div class={styles.line}></div>
+            <div>乐团名称</div>
+          </div>
+          <Skeleton class={styles.skeleton} loading={detailData.skeleton}>
+            {{
+              template: () => (
+                <div class={styles.info}>
+                  <SkeletonParagraph />
+                  <SkeletonParagraph />
+                </div>
+              ),
+              default: () => (
+                <div class={styles.info} style={{margin: 0}}>
+                  {detailData.student.musicGroupName}
+                </div>
+              )
+            }}
+          </Skeleton>
+        </div>
+
         <div class={styles.item}>
           <div class={styles.itemTitleDes}>
             <div class={styles.line}></div>
@@ -153,7 +176,7 @@ export default defineComponent({
                       required
                       rows={2}
                       type="textarea"
-                      placeholder="请输入审批意见"
+                      placeholder="请输入审批意见..."
                       border={false}
                       v-model:modelValue={detailData.reason}
                     />

src/views/schedule-manage/index.module.less

@@ -16,25 +16,36 @@
       display: flex;
       flex-direction: column;
     }
+    .van-tab {
+      z-index: 1;
+    }
 
     .van-tabs__line {
       bottom: 26px;
-      width: 45px;
+      width: 40px;
       height: 6px;
       background: linear-gradient(250deg, rgba(45, 199, 170, 0.22) 0%, #2DC7AA 100%);
-      z-index: 0;
+      border-radius: 0;
     }
   }
 }
 
 .list {
   padding: 12px;
-  flex: 1;
+  height: calc(100vh - var(--header-height) - var(--van-tabs-line-height) - 60px);
   overflow-y: auto;
-
+  &.todo{
+    height: calc(100vh - var(--header-height) - var(--van-tabs-line-height));
+  }
   &::-webkit-scrollbar {
     display: none;
   }
+  :global{
+    .van-pull-refresh,
+    .van-pull-refresh__track{
+      min-height: 100%;
+    }
+  }
 }
 
 .listHide {
@@ -63,11 +74,11 @@
 
     .timeTitle {
       margin-left: 4px;
-      color: var(--text-color);
+      color: #333;
     }
 
     .time {
-      color: var(--text-color-2);
+      color: #777;
     }
 
     .timeBtn {
@@ -99,7 +110,7 @@
     }
 
     .van-cell__value {
-      color: var(--text-color);
+      color: #333;
     }
   }
 }
@@ -108,7 +119,7 @@
   display: flex;
   align-items: center;
   background-color: #fff;
-
+  height: 60px;
   :global {
     .van-search {
       flex: 1
@@ -131,9 +142,12 @@
 
 :global {
   .van-dropdown-item {
+    .van-dropdown-item__content .van-dropdown-item__option{
+      height: 50px !important;
+    }
     .van-dropdown-item__content .van-dropdown-item__option .van-cell__title {
       font-size: 16px;
-      color: var(--text-color);
+      color: #333;
     }
 
     .van-dropdown-item__content .van-dropdown-item__option--active {

src/views/schedule-manage/index.tsx

@@ -31,9 +31,9 @@ export default defineComponent({
       } else {
         return sessionStorage.getItem(key) || '';
       }
-    }
+    };
     const router = useRouter();
-    
+
     const todoData = reactive({
       tabActive: toggleTabName('get') as 'todo' | 'complete',
       examineLoading: true,
@@ -92,19 +92,20 @@ export default defineComponent({
           todoData.examineFinish = true;
         })
         .finally(() => {
-          todoData.examineLoading = false;
           setTimeout(() => {
+            todoData.examineLoading = false;
             todoData.refreshLoading = false;
             todoData.examineSkelet = false;
           }, 500);
         });
     };
     const getComplete = () => {
-      console.log('请求');
+      if (todoData.completeLoading) return;
+      console.log('请求', todoData.completeLoading, todoData.completeResh);
       todoData.completeLoading = true;
       musicGroupQuitQueryPage({
-        page: todoData.examinePage.page,
-        rows: todoData.examinePage.rows,
+        page: todoData.completePage.page,
+        rows: todoData.completePage.rows,
         search: todoData.search,
         status: todoData.activeOption
       })
@@ -118,14 +119,16 @@ export default defineComponent({
           todoData.completeList = todoData.completeList.concat(rows);
           if (!rows.length || rows.length < todoData.completePage.rows) {
             todoData.completeFinish = true;
+          } else {
+            todoData.completeFinish = false;
           }
         })
         .catch(() => {
           todoData.completeFinish = true;
         })
         .finally(() => {
-          todoData.completeLoading = false;
           setTimeout(() => {
+            todoData.completeLoading = false;
             todoData.completeResh = false;
             todoData.completeSkelet = false;
           }, 500);
@@ -146,7 +149,6 @@ export default defineComponent({
           ? '未通过'
           : '全部状态';
       todoData.examinePage.page = 1;
-      todoData.completeFinish = false;
       todoData.completeResh = true;
       getComplete();
     };
@@ -169,22 +171,22 @@ export default defineComponent({
         </MSticky>
         <Tabs swipeable animated v-model:active={todoData.tabActive}>
           <Tab name="todo" title="待审批">
-            <List
-              loading={todoData.examineLoading}
-              finished={todoData.examineFinish}
-              class={styles.list}
-              onLoad={() => {
-                todoData.examinePage.page++;
+            <MFullRefresh
+              v-model:modelValue={todoData.refreshLoading}
+              onRefresh={() => {
+                todoData.examinePage.page = 1;
+                todoData.examineFinish = false;
                 getExamine();
               }}>
-              <MFullRefresh
-                v-model:modelValue={todoData.refreshLoading}
-                onRefresh={() => {
-                  todoData.examinePage.page = 1;
-                  todoData.examineFinish = false;
+              <List
+                loading={todoData.examineLoading}
+                finished={todoData.examineFinish}
+                class={[styles.list, styles.todo]}
+                onLoad={() => {
+                  todoData.examinePage.page++;
                   getExamine();
                 }}>
-                {todoData.examineSkelet && (
+                {todoData.examineSkelet ? (
                   <div class={[styles.list, styles.listHide]}>
                     <Skeleton loading={true}>
                       {{
@@ -198,22 +200,29 @@ export default defineComponent({
                       }}
                     </Skeleton>
                   </div>
+                ) : (
+                  <>
+                    {todoData.examineList.map((item: MusicGroupQuitPageDto) => {
+                      return (
+                        <ListItem
+                          isLink={true}
+                          item={item}
+                          onGoto={() => handleGoto(item)}
+                        />
+                      );
+                    })}
+                    {!todoData.examineList.length && (
+                      <MEmpty
+                        description="暂无数据"
+                        style={{
+                          minHeight: '100%'
+                        }}
+                      />
+                    )}
+                  </>
                 )}
-                {todoData.examineList.map((item: MusicGroupQuitPageDto) => {
-                  return (
-                    <ListItem isLink={true} item={item} onGoto={() => handleGoto(item)} />
-                  );
-                })}
-                {!todoData.examineList.length && (
-                  <MEmpty
-                    description="暂无数据"
-                    style={{
-                      minHeight: '100%'
-                    }}
-                  />
-                )}
-              </MFullRefresh>
-            </List>
+              </List>
+            </MFullRefresh>
           </Tab>
           <Tab name="complete" title="已完成">
             <div class={styles.menubox}>
@@ -228,28 +237,30 @@ export default defineComponent({
               </DropdownMenu>
               <MSearch
                 placeholder="请输入学员名称"
-                onSearch={(value) => {
-                  todoData.search = value
-                  todoData.examinePage.page = 1;
-                  todoData.completeFinish = false;
+                disabled={todoData.completeLoading}
+                onSearch={value => {
+                  todoData.search = value;
+                  todoData.completePage.page = 1;
                   todoData.completeResh = true;
                   getComplete();
                 }}
               />
             </div>
-            <List
-              loading={todoData.completeLoading}
-              finished={todoData.completeFinish}
-              class={styles.list}
-              onLoad={() => {
-                todoData.examinePage.page++;
+            <MFullRefresh
+              v-model:modelValue={todoData.completeResh}
+              onRefresh={() => {
+                console.log('下拉');
+                todoData.completePage.page = 1;
+                todoData.completeFinish = false;
                 getComplete();
               }}>
-              <MFullRefresh
-                v-model:modelValue={todoData.completeResh}
-                onRefresh={() => {
-                  todoData.examinePage.page = 1;
-                  todoData.completeFinish = false;
+              <List
+                loading={todoData.completeLoading}
+                finished={todoData.completeFinish}
+                class={styles.list}
+                onLoad={() => {
+                  todoData.completePage.page++;
+                  console.log('触底', todoData.completeResh);
                   getComplete();
                 }}>
                 {todoData.completeSkelet && (
@@ -289,8 +300,8 @@ export default defineComponent({
                     }}
                   />
                 )}
-              </MFullRefresh>
-            </List>
+              </List>
+            </MFullRefresh>
           </Tab>
         </Tabs>
       </div>

src/views/schedule-manage/schedule.d.ts

@@ -48,4 +48,6 @@ export interface MusicGroupQuitDetailDto extends IStudentInfo {
   status: IStatus;
   /** 学员退团原因 */
   userComment: string;
+  /** 乐团名称 */
+  musicGroupName: string
 }

src/views/student-manage/component/Assignment.tsx

@@ -24,6 +24,7 @@ export default defineComponent({
                 {item.actualAttendanceCount}
               </span>
               /{item.shouldAttendanceCount}
+              <span class={styles.ci}></span>
             </div>
             <div class={styles.label}>出勤情况</div>
           </div>

src/views/student-manage/component/Attendance.tsx

@@ -30,6 +30,7 @@ export default defineComponent({
                 {item.actualSubmitCount}
               </span>
               /{item.shouldSubmitCount}
+              <span class={styles.ci}></span>
             </div>
             <div class={styles.label}>作业情况</div>
           </div>

src/views/student-manage/component/m-student/index.tsx

@@ -48,7 +48,7 @@ export default defineComponent({
         }}>
         {{
           icon: () => (
-            <Badge offset={[-14, 10]}>
+            <Badge offset={[-18, 12]}>
               {{
                 default: () => (
                   <Image

src/views/student-manage/index.module.less

@@ -24,7 +24,7 @@
 
 .statistics{
     display: flex;
-    padding: 20px 30px;
+    padding: 20px 0;
     background-color: #fff;
     border-radius: 10px;
     margin-bottom: 12px;
@@ -33,7 +33,8 @@
         flex: 1;
         display: flex;
         align-items: center;
-        justify-content: space-evenly;
+        justify-content: space-between;
+        padding: 0 30px;
         &:first-child{
             border-right: 1px solid #F2F2F2;
         }
@@ -108,7 +109,12 @@
             .ci {
                 font-size: 12px;
                 margin-left: 2px;
+                vertical-align: middle;
             }
         }
     }
 }
+
+.dropdownItem{
+    margin-top: -2Px;
+}

src/views/student-manage/index.tsx

@@ -252,6 +252,7 @@ export default defineComponent({
               </div>
             </DropdownItem>
             <DropdownItem
+              class={styles.dropdownItem}
               title={studentMagege.studentTypeName}
               v-model={fromData.vipFlag}
               options={studentMagege.studentTypes}