1

src/components/stuMan/eventRecord.vue

 <template>
-  <!-- 可补课时 -->
-  <q-dialog v-model="persistent" content-class="bg-grey-1" persistent transition-show="scale" transition-hide="scale">
-    <q-card style="width: 900px;max-width:900px;">
+  <q-dialog
+    v-model="persistent"
+    content-class="bg-grey-1"
+    persistent
+    transition-show="scale"
+    transition-hide="scale"
+  >
+    <q-card style="width: 900px; max-width: 900px">
       <q-card-section>
         <div class="text-h6">事件记录</div>
       </q-card-section>
       <q-card-section class="q-pt-none">
-        <q-table :pagination="msg" :loading="loading" no-data-label="暂无相关数据" flat class="sticky-column-table "
-          separator="none" :data="data" :columns="columns" row-key="name">
+        <q-table
+          :pagination="msg"
+          :loading="loading"
+          no-data-label="暂无相关数据"
+          flat
+          class="sticky-column-table"
+          separator="none"
+          :data="data"
+          :columns="columns"
+          row-key="name"
+        >
           <template v-slot:top="props">
-            <!-- <div class="col-2 q-table__title">可补课课时</div> -->
+            <!-- <div class="col-2 q-table__title">事件记录</div> -->
           </template>
           <template v-slot:body-cell-EventType="props">
-          <q-td :props="props">
-            <div v-if="props.row.EventType===1" style="color:#ff0000">处分</div>
-            <div v-if="props.row.EventType===2" style="color:#00ff00">奖励</div>
-          </q-td>
-        </template>
-           <template v-slot:body-cell-optioned="props">
-          <q-td :props="props">
-            <div>
-              <q-btn  size="xs" color="accent" style="font-weight:400" label="修改"
-                @click="modify(props.row)" />
-            </div>
-          </q-td>
-        </template>
+            <q-td :props="props">
+              <div v-if="props.row.EventType === 1" style="color: #ff0000">
+                处分
+              </div>
+              <div v-if="props.row.EventType === 2" style="color: #00ff00">
+                奖励
+              </div>
+            </q-td>
+          </template>
+          <template v-slot:body-cell-optioned="props">
+            <q-td :props="props">
+              <div>
+                <q-btn
+                  size="xs"
+                  color="accent"
+                  style="font-weight: 400"
+                  label="修改"
+                  @click="modify(props.row)"
+                />
+              </div>
+            </q-td>
+          </template>
           <template v-slot:bottom>
-            <q-pagination class="full-width justify-end" v-model="msg.pageIndex" color="primary" :max="pageCount"
-              :input="true" @input="changePage" />
+            <q-pagination
+              class="full-width justify-end"
+              v-model="msg.pageIndex"
+              color="primary"
+              :max="pageCount"
+              :input="true"
+              @input="changePage"
+            />
           </template>
         </q-table>
       </q-card-section>
       <q-card-actions align="right" class="bg-white">
-        <q-btn label="取消" flat color="grey-10" style="font-weight:400 !important" @click="closeSaveForm" />
+        <q-btn
+          label="取消"
+          flat
+          color="grey-10"
+          style="font-weight: 400 !important"
+          @click="closeSaveForm"
+        />
         <!-- <q-btn label="立即提交" color="accent q-px-md" style="font-weight:400 !important" :loading="saveLoading"
           @click="save" /> -->
       </q-card-actions>
@@ -41,188 +76,184 @@
 </template>
 
 <script>
