outWarehousingModal.vue 5.9 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182
  1. <template>
  2. <a-modal
  3. centered
  4. class="replenishmentManagement-outWarehousing-modal"
  5. :footer="null"
  6. :maskClosable="false"
  7. :title="modalTit"
  8. v-model="isShow"
  9. @cancle="isShow = false"
  10. :width="800">
  11. <a-spin :spinning="spinning" tip="Loading...">
  12. <a-form-model
  13. id="replenishmentManagement-outWarehousing-form"
  14. ref="ruleForm"
  15. layout="inline"
  16. :model="form"
  17. :rules="rules"
  18. style="margin-bottom: 10px;" >
  19. <a-row :gutter="15">
  20. <a-col :md="12" :sm="24">
  21. <a-form-model-item label="补货单号">BH202101010001</a-form-model-item>
  22. </a-col>
  23. <a-col :md="12" :sm="24">
  24. <a-form-model-item label="单据来源">系统创建</a-form-model-item>
  25. </a-col>
  26. <a-col :md="12" :sm="24">
  27. <a-form-model-item label="调往对象" prop="type">
  28. <a-radio-group v-model="form.type">
  29. <a-radio v-for="(item,index) in typeList" :key="index" :value="item.val">{{ item.name }}</a-radio>
  30. </a-radio-group>
  31. </a-form-model-item>
  32. </a-col>
  33. <a-col :md="12" :sm="24">
  34. <a-form-model-item label="出库备注">
  35. <a-input id="replenishmentManagement-outWarehousing-remark" v-model.trim="form.remark" allowClear placeholder="请输入出库备注"/>
  36. </a-form-model-item>
  37. </a-col>
  38. </a-row>
  39. </a-form-model>
  40. <!-- 列表 -->
  41. <s-table
  42. class="sTable"
  43. ref="table"
  44. size="small"
  45. :rowKey="(record) => record.id"
  46. :columns="columns"
  47. :data="loadData"
  48. :scroll="{ y: 400 }"
  49. :showPagination="false"
  50. :defaultLoadData="false"
  51. bordered>
  52. </s-table>
  53. <div class="btn-cont">
  54. <a-button type="primary" id="replenishmentManagement-outWarehousing-modal-save" @click="handleSave">确认出库</a-button>
  55. <a-button id="replenishmentManagement-outWarehousing-modal-back" @click="isShow = false" style="margin-left: 15px;">取消</a-button>
  56. </div>
  57. </a-spin>
  58. </a-modal>
  59. </template>
  60. <script>
  61. import { commonMixin } from '@/utils/mixin'
  62. import { STable, VSelect } from '@/components'
  63. import { storeCallOutList } from '@/api/storeCallOut'
  64. export default {
  65. name: 'OutWarehousingModal',
  66. components: { STable, VSelect },
  67. mixins: [commonMixin],
  68. props: {
  69. openModal: { // 弹框显示状态
  70. type: Boolean,
  71. default: false
  72. },
  73. nowData: {
  74. type: Object,
  75. default: () => {
  76. return {}
  77. }
  78. }
  79. },
  80. data () {
  81. return {
  82. spinning: false,
  83. isShow: this.openModal, // 是否打开弹框
  84. columns: [
  85. { title: '序号', dataIndex: 'no', width: '8%', align: 'center' },
  86. { title: '产品编码', dataIndex: 'allocationLinkagePutNo', width: '22%', align: 'center', customRender: function (text) { return text || '--' } },
  87. { title: '产品名称', dataIndex: 'outTenantName', width: '32%', align: 'left', customRender: function (text) { return text || '--' }, ellipsis: true },
  88. { title: '补货应发数量', dataIndex: 'productTotalCategory', width: '15%', align: 'center', customRender: function (text) { return ((text || text == 0) ? text : '--') } },
  89. { title: '实发数量', dataIndex: 'outQty', width: '15%', align: 'center', customRender: function (text) { return ((text || text == 0) ? text : '--') } },
  90. { title: '单位', dataIndex: 'productUnit', width: '8%', align: 'center', customRender: function (text) { return text || '--' } }
  91. ],
  92. // 加载数据方法 必须为 Promise 对象
  93. loadData: parameter => {
  94. this.disabled = true
  95. this.spinning = true
  96. return storeCallOutList(Object.assign(parameter, this.queryParam)).then(res => {
  97. let data
  98. if (res.status == 200) {
  99. data = res.data
  100. const no = (data.pageNo - 1) * data.pageSize
  101. for (var i = 0; i < data.list.length; i++) {
  102. data.list[i].no = no + i + 1
  103. }
  104. this.disabled = false
  105. }
  106. this.spinning = false
  107. return data
  108. })
  109. },
  110. form: {
  111. type: undefined,
  112. remark: ''
  113. },
  114. rules: {
  115. 'type': [{ required: true, message: '请选择配送方式', trigger: ['blur', 'change'] }]
  116. },
  117. typeList: [
  118. { name: '送货到店', val: 1 },
  119. { name: '快递到店', val: 2 }
  120. ]
  121. }
  122. },
  123. computed: {
  124. modalTit () {
  125. const hjName = this.nowData && this.nowData.settleClientName ? this.nowData.settleClientName : ''
  126. return '补货单出库——' + hjName
  127. }
  128. },
  129. methods: {
  130. // 确认出库
  131. handleSave () {
  132. const _this = this
  133. this.$confirm({
  134. title: '提示',
  135. content: '确认信息无误并进行出库吗?',
  136. centered: true,
  137. onOk () {
  138. _this.$emit('ok', 'outWarehousing')
  139. // _this.spinning = true
  140. // storeCallOutOut({ storeCallOutSn: row.storeCallOutSn }).then(res => {
  141. // if (res.status == 200) {
  142. // _this.$message.success(res.message)
  143. // _this.$refs.table.refresh()
  144. // _this.spinning = false
  145. // } else {
  146. // _this.spinning = false
  147. // }
  148. // })
  149. }
  150. })
  151. }
  152. },
  153. watch: {
  154. // 父页面传过来的弹框状态
  155. openModal (newValue, oldValue) {
  156. this.isShow = newValue
  157. },
  158. // 重定义的弹框状态
  159. isShow (newValue, oldValue) {
  160. if (!newValue) {
  161. this.$emit('close')
  162. this.$refs.table.clearTable()
  163. } else {
  164. const _this = this
  165. this.$nextTick(() => { // 页面渲染完成后的回调
  166. _this.$refs.table.refresh(true)
  167. })
  168. }
  169. }
  170. }
  171. }
  172. </script>
  173. <style lang="less">
  174. .replenishmentManagement-outWarehousing-modal {
  175. .btn-cont {
  176. text-align: center;
  177. margin: 35px 0 10px;
  178. }
  179. }
  180. </style>