From 54e06ab83d8fbebf91f8e0c3a621da743ac5af26 Mon Sep 17 00:00:00 2001
From: 黄何裕 <1053952480@qq.com>
Date: 星期四, 08 八月 2024 09:28:06 +0800
Subject: [PATCH] 课表页面开发

---
 src/views/rollCall/index.vue |  336 ++++++++++++++++++++++++++++++++++++++++++-------------
 1 files changed, 256 insertions(+), 80 deletions(-)

diff --git a/src/views/rollCall/index.vue b/src/views/rollCall/index.vue
index a42846b..6f529cd 100644
--- a/src/views/rollCall/index.vue
+++ b/src/views/rollCall/index.vue
@@ -1,115 +1,291 @@
 <template>
-    <div class="app-container">
-      <el-tabs v-model="activeName" @tab-click="handleClick">
-        <el-tab-pane label="鎸夊鍛�" name="first">
-          <div style="display: flex; flex-direction: row-reverse">
-            <div style="width: 300px">
-              <el-input
-                placeholder="鎸夋爣棰樻悳绱�"
-                v-model="input3"
-                class="input-with-select"
-                size="small"
-              >
-                <el-button slot="append" icon="el-icon-search"></el-button>
-              </el-input>
-            </div>
+  <div class="app-container">
+    <el-tabs v-model="activeName" @tab-click="fetchData">
+      <el-tab-pane label="鎸夊鍛�" name="student">
+        <div style="display: flex; flex-direction: row-reverse">
+          <div style="width: 300px">
+            <el-input
+              placeholder="鎸夋爣棰樻悳绱�"
+              v-model="data.keyword"
+              class="input-with-select"
+              size="small"
+            >
+              <el-button
+                slot="append"
+                icon="el-icon-search"
+                @click="fetchData"
+              ></el-button>
+            </el-input>
           </div>
+        </div>
+        <div style="height: calc(100vh - 248px)">
           <el-table
             v-loading="listLoading"
             :data="list"
             element-loading-text="Loading"
             fit
+            height="100%"
           >
             <el-table-column label="濮撳悕">
-              <template slot-scope=""> xxxxx </template>
+              <template slot-scope="scope">
+                <el-link type="primary" :underline="false">{{
+                  scope.row.player.name
+                }}</el-link>
+              </template>
             </el-table-column>
-            <el-table-column label="璇惧寘/浼氬憳鍗�" width="80">
-              <template slot-scope=""> 鐢� </template>
+            <el-table-column label="璇惧寘/浼氬憳鍗�" width="">
+              <template slot-scope="scope"
+                >{{ scope.row.voucher.name }}
+              </template>
             </el-table-column>
-            <el-table-column label="涓婅鏃ユ湡" width="200">
-              <template slot-scope=""> 10086 </template>
+            <el-table-column label="浣欓" width="" prop="qty">
             </el-table-column>
-            <el-table-column label="璇剧▼鏃堕暱" width="200">
-              <template slot-scope=""> 10086 </template>
-            </el-table-column>
-            <el-table-column label="寮�濮嬫椂闂�" width="200">
-              <template slot-scope=""> 10086 </template>
-            </el-table-column>
-            <el-table-column label="璇炬秷鏁伴噺" width="200">
-              <template slot-scope=""> 10086 </template>
+            <el-table-column label="鍒版湡鏃堕棿" width="" prop="endDate">
+              <template slot-scope="scope"
+                >{{ timeCompare(scope.row.endDate) }}
+              </template>
             </el-table-column>
             <el-table-column label="鎿嶄綔" width="">
-              <template slot-scope=""> 鍏戞崲 鍙戞斁 </template>
+              <template slot-scope=""> 鐐瑰悕 </template>
             </el-table-column>
           </el-table>
