<template> <a-card :bordered='false'> <!-- 查询区域 --> <div class='table-page-search-wrapper'> <a-form layout='inline' @keyup.enter.native='searchQuery'> <a-row :gutter='24'> <a-col :xl='6' :lg='7' :md='8' :sm='24'> <a-form-item label='编码'> <a-input placeholder='请输入编码' v-model='queryParam.code'></a-input> </a-form-item> </a-col> <a-col :xl='6' :lg='7' :md='8' :sm='24'> <a-form-item label='货主'> <a-select show-search placeholder='请选择货主' option-filter-prop='children' :filter-option='filterOption' v-model='queryParam.companyCode'> <a-select-option v-for='item in companyList' :key='item.name' :value='item.code'>{{ item.name }} </a-select-option> </a-select> </a-form-item> </a-col> <a-col :xl='6' :lg='7' :md='8' :sm='24'> <a-form-item label='入库单类型'> <a-select show-search placeholder='请选择入库单类型' option-filter-prop='children' :filter-option='filterOption' v-model='queryParam.type'> <a-select-option v-for='item in receiptTypeList' :key='item.name' :value='item.code'>{{ item.name }} </a-select-option> </a-select> </a-form-item> </a-col> <template v-if="toggleSearchStatus"> <a-col :xl="6" :lg="7" :md="8" :sm="24"> <a-form-item label="头状态"> <j-dict-select-tag placeholder="请选择头状态" v-model="queryParam.firstStatus" dictCode="receipt_status"/> </a-form-item> </a-col> <a-col :xl="6" :lg="7" :md="8" :sm="24"> <a-form-item label="尾状态"> <j-dict-select-tag placeholder="请选择尾状态" v-model="queryParam.lastStatus" dictCode="receipt_status"/> </a-form-item> </a-col> <a-col :xl="6" :lg="7" :md="8" :sm="24"> <a-form-item label="上游单号"> <a-input placeholder="请输入上游单号" v-model="queryParam.referCode"></a-input> </a-form-item> </a-col> <a-col :xl="6" :lg="7" :md="8" :sm="24"> <a-form-item label="供应商"> <a-select show-search placeholder="请选择供应商" option-filter-prop="children" :filter-option="filterOption" v-model="queryParam.supplierCode"> <a-select-option v-for="item in supplierList" :key="item.name" :value="item.code">{{ item.name }} </a-select-option> </a-select> </a-form-item> </a-col> <a-col :xl="10" :lg="11" :md="12" :sm="24"> <a-form-item label="创建日期"> <j-date :show-time="true" date-format="YYYY-MM-DD HH:mm:ss" placeholder="请选择开始时间" class="query-group-cust" v-model="queryParam.createTime_begin"></j-date> <span class="query-group-split-cust"></span> <j-date :show-time="true" date-format="YYYY-MM-DD HH:mm:ss" placeholder="请选择结束时间" class="query-group-cust" v-model="queryParam.createTime_end"></j-date> </a-form-item> </a-col> </template> <a-col :xl="6" :lg="7" :md="8" :sm="24"> <span style="float: left;overflow: hidden;" class="table-page-search-submitButtons"> <a-button type="primary" @click="searchQuery" icon="search">查询</a-button> <a-button type="primary" @click="searchReset" icon="reload" style="margin-left: 8px">重置</a-button> <a @click="handleToggleSearch" style="margin-left: 8px"> {{ toggleSearchStatus ? '收起' : '展开' }} <a-icon :type="toggleSearchStatus ? 'up' : 'down'"/> </a> </span> </a-col> </a-row> </a-form> </div> <!-- 查询区域-END --> <!-- 操作按钮区域 --> <div class='table-operator'> <a-upload name='file' :showUploadList='false' :multiple='false' :headers='tokenHeader' :action='importExcelUrl' @change='handleImportExcel'> <!-- <a-button type="primary" icon="import">导入</a-button>--> </a-upload> <!-- 高级查询区域 --> <!-- <j-super-query :fieldList='superFieldList' ref='superQueryModal'--> <!-- @handleSuperQuery='handleSuperQuery'></j-super-query>--> </div> <!-- table区域-begin --> <div> <a-table ref='table' size='middle' bordered rowKey='id' class='j-table-force-nowrap' :scroll='{x:true}' :columns='columns' :dataSource='dataSource' :pagination='ipagination' :loading='loading' :rowSelection="{selectedRowKeys: selectedRowKeys, onChange: onSelectChange, type:'radio'}" :customRow='clickThenSelect' @change='handleTableChange'> <span slot="companyCode" slot-scope="companyCode"> <a-tag :key="companyCode" color=blue> {{ solutionCompany(companyCode) }} </a-tag> </span> <span slot="type" slot-scope="type"> <a-tag :key="type" color=pink> {{ solutionReceiptType(type) }} </a-tag> </span> <span slot="supplierCode" slot-scope="supplierCode"> <a-tag :key="supplierCode" color=pink> {{ solutionSupplier(supplierCode) }} </a-tag> </span> <span slot="reason" slot-scope="reason"> <span v-html="solutionReason(reason)"></span> </span> <template slot='htmlSlot' slot-scope='text'> <div v-html='text'></div> </template> <template slot='imgSlot' slot-scope='text'> <span v-if='!text' style='font-size: 12px;font-style: italic;'>无图片</span> <img v-else :src='getImgView(text)' height='25px' alt='' style='max-width:80px;font-size: 12px;font-style: italic;'/> </template> <template slot='fileSlot' slot-scope='text'> <span v-if='!text' style='font-size: 12px;font-style: italic;'>无文件</span> <a-button v-else :ghost='true' type='primary' icon='download' size='small' @click='downloadFile(text)'>下载 </a-button> </template> </a-table> </div> <a-tabs defaultActiveKey='1'> <a-tab-pane tab='历史入库单明细' key='1'> <ReceiptDetailHistoryList :mainId='selectedMainId'/> </a-tab-pane> </a-tabs> <receiptHeaderHistory-modal ref='modalForm' @ok='modalFormOk'></receiptHeaderHistory-modal> </a-card> </template> <script> import {JeecgListMixin} from '@/mixins/JeecgListMixin' import ReceiptHeaderHistoryModal from './modules/ReceiptHeaderHistoryModal' import {getAction} from '@/api/manage' import ReceiptDetailHistoryList from './ReceiptDetailHistoryList' import {initDictOptions, filterMultiDictText} from '@/components/dict/JDictSelectUtil' import '@/assets/less/TableExpand.less' import {getCompanyList, getReceiptTypeList, getSupplierList} from '@api/api' export default { name: 'ReceiptHeaderHistoryList', mixins: [JeecgListMixin], components: { ReceiptDetailHistoryList, ReceiptHeaderHistoryModal }, data() { return { description: '历史入库单管理页面', companyList: [], receiptTypeList: [], supplierList: [], // 表头 columns: [ // { // title: '单据ID', // align: 'center', // dataIndex: 'id' // }, { title: '入库单编码', align: 'center', dataIndex: 'code' }, { title: '货主', align: "center", dataIndex: 'companyCode', key: 'companyCode', scopedSlots: {customRender: 'companyCode'} }, { title: '入库单类型', align: "center", dataIndex: 'type', key: 'type', scopedSlots: {customRender: 'type'} }, { title: '头状态', align: "center", dataIndex: 'firstStatus_dictText', }, { title: '尾状态', align: "center", dataIndex: 'lastStatus_dictText', }, { title: '上游单号', align: 'center', dataIndex: 'referCode' }, { title: '供应商', align: "center", dataIndex: 'supplierCode', key: 'supplierCode', scopedSlots: {customRender: 'supplierCode'} }, { title: '总数量', align: 'center', dataIndex: 'totalqty' }, { title: '总行数', align: 'center', dataIndex: 'totallines' }, { title: '入库单备注', align: 'center', dataIndex: 'remark' }, { title: '原因', align: 'center', dataIndex: 'reason', scopedSlots: {customRender: 'reason'} }, { title: '创建人', align: 'center', dataIndex: 'createBy' }, { title: '创建日期', align: 'center', dataIndex: 'createTime' }, { title: '更新人', align: 'center', dataIndex: 'updateBy' }, { title: '更新日期', align: 'center', dataIndex: 'updateTime' } ], url: { list: '/receipt/receiptHeaderHistory/list', delete: '/receipt/receiptHeaderHistory/delete', deleteBatch: '/receipt/receiptHeaderHistory/deleteBatch', exportXlsUrl: '/receipt/receiptHeaderHistory/exportXls', importExcelUrl: 'receipt/receiptHeaderHistory/importExcel' }, dictOptions: { firstStatus: [], lastStatus: [], }, /* 分页参数 */ ipagination: { current: 1, pageSize: 5, pageSizeOptions: ['5', '10', '50'], showTotal: (total, range) => { return range[0] + '-' + range[1] + ' 共' + total + '条' }, showQuickJumper: true, showSizeChanger: true, total: 0 }, selectedMainId: '', superFieldList: [] } }, created() { this.getSuperFieldList() this.loadFrom(); }, computed: { importExcelUrl: function () { return `${window._CONFIG['domianURL']}/${this.url.importExcelUrl}` } }, methods: { initDictConfig() { }, clickThenSelect(record) { return { on: { click: () => { this.onSelectChange(record.id.split(','), [record]) } } } }, onClearSelected() { this.selectedRowKeys = [] this.selectionRows = [] this.selectedMainId = '' }, onSelectChange(selectedRowKeys, selectionRows) { this.selectedMainId = selectedRowKeys[0] this.selectedRowKeys = selectedRowKeys this.selectionRows = selectionRows }, loadData(arg) { if (!this.url.list) { this.$message.error('请设置url.list属性!') return } //加载数据 若传入参数1则加载第一页的内容 if (arg === 1) { this.ipagination.current = 1 } this.onClearSelected() var params = this.getQueryParams()//查询条件 this.loading = true getAction(this.url.list, params).then((res) => { if (res.success) { this.dataSource = res.result.records this.ipagination.total = res.result.total } if (res.code === 510) { this.$message.warning(res.message) } this.loading = false }) }, getSuperFieldList() { let fieldList = [] fieldList.push({type: 'string', value: 'code', text: '编码', dictCode: ''}) fieldList.push({type: 'string', value: 'companyCode', text: '货主', dictCode: ''}) fieldList.push({type: 'string', value: 'type', text: '入库单类型', dictCode: ''}) fieldList.push({type: 'int', value: 'firstStatus', text: '头状态', dictCode: 'receipt_status'}) fieldList.push({type: 'int', value: 'lastStatus', text: '尾状态', dictCode: 'receipt_status'}) fieldList.push({type: 'string', value: 'referCode', text: '上游单号', dictCode: ''}) fieldList.push({type: 'string', value: 'supplierCode', text: '供应商编码', dictCode: ''}) fieldList.push({type: 'BigDecimal', value: 'totalqty', text: '总数量', dictCode: ''}) fieldList.push({type: 'int', value: 'totallines', text: '总行数', dictCode: ''}) fieldList.push({type: 'string', value: 'remark', text: '入库单备注', dictCode: ''}) fieldList.push({type: 'string', value: 'createBy', text: '创建人', dictCode: ''}) fieldList.push({type: 'datetime', value: 'createTime', text: '创建日期'}) fieldList.push({type: 'string', value: 'updateBy', text: '更新人', dictCode: ''}) fieldList.push({type: 'datetime', value: 'updateTime', text: '更新日期'}) this.superFieldList = fieldList }, loadFrom() { getCompanyList().then((res) => { if (res.success) { this.companyList = res.result } }) getReceiptTypeList().then((res) => { if (res.success) { this.receiptTypeList = res.result } }) getSupplierList().then((res) => { if (res.success) { this.supplierList = res.result } }) }, solutionCompany(value) { var actions = [] Object.keys(this.companyList).some((key) => { if (this.companyList[key].code == ('' + value)) { actions.push(this.companyList[key].name) return true } }) return actions.join('') }, solutionReceiptType(value) { var actions = [] Object.keys(this.receiptTypeList).some((key) => { if (this.receiptTypeList[key].code == ('' + value)) { actions.push(this.receiptTypeList[key].name) return true } }) return actions.join('') }, solutionSupplier(value) { var actions = [] Object.keys(this.supplierList).some((key) => { if (this.supplierList[key].code == ('' + value)) { actions.push(this.supplierList[key].name) return true } }) return actions.join('') }, solutionReason(value){ if (value == 'WMS删除') { return '<span style="color:black">WMS删除</span>' } else if (value == '上游删除') { return '<span style="color:#0e36b9">上游删除</span>' } else if (value == '回传删除') { return '<span style="color:green">回传删除</span>' } } } } </script> <style scoped> @import '~@assets/less/common.less' </style>