首页优化

1

src/views/main/baseinfo/hr.vue

@@ -1,5 +1,12 @@
 <template>
-  <el-card header="人事数据">
+  <el-card >
+      <div slot="header" class="clearfix">
+        <div class="box">
+          <span class='shape'></span>
+          <span>人事数据</span>
+        </div>
+
+      </div>
     <statistic class="statistic" :cols="0">
       <statistic-item v-for="(item, key) in items" :key="key" :class="{active: active === key}" @click="active = key">
         <span>
@@ -13,14 +20,14 @@
         </span>
       </statistic-item>
     </statistic>
-    <ve-histogram
+    <!-- <ve-histogram
       style="width: 100%;"
       height="350px"
       :data="chartData"
       :data-empty="dataEmpty"
       :data-zoom="dataZoom"
       :extend="chartExtend"
-    ></ve-histogram>
+    ></ve-histogram> -->
   </el-card>
 </template>
 <script>
@@ -33,13 +40,14 @@ export default {
     've-histogram': veHistogram,
     'count-to': countTo
   },
+  //     DIMISSION_NUM: this.data['DIMISSION_NUM'] || {},
   computed: {
     items() {
       return {
         TEACHER_NUM: this.data['TEACHER_NUM'] || {},
         FULL_TIME_NUM: this.data['FULL_TIME_NUM'] || {},
         PART_TIME_NUM: this.data['PART_TIME_NUM'] || {},
-        DIMISSION_NUM: this.data['DIMISSION_NUM'] || {},
+
       }
     },
     chartExtend() {

src/views/main/baseinfo/index.vue

@@ -39,10 +39,16 @@
         <studentbaseinfo :data="dataInfo" />
       </el-col>
       <el-col :xs="24" :sm="24" :md="6" :xl="6">
-        <studentbaseinfo :data="dataInfo" />
+          <operate :data="dataInfo"/>
       </el-col>
       <el-col :xs="24" :sm="24" :md="9" :xl="9">
-        <studentbaseinfo :data="dataInfo" />
+        <hrdata :data="dataInfo"/>
+      </el-col>
+        <el-col :xs="24" :sm="24" :md="12">
+        <student :data="dataInfo"/>
+      </el-col>
+        <el-col :xs="24" :sm="24" :md="12">
+        <student :data="dataInfo"/>
       </el-col>
       <el-col :xs="24" :sm="24" :md="12">
         <student :data="dataInfo"/>
@@ -56,12 +62,12 @@
       <el-col :xs="24" :sm="24" :md="12">
         <curriculum :data="dataInfo"/>
       </el-col>
-      <el-col :xs="24" :sm="24" :md="12">
+      <!-- <el-col :xs="24" :sm="24" :md="12">
         <operate :data="dataInfo"/>
-      </el-col>
-      <el-col :xs="24" :sm="24" :md="12">
+      </el-col> -->
+      <!-- <el-col :xs="24" :sm="24" :md="12">
         <hrdata :data="dataInfo"/>
-      </el-col>
+      </el-col> -->
     </el-row>
   </div>
 </template>
@@ -193,4 +199,18 @@ export default {
       padding: 0;
     }
   }
+
+</style>
+<style lang="scss">
+  .box {
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+  .shape {
+      margin-right: 10px;
+      height: 18px;
+      width: 4px;
+      background-color: #14928a;
+}
+}
 </style>

src/views/main/baseinfo/operate.vue

@@ -1,5 +1,12 @@
 <template>
-  <el-card header="运营数据">
+  <el-card >
+          <div slot="header" class="clearfix">
+        <div class="box">
+          <span class='shape'></span>
+          <span>运营数据</span>
+        </div>
+
+      </div>
     <statistic class="statistic" :cols="0">
       <statistic-item v-for="(item, key) in items" :key="key" :class="{active: active === key}" @click="active = key">
         <span>
@@ -9,18 +16,18 @@
           </el-tooltip>
         </span>
         <span>
-          <count-to :endVal="item.percent"/>
+          <count-to :endVal="item.percent"/>个
         </span>
       </statistic-item>
     </statistic>
-    <ve-histogram
+    <!-- <ve-histogram
       style="width: 100%;"
       height="350px"
       :data="chartData"
       :data-empty="dataEmpty"
       :data-zoom="dataZoom"
       :extend="chartExtend"
-    ></ve-histogram>
+    ></ve-histogram> -->
   </el-card>
 </template>
 <script>
@@ -37,7 +44,7 @@ export default {
     items() {
       return {
         SCHOOL: this.data['SCHOOL'] || {},
-        MUSIC_GROUP_NUM: this.data['MUSIC_GROUP_NUM'] || {},
+        PROGRESS_MUSIC_GROUP_NUM: this.data['PROGRESS_MUSIC_GROUP_NUM'] || {},
       }
     },
     chartExtend() {

src/views/main/baseinfo/studentBaseinfo.vue

@@ -2,7 +2,11 @@
   <div>
     <el-card>
       <div slot="header" class="clearfix">
-        <span>学员数据</span>
+        <div class="box">
+          <span class='shape'></span>
+          <span>学员数据</span>
+        </div>
+
       </div>
       <statistic :col="5" class="statistic" :cols="0">
         <statistic-item
@@ -26,15 +30,16 @@
             </el-tooltip>
           </span>
           <span>
-            <count-to :endVal="item.percent" />
+            <count-to :endVal="item.percent" />人
           </span>
         </statistic-item>
-        <statistic-item>
+
+        <statistic-item v-if='data["CHARGE_STUDENT_CHANGE_RATE"]'>
           <span>
-            {{ data["STUDENT_CONVERSION"].title }}
+            {{ data["CHARGE_STUDENT_CHANGE_RATE"].title }}
             <el-tooltip
-              v-if="data['STUDENT_CONVERSION'].desc"
-              :content="data['STUDENT_CONVERSION'].desc"
+              v-if="data['CHARGE_STUDENT_CHANGE_RATE'].desc"
+              :content="data['CHARGE_STUDENT_CHANGE_RATE'].desc"
               :open-delay="0.3"
               placement="top"
             >
@@ -45,7 +50,26 @@
             </el-tooltip>
           </span>
           <span>
-            <count-to :endVal="data['STUDENT_CONVERSION'].percent" />%
+            <count-to :endVal="data['CHARGE_STUDENT_CHANGE_RATE'].percent" />%
+          </span>
+        </statistic-item>
+           <statistic-item v-if='data["ACTIVATION_RATE"]'>
+          <span>
+            {{ data["ACTIVATION_RATE"].title }}
+            <el-tooltip
+              v-if="data['ACTIVATION_RATE'].desc"
+              :content="data['ACTIVATION_RATE'].desc"
+              :open-delay="0.3"
+              placement="top"
+            >
+              <i
+                style="margin-left: 5px; cursor: pointer"
+                class="el-icon-warning-outline"
+              />
+            </el-tooltip>
+          </span>
+          <span>
+            <count-to :endVal="data['ACTIVATION_RATE'].percent" />%
           </span>
         </statistic-item>
       </statistic>
@@ -60,22 +84,23 @@ export default {
     "count-to": countTo,
   },
   data() {
-    return {};
+    return {
+      active:''
+    };
   },
   computed: {
     dataEmpty() {
       return !this.chartData.rows.length;
     },
+    //         CHARGE_STUDENT_CHANGE_RATE: this.data['CHARGE_STUDENT_CHANGE_RATE'] || {},
+    //    ACTIVATION_RATE: this.data['ACTIVATION_RATE'] || {},
     items() {
       return {
-        MUSIC_GROUP_STUDENT: this.data['MUSIC_GROUP_STUDENT'] || {},
-        OTHER_STUDENT: this.data['OTHER_STUDENT'] || {},
-        NEWLY_STUDENT_NUM: this.data['NEWLY_STUDENT_NUM'] || {},
-        QUIT_MUSIC_GROUP_STUDENT_NUM: this.data['QUIT_MUSIC_GROUP_STUDENT_NUM'] || {},
+        STUDENT_REGISTRATION_NUM: this.data['STUDENT_REGISTRATION_NUM'] || {},
+
       }
     },
   },
 };
 </script>
-<style lang="scss" scoped>
-</style>
+