engin_list.vue 19 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628
  1. <template>
  2. <template-page
  3. ref="pageRef"
  4. :getList="getList"
  5. :operation="operation()"
  6. :optionsEvensGroup="optionsEvensGroup"
  7. :exportList="exportList"
  8. :columnParsing="columnParsing"
  9. :tableAttributes="tableAttributes"
  10. :tableEvents="tableEvents"
  11. :operationColumnWidth="200"
  12. :replaceOrNotMap="false"
  13. >
  14. <ExamineDialog :is-show.sync="isShowExamineDialog" :examine-form.sync="examineForm" @submit="submitExamineForm"/>
  15. <Popu v-if="isShowDetail || isShowForm || isShowExamine || isShowReturnForm">
  16. <EnginDetail v-if="isShowDetail" ref="refDetail" :list-item="queryItem" @backListFormDetail="backList" />
  17. <EnginExamine v-if="isShowExamine" :list-item="queryItem" @backListFormDetail="backList" />
  18. <EnginForm v-if="isShowForm" :list-item="queryItem" @backListFormDetail="backList" />
  19. <EnginReturnForm v-if="isShowReturnForm" :isShow="isShow" :list-item="queryItem" @backListFormDetail="backList" />
  20. </Popu>
  21. </template-page>
  22. </template>
  23. <script>
  24. import TemplatePage from '@/components/template/template-page-1.vue'
  25. import Popu from '@/components/template/popu.vue'
  26. import { invoiceListProjectV2, invoiceListProjectV2Export } from '@/api/supply/deliver'
  27. import { getEnginList, submitEngin, deleteEngin, abandonEngin, examineBatchEngin } from '@/api/supply/apply'
  28. import { getCategoryList, getSalesmanList } from '@/api/common'
  29. import EnginDetail from '@/views/supply/apply/components/engin_detail'
  30. import EnginExamine from '@/views/supply/apply/components/engin_examine'
  31. import EnginForm from '@/views/supply/apply/components/engin_form'
  32. import EnginReturnForm from '@/views/supply/apply/components/engin_return_form'
  33. import ExamineDialog from '@/components/Common/examine-dialog'
  34. let that
  35. export default {
  36. components: {
  37. EnginDetail,
  38. EnginExamine,
  39. EnginForm,
  40. EnginReturnForm,
  41. ExamineDialog,
  42. TemplatePage,
  43. Popu
  44. },
  45. filters: {
  46. statusFilter(val) {
  47. const obj = that.statusList.find(o => o.value == val)
  48. return obj ? obj.label : ''
  49. },
  50. orderTypeFilter(val) {
  51. const obj = that.orderTypeList.find(o => o.value == val)
  52. return obj ? obj.label : ''
  53. }
  54. },
  55. data() {
  56. return {
  57. // 事件组合
  58. optionsEvensGroup: [
  59. [
  60. [
  61. {
  62. name: '发货申请',
  63. click: () => {
  64. this.toForm()
  65. },
  66. isRole: this.$checkBtnRole('add', this.$route.meta.roles)
  67. }
  68. ]
  69. ],
  70. [
  71. [
  72. {
  73. name: '退货申请',
  74. click: () => {
  75. this.toReturnForm()
  76. },
  77. isRole: this.$checkBtnRole('refund', this.$route.meta.roles)
  78. }
  79. ]
  80. ],
  81. [
  82. [
  83. {
  84. name: '批量审批',
  85. click: async () => {
  86. if (this.recordSelected.length === 0) {
  87. this.$message.error('请选择需要批量审批的数据')
  88. return
  89. }
  90. this.batchExamine()
  91. },
  92. isRole: this.$checkBtnRole('examine', this.$route.meta.roles)
  93. }
  94. ]
  95. ]
  96. ],
  97. // 表格属性
  98. tableAttributes: {
  99. // 启用勾选列
  100. selectColumn: true
  101. },
  102. // 表格事件
  103. tableEvents: {
  104. 'selection-change': this.selectionChange
  105. },
  106. recordSelected: [],
  107. currentPage: 1, // 当前页码
  108. pageSize: 10, // 每页数量
  109. listTotal: 0, // 列表总数
  110. dataList: null, // 列表数据
  111. listLoading: false, // 列表加载loading
  112. screenForm: {
  113. // 筛选表单数据
  114. status: '',
  115. orderNum: '',
  116. warehouse: '',
  117. jxsNum: '',
  118. jxsName: '',
  119. date: [],
  120. chName: '',
  121. model: '',
  122. salesMan: '',
  123. orderType: '',
  124. mainOrderId: '',
  125. refEnginRecordNo: '',
  126. refUseUnit: '',
  127. k3ServiceId: '',
  128. categoryId: '',
  129. approvalName: '',
  130. refRegionWork: '',
  131. automaticStatus: '',
  132. createBy: ''
  133. },
  134. statusList: [
  135. { label: '已保存', value: 'SAVE' },
  136. { label: '待审核', value: 'WAIT' },
  137. { label: '审核通过', value: 'OK' },
  138. { label: '审核驳回', value: 'FAIL' },
  139. { label: '已关闭', value: 'CLOSE' }
  140. ],
  141. orderTypeList: [
  142. { label: '发货申请单', value: 1 },
  143. { label: '退货申请单', value: 2 },
  144. { label: '直调发货单', value: 3 }
  145. ],
  146. salesmanList: [],
  147. queryItem: {},
  148. isShowDetail: false,
  149. isShowExamine: false,
  150. isShowForm: false,
  151. isShowReturnForm: false,
  152. selectRow: [],
  153. multipleSelection: [],
  154. isShowExamineDialog: false,
  155. examineForm: {
  156. status: '',
  157. remark: ''
  158. },
  159. isShow: false,
  160. categoryList: [],
  161. isCustomer: JSON.parse(localStorage.getItem('supply_user')).isCustomer
  162. }
  163. },
  164. computed: {
  165. exParams() {
  166. return {
  167. id: this.screenForm.orderNum,
  168. correspondName: this.screenForm.warehouse,
  169. customerNumber: this.screenForm.jxsNum,
  170. customerName: this.screenForm.jxsName,
  171. productName: this.screenForm.chName,
  172. specification: this.screenForm.model,
  173. automaticStatus: this.screenForm.automaticStatus,
  174. startTime: this.screenForm.date ? this.screenForm.date[0] : '',
  175. endTime: this.screenForm.date ? this.screenForm.date[1] : '',
  176. examineStatus: this.screenForm.status,
  177. serviceId: this.screenForm.salesMan,
  178. k3ServiceId: this.screenForm.k3ServiceId,
  179. type: this.screenForm.orderType,
  180. mainOrderId: this.screenForm.mainOrderId,
  181. createBy: this.screenForm.createBy,
  182. refEnginRecordNo: this.screenForm.refEnginRecordNo,
  183. refUseUnit: this.screenForm.refUseUnit,
  184. categoryId: this.screenForm.categoryId,
  185. approvalName: this.screenForm.approvalName,
  186. refRegionWork: this.screenForm.refRegionWork
  187. }
  188. }
  189. },
  190. watch: {
  191. multipleSelection(data) {
  192. // 监听选中状态
  193. this.selectRow = []
  194. if (data.length > 0) {
  195. data.forEach((item, index) => {
  196. this.selectRow.push(item.id)
  197. })
  198. }
  199. }
  200. },
  201. beforeCreate() {
  202. that = this
  203. },
  204. created() {
  205. // this.getSalesmanList()
  206. // this.getList()
  207. // this.getCategoryList()
  208. // this.isShow = false
  209. // if (this.$route.query && this.$route.query.isShow) {
  210. // this.isShow = this.$route.query.isShow
  211. // this.toReturnForm()
  212. // }
  213. },
  214. // activated() {
  215. // // keepAlice activated 主要是从发货单汇总调用退货申请按钮
  216. // this.isShow = false
  217. // if(this.$route.query && this.$route.query.isShow){
  218. // this.isShow = this.$route.query.isShow
  219. // this.toReturnForm()
  220. // }
  221. // },
  222. methods: {
  223. // 列表请求函数
  224. getList(...p) {
  225. let params = {
  226. ...p[0]
  227. }
  228. return invoiceListProjectV2(params)
  229. },
  230. // 列表导出函数
  231. exportList: invoiceListProjectV2Export,
  232. // 表格列解析渲染数据更改
  233. columnParsing(item, defaultData) {
  234. return defaultData
  235. },
  236. // 监听勾选变化
  237. selectionChange(data) {
  238. this.recordSelected = data
  239. },
  240. fieldBeansHook(val) {
  241. if (this.isCustomer !== '') {
  242. let res = val.filter(
  243. v => v.jname !== 'refPowerCategory' && v.jname !== 'geLiInerNote' && v.jname !== 'geLiNote'
  244. )
  245. return res
  246. } else {
  247. return val
  248. }
  249. },
  250. operation() {
  251. return (h, { row, index, column }) => {
  252. return (
  253. <div class="operation-btns">
  254. {this.$checkBtnRole('apply', this.$route.meta.roles) &&
  255. ((!this.isCustomer &&
  256. !row.automaticStatus &&
  257. (row.examineStatus === 'SAVE' || row.examineStatus === 'FAIL')) ||
  258. (this.isCustomer &&
  259. !row.automaticStatus &&
  260. (row.examineStatus === 'SAVE' || row.examineStatus === 'FAIL') &&
  261. row.type != 2) ||
  262. (!this.isCustomer &&
  263. row.automaticStatus &&
  264. (row.examineStatus === 'SAVE' || row.examineStatus === 'FAIL') &&
  265. row.type === 2)) ? (
  266. <el-popconfirm
  267. onOnConfirm={async () => {
  268. this.handleSubmit(row.id, 'WAIT')
  269. }}
  270. title="是否确定需要申请该项内容?"
  271. >
  272. <el-button slot="reference" size="mini" type="text">
  273. 申请
  274. </el-button>
  275. </el-popconfirm>
  276. ) : (
  277. ''
  278. )}
  279. {this.$checkBtnRole('apply', this.$route.meta.roles) &&
  280. ((!this.isCustomer && !row.automaticStatus && row.examineStatus === 'WAIT') ||
  281. (this.isCustomer && !row.automaticStatus && row.examineStatus === 'WAIT' && row.type != 2) ||
  282. (!this.isCustomer && row.automaticStatus && row.examineStatus === 'WAIT' && row.type == 2)) ? (
  283. <el-popconfirm
  284. onOnConfirm={async () => {
  285. this.handleSubmit(row.id, 'SAVE')
  286. }}
  287. title="是否确定需要撤回该项内容?"
  288. >
  289. <el-button slot="reference" size="mini" type="text">
  290. 撤回
  291. </el-button>
  292. </el-popconfirm>
  293. ) : (
  294. ''
  295. )}
  296. {this.$checkBtnRole('examine', this.$route.meta.roles) &&
  297. ((!this.isCustomer && !row.automaticStatus && row.examineStatus === 'OK') ||
  298. (this.isCustomer && !row.automaticStatus && row.examineStatus === 'OK' && row.type != 2) ||
  299. (!this.isCustomer && row.automaticStatus && row.examineStatus === 'OK' && row.type == 2)) ? (
  300. <el-popconfirm
  301. onOnConfirm={async () => {
  302. this.handleAbandon(row.id)
  303. }}
  304. title="是否确定需要弃审该项内容?"
  305. >
  306. <el-button slot="reference" size="mini" type="text">
  307. 弃审
  308. </el-button>
  309. </el-popconfirm>
  310. ) : (
  311. ''
  312. )}
  313. {this.$checkBtnRole('edit', this.$route.meta.roles) &&
  314. !row.automaticStatus &&
  315. (row.examineStatus === 'SAVE' || row.examineStatus === 'FAIL') &&
  316. row.type === 1 ? (
  317. <el-button
  318. size="mini"
  319. type="text"
  320. onClick={async () => {
  321. this.toForm(row)
  322. }}
  323. >
  324. 编辑
  325. </el-button>
  326. ) : (
  327. ''
  328. )}
  329. {this.$checkBtnRole('edit', this.$route.meta.roles) &&
  330. ((!this.isCustomer &&
  331. !row.automaticStatus &&
  332. (row.examineStatus === 'SAVE' || row.examineStatus === 'FAIL') &&
  333. row.type === 2) ||
  334. (this.isCustomer &&
  335. !row.automaticStatus &&
  336. (row.examineStatus === 'SAVE' || row.examineStatus === 'FAIL') &&
  337. row.type != 2 &&
  338. row.type !== 1) ||
  339. (!this.isCustomer &&
  340. row.automaticStatus &&
  341. (row.examineStatus === 'SAVE' || row.examineStatus === 'FAIL') &&
  342. row.type === 2)) ? (
  343. <el-button
  344. size="mini"
  345. type="text"
  346. onClick={async () => {
  347. this.toReturnForm(row)
  348. }}
  349. >
  350. 编辑
  351. </el-button>
  352. ) : (
  353. ''
  354. )}
  355. {this.$checkBtnRole('examine', this.$route.meta.roles) &&
  356. ((!this.isCustomer && !row.automaticStatus && row.examineStatus === 'WAIT') ||
  357. (this.isCustomer && !row.automaticStatus && row.examineStatus === 'WAIT' && row.type != 2) ||
  358. (!this.isCustomer && row.automaticStatus && row.examineStatus === 'WAIT' && row.type == 2)) ? (
  359. <el-button
  360. size="mini"
  361. type="text"
  362. onClick={async () => {
  363. this.toExamine(row)
  364. }}
  365. >
  366. 审核
  367. </el-button>
  368. ) : (
  369. ''
  370. )}
  371. <el-button
  372. size="mini"
  373. type="text"
  374. onClick={async () => {
  375. this.toDetail(row)
  376. }}
  377. >
  378. 详情
  379. </el-button>
  380. {this.$checkBtnRole('del', this.$route.meta.roles) &&
  381. ((!this.isCustomer && !row.automaticStatus && row.examineStatus !== 'OK') ||
  382. (this.isCustomer && !row.automaticStatus && row.examineStatus !== 'OK' && row.type != 2) ||
  383. (!this.isCustomer && row.automaticStatus && row.examineStatus !== 'OK' && scope.row.type == 2)) ? (
  384. <el-popconfirm
  385. onOnConfirm={async () => {
  386. this.handleDelete(row.id)
  387. }}
  388. title="是否确定需要删除该项内容?"
  389. >
  390. <el-button slot="reference" size="mini" type="text">
  391. 删除
  392. </el-button>
  393. </el-popconfirm>
  394. ) : (
  395. ''
  396. )}
  397. </div>
  398. )
  399. }
  400. },
  401. // 获取业务员列表
  402. getSalesmanList() {
  403. getSalesmanList({
  404. pageNum: 1,
  405. pageSize: -1,
  406. isCustomer: 0,
  407. status: true
  408. }).then(res => {
  409. this.salesmanList = res.data.records
  410. })
  411. },
  412. // 查询列表
  413. // getList() {
  414. // this.listLoading = true
  415. // const params = {
  416. // pageNum: this.currentPage,
  417. // pageSize: this.pageSize,
  418. // id: this.screenForm.orderNum,
  419. // correspondName: this.screenForm.warehouse,
  420. // customerNumber: this.screenForm.jxsNum,
  421. // customerName: this.screenForm.jxsName,
  422. // productName: this.screenForm.chName,
  423. // specification: this.screenForm.model,
  424. // startTime: this.screenForm.date ? this.screenForm.date[0] : '',
  425. // endTime: this.screenForm.date ? this.screenForm.date[1] : '',
  426. // examineStatus: this.screenForm.status,
  427. // createBy: this.screenForm.createBy,
  428. // automaticStatus: this.screenForm.automaticStatus,
  429. // serviceId: this.screenForm.salesMan,
  430. // k3ServiceId: this.screenForm.k3ServiceId,
  431. // type: this.screenForm.orderType,
  432. // mainOrderId: this.screenForm.mainOrderId,
  433. // refEnginRecordNo: this.screenForm.refEnginRecordNo,
  434. // refUseUnit: this.screenForm.refUseUnit,
  435. // categoryId: this.screenForm.categoryId,
  436. // approvalName: this.screenForm.approvalName,
  437. // refRegionWork: this.screenForm.refRegionWork
  438. // }
  439. // getEnginList(params).then(res => {
  440. // res.data.records.forEach(item => {
  441. // item.sums1 = ['refundableQty']
  442. // item.sums2 = ['singlePayPrice', 'payAmount', 'payRebateAmount', 'totalDiscAmount']
  443. // })
  444. // this.dataList = res.data.records
  445. // this.listTotal = res.data.total
  446. // this.listLoading = false
  447. // })
  448. // },
  449. // 提交筛选表单
  450. submitScreenForm() {
  451. this.currentPage = 1
  452. this.getList()
  453. },
  454. // 重置筛选表单
  455. resetScreenForm() {
  456. this.$refs.screenForm.resetFields()
  457. this.currentPage = 1
  458. this.getList()
  459. },
  460. // 更改每页数量
  461. handleSizeChange(val) {
  462. this.pageSize = val
  463. this.currentPage = 1
  464. this.getList()
  465. },
  466. // 更改当前页
  467. handleCurrentChange(val) {
  468. this.currentPage = val
  469. this.getList()
  470. },
  471. // 进入表单
  472. toForm(item) {
  473. this.queryItem = item
  474. this.isShowForm = true
  475. },
  476. // 进入表单
  477. toReturnForm(item) {
  478. this.queryItem = item
  479. this.isShowReturnForm = true
  480. },
  481. // 进入审批
  482. toExamine(item) {
  483. this.queryItem = item
  484. this.isShowExamine = true
  485. },
  486. // 进入详情
  487. toDetail(item) {
  488. this.queryItem = item
  489. this.isShowDetail = true
  490. this.$nextTick(() => {
  491. this.$refs.refDetail.initPrint()
  492. })
  493. },
  494. backList() {
  495. this.queryItem = {}
  496. this.isShowDetail = false
  497. this.isShowExamine = false
  498. this.isShowForm = false
  499. this.isShowReturnForm = false
  500. this.$refs.pageRef.refreshList()
  501. },
  502. handleDelete(id) {
  503. deleteEngin({ id }).then(res => {
  504. this.$successMsg()
  505. // this.getList()
  506. this.$refs.pageRef.refreshList()
  507. })
  508. },
  509. // 申请/撤回
  510. handleSubmit(id, examineStatus) {
  511. submitEngin({ id, examineStatus }).then(res => {
  512. this.$successMsg()
  513. // this.getList()
  514. this.$refs.pageRef.refreshList()
  515. })
  516. },
  517. // 弃审
  518. handleAbandon(id) {
  519. abandonEngin({ id }).then(res => {
  520. this.$successMsg()
  521. // this.getList()
  522. this.$refs.pageRef.refreshList()
  523. })
  524. },
  525. handleSelectionChange(val) {
  526. this.multipleSelection = val
  527. if (val) {
  528. this.selections = val
  529. } else {
  530. this.selections = []
  531. }
  532. },
  533. rowClass({ row, rowIndex }) {
  534. if (this.selectRow.includes(row.id)) {
  535. return { 'background-color': '#ecf5ff' }
  536. }
  537. },
  538. // 打开 批量审批
  539. batchExamine() {
  540. this.isShowExamineDialog = true
  541. },
  542. // 提交 批量审批
  543. submitExamineForm() {
  544. let ids = this.recordSelected.map(item => {
  545. return item.id
  546. })
  547. ids = Array.from(new Set(ids))
  548. examineBatchEngin({
  549. ids: ids.join(','),
  550. examineStatus: this.examineForm.status === 'FAIL' ? 'SAVE' : 'OK',
  551. approvalRemark: this.examineForm.remark
  552. }).then(res => {
  553. this.isShowExamineDialog = false
  554. // this.getList()
  555. this.$refs.pageRef.refreshList()
  556. this.$successMsg('审批成功')
  557. })
  558. },
  559. // 获取存货类别列表
  560. getCategoryList() {
  561. getCategoryList({
  562. pageNum: 1,
  563. pageSize: -1
  564. }).then(res => {
  565. this.categoryList = res.data.records
  566. })
  567. },
  568. /**
  569. * 根据条件禁用行复选框
  570. * 函数返回值为false则禁用选择(反之亦然)
  571. * @param {Object} row - 行数据
  572. * @param {String} index - 索引值
  573. * @return Boolean
  574. */
  575. selectable: function (row, index) {
  576. if (row.automaticStatus) {
  577. return false
  578. }
  579. return true
  580. // 函数必须有返回值且是布尔值
  581. // 页面刷新后该函数会执行 N 次进行判断(N 为表格行数)
  582. // 如果没有返回值则默认返回false(全部无法选中)
  583. }
  584. }
  585. }
  586. </script>
  587. <style lang="scss" scoped></style>