学时审核table组件化

src/views/education/classManageMent/classHoursReview/component/ChapterTable.vue

@@ -1,9 +1,69 @@
 <template>
-  <div>2</div>
+  <div>
+    <el-table
+      :default-expand-all="true"
+      border
+      :data="tabledata"
+      style="width: 100%; border-radius: 4px; overflow: hidden"
+      :header-cell-style="{
+        'background-color': '#D9ECFA',
+        padding: '8px',
+        color: '#1565C0',
+        'border-right-color': '#1565C0',
+        'border-left-color': '#1565C0',
+      }"
+    >
+      <el-table-column label="章" type="expand" width="70px">
+        <template slot-scope="scope">
+          <Lesson-table
+            :tabledata="scope.row.classPeriodSectionList"
+          ></Lesson-table>
+        </template>
+      </el-table-column>
+      <el-table-column align="center" prop="realName" label="姓名">
+      </el-table-column>
+      <el-table-column align="center" prop="typeName" label="章标题">
+      </el-table-column>
+      <el-table-column align="center" prop="classHours" label="学时">
+      </el-table-column>
+      <el-table-column align="center" label="开始学习时间">
+        <template slot-scope="scope">
+          <span>
+            {{ $methodsTools.onlyForma(scope.row.studyStartTime) }}
+          </span>
+        </template>
+      </el-table-column>
+      <el-table-column align="center" label="结束学习时间">
+        <template slot-scope="scope">
+          <span>
+            {{ $methodsTools.onlyForma(scope.row.studyEndTime) }}
+          </span>
+        </template>
+      </el-table-column>
+      <el-table-column align="center" prop="performance" label="测试成绩">
+      </el-table-column>
+    </el-table>
+  </div>
 </template>
 
 <script>
-export default {};
+import LessonTable from "./LessonTable.vue";
+export default {
+  props: {
+    tabledata: {
+      type: Array,
+      default: () => {
+        return [];
+      },
+    },
+  },
+  data() {
+    return {};
+  },
+  components: {
+    LessonTable,
+  },
+};
 </script>
 
 <style>

src/views/education/classManageMent/classHoursReview/component/LessonTable.vue

@@ -1,10 +1,386 @@
 <template>
