setModal.vue 6.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195
  1. <template>
  2. <div>
  3. <a-modal
  4. centered
  5. wrapClassName="setModal-modal"
  6. :footer="null"
  7. :maskClosable="false"
  8. :title="textTitle"
  9. v-model="isshow"
  10. @cancle="isshow=false"
  11. :width="500">
  12. <a-spin :spinning="spinning" tip="Loading...">
  13. <a-form-model
  14. id="setModal-form"
  15. ref="ruleForm"
  16. :model="form"
  17. :rules="rules"
  18. >
  19. <div style="margin-bottom: 10px;text-align: center;">
  20. <strong>近{{ form&&form.day_limit||'' }}天下单额</strong>
  21. </div>
  22. <a-form-model-item label="LV1" prop="LV1" :label-col="{span: 4}" :wrapper-col="{span: 18}">
  23. <a-input-number style="width:80%;" v-model.trim="form.LV1" :precision="2" allowClear placeholder="请输入LV1下单额"/>
  24. 元以下
  25. </a-form-model-item>
  26. <a-form-model-item label="LV2" prop="LV2" :label-col="{span: 4}" :wrapper-col="{span: 18}">
  27. <a-input-group style="width: 90%;" compact>
  28. <a-input style="width: 43%; text-align: center;pointer-events: none; backgroundColor: #f8f8f8;color:#666;" disabled v-model.trim="form.LV1"/>
  29. <a-input
  30. style=" width: 12%; pointer-events: none; backgroundColor: #fff"
  31. placeholder="至"
  32. disabled
  33. />
  34. <a-input-number
  35. :precision="2"
  36. :min="form.LV1"
  37. style="width: 43%; text-align: center"
  38. v-model.trim="form.LV2"
  39. allowClear
  40. placeholder="请输入LV2下单额"/>
  41. </a-input-group>
  42. </a-form-model-item>
  43. <a-form-model-item label="LV3" prop="LV3" :label-col="{span: 4}" :wrapper-col="{span: 18}">
  44. <a-input-group style="width: 90%;" compact>
  45. <a-input style=" width: 43%; text-align: center;pointer-events: none; backgroundColor: #f8f8f8;color:#666;" disabled v-model.trim="form.LV2"/>
  46. <a-input
  47. style=" width: 12%; pointer-events: none; backgroundColor: #fff"
  48. placeholder="至"
  49. disabled
  50. />
  51. <a-input-number
  52. :precision="2"
  53. :min="form.LV2"
  54. style=" width: 43%; text-align: center"
  55. v-model.trim="form.LV3"
  56. allowClear
  57. placeholder="请输入LV3下单额"/>
  58. </a-input-group>
  59. </a-form-model-item>
  60. <a-form-model-item label="LV4" prop="LV4" :label-col="{span: 4}" :wrapper-col="{span: 18}">
  61. <a-input-group style="width: 90%;" compact>
  62. <a-input style=" width: 43%; text-align: center;pointer-events: none; backgroundColor: #f8f8f8;color:#666;" disabled v-model.trim="form.LV3"/>
  63. <a-input
  64. style=" width: 12%; pointer-events: none; backgroundColor: #fff"
  65. placeholder="至"
  66. disabled
  67. />
  68. <a-input-number
  69. :precision="2"
  70. :min="form.LV3"
  71. style=" width: 43%; text-align: center"
  72. v-model.trim="form.LV4"
  73. allowClear
  74. placeholder="请输入LV4下单额"/>
  75. </a-input-group>
  76. </a-form-model-item>
  77. <a-form-model-item label="LV5" :label-col="{span: 4}" :wrapper-col="{span: 18}">
  78. <a-input style="width: 80%; text-align: center;pointer-events: none; backgroundColor: #f8f8f8;color:#666;" disabled v-model.trim="form.LV4"/>
  79. 元以上
  80. </a-form-model-item>
  81. <a-form-model-item :label-col="{span: 0}" :wrapper-col="{span: 24}" style="text-align: center;">
  82. <a-button type="primary" @click="handleSubmit()" :style="{ marginRight: '8px' }" id="setModal-handleSubmit">保存</a-button>
  83. <a-button :style="{ marginLeft: '8px' }" @click="isshow=false" id="setModal-close">取消</a-button>
  84. </a-form-model-item>
  85. </a-form-model>
  86. </a-spin>
  87. </a-modal>
  88. </div>
  89. </template>
  90. <script>
  91. import { queryStoreLevelParamMap, saveStoreLevelParam } from '@/api/report.js'
  92. export default {
  93. name: 'AddHWModal',
  94. props: {
  95. openModal: {
  96. type: Boolean,
  97. default: false
  98. },
  99. shelfSn: {
  100. type: [String, Number],
  101. default: ''
  102. },
  103. nowData: {
  104. type: Object,
  105. default: function () {
  106. return {}
  107. }
  108. }
  109. },
  110. data () {
  111. return {
  112. spinning: false,
  113. isshow: this.openModal,
  114. textTitle: '参数设置',
  115. roleList: [],
  116. pageInfo: null,
  117. form: {
  118. LV1: '',
  119. LV2: '',
  120. LV3: '',
  121. lv4: '',
  122. LV5: '',
  123. day_limit: '30'
  124. },
  125. rules: {
  126. LV1: [{ required: true, message: '请输入LV1下单金额', trigger: 'blur' }],
  127. LV2: [{ required: true, message: '请输入LV2下单金额', trigger: 'blur' }],
  128. LV3: [{ required: true, message: '请输入LV3下单金额', trigger: 'blur' }],
  129. LV4: [{ required: true, message: '请输入LV4下单金额', trigger: 'blur' }]
  130. }
  131. }
  132. },
  133. methods: {
  134. // 查询货位详情
  135. getDetail () {
  136. this.spinning = true
  137. queryStoreLevelParamMap().then(res => {
  138. if (res.status == 200) {
  139. this.form = Object.assign({}, res.data)
  140. for (const key in this.form) {
  141. this.form[key] = Number(this.form[key])
  142. }
  143. }
  144. this.spinning = false
  145. })
  146. },
  147. // 保存提交
  148. handleSubmit () {
  149. const _this = this
  150. this.$refs.ruleForm.validate(valid => {
  151. if (valid) {
  152. _this.spinning = true
  153. saveStoreLevelParam(_this.form).then(res => {
  154. if (res.status == 200) {
  155. _this.$message.success(res.message)
  156. _this.$emit('ok')
  157. setTimeout(function () {
  158. _this.isshow = false
  159. _this.spinning = false
  160. }, 300)
  161. } else {
  162. _this.spinning = false
  163. }
  164. })
  165. } else {
  166. console.log('error submit!!')
  167. return false
  168. }
  169. })
  170. }
  171. },
  172. watch: {
  173. openModal (newValue, oldValue) {
  174. this.isshow = newValue
  175. },
  176. isshow (newValue, oldValue) {
  177. if (!newValue) {
  178. this.$refs.ruleForm.resetFields()
  179. this.form = {}
  180. this.$emit('close')
  181. } else {
  182. this.getDetail()
  183. }
  184. }
  185. }
  186. }
  187. </script>
  188. <style lang="less">
  189. </style>