优化前端页面

ruoyi-ui/src/assets/styles/element-ui.scss

@@ -105,4 +105,20 @@
   .el-form-item {
     margin-bottom: 10px;
   }
+  .box-shadow {
+    padding: 10px 8px !important;
+  }
+  .el-picker-panel {
+    left: 0 !important;
+    width: 100%;
+  }
+  .el-date-range-picker .el-picker-panel__body {
+    min-width: 100%;
+    height: 329px;
+    overflow-y: auto;
+  }
+  .el-date-range-picker__content.is-left, .el-date-range-picker__content.is-right {
+    width: 100%;
+    float: none;
+  }
 }

ruoyi-ui/src/views/benyi/child_files/index.vue

@@ -1,12 +1,26 @@
 <template>
   <div class="app-container">
-    <el-row :gutter="12">
-      <el-col :span="4" v-for="(item, index) in filesList" :key="index" style="padding: 10px;">
+    <!-- <el-row :gutter="12">
+      <el-col
+        :span="4"
+        v-for="(item, index) in filesList"
+        :key="index"
+        style="padding: 10px;"
+      >
         <el-card shadow="hover">
-          <a :href="apiurl+item.fileurl">{{item.name}}</a>
+          <a :href="apiurl + item.fileurl">{{ item.name }}</a>
         </el-card>
       </el-col>
-    </el-row>
+    </el-row> -->
+    <ul class="infinite-list" v-infinite-scroll="load" style="overflow:auto">
+      <li v-for="(ele, i) in filesList" :key="i" class="flex align-center justify-between infinite-list-item">
+        <div class="left">
+          <span>{{i + 1}}.</span>
+          <i class="el-icon-document icon"></i>{{ele.name}}
+        </div>
+        <a class="right" :href="apiurl + ele.fileurl">下载</a>
+      </li>
+    </ul>
   </div>
 </template>
 
@@ -29,8 +43,8 @@ export default {
         filetype: undefined,
         type: "1", //代表幼儿入园系列文件
         fileurl: undefined,
-        createuserid: undefined,
-      },
+        createuserid: undefined
+      }
     };
   },
   created() {
@@ -40,11 +54,36 @@ export default {
     /** 查询文件管理列表 */
     getList() {
       this.loading = true;
-      listFiles(this.queryParams).then((response) => {
+      listFiles(this.queryParams).then(response => {
         this.filesList = response.rows;
         this.loading = false;
       });
     },
-  },
+    load() {
+
+    }
+  }
 };
-</script>
+</script>
+<style lang="scss" scoped>
+.infinite-list-item {
+  padding: 15px 15px;
+  border-bottom: 1px solid #eee;
+  &:hover {
+    background: #f8f8f8;
+  }
+  .left {
+    font-size: 14px;
+    .icon {
+      margin: 0 3px 0 5px;
+    }
+  }
+  .right {
+    font-size: 12px;
+    color: #999;
+    &:hover {
+      color: rgb(64, 158, 255);
+    }
+  }
+}
+</style>

ruoyi-ui/src/views/benyi_train/video_study/index.vue

@@ -103,7 +103,7 @@
 import {
   listVideo,
   getVideo,
-  privateDownloadUrl,
+  privateDownloadUrl
 } from "@/api/benyi_train/video";
 import { listAllLecturer } from "@/api/benyi_train/lecturer";
 import { listMoedata } from "@/api/system/moedata";
@@ -132,17 +132,17 @@ export default {
         type: undefined,
         status: "0",
         pageNum: 1,
-        pageSize: 8,
-      },
+        pageSize: 8
+      }
     };
   },
   created() {
     this.getList();
-    listAllLecturer().then((response) => {
+    listAllLecturer().then(response => {
       //console.log(response.lecturer);
       this.lecturerOptions = response.lecturer;
     });
-    listMoedata(this.queryParams).then((response) => {
+    listMoedata(this.queryParams).then(response => {
       //第一步转换数组
       this.optionTypes = this.handleTree(response.data, "id", "pid");
       //第二步移除children为0的数组，也就是将children为0 设置为undefined
@@ -172,9 +172,9 @@ export default {
     /** 查询培训列表 */
     getList() {
       this.loading = true;
-      listVideo(this.queryParams).then((response) => {
+      listVideo(this.queryParams).then(response => {
         this.videoList = response.rows;
-        this.playerOptions = response.rows.map((ele) => {
+        this.playerOptions = response.rows.map(ele => {
           return {
             autoplay: false,
             muted: true,
@@ -185,8 +185,8 @@ export default {
               {
                 type: ele.filetype,
                 // mp4
-                src: ele.videourl,
-              },
+                src: ele.videourl
+              }
             ],
             notSupportedMessage: "此视频暂无法播放，请稍后再试",
             poster: "",
@@ -194,8 +194,8 @@ export default {
               timeDivider: true,
               durationDisplay: false,
               remainingTimeDisplay: false,
-              fullscreenToggle: true, //全屏按钮
-            },
+              fullscreenToggle: true //全屏按钮
+            }
           };
         });
         this.total = response.total;
@@ -217,8 +217,8 @@ export default {
     resetQuery() {
       this.resetForm("queryForm");
       this.handleQuery();
-    },
-  },
+    }
+  }
 };
 </script>
 
@@ -259,4 +259,10 @@ export default {
 .no-margin ::v-deep.el-form-item__content {
   margin: 0 !important;
 }
+
+@media (max-width: 768.98px) {
+  .el-cascader-node__label {
+    max-width: 200px;
+  }
+}
 </style>

ruoyi-ui/src/views/system/class/index.vue

@@ -141,7 +141,7 @@
       :data="classList"
       @selection-change="handleSelectionChange"
     >
-      <el-table-column type="selection" width="55" align="center" />
+      <el-table-column type="selection" width="45" align="center" />
       <el-table-column
         label="班级编号"
         align="center"