-  <div>3</div>
+  <div>
+    <el-table
+      :default-expand-all="true"
+      border
+      :data="tabledata"
+      style="width: 100%; border-radius: 4px; overflow: hidden"
+      :header-cell-style="{
+        'background-color': '#F5F5F5',
+        padding: '8px',
+        color: '#666',
+      }"
+    >
+      <el-table-column label="节/卷" type="expand" width="70px">
+        <template slot-scope="scope">
+          <div class="dis_flexs">
+            <ul
+              style="flex: 1"
+              v-if="
+                scope.row.userStudyRecordPhotoList &&
+                scope.row.userStudyRecordPhotoList.length
+              "
+            >
+              <li
+                v-for="(its, inds) in scope.row.userStudyRecordPhotoList"
+                :key="inds"
+                class="liImgs"
+              >
+                <el-image
+                  style="width: 100%; height: 100%"
+                  :src="$methodsTools.splitImgHost(its.photo)"
+                  :preview-src-list="[$methodsTools.splitImgHost(its.photo)]"
+                >
+                </el-image>
+                <div class="abos">
+                  {{ $methodsTools.onlyForma(its.createTime) }}
+                </div>
+              </li>
+              <div style="clear: both"></div>
+            </ul>
+            <p v-else style="text-align: center; width: 100%">暂无拍照数据</p>
+            <div
+              class="styFlex"
+              v-if="
+                (userData.periodStatus === 0 ||
+                  userData.periodStatus === 2 ||
+                  userData.periodStatus === 3) &&
+                scope.row.periodStatus === 1
+              "
+            >
+              <div>
+                <el-checkbox
+                  class="checkboxList"
+                  :label="scope.row.periodStatusId"
+                  :disabled="
+                    userData.periodStatus === 3
+                      ? false
+                      : scope.row.status !== 2
+                      ? true
+                      : false
+                  "
+                  ><br
+                /></el-checkbox>
+              </div>
+              <el-button
+                :disabled="scope.row.status !== 2"
+                class="btnstyles"
+                size="small"
+                type="success"
+                :loading="disabledBtn"
+                @click="changeStatus(scope.row, 1, scope.$index)"
+                >通过</el-button
+              >
+              <el-button
+                :disabled="scope.row.status !== 2"
+                class="btnstyles"
+                size="small"
+                type="danger"
+                @click="changeStatus(scope.row, 2, scope.$index)"
+                >作弊</el-button
+              >
+            </div>
+          </div>
+        </template>
+      </el-table-column>
+
+      <el-table-column
+        v-for="(item, index) in tableSet3"
+        :width="item.width"
+        :key="index"
+        :label="item.label"
+        align="center"
+      >
+        <template slot-scope="scope2">
+          <span v-if="item.scope === 'select'">
+            <span
+              v-for="(k, ds) in item.options"
+              :key="ds"
+              :style="
+                scope2.row[item.prop] === 0
+                  ? 'color:red;'
+                  : scope2.row[item.prop] === 2
+                  ? 'color:#0047D0;'
+                  : scope2.row[item.prop] === 1
+                  ? 'color:#67C23A;'
+                  : ''
+              "
+            >
+              {{ k.value == scope2.row[item.prop] ? k.label : "" }}
+            </span>
+          </span>
+          <div v-else-if="item.scope === 'activeNum'">
+            <el-select
+              v-model="scope2.row[item.prop]"
+              placeholder="请选择"
+              @change="
+                getNewListchapt(scope.$index, scope2.$index, $event, scope2.row)
+              "
+            >
+              <el-option
+                v-for="(items, indexs) in scope2.row['numList']"
+                :key="indexs"
+                :label="'第' + items + '次审核记录'"
+                :value="items"
+              >
+              </el-option>
+            </el-select>
+          </div>
+          <span v-else-if="item.scope === 'typeOptions'">
+            <span v-for="(is, ds) in item.options" :key="ds">
+              <span v-if="is.value === scope2.row[item.prop]">{{
+                is.label
+              }}</span>
+            </span>
+          </span>
+          <span v-else-if="item.scope === 'aTime'">
+            {{ $methodsTools.onlyForma(scope2.row[item.prop]) }}
+          </span>
+          <span v-else-if="item.scope === 'durTime'">
+            {{ $methodsTools.secondToDate(scope2.row[item.prop], false) }}
+          </span>
+          <div v-else-if="item.scope === 'aTimeSE'">
+            <span
+              v-if="
+                scope2.row['type'] === 3 &&
+                scope2.row['durationTime'] &&
+                scope2.row['studyStartTime'] &&
+                scope2.row['studyEndTime']
+              "
+              :style="comput(scope2.row)"
+            >
+              {{ $methodsTools.onlyForma(scope2.row[item.prop]) }}
+            </span>
+            <span v-else>
+              {{ $methodsTools.onlyForma(scope2.row[item.prop]) }}
+            </span>
+          </div>
+          <span v-else> {{ scope2.row[item.prop] }} </span>
+        </template>
+      </el-table-column>
+    </el-table>
+  </div>
 </template>
 
 <script>
