使用分析，集团管理元交互

梁保满
1 parent 3a9aa32b
Showing 4 changed files with 125 additions and 18 deletions
src/components/charts/barChart.vue
src/views/standard/analysis/index.vue
src/views/standard/setUp/conglomerate.vue
src/views/standard/setUp/teacher.vue
@@ -116,6 +116,9 @@ export default {
       this.chart?.clear();
       this.chart.setOption(options, true);
     },
+    clearChart(){
+       this.chart?.clear();
+    },
   },
 };
 </script>
@@ -4,10 +4,22 @@
       <template slot="title">
         <span>使用分析</span>
       </template>
+      <template slot="btns">
+        <el-tooltip effect="dark" content="导出报表" placement="bottom">
+          <el-button
+            type="primary"
+            icon="fa fa-cloud-download"
+            size="mini"
+            plain
+            circle
+            @click="downExc"
+          ></el-button>
+        </el-tooltip>
+      </template>
     </back-box>
     <div class="page-content">
       <ul class="params-box">
-        <li class="item">
+        <li class="item item3">
           <span class="s-txt">时间段：</span>
           <div class="sel-box">
             <div class="d1">
@@ -54,6 +66,15 @@
               >
             </p>
           </div>
+          <el-button
+            class="btn"
+            v-if="role == 'ROLE_JITUAN'"
+            type="primary"
+            round
+            size="small"
+            @click="resetRank"
+            >使用频率排名</el-button
+          >
         </li>
         <li class="item item2" v-for="(item, index) in query.secGraClaSub">
           <span class="s-txt">对比项{{ setBigNum(index) }}：</span>
@@ -76,16 +97,22 @@
           <span class="s-txt"></span>
           <div class="disflex-b">
             <el-button
-              v-show="query.secGraClaSub.length < 10"
-              class="btn"
+              class="btn btn-none"
+              :class="query.secGraClaSub.length < 10 ? '' : 'active'"
               icon="el-icon-plus"
               size="small"
               round
               @click="addQuery"
               >添加对比项</el-button
             >
-            <el-button class="btn" round size="small" @click="getData"
-              >确定</el-button
+            <el-button
+              v-show="query.secGraClaSub.length"
+              class="btn"
+              type="primary"
+              round
+              size="small"
+              @click="getData"
+              >多项对比</el-button
             >
           </div>
         </li>
@@ -99,7 +126,7 @@
  
 <script>
 import barChart from "@/components/charts/barChart";
