setPurchaseQty.vue 3.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137
  1. <template>
  2. <a-modal
  3. centered
  4. class="setPurchaseQty-modal"
  5. :footer="null"
  6. :maskClosable="false"
  7. title="设置采购数量"
  8. v-model="isShow"
  9. @cancel="isShow = false"
  10. :width="600">
  11. <a-spin :spinning="spinning" tip="Loading...">
  12. <a-form-model
  13. id="setPurchaseQty-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="产品名称:">
  21. {{ dateilData&&dateilData.productName }}
  22. </a-form-model-item>
  23. <a-form-model-item label="产品编码">
  24. {{ dateilData&&dateilData.productCode }}
  25. </a-form-model-item>
  26. <a-form-model-item label="采购数量" prop="qty">
  27. <a-input-number
  28. id="shelfMonitoringList-maxUnsalableDays"
  29. style="width:60%"
  30. v-model="form.qty"
  31. :precision="0"
  32. :min="1"
  33. :max="999999"
  34. placeholder="采购数量"/>
  35. </a-form-model-item>
  36. </a-form-model>
  37. <div class="btn-cont">
  38. <a-button type="primary" id="setPurchaseQty-modal-save" @click="handleSave">保存</a-button>
  39. <a-button id="setPurchaseQty-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 { purchaseCartSave } from '@/api/purchaseCart'
  47. import { mapActions } from 'vuex'
  48. export default {
  49. name: 'ChainTransferOutBasicInfoModal',
  50. mixins: [commonMixin],
  51. props: {
  52. openModal: {
  53. // 弹框显示状态
  54. type: Boolean,
  55. default: false
  56. }
  57. },
  58. data () {
  59. return {
  60. spinning: false,
  61. isShow: this.openModal, // 是否打开弹框
  62. formItemLayout: {
  63. labelCol: { span: 4 },
  64. wrapperCol: { span: 20 }
  65. },
  66. form: {
  67. qty: 1,
  68. productSn: '',
  69. productCode: '',
  70. sysFlag: ''
  71. },
  72. rules: {
  73. qty: [{ required: true, message: '请输入采购数量', trigger: 'change' }]
  74. },
  75. dateilData: null
  76. }
  77. },
  78. methods: {
  79. ...mapActions(['getCartList']),
  80. setData (row) {
  81. this.dateilData = row
  82. this.form.productSn = row.productSn
  83. this.form.productCode = row.productCode
  84. this.form.sysFlag = row.dealerProduct.sysFlag
  85. this.form.qty = 1
  86. },
  87. // 保存
  88. handleSave () {
  89. const _this = this
  90. this.$refs.ruleForm.validate(valid => {
  91. if (valid) {
  92. const form = JSON.parse(JSON.stringify(_this.form))
  93. _this.spinning = true
  94. purchaseCartSave(form).then(res => {
  95. if (res.status == 200) {
  96. _this.$message.success(res.message)
  97. setTimeout(() => {
  98. _this.isShow = false
  99. _this.$emit('ok', res.data)
  100. _this.getCartList()
  101. _this.spinning = false
  102. }, 1000)
  103. } else {
  104. _this.spinning = false
  105. }
  106. })
  107. } else {
  108. return false
  109. }
  110. })
  111. }
  112. },
  113. watch: {
  114. // 父页面传过来的弹框状态
  115. openModal (newValue, oldValue) {
  116. this.isShow = newValue
  117. },
  118. // 重定义的弹框状态
  119. isShow (newValue, oldValue) {
  120. if (!newValue) {
  121. this.$emit('close')
  122. this.$refs.ruleForm.resetFields()
  123. }
  124. }
  125. }
  126. }
  127. </script>
  128. <style lang="less">
  129. .setPurchaseQty-modal {
  130. .btn-cont {
  131. text-align: center;
  132. margin: 35px 0 10px;
  133. }
  134. }
  135. </style>