-export default {};
+export default {
+  props: {
+    tabledata: {
+      type: Array,
+      default: () => {
+        return [];
+      },
+    },
+  },
+  inject: ["userData"],
+  data() {
+    return {
+      tableSet3: [
+        {
+          label: "选择",
+          prop: "numIndex",
+          scope: "activeNum",
+          width: "180px",
+        },
+        {
+          label: "姓名",
+          prop: "realName",
+        },
+        {
+          label: "标题",
+          prop: "typeName",
+        },
+        {
+          label: "类型",
+          prop: "type",
+          scope: "typeOptions",
+          width: "90px",
+          options: [
+            {
+              label: "节",
+              value: 3,
+            },
+            {
+              label: "试卷",
+              value: 4,
+            },
+          ],
+        },
+        {
+          label: "节时长",
+          prop: "durationTime",
+          width: "120px",
+          scope: "durTime",
+        },
+        {
+          label: "开始时间",
+          prop: "studyStartTime",
+          scope: "aTimeSE",
+        },
+        {
+          label: "结束时间",
+          prop: "studyEndTime",
+          scope: "aTimeSE",
+        },
+        {
+          label: "审核状态",
+          prop: "status",
+          scope: "select",
+          width: "100px",
+          options: [
+            {
+              label: "待审核",
+              value: 2,
+            },
+            {
+              label: "通过",
+              value: 1,
+            },
+            {
+              label: "作弊",
+              value: 0,
+            },
+            {
+              label: "待重修",
+              value: 3,
+            },
+          ],
+        },
+        {
+          label: "审核人",
+          prop: "auditUserName",
+          width: "100px",
+        },
+        {
+          label: "审核时间",
+          prop: "auditTime",
+          scope: "aTime",
+        },
+      ],
+      disabledBtn: false,
+    };
+  },
+  methods: {
+    comput(item) {
+      var ast = item.studyEndTime - item.studyStartTime;
+      if (ast < item.durationTime) {
+        return "color:red;";
+      } else {
+        return "";
+      }
+    },
+    getNewListchapt(a, b, int, item) {
+      let data = {
+        courseId: item.courseId,
+        moduleId: item.moduleId,
+        chapterId: item.chapterId,
+        numIndex: int,
+        userId: this.setData.userId,
+        goodsId: this.setData.goodsId,
+        gradeId: this.setData.id,
+      };
+      if (item.type === 3) {
+        data.sectionId = item.id;
+      }
+      if (item.type === 4) {
+        data.examId = item.id;
+      }
+      this.$api.inquireGradegradelistPeriodAuditStatus(data).then((res) => {
+        this.$set(
+          this.listData.tableData2[a].classPeriodSectionList,
+          b,
+          res.data
+        );
+        this.getUserInfo();
+      });
+    },
+    changeStatus(item, int, index1, msg) {
+      var data = {
+        id: item.periodStatusId,
+      };
+      if (int === 1) {
+        this.disabledBtn = true;
+        data.status = 1;
+      }
+      if (int === 2) {
+        if (msg) {
+          data.status = 0;
+          data.auditReason = msg;
+        } else {
+          this.copyDatas = {
+            type: 3,
+            item: item,
+            int: int,
+            index1: index1,
+          };
+          this.statusPop = 1; // 1单个点击状态 2批量点击状态
+          this.formData.cheating_reason = "";
+          this.vidBoxHours = true;
+          return;
+        }
+      }
+      this.$api
+        .editGradeUsereditPeriode(data)
+        .then((res) => {
+          this.$message.success("修改成功");
+          this.vidBoxHours = false;
+          this.getNewList(index1, item.numIndex, item);
+          this.checkUpload(item.periodStatusId);
+        })
+        .finally(() => {
+          this.disabledBtn = false;
+        });
+    },
+  },
+  created() {
+    
+  },
+  mounted() {},
+};
 </script>
 
-<style>
+<style  lang="less" scoped>
+.liImgs {
+  float: left;
+  width: 210px;
+  height: 280px;
+  margin-right: 16px;
+  margin-bottom: 16px;
+  position: relative;
+  border-radius: 8px;
+  overflow: hidden;
+  .abos {
+    position: absolute;
+    bottom: 0px;
+    width: 100%;
+    height: 32px;
+    line-height: 32px;
+    font-size: 14px;
+    color: #fff;
+    text-align: center;
+    background-color: rgba(51, 51, 51, 0.7);
+  }
+}
+.dis_flexs {
+  display: flex;
+  align-items: center;
+  padding: 10px 18px;
+  ul {
+    margin-bottom: 0px;
+  }
+}
+.styFlex {
+  width: 80px;
+  text-align: center;
+}
+.checkboxList {
+  margin-bottom: 6px;
+  &/deep/.el-checkbox__label {
+    display: none;
+  }
+}
+.btnstyles {
+  margin-left: 0px;
+  margin-bottom: 10px;
+}
 </style>

