list.vue 21 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511
  1. <template>
  2. <div>
  3. <a-card size="small" :bordered="false" class="searchBoxNormal">
  4. <!-- 搜索条件 -->
  5. <div ref="tableSearch" class="table-page-search-wrapper">
  6. <a-form layout="inline" @keyup.enter.native="$refs.table.refresh(true)">
  7. <a-row :gutter="15">
  8. <a-col :md="6" :sm="24">
  9. <a-form-item label="创建时间">
  10. <rangeDate ref="rangeDate" :value="time" @change="dateChange" />
  11. </a-form-item>
  12. </a-col>
  13. <a-col :md="6" :sm="24">
  14. <a-form-item label="调往对象">
  15. <a-input id="allocateBillList-targetName" v-model.trim="queryParam.targetName" allowClear placeholder="请输入调往对象"/>
  16. </a-form-item>
  17. </a-col>
  18. <a-col :md="6" :sm="24">
  19. <a-form-item label="费用/调拨类型">
  20. <AllocateType id="allocateBillList-costTypeName" v-model="allocateTypeVal" :changeOnSelect="true" placeholder="请选择费用/调拨类型" @change="changeAllocatype"></AllocateType>
  21. </a-form-item>
  22. </a-col>
  23. <template v-if="advanced">
  24. <a-col :md="6" :sm="24">
  25. <a-form-item label="收货客户名称">
  26. <dealerSearchList ref="receiverSn" @change="custChange" />
  27. </a-form-item>
  28. </a-col>
  29. <a-col :md="6" :sm="24">
  30. <a-form-item label="业务状态">
  31. <v-select
  32. v-model="queryParam.state"
  33. ref="state"
  34. id="allocateBillList-state"
  35. code="ALLOCATE_STATUS"
  36. placeholder="请选择业务状态"
  37. allowClear
  38. ></v-select>
  39. </a-form-item>
  40. </a-col>
  41. <a-col :md="6" :sm="24">
  42. <a-form-item label="调拨单号">
  43. <a-input id="allocateBillList-allocateNo" v-model.trim="queryParam.allocateNo" allowClear placeholder="请输入调拨单号"/>
  44. </a-form-item>
  45. </a-col>
  46. <a-col :md="6" :sm="24">
  47. <a-form-item label="调出仓库">
  48. <warehouse
  49. isPermission
  50. v-model="queryParam.warehouseSn"
  51. id="allocateBillList-warehouseSn"
  52. placeholder="请选择调出仓库"
  53. />
  54. </a-form-item>
  55. </a-col>
  56. <a-col :md="6" :sm="24">
  57. <a-form-item label="打印状态">
  58. <v-select
  59. v-model="queryParam.printState"
  60. ref="printState"
  61. id="allocateBillList-printState"
  62. code="PRINT_STATUS"
  63. placeholder="请选择打印状态"
  64. allowClear
  65. ></v-select>
  66. </a-form-item>
  67. </a-col>
  68. <a-col :md="6" :sm="24">
  69. <a-form-item label="对单状态">
  70. <v-select
  71. v-model="queryParam.checkStatus"
  72. ref="checkStatus"
  73. id="allocateBillList-checkStatus"
  74. code="CHECK_STATUS"
  75. placeholder="请选择对单状态"
  76. allowClear
  77. ></v-select>
  78. </a-form-item>
  79. </a-col>
  80. <a-col :md="6" :sm="24" v-show="isShowCustomerSearch">
  81. <a-form-item label="客服">
  82. <customerService ref="customerName" v-model="queryParam.bizUserSn"></customerService>
  83. </a-form-item>
  84. </a-col>
  85. </template>
  86. <a-col :md="6" :sm="24">
  87. <a-button type="primary" @click="$refs.table.refresh(true)" :disabled="disabled" id="allocateBillList-refresh">查询</a-button>
  88. <a-button style="margin-left: 5px" @click="resetSearchForm" :disabled="disabled" id="allocateBillList-reset">重置</a-button>
  89. <a-button
  90. style="margin-left: 5px"
  91. type="primary"
  92. class="button-warning"
  93. v-if="$hasPermissions('B_transferOut_export')"
  94. @click="handleExport"
  95. :disabled="disabled"
  96. :loading="exportLoading"
  97. id="allocateBillList-export">导出</a-button>
  98. <a @click="advanced=!advanced" style="margin-left: 5px">
  99. {{ advanced ? '收起' : '展开' }}
  100. <a-icon :type="advanced ? 'up' : 'down'"/>
  101. </a>
  102. </a-col>
  103. </a-row>
  104. </a-form>
  105. </div>
  106. </a-card>
  107. <a-card size="small" :bordered="false" style="margin-top:6px;">
  108. <a-spin :spinning="spinning" tip="Loading...">
  109. <!-- 操作按钮 -->
  110. <div class="table-operator">
  111. <a-button v-if="$hasPermissions('B_transferOut_add')" id="allocateBillList-add" type="primary" @click="openModal=true">新增</a-button>
  112. </div>
  113. <!-- 列表 -->
  114. <s-table
  115. class="sTable fixPagination"
  116. ref="table"
  117. :style="{ height: tableHeight+70+'px' }"
  118. size="small"
  119. :rowKey="(record) => record.id"
  120. :columns="columns"
  121. :data="loadData"
  122. :defaultLoadData="false"
  123. :scroll="{ y: tableHeight }"
  124. bordered>
  125. <!-- 单号 -->
  126. <template slot="allocateNo" slot-scope="text, record">
  127. <span v-if="$hasPermissions('M_transferOut_detail')" class="link-bule" @click="handleDetail(record)">{{ record.allocateNo }}</span>
  128. <span v-else>{{ record.allocateNo }}</span>
  129. </template>
  130. <!-- 起止时间 -->
  131. <template slot="promoDate" slot-scope="text, record">
  132. <span v-if="record.promoStartDate || record.promoEndDate">{{ record.promoStartDate }} ~ {{ record.promoEndDate }}</span>
  133. <span v-else>--</span>
  134. </template>
  135. <!-- 调拨类型 -->
  136. <template slot="allocateType" slot-scope="text, record">
  137. <div>
  138. <span v-if="record.allocateSortName">{{ record.allocateSortName }}</span>
  139. <span v-if="record.allocateSortName&&record.allocateTypeName">/</span>
  140. <span v-if="record.allocateTypeName">{{ record.allocateTypeName }}</span>
  141. </div>
  142. </template>
  143. <!-- 打印状态 -->
  144. <template slot="printStateWord" slot-scope="text, record">
  145. <span v-if="record.printState">
  146. <span v-if="record.printState=='NO_PRINT'||record.printState=='PRINT'">{{ record.printStateDictValue }}</span>
  147. <span @click="handlePrint(record)" class="link-bule" v-else>{{ record.printStateDictValue }}</span>
  148. </span>
  149. <span v-else>--</span>
  150. </template>
  151. <!-- 操作 -->
  152. <template slot="action" slot-scope="text, record">
  153. <!-- <a-button
  154. size="small"
  155. type="link"
  156. v-if="record.state == 'WAIT_AUDIT' && record.printState!='UNABLE_PRINT' && record.printState!='NO_PRINT' && $hasPermissions('B_tfo_yxPrint')"
  157. class="button-warning"
  158. @click="handleYxPrint(record)"
  159. id="allocateBillList-examine-btn">允许打印</a-button> -->
  160. <a-button
  161. size="small"
  162. type="link"
  163. v-if="record.state == 'WAIT_AUDIT' && $hasPermissions('B_transferOut_audit')"
  164. class="button-warning"
  165. @click="handleExamine(record)"
  166. id="allocateBillList-examine-btn">审核</a-button>
  167. <a-button
  168. size="small"
  169. type="link"
  170. v-if="((record.state == 'WAIT_SUBMIT') || (record.state == 'WAIT_AUDIT') || (record.state == 'AUDIT_REJECT')) && $hasPermissions('M_transferOut_edit')"
  171. class="button-info"
  172. @click="handleEdit(record)"
  173. id="allocateBillList-edit-btn">编辑</a-button>
  174. <a-button
  175. size="small"
  176. type="link"
  177. v-if="((record.state == 'WAIT_SUBMIT') || (record.state == 'WAIT_AUDIT') || (record.state == 'AUDIT_REJECT')) && $hasPermissions('B_transferOut_del')"
  178. class="button-error"
  179. @click="handleDel(record)"
  180. id="allocateBillList-del-btn">删除</a-button>
  181. <span v-if="((record.state != 'WAIT_SUBMIT') && (record.state != 'WAIT_AUDIT') && (record.state != 'AUDIT_REJECT'))||(!$hasPermissions('B_transferOut_audit') && !$hasPermissions('M_transferOut_edit') && !$hasPermissions('B_transferOut_del'))">--</span>
  182. </template>
  183. </s-table>
  184. </a-spin>
  185. <!-- 新增 -->
  186. <basic-info-modal v-drag :openModal="openModal" @ok="handleOk" @close="openModal=false" />
  187. <!-- 审核 -->
  188. <auditModal
  189. v-drag
  190. :openModal="visibleAudit"
  191. :spinning="spinningAudit"
  192. @close="visibleAudit=false"
  193. @ok="auditOrder('WAIT_OUT_WAREHOUSE')"
  194. @fail="auditOrder('AUDIT_REJECT')" />
  195. <!-- 打印状态 -->
  196. <printModal v-drag :show="printIsShow" :info="printInfo" @cancel="cancelModal"></printModal>
  197. </a-card>
  198. </div>
  199. </template>
  200. <script>
  201. import { commonMixin } from '@/utils/mixin'
  202. import moment from 'moment'
  203. import getDate from '@/libs/getDate.js'
  204. import { STable, VSelect } from '@/components'
  205. import basicInfoModal from './basicInfoModal.vue'
  206. import rangeDate from '@/views/common/rangeDate.vue'
  207. import auditModal from '@/views/common/auditModal.vue'
  208. import warehouse from '@/views/common/chooseWarehouse.js'
  209. import customerService from '@/views/common/customerService'
  210. import dealerSearchList from '@/views/common/dealerSearchList.vue'
  211. import { allocateBillList, allocateBillDel, allocateBillAudit, allocateBillExport, allocateBillAblePrint } from '@/api/allocateBill'
  212. import AllocateType from '@/views/common/allocateType.js'
  213. import { hdExportExcel } from '@/libs/exportExcel'
  214. import printModal from './printStatusModal.vue'
  215. export default {
  216. name: 'TransferOutList',
  217. mixins: [commonMixin],
  218. components: { STable, VSelect, basicInfoModal, printModal, rangeDate, auditModal, AllocateType, dealerSearchList, warehouse, customerService },
  219. data () {
  220. return {
  221. spinning: false,
  222. advanced: true, // 高级搜索 展开/关闭
  223. tableHeight: 0,
  224. time: [
  225. moment(getDate.getThreeMonthDays().starttime, 'YYYY-MM-DD'),
  226. moment(getDate.getCurrMonthDays().endtime, 'YYYY-MM-DD')
  227. ],
  228. allocateTypeVal: [],
  229. queryParam: { // 查询条件
  230. beginDate: getDate.getThreeMonthDays().starttime,
  231. endDate: getDate.getCurrMonthDays().endtime,
  232. targetName: '', // 调往对象
  233. costTypeSn: undefined, // 费用类型
  234. allocateSortSn: undefined, // 调拨类型1
  235. allocateTypeSn: undefined, // 调拨类型2
  236. state: undefined, // 业务状态
  237. allocateNo: '', // 调拨单号
  238. receiverSn: undefined,
  239. checkStatus: undefined,
  240. printState: undefined,
  241. warehouseSn: undefined,
  242. bizUserSn: undefined
  243. },
  244. disabled: false, // 查询、重置按钮是否可操作
  245. exportLoading: false,
  246. printIsShow: false,
  247. // 加载数据方法 必须为 Promise 对象
  248. loadData: parameter => {
  249. this.disabled = true
  250. this.spinning = true
  251. return allocateBillList(Object.assign(parameter, this.queryParam, { authWarehouseFlag: 1 })).then(res => {
  252. let data
  253. if (res.status == 200) {
  254. data = res.data
  255. const no = (data.pageNo - 1) * data.pageSize
  256. for (var i = 0; i < data.list.length; i++) {
  257. data.list[i].no = no + i + 1
  258. }
  259. this.disabled = false
  260. }
  261. this.spinning = false
  262. return data
  263. })
  264. },
  265. visibleAudit: false,
  266. auditInfo: null,
  267. spinningAudit: false,
  268. openModal: false, // 新增编辑 弹框
  269. printInfo: null
  270. }
  271. },
  272. computed: {
  273. // dataIndex: 'printStateDictValue',
  274. columns () {
  275. const _this = this
  276. const arr = [
  277. { title: '序号', dataIndex: 'no', width: '3.5%', align: 'center' },
  278. { title: '创建时间', dataIndex: 'createDate', width: '6%', align: 'center', customRender: function (text) { return text || '--' } },
  279. { title: '调拨单号', scopedSlots: { customRender: 'allocateNo' }, align: 'center', width: '10%' },
  280. { title: '起止时间', scopedSlots: { customRender: 'promoDate' }, align: 'center', width: '6%' },
  281. { title: '调往对象', dataIndex: 'targetName', width: '9%', align: 'left', customRender: function (text) { return text || '--' } },
  282. { title: '客户类型', dataIndex: 'dealerLevelDictValue', width: '6%', align: 'center', customRender: function (text) { return text || '--' } },
  283. { title: '发货编号', dataIndex: 'sendNo', width: '6%', align: 'center', customRender: function (text) { return text || '--' } },
  284. { title: '发货说明', dataIndex: 'explainInfo', width: '9%', align: 'center', customRender: function (text) { return text || '--' }, ellipsis: true },
  285. { title: '收货客户名称', dataIndex: 'receiverName', width: '9%', align: 'left', customRender: function (text) { return text || '--' } },
  286. { title: '总数量', dataIndex: 'totalQty', width: '5%', align: 'center', customRender: function (text) { return ((text || text == 0) ? text : '--') } },
  287. { title: '审核时间', dataIndex: 'auditTime', width: '6%', align: 'center', customRender: function (text) { return text || '--' } },
  288. { title: '费用类型', dataIndex: 'costTypeName', width: '6%', align: 'center', customRender: function (text) { return text || '--' } },
  289. { title: '调拨类型', scopedSlots: { customRender: 'allocateType' }, width: '6%', align: 'center' },
  290. { title: '调出仓库', dataIndex: 'warehouseName', width: '6%', align: 'center', customRender: function (text) { return text || '--' } },
  291. { title: '业务状态', dataIndex: 'stateDictValue', width: '6%', align: 'center', customRender: function (text) { return text || '--' } },
  292. { title: '打印状态', scopedSlots: { customRender: 'printStateWord' }, width: '6%', align: 'center' },
  293. { title: '打印次数', dataIndex: 'printCount', width: '6%', align: 'center', customRender: function (text) { return ((text || text == 0) ? text : '--') } },
  294. { title: '对单状态', dataIndex: 'checkStatusDictValue', width: '6%', align: 'center', customRender: function (text) { return text || '--' } },
  295. { title: '操作', scopedSlots: { customRender: 'action' }, width: '8%', align: 'center' }
  296. ]
  297. if (this.$hasPermissions('M_transferOutList_costPrice')) { // 成本价权限
  298. arr.splice(9, 0, { title: '总成本', dataIndex: 'totalCost', width: '6%', align: 'right', customRender: function (text) { return ((text || text == 0) ? _this.toThousands(text) : '--') } })
  299. }
  300. if (this.$hasPermissions('M_transferOutList_salesPrice')) { // 售价权限
  301. const ind = this.$hasPermissions('M_transferOutList_costPrice') ? 10 : 9
  302. arr.splice(ind, 0, { title: '总售价', dataIndex: 'totalPrice', width: '6%', align: 'right', customRender: function (text) { return ((text || text == 0) ? _this.toThousands(text) : '--') } })
  303. }
  304. return arr
  305. }
  306. },
  307. methods: {
  308. // 关闭打印状态弹窗
  309. cancelModal () {
  310. this.printIsShow = false
  311. this.$refs.table.refresh(true)
  312. },
  313. custChange (val) {
  314. if (val.row) {
  315. this.queryParam.receiverSn = val.row.dealerSn
  316. this.queryParam.receiverName = undefined
  317. } else {
  318. this.queryParam.receiverSn = undefined
  319. this.queryParam.receiverName = val.key
  320. }
  321. },
  322. // 创建时间 change
  323. dateChange (date) {
  324. this.queryParam.beginDate = date[0]
  325. this.queryParam.endDate = date[1]
  326. },
  327. changeAllocatype (val, opts) {
  328. this.allocateTypeVal = val || []
  329. this.queryParam.costTypeSn = val && val[0] ? val[0] : ''
  330. this.queryParam.allocateSortSn = val && val[1] ? val[1] : ''
  331. this.queryParam.allocateTypeSn = val && val[2] ? val[2] : ''
  332. },
  333. // 重置
  334. resetSearchForm () {
  335. this.$refs.rangeDate.resetDate(this.time)
  336. this.queryParam.beginDate = getDate.getThreeMonthDays().starttime
  337. this.queryParam.endDate = getDate.getCurrMonthDays().endtime
  338. this.queryParam.targetName = ''
  339. this.queryParam.costTypeSn = undefined
  340. this.queryParam.allocateSortSn = undefined
  341. this.queryParam.allocateTypeSn = undefined
  342. this.queryParam.state = undefined
  343. this.queryParam.checkStatus = undefined
  344. this.queryParam.printState = undefined
  345. this.queryParam.allocateNo = ''
  346. this.queryParam.receiverName = ''
  347. this.queryParam.receiverSn = undefined
  348. this.queryParam.warehouseSn = undefined
  349. this.queryParam.bizUserSn = undefined
  350. this.allocateTypeVal = []
  351. this.$refs.receiverSn.resetForm()
  352. this.$refs.table.refresh(true)
  353. },
  354. // 基本信息 保存
  355. handleOk (data) {
  356. this.$router.push({ path: `/allocationManagement/transferOut/add/${data.allocateSn}/${data.dealerLevel}` })
  357. },
  358. // 删除
  359. handleDel (row) {
  360. const _this = this
  361. this.$confirm({
  362. title: '提示',
  363. content: '删除后不可恢复,确定要进行删除吗?',
  364. centered: true,
  365. onOk () {
  366. _this.spinning = true
  367. allocateBillDel({ sn: row.allocateSn }).then(res => {
  368. if (res.status == 200) {
  369. _this.$message.success(res.message)
  370. _this.$refs.table.refresh()
  371. _this.spinning = false
  372. } else {
  373. _this.spinning = false
  374. }
  375. })
  376. }
  377. })
  378. },
  379. // 允许打印
  380. handleYxPrint (row) {
  381. const _this = this
  382. this.$confirm({
  383. title: '提示',
  384. content: '确定要允许打印吗?',
  385. centered: true,
  386. onOk () {
  387. _this.spinning = true
  388. allocateBillAblePrint({ sn: row.allocateSn }).then(res => {
  389. if (res.status == 200) {
  390. _this.$message.success(res.message)
  391. _this.$refs.table.refresh()
  392. _this.spinning = false
  393. } else {
  394. _this.spinning = false
  395. }
  396. })
  397. }
  398. })
  399. },
  400. // 审核
  401. handleExamine (row) {
  402. this.auditInfo = row
  403. this.visibleAudit = true
  404. },
  405. // 审核
  406. auditOrder (state) {
  407. const _this = this
  408. _this.spinningAudit = true
  409. allocateBillAudit({ sn: this.auditInfo.allocateSn, state: state }).then(res => {
  410. if (res.status == 200) {
  411. _this.visibleAudit = false
  412. _this.$message.success(res.message)
  413. _this.$refs.table.refresh()
  414. _this.spinningAudit = false
  415. } else {
  416. _this.visibleAudit = false
  417. _this.spinningAudit = false
  418. }
  419. })
  420. },
  421. // 详情
  422. handleDetail (row) {
  423. if (this.$hasPermissions('M_transferOut_detail')) {
  424. this.$router.push({ path: `/allocationManagement/transferOut/detail/${row.allocateSn}` })
  425. }
  426. },
  427. // 编辑
  428. handleEdit (row) {
  429. this.$router.push({ path: `/allocationManagement/transferOut/edit/${row.allocateSn}/${row.dealerLevel}` })
  430. },
  431. // 导出
  432. handleExport () {
  433. const _this = this
  434. this.$store.state.app.curActionPermission = 'B_transferOut_export'
  435. const params = this.queryParam
  436. this.exportLoading = true
  437. this.spinning = true
  438. hdExportExcel(allocateBillExport, params, '调拨列表', function () {
  439. _this.exportLoading = false
  440. _this.spinning = false
  441. _this.$store.state.app.curActionPermission = ''
  442. })
  443. },
  444. pageInit () {
  445. const _this = this
  446. this.$nextTick(() => { // 页面渲染完成后的回调
  447. _this.setTableH()
  448. })
  449. this.openModal = false
  450. },
  451. setTableH () {
  452. const tableSearchH = this.$refs.tableSearch.offsetHeight
  453. this.tableHeight = window.innerHeight - tableSearchH - 240
  454. },
  455. handlePrint (item) {
  456. const obj = {
  457. no: item.allocateNo,
  458. targetName: item.targetName,
  459. allocateSn: item.allocateSn,
  460. printState: item.printState
  461. }
  462. this.printInfo = obj
  463. this.$nextTick(() => {
  464. this.printIsShow = true
  465. })
  466. }
  467. },
  468. watch: {
  469. advanced (newValue, oldValue) {
  470. const _this = this
  471. this.$nextTick(() => { // 页面渲染完成后的回调
  472. _this.setTableH()
  473. })
  474. },
  475. '$store.state.app.winHeight' (newValue, oldValue) { // 窗口变更时,需同时更改表格高度
  476. this.setTableH()
  477. }
  478. },
  479. mounted () {
  480. if (!this.$store.state.app.isNewTab) { // 页签刷新时调用
  481. this.pageInit()
  482. this.resetSearchForm()
  483. }
  484. },
  485. activated () {
  486. // 如果是新页签打开,则重置当前页面
  487. if (this.$store.state.app.isNewTab) {
  488. this.pageInit()
  489. this.resetSearchForm()
  490. }
  491. // 仅刷新列表,不重置页面
  492. if (this.$store.state.app.updateList) {
  493. this.pageInit()
  494. this.$refs.table.refresh()
  495. }
  496. },
  497. beforeRouteEnter (to, from, next) {
  498. next(vm => {})
  499. }
  500. }
  501. </script>
  502. <style lang="less">
  503. .active{
  504. color: #ed1c24;
  505. cursor: pointer;
  506. }
  507. .common{
  508. color: rgba(0, 0, 0);
  509. }
  510. </style>