新增数据报告列表功能

src/components/pages/components/classReport.vue

@@ -3,7 +3,7 @@
     <div class="search">
       <div class="student_search">
         <div>班级筛选</div>
-        <el-select v-model="classChoose">
+        <el-select v-model="classChoose" @change="searchStudent">
           <el-option label="全部" value="">全部</el-option>
           <el-option
             v-for="(c, cIndex) in classJuri"
@@ -13,17 +13,23 @@
           ></el-option>
         </el-select>
       </div>
-      <div>
+      <div class="rightSearch">
         <div class="searchImg">
           <img src="../../../assets/icon/search.png" alt="" />
         </div>
         <el-input v-model="sName" placeholder="请输入学生姓名或账号"></el-input>
+        <el-button size="mini" type="primary" @click="searchStudent"
+          >查询</el-button
+        >
       </div>
     </div>
     <el-table
       :data="tableData"
       border
+      :fit="true"
+      v-loading="isLoading"
       style="width: 100%"
+      :header-cell-style="{ background: '#f1f1f1', fontSize: '17px' }"
       :row-class-name="tableRowClassName"
     >
       <el-table-column prop="cName" align="center" label="班级" min-width="25%">
@@ -32,17 +38,30 @@
         prop="course"
         align="center"
         label="课程"
-        min-width="25%"
+        min-width="40%"
       >
       </el-table-column>
       <el-table-column label="操作" align="center" min-width="25%">
-        <template>
-          <el-button size="mini" type="primary" @click="lookEvaStudent"
+        <template slot-scope="scope">
+          <el-button
+            size="mini"
+            type="primary"
+            @click="lookEvaCourse(scope.row.id)"
             >报告</el-button
           >
         </template>
       </el-table-column>
     </el-table>
+    <div class="student_page">
+      <el-pagination
+        background
+        layout="prev, pager, next"
+        :page-size="10"
+        :total="total"
+        v-if="page"
+        @current-change="handleCurrentChange"
+      ></el-pagination>
+    </div>
     <el-dialog
       title="选择学生"
       :visible.sync="dialogVisible"
@@ -52,45 +71,31 @@
       class="dialog_diy"
     >
       <div>
-        <div>
-          <div class="student_search">
-            <div>筛选</div>
-            <el-select v-model="classChoose1">
-              <el-option label="全部" value="">全部</el-option>
-              <el-option
-                v-for="(c, cIndex) in classJuri"
-                :key="cIndex"
-                :value="c.id"
-                :label="c.name"
-              ></el-option>
-            </el-select>
-          </div>
-          <el-table
-            :data="studentJuri"
-            border
-            style="width: 100%; margin-top: 10px"
-            :row-class-name="tableRowClassName"
+        <el-table
+          :data="studentJuri"
+          border
+          v-loading="isLoading1"
+          style="width: 100%; margin-top: 10px"
+          :row-class-name="tableRowClassName"
+        >
+          <el-table-column
+            prop="sName"
+            align="center"
+            label="姓名"
+            min-width="25%"
           >
-            <el-table-column
-              prop="sName"
-              align="center"
-              label="姓名"
-              min-width="25%"
-            >
-            </el-table-column>
-            <el-table-column label="选择" align="center" min-width="25%">
-              <template slot-scope="scope">
-                <input
-                  type="checkbox"
-                  :id="scope.row.id"
-                  :value="scope.row.sNmae"
-                  @change="isChooseStudent(scope.row.id)"
-                  v-model="checkboxList[scope.$index]"
-                />
-              </template>
-            </el-table-column>
-          </el-table>
-        </div>
+          </el-table-column>
+          <el-table-column label="选择" align="center" min-width="25%">
+            <template slot-scope="scope">
+              <input
+                type="checkbox"
+                :id="scope.row.userid"
+                :value="scope.row.sName"
+                @change="isChooseS(scope.row.userid)"
+              />
+            </template>
+          </el-table-column>
+        </el-table>
       </div>
       <span slot="footer" class="dialog-footer">
         <el-button @click="dialogVisible = false">取 消</el-button>
