Browse Source

单证:【推送失败汇总】页面

liangyan0105 3 years ago
parent
commit
ff3d2cb0e7
1 changed files with 218 additions and 0 deletions
  1. 218 0
      src/views/push-fail-total/document.vue

+ 218 - 0
src/views/push-fail-total/document.vue

@@ -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>