|
@@ -0,0 +1,218 @@
|
|
|
+<template>
|
|
|
+ <!-- 推送失败单据 -->
|
|
|
+ <div id="document">
|
|
|
+ <!-- 查询 -->
|
|
|
+ <a-card :bordered="false">
|
|
|
+ <div class="table-page-search-wrapper">
|
|
|
+ <a-form layout="inline" @keyup.enter.native="searchQuery">
|
|
|
+ <a-row :gutter="24">
|
|
|
+ <a-col :md="6" :sm="8">
|
|
|
+ <a-form-item label="单据号">
|
|
|
+ <a-input placeholder="请输入单据号" v-model="queryParam.documentNum"></a-input>
|
|
|
+ </a-form-item>
|
|
|
+ </a-col>
|
|
|
+
|
|
|
+ <a-col :md="6" :sm="8">
|
|
|
+ <a-form-item label="开始时间">
|
|
|
+ <a-date-picker
|
|
|
+ placeholder="请选择开始时间"
|
|
|
+ :format="dateFormat"
|
|
|
+ style="width: 100%"
|
|
|
+ v-model="queryParam.startTime"
|
|
|
+ />
|
|
|
+ </a-form-item>
|
|
|
+ </a-col>
|
|
|
+
|
|
|
+ <a-col :md="6" :sm="8">
|
|
|
+ <a-form-item label="结束时间" style="width:100%;">
|
|
|
+ <a-date-picker
|
|
|
+ placeholder="请选择结束时间"
|
|
|
+ :format="dateFormat"
|
|
|
+ style="width: 100%"
|
|
|
+ v-model="queryParam.endTime"
|
|
|
+ />
|
|
|
+ </a-form-item>
|
|
|
+ </a-col>
|
|
|
+
|
|
|
+ <template v-if="toggleSearchStatus">
|
|
|
+ <a-col :md="6" :sm="8">
|
|
|
+ <a-form-item label="单据类型">
|
|
|
+ <a-select v-model="queryParam.documentType">
|
|
|
+ <a-select-option value="">请选择</a-select-option>
|
|
|
+ <a-select-option :value="0">发运明细</a-select-option>
|
|
|
+ <a-select-option :value="1">预装箱单</a-select-option>
|
|
|
+ <a-select-option :value="2">预托书</a-select-option>
|
|
|
+ <a-select-option :value="3">装箱单</a-select-option>
|
|
|
+ <a-select-option :value="4">托书</a-select-option>
|
|
|
+ <a-select-option :value="5">申报要素</a-select-option>
|
|
|
+ </a-select>
|
|
|
+ </a-form-item>
|
|
|
+ </a-col>
|
|
|
+ </template>
|
|
|
+
|
|
|
+ <a-col :md="6" :sm="8">
|
|
|
+ <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>
|
|
|
+ </a-card>
|
|
|
+
|
|
|
+ <!-- 子表 -->
|
|
|
+ <a-card :bordered="false" style=" marginTop:10px;">
|
|
|
+ <a-table
|
|
|
+ bordered
|
|
|
+ :row-key="record => record.id"
|
|
|
+ :columns="documentColumns"
|
|
|
+ :data-source="documentData"
|
|
|
+ :loading="loading"
|
|
|
+ :pagination="ipagination"
|
|
|
+ @change="handleTableChange"
|
|
|
+ >
|
|
|
+ <!-- 推送状态 -->
|
|
|
+ <!-- slot-scope="text, record" -->
|
|
|
+ <span slot="pushStateSlot">
|
|
|
+ <!-- v-if="record.isRelease == '0'" -->
|
|
|
+ <a-tag color="red">推送失败</a-tag>
|
|
|
+ <!-- <a-tag color="green" v-else>推送成功</a-tag> -->
|
|
|
+ </span>
|
|
|
+
|
|
|
+ <!-- 操作 根据推送状态进行判断 -->
|
|
|
+ <span slot="operationSlot" slot-scope="text, record">
|
|
|
+ <a href="javascript:void(0);" @click="rePush(record)" style="color:green">重新推送</a>
|
|
|
+ </span>
|
|
|
+ </a-table>
|
|
|
+ </a-card>
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+import { JeecgListMixin } from '@/mixins/JeecgListMixin'
|
|
|
+import JEllipsis from '@/components/jeecg/JEllipsis'
|
|
|
+import moment from 'moment'
|
|
|
+
|
|
|
+export default {
|
|
|
+ name: 'Document', // 推送失败单据
|
|
|
+ mixins: [JeecgListMixin],
|
|
|
+ components: { JEllipsis, moment },
|
|
|
+
|
|
|
+ data() {
|
|
|
+ let ellipsis = (v, l = 20) => <j-ellipsis value={v} length={l} />
|
|
|
+ return {
|
|
|
+ loading: false, // 表格加载
|
|
|
+ id: '',
|
|
|
+ // 表头
|
|
|
+ documentColumns: [
|
|
|
+ {
|
|
|
+ title: '单据类型',
|
|
|
+ dataIndex: 'documentType',
|
|
|
+ width: 160,
|
|
|
+ className: 'replacecolor'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: '单据号',
|
|
|
+ dataIndex: 'documentNum',
|
|
|
+ width: 180,
|
|
|
+ className: 'replacecolor'
|
|
|
+ },
|
|
|
+ // {
|
|
|
+ // title: '创建时间',
|
|
|
+ // dataIndex: 'createTime',
|
|
|
+ // align: 'center',
|
|
|
+ // sorter: true,
|
|
|
+ // customRender: text => {
|
|
|
+ // return moment(text).format('YYYY-MM-DD')
|
|
|
+ // }
|
|
|
+ // },
|
|
|
+ {
|
|
|
+ title: '单据日期',
|
|
|
+ dataIndex: 'documentDate',
|
|
|
+ width: 180,
|
|
|
+ className: 'replacecolor'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: '推送状态',
|
|
|
+ dataIndex: 'pushState',
|
|
|
+ scopedSlots: { customRender: 'pushStateSlot' },
|
|
|
+ width: 140,
|
|
|
+ className: 'replacecolor'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: '原因',
|
|
|
+ dataIndex: 'reason',
|
|
|
+ width: '200',
|
|
|
+ customRender: t => ellipsis(t),
|
|
|
+ className: 'replacecolor'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: '操作',
|
|
|
+ dataIndex: 'operation',
|
|
|
+ scopedSlots: { customRender: 'operationSlot' },
|
|
|
+ width: 160,
|
|
|
+ className: 'replacecolor'
|
|
|
+ }
|
|
|
+ ],
|
|
|
+ documentData: [{ documentType: '发运明细' }, { documentType: '预装箱单' }],
|
|
|
+
|
|
|
+ // 查询条件
|
|
|
+ queryParam: {
|
|
|
+ documentNum: '', // 单据号
|
|
|
+ startTime: '',
|
|
|
+ endTime: '',
|
|
|
+ documentType: ''
|
|
|
+ },
|
|
|
+ dateFormat: 'YYYY-MM-DD'
|
|
|
+ }
|
|
|
+ },
|
|
|
+ created() {
|
|
|
+ // this.getShipmentList() // 推送失败的所有单据
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ // 查询按钮
|
|
|
+ searchQuery() {
|
|
|
+ // this.getAnnList() // 渲染公告
|
|
|
+ },
|
|
|
+ // 重置
|
|
|
+ searchReset() {
|
|
|
+ console.log('>>>>重置')
|
|
|
+ this.queryParam = {}
|
|
|
+ // this.getAnnList()
|
|
|
+ },
|
|
|
+
|
|
|
+ // 操作 重新推送
|
|
|
+ rePush() {}
|
|
|
+
|
|
|
+ // 分页、排序、筛选变化时触发
|
|
|
+ // handleTableChange(pagination, filters, sorter) {
|
|
|
+ // // console.log('当前页信息>>>>',pagination)
|
|
|
+ // this.queryParam.pageNo = pagination.current
|
|
|
+ // // this.getAnnList()
|
|
|
+ // }
|
|
|
+ },
|
|
|
+ computed: {},
|
|
|
+ mounted() {}
|
|
|
+}
|
|
|
+</script>
|
|
|
+<style lang="less" scoped>
|
|
|
+@import '~@assets/less/common.less';
|
|
|
+@import '~@assets/less/overwriter.less';
|
|
|
+/deep/ .ant-table-thead > tr > th {
|
|
|
+ text-align: center;
|
|
|
+ // font-weight: 700;
|
|
|
+}
|
|
|
+
|
|
|
+/deep/ .ant-table-tbody {
|
|
|
+ text-align: center;
|
|
|
+}
|
|
|
+
|
|
|
+// /deep/ th.replacecolor {
|
|
|
+// background-color: #ccc;
|
|
|
+// }
|
|
|
+</style>
|