@@ -104,49 +109,34 @@
 
 <script>
 export default {
+  props: ["ooid"],
   data() {
     return {
       sName: "",
       classChoose: "",
-      classChoose1: "",
-      classJuri: [
-        { id: 1, name: "一年级一班" },
-        { id: 2, name: "一年级二班" },
-        { id: 3, name: "一年级三班" },
-        { id: 4, name: "一年级四班" },
-      ],
-      tableData: [
-        {
-          cName: "四年级二班",
-          course: "课程1/课程2/课程3",
-        },
-        {
-          cName: "四年级二班",
-          course: "课程1/课程2",
-        },
-        {
-          cName: "四年级二班",
-          course: "课程1",
-        },
-        {
-          cName: "四年级二班",
-          course: "课程1/课程2/课程3/课程4",
-        },
-        {
-          cName: "四年级二班",
-          course: "课程1/课程2/课程3/课程4",
-        },
-      ],
+      isChooseClass: "",
+      page: 1,
+      total: 0,
+      classJuri: [],
+      tableData: [],
       dialogVisible: false,
-      checkboxList: [],
+      isLoading: false,
+      isLoading1: false,
       isChooseList: [],
-      studentJuri: [
-        { id: 1, sName: "牛倩楠" },
-        { id: 2, sName: "徐嘉伟" },
-        { id: 3, sName: "小王" },
-      ],
+      studentJuri: [],
     };
   },
+  watch: {
+    ooid: {
+      immediate: true,
+      deep: true,
+      handler(newValue, oldValue) {
+        this.getClass();
+        this.getCData();
+        this.$forceUpdate();
+      },
+    },
+  },
   methods: {
     tableRowClassName({ row, rowIndex }) {
       if ((rowIndex + 1) % 2 === 0) {
@@ -158,20 +148,88 @@ export default {
     handleClose(done) {
       done();
     },
-    isChooseStudent(id) {
-      if (this.isChooseList.indexOf(id) != -1) {
-        this.isChooseList.splice(this.isChooseList.indexOf(id), 1);
+    handleCurrentChange(val) {
+      this.page = val;
+      this.getCData();
+    },
+    searchStudent() {
+      this.page = 1;
+      this.getCData();
+    },
+    lookEvaCourse(id) {
+      this.isChooseClass = id;
+      this.getSData();
+      this.dialogVisible = true;
+    },
+    isChooseS(uid) {
+      if (this.isChooseList.length > 0) {
+        if (this.isChooseList.indexOf(uid) == -1) {
+          this.isChooseList.push(uid);
+        } else {
+          this.isChooseList.splice(this.isChooseList.indexOf(uid), 1);
+        }
       } else {
-        this.isChooseList.push(id);
+        this.isChooseList.push(uid);
       }
       this.$forceUpdate();
     },
-    lookEvaStudent() {
-      this.checkboxList = [];
-      this.isChooseList = [];
-      this.dialogVisible = true;
+    getClass() {
+      let params = {
+        oid: this.ooid,
+      };
+      this.ajax
+        .get(this.$store.state.api + "selectClassBySchool", params)
+        .then((res) => {
+          this.classJuri = res.data[0];
+        })
+        .catch((err) => {
+          console.error(err);
+        });
+    },
+    getSData() {
+      this.isLoading1 = true;
+      let params = {
+        cu: "",
+        cn: "",
+        oid: this.ooid,
+        page: 1,
+      };
+      this.ajax
+        .get(this.$store.state.api + "selectSr", params)
+        .then((res) => {
+          this.isLoading1 = false;
+          this.studentJuri = res.data[0];
+        })
+        .catch((err) => {
+          this.isLoading1 = false;
+          console.error(err);
+        });
+    },
+    getCData() {
+      this.isLoading = true;
+      let params = {
+        cu: this.sName,
+        cn: this.classChoose,
+        oid: this.ooid,
+        page: this.page,
+      };
+      this.ajax
+        .get(this.$store.state.api + "selectSr", params)
+        .then((res) => {
+          this.isLoading = false;
+          this.total = res.data[0].length > 0 ? res.data[0][0].num : 0;
+          this.tableData = res.data[0];
+        })
+        .catch((err) => {
+          this.isLoading = false;
+          console.error(err);
+        });
     },
   },
+  created() {
+    this.getClass();
+    this.getCData();
+  },
 };
 </script>
 
@@ -239,4 +297,19 @@ export default {
 .student_search > div:nth-child(1) {
   margin-right: 10px;
 }
+.rightSearch {
+  display: flex;
+  flex-direction: row;
+  flex-wrap: nowrap;
+  align-items: center;
+}
+.rightSearch >>> .el-button {
+  margin-left: 5px;
+  height: 35px;
+  width: 80px;
+  font-size: 14px;
+}
+.student_page {
+  margin-top: 10px;
+}
 </style>

src/components/pages/components/courseReport.vue

@@ -4,7 +4,7 @@
       <div class="sxBox">
         <div class="student_search">
           <div>班级筛选</div>
-          <el-select v-model="classChoose">
+          <el-select v-model="classChoose" @change="searchStudent">
             <el-option label="全部" value="">全部</el-option>
             <el-option
               v-for="(c, cIndex) in classJuri"
@@ -16,27 +16,31 @@
         </div>
         <div class="student_search">
           <div>课程筛选</div>
-          <el-select v-model="courseChoose">
+          <el-select v-model="courseChoose" @change="searchStudent">
             <el-option label="全部" value="">全部</el-option>
             <el-option
               v-for="(c, cIndex) in courseJuri"
               :key="cIndex"
-              :value="c.id"
-              :label="c.name"
+              :value="c.courseId"
+              :label="c.title"
             ></el-option>
           </el-select>
         </div>
       </div>
-      <div>
+      <div class="rightSearch">
         <div class="searchImg">
           <img src="../../../assets/icon/search.png" alt="" />
         </div>
         <el-input v-model="sName" placeholder="请输入学生姓名或账号"></el-input>
+        <el-button size="mini" type="primary" @click="searchStudent"
+          >查询</el-button
+        >
       </div>
     </div>
     <el-table
       :data="tableData"
       border
+      v-loading="isLoading"
       style="width: 100%"
       :row-class-name="tableRowClassName"
     >
@@ -55,52 +59,47 @@
         </template>
       </el-table-column>
     </el-table>
+    <div class="student_page">
+      <el-pagination
+        background
+        layout="prev, pager, next"
+        :page-size="10"
+        :total="total"
+        v-if="page"
+        @current-change="handleCurrentChange"
+      ></el-pagination>
+    </div>
   </div>
 </template>
 
 <script>
 export default {
+  props: ["ooid"],
   data() {
     return {
       sName: "",
       classChoose: "",
-      classJuri: [
-        { id: 1, name: "一年级一班" },
-        { id: 2, name: "一年级二班" },
-        { id: 3, name: "一年级三班" },
-        { id: 4, name: "一年级四班" },
-      ],
+      classJuri: [],
       courseChoose: "",
-      courseJuri: [
-        { id: 1, name: "课程1" },
-        { id: 2, name: "课程2" },
-        { id: 3, name: "课程3" },
-        { id: 4, name: "课程4" },
-      ],
-      tableData: [
-        {
-          cName: "四年级二班",
-          course: "课程1/课程2/课程3",
-        },
-        {
-          cName: "四年级二班",
-          course: "课程1/课程2",
-        },
-        {
-          cName: "四年级二班",
-          course: "课程1",
-        },
-        {
-          cName: "四年级二班",
-          course: "课程1/课程2/课程3/课程4",
-        },
-        {
-          cName: "四年级二班",
-          course: "课程1/课程2/课程3/课程4",
-        },
-      ],
+      page: 1,
+      total: 0,
+      courseJuri: [],
+      tableData: [],
+      isLoading: false,
     };
   },
+  watch: {
+    ooid: {
+      immediate: true,
+      deep: true,
+      handler(newValue, oldValue) {
+        this.getClass();
+        this.getCourse();
+        this.getCourseData();
+        this.$forceUpdate();
+      },
+    },
+  },
   methods: {
     tableRowClassName({ row, rowIndex }) {
       if ((rowIndex + 1) % 2 === 0) {
@@ -111,8 +110,65 @@ export default {
     },
     handleCurrentChange(val) {
       this.page = val;
+      this.getCourseData();
+    },
+    searchStudent() {
+      this.page = 1;
+      this.getCourseData();
+    },
+    getClass() {
+      let params = {
+        oid: this.ooid,
+      };
+      this.ajax
+        .get(this.$store.state.api + "selectClassBySchool", params)
+        .then((res) => {
+          this.classJuri = res.data[0];
+        })
+        .catch((err) => {
+          console.error(err);
+        });
+    },
+    getCourse() {
+      let params = {
+        oid: this.ooid,
+      };
+      this.ajax
+        .get(this.$store.state.api + "selectCourseByOid", params)
+        .then((res) => {
+          this.courseJuri = res.data[0];
+        })
+        .catch((err) => {
+          console.error(err);
+        });
+    },
+    getCourseData() {
+      this.isLoading = true;
+      let params = {
+        cu: this.sName,
+        cn: this.classChoose,
+        cl: this.courseChoose,
+        oid: this.ooid,
+        page: this.page,
+      };
+      this.ajax
+        .get(this.$store.state.api + "selectCourseR", params)
+        .then((res) => {
+          this.isLoading = false;
+          this.total = res.data[0].length > 0 ? res.data[0][0].num : 0;
+          this.tableData = res.data[0];
+        })
+        .catch((err) => {
+          this.isLoading = false;
+          console.error(err);
+        });
     },
   },
+  created() {
+    this.getClass();
+    this.getCourse();
+    this.getCourseData();
+  },
 };
 </script>
 
@@ -163,4 +219,19 @@ export default {
   flex-wrap: nowrap;
   align-items: center;
 }
+.rightSearch {
+  display: flex;
+  flex-direction: row;
+  flex-wrap: nowrap;
+  align-items: center;
+}
+.rightSearch >>> .el-button {
+  margin-left: 5px;
+  height: 35px;
+  width: 80px;
+  font-size: 14px;
+}
+.student_page {
+  margin-top: 10px;
+}
 </style>

src/components/pages/components/evaReport.vue

@@ -4,7 +4,7 @@
       <div class="sxBox">
         <div class="student_search">
           <div>班级筛选</div>
-          <el-select v-model="classChoose">
+          <el-select v-model="classChoose" @change="searchStudent">
             <el-option label="全部" value="">全部</el-option>
             <el-option
               v-for="(c, cIndex) in classJuri"
@@ -16,32 +16,36 @@
         </div>
         <div class="student_search">
           <div>课程筛选</div>
-          <el-select v-model="courseChoose">
+          <el-select v-model="courseChoose" @change="searchStudent">
             <el-option label="全部" value="">全部</el-option>
             <el-option
               v-for="(c, cIndex) in courseJuri"
               :key="cIndex"
-              :value="c.id"
-              :label="c.name"
+              :value="c.courseId"
+              :label="c.title"
             ></el-option>
           </el-select>
         </div>
       </div>
-      <div>
+      <div class="rightSearch">
         <div class="searchImg">
           <img src="../../../assets/icon/search.png" alt="" />
         </div>
         <el-input v-model="sName" placeholder="请输入学生姓名或账号"></el-input>
+        <el-button size="mini" type="primary" @click="searchStudent"
+          >查询</el-button
+        >
       </div>
     </div>
     <el-table
       :data="tableData"
       border
+      v-loading="isLoading"
       style="width: 100%"
       :row-class-name="tableRowClassName"
     >
       <el-table-column
-        prop="mEva"
+        prop="eTitle"
         align="center"
         label="目标体系名称"
         min-width="25%"
@@ -64,6 +68,16 @@
         </template>
       </el-table-column>
     </el-table>
+    <div class="student_page">
+      <el-pagination
+        background
+        layout="prev, pager, next"
+        :page-size="10"
+        :total="total"
+        v-if="page"
+        @current-change="handleCurrentChange"
+      ></el-pagination>
+    </div>
     <el-dialog
       title="选择学生"
       :visible.sync="dialogVisible"
@@ -75,13 +89,13 @@
       <div>
         <div>
           <el-table
-            :data="courseJuri1"
+            :data="tableData"
             border
             style="width: 100%; margin-top: 10px"
             :row-class-name="tableRowClassName"
           >
             <el-table-column
-              prop="cName"
+              prop="course"
               align="center"
               label="课程名称"
               min-width="25%"
@@ -91,10 +105,9 @@
               <template slot-scope="scope">
                 <input
                   type="checkbox"
-                  :id="scope.row.id"
-                  :value="scope.row.sNmae"
-                  @change="isChooseStudent(scope.row.id, scope.$index)"
-                  v-model="checkboxList[scope.$index]"
+                  :id="scope.row.courseId"
+                  :value="scope.row.title"
+                  @change="isChooseS(scope.row.courseId)"
                 />
               </template>
             </el-table-column>
@@ -113,61 +126,34 @@
 
 <script>
 export default {
+  props: ["ooid"],
   data() {
     return {
       sName: "",
       classChoose: "",
-      classJuri: [
-        { id: 1, name: "一年级一班" },
-        { id: 2, name: "一年级二班" },
-        { id: 3, name: "一年级三班" },
-        { id: 4, name: "一年级四班" },
-      ],
+      classJuri: [],
       courseChoose: "",
-      courseJuri: [
-        { id: 1, name: "课程1" },
-        { id: 2, name: "课程2" },
-        { id: 3, name: "课程3" },
-        { id: 4, name: "课程4" },
-      ],
-      courseJuri1: [
-        { id: 1, cName: "课程名称1" },
-        { id: 2, cName: "课程名称2" },
-        { id: 3, cName: "课程名称3" },
-        { id: 4, cName: "课程名称4" },
-      ],
-      tableData: [
-        {
-          mEva: "目标体系1",
-          cName: "四年级二班",
-          course: "课程1/课程2/课程3",
-        },
-        {
-          mEva: "目标体系2",
-          cName: "四年级二班",
-          course: "课程1/课程2",
-        },
-        {
-          mEva: "目标体系3",
-          cName: "四年级二班",
-          course: "课程1",
-        },
-        {
-          mEva: "目标体系4",
-          cName: "四年级二班",
-          course: "课程1/课程2/课程3/课程4",
-        },
-        {
-          mEva: "目标体系5",
-          cName: "四年级二班",
-          course: "课程1/课程2/课程3/课程4",
-        },
-      ],
+      page: 1,
+      total: 0,
+      courseJuri: [],
+      tableData: [],
       dialogVisible: false,
-      checkboxList: [],
       isChooseList: [],
+      isLoading: false,
     };
   },
+  watch: {
+    ooid: {
+      immediate: true,
+      deep: true,
+      handler(newValue, oldValue) {
+        this.getClass();
+        this.getCourse();
+        this.getCourseData();
+        this.$forceUpdate();
+      },
+    },
+  },
   methods: {
     tableRowClassName({ row, rowIndex }) {
       if ((rowIndex + 1) % 2 === 0) {
@@ -176,22 +162,85 @@ export default {
         return "";
       }
     },
+    handleClose(done) {
+      done();
+    },
     handleCurrentChange(val) {
       this.page = val;
+      this.getCourseData();
     },
-    isChooseStudent(id) {
-      if (this.isChooseList.indexOf(id) != -1) {
-        this.isChooseList.splice(this.isChooseList.indexOf(id), 1);
+    isChooseS(id) {
+      if (this.isChooseList.length > 0) {
+        if (this.isChooseList.indexOf(id) == -1) {
+          this.isChooseList.push(id);
+        } else {
+          this.isChooseList.splice(this.isChooseList.indexOf(id), 1);
+        }
       } else {
         this.isChooseList.push(id);
       }
       this.$forceUpdate();
     },
     lookmbCourse() {
-      this.checkboxList = [];
       this.isChooseList = [];
       this.dialogVisible = true;
     },
+    searchStudent() {
+      this.page = 1;
+      this.getCourseData();
+    },
+    getClass() {
+      let params = {
+        oid: this.ooid,
+      };
+      this.ajax
+        .get(this.$store.state.api + "selectClassBySchool", params)
+        .then((res) => {
+          this.classJuri = res.data[0];
+        })
+        .catch((err) => {
+          console.error(err);
+        });
+    },
+    getCourse() {
+      let params = {
+        oid: this.ooid,
+      };
+      this.ajax
+        .get(this.$store.state.api + "selectCourseByOid", params)
+        .then((res) => {
+          this.courseJuri = res.data[0];
+        })
+        .catch((err) => {
+          console.error(err);
+        });
+    },
+    getCourseData() {
+      this.isLoading = true;
+      let params = {
+        cu: this.sName,
+        cn: this.classChoose,
+        cl: this.courseChoose,
+        oid: this.ooid,
+        page: this.page,
+      };
+      this.ajax
+        .get(this.$store.state.api + "selectCourseR", params)
+        .then((res) => {
+          this.isLoading = false;
+          this.total = res.data[0].length > 0 ? res.data[0][0].num : 0;
+          this.tableData = res.data[0];
+        })
+        .catch((err) => {
+          this.isLoading = false;
+          console.error(err);
+        });
+    },
+  },
+  created() {
+    this.getClass();
+    this.getCourse();
+    this.getCourseData();
   },
 };
 </script>
@@ -267,4 +316,19 @@ export default {
   flex-wrap: nowrap;
   align-items: center;
 }
+.rightSearch {
+  display: flex;
+  flex-direction: row;
+  flex-wrap: nowrap;
+  align-items: center;
+}
+.rightSearch >>> .el-button {
+  margin-left: 5px;
+  height: 35px;
+  width: 80px;
+  font-size: 14px;
+}
+.student_page {
+  margin-top: 10px;
+}
 </style>

src/components/pages/components/stReport.vue

@@ -3,7 +3,7 @@
     <div class="search">
       <div class="student_search">
         <div>班级筛选</div>
-        <el-select v-model="classChoose">
+        <el-select v-model="classChoose" @change="searchStudent">
           <el-option label="全部" value="">全部</el-option>
           <el-option
             v-for="(c, cIndex) in classJuri"
@@ -13,43 +13,69 @@
           ></el-option>
         </el-select>
       </div>
-      <div>
+      <div class="rightSearch">
         <div class="searchImg">
           <img src="../../../assets/icon/search.png" alt="" />
         </div>
         <el-input v-model="sName" placeholder="请输入学生姓名或账号"></el-input>
+        <el-button size="mini" type="primary" @click="searchStudent"
+          >查询</el-button
+        >
       </div>
     </div>
-    <el-table
-      :data="tableData"
-      border
-      style="width: 100%"
-      :row-class-name="tableRowClassName"
-    >
-      <el-table-column
-        prop="sName"
-        align="center"
-        label="学生姓名"
-        min-width="20%"
+    <div class="student_table">
+      <el-table
+        :data="tableData"
+        border
+        :fit="true"
+        v-loading="isLoading"
+        style="width: 100%"
+        :header-cell-style="{ background: '#f1f1f1', fontSize: '17px' }"
+        :row-class-name="tableRowClassName"
       >
-      </el-table-column>
-      <el-table-column prop="cName" align="center" label="班级" min-width="20%">
-      </el-table-column>
-      <el-table-column
-        prop="course"
-        align="center"
-        label="课程"
-        min-width="20%"
-      >
-      </el-table-column>
-      <el-table-column label="操作" align="center" min-width="20%">
-        <template>
-          <el-button size="mini" type="primary" @click="lookEvaCourse"
-            >报告</el-button
-          >
-        </template>
-      </el-table-column>
-    </el-table>
+        <el-table-column
+          prop="sName"
+          align="center"
+          label="学生姓名"
+          min-width="20%"
+        >
+        </el-table-column>
+        <el-table-column
+          prop="cName"
+          align="center"
+          label="班级"
+          min-width="20%"
+        >
+        </el-table-column>
+        <el-table-column
+          prop="course"
+          align="center"
+          label="课程"
+          min-width="40%"
+        >
+        </el-table-column>
+        <el-table-column label="操作" align="center" min-width="20%">
+          <template slot-scope="scope">
+            <el-button
+              size="mini"
+              type="primary"
+              @click="lookEvaCourse(scope.row.userid)"
+              >报告</el-button
+            >
+          </template>
+        </el-table-column>
+      </el-table>
+    </div>
+    <div class="student_page">
+      <el-pagination
+        background
+        layout="prev, pager, next"
+        :page-size="10"
+        :total="total"
+        v-if="page"
+        @current-change="handleCurrentChange"
+      ></el-pagination>
+    </div>
     <el-dialog
       title="选择报告"
       :visible.sync="dialogVisible"
@@ -59,19 +85,32 @@
       class="dialog_diy"
     >
       <div>
-        <div v-for="(m, mIndex) in mbCourse" :key="mIndex">
-          <div>{{ m.name }}</div>
-          <el-checkbox-group v-model="checkboxList" class="people_name">
-            <div
-              v-for="item in mbCourse[mIndex].course"
-              :key="item.id"
-              class="p_box"
+        <div
+          class="evaBox"
+          v-for="(item, index) in mbCourse"
+          :key="index"
+          v-loading="isLoading1"
+        >
+          <div>目标体系-{{ item.title }}</div>
+          <el-table :data="item.course" border style="width: 100%" stripe>
+            <el-table-column
+              prop="title"
+              label="项目"
+              align="center"
+              min-width="15%"
             >
-              <el-checkbox :label="item.id">
-                {{ item.name }}
-              </el-checkbox>
-            </div>
-          </el-checkbox-group>
+            </el-table-column>
+            <el-table-column align="center" min-width="25%">
+              <template slot-scope="scope">
+                <input
+                  type="checkbox"
+                  :id="scope.row.courseId"
+                  :value="scope.row.title"
+                  @change="isChooseS(scope.row.courseId, index)"
+                />
+              </template>
+            </el-table-column>
+          </el-table>
         </div>
       </div>
       <span slot="footer" class="dialog-footer">
@@ -86,65 +125,33 @@
 
 <script>
 export default {
+  props: ["ooid"],
   data() {
     return {
       sName: "",
       classChoose: "",
-      classJuri: [
-        { id: 1, name: "一年级一班" },
-        { id: 2, name: "一年级二班" },
-        { id: 3, name: "一年级三班" },
-        { id: 4, name: "一年级四班" },
-      ],
-      tableData: [
-        {
-          sName: "徐家伟",
-          cName: "四年级二班",
-          course: "课程1/课程2/课程3",
-        },
-        {
-          sName: "牛倩楠",
-          cName: "四年级二班",
-          course: "课程1/课程2",
-        },
-        {
-          sName: "小李",
-          cName: "四年级二班",
-          course: "课程1",
-        },
-        {
-          sName: "小王",
-          cName: "四年级二班",
-          course: "课程1/课程2/课程3/课程4",
-        },
-        {
-          sName: "小胡",
-          cName: "四年级二班",
-          course: "课程1/课程2/课程3/课程4",
-        },
-      ],
+      isChooseStudent: "",
+      page: 1,
+      total: 0,
+      classJuri: [],
+      tableData: [],
+      isLoading: false,
+      isLoading1: false,
       dialogVisible: false,
-      checkboxList: [],
-      mbCourse: [
-        {
-          id: 1,
-          name: "目标体系名称1",
-          course: [
-            { id: 11, name: "设计并制作FEG智能车(5EX课程设计模型)" },
-            { id: 12, name: "韶关市信息科技教师培训" },
-          ],
-        },
-        {
-          id: 2,
-          name: "目标体系名称2",
-          course: [
-            { id: 21, name: "设计并制作FEG智能车(5EX课程设计模型)1111" },
-            { id: 22, name: "韶关市信息科技教师培训1111" },
-          ],
-        },
-      ],
+      mbCourse: [],
     };
   },
+  watch: {
+    ooid: {
+      immediate: true,
+      deep: true,
+      handler(newValue, oldValue) {
+        this.getClass();
+        this.getSData();
+        this.$forceUpdate();
+      },
+    },
+  },
   methods: {
     tableRowClassName({ row, rowIndex }) {
       if ((rowIndex + 1) % 2 === 0) {
@@ -156,10 +163,95 @@ export default {
     handleClose(done) {
       done();
     },
-    lookEvaCourse() {
+    handleCurrentChange(val) {
+      this.page = val;
+      this.getSData();
+    },
+    searchStudent() {
+      this.page = 1;
+      this.getSData();
+    },
+    isChooseS(id, i) {
+      if (this.mbCourse[i].isChoose.indexOf(id) != -1) {
+        this.mbCourse[i].isChoose.splice(
+          this.mbCourse[i].isChoose.indexOf(id),
+          1
+        );
+      } else {
+        this.mbCourse[i].isChoose.push(id);
+      }
+      this.$forceUpdate();
+    },
+    getClass() {
+      let params = {
+        oid: this.ooid,
+      };
+      this.ajax
+        .get(this.$store.state.api + "selectClassBySchool", params)
+        .then((res) => {
+          this.classJuri = res.data[0];
+        })
+        .catch((err) => {
+          console.error(err);
+        });
+    },
+    getSData() {
+      this.isLoading = true;
+      let params = {
+        cu: this.sName,
+        cn: this.classChoose,
+        oid: this.ooid,
+        page: this.page,
+      };
+      this.ajax
+        .get(this.$store.state.api + "selectSr", params)
+        .then((res) => {
+          this.isLoading = false;
+          this.total = res.data[0].length > 0 ? res.data[0][0].num : 0;
+          this.tableData = res.data[0];
+        })
+        .catch((err) => {
+          this.isLoading = false;
+          console.error(err);
+        });
+    },
+    getSEvaList() {
+      this.isLoading1 = true;
+      let params = {
+        uid: this.isChooseStudent,
+        oid: this.ooid,
+      };
+      this.ajax
+        .get(this.$store.state.api + "selectMrEva", params)
+        .then((res) => {
+          this.isLoading1 = false;
+          this.mbCourse = res.data[1];
+          var courseList = res.data[2];
+          for (var i = 0; i < this.mbCourse.length; i++) {
+            this.mbCourse[i].course = [];
+            this.mbCourse[i].isChoose = [];
+            for (var j = 0; j < courseList.length; j++) {
+              if (this.mbCourse[i].id == courseList[j].evaId) {
+                this.mbCourse[i].course.push(courseList[j]);
+              }
+            }
+          }
+        })
+        .catch((err) => {
+          this.isLoading1 = false;
+          console.error(err);
+        });
+    },
+    lookEvaCourse(id) {
+      this.isChooseStudent = id;
+      this.getSEvaList();
       this.dialogVisible = true;
     },
   },
+  created() {
+    this.getClass();
+    this.getSData();
+  },
 };
 </script>
 
@@ -227,19 +319,19 @@ export default {
 .student_search > div:nth-child(1) {
   margin-right: 10px;
 }
-.people_name {
+/* .people_name {
   display: flex;
   justify-content: flex-start;
   padding: 20px 0 0 25px;
   flex-direction: column;
   flex-wrap: wrap;
-}
+} */
 
 .p_box {
   position: relative;
 }
 
-.people_name >>> .el-checkbox {
+/* .people_name >>> .el-checkbox {
   width: 100%;
   display: flex;
   align-items: center;
@@ -250,9 +342,37 @@ export default {
   text-overflow: ellipsis;
   overflow: hidden;
   width: calc(100%);
-}
+} */
 
 .people_name2 >>> .el-checkbox__label {
   width: calc(100% - 130px);
 }
+.student_table >>> .el-table--border td {
+  border-right: 0px !important;
+}
+
+.student_table >>> .el-table,
+.student_table >>> .el-table__body-wrapper {
+  height: auto !important;
+}
+
+.student_page {
+  margin-top: 10px;
+}
+.rightSearch {
+  display: flex;
+  flex-direction: row;
+  flex-wrap: nowrap;
+  align-items: center;
+}
+.rightSearch >>> .el-button {
+  margin-left: 5px;
+  height: 35px;
+  width: 80px;
+  font-size: 14px;
+}
+.evaBox,
+.evaBox > div:nth-child(1) {
+  margin-bottom: 10px;
+}
 </style>

src/components/pages/myReport/components/MyLookComponent/worksDetail3.vue

@@ -2831,7 +2831,7 @@ export default {
   width: 100%;
   margin: 0 auto;
   overflow: auto;
-  height: 400px;
+  height: 700px;
   overflow-x: hidden;
 }
 

src/components/pages/myReport/components/mrBasicData.vue

@@ -95,11 +95,14 @@ export default {
   font-weight: bold;
 }
 .courseChild > div:last-child {
-  background: #eef8fb;
-  border: 1px solid #b6c2c2;
-  color: #4f657a;
+  background: #e1edff;
+  border: 1px solid #c8deff;
+  border-radius: 5px;
+  color: #3b86ff;
   padding: 1px 3px;
   min-width: 75px;
+  height: 25px;
+  line-height: 25px;
   text-align: center;
 }
 </style>

src/components/pages/myReport/components/mrOverPer.vue

@@ -93,7 +93,9 @@ export default {
   display: flex;
   flex-direction: row;
   align-items: center;
-  justify-content: center;
+  justify-content: space-around;
+  width: 90%;
+  margin: 0 auto;
 }
 .perItem {
   display: flex;
@@ -107,13 +109,14 @@ export default {
 }
 .perItem > div:nth-child(2) {
   border-radius: 50%;
-  border: 1px solid #8de3b6;
+  border: 1px solid #91ccff;
   margin: 5px 0 0 0;
 }
 .perItem > div:nth-child(2) > div {
   width: 70px;
   height: 70px;
-  background: #8de3b6;
+  background: #6ba9df;
+  color: #fff;
   border-radius: 50%;
   text-align: center;
   line-height: 70px;
@@ -130,13 +133,13 @@ export default {
   border: 1px solid #f9cb7d;
 }
 .allPerTop > div:nth-child(2) > div:nth-child(2) > div {
-  background: #f9cb7d;
+  background: #f9c56c;
 }
 .allPerTop > div:nth-child(3) > div:nth-child(2) {
   border: 1px solid #d19d9a;
 }
 .allPerTop > div:nth-child(3) > div:nth-child(2) > div {
-  background: #ffefef;
+  background: #e78686;
 }
 .avaImg {
   width: 65px;
@@ -157,7 +160,9 @@ export default {
   margin: 10px 0 0 0;
 }
 .allPerBoottom > div:nth-child(2) {
-  font-size: 20px;
+  font-size: 18px;
+  color: #9f9f9f;
+  margin-top: 1px;
 }
 .avaImg > .sName {
   position: absolute;
@@ -168,7 +173,16 @@ export default {
   text-align: center;
   line-height: 20px;
   bottom: -5px;
+  left: -5px;
   border-radius: 10px;
   font-size: 14px;
+  padding: 0 5px;
+  cursor: pointer;
+}
+.avaImg > .sName > div {
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  word-break: break-word;
 }
 </style>

src/components/pages/worksReport.vue

@@ -54,10 +54,10 @@
           </div>
         </div>
         <div>
-          <StReport v-if="wrType == 0"></StReport>
-          <ClassReport v-if="wrType == 1"></ClassReport>
-          <CourseReport v-if="wrType == 2"></CourseReport>
-          <EvaReport v-if="wrType == 3"></EvaReport>
+          <StReport v-if="wrType == 0" :uuid="userid" :ooid="oid"></StReport>
+          <ClassReport v-if="wrType == 1" :ooid="oid"></ClassReport>
+          <CourseReport v-if="wrType == 2" :ooid="oid"></CourseReport>
+          <EvaReport v-if="wrType == 3" :ooid="oid"></EvaReport>
         </div>
       </div>
     </div>