|
|
@@ -0,0 +1,357 @@
|
|
|
+<template>
|
|
|
+ <div>
|
|
|
+ <!-- 列表 -->
|
|
|
+ <div>
|
|
|
+ <el-alert
|
|
|
+ title="时长设置"
|
|
|
+ :closable="false"
|
|
|
+ type="info"
|
|
|
+ style="margin: 0px 0 20px"
|
|
|
+ />
|
|
|
+ <el-table
|
|
|
+ :data="topList"
|
|
|
+ :header-cell-style="{ background: '#EDEEF0', color: '#444' }"
|
|
|
+ >
|
|
|
+ <el-table-column align="center" label="课程类型">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ 直播课
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column
|
|
|
+ align="center"
|
|
|
+ prop="singleClassMinutes"
|
|
|
+ label="课程时长(分钟)"
|
|
|
+ >
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column align="center" label="操作">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <el-button
|
|
|
+ v-permission="'vipGroupCategory/update'"
|
|
|
+ @click="resetGroupCategory(scope.row)"
|
|
|
+ type="text"
|
|
|
+ >修改</el-button
|
|
|
+ >
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ </el-table>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="tableWrap">
|
|
|
+ <el-alert
|
|
|
+ title="收费设置"
|
|
|
+ :closable="false"
|
|
|
+ type="info"
|
|
|
+ style="margin: 20px 0"
|
|
|
+ />
|
|
|
+ <save-form
|
|
|
+ :inline="true"
|
|
|
+ ref="searchForm"
|
|
|
+ class="searchForm"
|
|
|
+ @submit="search"
|
|
|
+ :model.sync="searchForm"
|
|
|
+ save-key="/baseRulesClassSetting/vipChargeSetting"
|
|
|
+ >
|
|
|
+ <el-form-item prop="organId">
|
|
|
+ <el-select
|
|
|
+ class="multiple"
|
|
|
+ style="width: 180px !important"
|
|
|
+ v-model.trim="searchForm.organId"
|
|
|
+ filterable
|
|
|
+ placeholder="请选择分部"
|
|
|
+ >
|
|
|
+ <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>
|
|
|
+ <el-button native-type="submit" type="primary">搜索</el-button>
|
|
|
+ </el-form-item>
|
|
|
+ </save-form>
|
|
|
+ <el-table
|
|
|
+ :data="tableList"
|
|
|
+ style="width: 100% !important"
|
|
|
+ :header-cell-style="{ background: '#EDEEF0', color: '#444' }"
|
|
|
+ >
|
|
|
+ <el-table-column prop="name" label="课程类型">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ 直播课
|
|
|
+ </template></el-table-column
|
|
|
+ >
|
|
|
+ <el-table-column prop="onlineClassesUnitPrice" label="售价">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <div>
|
|
|
+ <el-input v-model.trim="scope.row.onlineClassesUnitPrice">
|
|
|
+ <template slot="append"
|
|
|
+ >元/节</template
|
|
|
+ >
|
|
|
+ </el-input>
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column prop="offlineClassesUnitPrice" label="原价">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <div>
|
|
|
+ <el-input v-model.trim="scope.row.offlineClassesUnitPrice">
|
|
|
+ <template slot="append"
|
|
|
+ >元/节</template
|
|
|
+ ></el-input
|
|
|
+ >
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="操作">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <div>
|
|
|
+ <el-button
|
|
|
+ type="text"
|
|
|
+ v-if="
|
|
|
+ $helpers.permission('vipGroupDefaultClassesUnitPrice/add')
|
|
|
+ "
|
|
|
+ @click="saveSeting(scope.row)"
|
|
|
+ >保存</el-button
|
|
|
+ >
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ </el-table>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <!-- 课程类型新增弹窗 -->
|
|
|
+ <el-dialog
|
|
|
+ title="修改直播课时长"
|
|
|
+ class="courseMask"
|
|
|
+ width="500px"
|
|
|
+ @close="onVipStatusClose('vipStatus')"
|
|
|
+ :visible.sync="liveStatus"
|
|
|
+ >
|
|
|
+ <el-form :model="liveStatusFrom" ref="vipStatus">
|
|
|
+ <el-form-item
|
|
|
+ label="课程类型"
|
|
|
+ :rules="[
|
|
|
+ { required: true, message: '请输入课程形式', trigger: 'blur' }
|
|
|
+ ]"
|
|
|
+ :label-width="formLabelWidth"
|
|
|
+ prop="musicTheory"
|
|
|
+ >
|
|
|
+ <el-select
|
|
|
+ v-model="liveStatusFrom.musicTheory"
|
|
|
+ style="width:100%!important"
|
|
|
+ >
|
|
|
+ <el-option label="直播课" :value="false"></el-option>
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item
|
|
|
+ label="课程课时"
|
|
|
+ prop="dynamicTags"
|
|
|
+ :rules="[
|
|
|
+ {
|
|
|
+ required: true,
|
|
|
+ message: '请输入课程课时',
|
|
|
+ trigger: 'blur, change'
|
|
|
+ }
|
|
|
+ ]"
|
|
|
+ :label-width="formLabelWidth"
|
|
|
+ >
|
|
|
+ <el-tag
|
|
|
+ :key="index"
|
|
|
+ effect="dark"
|
|
|
+ type="info"
|
|
|
+ v-for="(tag, index) in liveStatusFrom.dynamicTags"
|
|
|
+ closable
|
|
|
+ :disable-transitions="false"
|
|
|
+ @close="handleClose(tag)"
|
|
|
+ >
|
|
|
+ {{ tag }}
|
|
|
+ </el-tag>
|
|
|
+ <el-input
|
|
|
+ class="input-new-tag"
|
|
|
+ v-if="inputVisible"
|
|
|
+ v-model.trim="inputValue"
|
|
|
+ ref="saveTagInput"
|
|
|
+ style="width: 100px"
|
|
|
+ @keyup.enter.native="handleInputConfirm"
|
|
|
+ >
|
|
|
+ </el-input>
|
|
|
+ <el-button
|
|
|
+ v-if="!inputVisible"
|
|
|
+ class="button-new-tag"
|
|
|
+ @click="showInput"
|
|
|
+ >+ 添加</el-button
|
|
|
+ >
|
|
|
+ <el-button
|
|
|
+ v-if="inputVisible"
|
|
|
+ class="button-new-tag"
|
|
|
+ @click="handleInputConfirm"
|
|
|
+ >保存</el-button
|
|
|
+ >
|
|
|
+ </el-form-item>
|
|
|
+ </el-form>
|
|
|
+ <div slot="footer" class="dialog-footer">
|
|
|
+ <el-button @click="liveStatus = false">取 消</el-button>
|
|
|
+ <el-button type="primary" @click="addLiveStatus('vipStatus')"
|
|
|
+ >确 定</el-button
|
|
|
+ >
|
|
|
+ </div>
|
|
|
+ </el-dialog>
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+<script>
|
|
|
+import { Searchs } from "@/helpers";
|
|
|
+import {
|
|
|
+ vipGroupCategory,
|
|
|
+ resetVipGroupCategory,
|
|
|
+ defaultClassesUnitPrice
|
|
|
+} from "@/api/vipSeting";
|
|
|
+export default {
|
|
|
+ name: "practiceRules",
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ formLabelWidth: "120px",
|
|
|
+ activeRow: null,
|
|
|
+ topList: [],
|
|
|
+ inputVisible: false,
|
|
|
+ inputValue: "",
|
|
|
+ liveStatus: false,
|
|
|
+ liveStatusFrom: {
|
|
|
+ name: "",
|
|
|
+ num: "",
|
|
|
+ dynamicTags: [],
|
|
|
+ isAdd: true,
|
|
|
+ musicTheory: false,
|
|
|
+ id: ""
|
|
|
+ }, // 弹窗内容
|
|
|
+ tableList: [],
|
|
|
+ searchForm: {
|
|
|
+ organId: null
|
|
|
+ }
|
|
|
+ };
|
|
|
+ },
|
|
|
+ async mounted() {
|
|
|
+ await this.$store.dispatch("setBranchs");
|
|
|
+ // 获取缓存的分部编号
|
|
|
+ const searchs = new Searchs(this.$route.fullPath);
|
|
|
+ const branchId = searchs.searchs[searchs.key]?.form.organId;
|
|
|
+ this.searchForm.organId = branchId
|
|
|
+ ? branchId
|
|
|
+ : this.selects?.branchs[0]["id"];
|
|
|
+
|
|
|
+ this.getVipGroupCategoryList();
|
|
|
+ this.getList();
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ resetGroupCategory(row) {
|
|
|
+ // 修改课程形式
|
|
|
+ const liveStatusFrom = this.liveStatusFrom;
|
|
|
+ this.$nextTick(() => {
|
|
|
+ liveStatusFrom.name = row.name;
|
|
|
+ liveStatusFrom.timer = row.singleClassMinutes.split(",");
|
|
|
+ liveStatusFrom.dynamicTags = row.singleClassMinutes.split(",");
|
|
|
+ liveStatusFrom.num = row.studentNum;
|
|
|
+ liveStatusFrom.id = row.id;
|
|
|
+ liveStatusFrom.isAdd = false;
|
|
|
+ liveStatusFrom.musicTheory = row.musicTheory;
|
|
|
+ });
|
|
|
+ this.liveStatus = true;
|
|
|
+ },
|
|
|
+ onVipStatusClose(formName) {
|
|
|
+ this.inputVisible = false;
|
|
|
+ this.inputValue = "";
|
|
|
+ this.$refs[formName].resetFields();
|
|
|
+ },
|
|
|
+ showInput() {
|
|
|
+ this.inputVisible = true;
|
|
|
+ this.$nextTick(_ => {
|
|
|
+ this.$refs.saveTagInput.$refs.input.focus();
|
|
|
+ });
|
|
|
+ },
|
|
|
+ handleInputConfirm() {
|
|
|
+ let inputValue = this.inputValue;
|
|
|
+ if (inputValue) {
|
|
|
+ this.liveStatusFrom.dynamicTags.push(inputValue);
|
|
|
+ }
|
|
|
+ this.inputVisible = false;
|
|
|
+ this.inputValue = "";
|
|
|
+ },
|
|
|
+ handleClose(tag) {
|
|
|
+ this.liveStatusFrom.dynamicTags.splice(
|
|
|
+ this.liveStatusFrom.dynamicTags.indexOf(tag),
|
|
|
+ 1
|
|
|
+ );
|
|
|
+ },
|
|
|
+ addLiveStatus(formName) {
|
|
|
+ this.$refs[formName].validate(async valid => {
|
|
|
+ if (valid) {
|
|
|
+ const liveStatusFrom = this.liveStatusFrom;
|
|
|
+ await resetVipGroupCategory({
|
|
|
+ name: liveStatusFrom.name,
|
|
|
+ singleClassMinutes: liveStatusFrom.dynamicTags.join(","),
|
|
|
+ studentNum: liveStatusFrom.num,
|
|
|
+ id: liveStatusFrom.id,
|
|
|
+ musicTheory: liveStatusFrom.musicTheory
|
|
|
+ }).then(res => {
|
|
|
+ this.$message.success("修改成功");
|
|
|
+ this.getVipGroupCategoryList();
|
|
|
+ this.liveStatus = false;
|
|
|
+ });
|
|
|
+ }
|
|
|
+ });
|
|
|
+ },
|
|
|
+ async getVipGroupCategoryList() {
|
|
|
+ // 获取默认左边参数
|
|
|
+ await vipGroupCategory({
|
|
|
+ groupType: "live"
|
|
|
+ }).then(res => {
|
|
|
+ if (res.code == 200) {
|
|
|
+ this.topList = res.data;
|
|
|
+ }
|
|
|
+ });
|
|
|
+ },
|
|
|
+ search() {
|
|
|
+ this.$refs.searchForm.validate(valid => {
|
|
|
+ this.getList();
|
|
|
+ });
|
|
|
+ },
|
|
|
+ saveSeting(row) {
|
|
|
+ defaultClassesUnitPrice({
|
|
|
+ offlineClassesUnitPrice: row.offlineClassesUnitPrice,
|
|
|
+ onlineClassesUnitPrice: row.onlineClassesUnitPrice,
|
|
|
+ organId: this.searchForm.organId,
|
|
|
+ vipGroupCategoryId: row.id
|
|
|
+ }).then(res => {
|
|
|
+ if (res.code == 200) {
|
|
|
+ // 保存成功提示=> 刷新列表
|
|
|
+ this.$message.success("保存成功");
|
|
|
+ } else {
|
|
|
+ // 保存失败
|
|
|
+ this.$message.error("保存失败,请重试");
|
|
|
+ }
|
|
|
+ });
|
|
|
+ },
|
|
|
+ getList() {
|
|
|
+ vipGroupCategory({
|
|
|
+ organId: this.searchForm.organId,
|
|
|
+ groupType: "live"
|
|
|
+ }).then(res => {
|
|
|
+ if (res.code == 200) {
|
|
|
+ this.tableList = res.data;
|
|
|
+ }
|
|
|
+ });
|
|
|
+ }
|
|
|
+ }
|
|
|
+};
|
|
|
+</script>
|
|
|
+<style lang="scss" scoped>
|
|
|
+.createForm {
|
|
|
+ ::v-deep .el-input {
|
|
|
+ width: 340px !important;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+.el-tag--info {
|
|
|
+ margin-right: 4px;
|
|
|
+}
|
|
|
+</style>
|