src/views/education/classManageMent/classHoursReview/component/ModulTable.vue

@@ -1,9 +1,49 @@
 <template>
-  <div>1</div>
+  <div>
+    <el-table
+      :default-expand-all="true"
+      border
+      :data="tabledata"
+      style="width: 100%; border-radius: 4px; overflow: hidden"
+      :header-cell-style="{
+        'background-color': '#CCDDF7',
+        padding: '8px',
+        color: '#0047D0',
+        'border-right-color': '#0047D0',
+        'border-left-color': '#0047D0',
+      }"
+    >
+      <el-table-column label="模块" type="expand" width="70px">
+        <template slot-scope="scope">
+          <Chapter-table :tabledata="scope.row.classPeriods"></Chapter-table>
+        </template>
+      </el-table-column>
+      <el-table-column align="center" prop="realName" label="姓名">
+      </el-table-column>
+      <el-table-column align="center" prop="typeName" label="模块标题">
+      </el-table-column>
+    </el-table>
+  </div>
 </template>
 
 <script>
-export default {};
+import ChapterTable from "./ChapterTable.vue";
+export default {
+  props: {
+    tabledata: {
+      type: Array,
+      default: () => {
+        return [];
+      },
+    },
+  },
+  data() {
+    return {};
+  },
+  components: {
+    ChapterTable,
+  },
+};
 </script>
 
 <style>

src/views/education/classManageMent/classHoursReview/component/StudyTables.vue

@@ -1,10 +1,192 @@
 <template>
