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