index.vue 10.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325
  1. <template>
  2. <template-page v-if="pageShow" ref="pageRef" :get-list="getList" :table-attributes="tableAttributes"
  3. :table-events="tableEvents" :options-evens-group="optionsEvensGroup" :moreParameters="moreParameters"
  4. :column-parsing="columnParsing" :exportList="exportList" :operation="operation()" key="pageType">
  5. <div slot="moreSearch">
  6. <el-radio-group v-model="pageType" size="mini" @change="changePageType">
  7. <el-radio-button label="list">列表</el-radio-button>
  8. <el-radio-button label="goodsder">商品明细</el-radio-button>
  9. <el-radio-button label="codeder">条码明细</el-radio-button>
  10. </el-radio-group>
  11. <br /><br />
  12. </div>
  13. <div class="cartographer_big">
  14. <el-dialog :title="formDialogTitles[formDialogType]" width="100%" :modal="false" :visible.sync="formDialog"
  15. :before-close="handleClose">
  16. <zj-page-container>
  17. <zj-page-fill>
  18. <div style="box-sizing: border-box; padding: 20px 20px 0 20px">
  19. <zj-form-container ref="formRef" :form-data="formData" :form-attributes="{ size: 'mini' }">
  20. <zj-form-module title="单据信息" label-width="100px" :form-data="formData" :form-items="formItems">
  21. </zj-form-module>
  22. <zj-form-module title="" label-width="100px" :form-data="formData" :form-items="formItems2">
  23. <el-tabs slot="header" v-model="activeName">
  24. <el-tab-pane label="商品信息" name="goodsInfo"></el-tab-pane>
  25. <el-tab-pane v-if="formDialogType > 0 && joinCode" label="条码信息" name="codeInfo"></el-tab-pane>
  26. </el-tabs>
  27. </zj-form-module>
  28. </zj-form-container>
  29. </div>
  30. </zj-page-fill>
  31. <div v-if="activeName == 'goodsInfo'" style="text-align: right; box-sizing: border-box; padding: 16px 20px">
  32. <el-button v-if="formDialogType == 0" size="mini" type="primary" @click="save">保存</el-button>
  33. <el-button v-if="formDialogType == 1" size="mini" type="primary" @click="submit">提交</el-button>
  34. <el-button v-if="formDialogType == 3" size="mini" type="primary" @click="examine">审核通过</el-button>
  35. </div>
  36. </zj-page-container>
  37. </el-dialog>
  38. </div>
  39. </template-page>
  40. </template>
  41. <script>
  42. import TemplatePage from '@/components/template/template-page-1.vue'
  43. import import_mixin from '@/components/template/import_mixin.js'
  44. import operation_mixin from '@/components/template/operation_mixin.js'
  45. import {
  46. goodsPurchaseRetList,
  47. goodsPurchaseRetListExport,
  48. goodsPurchaseRetItemList,
  49. goodsPurchaseRetItemListExport,
  50. goodsPurchaseRetCodeList,
  51. goodsPurchaseRetCodeListExport,
  52. goodsPurchaseRetAdd,
  53. goodsPurchaseRetSubmit,
  54. goodsPurchaseRetConfirm,
  55. goodsPurchaseRetDetail,
  56. goodsPurchaseRetDel
  57. } from '@/api/merchandisePurchaseReturn.js'
  58. import form_ty from '../mixins/common_form'
  59. import out_storage_table from '../mixins/out_storage_table'
  60. import out_storage_goods from '../mixins/out_storage_goods'
  61. import out_storage_codes from '../mixins/out_storage_codes'
  62. import common from '../mixins/common_code'
  63. export default {
  64. components: { TemplatePage },
  65. mixins: [import_mixin, operation_mixin, form_ty, out_storage_table, out_storage_goods, out_storage_codes, common],
  66. data() {
  67. return {
  68. pageType: 'list',
  69. pageShow: true,
  70. // 表格属性
  71. tableAttributes: {
  72. // 启用勾选列
  73. selectColumn: false
  74. },
  75. // 表格事件
  76. tableEvents: {
  77. 'selection-change': this.selectionChange
  78. },
  79. // 勾选选中行
  80. recordSelected: [],
  81. /** 表单变量 */
  82. formDialogType: 0,
  83. formDialogTitles: ['新增退货单', '编辑退货单', '退货单详情', '审核退货单'],
  84. formDialog: false,
  85. appraise_status: '',
  86. formData: {
  87. companyWechatId: '',
  88. companyWechatName: '',
  89. examineBy: '',
  90. examineTime: '',
  91. fileUrl: [],
  92. goodsPurchaseId: '',
  93. items: [],
  94. remark: '',
  95. status: '',
  96. submitBy: '',
  97. submitTime: '',
  98. totalAmount: '',
  99. totalQty: '',
  100. venderId: '',
  101. venderName: '',
  102. codeInfoList: []
  103. },
  104. activeName: 'goodsInfo',
  105. goods_material_id: '',
  106. joinCode: false
  107. }
  108. },
  109. computed: {
  110. // 事件组合
  111. optionsEvensGroup() {
  112. if (this.pageType == 'list') {
  113. return [
  114. [
  115. [
  116. this.optionsEvensAuth('add', {
  117. click: () => {
  118. this.formDialog = true
  119. this.openForm()
  120. }
  121. })
  122. ]
  123. ]
  124. ]
  125. } else if (this.pageType == 'goodsder') {
  126. return []
  127. } else if (this.pageType == 'codeder') {
  128. return []
  129. }
  130. },
  131. // 更多参数
  132. moreParameters() {
  133. return []
  134. }
  135. },
  136. watch: {
  137. pageType() {
  138. this.handleClose()
  139. this.pageShow = false
  140. this.$nextTick(() => {
  141. this.pageShow = true
  142. })
  143. }
  144. },
  145. methods: {
  146. changePageType() {
  147. this.goods_material_id = ''
  148. },
  149. // 列表请求函数
  150. getList(p, cb) {
  151. if (this.pageType == 'list') {
  152. return goodsPurchaseRetList(p)
  153. } else if (this.pageType == 'goodsder') {
  154. return goodsPurchaseRetItemList(p)
  155. } else if (this.pageType == 'codeder') {
  156. if (this.goods_material_id) {
  157. return goodsPurchaseRetCodeList({
  158. ...p,
  159. params: [...p.params, { param: 'b.goods_material_id', compare: '=', value: this.goods_material_id }]
  160. })
  161. } else {
  162. return goodsPurchaseRetCodeList(p)
  163. }
  164. }
  165. },
  166. // 列表导出函数
  167. exportList(...p) {
  168. if (this.pageType == 'list') {
  169. return goodsPurchaseRetListExport(...p)
  170. } else if (this.pageType == 'goodsder') {
  171. return goodsPurchaseRetItemListExport(...p)
  172. } else if (this.pageType == 'codeder') {
  173. return goodsPurchaseRetCodeListExport(...p)
  174. }
  175. },
  176. // 表格列解析渲染数据更改
  177. columnParsing(item, defaultData) {
  178. return defaultData
  179. },
  180. // 监听勾选变化
  181. selectionChange(data) {
  182. this.recordSelected = data
  183. },
  184. // 打开创建弹窗
  185. openForm() {
  186. this.getGysList()
  187. this.getCgrkOrder()
  188. },
  189. // 打开详情弹窗
  190. openDetailForm(row, type) {
  191. goodsPurchaseRetDetail({ id: row.id }).then(res => {
  192. Object.assign(this.formData, res.data, {
  193. fileUrl: res.data.fileUrl ? [{ url: res.data.fileUrl }] : [],
  194. items: res.data.items.map(item => ({ ...item, details: {} }))
  195. })
  196. this.formDialogType = type
  197. this.openForm()
  198. this.formDialog = true
  199. })
  200. },
  201. handleClose() {
  202. this.$refs?.formRef?.resetFields()
  203. this.$data.formData = this.$options.data().formData
  204. this.formDialog = false
  205. this.formDialogType = 0
  206. this.activeName = 'goodsInfo'
  207. this.joinCode = false
  208. },
  209. // 操作按钮
  210. operation() {
  211. if (this.pageType == 'list') {
  212. return this.operationBtn({
  213. edit: {
  214. conditions: ({ row, index, column }) => {
  215. return row.status == 'SAVE'
  216. },
  217. click: ({ row, index, column }) => {
  218. this.openDetailForm(row, 1)
  219. }
  220. },
  221. del: {
  222. prompt: '是否确定删除',
  223. conditions: ({ row, index, column }) => {
  224. return row.status == 'SAVE'
  225. },
  226. click: ({ row, index, column }) => {
  227. goodsPurchaseRetDel({
  228. id: row.id
  229. }).then(res => {
  230. this.$message({
  231. type: 'success',
  232. message: '删除成功'
  233. })
  234. this.$refs.pageRef.refreshList()
  235. })
  236. }
  237. },
  238. detail: {
  239. click: ({ row, index, column }) => {
  240. this.openDetailForm(row, 2)
  241. }
  242. },
  243. shenhe: {
  244. conditions: ({ row, index, column }) => {
  245. return row.status == 'WAIT'
  246. },
  247. click: ({ row, index, column }) => {
  248. this.openDetailForm(row, 3)
  249. }
  250. }
  251. })
  252. } else if (this.pageType == 'goodsder') {
  253. return this.operationBtn({
  254. codeDetail: {
  255. click: ({ row, index, column }) => {
  256. this.goods_material_id = row.goodsMaterialId
  257. this.pageType = 'codeder'
  258. }
  259. }
  260. })
  261. } else if (this.pageType == 'codeder') {
  262. return undefined
  263. }
  264. },
  265. // 保存
  266. save() {
  267. this.$refs.formRef.validate((valid, invalidFields, errLabels) => {
  268. if (valid) {
  269. goodsPurchaseRetAdd({
  270. ...this.formData,
  271. items: this.formData.items.map((item, index) => ({ ...item, index: index + 1 })),
  272. fileUrl: this.formData.fileUrl.map(item => item.url).join(','),
  273. codeInfoList: undefined
  274. }).then(res => {
  275. this.$message({
  276. type: 'success',
  277. message: '保存成功'
  278. })
  279. this.handleClose()
  280. this.$refs.pageRef.refreshList()
  281. })
  282. }
  283. })
  284. },
  285. // 提交
  286. submit() {
  287. goodsPurchaseRetSubmit({
  288. id: this.formData.id
  289. }).then(res => {
  290. this.$message({
  291. type: 'success',
  292. message: '提交成功'
  293. })
  294. this.handleClose()
  295. this.$refs.pageRef.refreshList()
  296. })
  297. },
  298. // 审核
  299. examine() {
  300. goodsPurchaseRetConfirm({
  301. id: this.formData.id,
  302. statusEnum: 'OK'
  303. }).then(res => {
  304. this.$message({
  305. type: 'success',
  306. message: '审核成功'
  307. })
  308. this.handleClose()
  309. this.$refs.pageRef.refreshList()
  310. })
  311. }
  312. }
  313. }
  314. </script>
  315. <style lang="scss" scoped>
  316. .tab {
  317. padding: 20px 20px 0 20px;
  318. }
  319. ::v-deep .teshudeshangchuananniu {
  320. color: #409eff !important;
  321. }
  322. </style>