-  <div>
-    <component
-      :is="key"
-      v-for="key in Object.keys(tablesData)"
-      :key="key"
-    ></component>
+  <div class="studyRecordTable">
+    <div class="studyStyle">
+      <div class="a_style">
+        <i></i>
+        <span>视频审核进度</span>
+        <div class="flex_style_study">
+          <div class="num_style" style="color: #0047d0">
+            待审：{{ userData.pending }}节
+          </div>
+          <div class="num_style" style="color: #e53935">
+            作弊：{{ userData.cheat }}节
+          </div>
+          <div class="num_style" style="color: #43a047">
+            通过：{{ userData.pass }}节
+          </div>
+          <div style="clear: both"></div>
+        </div>
+      </div>
+      <div class="a_style">
+        <i></i>
+        <span>做题审核进度</span>
+        <div class="flex_style_study">
+          <div class="num_style" style="color: #0047d0">
+            待审：{{ userData.examPending }}节
+          </div>
+          <div class="num_style" style="color: #e53935">
+            作弊：{{ userData.examCheat }}节
+          </div>
+          <div class="num_style" style="color: #43a047">
+            通过：{{ userData.examPass }}节
+          </div>
+          <div style="clear: both"></div>
+        </div>
+      </div>
+      <div class="a_style" style="width: 280px">
+        <i></i>
+        <span>学时审批状态</span>
+        <div class="flex_style_study">
+          <div class="num_style" style="color: #0047d0">
+            {{
+              userData.periodStatus === 0
+                ? "未通过"
+                : userData.periodStatus === 2
+                ? "待审核"
+                : userData.periodStatus === -1
+                ? "不可审核"
+                : userData.periodStatus === 1
+                ? "通过审核"
+                : userData.periodStatus === 3
+                ? "审核中"
+                : "未知状态，请联系管理员"
+            }}
+          </div>
+          <div style="clear: both"></div>
+        </div>
+      </div>
+      <div class="s_sd">
+        <span v-if="userData.periodStatus !== 3">
+          <el-checkbox
+            v-if="userData.periodStatus === 2"
+            :disabled="!allIds.length"
+            :indeterminate="isIndeterminate"
+            v-model="checkAll"
+            @change="handleCheckAllChange"
+            >待审全选</el-checkbox
+          >
+          <el-button
+            style="margin-left: 10px"
+            size="mini"
+            type="success"
+            v-if="userData.periodStatus === 2"
+            @click="getChangeStatus(1)"
+            >勾选通过</el-button
+          >
+          <el-button
+            size="mini"
+            type="danger"
+            v-if="userData.periodStatus === 2"
+            @click="getChangeStatus(2)"
+            >勾选作弊</el-button
+          >
+        </span>
+        <span v-else>
+          <el-button style="margin-left: 10px" size="mini" @click="checkBack"
+            >勾选数据，打回待审核状态</el-button
+          >
+          <el-button size="mini" type="warning" @click="approvedOK = true"
+            >确认审核通过结果</el-button
+          >
+        </span>
+      </div>
+    </div>
+    <div class="tablesBoxs">
+      <el-checkbox-group
+        v-model="checkList"
+        @change="handleCheckedCitiesChange"
+      >
+        <component
+          :is="keys[index]"
+          v-for="(item, index) in tablesData"
+          :key="index"
+          :tabledata="item"
+        ></component>
+      </el-checkbox-group>
+    </div>
+    <el-dialog
+      @closed="loadingClose"
+      :visible.sync="vidBoxHours"
+      v-if="vidBoxHours"
+      width="560px"
+      :show-close="false"
+      :close-on-click-modal="false"
+    >
+      <div slot="title" class="hearders">
+        <div class="leftTitle">操作提示：</div>
+        <div class="rightBoxs">
+          <img
+            src="@/assets/images/Close@2x.png"
+            alt=""
+            @click="vidBoxHours = false"
+          />
+        </div>
+      </div>
+      <div>
+        <el-form
+          :model="formData"
+          :rules="rules"
+          ref="formData"
+          label-width="80px"
+          label-position="right"
+        >
+          <el-form-item label="作弊原因" prop="cheating_reason">
+            <el-input
+              v-model="formData.cheating_reason"
+              type="textarea"
+              :rows="4"
+              placeholder="请输入作弊原因"
+            ></el-input>
+            <ul>
+              <li
+                class="li_sty"
+                @click="uploadText(item.label)"
+                v-for="(item, index) in msgTitle"
+                :key="index"
+              >
+                {{ item.label }}
+              </li>
+            </ul>
+          </el-form-item>
+        </el-form>
+      </div>
+      <span slot="footer" class="dialog-footer">
+        <el-button :loading="disabledBtn" @click="vidBoxHours = false"
+          >取 消</el-button
+        >
+        <el-button :loading="disabledBtn" @click="submitForm('formData')"
+          >确 定</el-button
+        >
+      </span>
+    </el-dialog>
+    <el-dialog
+      @closed="loadingClose"
+      :visible.sync="through"
+      width="560px"
+      :show-close="false"
+      :close-on-click-modal="false"
+    >
+      <div slot="title" class="hearders">
+        <div class="leftTitle">操作提示：</div>
+        <div class="rightBoxs">
+          <img
+            src="@/assets/images/Close@2x.png"
+            alt=""
+            @click="through = false"
+          />
+        </div>
+      </div>
+      <div>
+        确定所勾选的内容，审核结果为【通过】？<br />
+        确认后，初审不可再修改，请检查清楚再操作！
+      </div>
+      <span slot="footer" class="dialog-footer">
+        <el-button :loading="disabledBtn" @click="through = false"
+          >取 消</el-button
+        >
+        <el-button :loading="disabledBtn" @click="submitOK(1)">确 定</el-button>
+      </span>
+    </el-dialog>
   </div>
 </template>
 
