dy-admin-manager/src/views/workBenchManager/journal/model/musicGroup.vue

<template>
  <div>
    <el-alert
      title="已拒绝"
      show-icon
      center
      v-if="musicForm.status == 'DENIED'"
      :closable="false"
      class="alert"
      type="error"
    ></el-alert>
    <el-alert
      title="已处理"
      show-icon
      center
      v-if="musicForm.status == 'APPROVED'"
      :closable="false"
      class="alert"
      type="success"
    ></el-alert>
    <el-alert
      title="已取消"
      show-icon
      center
      v-if="musicForm.status == 'CANCELED'"
      :closable="false"
      class="alert"
      type="info"
    ></el-alert>
    <!-- <el-form
      ref="musicForm"
      :model="quitForm"
      :rules="quitRules"
      status-icon
      class="musicForm"
      label-width="120px"
    > -->
    <!-- <el-form-item label="学员姓名">
        <el-input disabled v-model.trim="musicForm.user.username"></el-input>
      </el-form-item>
      <el-form-item label="乐团名称">
        <el-input disabled v-model.trim="musicForm.musicGroup.name"></el-input>
      </el-form-item>
      <el-form-item label="用户备注">
        <el-input
          type="textarea"
          disabled
          v-model.trim="musicForm.userComment"
        ></el-input>
      </el-form-item>
      <el-form-item
        label="退还学练宝费用"
        prop="isRefundMemberFee"
        v-if="musicForm.status == 'PROCESSING' && musicForm.courseViewType == 2"
      >
        <el-radio v-model.trim="quitForm.isRefundMemberFee" label="true"
          >是</el-radio
        >
        <el-radio v-model.trim="quitForm.isRefundMemberFee" label="false"
          >否</el-radio
        >
      </el-form-item> -->

    <!-- <el-form-item
        label="退还学练宝金额"
        prop="cloudTeacherAmount"
        v-if="
          quitForm.isRefundMemberFee &&
          quitForm.isRefundMemberFee != 'false' &&
          musicForm.status == 'PROCESSING'
        "
      >
        <el-input
          type="number"
          v-model.trim="quitForm.cloudTeacherAmount"
          style="width: 180px"
        >
          <template slot="append">元</template>
        </el-input>
      </el-form-item>
      <el-form-item
        label="退还课程费用"
        v-if="musicForm.status == 'PROCESSING'"
        prop="isRefundCourseFee"
      >
        <el-radio v-model.trim="quitForm.isRefundCourseFee" :label="true"
          >是</el-radio
        >
        <el-radio v-model.trim="quitForm.isRefundCourseFee" :label="false"
          >否</el-radio
        >
      </el-form-item>
      <el-form-item
        label="退还乐器费用"
        v-if="musicForm.status == 'PROCESSING'"
        prop="isRefundInstrumentFee"
      >
        <el-radio v-model.trim="quitForm.isRefundInstrumentFee" :label="true"
          >是</el-radio
        >
        <el-radio v-model.trim="quitForm.isRefundInstrumentFee" :label="false"
          >否</el-radio
        >
      </el-form-item>
      <el-form-item
        label="退还教辅费用"
        v-if="musicForm.status == 'PROCESSING'"
        prop="isRefundTeachingAssistantsFee"
      >
        <el-radio
          v-model.trim="quitForm.isRefundTeachingAssistantsFee"
          :label="true"
          >是</el-radio
        >
        <el-radio
          v-model.trim="quitForm.isRefundTeachingAssistantsFee"
          :label="false"
          >否</el-radio
        >
      </el-form-item>
      <el-form-item
        label="退还乐保费用"
        prop="isMaintenanceFee"
        v-if="dialogDetail.hasMaintenance"
      >
        <el-radio v-model.trim="quitForm.isMaintenanceFee" :label="true"
          >是</el-radio
        >
        <el-radio v-model.trim="quitForm.isMaintenanceFee" :label="false"
          >否</el-radio
        >
      </el-form-item>
      <el-form-item
        label="退还乐保金额"
        prop="maintenanceFee"
        v-if="quitForm.isMaintenanceFee"
      >
        <el-input
          type="number"
          v-model.trim="quitForm.maintenanceFee"
          style="width: 180px"
        >
          <template slot="append">元</template>
        </el-input>
      </el-form-item>
      <el-form-item label="退团原因" prop="reason">
        <el-input
          type="textarea"
          :disabled="musicForm.status != 'PROCESSING'"
          v-model.trim="quitForm.reason"
        ></el-input>
      </el-form-item> -->
    <!-- </el-form> -->
    <quiteTeam
      :quitForm="quitForm"
      ref="musicForm"
      :isDisabled="
        musicForm.status != 'PROCESSING' ||
          (isManage == 'manage' && musicForm.currentApproveRole == '2') ||
          (!isManage && musicForm.currentApproveRole == '1')
      "
    />
    <p style="color:red;paddingLeft:150px">退费金额暂不进入账户余额</p>
    <span
      slot="footer"
      class="dialog-footer question"
      v-if="musicForm.status == 'PROCESSING'"
    >
      <div>
        <el-popover placement="right" width="500" trigger="click">
          <div class="popoverWrap">
            <p>乐团退团退费规则：</p>
            <p>退还学练宝费用：报名缴费时缴费的学练宝费用</p>
            <p>退还课程费用：缴费总额-已结束课时单价之和</p>
            <p>退还乐器费用：报名缴费时缴纳的乐器费用（团购、租金）</p>
            <p>退还教辅费用：报名缴费时缴费的教辅费用</p>
            <p v-if="$helpers.tenantId == 1">
              退还乐保费用：报名缴费时缴费的乐保费用
            </p>
          </div>
          <el-button
            type="text"
            icon="el-icon-question"
            slot="reference"
            style="color: red"
            >退团退费说明</el-button
          >
        </el-popover>
      </div>
      <div>
        <el-button
          type="primary"
          v-permission="'musicGroupQuit/quitMusicGroup/conform'"
          v-if="isManage == 'staff'"
          :disabled="musicForm.currentApproveRole == '1'"
          @click="onSubmitGroup(musicForm, 'PROCESSING')"
          >提交审核</el-button
        >
        <el-button
          v-else
          type="primary"
          :disabled="
            isManage == 'manage' && musicForm.currentApproveRole == '2'
          "
          v-permission="'musicGroupQuit/quitMusicGroup/conform'"
          @click="onSubmitGroup(musicForm, 'APPROVED')"
          >同意</el-button
        >
        <el-button
          :disabled="
            (isManage == 'manage' && musicForm.currentApproveRole == '2') ||
              (isManage == 'staff' && musicForm.currentApproveRole == '1')
          "
          type="danger"
          v-permission="'musicGroupQuit/quitMusicGroup'"
          @click="onSubmitGroup(musicForm, 'DENIED')"
          >拒绝</el-button
        >
      </div>
    </span>
    <!-- <div
      slot="footer"
      class="dialog-footer"
      v-if="musicForm.status == 'PROCESSING'"
    >
      <el-button
        type="primary"
        v-permission="'musicGroupQuit/quitMusicGroup/conform'"
        @click="onSubmitGroup(musicForm, 'APPROVED')"
        >确认</el-button
      >
      <el-button
        type="danger"
        v-permission="'musicGroupQuit/quitMusicGroup'"
        @click="onSubmitGroup(musicForm, 'DENIED')"
        >拒绝</el-button
      >
    </div> -->
  </div>