-        </el-tab-pane>
-        <el-tab-pane label="鎸夌彮绾�" name="fourth">
-          <div style="display: flex; flex-direction: row-reverse">
-            <div style="width: 300px">
-              <el-input
-                placeholder="鎸夊鍛樺悕绉版悳绱�"
-                v-model="input3"
-                class="input-with-select"
-                size="small"
-              >
-                <el-button slot="append" icon="el-icon-search"></el-button>
-              </el-input>
-            </div>
+        </div>
+        <div>
+          <el-pagination
+            @size-change="handleSizeChange"
+            @current-change="handleCurrentChange"
+            :current-page="data.pageIn.index + 1"
+            :page-sizes="[10, 20, 30, 40]"
+            :page-size="data.pageIn.size"
+            layout="total, sizes, prev, pager, next, jumper"
+            :total="total"
+          >
+          </el-pagination>
+        </div>
+      </el-tab-pane>
+      <el-tab-pane label="鎸夌彮绾�" name="class">
+        <div style="display: flex; flex-direction: row-reverse">
+          <div style="width: 300px">
+            <el-input
+              placeholder="鎸夊鍛樺悕绉版悳绱�"
+              v-model="data.keyword"
+              class="input-with-select"
+              size="small"
+            >
+              <el-button
+                slot="append"
+                icon="el-icon-search"
+                @click="fetchData"
+              ></el-button>
+            </el-input>
           </div>
+        </div>
+        <div style="height: calc(100vh - 248px)">
           <el-table
             v-loading="listLoading"
             :data="list"
             element-loading-text="Loading"
             fit
+            height="100%"
           >
             <el-table-column label="鐝骇">
-              <template slot-scope=""> xxxxx </template>
-            </el-table-column>
-            <el-table-column label="瀛﹀憳浜烘暟" width="80">
-              <template slot-scope=""> 鐢� </template>
+              <template slot-scope="scope">
+                <el-link type="primary" :underline="false">{{
+                  scope.row.name
+                }}</el-link>
+              </template>
             </el-table-column>
             <el-table-column label="鎿嶄綔" width="">
-              <template slot-scope=""> 鍙戞斁 </template>
+              <template slot-scope=""> 鐐瑰悕 </template>
             </el-table-column>
           </el-table>
