parent
e515715a05
commit
317945a636
@ -0,0 +1,115 @@ |
|||||||
|
<template> |
||||||
|
<a-modal |
||||||
|
:title="title" |
||||||
|
:width="560" |
||||||
|
:visible="visible" |
||||||
|
:isLoading="isLoading" |
||||||
|
:confirmLoading="isLoading" |
||||||
|
:maskClosable="false" |
||||||
|
@ok="handleSubmit" |
||||||
|
@cancel="handleCancel" |
||||||
|
> |
||||||
|
<a-spin :spinning="isLoading"> |
||||||
|
<a-form :form="form"> |
||||||
|
<a-form-item |
||||||
|
label="京东链接" |
||||||
|
:labelCol="labelCol" |
||||||
|
:wrapperCol="wrapperCol" |
||||||
|
> |
||||||
|
<a-textarea |
||||||
|
placeholder="请输入京东链接" |
||||||
|
:auto-size="{ minRows: 2, maxRows: 5 }" |
||||||
|
v-decorator="['jd_link', { rules: [{ required: true, message: '请输入京东链接' }] }]" |
||||||
|
/> |
||||||
|
</a-form-item> |
||||||
|
</a-form> |
||||||
|
</a-spin> |
||||||
|
</a-modal> |
||||||
|
</template> |
||||||
|
|
||||||
|
<script> |
||||||
|
import _ from 'lodash' |
||||||
|
import * as Api from '@/api/order/event' |
||||||
|
import { Ueditor } from '@/components' |
||||||
|
export default { |
||||||
|
components: { |
||||||
|
Ueditor, |
||||||
|
}, |
||||||
|
data() { |
||||||
|
return { |
||||||
|
// 对话框标题 |
||||||
|
title: '商家备注', |
||||||
|
// 标签布局属性 |
||||||
|
labelCol: { span: 6 }, |
||||||
|
// 输入框布局属性 |
||||||
|
wrapperCol: { span: 14 }, |
||||||
|
// modal(对话框)是否可见 |
||||||
|
visible: false, |
||||||
|
// modal(对话框)确定按钮 loading |
||||||
|
isLoading: false, |
||||||
|
// 当前表单元素 |
||||||
|
form: this.$form.createForm(this), |
||||||
|
// 当前记录 |
||||||
|
record: {}, |
||||||
|
} |
||||||
|
}, |
||||||
|
created() {}, |
||||||
|
methods: { |
||||||
|
// 显示对话框 |
||||||
|
show(record) { |
||||||
|
// 显示窗口 |
||||||
|
this.visible = true |
||||||
|
// 当前记录 |
||||||
|
this.record = record |
||||||
|
// 设置默认值 |
||||||
|
this.setFieldsValue() |
||||||
|
}, |
||||||
|
|
||||||
|
// 设置默认值 |
||||||
|
setFieldsValue() { |
||||||
|
const { |
||||||
|
record, |
||||||
|
$nextTick, |
||||||
|
form: { setFieldsValue }, |
||||||
|
} = this |
||||||
|
$nextTick(() => { |
||||||
|
setFieldsValue({ jd_link: record.jd_link }) |
||||||
|
}) |
||||||
|
}, |
||||||
|
|
||||||
|
// 确认按钮 |
||||||
|
handleSubmit(e) { |
||||||
|
e.preventDefault() |
||||||
|
// 表单验证 |
||||||
|
const { |
||||||
|
form: { validateFields }, |
||||||
|
} = this |
||||||
|
validateFields((errors, values) => { |
||||||
|
// 提交到后端api |
||||||
|
!errors && this.onFormSubmit(values) |
||||||
|
}) |
||||||
|
}, |
||||||
|
|
||||||
|
// 关闭对话框事件 |
||||||
|
handleCancel() { |
||||||
|
this.visible = false |
||||||
|
this.form.resetFields() |
||||||
|
}, |
||||||
|
|
||||||
|
// 提交到后端api |
||||||
|
onFormSubmit(values) { |
||||||
|
this.isLoading = true |
||||||
|
Api.updateRemark({ orderId: this.record.order_id, form: values }) |
||||||
|
.then((result) => { |
||||||
|
// 显示成功 |
||||||
|
this.$message.success(result.message, 1.5) |
||||||
|
// 关闭对话框事件 |
||||||
|
this.handleCancel() |
||||||
|
// 通知父端组件提交完成了 |
||||||
|
this.$emit('handleSubmit', values) |
||||||
|
}) |
||||||
|
.finally(() => (this.isLoading = false)) |
||||||
|
}, |
||||||
|
}, |
||||||
|
} |
||||||
|
</script> |
Loading…
Reference in new issue