fabricLossesSummary.vue 13 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378
  1. <template>
  2. <!-- 【单证】 面料损耗汇总 -->
  3. <div id="costAllocationTotal">
  4. <!-- 查询区域 -->
  5. <a-card :bordered="false">
  6. <div class="table-page-search-wrapper">
  7. <a-form layout="inline" @keyup.enter.native="searchQuery">
  8. <a-row :gutter="24">
  9. <a-col :md="6" :sm="8">
  10. <a-form-item label="制单人">
  11. <a-input placeholder="请输入" v-model="queryParam.makingPeople"></a-input>
  12. </a-form-item>
  13. </a-col>
  14. <a-col :md="6" :sm="8">
  15. <a-form-item label="审核人">
  16. <a-input placeholder="请输入" v-model="queryParam.approvalMan"></a-input>
  17. </a-form-item>
  18. </a-col>
  19. <a-col :md="6" :sm="8">
  20. <a-form-item label="计划单号">
  21. <a-input placeholder="请输入" v-model="queryParam.cCode"></a-input>
  22. </a-form-item>
  23. </a-col>
  24. <template v-if="toggleSearchStatus">
  25. <a-col :md="6" :sm="8">
  26. <a-form-item label="保存日期" has-feedback>
  27. <a-range-picker
  28. :placeholder="['开始时间', '结束时间']"
  29. format="YYYY-MM-DD"
  30. style="width: 100%"
  31. v-model="createTime"
  32. @change="changeCreateTime"
  33. />
  34. <!-- <a-date-picker style="width: 100%" v-model="queryParam.createTime" @change="onChange" :format="dateFormat"> </a-date-picker> -->
  35. </a-form-item>
  36. </a-col>
  37. <a-col :md="6" :sm="8">
  38. <a-form-item label="审核日期" has-feedback>
  39. <a-range-picker
  40. :placeholder="['开始时间', '结束时间']"
  41. format="YYYY-MM-DD"
  42. style="width: 100%"
  43. v-model="approvalDate"
  44. @change="changeApprovalDate"
  45. />
  46. <!-- <a-date-picker style="width: 100%" v-model="queryParam.approvalDate" @change="onChange" :format="dateFormat"> </a-date-picker> -->
  47. </a-form-item>
  48. </a-col>
  49. <a-col :md="6" :sm="8">
  50. <a-form-item label="款号">
  51. <a-input placeholder="请输入" v-model="queryParam.cDefine22"></a-input>
  52. </a-form-item>
  53. </a-col>
  54. <a-col :md="6" :sm="8">
  55. <a-form-item label="计划员">
  56. <a-input placeholder="请输入" v-model="queryParam.planner"></a-input>
  57. </a-form-item>
  58. </a-col>
  59. <a-col :md="6" :sm="8">
  60. <a-form-item label="成衣合同号">
  61. <a-input placeholder="请输入" v-model="queryParam.contractNo"></a-input>
  62. </a-form-item>
  63. </a-col>
  64. <a-col :md="6" :sm="8">
  65. <a-form-item label="业务员">
  66. <a-input placeholder="请输入" v-model="queryParam.cPersonName"></a-input>
  67. </a-form-item>
  68. </a-col>
  69. <a-form-item label="状态">
  70. <a-select v-model="queryParam.status">
  71. <a-select-option value="">请选择</a-select-option>
  72. <a-select-option value="保存">保存</a-select-option>
  73. <a-select-option value="提交">提交</a-select-option>
  74. <a-select-option value="已指派">已指派</a-select-option>
  75. <a-select-option value="返单">返单</a-select-option>
  76. <a-select-option value="完成">完成</a-select-option>
  77. </a-select>
  78. </a-form-item>
  79. </template>
  80. <a-col :md="6" :sm="8">
  81. <span style="float: left;overflow: hidden;" class="table-page-search-submitButtons">
  82. <a-button type="primary" @click="searchQuery" icon="search">查询</a-button>
  83. <a-button type="primary" @click="searchReset" icon="reload" style="margin-left: 8px">重置</a-button>
  84. <a @click="handleToggleSearch" style="margin-left: 8px">
  85. {{ toggleSearchStatus ? '收起' : '展开' }}
  86. <a-icon :type="toggleSearchStatus ? 'up' : 'down'" />
  87. </a>
  88. </span>
  89. </a-col>
  90. </a-row>
  91. </a-form>
  92. </div>
  93. </a-card>
  94. <!-- table区域 -->
  95. <a-card :bordered="false" style=" marginTop:10px;">
  96. <a-table
  97. bordered
  98. rowKey="id"
  99. :columns="fabricLossesColumns"
  100. :data-source="fabricLossesData"
  101. :loading="loading"
  102. :pagination="pagination"
  103. :scroll="{ x: 1200 }"
  104. @change="handleTableChange"
  105. >
  106. <span slot="action" slot-scope="text, record">
  107. <a @click="handleApply(record)" v-if="apply == 1 && (record.status=='保存' ||record.status=='完成'|| record.status=='' || record.status==undefined)">发起申请</a>
  108. <a-divider type="vertical" v-if="apply == 1 && (record.status=='保存' ||record.status=='完成'|| record.status=='' || record.status==undefined)"/>
  109. <a @click="openAppendixList(record)" v-if="record.attachs!==''&&record.attachs">附件</a>
  110. <!-- <a-divider v-if="record.attachs!==''&&record.attachs"/>
  111. <a-dropdown>
  112. <a class="ant-dropdown-link">更多<a-icon type="down"/></a>
  113. <a-menu slot="overlay" >
  114. <a-menu-item><a @click="cancelSumit(record)">取消提交</a></a-menu-item>
  115. <a-menu-item><a @click="details(record)">详情</a></a-menu-item>
  116. <a-menu-item><a @click="approvalHistory(record)">审批历史</a></a-menu-item>
  117. </a-menu>
  118. </a-dropdown> -->
  119. </span>
  120. </a-table>
  121. </a-card>
  122. <!-- 详情 大抽屉 -->
  123. <!-- <costDetail-drawer ref="costDetailDrawer" :fatherList="getCostList" @ok="modalFormOk"></costDetail-drawer> -->
  124. <attachment ref="attachment"></attachment>
  125. <history-modal ref="historyModal"></history-modal>
  126. <detail-fabric-loss-table ref="detailFabricLossTable" @close="getCostList"></detail-fabric-loss-table>
  127. </div>
  128. </template>
  129. <script>
  130. import { JeecgListMixin } from '@/mixins/JeecgListMixin'
  131. import JEllipsis from '@/components/jeecg/JEllipsis'
  132. import moment from 'moment'
  133. import costDetailDrawer from '@views/cost-allocation-total/costDetailDrawer.vue'
  134. import attachment from '@views/cost-allocation-total/modal/attachment.vue'
  135. import historyModal from '@views/cost-allocation-total/modal/historyModal.vue'
  136. import detailFabricLossTable from '@views/cost-allocation-total/modal/detailFabricLossTable.vue'
  137. import { checkList,historyApproval,cancelSubmit } from '@api/document/fabricLossesSummary.js'
  138. export default {
  139. name: 'fabricLossesSummary',
  140. mixins: [JeecgListMixin],
  141. components: { JEllipsis, moment, costDetailDrawer,attachment,historyModal,detailFabricLossTable },
  142. data() {
  143. let ellipsis = (v, l = 20) => <j-ellipsis value={v} length={l} />
  144. return {
  145. createTime:[],
  146. approvalDate:[],
  147. fabricLossesColumns: [
  148. {
  149. title: '保存日期',
  150. width: 120,
  151. dataIndex: 'createTime',
  152. customRender: text => {
  153. return moment(text).format('YYYY-MM-DD')
  154. },
  155. ellipsis: true,
  156. className: 'replacecolor'
  157. },
  158. {
  159. title: '审核人',
  160. width: 120,
  161. dataIndex: 'approvalMan',
  162. ellipsis: true,
  163. className: 'replacecolor'
  164. },
  165. {
  166. title: '审核日期',
  167. width: 120,
  168. dataIndex: 'approvalDate',
  169. customRender: text => {
  170. if(text!==''&&text){
  171. return moment(text).format('YYYY-MM-DD')
  172. }else{
  173. return ''
  174. }
  175. },
  176. ellipsis: true,
  177. className: 'replacecolor'
  178. },
  179. {
  180. title: '计划单号',
  181. width: 120,
  182. dataIndex: 'ccode',
  183. ellipsis: true,
  184. className: 'replacecolor'
  185. },
  186. { title: '款号', width: 90, dataIndex: 'cdefine22',ellipsis: true, className: 'replacecolor' },
  187. {
  188. title: '计划员',
  189. width: 120,
  190. dataIndex: 'planner',
  191. className: 'replacecolor',
  192. ellipsis: true,
  193. },
  194. {
  195. title: '成衣合同号',
  196. width: 120,
  197. dataIndex: 'contractNo',
  198. ellipsis: true,
  199. className: 'replacecolor'
  200. },
  201. {
  202. title: '排单数量',
  203. width: 120,
  204. dataIndex: 'number',
  205. ellipsis: true,
  206. className: 'replacecolor'
  207. },
  208. { title: '业务员', width: 120, dataIndex: 'cpersonName',ellipsis: true, className: 'replacecolor' },
  209. {
  210. title: '实际出库数量',
  211. width: 180,
  212. dataIndex: 'outboundNumber',
  213. ellipsis: true,
  214. // customRender: t => ellipsis(t),
  215. className: 'replacecolor',
  216. },
  217. { title: '制单人', width: 120, dataIndex: 'makingPeople', ellipsis: true,className: 'replacecolor' },
  218. { title: '状态', width: 130, dataIndex: 'status', ellipsis: true,className: 'replacecolor',fixed: 'right' },
  219. {
  220. title: '操作',
  221. dataIndex: 'action',
  222. scopedSlots: { customRender: 'action' },
  223. align: 'center',
  224. fixed: 'right',
  225. width: 130
  226. },
  227. ],
  228. fabricLossesData: [],
  229. // 查询条件
  230. queryParam: {
  231. // index: '',
  232. // planNum: '',
  233. // customerShortame: '',
  234. pageNo: '' // 点击的页数
  235. },
  236. // 分页
  237. pagination: {
  238. },
  239. dateFormat: 'YYYY-MM-DD',
  240. loading: false, // 表格加载
  241. apply:"",
  242. }
  243. },
  244. created() {
  245. this.apply = this.$route.query.apply;
  246. this.getCostList()
  247. },
  248. methods: {
  249. // 分页查询
  250. getCostList() {
  251. this.$nextTick(() => {
  252. checkList(this.queryParam).then(res => {
  253. if (res.success) {
  254. this.fabricLossesData = res.result.records
  255. this.pagination = {
  256. total: res.result.total,
  257. current: res.result.current,
  258. pageSize: res.result.size
  259. }
  260. }
  261. })
  262. })
  263. },
  264. cancelSumit(record){
  265. var syApprovalHistory={
  266. stuta:'取消提交',
  267. planNo:record.ccode,
  268. processingOpinion:'',
  269. processedBy:this.$store.getters.userInfo.realname,
  270. processingTime:moment(new Date()).format('YYYY-MM-DD HH:mm:ss'),
  271. assignedBy:''
  272. }
  273. cancelSubmit({planNum:record.ccode,status:record.status,currentState:'取消提交',syApprovalHistory:syApprovalHistory}).then(res => {
  274. if (res.success) {
  275. this.getCostList()
  276. this.$message.success('取消提交成功')
  277. }else{
  278. this.$message.error(res.message);
  279. }
  280. })
  281. },
  282. approvalHistory(record){
  283. this.$refs.historyModal.histiryModVis = true
  284. this.$refs.historyModal.getHistoryList(record.ccode)
  285. // historyApproval({code:record.ccode}).then(res => {
  286. // if (res.success) {
  287. // }else{
  288. // this.$message.error(res.message);
  289. // }
  290. // })
  291. },
  292. details(record){
  293. this.$refs.detailFabricLossTable.detailModVis = true
  294. this.$refs.detailFabricLossTable.status = record.status
  295. this.$refs.detailFabricLossTable.onSearch(record.ccode,'0')
  296. },
  297. searchQuery() {
  298. this.getCostList()
  299. },
  300. searchReset() {
  301. this.queryParam.pageNo = ''
  302. this.queryParam = {}
  303. this.getCostList()
  304. },
  305. onChange(){
  306. this.queryParam.createTime = (this.queryParam.createTime&&this.queryParam.createTime!=='')?this.queryParam.createTime.format('YYYY-MM-DD'):''
  307. this.queryParam.approvalDate = (this.queryParam.approvalDate&&this.queryParam.approvalDate!=='')?this.queryParam.approvalDate.format('YYYY-MM-DD'):''
  308. },
  309. handleTableChange(pagination, filters, sorter) {
  310. this.queryParam.pageNo = pagination.current
  311. this.getCostList()
  312. },
  313. changeCreateTime(){
  314. this.queryParam.createTimeE=this.createTime[1].format('YYYY-MM-DD')
  315. this.queryParam.createTimeB=this.createTime[0].format('YYYY-MM-DD')
  316. },
  317. changeApprovalDate(){
  318. this.queryParam.approvalDateE=this.approvalDate[0].format('YYYY-MM-DD')
  319. this.queryParam.approvalDateB=this.approvalDate[1].format('YYYY-MM-DD')
  320. },
  321. handleApply(record){
  322. var data = {
  323. type:"面损表",
  324. ccode:record.ccode,
  325. };
  326. window.parent.postMessage({msg:"startApply", data:data}, "*");
  327. },
  328. openAppendixList(record){
  329. this.$refs.attachment.AttachmentModVis = true
  330. var attachmentArr = record.attachs.split(',')
  331. var attachList = [];
  332. attachmentArr.forEach(item=>{
  333. var attach = {};
  334. attach.name = item;
  335. attach.src=item;
  336. attachList.push(attach);
  337. })
  338. this.$refs.attachment.attachmentData = attachList;
  339. },
  340. },
  341. computed: {},
  342. mounted() {}
  343. }
  344. </script>
  345. <style lang="less" scoped>
  346. @import '~@assets/less/common.less';
  347. @import '~@assets/less/overwriter.less';
  348. /deep/ .ant-table-thead > tr > th {
  349. text-align: center;
  350. // font-weight: 700;
  351. }
  352. /deep/ .ant-table-tbody {
  353. text-align: center;
  354. }
  355. // /deep/ th.replacecolor {
  356. // background-color: #ccc;
  357. // }
  358. </style>