approve.vue 8.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291
  1. <!-- 订单 -->
  2. <template>
  3. <div class="order">
  4. <el-form :inline="true" :model="dataForm" @keyup.enter.native="queryData()">
  5. <el-form-item label="业务类型">
  6. <el-select
  7. v-model="dataForm.businessType"
  8. placeholder="请选择">
  9. <el-option
  10. v-for="item in optionsType"
  11. :key="item.code"
  12. :label="item.value"
  13. :value="item.code">
  14. </el-option>
  15. </el-select>
  16. </el-form-item>
  17. <el-form-item label="状态">
  18. <el-select
  19. v-model="dataForm.state"
  20. placeholder="请选择">
  21. <el-option
  22. v-for="item in optionsState"
  23. :key="item.code"
  24. :label="item.value"
  25. :value="item.code">
  26. </el-option>
  27. </el-select>
  28. </el-form-item>
  29. <el-form-item label="申请日期">
  30. <el-date-picker
  31. v-model="dataForm.createTime"
  32. value-format="yyyy-MM-dd"
  33. type="date">
  34. </el-date-picker>
  35. </el-form-item>
  36. <el-form-item>
  37. <el-button @click="queryData()">查询</el-button>
  38. </el-form-item>
  39. </el-form>
  40. <el-table
  41. :data="dataList"
  42. border
  43. v-loading="dataListLoading"
  44. @selection-change="selectionChangeHandle"
  45. style="width: 100%;">
  46. <el-table-column
  47. label="序号"
  48. type="index"
  49. width="50"
  50. align="center">
  51. </el-table-column>
  52. <el-table-column
  53. prop="businessTypeName"
  54. header-align="center"
  55. align="center"
  56. min-width="180"
  57. label="流程类别">
  58. </el-table-column>
  59. <el-table-column
  60. prop="createTime"
  61. header-align="center"
  62. align="center"
  63. min-width="140"
  64. :show-overflow-tooltip="true"
  65. label="申请时间">
  66. </el-table-column>
  67. <el-table-column
  68. prop="updateTime"
  69. header-align="center"
  70. align="center"
  71. min-width="140"
  72. label="更新时间">
  73. </el-table-column>
  74. <el-table-column
  75. prop="state"
  76. header-align="center"
  77. align="center"
  78. min-width="100"
  79. label="状态">
  80. <template slot-scope="scope">
  81. <span>{{ optionsState[Number(scope.row.state) + 1].value }}</span>
  82. </template>
  83. </el-table-column>
  84. <el-table-column
  85. prop="creatorName"
  86. header-align="center"
  87. align="center"
  88. min-width="120"
  89. label="申请人">
  90. </el-table-column>
  91. <el-table-column
  92. prop="orgName"
  93. header-align="center"
  94. align="center"
  95. label="申请部门">
  96. </el-table-column>
  97. <el-table-column
  98. prop="completeDate"
  99. header-align="center"
  100. align="center"
  101. min-width="150"
  102. label="处理意见">
  103. </el-table-column>
  104. <el-table-column
  105. header-align="center"
  106. align="center"
  107. width="80"
  108. label="操作">
  109. <template slot-scope="scope">
  110. <el-button v-if="Number(scope.row.state) !== 3 && checkUser(scope.row)" type="text" size="small" @click="addOrUpdateHandle(scope.row.businessType, scope.row.businessId)">处理</el-button>
  111. <el-button v-else type="text" size="small" @click="detailHandle(scope.row.businessType, scope.row.businessId)">查看</el-button>
  112. </template>
  113. </el-table-column>
  114. </el-table>
  115. <el-pagination
  116. @size-change="sizeChangeHandle"
  117. @current-change="currentChangeHandle"
  118. :current-page="pageIndex"
  119. :page-sizes="[10, 20, 50, 100]"
  120. :page-size="pageSize"
  121. :total="totalPage"
  122. layout="total, sizes, prev, pager, next, jumper">
  123. </el-pagination>
  124. <!-- 弹窗, 新增 / 修改 -->
  125. <add-or-update v-if="addOrUpdateVisible" ref="addOrUpdate" @refreshDataList="getApprovalList"/>
  126. </div>
  127. </template>
  128. <script>
  129. import AddOrUpdate from './approve-add-or-update'
  130. import { getApprovalList } from '@/api/msg'
  131. import { getCusList } from '@/api/cus'
  132. import { checkStr } from '@/api/util'
  133. export default {
  134. name: 'order',
  135. components: {
  136. // Detail,
  137. AddOrUpdate
  138. },
  139. created () {
  140. this.queryData()
  141. },
  142. data () {
  143. return {
  144. addOrUpdateVisible: false,
  145. dataForm: {},
  146. dataList: [],
  147. pageIndex: 1,
  148. pageSize: 10,
  149. totalPage: 0,
  150. dataListLoading: false,
  151. dataListSelections: [],
  152. optionsState: [
  153. {
  154. code: null, value: '全部'
  155. },
  156. {
  157. code: '0', value: '待提交'
  158. },
  159. {
  160. code: '1', value: '待审批'
  161. },
  162. {
  163. code: '2', value: '审批中'
  164. },
  165. {
  166. code: '3', value: '审批完成'
  167. },
  168. {
  169. code: '4', value: '审批不通过'
  170. }
  171. ],
  172. optionsType: [
  173. {
  174. code: null, value: '全部'
  175. },
  176. {
  177. code: 'warehouse_flow_in', value: '入库申请'
  178. },
  179. {
  180. code: 'warehouse_flow_out', value: '出库申请'
  181. },
  182. {
  183. code: 'contract_review', value: '合同评审'
  184. },
  185. {
  186. code: 'sale_order_flow', value: '订单评审'
  187. },
  188. {
  189. code: 'sale_purchase_flow', value: '采购申请'
  190. },
  191. {
  192. code: 'wh_template_record_flow', value: '模板出库'
  193. },
  194. {
  195. code: 'pro_technology_flow', value: '工艺'
  196. },
  197. {
  198. code: 'pro_product_flow', value: '产品'
  199. },
  200. {
  201. code: 'wh_inventory_record_flow', value: '盘点'
  202. }
  203. ],
  204. optionsCustomer: []
  205. }
  206. },
  207. methods: {
  208. // 查询
  209. queryData () {
  210. this.pageIndex = 1
  211. this.getApprovalList()
  212. },
  213. // 获取数据列表
  214. getApprovalList () {
  215. this.dataListLoading = true
  216. let params = {
  217. 'current': this.pageIndex,
  218. 'size': this.pageSize,
  219. 'createTime': this.dataForm.createTime ? this.dataForm.createTime : null,
  220. 'state': this.dataForm.state ? this.dataForm.state : null,
  221. 'businessType': this.dataForm.businessType ? this.dataForm.businessType : null
  222. }
  223. getApprovalList(params).then(({data}) => {
  224. if (data && data.code === '200') {
  225. this.dataList = data.data.records
  226. this.totalPage = Number(data.data.total)
  227. } else {
  228. this.dataList = []
  229. this.totalPage = 0
  230. }
  231. this.dataListLoading = false
  232. })
  233. },
  234. // 每页数
  235. sizeChangeHandle (val) {
  236. this.pageSize = val
  237. this.pageIndex = 1
  238. this.getApprovalList()
  239. },
  240. // 当前页
  241. currentChangeHandle (val) {
  242. this.pageIndex = val
  243. this.getApprovalList()
  244. },
  245. // 多选
  246. selectionChangeHandle (val) {
  247. this.dataListSelections = val
  248. },
  249. // 远程方法:获取客户列表
  250. async remoteCustomer (query) {
  251. if (!query) {
  252. query = ''
  253. }
  254. await getCusList({'customerName': query}).then(({data}) => {
  255. if (data && data.code === '200') {
  256. this.optionsCustomer = []
  257. data.data.records.forEach((item) => {
  258. this.optionsCustomer.push({
  259. code: item.customerId,
  260. value: item.customerName
  261. })
  262. })
  263. }
  264. })
  265. },
  266. checkUser (row) {
  267. let currentUser = this.$store.state.user.name
  268. return checkStr(currentUser, row.approver)
  269. },
  270. // 新增 / 修改
  271. addOrUpdateHandle (businessType, businessId) {
  272. this.addOrUpdateVisible = true
  273. this.$nextTick(() => {
  274. this.$refs.addOrUpdate.init(businessType, businessId)
  275. })
  276. },
  277. // 详情
  278. detailHandle (businessType, businessId) {
  279. this.addOrUpdateVisible = true
  280. this.$nextTick(() => {
  281. this.$refs.addOrUpdate.init(businessType, businessId, true)
  282. })
  283. }
  284. }
  285. }
  286. </script>
  287. <style scoped>
  288. </style>