-        </el-tab-pane>
-      </el-tabs>
-    </div>
-  </template>
-  
-  <script>
-  import { getList } from "@/api/table";
-  
-  export default {
-    filters: {
-      statusFilter(status) {
-        const statusMap = {
-          published: "success",
-          draft: "gray",
-          deleted: "danger",
-        };
-        return statusMap[status];
-      },
-    },
-    data() {
-      return {
-        list: null,
-        listLoading: true,
-        activeName: "first",
+        </div>
+        <div>
+          <el-pagination
+            @size-change="handleSizeChange"
+            @current-change="handleCurrentChange"
+            :current-page="data.pageIn.index + 1"
+            :page-sizes="[10, 20, 30, 40]"
+            :page-size="data.pageIn.size"
+            layout="total, sizes, prev, pager, next, jumper"
+            :total="total"
+          >
+          </el-pagination>
+        </div>
+      </el-tab-pane>
+      <el-tab-pane label="鎸夎绋�" name="course">
+        <div style="display: flex; flex-direction: row-reverse">
+          <div style="width: 300px">
+            <el-input
+              placeholder="鎸夎绋嬪悕绉版悳绱�"
+              v-model="data.keyword"
+              class="input-with-select"
+              size="small"
+            >
+              <el-button
+                slot="append"
+                icon="el-icon-search"
+                @click="fetchData"
+              ></el-button>
+            </el-input>
+          </div>
+        </div>
+        <div style="height: calc(100vh - 248px)">
+          <el-table
+            v-loading="listLoading"
+            :data="list"
+            element-loading-text="Loading"
+            fit
+            height="100%"
+          >
+            <el-table-column label="璇剧▼">
+              <template slot-scope="scope">
+                <el-link type="primary" :underline="false">{{
+                  scope.row.courseName
+                }}</el-link>
+              </template>
+            </el-table-column>
+            <el-table-column label="寮�濮嬫椂闂�" width="" prop="beginTime">
+            </el-table-column>
+            <el-table-column label="缁撴潫鏃堕棿" width="" prop="endTime">
+            </el-table-column>
+            <el-table-column label="瀛﹀憳浜烘暟" width="" prop="playerCount">
+            </el-table-column>
+            <el-table-column label="鎿嶄綔" width="">
+              <template slot-scope=""> 鐐瑰悕 </template>
+            </el-table-column>
+          </el-table>
+        </div>
+        <div>
+          <el-pagination
+            @size-change="handleSizeChange"
+            @current-change="handleCurrentChange"
+            :current-page="data.pageIn.index + 1"
+            :page-sizes="[10, 20, 30, 40]"
+            :page-size="data.pageIn.size"
+            layout="total, sizes, prev, pager, next, jumper"
+            :total="total"
+          >
+          </el-pagination>
+        </div>
+      </el-tab-pane>
+    </el-tabs>
+  </div>
+</template>
+
+<script>
+import {
+  getPlayerAccByStaffWithRollCall,
+  getTeamByStaffWithRollCall,
+  getUnCompleteSession,
+} from "@/api/rollCall";
+
+export default {
+  filters: {
+    statusFilter(status) {
+      const statusMap = {
+        published: "success",
+        draft: "gray",
+        deleted: "danger",
       };
+      return statusMap[status];
     },
-    created() {
-      this.fetchData();
+  },
+  data() {
+    return {
+      list: null,
+      listLoading: true,
+      activeName: "student",
+      total: 0,
+      data: {
+        staffId: JSON.parse(localStorage.getItem("user")).staffs[0].id,
+        keyword: "",
+        pageIn: {
+          //鍙�夛紝濡傛灉鏄垎椤垫煡璇紝闇�瑕佸姞涓娿��
+          index: 0, //蹇呴��
+          size: 10, //姣忛〉鐨勫ぇ灏忋�傞粯璁�20
+          sorts: [
+            { name: "modifyTime", direction: "DESC" },
+            { name: "player.name", direction: "ASC" },
+          ],
+        },
+      },
+    };
+  },
+  created() {
+    this.fetchData();
+  },
+  methods: {
+    handleSizeChange(val) {
+      this.data.pageIn.size = val;
+      this.fetchData("pageIn");
     },
-    methods: {
-      fetchData() {
+    handleCurrentChange(val) {
+      this.data.pageIn.index = val - 1;
+      this.fetchData("pageIn");
+    },
+    fetchData(_val) {
+      if (_val !== "pageIn") {
+        this.data.pageIn.index = 0;
+        this.data.pageIn.size = 10;
+      }
+      this.listLoading = true;
+      if (this.activeName == "student") {
         this.listLoading = true;
-        getList().then((response) => {
-          this.list = response.data.items;
+        getPlayerAccByStaffWithRollCall(this.data).then((response) => {
+          this.list = response.data.findPlayerAccByStaffWithRollCall.ls;
+          this.total =
+            response.data.findPlayerAccByStaffWithRollCall.pageOut.total;
           this.listLoading = false;
         });
-      },
+      } else if (this.activeName == "class") {
+        this.listLoading = true;
+        let data = {
+          types: ["NORMAL"],
+          staffId: JSON.parse(localStorage.getItem("user")).staffs[0].id,
+          keyword: this.data.keyword,
+          pageIn: { ...this.data.pageIn },
+        };
+        data.pageIn.sorts = [
+          { name: "modifyTime", direction: "DESC" },
+          { name: "name", direction: "ASC" },
+        ];
+        getTeamByStaffWithRollCall(data).then((response) => {
+          this.list = response.data.findTeamByStaffWithRollCall.ls;
+          this.total = response.data.findTeamByStaffWithRollCall.pageOut.total;
+          this.listLoading = false;
+        });
+      } else if (this.activeName == "course") {
+        this.listLoading = true;
+        let data = {
+          completeTypes: ["ROLL_CALL"],
+          staffId: JSON.parse(localStorage.getItem("user")).staffs[0].id,
+          keyword: this.data.keyword,
+          pageIn: { ...this.data.pageIn },
+        };
+        data.pageIn.sorts = [
+          { name: "s.begin_time", direction: "DESC" },
+          { name: "courseName", direction: "ASC" },
+        ];
+        getUnCompleteSession(data).then((response) => {
+          this.list = response.data.findUnCompleteSession.ls;
+          this.total = response.data.findUnCompleteSession.pageOut.total;
+          this.listLoading = false;
+        });
+      }
     },
-  };
-  </script>
-  
\ No newline at end of file
+    timeCompare(time) {
+      if (!time) {
+        return "";
+      }
+      let timeDate = new Date(time);
+      let nowTime = new Date();
+      if (nowTime > timeDate) {
+        return time + "(宸茶繃鏈�)";
+      } else {
+        return time;
+      }
+    },
+  },
+};
+</script>

--
Gitblit v1.8.0