dy-admin-manager/src/views/teamDetail/components/modals/quite-team.vue

<template>
  <div>
    <el-form
      :model="quitForm"
      ref="quitForm"
      label-width="150px"
      :rules="quitRules"
      :inline="true"
    >
      <el-row>
        <el-col :span="10">
          <el-form-item label="学员姓名">
            <span>{{ quitForm.studentName }}</span>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="乐团名称">
            <overflow-text :text="quitForm.musicGroupName" width="150px"></overflow-text>
            <!-- <span>{{}}</span>   -->
          </el-form-item>
        </el-col>
      </el-row>

      <el-row>
        <el-form-item label="是否回访" prop="isVisit">
          <el-radio v-model.trim="quitForm.isVisit" :label="true" :disabled="isDisabled"
            >是</el-radio
          >
          <el-radio :disabled="isDisabled" v-model.trim="quitForm.isVisit" :label="false"
            >否</el-radio
          >
        </el-form-item>

        <el-form-item
          label="回访时间"
          v-if="quitForm.isVisit"
          :rules="[{ required: true, message: '请选择回访时间' }]"
          prop="visitTime"
        >
          <el-date-picker
            :disabled="isDisabled"
            v-model.trim="quitForm.visitTime"
            align="right"
            type="date"
            style="width: 180px !important"
            placeholder="选择日期"
            value-format="yyyy-MM-dd"
            :picker-options="pickerOptions"
          ></el-date-picker>
        </el-form-item>
      </el-row>
      <!-- <el-row>
        <el-form-item label="是否退费">
          <el-radio v-model.trim="quitForm.isQuiteFee" :label="true"
            >是</el-radio
          >
          <el-radio v-model.trim="quitForm.isQuiteFee" :label="false"
            >否</el-radio
          >
        </el-form-item>
      </el-row> -->
      <!-- v-if="quitForm.isQuiteFee" -->
      <div>
        <!-- <el-row>
          <el-form-item
            label="退还会员费用"
            prop="isReturnMemberFee"
            v-if="quitForm.courseViewType == 2"
            :rules="[{required: true, message: '请选择是否退还会员费用'}]"
          >
            <el-radio  :disabled='isDisabled' v-model.trim="quitForm.isReturnMemberFee" :label="true"
              >是</el-radio
            >
            <el-radio  :disabled='isDisabled' v-model.trim="quitForm.isReturnMemberFee" :label="false"
              >否</el-radio
            >
          </el-form-item>
          <el-form-item
            label="退还会员金额"
             :rules="[{required: true, message: '请输入会员金额'}]"
            prop="memberFee"
            v-if="
              quitForm.isReturnMemberFee
            "
          >
            <el-input
             :disabled='isDisabled'
              type="number"
              v-model.trim="quitForm.memberFee"
              style="width: 180px"
            >
              <template slot="append">元</template>
            </el-input>
          </el-form-item>
        </el-row> -->

        <!-- v-if="activeRow.cloudTeacherAmount > 0" -->

        <el-row>
          <el-form-item
            label="退还课程费用"
            prop="isReturnCourseFee"
            :rules="[{ required: true, message: '请选择是否退还课程费用' }]"
          >
            <el-radio
              :disabled="isDisabled"
              v-model.trim="quitForm.isReturnCourseFee"
              :label="true"
              >是</el-radio
            >
            <el-radio
              :disabled="isDisabled"
              v-model.trim="quitForm.isReturnCourseFee"
              :label="false"
              >否</el-radio
            >
          </el-form-item>
          <el-form-item
            label="退还课程金额"
            prop="courseFee"
            v-if="quitForm.isReturnCourseFee"
          >
            <el-input
              disabled
              type="number"
              v-model.trim="quitForm.courseFee"
              style="width: 180px"
            >
              <template slot="append">元</template>
            </el-input>
          </el-form-item>
        </el-row>
        <el-row>
          <el-form-item
            label="退还乐器费用"
            prop="isReturnMusicalFee"
            :rules="[{ required: true, message: '请选择是否退还乐器费用' }]"
          >
            <el-radio
              :disabled="isDisabled"
              v-model.trim="quitForm.isReturnMusicalFee"
              :label="true"
              >是</el-radio
            >
            <el-radio
              :disabled="isDisabled"
              v-model.trim="quitForm.isReturnMusicalFee"
              :label="false"
              >否</el-radio
            >
          </el-form-item>
          <el-form-item
            label="退还乐器金额"
            prop="musicalFee"
            v-if="quitForm.isReturnMusicalFee"
          >
            <el-input
              type="number"
              disabled
              v-model.trim="quitForm.musicalFee"
              style="width: 180px"
            >
              <template slot="append">元</template>
            </el-input>
          </el-form-item>
        </el-row>
        <el-row>
          <el-form-item
            :rules="[{ required: true, message: '请选择是否退还教辅费用' }]"
            label="退还教辅费用"
            prop="isReturnAccessoriesFee"
          >
            <el-radio
              :disabled="isDisabled"
              v-model.trim="quitForm.isReturnAccessoriesFee"
              :label="true"
              >是</el-radio
            >
            <el-radio
              :disabled="isDisabled"
              v-model.trim="quitForm.isReturnAccessoriesFee"
              :label="false"
              >否</el-radio
            >
          </el-form-item>
          <el-form-item
            label="退还教辅金额"
            prop="accessoriesFee"
            v-if="quitForm.isReturnAccessoriesFee"
          >
            <el-input
              disabled
              type="number"
              v-model.trim="quitForm.accessoriesFee"
              style="width: 180px"
            >
              <template slot="append">元</template>
            </el-input>
          </el-form-item>
        </el-row>
        <el-row v-if="$helpers.tenantId == 1">
          <el-form-item
            label="退还乐保费用"
            :rules="[{ required: true, message: '请选择是否退还乐保费用' }]"
            prop="isReturnMaintenanceFee"
          >
            <el-radio
              :disabled="isDisabled"
              v-model.trim="quitForm.isReturnMaintenanceFee"
              :label="true"
              >是</el-radio
            >
            <el-radio
              :disabled="isDisabled"
              v-model.trim="quitForm.isReturnMaintenanceFee"
              :label="false"
              >否</el-radio
            >
          </el-form-item>
          <el-form-item
            label="退还乐保金额"
            :rules="[{ required: true, message: '请输入乐保金额' }]"
            prop="maintenanceFee"
            v-if="quitForm.isReturnMaintenanceFee"
          >
            <el-input
              type="number"
              v-model="quitForm.maintenanceFee"
              style="width: 180px"
            >
              <template slot="append">元</template>
            </el-input>
          </el-form-item>
        </el-row>
        <el-row>
          <el-form-item label="退团原因" prop="reasonEnum">
            <el-radio-group v-model="quitForm.reasonEnum" :disabled="isDisabled">
              <el-radio-button
                :label="item.value"
                v-for="(item, index) in quiteReasonList"
                :key="index"
                >{{ item.label }}</el-radio-button
              >
            </el-radio-group>
          </el-form-item>
        </el-row>
      </div>
      <el-row>
        <el-form-item label="申请理由" prop="userComment">
          <el-input
            type="textarea"
            :rows="3"
            :disabled="isDisabled"
            v-model.trim="quitForm.userComment"
            style="width: 455px !important"
          ></el-input>
        </el-form-item>
      </el-row>
      <el-form-item label="审批理由" prop="reason">
        <el-input
          :disabled="isDisabled"
          type="textarea"
          :rows="3"
          v-model.trim="quitForm.reason"
          style="width: 455px !important"
        ></el-input>
      </el-form-item>
    </el-form>
  </div>
