From 02c2abb2888dada3ad2898f247fe4ec2930a6906 Mon Sep 17 00:00:00 2001 From: 龚焕茏 <2842157468@qq.com> Date: 星期五, 06 九月 2024 16:18:56 +0800 Subject: [PATCH] 导出 --- src/views/session/index.vue | 179 +++++++++++++++++ src/views/session/components/create.vue | 190 +++++++++++++++++++ src/router/index.js | 13 + src/views/session/components/details.vue | 185 ++++++++++++++++++ 4 files changed, 567 insertions(+), 0 deletions(-) diff --git a/src/router/index.js b/src/router/index.js index ee4ea47..0361468 100644 --- a/src/router/index.js +++ b/src/router/index.js @@ -82,6 +82,19 @@ }, ], }, + { + path: "/", + component: Layout, + redirect: "/session", + children: [ + { + path: "/session", + name: "Session", + component: () => import("@/views/session/index"), + meta: { title: "鎶ュ憡", icon: "table" }, + }, + ], + }, // { // path: "/educational", // component: Layout, diff --git a/src/views/session/components/create.vue b/src/views/session/components/create.vue new file mode 100644 index 0000000..5a8c4a2 --- /dev/null +++ b/src/views/session/components/create.vue @@ -0,0 +1,190 @@ +<template> + <div class="app-container"> + <el-dialog + title="娣诲姞瀛﹀憳" + :visible.sync="dialogVisible" + width="30%" + :before-close="handleClose" + > + <el-form ref="form" :model="createData" label-width="100px"> + <el-form-item label="濮撳悕" style="width: 400px"> + <el-input v-model="createData.playerName" size="small"></el-input> + </el-form-item> + <el-form-item label="鎬у埆" style="width: 400px"> + <el-input v-model="createData.gender" size="small"></el-input> + </el-form-item> + <el-form-item label="鐢熸棩"> + <el-date-picker + v-model="createData.birthday" + type="date" + placeholder="閫夋嫨鏃ユ湡" + size="small" + > + </el-date-picker> + </el-form-item> + <el-form-item label="鑱旂郴鐢佃瘽" style="width: 400px"> + <el-input v-model="createData.mobile" size="small"></el-input> + </el-form-item> + <el-form-item label="璇惧寘/浼氬憳鍗�"> + <el-select + v-model="createData.saleMan.id" + filterable + clearable + placeholder="璇烽�夋嫨" + size="small" + > + <el-option + v-for="item in saleManList" + :key="item.id" + :label="item.name" + :value="item.id" + > + </el-option> + </el-select> + </el-form-item> + <el-form-item label="璇炬椂" style="width: 400px"> + <el-input-number v-model="num" size="small"></el-input-number> + </el-form-item> + <el-form-item label="缂磋垂" style="width: 400px"> + <el-input-number + v-model="num" + size="small" + style="width: 200px" + ></el-input-number> + </el-form-item> + <el-form-item label="鏈夋晥鏈�" style="width: 400px"> + <div> + <el-radio-group v-model="lifespan" @input="lifespanChange" size="mini"> + <el-radio-button label="month">涓�鏈�</el-radio-button> + <el-radio-button label="year">涓�骞�</el-radio-button> + <el-radio-button label="longTerm">闀挎湡</el-radio-button> + <el-radio-button label="custom">鑷畾涔�</el-radio-button> + </el-radio-group> + </div> + <div> + <el-date-picker + v-model="createData.endDate" + type="date" + placeholder="閫夋嫨鏃ユ湡" + size="small" + > + </el-date-picker> + </div> + </el-form-item> + <el-form-item label="璇剧▼椤鹃棶"> + <el-select + v-model="createData.voucherId" + filterable + clearable + placeholder="璇烽�夋嫨" + size="small" + > + <el-option + v-for="item in voucherList" + :key="item.id" + :label="item.name" + :value="item.id" + > + </el-option> + </el-select> + </el-form-item> + <el-form-item label="澶囨敞" style="width: 400px"> + <el-input + type="textarea" + :rows="2" + placeholder="璇疯緭鍏ュ娉�" + v-model="createData.description" + ></el-input> + </el-form-item> + </el-form> + <span slot="footer" class="dialog-footer"> + <el-button @click="dialogVisible = false" size="small">鍙� 娑�</el-button> + <el-button type="primary" @click="dialogVisible = false" size="small" + >纭� 瀹�</el-button + > + </span> + </el-dialog> + </div> +</template> + +<script> +import { getDetails, getSaleMan } from "@/api/student"; + +export default { + filters: { + statusFilter(status) { + const statusMap = { + published: "success", + draft: "gray", + deleted: "danger", + }; + return statusMap[status]; + }, + }, + data() { + return { + dialogVisible: false, + createData: { + beginDate: new Date(), + birthday: null, + description: "", + detailDescription: "", + endDate: new Date(), + amt: 0, + freezeQty: 0, + gender: "鐢�", + mobile: "", + orgId: 25, //鏈烘瀯 + playerId: null, + playerName: "", + qty: 0, + saleMan: { + id: "", + name: "", + }, + staffId: JSON.parse(localStorage.getItem("user")).staffs[0].id, + visibility: true, + voucherId: "", //璇惧寘/浼氬憳鍗� + }, + saleManList: [], + voucherList: [], + lifespan:'' + }; + }, + created() {}, + methods: { + showDialog() { + this.dialogVisible = true; + }, + getSaleManList() { + let data = { + staffId: JSON.parse(localStorage.getItem("user")).staffs[0].id, + keyword: "", + pageIn: { + index: 0, + size: 999, + sorts: [ + { + name: "name", + direction: "ASC", + }, + { + name: "createTime", + direction: "DESC", + }, + ], + }, + }; + getSaleMan(data).then((response) => { + this.saleManList = response.data.findStaff.ls; + }); + }, + goDetails(row) { + this.$router.push("/details"); + }, + lifespanChange(val){ + console.log(val); + } + }, +}; +</script> diff --git a/src/views/session/components/details.vue b/src/views/session/components/details.vue new file mode 100644 index 0000000..6fd1646 --- /dev/null +++ b/src/views/session/components/details.vue @@ -0,0 +1,185 @@ +<template> + <div class="app-container"> + <div + style="margin-bottom: 20px; display: flex; flex-direction: row-reverse" + > + <div> + <el-button type="primary" size="small">璇剧▼</el-button> + <el-button type="primary" size="small">鐝骇</el-button> + <el-button type="danger" size="small">缁垂</el-button> + <el-button type="primary" size="small">鎴愰暱</el-button> + <el-button type="primary" size="small">浣滀笟</el-button> + <el-button type="primary" size="small">鍋滅敤</el-button> + </div> + </div> + <div> + <el-form ref="form" :model="detailsData" label-width="100px"> + <el-form-item label="濮撳悕" style="width: 400px"> + <el-input v-model="detailsData.name" size="small"></el-input> + </el-form-item> + <el-form-item label="鎬у埆" style="width: 400px"> + <el-input v-model="detailsData.gender" size="small"></el-input> + </el-form-item> + <el-form-item label="鐢熸棩"> + <el-date-picker + v-model="detailsData.birthday" + type="date" + placeholder="閫夋嫨鏃ユ湡" + size="small" + > + </el-date-picker> + </el-form-item> + <el-form-item label="鑱旂郴鐢佃瘽" style="width: 400px"> + <el-input v-model="detailsData.mobile" size="small"></el-input> + </el-form-item> + <el-form-item label="鐓х墖"> + <el-image + fit="cover" + v-if="detailsData.avatars && detailsData.avatars.length" + style="width: 200px; height: 200px" + :src="'https://s.9village.cn/' + detailsData.avatars[0].url2" + :preview-src-list="[ + 'https://s.9village.cn/' + detailsData.avatars[0].origin, + ]" + > + </el-image> + </el-form-item> + <el-form-item label="璇剧▼椤鹃棶"> + <el-select + v-model="detailsData.saleMan.id" + filterable + clearable + placeholder="璇烽�夋嫨" + size="small" + > + <el-option + v-for="item in saleManList" + :key="item.id" + :label="item.name" + :value="item.id" + > + </el-option> + </el-select> + </el-form-item> + <el-form-item label="澶囨敞" style="width: 400px"> + <el-input + type="textarea" + :rows="2" + placeholder="璇疯緭鍏ュ娉�" + v-model="detailsData.description" + ></el-input> + </el-form-item> + <el-form-item label="璐︽埛" style="width: 800px"> + <el-table :data="detailsData.accs" fit> + <el-table-column label="璇剧▼" prop=""> + <template slot-scope="scope"> + {{ scope.row.voucher.name }} + </template> + </el-table-column> + <el-table-column label="鐘舵��" prop=""> + <template slot-scope="scope"> + <el-link + type="primary" + :underline="false" + @click="goDetails(scope.row)" + >{{ scope.row.name }}</el-link + > + </template> + </el-table-column> + <el-table-column label="鏁伴噺" prop="qty" /> + <el-table-column label="閲戦" prop="amt" /> + <el-table-column label="鍒版湡鏃堕棿" prop="endDate" /> + <el-table-column label="" prop=""> + <template slot-scope="scope"> + <el-link + type="primary" + :underline="false" + @click="goDetails(scope.row)" + >鏌ョ湅鏄庣粏</el-link + > + </template> + </el-table-column> + </el-table> + </el-form-item> + <el-form-item + label="" + style="width: 500px; display: flex; justify-content: space-around" + > + <el-button size="small">鍙栨秷</el-button> + <el-button type="primary" size="small">淇濆瓨</el-button> + </el-form-item> + </el-form> + </div> + </div> +</template> + +<script> +import { getDetails, getSaleMan } from "@/api/student"; + +export default { + filters: { + statusFilter(status) { + const statusMap = { + published: "success", + draft: "gray", + deleted: "danger", + }; + return statusMap[status]; + }, + }, + data() { + return { + detailsData: { + saleMan: [{ id: "", name: "" }], + }, + saleManList: [], + }; + }, + created() { + this.getSaleManList(); + this.fetchData(); + }, + methods: { + fetchData() { + let data = { id: Number(this.$route.query.id) }; + getDetails(data).then((response) => { + this.detailsData = response.data.findPlayerDto; + this.detailsData.gender = + this.detailsData.gender == "FEMALE" ? "濂�" : "鐢�"; + if ( + response.data.findPlayerDto.saleMan && + response.data.findPlayerDto.saleMan.length !== 0 + ) { + this.detailsData.saleMan.id = String(this.detailsData.saleMan.id); + } + }); + }, + getSaleManList() { + let data = { + staffId: JSON.parse(localStorage.getItem("user")).staffs[0].id, + keyword: "", + pageIn: { + index: 0, + size: 999, + sorts: [ + { + name: "name", + direction: "ASC", + }, + { + name: "createTime", + direction: "DESC", + }, + ], + }, + }; + getSaleMan(data).then((response) => { + this.saleManList = response.data.findStaff.ls; + }); + }, + goDetails(row) { + this.$router.push("/details"); + }, + }, +}; +</script> diff --git a/src/views/session/index.vue b/src/views/session/index.vue new file mode 100644 index 0000000..1206f6f --- /dev/null +++ b/src/views/session/index.vue @@ -0,0 +1,179 @@ +<template> + <div class="app-container"> + <el-tabs v-model="activeName" @tab-click="handleClick"> + <el-tab-pane label="鍏ㄩ儴" name="all" /> + <el-tab-pane label="寰呯画璐�" name="pendingFees" /> + <el-tab-pane label="宸茶繃鏈�" name="expired" /> + <el-tab-pane label="宸插仠鐢�" name="deactivated" /> + </el-tabs> + <div style="display: flex;"> + <el-date-picker v-model="dateRange" type="daterange" range-separator="鑷�" start-placeholder="寮�濮嬫棩鏈�" + end-placeholder="缁撴潫鏃ユ湡" style="margin-right: 10px"> + </el-date-picker> + <el-button type="primary" size="small" @click="handleExport">瀵煎嚭</el-button> + </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="濮撳悕" prop=""> + <template slot-scope="scope"> + <el-link type="primary" :underline="false" @click="goDetails(scope.row)">{{ scope.row.name }}</el-link> + <!-- <el-link type="primary" :underline="false">{{ + scope.row.name + }}</el-link> --> + </template> + </el-table-column> + <el-table-column label="鎬у埆" width="80" v-if="activeName !== 'deactivated'"> + <template slot-scope="scope"> + {{ scope.row.gender == "FEMALE" ? "濂�" : "鐢�" }} + </template> + </el-table-column> + <el-table-column label="鎵嬫満鍙�" width="200" prop="mobile" v-if="activeName !== 'deactivated'"> + <template slot-scope="scope"> + {{ scope.row.mobile ? scope.row.mobile : "--" }} + </template> + </el-table-column> + <el-table-column label="鏄惁缁戝畾寰俊" width="200" v-if="activeName !== 'deactivated'"> + <template slot-scope="scope"> + {{ scope.row.user ? "鏄�" : "鍚�" }} + </template> + </el-table-column> + <el-table-column label="鎿嶄綔" width="200" v-if="activeName == 'deactivated'"> + <template slot-scope=""> + <el-link type="primary" :underline="false">鍒犻櫎</el-link> + + <el-link type="primary" :underline="false">鎭㈠</el-link> + </template> + </el-table-column> + <el-table-column label="鍋滅敤鏃堕棿" width="200" v-if="activeName == 'deactivated'"> + <template slot-scope="scope"> + {{ scope.row.modifyTime }} + </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> + <StudentCreate ref="studentCreate" /> + </div> +</template> + +<script> +import { getData, getRenew, getExpire, getDeleted, handleExport } from "@/api/student"; +import StudentCreate from "./components/create.vue"; + +export default { + filters: { + statusFilter(status) { + const statusMap = { + published: "success", + draft: "gray", + deleted: "danger", + }; + return statusMap[status]; + }, + }, + components: { + StudentCreate, + }, + data() { + return { + dateRange: "", + list: null, + listLoading: true, + activeName: "all", + total: 0, + data: { + staffId: JSON.parse(localStorage.getItem("user")).staffs[0].id, + keyword: "", + pageIn: { + //鍙�夛紝濡傛灉鏄垎椤垫煡璇紝闇�瑕佸姞涓娿�� + index: 0, //蹇呴�� + size: 10, //姣忛〉鐨勫ぇ灏忋�傞粯璁�20 + sorts: { + name: "name", //鎺掑簭瀛楁鍚嶇О + direction: "ASC", //鎺掑簭鏂瑰悜 + }, + }, + }, + }; + }, + created() { + this.fetchData(); + }, + methods: { + formatDate (date) { + const year = date.getFullYear(); + const month = String(date.getMonth() + 1).padStart(2, '0'); + const day = String(date.getDate()).padStart(2, '0'); + return `${year}-${month}-${day}`; + }, + handleExport() { + this.download('exportReport?startDate=' + this.formatDate(this.dateRange[0]) + '&endDate=' + this.formatDate(this.dateRange[1]), { + }, `瀵煎嚭_${new Date().getTime()}.xlsx`) + }, + fetchData() { + this.listLoading = true; + getData(this.data).then((response) => { + this.list = response.data.findPlayerByStaff.ls; + this.total = response.data.findPlayerByStaff.pageOut.total; + this.listLoading = false; + }); + }, + handleSizeChange(val) { + this.data.pageIn.size = val; + this.handleClick(); + }, + handleCurrentChange(val) { + this.data.pageIn.index = val - 1; + this.handleClick(); + }, + handleClick(tab, event) { + if (this.activeName == "pendingFees") { + this.listLoading = true; + getRenew(this.data).then((response) => { + this.list = response.data.findPlayerRenew.ls; + this.total = response.data.findPlayerRenew.pageOut.total; + this.listLoading = false; + }); + } else if (this.activeName == "expired") { + this.listLoading = true; + getExpire(this.data).then((response) => { + this.list = response.data.findPlayerExpire.ls; + this.total = response.data.findPlayerExpire.pageOut.total; + this.listLoading = false; + }); + } else if (this.activeName == "all") { + this.fetchData(); + } else if (this.activeName == "deactivated") { + this.listLoading = true; + let data = { + itemType: "PLAYER", + staffId: JSON.parse(localStorage.getItem("user")).staffs[0].id, + keyword: this.data.keyword, + pageIn: { ...this.data.pageIn }, + }; + getDeleted(data).then((response) => { + this.list = response.data.findDeletedItem.ls; + this.total = response.data.findDeletedItem.pageOut.total; + this.listLoading = false; + }); + } + }, + goDetails(row) { + this.$router.push({ + name: "StudentDetails", + query: { + id: row.id, + }, + }); + }, + showCreate() { + this.$refs.studentCreate.showDialog(); + }, + }, +}; +</script> -- Gitblit v1.8.0