|
@@ -6,346 +6,36 @@
|
|
|
<div class="squrt"></div>
|
|
|
个人技能测评
|
|
|
</h2>
|
|
|
+
|
|
|
<div class="m-core">
|
|
|
- <save-form
|
|
|
- :inline="true"
|
|
|
- :model="searchForm"
|
|
|
- ref="searchForm"
|
|
|
- @submit="search"
|
|
|
- @reset="onReSet"
|
|
|
+ <tab-router
|
|
|
+ v-model.trim="activeIndex"
|
|
|
+ type="card"
|
|
|
+ @tab-click="handleClick"
|
|
|
>
|
|
|
- <el-form-item prop="organId">
|
|
|
- <el-select
|
|
|
- class="multiple"
|
|
|
- filterable
|
|
|
- v-model.trim="searchForm.organId"
|
|
|
- clearable
|
|
|
- placeholder="请选择分部"
|
|
|
- @change="changeOrgan"
|
|
|
- >
|
|
|
- <el-option
|
|
|
- v-for="(item, index) in selects.branchs"
|
|
|
- :key="index"
|
|
|
- :label="item.name"
|
|
|
- :value="item.id"
|
|
|
- ></el-option>
|
|
|
- </el-select>
|
|
|
- </el-form-item>
|
|
|
- <el-form-item prop="cooperationId">
|
|
|
- <el-select
|
|
|
- v-model.trim="searchForm.cooperationId"
|
|
|
- :disabled="!searchForm.organId"
|
|
|
- filterable
|
|
|
- clearable
|
|
|
- placeholder="请选择合作单位"
|
|
|
- @change="changeCooper"
|
|
|
- >
|
|
|
- <el-option
|
|
|
- v-for="(item, index) in cooperationList"
|
|
|
- :key="index"
|
|
|
- :label="item.name"
|
|
|
- :value="item.id"
|
|
|
- ></el-option>
|
|
|
- </el-select>
|
|
|
- </el-form-item>
|
|
|
- <el-form-item prop="musicGroupId">
|
|
|
- <el-select
|
|
|
- v-model.trim="searchForm.musicGroupId"
|
|
|
- clearable
|
|
|
- filterable
|
|
|
- placeholder="请选择乐团"
|
|
|
- :disabled="!searchForm.cooperationId"
|
|
|
- >
|
|
|
- <el-option
|
|
|
- v-for="(item, index) in musicList"
|
|
|
- :key="index"
|
|
|
- :value="item.id"
|
|
|
- :label="item.name"
|
|
|
- ></el-option>
|
|
|
- </el-select>
|
|
|
- </el-form-item>
|
|
|
- <el-form-item>
|
|
|
- <el-button native-type="submit" type="primary">搜索</el-button>
|
|
|
- <el-button native-type="reset" type="danger">重置</el-button>
|
|
|
- </el-form-item>
|
|
|
- </save-form>
|
|
|
- <div class="btnList">
|
|
|
- <el-button type="primary" @click="onCreateQRCode('placeholder')"
|
|
|
- >预报名链接</el-button
|
|
|
- >
|
|
|
- <el-button type="primary" @click="onCreateQRCode('music')"
|
|
|
- >器乐考级报名链接</el-button
|
|
|
- >
|
|
|
- <el-button type="primary" @click="onCreateQRCode('vip')"
|
|
|
- >VIP课程链接</el-button
|
|
|
- >
|
|
|
- <el-button type="primary" @click="onCreateQRCode('theory')"
|
|
|
- >乐理考级链接</el-button
|
|
|
- >
|
|
|
- <el-button type="primary" @click="onCreateQRCode('musicOut')" style="background-color: #f97215; border: 1px solid #f97215"
|
|
|
- >对外器乐考级报名链接</el-button
|
|
|
- >
|
|
|
- <el-button type="primary" @click="onCreateQRCode('theoryOut')" style="background-color: #f97215; border: 1px solid #f97215"
|
|
|
- >对外乐理考级链接</el-button
|
|
|
- >
|
|
|
- <el-button
|
|
|
- type="primary"
|
|
|
- @click="sendMsg"
|
|
|
- v-permission="'childrenReserve/sendMsg'"
|
|
|
- >发送短信及推送</el-button
|
|
|
- >
|
|
|
- <el-button
|
|
|
- type="primary"
|
|
|
- v-permission="'export/statisticsDetail'"
|
|
|
- @click="exportChildren"
|
|
|
- >导出</el-button
|
|
|
- >
|
|
|
- </div>
|
|
|
- <statistic :col="4" class="statistic" :cols="0">
|
|
|
- <statistic-item>
|
|
|
- <span>器乐考级人次</span>
|
|
|
- <span><count-to :endVal="statInfo.instrumentalMusicNum" /></span>
|
|
|
- </statistic-item>
|
|
|
- <statistic-item>
|
|
|
- <span>乐理考级人次</span>
|
|
|
- <span><count-to :endVal="statInfo.musicTheoryNum" /></span>
|
|
|
- </statistic-item>
|
|
|
- <statistic-item>
|
|
|
- <span>乐理课购买人数</span>
|
|
|
- <span><count-to :endVal="statInfo.buyMusicTheoryNum" /></span>
|
|
|
- </statistic-item>
|
|
|
- <statistic-item>
|
|
|
- <span>乐理课成交金额(元)</span>
|
|
|
- <span
|
|
|
- ><count-to :endVal="statInfo.buyMusicTheoryAmount" :decimals="2"
|
|
|
- /></span>
|
|
|
- </statistic-item>
|
|
|
- <statistic-item>
|
|
|
- <span>1v1VIP课购买人数</span>
|
|
|
- <span><count-to :endVal="statInfo.buyVip1Num" /></span>
|
|
|
- </statistic-item>
|
|
|
- <statistic-item>
|
|
|
- <span>1v1VIP课成交金额(元)</span>
|
|
|
- <span
|
|
|
- ><count-to :endVal="statInfo.buyVip1Amount" :decimals="2"
|
|
|
- /></span>
|
|
|
- </statistic-item>
|
|
|
- <statistic-item>
|
|
|
- <span>1v2VIP课购买人数</span>
|
|
|
- <span><count-to :endVal="statInfo.buyVip2Num" /></span>
|
|
|
- </statistic-item>
|
|
|
- <statistic-item>
|
|
|
- <span>1v2VIP课成交金额(元)</span>
|
|
|
- <span
|
|
|
- ><count-to :endVal="statInfo.buyVip2Amount" :decimals="2"
|
|
|
- /></span>
|
|
|
- </statistic-item>
|
|
|
- </statistic>
|
|
|
- <div class="tableWrap">
|
|
|
- <el-table
|
|
|
- style="width: 100%"
|
|
|
- :header-cell-style="{ background: '#EDEEF0', color: '#444' }"
|
|
|
- :data="tableList"
|
|
|
- @selection-change="handleSelectionChange"
|
|
|
- >
|
|
|
- <el-table-column
|
|
|
- type="selection"
|
|
|
- width="55"
|
|
|
- v-permission="'childrenReserve/sendMsg'"
|
|
|
- >
|
|
|
- </el-table-column>
|
|
|
- <el-table-column
|
|
|
- align="center"
|
|
|
- prop="organName"
|
|
|
- label="分部"
|
|
|
- ></el-table-column>
|
|
|
- <el-table-column
|
|
|
- align="center"
|
|
|
- prop="cooperationOrganName"
|
|
|
- label="合作单位"
|
|
|
- ></el-table-column>
|
|
|
- <el-table-column
|
|
|
- align="center"
|
|
|
- prop="musicGroupName"
|
|
|
- label="乐团名称"
|
|
|
- ></el-table-column>
|
|
|
- <el-table-column
|
|
|
- align="center"
|
|
|
- prop="normalNum"
|
|
|
- label="在读人数"
|
|
|
- ></el-table-column>
|
|
|
- <el-table-column
|
|
|
- align="center"
|
|
|
- prop="reserveNum"
|
|
|
- label="预约人数"
|
|
|
- ></el-table-column>
|
|
|
- <el-table-column
|
|
|
- align="center"
|
|
|
- prop="noReserveNum"
|
|
|
- label="未预约人数"
|
|
|
- width="120px"
|
|
|
- >
|
|
|
- <template slot="header" slot-scope="scope">
|
|
|
- <p style="position: relative">
|
|
|
- 未预约人数
|
|
|
- <el-tooltip placement="top" popper-class="mTooltip">
|
|
|
- <div slot="content">
|
|
|
- 未通过预报名链接直接报名考级的学员数量
|
|
|
- </div>
|
|
|
- <!-- <img :src="imageIcon"
|
|
|
- class="micon el-tooltip"
|
|
|
- style="width:8px height:8px"
|
|
|
- alt /> -->
|
|
|
- <i
|
|
|
- class="el-icon-question"
|
|
|
- style="font-size: 18px; color: #f56c6c"
|
|
|
- ></i>
|
|
|
- </el-tooltip>
|
|
|
- </p>
|
|
|
- </template>
|
|
|
- </el-table-column>
|
|
|
- <el-table-column
|
|
|
- align="center"
|
|
|
- prop="instrumentalMusicNum"
|
|
|
- label="器乐考级人次"
|
|
|
- ></el-table-column>
|
|
|
- <el-table-column
|
|
|
- align="center"
|
|
|
- prop="musicTheoryNum"
|
|
|
- label="乐理考级人次"
|
|
|
- ></el-table-column>
|
|
|
- <el-table-column
|
|
|
- align="center"
|
|
|
- prop="buyVip1Num"
|
|
|
- label="1v1VIP课购买人数"
|
|
|
- ></el-table-column>
|
|
|
- <el-table-column
|
|
|
- align="center"
|
|
|
- prop="buyVip1Amount"
|
|
|
- label="1v1VIP课成交金额"
|
|
|
- >
|
|
|
- <template slot-scope="scope">
|
|
|
- <div>
|
|
|
- {{ scope.row.buyVip1Amount | moneyFormat }}
|
|
|
- </div>
|
|
|
- </template>
|
|
|
- </el-table-column>
|
|
|
- <el-table-column
|
|
|
- align="center"
|
|
|
- prop="buyVip2Num"
|
|
|
- label="1v2VIP课购买人数"
|
|
|
- ></el-table-column>
|
|
|
- <el-table-column
|
|
|
- align="center"
|
|
|
- prop="buyVip2Amount"
|
|
|
- label="1v2VIP课成交金额"
|
|
|
- >
|
|
|
- <template slot-scope="scope">
|
|
|
- <div>
|
|
|
- {{ scope.row.buyVip2Amount | moneyFormat }}
|
|
|
- </div>
|
|
|
- </template>
|
|
|
- </el-table-column>
|
|
|
- <el-table-column
|
|
|
- align="center"
|
|
|
- prop="buyMusicTheoryNum"
|
|
|
- label="乐理课购买人数"
|
|
|
- ></el-table-column>
|
|
|
- <el-table-column
|
|
|
- align="center"
|
|
|
- prop="buyMusicTheoryAmount"
|
|
|
- label="乐理课成交金额"
|
|
|
- >
|
|
|
- <template slot-scope="scope">
|
|
|
- <div>
|
|
|
- {{ scope.row.buyMusicTheoryAmount | moneyFormat }}
|
|
|
- </div>
|
|
|
- </template>
|
|
|
- </el-table-column>
|
|
|
- <el-table-column align="center" prop="studentId" label="操作">
|
|
|
- <template slot-scope="scope">
|
|
|
- <div>
|
|
|
- <el-button type="text" @click="gotoDetail(scope.row)"
|
|
|
- >详情</el-button
|
|
|
- >
|
|
|
- </div>
|
|
|
- </template>
|
|
|
- </el-table-column>
|
|
|
- </el-table>
|
|
|
- <pagination
|
|
|
- sync
|
|
|
- :total.sync="rules.total"
|
|
|
- :page.sync="rules.page"
|
|
|
- :limit.sync="rules.limit"
|
|
|
- :page-sizes="rules.page_size"
|
|
|
- @pagination="getList"
|
|
|
- />
|
|
|
- </div>
|
|
|
+ <el-tab-pane label="技能评测" lazy name="1">
|
|
|
+ <dayList v-if="activeIndex === '1'&& permission('/childrensDay')" />
|
|
|
+ </el-tab-pane>
|
|
|
+ <el-tab-pane label="资格调整" lazy name="2">
|
|
|
+ <resetDays v-if="activeIndex === '2'&& permission('/resetDays')" />
|
|
|
+ </el-tab-pane>
|
|
|
+ </tab-router>
|
|
|
</div>
|
|
|
- <qr-code v-model="codeStatus" :title="codeTitle" :codeUrl="qrCodeUrl" />
|
|
|
</div>
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
-import axios from "axios";
|
|
|
-import { getToken } from "@/utils/auth";
|
|
|
-import qs from "qs";
|
|
|
-import pagination from "@/components/Pagination/index";
|
|
|
-import qrCode from "@/components/QrCode/index";
|
|
|
-import { vaildStudentUrl } from "@/utils/validate";
|
|
|
-import { Export } from "@/utils/downLoadFile";
|
|
|
-import load from "@/utils/loading";
|
|
|
-import { queryByOrganId, getSchool, getMusicGroup } from "@/api/systemManage";
|
|
|
-import { getMusicGroupGradeList, sendMsgList } from "./api";
|
|
|
-import countTo from "vue-count-to";
|
|
|
-const baseStatusInfo = {
|
|
|
- buyMusicTheoryAmount: 0,
|
|
|
- buyMusicTheoryNum: 0,
|
|
|
- buyVip1Amount: 0,
|
|
|
- buyVip1Num: 0,
|
|
|
- buyVip2Amount: 0,
|
|
|
- buyVip2Num: 0,
|
|
|
- cooperationOrganId: 0,
|
|
|
- cooperationOrganName: "",
|
|
|
- instrumentalMusicNum: 0,
|
|
|
- musicGroupId: "",
|
|
|
- musicGroupName: "",
|
|
|
- musicTheoryNum: 0,
|
|
|
- noReserveNum: 0,
|
|
|
- normalNum: 0,
|
|
|
- organId: 0,
|
|
|
- organName: "",
|
|
|
- reserveNum: 0,
|
|
|
- totalAmount: 0,
|
|
|
-};
|
|
|
+import dayList from './dayList'
|
|
|
+import resetDays from './resetDays'
|
|
|
+import { permission } from "@/utils/directivePage";
|
|
|
export default {
|
|
|
- components: { pagination, "count-to": countTo, qrCode },
|
|
|
-
|
|
|
+ components:{
|
|
|
+ dayList,
|
|
|
+ resetDays
|
|
|
+ },
|
|
|
data() {
|
|
|
return {
|
|
|
- searchForm: {
|
|
|
- search: null,
|
|
|
- organId: null,
|
|
|
- cooperationId: null,
|
|
|
- musicGroupId: null,
|
|
|
- },
|
|
|
- codeStatus: false,
|
|
|
- codeTitle: null,
|
|
|
- qrCodeUrl: null,
|
|
|
- tableList: [],
|
|
|
- cooperationList: [],
|
|
|
- musicList: [],
|
|
|
- rules: {
|
|
|
- // 分页规则
|
|
|
- limit: 10, // 限制显示条数
|
|
|
- page: 1, // 当前页
|
|
|
- total: 0, // 总条数
|
|
|
- page_size: [10, 20, 40, 50], // 选择限制显示条数
|
|
|
- },
|
|
|
- statInfo: {
|
|
|
- ...baseStatusInfo,
|
|
|
- },
|
|
|
- chioseList: [],
|
|
|
+ activeIndex: "1",
|
|
|
};
|
|
|
},
|
|
|
//生命周期 - 创建完成(可以访问当前this实例)
|
|
@@ -353,171 +43,14 @@ export default {
|
|
|
//生命周期 - 挂载完成(可以访问DOM元素)
|
|
|
mounted() {
|
|
|
// 获取分部
|
|
|
- this.$store.dispatch("setBranchs");
|
|
|
- this.init();
|
|
|
},
|
|
|
methods: {
|
|
|
- init() {
|
|
|
- this.getList();
|
|
|
- },
|
|
|
- async getList() {
|
|
|
- try {
|
|
|
- const res = await getMusicGroupGradeList({
|
|
|
- page: this.rules.page,
|
|
|
- rows: this.rules.limit,
|
|
|
- ...this.searchForm,
|
|
|
- });
|
|
|
- this.tableList = res.data.rows;
|
|
|
- this.rules.total = res.data.total;
|
|
|
- if (res?.data?.statInfo) {
|
|
|
- this.statInfo = { ...res.data.statInfo };
|
|
|
- } else {
|
|
|
- this.statInfo = { ...baseStatusInfo };
|
|
|
- }
|
|
|
- } catch (e) {}
|
|
|
- },
|
|
|
- search() {
|
|
|
- this.rules.page = 1;
|
|
|
- this.getList();
|
|
|
- },
|
|
|
- onReSet() {
|
|
|
- this.rules = {
|
|
|
- ...this.rules,
|
|
|
- page: 1,
|
|
|
- };
|
|
|
- this.$refs.searchForm.resetFields();
|
|
|
- this.search();
|
|
|
- },
|
|
|
- onCreateQRCode(status) {
|
|
|
- if (status == "placeholder") {
|
|
|
- this.codeTitle = "预报名链接";
|
|
|
- this.qrCodeUrl = vaildStudentUrl() + "/#/childrenSeat";
|
|
|
- }
|
|
|
- if (status == "theory") {
|
|
|
- this.codeTitle = "乐理考级链接";
|
|
|
- this.qrCodeUrl = vaildStudentUrl() + "/#/childrenPayment?dHlwZT0y";
|
|
|
- }
|
|
|
-
|
|
|
- if (status == "music") {
|
|
|
- this.codeTitle = "器乐考级报名链接";
|
|
|
- this.qrCodeUrl = vaildStudentUrl() + "/#/childrenPayment?dHlwZT0x";
|
|
|
- }
|
|
|
- if (status == "vip") {
|
|
|
- this.codeTitle = "VIP课程链接";
|
|
|
- this.qrCodeUrl = vaildStudentUrl() + "/#/childrenPayment";
|
|
|
- }
|
|
|
- if (status == "musicOut") {
|
|
|
- this.codeTitle = "对外器乐考级报名链接";
|
|
|
- this.qrCodeUrl = vaildStudentUrl() + "/#/childrenOut";
|
|
|
- }
|
|
|
- if (status == "theoryOut") {
|
|
|
- this.codeTitle = "对外乐理考级链接";
|
|
|
- this.qrCodeUrl = vaildStudentUrl() + "/#/childrenOut?dHlwZT0y";
|
|
|
- }
|
|
|
- this.codeStatus = true;
|
|
|
- },
|
|
|
- changeOrgan(val) {
|
|
|
- this.searchForm.cooperationId = null;
|
|
|
- this.searchForm.musicGroupId = null;
|
|
|
- },
|
|
|
- changeCooper(val) {
|
|
|
- this.searchForm.musicGroupId = null;
|
|
|
- },
|
|
|
- handleSelectionChange(val) {
|
|
|
- this.chioseList = val;
|
|
|
- },
|
|
|
- gotoDetail(row) {
|
|
|
- // query:{'musicGroupId':}
|
|
|
- this.$router.push({
|
|
|
- path: "/business/childrensdayDetail",
|
|
|
- query: {
|
|
|
- musicGroupId: row.musicGroupId,
|
|
|
- musicGroupName: row.musicGroupName,
|
|
|
- cooperationOrganId: row.cooperationOrganId,
|
|
|
- organId: row.organId,
|
|
|
- },
|
|
|
- });
|
|
|
- },
|
|
|
- exportChildren() {
|
|
|
- Export(
|
|
|
- this,
|
|
|
- {
|
|
|
- url: "/api-web/export/statisticsDetail",
|
|
|
- fileName: "21暑期考级.xls",
|
|
|
- method: "post",
|
|
|
- params: qs.stringify({ ...this.searchForm }),
|
|
|
- },
|
|
|
- "您确定导出21暑期考级?"
|
|
|
- );
|
|
|
- },
|
|
|
- async sendMsg() {
|
|
|
- if (this.chioseList.length < 1) {
|
|
|
- this.$message.error("请至少选择一个乐团");
|
|
|
- return;
|
|
|
- }
|
|
|
-
|
|
|
- this.$confirm("确定发送短信和推送", "提示", {
|
|
|
- confirmButtonText: "确定",
|
|
|
- cancelButtonText: "取消",
|
|
|
- type: "warning",
|
|
|
- }).then(async () => {
|
|
|
- let arr = this.chioseList.map((item) => {
|
|
|
- return {
|
|
|
- musicGroupId: item.musicGroupId,
|
|
|
- organId: item.organId,
|
|
|
- };
|
|
|
- });
|
|
|
- try {
|
|
|
- const res = await sendMsgList(arr);
|
|
|
- this.$message.success("发送成功");
|
|
|
- this.getList();
|
|
|
- } catch {}
|
|
|
- });
|
|
|
- },
|
|
|
- },
|
|
|
- watch: {
|
|
|
- "searchForm.organId"(val) {
|
|
|
- if (val) {
|
|
|
- queryByOrganId({ organId: val }).then((res) => {
|
|
|
- if (res.code == 200) {
|
|
|
- this.cooperationList = res.data;
|
|
|
- }
|
|
|
- });
|
|
|
- }
|
|
|
- },
|
|
|
- "searchForm.cooperationId"(val) {
|
|
|
- if (val) {
|
|
|
- getMusicGroup({ cooperationId: val }).then((res) => {
|
|
|
- this.musicList = res.data;
|
|
|
- });
|
|
|
- }
|
|
|
+ permission,
|
|
|
+ handleClick(evt) {
|
|
|
+ // this.changeHash(evt.name);
|
|
|
},
|
|
|
},
|
|
|
};
|
|
|
</script>
|
|
|
<style lang='scss' scoped>
|
|
|
-.statistic {
|
|
|
- .statistic-content > span {
|
|
|
- font-size: 22px !important;
|
|
|
- &:first-child {
|
|
|
- font-size: 14px !important;
|
|
|
- // color: rgba(0, 0, 0, 0.85);
|
|
|
- // font-weight: bold;
|
|
|
- }
|
|
|
- }
|
|
|
-}
|
|
|
- .btnList {
|
|
|
- display: flex;
|
|
|
- flex-direction: row;
|
|
|
- justify-content: flex-start;
|
|
|
- align-items: center;
|
|
|
- flex-wrap: wrap;
|
|
|
- .el-button+.el-button {
|
|
|
- margin-left: 0px;
|
|
|
-}
|
|
|
- & > .el-button {
|
|
|
- margin-right: 15px;
|
|
|
- margin-top: 10px;
|
|
|
- }
|
|
|
- }
|
|
|
</style>
|