</template>

<script>
import {
  queryApplyRefundDetail,
  musicGroupQuit,
  quitMusicGroup
} from "@/api/journal";
import Tooltip from "@/components/Tooltip";
import cleanDeep from "clean-deep";
import quiteTeam from "@/views/teamDetail/components/modals/quite-team";
import dayjs from "dayjs";
export default {
  props: ["dialogDetail"],
  components: { Tooltip, quiteTeam },
  data() {
    var validateReason = (rule, value, callback) => {
      if (value === "") {
        callback(new Error("请填写退团退费原因"));
      } else {
        callback();
      }
    };
    var validateFee1 = (rule, value, callback) => {
      if (value === "" || value == null) {
        callback(new Error("请选择退还课程费用"));
      } else {
        callback();
      }
    };
    var validateFee2 = (rule, value, callback) => {
      if (value === "" || value == null) {
        callback(new Error("请选择退还乐器费用"));
      } else {
        callback();
      }
    };
    var validateFee3 = (rule, value, callback) => {
      if (value === "" || value == null) {
        callback(new Error("请选择退还教辅费用"));
      } else {
        callback();
      }
    };
    return {
      musicForm: {
        user: {},
        musicGroup: {}
      },
      musicGroupCourse: [],
      vipCourse: [],
      quitForm: {
        // 退团信息确认
        isRefundCourseFee: null,
        isRefundInstrumentFee: null,
        isRefundTeachingAssistantsFee: null,
        reason: "",
        courseViewType: null,
        hasMaintenance: null,
        studentName: null,
        musicGroupName: null,
        isVisit: false,
        reason: "",
        userComment: null
      },
      quitRules: {
        isRefundCourseFee: [
          { required: true, message: "请选择是否退还课程费用" }
        ],
        isRefundInstrumentFee: [
          { required: true, message: "请选择是否退还乐器费用" }
        ],
        isRefundTeachingAssistantsFee: [
          { required: true, message: "请选择是否退还教辅费用" }
        ],
        isReturnMemberFee: [
          { required: true, message: "请选择是否退还会员费用" }
        ],
        isMaintenanceFee: [{ required: true, message: "选择是否退还乐保费用" }],
        maintenanceFee: [{ required: true, message: "请输入退还乐保金额" }],
        memberFee: [{ required: true, message: "请输入退还会员金额" }],
        reason: [{ validator: validateReason, trigger: "blur" }],
        userComment: [{ required: true, message: "请输入申请理由" }]
      },
      isManage: false
    };
  },
  mounted() {
    this.__init();
  },
  watch: {
    // "quitForm.isMaintenanceFee"(val) {
    //   if (val) {
    //     this.quitForm.maintenanceFee = 300;
    //   } else {
    //     this.quitForm.maintenanceFee = 0;
    //   }
    // },
  },
  methods: {
    async __init() {
      // 获取权限
      let isSuperAdmin = this.$store.getters.isSuperAdmin;
      let roles = this.$store.getters.roles;
      if (isSuperAdmin) {
        this.isManage = "super";
      } else {
        if (roles.indexOf("1") != -1) {
          this.isManage = "manage";
        }
        if (roles.indexOf("2") != -1) {
          this.isManage = "staff";
        }
      }
      if (roles.indexOf("1") != -1 && roles.indexOf("2") != -1) {
        this.isManage = "super";
      }
      //   isSuperAdmin:state=>state.user.isSuperAdmin,
      // roles:state=>state.user.roles,

      let { memo } = this.dialogDetail;
      memo = memo ? JSON.parse(memo) : null;
      if (!memo) {
        // 判断是否有参数
        this.$message.error("参数有误");
        return;
      }
      if (memo.type == "VIPGROUP") {
        // await queryApplyRefundDetail({ id: memo.Id }).then(res => {
        //     if (res.code == 200) {
        //         this.showRight = true
        //         this.showMessage = res.data
        //         this.showMessage.type = memo.type
        //         this.remark = res.data.studentApplyRefunds.remark
        //         this.actualAmount = res.data.studentApplyRefunds.actualAmount
        //         //
        //     } else {
        //         this.$message.error(res.msg)
        //     }
        // })
      } else if (memo.type == "MUSICGROUP") {
        await musicGroupQuit({ id: memo.Id }).then(res => {
          if (res.code == 200) {
            this.musicForm = res.data;
            if (this.$refs["musicForm"].$refs.quitForm) {
              this.$refs["musicForm"].$refs.quitForm.resetFields();
            }
            this.activeRow = { ...res.data.returnFeeDto };
            this.quitForm.courseViewType = res.data.musicGroup.courseViewType;
            this.quitForm.reason = res.data.reason;
            this.quitForm.userComment = res.data.userComment;
            this.quitForm.isVisit = res.data.isVisit;
            this.quitForm.visitTime = res.data.visitTime;
            this.quitForm.studentName = res.data.user?.username;
            this.quitForm.musicGroupName = res.data.musicGroup?.name;
            this.quitForm.hasMaintenance = res.data.hasMaintenance;
            this.quitForm = { ...this.quitForm, ...res.data.returnFeeDto };
          } else {
            this.$message.error(res.msg);
          }
        });
      }
    },
    onSubmitGroup(params, status) {
      if (status == "DENIED") {
        this.$refs["musicForm"].$refs.quitForm.clearValidate();
        this.$refs["musicForm"].$refs.quitForm.validateField("reason", res => {
          if (!res) {
            this.onSubmitGroups(params, status);
          }
        });
      } else {
        // console.log(this.$refs.musicForm)
        this.$refs["musicForm"].$refs.quitForm.validate(res => {
          if (res) {
            this.onSubmitGroups(params, status);
          }
        });
      }
    },
    onSubmitGroups(params, status) {
      this.$confirm("确定此操作吗?", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning"
      })
        .then(async () => {
          let query = this.quitForm;
          (query.id = params.id), (query.status = status);
          query.returnFeeDto = {
            accessoriesFee: query.accessoriesFee,
            courseFee: query.courseFee,
            isReturnAccessoriesFee: query.isReturnAccessoriesFee,
            isReturnCourseFee: query.isReturnCourseFee,
            isReturnMaintenanceFee: query.isReturnMaintenanceFee,
            isReturnMemberFee: query.isReturnMemberFee,
            isReturnMusicalFee: query.isReturnMusicalFee,
            maintenanceFee: query.maintenanceFee,
            memberFee: query.memberFee,
            musicalFee: query.musicalFee
          };

          await quitMusicGroup(cleanDeep(query)).then(res => {
            this.$message.success("处理成功");
            this.$listeners.close();
            this.$listeners.getList();
          });
        })
        .catch(() => {});
    }
  }
};
</script>

<style lang="less" scoped>
.dialog-footer {
  margin-top: 20px;
  display: block;
  text-align: right;
}
.alert {
  margin-bottom: 10px;
}
.dialog-footer.question {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
}
</style>