@@ -15,18 +197,256 @@ import LessonTable from "./LessonTable.vue";
 export default {
   props: {
     tablesData: {
+      type: Array,
+      default: () => {
+        return [];
+      },
+    },
+    userData: {
       type: Object,
       default: () => {
         return {};
       },
     },
+    setData: {
+      type: Object,
+      default: () => {
+        return {};
+      },
+    },
+  },
+  provide() {
+    return {
+      userData: this.userData,
+    };
   },
   data() {
-    return {};
+    return {
+      checkList: [],
+      allIds: [],
+      checkAll: false,
+      isIndeterminate: false,
+      vidBoxHours: false,
+      through: false,
+      formData: {
+        cheating_reason: "",
+      },
+      statusPop: "", //1单个2批量
+    };
+  },
+  methods: {
+    handleCheckedCitiesChange(value) {
+      let checkedCount = value.length;
+      if (checkedCount) {
+        this.checkAll = checkedCount === this.allIds.length;
+      } else {
+        this.checkAll = false;
+      }
+      this.isIndeterminate =
+        checkedCount > 0 && checkedCount < this.allIds.length;
+    },
+    handleCheckAllChange(val) {
+      this.checkList = val ? this.allIds : [];
+      this.isIndeterminate = false;
+    },
+    getAllId(data) {
+      if (!data || !data.length) {
+        return;
+      }
+      data.forEach((ele) => {
+        if (ele.type == 3 || ele.type == 4) {
+          ele.status === 2 && this.allIds.push(ele.periodStatusId);
+        } else {
+          this.getAllId(
+            ele.type == 1 ? ele.classPeriods : ele.classPeriodSectionList
+          );
+        }
+      });
+    },
+    getChangeStatus(int) {
+      if (!this.checkList.length) {
+        this.$message.warning("请勾选需要操作的待审核数据");
+        return;
+      }
+      var data = {
+        gradeId: Number(this.setData.id),
+        userId: Number(this.setData.userId),
+        goodsId: Number(this.setData.goodsId),
+      };
+      if (int === 1) {
+        data.status = 1;
+        this.through = true;
+      }
+      if (int === 2) {
+        data.status = 0;
+        this.statusPop = 2;
+        this.formData.cheating_reason = "";
+        this.vidBoxHours = true;
+      }
+    },
+    loadingClose() {
+      this.disabledBtn = false;
+    },
+    submitForm(formName) {
+      this.$refs[formName].validate((valid) => {
+        if (valid) {
+          if (this.statusPop === 1) {
+            this.formSubmits();
+          }
+          if (this.statusPop === 2) {
+            this.submitOK(2, this.formData.cheating_reason);
+          }
+        } else {
+          console.log("error submit!!");
+          return false;
+        }
+      });
+    },
+    formSubmits() {
+      this.disabledBtn = true;
+      var self = this;
+      switch (this.copyDatas.type) {
+        case 1:
+          self.changeStatusModule(
+            this.copyDatas.item,
+            this.copyDatas.int,
+            this.copyDatas.index1,
+            this.copyDatas.index2,
+            this.copyDatas.index3,
+            this.formData.cheating_reason
+          );
+          break;
+        case 2:
+          self.changeStatusCharpter(
+            this.copyDatas.item,
+            this.copyDatas.int,
+            this.copyDatas.index1,
+            this.copyDatas.index2,
+            this.formData.cheating_reason
+          );
+          break;
+        case 3:
+          self.changeStatus(
+            this.copyDatas.item,
+            this.copyDatas.int,
+            this.copyDatas.index1,
+            this.formData.cheating_reason
+          );
+          break;
+
+        default:
+          this.$message.warning("提交失败,请联系管理人员检查问题");
+          this.disabledBtn = false;
+          break;
+      }
+    },
+    submitOK(int, msg) {
+      this.disabledBtn = true;
+      var data = {
+        gradeId: Number(this.setData.id),
+        userId: Number(this.setData.userId),
+        goodsId: Number(this.setData.goodsId),
+        ids: this.checkList,
+      };
+      if (int === 1) {
+        data.status = 1;
+      }
+      if (int === 2) {
+        data.auditReason = msg;
+        data.status = 0;
+      }
+      this.$api
+        .editGradeUsereditPeriodeAll(data)
+        .then(async (res) => {
+          if (int === 1) {
+            this.$message.success("状态全部通过修改成功");
+            this.through = false;
+          }
+          if (int === 2) {
+            this.$message.success("状态全部作弊修改成功");
+            this.vidBoxHours = false;
+          }
+          this.checkList = [];
+          this.isIndeterminate = false;
+          this.checkAll = false;
+          // await this.getUserInfo();
+          // this.search();
+        })
+        .catch(() => {
+          this.disabledBtn = false;
+        });
+    },
+  },
+  created() {
+    this.keys = {
+      0: "ModulTable",
+      1: "ChapterTable",
+      2: "LessonTable",
+      4: "ChapterTable",
+    };
+    this.tablesData.map(this.getAllId);
   },
   components: { ModulTable, LessonTable, ChapterTable },
 };
 </script>
 
