basicInfoModal.vue 5.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179
  1. <template>
  2. <a-modal
  3. centered
  4. class="shelfSet-basicInfo-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="shelfSet-basicInfo-form"
  14. ref="ruleForm"
  15. :model="form"
  16. :rules="rules"
  17. :label-col="formItemLayout.labelCol"
  18. :wrapper-col="formItemLayout.wrapperCol">
  19. <a-form-model-item label="货架名称" prop="shelfName">
  20. <shelfSList v-model="form.shelfName" @change="shelfChange"></shelfSList>
  21. </a-form-model-item>
  22. </a-form-model>
  23. <div class="btn-cont">
  24. <a-button type="primary" id="importGuide-nextStep" @click="handlerNextStep">下一步</a-button>
  25. <a-button id="shelfSet-basicInfo-modal-back" @click="isShow = false" style="margin-left: 15px;">取消</a-button>
  26. </div>
  27. </a-spin>
  28. <!-- 新增回调单(实现新增) -->
  29. <add-recall-bill-modal :openModal="showRecallBill" @close="showRecallBill=false"></add-recall-bill-modal>
  30. </a-modal>
  31. </template>
  32. <script>
  33. import { commonMixin } from '@/utils/mixin'
  34. import { VSelect } from '@/components'
  35. import custList from '@/views/common/custList.vue'
  36. import shelfSList from '@/views/common/shelfList'
  37. import { shelfSave } from '@/api/shelf'
  38. import addRecallBillModal from './addRecallBillModal.vue'
  39. export default {
  40. name: 'ShelfSetBasicInfoModal',
  41. components: { VSelect, custList, shelfSList, addRecallBillModal },
  42. mixins: [commonMixin],
  43. props: {
  44. openModal: {
  45. // 弹框显示状态
  46. type: Boolean,
  47. default: false
  48. },
  49. nowData: {
  50. type: Object,
  51. default: () => {
  52. return {}
  53. }
  54. },
  55. type: {
  56. type: [String, Number],
  57. default: '1'
  58. }
  59. },
  60. data () {
  61. return {
  62. spinning: false,
  63. isShow: this.openModal, // 是否打开弹框
  64. formItemLayout: {
  65. labelCol: { span: 5 },
  66. wrapperCol: { span: 17 }
  67. },
  68. form: {
  69. shelfName: ''
  70. },
  71. rules: {
  72. shelfName: [{ required: true, message: '请选择货架名称', trigger: 'change' }]
  73. },
  74. showRecallBill: false
  75. }
  76. },
  77. methods: {
  78. shelfChange (v, row) {
  79. this.shelfName = row ? row.shelfName : ''
  80. },
  81. // 下一步 保存货架信息
  82. handlerNextStep () {
  83. this.showRecallBill = true
  84. },
  85. // 客户 change
  86. custChange (obj, row) {
  87. this.form.customerSn = row && row.customerSn || undefined
  88. },
  89. // 保存
  90. handleSave () {
  91. const _this = this
  92. this.$refs.ruleForm.validate(valid => {
  93. if (valid) {
  94. const form = JSON.parse(JSON.stringify(_this.form))
  95. form.shelfSn = _this.nowData && _this.nowData.shelfSn
  96. _this.spinning = true
  97. shelfSave(form).then(res => {
  98. if (res.status == 200) {
  99. _this.$message.success(res.message)
  100. setTimeout(() => {
  101. _this.isShow = false
  102. _this.$emit('ok', res.data)
  103. _this.spinning = false
  104. }, 100)
  105. // 更新价格显示
  106. // updateShelfPriceShow({
  107. // shelfSn: form.shelfSn,
  108. // paramValue: form.showPrice
  109. // }).then(ret => {
  110. // if (ret.status == 200) {
  111. // _this.$message.success(ret.message)
  112. // setTimeout(() => {
  113. // _this.isShow = false
  114. // _this.$emit('ok', res.data)
  115. // _this.spinning = false
  116. // }, 100)
  117. // } else {
  118. // _this.spinning = false
  119. // }
  120. // })
  121. } else {
  122. _this.spinning = false
  123. }
  124. })
  125. } else {
  126. console.log('error submit!!')
  127. return false
  128. }
  129. })
  130. }
  131. },
  132. watch: {
  133. // 父页面传过来的弹框状态
  134. openModal (newValue, oldValue) {
  135. this.isShow = newValue
  136. },
  137. // 重定义的弹框状态
  138. isShow (newValue, oldValue) {
  139. if (!newValue) {
  140. this.$emit('close')
  141. this.$refs.ruleForm.resetFields()
  142. // this.$refs.custList.resetForm()
  143. } else {
  144. // const _this = this
  145. // this.$nextTick(() => {
  146. // _this.form.shelfName = _this.nowData.shelfName
  147. // _this.form.showPrice = _this.nowData.showPrice
  148. // const custome = _this.nowData.customerEntity
  149. // if (custome) {
  150. // _this.form.customerSn = custome.customerSn || ''
  151. // _this.$refs.custList.fetchUser(custome.customerName || '')
  152. // _this.$refs.custList.dealerName = {
  153. // key: custome.customerSn,
  154. // label: custome.customerName,
  155. // row: _this.nowData
  156. // }
  157. // }
  158. // })
  159. }
  160. }
  161. }
  162. }
  163. </script>
  164. <style lang="less">
  165. .shelfSet-basicInfo-modal {
  166. .ant-modal-body {
  167. padding: 40px 40px 24px;
  168. }
  169. .ant-form-item{
  170. margin-bottom: 15px;
  171. }
  172. .btn-cont {
  173. text-align: center;
  174. margin: 35px 0 10px;
  175. }
  176. }
  177. </style>