样式调整

src/components/schedul/reservestudentlist.vue

 <template>
-  <div class="page-content"
-  :class="[$q.platform.is.desktop?'':'']">
+  <div class="page-content" :class="[$q.platform.is.desktop?'':'']">
     <q-table v-if="$q.platform.is.desktop" :pagination="pageMsg" :loading="loading" no-data-label="暂无相关数据" flat
       class="sticky-column-table sticky-right-column-table" separator="none" :data="data" :columns="columns"
       :visible-columns="visibleColumns" row-key="name">
       <template v-slot:top>
-        <div class="q-table__title"
-        :class="[$q.platform.is.desktop?'col-2':'col-12']">试听开课管理</div>
+        <div class="q-table__title" :class="[$q.platform.is.desktop?'col-2':'col-12']">试听开课管理</div>
         <q-space />
-
       </template>
       <template v-slot:body-cell-ReservationDate="props">
         <q-td>
@@ -21,8 +18,8 @@
         <q-td :props="props">
           <div style="min-width: 150px;word-break: break-word;white-space: normal;">
             {{ props.row.ClassDateStr }} {{ props.row.ClassTime }}
-                    <template v-if="props.row.ClassDateStr&&props.row.ClassDateStr.length>0">-</template>
-                    {{ props.row.EndTime }}
+            <template v-if="props.row.ClassDateStr&&props.row.ClassDateStr.length>0">-</template>
+            {{ props.row.EndTime }}
           </div>
         </q-td>
       </template>
@@ -41,12 +38,8 @@
       </template>
     </q-table>
     <template v-if="$q.platform.is.mobile">
-      <q-card
-        class="light-shadow q-pa-md bg-grey-1 rounded-borders q-mb-md"
-        flat
-        v-for="(x, index) in data"
-        :key="index"
-      >
+      <q-card class="light-shadow q-pa-md bg-grey-1 rounded-borders q-mb-md" flat v-for="(x, index) in data"
+        :key="index">
         <div class="row justify-between">
           <div>学生：<span class="text-blue-5">{{x.StuName}}</span></div>
           <div>试听日期：<span class="text-blue-5">{{timeFormatSeconds(x.ReservationDate)}}</span></div>
@@ -67,8 +60,8 @@
           </div>
         </div>
         <div class="row justify-end">
-          <q-btn  label="修改" color="primary" flat @click="editVisitor(x)"/>
-          <q-btn  label="删除" color="red-6" flat @click="DeleteVisitorReserve(x.Id)"/>
+          <q-btn label="修改" color="primary" flat @click="editVisitor(x)" />
+          <q-btn label="删除" color="red-6" flat @click="DeleteVisitorReserve(x.Id)" />
         </div>
       </q-card>
     </template>
@@ -103,9 +96,8 @@
     },
     data() {
       return {
-        columns: [
-        {
-           name: 'StuName',
+        columns: [{
+            name: 'StuName',
             label: '学生名称',
             align: 'left',
             field: 'StuName',
@@ -161,7 +153,7 @@
         ],
         //表格可见列
         visibleColumns: [
-          'StuName','ReservationDate', 'Demand', 'ClassDateStr', 'TeacherName', 'LessonName', 'RoomName', 'TeacherId'
+          'StuName', 'ReservationDate', 'Demand', 'ClassDateStr', 'TeacherName', 'LessonName', 'RoomName', 'TeacherId'
         ], //可见列
         reserveObj: {},
         isShowReserve: false,
@@ -181,31 +173,31 @@
     },
     methods: {
       //获得年月日时分秒
-//传入日期//例：2020-10-27T14:36:23
-  timeFormatSeconds(time,type) {
-    let timeStr="";
-    if(time==='0001-01-01T00:00:00'){
-      return timeStr;
-    }
-    var d = time ? new Date(time) : new Date();
-    var year = d.getFullYear();
-    var month = d.getMonth() + 1;
-    var day = d.getDate();
-    if (month < 10) month = '0' + month;
-    if (day < 10) day = '0' + day;
-    if(type==2){
-      var hours = d.getHours();
-      var min = d.getMinutes();
-      var seconds = d.getSeconds();
-      if (hours < 0) hours = '0' + hours;
-      if (min < 10) min = '0' + min;
-      if (seconds < 10) seconds = '0' + seconds;
-      timeStr+= ' ' + hours + ':' + min + ':' + seconds;
-    }
+      //传入日期//例：2020-10-27T14:36:23
+      timeFormatSeconds(time, type) {
+        let timeStr = "";
+        if (time === '0001-01-01T00:00:00') {
+          return timeStr;
+        }
+        var d = time ? new Date(time) : new Date();
+        var year = d.getFullYear();
+        var month = d.getMonth() + 1;
+        var day = d.getDate();
+        if (month < 10) month = '0' + month;
+        if (day < 10) day = '0' + day;
+        if (type == 2) {
+          var hours = d.getHours();
+          var min = d.getMinutes();
+          var seconds = d.getSeconds();
+          if (hours < 0) hours = '0' + hours;
+          if (min < 10) min = '0' + min;
+          if (seconds < 10) seconds = '0' + seconds;
+          timeStr += ' ' + hours + ':' + min + ':' + seconds;
+        }
 
-    timeStr=year + '-' + month + '-' + day +timeStr;
-return timeStr;
-},
+        timeStr = year + '-' + month + '-' + day + timeStr;
+        return timeStr;
+      },
       //编辑试听
       editVisitor(obj) {
         this.reserveObj = obj
@@ -220,8 +212,8 @@ return timeStr;
       },
 
 
-           //删除试听
-           DeleteVisitorReserve(Id) {
+      //删除试听
+      DeleteVisitorReserve(Id) {
         let that = this;
         this.$q
           .dialog({
@@ -250,7 +242,9 @@ return timeStr;
 
     }
   }
+
 </script>
 <style lang="sass">
   @import url('~assets/css/table.sass')
+
 </style>