Update tenantDataSchool.tsx

src/views/tenantAllData/tenantDataSchool.tsx

@@ -17,6 +17,7 @@ import MSticky from '@/components/m-sticky';
 import personIcon from './images/personIcon.png';
 import homeIcon from './images/icon-class.png';
 import memberIcon from './images/memberIcon.png';
+import memberRateIcon from './images/memberRateIcon.png';
 import sanIcon from './images/san.png';
 import request from '@/helpers/request';
 import topDot from './images/topDot.png';
@@ -156,6 +157,15 @@ export default defineComponent({
       shareLoading: false
     });
 
+    // 计算会员占比
+    const formatMemberRate = (studentNum: any, memberNum: any) => {
+      if (studentNum <= 0 || memberNum <= 0) {
+        return 0;
+      }
+      // console.log(studentNum, memberNum);
+      return Math.round((memberNum / studentNum) * 1000) / 10;
+    };
+
     onMounted(async () => {
       if (route.query.name) {
         document.title = route.query.name + '报名统计';
@@ -208,6 +218,16 @@ export default defineComponent({
               </div> */}
             </div>
             <div class={styles.cardWrap}>
+              <div class={[styles.classCard, styles.cardItem]}>
+                <div class={styles.cardNum}>
+                  {numeral(forms.statObj.classNum).format('0,0')}
+                </div>
+                <div class={styles.cardInfo}>
+                  <img src={homeIcon} class={styles.cardInfoImg} alt="" />
+                  班级数量
+                </div>
+                <div class={styles.cardLine}></div>
+              </div>
               <div class={[styles.studentCard, styles.cardItem]}>
                 <div class={styles.cardNum}>
                   {numeral(forms.statObj.registerNum).format('0,0')}
@@ -228,13 +248,18 @@ export default defineComponent({
                 </div>
                 <div class={styles.cardLine}></div>
               </div>
-              <div class={[styles.classCard, styles.cardItem]}>
+              <div class={[styles.memberRateCard, styles.cardItem]}>
                 <div class={styles.cardNum}>
-                  {numeral(forms.statObj.classNum).format('0,0')}
+                  {numeral(
+                    formatMemberRate(
+                      forms.statObj.registerNum,
+                      forms.statObj.registerMemberShipNum
+                    )
+                  ).format('0,0')}
                 </div>
                 <div class={styles.cardInfo}>
-                  <img src={homeIcon} class={styles.cardInfoImg} alt="" />
-                  班级数量
+                  <img src={memberRateIcon} class={styles.cardInfoImg} alt="" />
+                  会员占比
                 </div>
                 <div class={styles.cardLine}></div>
               </div>
@@ -291,15 +316,33 @@ export default defineComponent({
                     </div>
                     <div class={styles.schoolCountWrap}>
                       <div>
-                        <p class={styles.personNum}>{item.registerNum || 0}</p>
+                        <p class={styles.personNum}>
+                          {numeral(item.registerNum || 0).format('0,0')}
+                          {/* {item.registerNum || 0} */}
+                        </p>
                         <p class={styles.title}>报名人数</p>
                       </div>
                       <div>
                         <p class={styles.personNum}>
-                          {item.registerMemberShipNum || 0}
+                          {numeral(item.registerMemberShipNum || 0).format(
+                            '0,0'
+                          )}
+                          {/* {item.registerMemberShipNum || 0} */}
                         </p>
                         <p class={styles.title}>会员人数</p>
                       </div>
+                      <div>
+                        <p class={styles.personNum}>
+                          {numeral(
+                            formatMemberRate(
+                              item.registerNum || 0,
+                              item.registerMemberShipNum || 0
+                            )
+                          ).format('0.0')}
+                          %
+                        </p>
+                        <p class={styles.title}>会员占比</p>
+                      </div>
                       {/* <img class={[styles.arrow]} src={arrowIcon} alt="" /> */}
                     </div>
                   </div>