| <template> | 
|   <GlobalAlertWindow | 
|     :title="title" | 
|     :visible.sync="visible" | 
|     :confirm-working="isWorking" | 
|     width="600px" | 
|     @confirm="confirm" | 
|   > | 
|     <el-descriptions title="" :column="2" > | 
|       <el-descriptions-item label="充值押金">{{ form.goodsorderMoney }}元</el-descriptions-item> | 
|       <el-descriptions-item label="结算金额">{{ form.closeMoney }}元</el-descriptions-item> | 
|       <el-descriptions-item label="已退金额">{{ form.hasRefundMoney }}元</el-descriptions-item> | 
|       <el-descriptions-item label="可退金额">{{ form.canBanlanceMoney }}元</el-descriptions-item> | 
|     </el-descriptions> | 
|     <el-form :model="form" ref="form" :rules="rules" label-suffix=":"> | 
|       <el-form-item label="退款金额" prop="money"> | 
|         <div style="display: flex;"> | 
|           <el-input style="flex: 1;" v-model="form.money" placeholder="请输入退款金额" v-trim/> | 
|         </div> | 
|       </el-form-item> | 
|       <el-form-item label="退款原因" prop="reason"> | 
|         <el-input | 
|           type="textarea" | 
|           :autosize="{ minRows: 2, maxRows: 4}" | 
|           v-model="form.reason" | 
|           placeholder="请输入调整备注" | 
|           v-trim | 
|         /> | 
|       </el-form-item> | 
|     </el-form> | 
|   </GlobalAlertWindow> | 
| </template> | 
|   | 
| <script> | 
| import BaseOpera from '@/components/base/BaseOpera' | 
| import GlobalAlertWindow from '@/components/common/GlobalAlertWindow' | 
| import { backGoodsorder } from '@/api/business/goodsorder' | 
| import { numRule } from '@/utils/form' | 
| export default { | 
|   name: 'OperaSuggestWindow', | 
|   extends: BaseOpera, | 
|   components: { GlobalAlertWindow }, | 
|   data () { | 
|     return { | 
|       // 表单数据 | 
|       form: { | 
|         orderId: null, | 
|         canBanlanceMoney: '', | 
|         closeMoney: '', | 
|         goodsorderMoney: '', | 
|         hasRefundMoney: '', | 
|         | 
|         money: '', | 
|         reason: '', | 
|       }, | 
|       // 验证规则 | 
|       rules: { | 
|         duration: [ | 
|          { required: true, validator: numRule, message: '请输入退款金额', tigger: 'blur' } | 
|         ] | 
|       }, | 
|        | 
|     } | 
|   }, | 
|   created () { | 
|      | 
|   }, | 
|   methods: { | 
|     /** | 
|      * 打开窗口 | 
|      * @title 窗口标题 | 
|      * @target 编辑的对象 | 
|      */ | 
|      open (title, target) { | 
|       this.title = title | 
|       this.visible = true | 
|       this.$nextTick(() => { | 
|         for (const key in this.form) { | 
|           this.form[key] = target[key] | 
|         } | 
|         this.form.money = '' | 
|         this.form.reason = '' | 
|         this.$refs.form.clearValidate() | 
|       }) | 
|        | 
|     }, | 
|     selectReason(v) { | 
|       // console.log(item); | 
|       let item = this.reason.find(item => item.name == v) | 
|       this.backInfoRequired = item.required == 1 | 
|     }, | 
|     confirm() { | 
|       this.$refs.form.validate((valid) => { | 
|         if (!valid) { | 
|           return | 
|         } | 
|         this.isWorking = true | 
|         backGoodsorder(this.form) | 
|           .then(() => { | 
|             this.visible = false | 
|             this.$tip.apiSuccess('退款成功') | 
|             this.$emit('success') | 
|           }) | 
|           .catch(err => { | 
|             this.$tip.apiFailed(err) | 
|           }) | 
|           .finally(() => { | 
|             this.isWorking = false | 
|           }) | 
|       }) | 
|     } | 
|   }, | 
| } | 
| </script> | 
|   | 
| <style lang="scss" scoped> | 
| @import "@/assets/style/alertstyle.scss"; | 
| @import "@/assets/style/variables.scss"; | 
|   | 
| ::v-deep .el-input.is-disabled .el-input__inner { | 
|   background-color: #fff !important; | 
|   cursor: pointer; | 
| } | 
|   | 
| .time-style { | 
|   display: flex; | 
|   flex-wrap: wrap; | 
|   cursor: pointer; | 
|   .time-item { | 
|     margin-right: 8px; | 
|     margin-bottom: 8px; | 
|     border: #111 solid 1px; | 
|     font-size: 14px; | 
|     line-height: 14px; | 
|     padding: 5px; | 
|     border-radius: 5px; | 
|     color: #111; | 
|   } | 
|   .time-item-sel { | 
|     border-color: $primary-color; | 
|     background-color: $primary-color; | 
|     color: #fff; | 
|   } | 
|   .time-item-disable { | 
|     border-color: #999; | 
|     background-color: #999; | 
|     color: #111; | 
|   } | 
| } | 
|   | 
| </style> |