修改测试计划

src/components/PlanReport.vue

@@ -90,10 +90,9 @@
         <el-pagination
           class="pag_class"
           background
-          @size-change="handleSizeChange"
           @current-change="handleCurrentChange"
           :current-page.sync="pageNum"
-          layout="total, sizes, prev, pager, next"
+          layout="total, prev, pager, next"
           :page-size="pageSize"
           :page-sizes="[10, 20, 50, 100]"
           :total="total"
@@ -115,48 +114,102 @@
               <!-- <el-option label="抑郁" value="抑郁"></el-option>
               <el-option label="压力" value="躯体化"></el-option>
               <el-option label="精神障碍" value="精神障碍"></el-option> -->
+              <!-- collapse-tags -->
             </el-select>
           </el-form-item>
           <el-form-item label="组织架构选择">
             <el-select
+              multiple
               v-model="orgName"
               @change="userOrgName"
               placeholder="请选择组织架构"
             >
               <el-option
+                style="width: 200px"
                 v-for="item in orgList"
                 :key="item.id"
                 :label="item.orgName"
                 :value="item.orgNo"
               ></el-option>
-              <!-- <el-option label="抑郁" value="抑郁"></el-option>
-              <el-option label="压力" value="躯体化"></el-option>
-              <el-option label="精神障碍" value="精神障碍"></el-option> -->
             </el-select>
           </el-form-item>
         </el-form>
-        <el-tabs type="border-card" @tab-click="tabFun">
-          <el-tab-pane v-for="item in subDimeList" :key="item.id" :label="item.paramName">
-          <!-- {{item.paramName}} -->
-          <el-form :inline="true" class="demo-form-inline">
-          <el-form-item label="维度选择">
-            <el-select
-              v-model="dime"
-              @change="userDimensionality"
-              placeholder="请选择维度"
-            >
+        <el-tabs type="border-card" @tab-click="tabFun" v-model="tabName">
+          <el-tab-pane
+            v-for="item in subDimeList"
+            :key="item.id"
+            :label="item.paramName"
+            :name="item.paramValue"
+          >
+            <!-- @click="tabFun(item)" -->
+            <!-- {{item.paramName}} -->
+          </el-tab-pane>
+        </el-tabs>
+        <el-form :inline="true" class="demo-form-inline" style="margin-top: 20px">
+          <el-form-item label="请选择">
+            <el-select v-model="subValue" @change="userSubFun" placeholder="请选择">
               <el-option
-                v-for="item in dimeList"
-                :key="item.id"
-                :label="item.paramName"
-                :value="item.paramValue"
+                v-for="item in subOption"
+                :key="item"
+                :label="item"
+                :value="item"
               ></el-option>
             </el-select>
           </el-form-item>
         </el-form>
-          
-          </el-tab-pane>
-        </el-tabs>
+        <div class="chart_wrap">
+          <PieChart
+            :options="options7"
+            chartId="myPieChart7"
+            chartName="存在心理健康情况"
+          />
+        </div>
+        <el-table
+          :data="subData"
+          :row-style="{ height: '0px' }"
+          :cell-style="{ padding: '5px' }"
+          :header-cell-style="{ background: '#F8F8F8', color: '#606266' }"
+        >
+          <el-table-column
+            show-overflow-tooltip
+            prop="userName"
+            label="姓名"
+            align="center"
+            width=""
+          >
+          </el-table-column>
+          <el-table-column prop="userNo" label="学号" align="center" width="">
+          </el-table-column>
+          <el-table-column prop="orgName" label="所属组织架构" align="center" width="">
+          </el-table-column>
+          <el-table-column
+            prop="dimensionName"
+            label="维度"
+            :formatter="forDimen"
+            align="center"
+            width=""
+          >
+          </el-table-column>
+          <el-table-column
+            prop="isComplete"
+            label="是否已完成"
+            :formatter="formaCom"
+            align="center"
+            width=""
+          >
+          </el-table-column>
+        </el-table>
+        <el-pagination
+          class="pag_class"
+          background
+          @current-change="subHandleCurrentChange"
+          :current-page.sync="subPageNum"
+          layout="total, prev, pager, next"
+          :page-size="subPageSize"
+          :page-sizes="[10, 20, 50, 100]"
+          :total="subTotal"
+        >
+        </el-pagination>
       </div>
     </el-dialog>
 
@@ -193,6 +246,7 @@ export default {
       options4: [],
       options5: [],
       options6: [],
+      options7: [],
       completeNum: 0,
       unComplete: 0,
       userType: "未完成",
@@ -203,9 +257,24 @@ export default {
       //组织架构列表
       orgList: [],
       //组织编号name
-      orgName: "",
+      orgName: [],
       //子维度的列表
-      subDimeList:[],
+      subDimeList: [],
+      //子维度默认绑定的值
+      tabName: "1",
+      //子维度的子选项
+      subValue: "",
+      subOption: [],
+
+      //子维度的人员显示数组
+      subData: [],
+      //子维度--第几页
+      subPageNum: 1,
+      //子维度--一页多少条
+      subPageSize: 10,
+      //子维度总共多少条
+      subTotal: 0,
+
       dimensionName: "",
     };
   },
