send.vue 3.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596
  1. <template>
  2. <el-dialog :title="titleMap[mode]" v-model="visible" :width="600" destroy-on-close @closed="$emit('closed')" :close-on-click-modal="false" :close-on-press-escape="false">
  3. <el-form ref="dialogForm" :model="formData" :rules="rules" label-width="100px" label-position="top">
  4. <el-form-item label="订单编号" prop="order_id" v-if="mode=='add'">
  5. <el-input v-model="formData.order_id" clearable placeholder="请输入"></el-input>
  6. <div class="el-form-item-msg"></div>
  7. </el-form-item>
  8. <el-form-item label="订单编号" prop="order_id" v-if="mode=='edit'">
  9. <el-input v-model="formData.order_id" readonly clearable placeholder="请输入"></el-input>
  10. <div class="el-form-item-msg"></div>
  11. </el-form-item>
  12. <el-form-item label="联系人" prop="username">
  13. <el-input v-model="formData.username" clearable placeholder="请输入"></el-input>
  14. <div class="el-form-item-msg"></div>
  15. </el-form-item>
  16. <el-form-item label="联系电话" prop="mobile">
  17. <el-input v-model="formData.mobile" clearable placeholder="请输入"></el-input>
  18. <div class="el-form-item-msg"></div>
  19. </el-form-item>
  20. <el-form-item label="详细地址" prop="address">
  21. <el-input v-model="formData.address" clearable placeholder="请输入"></el-input>
  22. <div class="el-form-item-msg">填写详细的地址,需要带有省市区</div>
  23. </el-form-item>
  24. </el-form>
  25. <template #footer>
  26. <el-button @click="visible=false" >取 消</el-button>
  27. <el-button type="primary" :loading="isSaveing" @click="submit()">提交</el-button>
  28. </template>
  29. </el-dialog>
  30. <agentData ref="agentData" :multiple="false" @success="handleSuccess"></agentData>
  31. </template>
  32. <script>
  33. export default {
  34. data(){
  35. return {
  36. stepActive:1,
  37. loading: false,
  38. mode:"add",
  39. titleMap:{
  40. add:"手动录单",
  41. edit:"手动录单"
  42. },
  43. visible: false,
  44. isSaveing: false,
  45. formData:{},
  46. disabled:false,
  47. rules:{
  48. order_id: [
  49. {required: true, message: '请输入'}
  50. ],
  51. username: [
  52. {required: true, message: '请输入'}
  53. ],
  54. mobile: [
  55. {required: true, message: '请输入'}
  56. ],
  57. address: [
  58. {required: true, message: '请输入'}
  59. ]
  60. }
  61. }
  62. },
  63. methods:{
  64. open(mode = 'add'){
  65. this.mode = mode;
  66. this.visible = true;
  67. return this
  68. },
  69. //表单注入数据
  70. setData(data){
  71. this.formData.order_id = data.order_id;
  72. },
  73. async submit(){
  74. var validate = await this.$refs.dialogForm.validate().catch(()=>{});
  75. if(!validate){ return false }
  76. this.isSaveing = true;
  77. let submitData = JSON.parse(JSON.stringify(this.formData));
  78. var resp = await this.$API.merOrder.system.post(submitData);
  79. this.isSaveing = false;
  80. if (resp.code !== 1) {
  81. return this.$message.error(resp.msg);
  82. }
  83. this.$message.success(resp.msg);
  84. this.visible = false;
  85. this.formData = {};
  86. this.submitState = false;
  87. this.$emit("success");
  88. }
  89. }
  90. }
  91. </script>
  92. <style>
  93. .mt20 {margin-top: 20px;}
  94. .login-msg-yzm {display: flex;width: 100%;}
  95. .login-msg-yzm .el-button {margin-left: 10px;--el-button-size:42px;}
  96. </style>