-import { formatDate } from "@/utils";
+import { formatDate, downloadFile } from "@/utils";
 export default {
   components: {
     barChart,
@@ -180,10 +207,35 @@ export default {
       this.query.startDay = formatDate(new Date(), "yyyy-MM-dd");
       this.query.endDay = formatDate(new Date(), "yyyy-MM-dd");
     }
-    this.setDate(4);
+    this.setDate(3);
     this._QueryData();
   },
   methods: {
+    async downExc() {
+      if (this.exportLoading == true) return;
+      let query = {
+        //搜索条件
+        startDay: this.query.startDay,
+        endDay: this.query.endDay,
+        day: this.query.day,
+      };
+      this.exportLoading = true;
+
+      const exportUsageAnalysis =
+        this.role != "ROLE_JITUAN"
+          ? this.$request.exportUsageAnalysis
+          : this.$request.exportSchoolContrast;
+      const data = await exportUsageAnalysis({ ...query });
+      this.exportLoading = false;
+      if (data) {
+        let blob = new Blob([data], {
+          type: "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet",
+        });
+        downloadFile("使用分析.xlsx", blob);
+      } else {
+        this.$message.error("下载失败");
+      }
+    },
     addQuery() {
       this.query.secGraClaSub.push([]);
       this.query.secGraClaSubName.push("");
@@ -194,7 +246,7 @@ export default {
       })[0];
     },
     secGraClaSubChange(event, index) {
-      console.log(event)
+      console.log(event);
       let txt = "";
       let xx = this.filterObj(this.gradeList, event[0]);
       txt += xx.label;
@@ -345,6 +397,17 @@ export default {
       }
       return query;
     },
+    async resetRank() {
+      this.query.secGraClaSub = [];
+      this.query.secGraClaSubName = [];
+      this.chartData[0].value = [];
+      this.chartData[1].value = [];
+      this.xAxis = [];
+      this.$refs.barChart.clearChart();
+      await this._QuerySchool();
+      await this._QueryGradeList();
+      this._QueryData();
+    },
     async _QueryData() {
       this.loading = true;
       let query = this.setQuery();
@@ -359,9 +422,9 @@ export default {
       if (status === 0) {
         this.chartData[0].value = [];
         this.chartData[1].value = [];
-        this.xAxis = this.query.secGraClaSubName.map(item=>{
-          let arr = item.split('/')
-          return  arr[0]+'\n'+ arr.slice(1,arr.length).join('/')
+        this.xAxis = this.query.secGraClaSubName.map((item) => {
+          let arr = item.split("/");
+          return arr[0] + "\n" + arr.slice(1, arr.length).join("/");
         });
         data?.list.map((item, index) => {
           this.chartData[0].value.push(item.periodCount);
@@ -482,7 +545,12 @@ export default {
     },
     async _QuerySchool() {
       this.loading = true;
-      const { data, status, info } = await this.$request.schoolList();
+      const { data, status, info } = await this.$request.schoolList({
+        needSort: 1,
+        day: this.query.day,
+        startDay: this.query.startDay,
+        endDay: this.query.endDay,
+      });
       this.loading = false;
       if (status === 0) {
         this.schoolList = [...data.list] || [];
@@ -511,11 +579,26 @@ div::-webkit-scrollbar-thumb {
   display: flex;
   justify-content: space-between;
   align-items: center;
+  .btn-none {
+    border: none;
+    background: none;
+  }
+  .active {
+    transform: translateX(-999999px);
+  }
+}
+.item3 {
+  .sel-box {
+    flex: 1;
+  }
 }
 .sel-box {
   display: flex;
   align-items: center;
   flex-wrap: nowrap;
+  .btn {
+    margin-left: 100px;
+  }
   .sel {
     width: 8%;
     min-width: 160px;
@@ -591,6 +674,9 @@ div::-webkit-scrollbar-thumb {
   .item2 {
     width: 50%;
   }
+  .item3 {
+    padding-right: 100px;
+  }
 }
 .chart-box {
   height: 400px;
@@ -86,7 +86,8 @@
         </div>
       </div>
     </div>
-    <el-dialog :close-on-click-modal="false"
+    <el-dialog
+      :close-on-click-modal="false"
       :title="isAdd ? '添加区域/集团' : '修改区域/集团'"
       :visible.sync="diaCL"
       width="400"
@@ -113,7 +114,12 @@
         <el-button round @click="diaCL = false">取 消</el-button>
       </div>
     </el-dialog>
-    <el-dialog :close-on-click-modal="false" title="添加管理员" :visible.sync="diaAdmin" width="400">
+    <el-dialog
+      :close-on-click-modal="false"
+      title="添加管理员"
+      :visible.sync="diaAdmin"
+      width="400"
+    >
       <el-form
         class="form-box"
         ref="formAdmin"
@@ -158,7 +164,12 @@
         <el-button round @click="diaAdmin = false">取 消</el-button>
       </div>
     </el-dialog>
-    <el-dialog :close-on-click-modal="false" title="添加学校" :visible.sync="diaSchool" width="400">
+    <el-dialog
+      :close-on-click-modal="false"
+      title="添加学校"
+      :visible.sync="diaSchool"
+      width="400"
+    >
       <el-form
         class="form-box"
         ref="formSchool"
@@ -208,7 +219,12 @@
         <el-button round @click="diaSchool = false">取 消</el-button>
       </div>
     </el-dialog>
-    <el-dialog :close-on-click-modal="false" title="学校信息修改" :visible.sync="diaSchool2" width="400">
+    <el-dialog
+      :close-on-click-modal="false"
+      title="学校信息修改"
+      :visible.sync="diaSchool2"
+      width="400"
+    >
       <el-form
         class="form-box"
         ref="formSchool2"
@@ -470,6 +486,7 @@ export default {
       this.loading = true;
       const { data, status, info } = await this.$request.schoolList({
         regionId: this.showId,
+        needCount: 1,
       });
       this.loading = false;
       if (status === 0) {
@@ -45,6 +45,7 @@
           class="sel sel2"
           clearable
           placeholder="选择范围"
+          @change="_QueryData(1)"
           v-model="query.gradeClassSub"
           :options="gradeClassSubList"
           :props="{
@@ -93,9 +94,9 @@
             @click="_QueryData(3)"
           ></el-button>
         </el-input>
-        <el-button class="serach-box" round @click="_QueryData(1)"
+        <!-- <el-button class="serach-box" round @click="_QueryData(4)"
           >筛选</el-button
-        >
+        > -->
       </div>
     </div>
     <p class="total" v-if="teacherList.length">