Browse Source

修复两个页面的布局bug

shaogen1995 4 năm trước cách đây
mục cha
commit
d2a18900a8

+ 48 - 38
src/pages/scene/index.vue

@@ -1,7 +1,7 @@
 <template>
   <div class="scene">
     <MainTop :crumb="[{ name: '场景管理' }]" />
-    <div class="table-interface">
+    <div class="table-interface" style="flex: 1; overflow-y: auto">
       <div class="top-body">
         <div class="info-top">
           <el-form
@@ -15,13 +15,14 @@
               <el-input
                 v-model="ruleForm.name"
                 placeholder="请输入场景名称搜索"
-                style="width: 220px; margin-right: 10px;"
+                style="width: 220px; margin-right: 10px"
               ></el-input>
-              <el-button type="primary" @click="find"
-                >查找</el-button
-              >
+              <el-button type="primary" @click="find">查找</el-button>
               <el-button @click="reset">重置</el-button>
-                    <el-button style="float: right;" type="primary" @click="$router.push('/scene/addScene')"
+              <el-button
+                style="float: right"
+                type="primary"
+                @click="$router.push('/scene/addScene')"
                 >新增场景</el-button
               >
             </el-form-item>
@@ -30,14 +31,19 @@
         <div class="conten">
           <div class="box" v-for="item in list" :key="item.id">
             <a :href="item.urlScene">
-            <img :src="'https://project.4dage.com/8002/'+item.thumb" alt="">
+              <img
+                :src="'https://project.4dage.com/8002/' + item.thumb"
+                alt=""
+              />
             </a>
             <div class="txt">
-              <p>{{item.name}}</p>
-                <div>
-                  <span @click="$router.push(`/scene/editScene/${item.id}`)">编辑&nbsp;</span>
-                  <span @click="remove(item.id)">&nbsp;删除</span>
-                </div>
+              <p>{{ item.name }}</p>
+              <div>
+                <span @click="$router.push(`/scene/editScene/${item.id}`)"
+                  >编辑&nbsp;</span
+                >
+                <span @click="remove(item.id)">&nbsp;删除</span>
+              </div>
             </div>
           </div>
         </div>
@@ -61,8 +67,7 @@ export default {
         name: ''
       },
       rules: {
-        name: [
-        ]
+        name: []
       },
       list: []
     }
@@ -100,35 +105,37 @@ export default {
         confirmButtonText: '确定',
         cancelButtonText: '取消',
         type: 'warning'
-      }).then(() => {
-        this.$http.get(`/scene/remove/${id}`).then(res => {
-          if (res.code === 0) {
-            this.$notify.success({
-              title: '提示',
-              message: '删除成功',
-              duration: 2000
-            })
-            this.getList()
-          } else {
-            this.$notify.error({
-              title: '错误',
-              message: res.msg,
-              duration: 2000
-            })
-          }
+      })
+        .then(() => {
+          this.$http.get(`/scene/remove/${id}`).then((res) => {
+            if (res.code === 0) {
+              this.$notify.success({
+                title: '提示',
+                message: '删除成功',
+                duration: 2000
+              })
+              this.getList()
+            } else {
+              this.$notify.error({
+                title: '错误',
+                message: res.msg,
+                duration: 2000
+              })
+            }
+          })
         })
-      }).catch(() => {
-        this.$message({
-          type: 'info',
-          message: '已取消删除'
+        .catch(() => {
+          this.$message({
+            type: 'info',
+            message: '已取消删除'
+          })
         })
-      })
     },
     // 点击查找
     find () {
       if (!this.ruleForm.name) return this.$message.warning('不能为空')
       // console.log(this.list)
-      this.list = this.list.filter(v => {
+      this.list = this.list.filter((v) => {
         return v.name.includes(this.ruleForm.name)
       })
     }
@@ -149,6 +156,10 @@ export default {
 }
 </script>
 <style scoped>
+.scene {
+  display: flex;
+  flex-direction: column;
+}
 .table-interfac {
   overflow-y: auto;
   overflow-x: hidden;
@@ -159,7 +170,6 @@ export default {
 }
 .info-top {
   padding: 20px 70px 20px 36px;
-  width: 100%;
   border-bottom: 1px #a5a5a5 solid;
 }
 .conten {
@@ -183,7 +193,7 @@ export default {
   display: flex;
   justify-content: space-between;
 }
-.txt>div {
+.txt > div {
   padding-right: 30px;
 }
 </style>

+ 1 - 2
src/pages/video/addVideo.vue

@@ -2,7 +2,7 @@
 <template>
   <div class="addVideo">
     <MainTop :crumb="[{ name: '视频管理 > 新增视频' }]" />
-    <div class="table-interface" style="flex: 1">
+    <div class="table-interface" style="flex: 1;overflow-y: auto;" >
       <div class="top-body">
         <div class="conten">
           <el-form
@@ -187,7 +187,6 @@ export default {
 }
 .top-body {
   padding: 24px;
-  height: 100%;
   margin: 1rem 0;
 }
 .conten {

+ 1 - 2
src/pages/video/editVideo.vue

@@ -2,7 +2,7 @@
 <template>
   <div class="addVideo">
     <MainTop :crumb="[{ name: '视频管理 > 编辑视频' }]" />
-    <div class="table-interface" style="flex: 1">
+    <div class="table-interface" style="flex: 1; overflow-y: auto;">
       <div class="top-body">
         <div class="conten">
           <el-form
@@ -197,7 +197,6 @@ export default {
 }
 .top-body {
   padding: 24px;
-  height: 100%;
   margin: 1rem 0;
 }
 .conten {

+ 6 - 1
src/pages/video/index.vue

@@ -1,7 +1,7 @@
 <template>
   <div class="scene">
     <MainTop :crumb="[{ name: '视频管理' }]" />
-    <div class="table-interface">
+    <div class="table-interface" style="flex: 1; overflow-y: auto">
       <div class="top-body">
         <div class="info-top">
           <el-form
@@ -40,6 +40,7 @@
             </div>
           </div>
         </div>
+
       </div>
     </div>
   </div>
@@ -156,6 +157,10 @@ export default {
 }
 </script>
 <style scoped>
+.scene {
+    display: flex;
+  flex-direction: column;
+}
 .table-interfac {
   overflow-y: auto;
   overflow-x: hidden;