basicInfoModal.vue 3.9 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133
  1. <template>
  2. <a-modal
  3. centered
  4. class="chainTransferOut-basicInfo-modal"
  5. :footer="null"
  6. :maskClosable="false"
  7. title="新增连锁调出单"
  8. v-model="isShow"
  9. @cancel="isShow = false"
  10. :width="800">
  11. <a-spin :spinning="spinning" tip="Loading...">
  12. <a-form-model
  13. id="chainTransferOut-basicInfo-form"
  14. ref="ruleForm"
  15. :model="form"
  16. :rules="rules"
  17. :label-col="formItemLayout.labelCol"
  18. :wrapper-col="formItemLayout.wrapperCol"
  19. >
  20. <a-form-model-item label="调出产品类型" prop="allocationType">
  21. <v-select
  22. v-model="form.allocationType"
  23. ref="allocationType"
  24. id="chainTransferOut-basicInfo-allocationType"
  25. code="ALLOCATION_LINKAGE_PRODUCT_TYPE"
  26. placeholder="请选择调出产品类型"
  27. allowClear
  28. ></v-select>
  29. </a-form-model-item>
  30. <a-form-model-item label="调往对象" prop="putTenantSn">
  31. <outTenant id="chainTransferOut-putTenantSn" placeholder="请选择调往对象" v-model="form.putTenantSn"></outTenant>
  32. </a-form-model-item>
  33. <a-form-model-item label="备注" prop="remark">
  34. <a-textarea id="chainTransferOut-basicInfo-remark" :maxLength="500" v-model="form.remark" placeholder="请输入备注(最多500个字符)" allowClear />
  35. </a-form-model-item>
  36. </a-form-model>
  37. <div class="btn-cont">
  38. <a-button type="primary" id="chainTransferOut-basicInfo-modal-save" @click="handleSave">保存</a-button>
  39. <a-button id="chainTransferOut-basicInfo-modal-back" @click="isShow = false" style="margin-left: 15px;">取消</a-button>
  40. </div>
  41. </a-spin>
  42. </a-modal>
  43. </template>
  44. <script>
  45. import { commonMixin } from '@/utils/mixin'
  46. import { VSelect } from '@/components'
  47. import outTenant from '@/views/common/outTenant.js'
  48. import { allocLinkageOutSave } from '@/api/allocLinkageOut'
  49. export default {
  50. name: 'ChainTransferOutBasicInfoModal',
  51. components: { VSelect, outTenant },
  52. mixins: [commonMixin],
  53. props: {
  54. openModal: {
  55. // 弹框显示状态
  56. type: Boolean,
  57. default: false
  58. }
  59. },
  60. data () {
  61. return {
  62. spinning: false,
  63. isShow: this.openModal, // 是否打开弹框
  64. formItemLayout: {
  65. labelCol: { span: 4 },
  66. wrapperCol: { span: 18 }
  67. },
  68. form: {
  69. allocationType: '', // 调出产品类型
  70. putTenantSn: undefined, // 调往对象
  71. remark: ''
  72. },
  73. rules: {
  74. allocationType: [{ required: true, message: '请选择调出产品类型', trigger: 'change' }],
  75. putTenantSn: [{ required: true, message: '请选择调往对象', trigger: 'change' }]
  76. },
  77. }
  78. },
  79. methods: {
  80. // 保存
  81. handleSave () {
  82. const _this = this
  83. this.$refs.ruleForm.validate(valid => {
  84. if (valid) {
  85. const form = JSON.parse(JSON.stringify(_this.form))
  86. _this.spinning = true
  87. allocLinkageOutSave(form).then(res => {
  88. if (res.status == 200) {
  89. _this.$message.success(res.message)
  90. setTimeout(() => {
  91. _this.isShow = false
  92. _this.$emit('ok', res.data)
  93. _this.spinning = false
  94. }, 1000)
  95. } else {
  96. _this.spinning = false
  97. }
  98. })
  99. } else {
  100. console.log('error submit!!')
  101. return false
  102. }
  103. })
  104. },
  105. },
  106. watch: {
  107. // 父页面传过来的弹框状态
  108. openModal (newValue, oldValue) {
  109. this.isShow = newValue
  110. },
  111. // 重定义的弹框状态
  112. isShow (newValue, oldValue) {
  113. if (!newValue) {
  114. this.$emit('close')
  115. this.$refs.ruleForm.resetFields()
  116. }
  117. }
  118. }
  119. }
  120. </script>
  121. <style lang="less">
  122. .chainTransferOut-basicInfo-modal {
  123. .ant-modal-body {
  124. padding: 40px 40px 24px;
  125. }
  126. .btn-cont {
  127. text-align: center;
  128. margin: 35px 0 10px;
  129. }
  130. }
  131. </style>