add.vue 3.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156
  1. <template>
  2. <view class="bg-f9 warehouse-add">
  3. <header-bar :title="submitType === 'add' ? '添加物料' : '修改物料'"></header-bar>
  4. <view class="example">
  5. <!-- 基础用法,不包含校验规则 -->
  6. <uni-forms label-position="top" :modelValue="form" ref="form" :rules="rules">
  7. <uni-forms-item label="物料分类" required name="classifyId">
  8. <uni-data-picker v-model="form.classifyId" :map="{text:'label',value:'id'}" :localdata="treeData"
  9. popup-title="请选择物料" @change="treeChange">
  10. </uni-data-picker>
  11. </uni-forms-item>
  12. <uni-forms-item label="物料类型" required name="type">
  13. <uni-data-select v-model="form.type" :localdata="types"></uni-data-select>
  14. </uni-forms-item>
  15. <uni-forms-item label="物料编码">
  16. <uni-easyinput v-model="form.code" placeholder="请输入,不输入则系统自动生成" />
  17. </uni-forms-item>
  18. <uni-forms-item label="单位" required name="unit">
  19. <uni-easyinput v-model="form.unit" placeholder="请输入" />
  20. </uni-forms-item>
  21. <uni-forms-item label="物料名称" required name="name">
  22. <uni-easyinput v-model="form.name" placeholder="请输入" />
  23. </uni-forms-item>
  24. <uni-forms-item label="物料说明" name="introduce">
  25. <uni-easyinput type="textarea" v-model="form.introduce" placeholder="请输入自我介绍" />
  26. </uni-forms-item>
  27. </uni-forms>
  28. <button class="submit" @click="submitForm">提交</button>
  29. </view>
  30. </view>
  31. </template>
  32. <script>
  33. import headerBar from '../../../components/header-bar/index.vue'
  34. import Vue from 'vue'
  35. export default {
  36. components: {
  37. headerBar
  38. },
  39. data() {
  40. return {
  41. form: {
  42. name: '',
  43. type: null,
  44. classifyId: null,
  45. code: null,
  46. unit: null,
  47. introduce: null,
  48. },
  49. types:[{
  50. text: '原料',
  51. value: '1'
  52. }, {
  53. text: '辅料',
  54. value: '2'
  55. }, {
  56. text: '配件',
  57. value: '3'
  58. }, {
  59. text: '包材',
  60. value: '4'
  61. }, {
  62. text: '其他',
  63. value: '5'
  64. }],
  65. rules: {
  66. // 对name字段进行必填验证
  67. name: {
  68. rules: [{
  69. required: true,
  70. errorMessage: '请输入产品名称',
  71. }, ]
  72. },
  73. // 对email字段进行必填验证
  74. type: {
  75. rules: [{
  76. required: true,
  77. errorMessage: '请选择产品类型',
  78. }, ]
  79. },
  80. unit: {
  81. rules: [{
  82. required: true,
  83. errorMessage: '请输入产品单位',
  84. }, ]
  85. },
  86. classifyId: {
  87. rules: [{
  88. required: true,
  89. errorMessage: '请选择产品分类',
  90. }, ]
  91. },
  92. },
  93. submitType: 'add',
  94. treeData: [],
  95. }
  96. },
  97. onLoad(e) {
  98. if (e.id) {
  99. this.form.id = e.id
  100. this.form.remarks = e.remarks
  101. this.form.type = e.type
  102. this.form.name = e.name
  103. this.submitType = 'edit'
  104. }
  105. this.getTree()
  106. },
  107. methods: {
  108. treeChange() {},
  109. getTree() {
  110. const v = this
  111. v.$post('/api/basics//classify/tree', {
  112. type: 2
  113. }).then(res => {
  114. if (res.code === 200) {
  115. v.treeData = res.data
  116. }
  117. })
  118. },
  119. submitForm() {
  120. const v = this
  121. this.$refs.form.validate().then(res => {
  122. uni.showLoading({
  123. title: '加载中'
  124. });
  125. v.$post('/api/basics/material/' + this.submitType, v.form).then(res => {
  126. if (res.code === 200) {
  127. uni.showToast({
  128. title: this.submitType == 'add' ? '添加成功' : '修改成功',
  129. duration: 1000,
  130. icon: 'success'
  131. })
  132. }
  133. uni.hideLoading()
  134. let pages = getCurrentPages(); // 获取页面栈
  135. let prePage = pages[pages.length - 2]; //获取上一页
  136. prePage.$vm.needRefresh = true; // 需要刷新
  137. setTimeout(() => {
  138. uni.navigateBack(1)
  139. }, 1000)
  140. })
  141. }).catch(err => {
  142. console.log('表单错误信息:', err);
  143. })
  144. },
  145. },
  146. }
  147. </script>
  148. <style lang="less">
  149. .warehouse-add {}
  150. </style>