-<style>
+<style lang="scss" scoped>
+.studyRecordTable {
+  height: 100%;
+  .studyStyle {
+    margin: 16px 0px 0px;
+    display: flex;
+    align-items: center;
+    & > .a_style {
+      display: flex;
+      align-items: center;
+      margin: 0px 16px 16px 0px;
+      padding: 11px 16px;
+      box-shadow: 0px 0px 8px 0px rgba(217, 217, 217, 0.8);
+      border-radius: 4px;
+      height: 40px;
+      width: 440px;
+      user-select: none;
+      i {
+        width: 2px;
+        height: 18px;
+        display: inline-block;
+        background-color: #0047d0;
+        margin-right: 8px;
+      }
+      span {
+        color: #666;
+        font-weight: bold;
+      }
+      .flex_style_study {
+        flex: 1;
+      }
+      .num_style {
+        float: right;
+        font-size: 14px;
+        margin-left: 14px;
+      }
+    }
+    .s_sd {
+      flex: 1;
+      justify-content: flex-end;
+      display: flex;
+      align-items: center;
+      flex-shrink: 0;
+      margin: 0px 16px 16px 0px;
+      .dis_colu {
+        height: 55px;
+        margin-right: 14px;
+        display: flex;
+        flex-direction: column;
+        justify-content: space-around;
+        font-size: 14px;
+      }
+    }
+  }
+  .tablesBoxs {
+    height: calc(100% - 360px);
+    overflow-x: auto;
+  }
+}
 </style>

src/views/education/classManageMent/classHoursReview/studyTimes.vue

@@ -95,7 +95,7 @@
         </div>
       </div>
     </div>
-    <div class="studyStyle">
+    <div class="studyStyle" v-if="!true">
       <div class="a_style">
         <i></i>
         <span>视频审核进度</span>
@@ -186,8 +186,15 @@
         </span>
       </div>
     </div>
-    <Study-tables :tablesData="tablesData"></Study-tables>
-    <div style="flex: 1; flex-shrink: 0; overflow: auto">
+
+    <Study-tables
+      v-if="tablesData.length"
+      :tablesData="tablesData"
+      :userData="userData"
+      :setData="setData"
+    ></Study-tables>
+
+    <div style="flex: 1; flex-shrink: 0; overflow: auto" v-if="!true">
       <el-checkbox-group
         v-model="checkList"
         @change="handleCheckedCitiesChange"
@@ -1222,7 +1229,7 @@ export default {
       allArrays: [], //审核中-所有数据
       popback: false, //打回待审核弹窗
       approvedOK: false, //确认审核通过结果
-      tablesData: {},
+      tablesData: [],
     };
   },
   computed: {
@@ -1793,17 +1800,9 @@ export default {
       });
     },
     changeData(data) {
-      const keys = [
-        "ModulTable",
-        "ChapterTable",
-        "LessonTable",
-        "",
-        "ChapterTable",
-      ];
-      let obj = {};
-      data.forEach((e) => (obj[keys[e.type-1]] || (obj[keys[e.type-1]] = [])).push(e));
-      this.tablesData = obj;
-      console.log(this.tablesData,1234)
+      let arr = [];
+      data.forEach((e) => (arr[e.type - 1] || (arr[e.type - 1] = [])).push(e));
+      this.tablesData = arr;
     },
     //获取学时审核数据
     search() {
@@ -1894,6 +1893,7 @@ export default {
             }
           });
           this.getAllList = getAllList1.concat(getAllList2.concat(getAllList3));
+          console.log(this.getAllList, "addd");
           this.allArrays = allArrays;
           this.listData.tableData1 = tab1;
           this.listData.tableData2 = tab2;