|
@@ -77,7 +77,10 @@
|
|
|
>
|
|
|
申请退款
|
|
|
</div>
|
|
|
- <div class="state" v-if="items.periodStatus > -3 && item.orderFrom != 11">
|
|
|
+ <div
|
|
|
+ class="state"
|
|
|
+ v-if="items.periodStatus > -3 && item.orderFrom != 11"
|
|
|
+ >
|
|
|
{{ periodStatusName(items.periodStatus) }}
|
|
|
</div>
|
|
|
</div>
|
|
@@ -181,6 +184,65 @@
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
+ <el-dialog
|
|
|
+ :visible.sync="visible"
|
|
|
+ width="400px"
|
|
|
+ :show-close="false"
|
|
|
+ :close-on-click-modal="false"
|
|
|
+ :lock-scroll="true"
|
|
|
+ >
|
|
|
+ <div slot="title" class="hearders">
|
|
|
+ <div class="leftTitle">确定申请退款吗?</div>
|
|
|
+ <div class="rightBoxs">
|
|
|
+ <img
|
|
|
+ src="@/assets/img/Close@2x.png"
|
|
|
+ alt=""
|
|
|
+ @click="visible = false"
|
|
|
+ />
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div>
|
|
|
+ <el-form
|
|
|
+ :model="ruleForm"
|
|
|
+ :rules="rules"
|
|
|
+ ref="ruleForm"
|
|
|
+ label-width="0px"
|
|
|
+ class="demo-ruleForm"
|
|
|
+ >
|
|
|
+ <el-form-item label="" prop="refundOptionsIndex">
|
|
|
+ <el-select
|
|
|
+ style="width:360px"
|
|
|
+ v-model="ruleForm.refundOptionsIndex"
|
|
|
+ placeholder="请选择退款原因"
|
|
|
+ >
|
|
|
+ <el-option
|
|
|
+ v-for="item in refundOptions"
|
|
|
+ :key="item.value"
|
|
|
+ :label="item.label"
|
|
|
+ :value="item.value"
|
|
|
+ >
|
|
|
+ </el-option>
|
|
|
+ </el-select> </el-form-item
|
|
|
+ ><el-form-item
|
|
|
+ label=""
|
|
|
+ prop="refundReason"
|
|
|
+ v-if="ruleForm.refundOptionsIndex == 5"
|
|
|
+ ><el-input
|
|
|
+ type="textarea"
|
|
|
+ :rows="3"
|
|
|
+ style="width:360px"
|
|
|
+ v-model="ruleForm.refundReason"
|
|
|
+ placeholder="请输入退款原因"
|
|
|
+ ></el-input></el-form-item
|
|
|
+ ></el-form>
|
|
|
+ </div>
|
|
|
+ <div slot="footer" class="dialog-footer">
|
|
|
+ <el-button @click="visible = false">取消</el-button>
|
|
|
+ <el-button type="primary" @click="submitRefund('ruleForm')"
|
|
|
+ >提交</el-button
|
|
|
+ >
|
|
|
+ </div>
|
|
|
+ </el-dialog>
|
|
|
</div>
|
|
|
</template>
|
|
|
|
|
@@ -190,6 +252,27 @@ export default {
|
|
|
name: "MyOrder",
|
|
|
data() {
|
|
|
return {
|
|
|
+ refundOptions: [
|
|
|
+ { label: "已学过,重复报名", value: 1 },
|
|
|
+ { label: "报错专业/课程", value: 2 },
|
|
|
+ { label: "班级未开班", value: 3 },
|
|
|
+ { label: "培训/继教周期未到", value: 4 },
|
|
|
+ { label: "其他", value: 5 }
|
|
|
+ ],
|
|
|
+ activeItem:{},
|
|
|
+ ruleForm: {
|
|
|
+ refundOptionsIndex: "",
|
|
|
+ refundReason: ""
|
|
|
+ },
|
|
|
+ rules: {
|
|
|
+ refundOptionsIndex: [
|
|
|
+ { required: true, message: "选择退款原因", trigger: "change" }
|
|
|
+ ],
|
|
|
+ refundReason: [
|
|
|
+ { required: true, message: "输入退款原因", trigger: "blur" }
|
|
|
+ ]
|
|
|
+ },
|
|
|
+ visible: false,
|
|
|
orderList: [],
|
|
|
activeName: "1",
|
|
|
formData: {
|
|
@@ -355,8 +438,54 @@ export default {
|
|
|
}
|
|
|
});
|
|
|
},
|
|
|
-
|
|
|
+ submitRefund(formName) {
|
|
|
+ this.$refs[formName].validate(valid => {
|
|
|
+ if (valid) {
|
|
|
+ this.showLoading();
|
|
|
+ this.$request
|
|
|
+ .refundSmallOrder({
|
|
|
+ orderSn: this.activeItem.orderSn,
|
|
|
+ goodsId: this.activeItem.goodsId,
|
|
|
+ orderGoodsId: this.activeItem.orderGoodsId,
|
|
|
+ applyReason:
|
|
|
+ this.ruleForm.refundOptionsIndex == 5
|
|
|
+ ? this.ruleForm.refundReason
|
|
|
+ : this.refundOptions[this.ruleForm.refundOptionsIndex - 1].label
|
|
|
+ })
|
|
|
+ .then(res => {
|
|
|
+ this.visible = false
|
|
|
+ this.hideLoading();
|
|
|
+ this.$message({
|
|
|
+ type: "success",
|
|
|
+ message: "申请退款成功"
|
|
|
+ });
|
|
|
+ this.getOrderNum();
|
|
|
+ this.getOrderList();
|
|
|
+ })
|
|
|
+ .catch(err => {
|
|
|
+ this.hideLoading();
|
|
|
+ this.$message({
|
|
|
+ type: "warning",
|
|
|
+ message: err.msg
|
|
|
+ });
|
|
|
+ });
|
|
|
+ } else {
|
|
|
+ console.log("error submit!!");
|
|
|
+ return false;
|
|
|
+ }
|
|
|
+ });
|
|
|
+ },
|
|
|
refund(orderSn, item) {
|
|
|
+ this.activeItem = item;
|
|
|
+ this.ruleForm = {
|
|
|
+ refundOptionsIndex: "",
|
|
|
+ refundReason: ""
|
|
|
+ };
|
|
|
+ this.visible = true;
|
|
|
+ this.$nextTick(() => {
|
|
|
+ this.$refs.ruleForm.clearValidate();
|
|
|
+ });
|
|
|
+ return;
|
|
|
this.$prompt("确定要退款吗?", "提示", {
|
|
|
confirmButtonText: "确定",
|
|
|
cancelButtonText: "取消",
|
|
@@ -517,6 +646,49 @@ export default {
|
|
|
|
|
|
<!-- Add "scoped" attribute to limit CSS to this component only -->
|
|
|
<style scoped lang="scss">
|
|
|
+/deep/ .el-dialog {
|
|
|
+ border-radius: 8px !important;
|
|
|
+ .el-dialog__header {
|
|
|
+ padding: 0;
|
|
|
+ .hearders {
|
|
|
+ height: 40px;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: space-between;
|
|
|
+ padding: 0px 18px 0px 20px;
|
|
|
+ border-bottom: 1px solid #e2e2e2;
|
|
|
+ .leftTitle {
|
|
|
+ font-size: 14px;
|
|
|
+ font-weight: bold;
|
|
|
+ color: #2f4378;
|
|
|
+ }
|
|
|
+ .rightBoxs {
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ img {
|
|
|
+ width: 14px;
|
|
|
+ height: 14px;
|
|
|
+ margin-left: 13px;
|
|
|
+ cursor: pointer;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .el-dialog__footer {
|
|
|
+ padding: 0;
|
|
|
+ .dialog-footer {
|
|
|
+ padding: 0px 40px;
|
|
|
+ height: 70px;
|
|
|
+ border-top: 1px solid #e2e2e2;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: flex-end;
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
+/deep/.el-button {
|
|
|
+ border-radius: 8px;
|
|
|
+}
|
|
|
.my-order {
|
|
|
&__header {
|
|
|
/deep/ .el-tabs__header {
|