@@ -255,22 +324,55 @@ export default {
     // myChart.setOption(option_bing);
   },
   methods: {
+    //格式化页面数据
+    forDimen(row) {
+      if (row.dimensionName == "躯体化") {
+        return "压力";
+      } else {
+        return row.dimensionName;
+      }
+    },
+    //当子选项改变
+    userSubFun(val) {
+      //子选项改变以后----需要显示
+      //渲染占比
+      //改变以后需要调用--且显示饼状图
+      //调用统计
+      let params = {
+        dimensionName: this.dime,
+        orgList: [],
+        planId: this.planId,
+        quesType: this.tabName,
+        quesValue: this.subValue,
+      };
+      this.queryBread(params);
+    },
     //tab状态改变
     tabFun(a) {
-      console.log(a)
-      //根据已选的tab --- 
+      this.subValue = "";
+      this.tabName = a.name;
+      //根据已选的tab ---
       //根据已选的value--
       //开始查询下边的小项
-
+      this.getSubOption(a.paneName);
       //根据点击的name---查询里边的选项
       //查询出来  下边的选项
-
-      
     },
     //组织架构--选择变化
-    userOrgName() {},
+    userOrgName() {
+      let params = {
+        dimensionName: this.dime,
+        orgList: [],
+        planId: this.planId,
+        quesType: this.tabName,
+        quesValue: this.subValue,
+      };
+      this.queryBread(params);
+    },
     //维度选择
-    userDimensionality() {},
+    userDimensionality() {
+      this.queryStudentData();
+    },
     open(val) {
       this.planId = val.id;
       this.planName = val.planName;
@@ -324,7 +426,6 @@ export default {
         {},
         (res) => {
           let dimensionList = res.data;
-          debugger;
           this.options1 = [
             { value: this.completeNum + this.unComplete, name: "已完成人数" },
             { value: this.unComplete, name: "未完成占比" },
@@ -467,7 +568,7 @@ export default {
     getOrgList() {
       this.$http.get(`/planOrg/findAllByPlanId?planId=${this.planId}`, {}, (res) => {
         if (res && res.code == 200) {
-          debugger;
+          this.orgName = [res.data[0].orgNo];
           this.orgList = res.data;
         } else {
           this.$message.error(res.msg);
@@ -478,27 +579,101 @@ export default {
     getSexList() {
       this.$http.get(`/param/findAllByType?type=ques`, {}, (res) => {
         if (res && res.code == 200) {
-          debugger;
           this.subDimeList = res.data;
+          //调用性别的选项
+
+          this.getSubOption(this.tabName);
         } else {
           this.$message.error(res.msg);
         }
       });
     },
     //获取子维度的下边的选项
-    getSubOption(val){
+    getSubOption(val) {
       this.$http.get(`/questionnaire/findListById?id=${val}`, {}, (res) => {
         if (res && res.code == 200) {
-          debugger;
-          
+          this.subOption = res.data;
+          this.subValue = res.data[0];
+          let params = {
+            dimensionName: this.dime,
+            orgList: [],
+            planId: this.planId,
+            quesType: this.tabName,
+            quesValue: this.subValue,
+          };
+          this.queryBread(params);
         } else {
           this.$message.error(res.msg);
         }
       });
     },
+    //查询--最终的子维度的---饼图
+    queryBread(params) {
+      // dimensionName :this.dime,
+      //   orgList:[],
+      //   planId :this.planId,
+      //   quesType:this.tabName,
+      //   quesValue:this.subValue
+
+      this.$http.get(
+        `/userRecordScore/countByPlanIdAndOrgListAndQues?dimensionName=${params.dimensionName}&orgList=${params.orgList}&planId=${params.planId}&quesType=${params.quesType}&quesValue=${params.quesValue}`,
+        {},
+        (res) => {
+          if (res && res.code == 200) {
+            console.log("饼图数据");
+            console.log(res.data);
+            this.options7 = [
+              {
+                value: res.data.totalNum,
+                name: "已完成人数",
+              },
+              { value: res.data.highNum, name: this.subValue },
+            ];
+            this.queryStudentData();
+            //调用接口开始查询选择的列表
+          } else {
+            this.$message.error(res.msg);
+          }
+        }
+      );
+    },
+    queryStudentData() {
+      let params = {
+        dimensionName: this.dime,
+        orgList: this.orgName,
+        planId: this.planId,
+        quesType: this.tabName,
+        quesValue: this.subValue,
+      };
+      //修改文本
+      //获取需要传输的参数
+      this.$http.get(
+        `/userRecordScore/findByPlanIdAndOrgListAndQuesList?dimensionName=${params.dimensionName}&orgList=${params.orgList}&pageNum=${this.subPageNum}&pageSize=${this.subPageSize}&planId=${params.planId}&quesType=${params.quesType}&quesValue=${params.quesValue}`,
+        {},
+        (res) => {
+          if (res && res.code == 200) {
+            this.subData = res.data.content;
+            this.subTotal = res.data.totalElements;
+            //调用接口开始查询选择的列表
+          } else {
+            this.$message.error(res.msg);
+          }
+        }
+      );
+    },
+    //子项当前页改变
+    subHandleCurrentChange(val) {
+      this.subPageNum = val;
+      this.queryStudentData();
+    },
   },
 };
 </script>
+<style>
+.el-tabs__content {
+  display: contents !important;
+}
+</style>
 <style lang="less" scoped>
 .pag_class /deep/ .el-input__inner {
   width: 100% !important;