-  import {
-    getEventLogPageList
-  } from '../../api/stuMan/index.js'
-  export default {
-    props: {
-      setObj: {
-        type: Object,
-      }
+import { getEventLogPageList } from "../../api/stuMan/index.js";
+export default {
+  props: {
+    setObj: {
+      type: Object,
     },
-    data() {
-      return {
-        persistent: true,
-        loading: false,
-        pageCount: 0,
-        msg: {
-          pageIndex: 1,
-          pageSize: 10,
-          rowsPerPage: 10,
-          StuId:0,
-          EventType:0
+  },
+  data() {
+    return {
+      persistent: true,
+      loading: false,
+      pageCount: 0,
+      msg: {
+        pageIndex: 1,
+        pageSize: 10,
+        rowsPerPage: 10,
+        StuId: 0,
+        EventType: 0,
+      },
+      data: [],
+      columns: [
+        {
+          name: "Title",
+          label: "标题",
+          align: "left",
+          field: "Title",
+        },
+        {
+          name: "EventType",
+          label: "类型",
+          align: "left",
+          field: "EventType",
+        },
+        {
+          name: "EventContent",
+          label: "内容",
+          align: "left",
+          field: "EventContent",
+          required: true,
         },
-        data: [],
-        columns: [
-          {
-            name: "Title",
-            label: "标题",
-            align: "left",
-            field: "Title",
-          },
-           {
-            name: "EventType",
-            label: "类型",
-            align: "left",
-            field: "EventType"
-          },
-          {
-            name: "EventContent",
-            label: "内容",
-            align: "left",
-            field: "EventContent",
-            required: true,
-          },
-         
-          {
-            name: "CreateByName",
-            label: "创建人",
-            align: "left",
-            field: "CreateByName",
-          },
-          {
-            name: "CreateTime",
-            label: "创建时间",
-            align: "left",
-            field: "CreateTime",
-          },
-          {
-            name: "optioned",
-            label: "操作",
-            align: "left",
-          },
-        ]
-      }
+
+        {
+          name: "CreateByName",
+          label: "创建人",
+          align: "left",
+          field: "CreateByName",
+        },
+        {
+          name: "CreateTime",
+          label: "创建时间",
+          align: "left",
+          field: "CreateTime",
+        },
+        {
+          name: "optioned",
+          label: "操作",
+          align: "left",
+        },
+      ],
+    };
+  },
+  mounted() {
+    if (this.setObj) {
+      this.msg.StuId = this.setObj.Id;
+    }
+
+    this.getList();
+  },
+  methods: {
+    closeSaveForm() {
+      this.$emit("close");
+      this.persistent = false;
     },
-    mounted() {
-      if (this.setObj) {
-        this.msg.StuId = this.setObj.Student_Id
-      }
-     
+    getList() {
+      getEventLogPageList(this.msg).then((res) => {
+        if (res.Code === 1) {
+          this.data = res.Data.PageData;
+          this.pageCount = res.Data.PageCount;
+        }
+      });
+    },
+    //重新查询
+    resetSearch() {
+      this.msg.pageIndex = 1;
       this.getList();
     },
-    methods: {
-      closeSaveForm() {
-        this.$emit('close')
-        this.persistent = false
-      },
-      getList() {
-        getEventLogPageList(this.msg).then(res => {
-          if (res.Code === 1) {
-            this.data = res.Data.PageData
-            this.pageCount = res.Data.PageCount
-          }
-        })
-      },
-      //重新查询
-      resetSearch() {
-        this.msg.pageIndex = 1;
-        this.getList();
-      },
-      //翻页
-      changePage(val) {
-        this.msg.pageIndex = val;
-        this.getList()
-      },
-      //修改
-      modify(item){
-         this.persistent = false
-         this.$emit('modify',item)
-      }
+    //翻页
+    changePage(val) {
+      this.msg.pageIndex = val;
+      this.getList();
     },
-  }
-
+    //修改
+    modify(item) {
+      this.persistent = false;
+      this.$emit("modify", item);
+    },
+  },
+};
 </script>
 
 <style>
-  .avatar-uploader .el-upload {
-    border-radius: 6px;
-    cursor: pointer;
-    width: 100%;
-    height: 100%;
-    color: #8c939d;
-    position: relative;
-    overflow: hidden;
-  }
-
-  .addDutyMain {
-    display: inline-block;
-    width: 118px;
-    height: 118px;
-    font-size: 70px;
-    border: 1px dashed #d9d9d9;
-    line-height: 120px;
-  }
+.avatar-uploader .el-upload {
+  border-radius: 6px;
+  cursor: pointer;
+  width: 100%;
+  height: 100%;
+  color: #8c939d;
+  position: relative;
+  overflow: hidden;
+}
 
-  .ItemImgDiv {
-    width: 118px;
-    height: 118px;
-    position: relative;
-    margin: 0 10px 10px 0;
-    display: inline-block;
-  }
+.addDutyMain {
+  display: inline-block;
+  width: 118px;
+  height: 118px;
+  font-size: 70px;
+  border: 1px dashed #d9d9d9;
+  line-height: 120px;
+}
 
-  ._delete_img {
-    position: absolute;
-    top: 0px;
-    height: 82px;
-    width: 143px;
-    line-height: 34px;
-    text-align: center;
-    background-color: rgba(2, 2, 2, 0.6);
-    display: inherit;
-    opacity: 0;
-    transition: all linear .5s
-  }
+.ItemImgDiv {
+  width: 118px;
+  height: 118px;
+  position: relative;
+  margin: 0 10px 10px 0;
+  display: inline-block;
+}
 
-  ._delete_img i.iconfont {
-    display: inline-block;
-    width: 32px;
-    height: 32px;
-    border-radius: 50%;
-    color: #E95252 !important;
-    background-color: rgba(251, 251, 251, 0.9);
-    margin-top: 26px;
-  }
+._delete_img {
+  position: absolute;
+  top: 0px;
+  height: 82px;
+  width: 143px;
+  line-height: 34px;
+  text-align: center;
+  background-color: rgba(2, 2, 2, 0.6);
+  display: inherit;
+  opacity: 0;
+  transition: all linear 0.5s;
+}
 
-  ._upload_box ul li {
-    float: left;
-    height: 82px;
-    width: 143px;
-    padding: 0px 20px 20px 0;
-    text-align: center;
-    position: relative;
-    cursor: pointer;
-    margin-right: 10px;
-  }
+._delete_img i.iconfont {
+  display: inline-block;
+  width: 32px;
+  height: 32px;
+  border-radius: 50%;
+  color: #e95252 !important;
+  background-color: rgba(251, 251, 251, 0.9);
+  margin-top: 26px;
+}
 
-  ._upload_box ul li img {
-    height: 82px;
-    width: 143px;
-  }
+._upload_box ul li {
+  float: left;
+  height: 82px;
+  width: 143px;
+  padding: 0px 20px 20px 0;
+  text-align: center;
+  position: relative;
+  cursor: pointer;
+  margin-right: 10px;
+}
 
-  ._upload_box ul li:hover ._delete_img {
-    opacity: 1;
-  }
+._upload_box ul li img {
+  height: 82px;
+  width: 143px;
+}
 
-  ._upload_tips {
-    font-size: 12px;
-    position: absolute;
-    top: 71%;
-    width: 100%;
-    left: 0;
-    text-align: center;
-    color: #949494;
-  }
+._upload_box ul li:hover ._delete_img {
+  opacity: 1;
+}
 
+._upload_tips {
+  font-size: 12px;
+  position: absolute;
+  top: 71%;
+  width: 100%;
+  left: 0;
+  text-align: center;
+  color: #949494;
+}
 </style>