</template>
<script>
import { quiteReasonList } from "@/utils/searchArray";
export default {
  props: ["quitForm", "isDisabled"],
  mounted() {},
  data() {
    return {
      quitRules: {
        isCloudTeacherAmount: [{ required: true, message: "请输入云教练费用" }],
        cloudTeacherAmount: [
          { required: true, message: "请输入云教练金额", trigger: "blur" },
        ],
        isRefundCourseFee: [{ required: true, message: "请选择是否退还课程费用" }],
        isRefundInstrumentFee: [{ required: true, message: "选择是否退还乐器费用" }],
        isRefundTeachingAssistantsFee: [
          { required: true, message: "选择是否退还教辅费用" },
        ],
        isMaintenanceFee: [{ required: true, message: "选择是否退还乐保费用" }],
        maintenanceFee: [{ required: true, message: "请输入退还乐保金额" }],
        reason: [{ required: true, message: "请填写退团退费原因" }],
        isRefundMemberFee: [{ required: true, message: "请选择是否退还会员费用" }],
        reasonEnum: [{ required: true, message: "请选择退团原因" }],
      },
      pickerOptions: {
        firstDayOfWeek: 1,
        disabledDate(time) {
          return time.getTime() > new Date().getTime();
        },
      },
      quiteReasonList,
    };
  },
};
</script>
<style lang="scss" scoped></style>