list.vue 8.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226
  1. <template>
  2. <a-card size="small" :bordered="false" class="intelligentReplenishmentList-wrap">
  3. <a-spin :spinning="spinning" tip="Loading...">
  4. <!-- 操作按钮 -->
  5. <div ref="tableSearch" class="table-operator">
  6. <a-button v-if="$hasPermissions('B_intelligentReplenishment_add')" id="intelligentReplenishmentList-add" type="primary" class="button-error" @click="handleEdit()">新增</a-button>
  7. <a-button v-if="$hasPermissions('B_intelligentReplenishment_set')" id="intelligentReplenishmentList-set" type="primary" class="button-warning" @click="handleSet">基础信息设置</a-button>
  8. </div>
  9. <a-alert type="info" style="margin-bottom:10px">
  10. <div slot="message">为保证系统性能,仅保留最近10次的预测结果</div>
  11. </a-alert>
  12. <!-- 列表 -->
  13. <s-table
  14. class="sTable fixPagination"
  15. ref="table"
  16. :style="{ height: tableHeight+84.5+'px' }"
  17. size="small"
  18. :rowKey="(record) => record.id"
  19. :columns="columns"
  20. :data="loadData"
  21. :scroll="{ y: tableHeight }"
  22. :showPagination="false"
  23. :defaultLoadData="false"
  24. bordered>
  25. <!-- 操作 -->
  26. <template slot="action" slot-scope="text, record">
  27. <a-button
  28. size="small"
  29. type="link"
  30. class="button-info"
  31. v-if="record.state == 'WAIT' && $hasPermissions('B_intelligentReplenishment_edit')"
  32. @click="handleEdit(record)"
  33. id="intelligentReplenishmentList-edit-btn">编辑</a-button>
  34. <a-button
  35. size="small"
  36. type="link"
  37. class="button-error"
  38. v-if="record.state == 'WAIT' && $hasPermissions('B_intelligentReplenishment_del')"
  39. @click="handleDel(record)"
  40. id="intelligentReplenishmentList-del-btn">删除</a-button>
  41. <a-button
  42. size="small"
  43. type="link"
  44. class="button-success"
  45. v-if="record.state != 'WAIT' && $hasPermissions('B_intelligentReplenishment_detail')"
  46. @click="handleDetail(record)"
  47. id="customerManagementList-detail-btn">详情</a-button>
  48. <a-button
  49. size="small"
  50. type="link"
  51. class="button-warning"
  52. v-if="record.state == 'FINISH' && $hasPermissions('B_intelligentReplenishment_down')"
  53. @click="handleDownload(record)"
  54. id="chainTransferInList-download-btn">结果下载</a-button>
  55. <span v-if="!(record.state == 'WAIT' && $hasPermissions('B_intelligentReplenishment_edit'))&&!(record.state == 'WAIT' && $hasPermissions('B_intelligentReplenishment_del'))&&!(record.state != 'WAIT' && $hasPermissions('B_intelligentReplenishment_detail'))&&!(record.state == 'FINISH' && $hasPermissions('B_intelligentReplenishment_down'))">--</span>
  56. </template>
  57. </s-table>
  58. </a-spin>
  59. <!-- 详情 -->
  60. <intelligent-replenishment-detail-modal v-drag :openModal="openDetailModal" :itemSn="itemSn" @close="closeModal" />
  61. </a-card>
  62. </template>
  63. <script>
  64. import { commonMixin } from '@/utils/mixin'
  65. import moment from 'moment'
  66. import { STable, VSelect } from '@/components'
  67. import intelligentReplenishmentDetailModal from './detailModal.vue'
  68. import { predictList, predictSave, predictDel, predictstockPredictExport } from '@/api/predict'
  69. export default {
  70. name: 'IntelligentReplenishmentList',
  71. mixins: [commonMixin],
  72. components: { STable, VSelect, intelligentReplenishmentDetailModal },
  73. data () {
  74. return {
  75. spinning: false,
  76. tableHeight: 0,
  77. columns: [
  78. { title: '序号', dataIndex: 'no', width: '5%', align: 'center' },
  79. { title: '创建时间', dataIndex: 'createDate', width: '15%', align: 'center', customRender: function (text) { return text || '--' } },
  80. { title: '创建人', dataIndex: 'creatorName', width: '45%', align: 'center', customRender: function (text) { return text || '--' } },
  81. { title: '状态', dataIndex: 'stateDictValue', width: '15%', align: 'center', customRender: function (text) { return text || '--' } },
  82. { title: '操作', scopedSlots: { customRender: 'action' }, width: '20%', align: 'center' }
  83. ],
  84. // 加载数据方法 必须为 Promise 对象
  85. loadData: parameter => {
  86. this.spinning = true
  87. return predictList({}).then(res => {
  88. let data
  89. if (res.status == 200) {
  90. data = res.data
  91. for (var i = 0; i < data.length; i++) {
  92. data[i].no = i + 1
  93. }
  94. }
  95. this.spinning = false
  96. return data
  97. })
  98. },
  99. itemSn: '', // 当前sn
  100. openDetailModal: false
  101. }
  102. },
  103. methods: {
  104. // 新增/编辑
  105. handleEdit (row) {
  106. if (row) { // 编辑
  107. this.$router.push({ path: `/inventoryManagement/intelligentReplenishment/edit/${row.stockPredictSn}` })
  108. } else { // 新增
  109. this.spinning = true
  110. predictSave({}).then(res => {
  111. this.spinning = false
  112. if (res.status == 200) {
  113. this.$router.push({ path: `/inventoryManagement/intelligentReplenishment/add/${res.data.stockPredictSn}` })
  114. }
  115. })
  116. }
  117. },
  118. // 详情
  119. handleDetail (row) {
  120. this.itemSn = row ? row.stockPredictSn : null
  121. this.openDetailModal = true
  122. },
  123. // 设置
  124. handleSet () {
  125. this.$router.push({ path: `/inventoryManagement/intelligentReplenishment/set` })
  126. },
  127. // 删除
  128. handleDel (row) {
  129. const _this = this
  130. this.$confirm({
  131. title: '提示',
  132. content: '删除后不可恢复,确定要进行删除吗?',
  133. centered: true,
  134. onOk () {
  135. _this.spinning = true
  136. predictDel({ sn: row.stockPredictSn }).then(res => {
  137. if (res.status == 200) {
  138. _this.$message.success(res.message)
  139. _this.$refs.table.refresh()
  140. _this.spinning = false
  141. } else {
  142. _this.spinning = false
  143. }
  144. })
  145. }
  146. })
  147. },
  148. // 关闭弹框
  149. closeModal () {
  150. this.itemSn = ''
  151. this.openDetailModal = false
  152. this.$refs.table.refresh(true)
  153. },
  154. // 结果下载
  155. handleDownload (row) {
  156. const _this = this
  157. _this.spinning = true
  158. predictstockPredictExport({ sn: row.stockPredictSn }).then(res => {
  159. _this.spinning = false
  160. if (res.type == 'application/json') {
  161. var reader = new FileReader()
  162. reader.addEventListener('loadend', function () {
  163. const obj = JSON.parse(reader.result)
  164. _this.$notification.error({
  165. message: '提示',
  166. description: obj.message
  167. })
  168. })
  169. reader.readAsText(res)
  170. } else {
  171. this.download(res)
  172. }
  173. })
  174. },
  175. download (data) {
  176. if (!data) { return }
  177. const url = window.URL.createObjectURL(new Blob([data]))
  178. const link = document.createElement('a')
  179. link.style.display = 'none'
  180. link.href = url
  181. const a = moment().format('YYYYMMDDHHmmss')
  182. const fname = '智能补货' + a
  183. link.setAttribute('download', fname + '.xlsx')
  184. document.body.appendChild(link)
  185. link.click()
  186. },
  187. pageInit () {
  188. const _this = this
  189. this.$nextTick(() => { // 页面渲染完成后的回调
  190. _this.setTableH()
  191. })
  192. },
  193. setTableH () {
  194. const tableSearchH = this.$refs.tableSearch.offsetHeight
  195. this.tableHeight = window.innerHeight - tableSearchH - 233
  196. }
  197. },
  198. watch: {
  199. '$store.state.app.winHeight' (newValue, oldValue) { // 窗口变更时,需同时更改表格高度
  200. this.setTableH()
  201. }
  202. },
  203. mounted () {
  204. if (!this.$store.state.app.isNewTab) { // 页签刷新时调用
  205. this.pageInit()
  206. this.$refs.table.refresh(true)
  207. }
  208. },
  209. activated () {
  210. // 如果是新页签打开,则重置当前页面
  211. if (this.$store.state.app.isNewTab) {
  212. this.pageInit()
  213. this.$refs.table.refresh(true)
  214. }
  215. // 仅刷新列表,不重置页面
  216. if (this.$store.state.app.updateList) {
  217. this.pageInit()
  218. this.$refs.table.refresh()
  219. }
  220. },
  221. beforeRouteEnter (to, from, next) {
  222. next(vm => {})
  223. }
  224. }
  225. </script>