|
|
@@ -0,0 +1,240 @@
|
|
|
+<template>
|
|
|
+ <div class="content">
|
|
|
+ <van-nav-bar title="班级点名情况" left-arrow @click-left="onClickLeft" />
|
|
|
+ <van-cell title="选择单个日期" is-link :value="currentTime" @click="showCalendar" />
|
|
|
+ <van-calendar
|
|
|
+ :show="show"
|
|
|
+ @confirm="onConfirm"
|
|
|
+ :min-date="new Date('1970/01/01')"
|
|
|
+ :max-date="new Date('2099/01/31')"
|
|
|
+ @close="show = false"
|
|
|
+ />
|
|
|
+ <van-list>
|
|
|
+ <van-cell
|
|
|
+ v-for="item in list"
|
|
|
+ :key="item"
|
|
|
+ @click="detailData(item.cm_id), (toDetail = true)"
|
|
|
+ >
|
|
|
+ <template #title>
|
|
|
+ <div
|
|
|
+ style="display: flex; justify-content: space-between; color: black"
|
|
|
+ >
|
|
|
+ <span>{{ item.cm_name }}</span>
|
|
|
+ <span>{{ item.ydmqk_desc }}</span>
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+
|
|
|
+ <template #label>
|
|
|
+ <div style="color: black">
|
|
|
+ <span>{{ item.ydmqk_alyz_desc }}</span>
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ </van-cell>
|
|
|
+ </van-list>
|
|
|
+ <div v-show="toDetail" class="cover"></div>
|
|
|
+ <div class="detail-list" v-if="toDetail">
|
|
|
+ <van-icon @click="toDetail = false" name="cross" size="0.4*13.3vw" />
|
|
|
+ <div class="listStyle">
|
|
|
+ <table
|
|
|
+ v-if="member.length > 0"
|
|
|
+ cellpadding="0"
|
|
|
+ cellspacing="0"
|
|
|
+ align="center"
|
|
|
+ valign="middle"
|
|
|
+ >
|
|
|
+ <tr v-for="(item, index) in member" :key="index">
|
|
|
+ <td colspan="2">{{ item.realname }}</td>
|
|
|
+ <td colspan="3">{{ item.ydmzt_desc }}</td>
|
|
|
+ </tr>
|
|
|
+ </table>
|
|
|
+ <div v-else>暂无数据</div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+import { team_list } from "./api";
|
|
|
+
|
|
|
+export default {
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ currentTime: "",
|
|
|
+ show: false,
|
|
|
+ loading: false,
|
|
|
+ kxq_code: "",
|
|
|
+ teamData: [],
|
|
|
+ list: [],
|
|
|
+ toDetail: false,
|
|
|
+ member: [],
|
|
|
+ };
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ showCalendar() {
|
|
|
+ this.show = true;
|
|
|
+ },
|
|
|
+ formatDate(date) {
|
|
|
+ return `${date.getFullYear()}-${
|
|
|
+ date.getMonth() + 1 >= 1 && date.getMonth() + 1 <= 9
|
|
|
+ ? "0" + (date.getMonth() + 1)
|
|
|
+ : date.getMonth() + 1
|
|
|
+ }-${
|
|
|
+ date.getDate() >= 0 && date.getDate() <= 9
|
|
|
+ ? "0" + date.getDate()
|
|
|
+ : date.getDate()
|
|
|
+ }`;
|
|
|
+ },
|
|
|
+ onConfirm(date) {
|
|
|
+ this.currentTime = this.formatDate(date);
|
|
|
+ this.onLoad();
|
|
|
+ this.show = false;
|
|
|
+ },
|
|
|
+
|
|
|
+ getTeamData() {
|
|
|
+ team_list().then((res) => {
|
|
|
+ this.teamData = res.data.page_data;
|
|
|
+ this.teamData.map((item) => {
|
|
|
+ if (item.kxq_sfdqxq_option_k == "1") {
|
|
|
+ this.kxq_code = item.kxq_code;
|
|
|
+ this.onLoad();
|
|
|
+ }
|
|
|
+ });
|
|
|
+ });
|
|
|
+ },
|
|
|
+ getTimeFormat() {
|
|
|
+ var date = new Date();
|
|
|
+ var month = date.getMonth() + 1;
|
|
|
+ var strDate = date.getDate();
|
|
|
+ if (month >= 1 && month <= 9) {
|
|
|
+ month = "0" + month;
|
|
|
+ }
|
|
|
+ if (strDate >= 0 && strDate <= 9) {
|
|
|
+ strDate = "0" + strDate;
|
|
|
+ }
|
|
|
+ this.currentTime = date.getFullYear() + "-" + month + "-" + strDate;
|
|
|
+ },
|
|
|
+
|
|
|
+ onLoad() {
|
|
|
+ this.loading = true;
|
|
|
+ request({
|
|
|
+ url: "/khfw/kccq/class_ydmqk",
|
|
|
+ data: {
|
|
|
+ kxq_code: this.kxq_code,
|
|
|
+ date: this.currentTime,
|
|
|
+ },
|
|
|
+ }).then((res) => {
|
|
|
+ this.list = res.data;
|
|
|
+ this.loading = false;
|
|
|
+ });
|
|
|
+ },
|
|
|
+ detailData(id) {
|
|
|
+ this.list.map((item) => {
|
|
|
+ if (item.cm_id == id) {
|
|
|
+ this.member = item.member;
|
|
|
+ }
|
|
|
+ });
|
|
|
+ },
|
|
|
+ onClickLeft() {
|
|
|
+ this.$router.push({ name: "user" });
|
|
|
+ },
|
|
|
+ },
|
|
|
+ mounted() {
|
|
|
+ this.getTeamData();
|
|
|
+ this.getTimeFormat();
|
|
|
+ },
|
|
|
+};
|
|
|
+</script>
|
|
|
+
|
|
|
+<style lang="scss" scoped>
|
|
|
+.van-tabs__nav {
|
|
|
+ background: #fff;
|
|
|
+ .van-tab {
|
|
|
+ margin-right: 0.5 * 13.3vw;
|
|
|
+ }
|
|
|
+ .van-tab {
|
|
|
+ border-bottom: 0.1 * 13.3vw solid rgba(0, 0, 0, 0);
|
|
|
+ }
|
|
|
+ .van-tab--active {
|
|
|
+ font-weight: 400;
|
|
|
+ box-sizing: border-box;
|
|
|
+ border-bottom: 0.05 * 13.3vw solid #003eee;
|
|
|
+ }
|
|
|
+}
|
|
|
+.van-tabs__line {
|
|
|
+ background: unset;
|
|
|
+}
|
|
|
+.van-tabs__content {
|
|
|
+ // margin-top: 0.1 * 13.3vw;
|
|
|
+ line-height: 0;
|
|
|
+ padding: 0;
|
|
|
+}
|
|
|
+
|
|
|
+::v-deep .van-nav-bar {
|
|
|
+ width: 100%;
|
|
|
+ height: 1 * 13.3vw;
|
|
|
+ line-height: 1 * 13.3vw;
|
|
|
+ background-color: #003eee;
|
|
|
+ .van-nav-bar__title {
|
|
|
+ color: #fff !important;
|
|
|
+ font-size: 0.36 * 13.3vw;
|
|
|
+ font-weight: 350;
|
|
|
+ }
|
|
|
+ .van-nav-bar__text {
|
|
|
+ color: #fff !important;
|
|
|
+ font-size: 0.32 * 13.3vw;
|
|
|
+ font-weight: 350;
|
|
|
+ }
|
|
|
+}
|
|
|
+.cover {
|
|
|
+ position: fixed;
|
|
|
+ top: 0;
|
|
|
+ width: 100vw;
|
|
|
+ height: 100vh;
|
|
|
+ background-color: #000000;
|
|
|
+ opacity: 0.3;
|
|
|
+}
|
|
|
+.detail-list {
|
|
|
+ width: 6.8 * 13.3vw;
|
|
|
+ // height: 8.24 * 13.3vw;
|
|
|
+ color: #333333;
|
|
|
+ background-color: #fff;
|
|
|
+ position: fixed;
|
|
|
+ top: 1.5 * 13.3vw;
|
|
|
+ left: 0.32 * 13.3vw;
|
|
|
+ border-radius: 0.1 * 13.3vw;
|
|
|
+ z-index: 5;
|
|
|
+ padding: 0.2 * 13.3vw 0.1 * 13.3vw;
|
|
|
+ box-sizing: border-box;
|
|
|
+ i {
|
|
|
+ position: absolute;
|
|
|
+ right: 0.2 * 13.3vw;
|
|
|
+ top: 0.23 * 13.3vw;
|
|
|
+ }
|
|
|
+ .listStyle {
|
|
|
+ height: 8 * 13.3vw;
|
|
|
+ margin: 0.5 * 13.3vw 0.3 * 13.3vw;
|
|
|
+ overflow: scroll;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+table {
|
|
|
+ table-layout: fixed;
|
|
|
+ width: 100%;
|
|
|
+ padding: auto;
|
|
|
+ border-top: 1px solid #000;
|
|
|
+ border-left: 1px solid #000;
|
|
|
+}
|
|
|
+
|
|
|
+tr {
|
|
|
+ height: 30px;
|
|
|
+ line-height: 30px;
|
|
|
+ text-align: left;
|
|
|
+}
|
|
|
+
|
|
|
+td {
|
|
|
+ border-bottom: 1px solid #000;
|
|
|
+ border-right: 1px solid #000;
|
|
|
+ box-sizing: border-box;
|
|
|
+ padding-left: 1%;
|
|
|
+}
|
|
|
+</style>
|
houxq