|
|
@@ -1,58 +1,16 @@
|
|
|
<template>
|
|
|
<view class="detail-page">
|
|
|
- <view class="tabs" v-if="reportType == 2">
|
|
|
- <view class="tab" v-for="(t, i) in tabs" :key="t.label" :class="{ active: category == t.value }"
|
|
|
+ <view class="tabs">
|
|
|
+ <view class="tab" v-for="(t, i) in tabs" :key="t.label" :class="{ active: category == t.value }" :style="{ opacity: isLoading ? 0.5 : 1 }"
|
|
|
@click="selectTab(t)">
|
|
|
{{ t.label }}
|
|
|
</view>
|
|
|
</view>
|
|
|
<view class="card" :style="{ height: tableBodyHeight + 'rpx' }">
|
|
|
- <scroll-view v-if="reportType == 1" class="grid-scroll" scroll-y="true" scroll-x="true" :show-scrollbar="false"
|
|
|
- :style="{ maxHeight: tableBodyHeight + 'rpx' }" enhanced @scrolltolower="onTableScrollToLower">
|
|
|
- <view :style="{
|
|
|
- width: '1180px',
|
|
|
- }">
|
|
|
- <view class="grid-header">
|
|
|
- <text class="hcell hcell-sticky-left">查询客户</text>
|
|
|
- <text class="hcell">社会信用代码</text>
|
|
|
- <text class="hcell">品种</text>
|
|
|
- <text class="hcell">上游客户</text>
|
|
|
- <text class="hcell">货源片区</text>
|
|
|
- <text class="hcell">数量</text>
|
|
|
- <text class="hcell">批号</text>
|
|
|
- <text class="hcell">监管码样本(抽样)</text>
|
|
|
- <text class="hcell">终端到达数量</text>
|
|
|
- </view>
|
|
|
-
|
|
|
- <view v-if="!loading && rows.length > 0" class="grid-body">
|
|
|
- <view v-for="(row, idx) in rows" :key="idx + '-' + (row.produceBatchNo || '')" class="grow">
|
|
|
- <view v-if="row.flags.entName" class="gcell gcol-1 gspan" :class="['sticky-left']"
|
|
|
- :style="{ gridRowEnd: 'span ' + row.spans.entName }">{{ row.entName }}</view>
|
|
|
- <view v-if="row.flags.entName" class="gcell gcol-2 gspan"
|
|
|
- :style="{ gridRowEnd: 'span ' + row.spans.entName }">{{ row.orgCode }}</view>
|
|
|
- <view v-if="row.flags.physicName" class="gcell gcol-3 gspan"
|
|
|
- :style="{ gridRowEnd: 'span ' + row.spans.physicName }">{{ row.physicName }}</view>
|
|
|
- <view v-if="row.flags.currentENTName" class="gcell gcol-4 gspan"
|
|
|
- :style="{ gridRowEnd: 'span ' + row.spans.currentENTName }">{{ row.currentENTName }}</view>
|
|
|
- <view class="gcell gcol-5">{{ row.fromRegionName }}</view>
|
|
|
- <view class="gcell gcol-6">{{ row.fromQuantity }}</view>
|
|
|
- <view class="gcell gcol-7">{{ row.produceBatchNo }}</view>
|
|
|
- <view class="gcell gcol-8">{{ row.tracCode }}</view>
|
|
|
- <view class="gcell gcol-9">{{ row.toQuantity }}</view>
|
|
|
- </view>
|
|
|
- <view class="gcell gcell-full loading-row" v-if="hasMore">
|
|
|
- <view class="loading-wrapper">
|
|
|
- <image class="loading-icon" src="../../../../static/images/loading.png" />
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- </scroll-view>
|
|
|
- <scroll-view v-if="reportType == 2" class="grid-scroll" scroll-y="true" scroll-x="true" :show-scrollbar="false"
|
|
|
- :style="{
|
|
|
- maxHeight: tableBodyHeight + 'rpx',
|
|
|
- opacity: category == 1 ? 1 : 0,
|
|
|
- }" enhanced @scrolltolower="onTableScrollToLower">
|
|
|
+ <scroll-view class="grid-scroll" scroll-y="true" scroll-x="true" :show-scrollbar="false" :style="{
|
|
|
+ maxHeight: tableBodyHeight + 'rpx',
|
|
|
+ opacity: category == 1 ? 1 : 0,
|
|
|
+ }" enhanced @scrolltolower="onTableScrollToLower">
|
|
|
<view :style="{
|
|
|
width: '1180px',
|
|
|
}">
|
|
|
@@ -90,15 +48,14 @@
|
|
|
</view>
|
|
|
</view>
|
|
|
</scroll-view>
|
|
|
- <scroll-view v-if="reportType == 2" class="grid-scroll" scroll-y="true" scroll-x="true" :show-scrollbar="false"
|
|
|
- :style="{
|
|
|
- maxHeight: tableBodyHeight + 'rpx',
|
|
|
- opacity: category == 2 ? 1 : 0,
|
|
|
- position: 'absolute',
|
|
|
- top: '0',
|
|
|
- left: '0',
|
|
|
- zIndex: category == 2 ? '100' : '-1',
|
|
|
- }" enhanced @scrolltolower="onTableScrollToLower">
|
|
|
+ <scroll-view class="grid-scroll" scroll-y="true" scroll-x="true" :show-scrollbar="false" :style="{
|
|
|
+ maxHeight: tableBodyHeight + 'rpx',
|
|
|
+ opacity: category == 2 ? 1 : 0,
|
|
|
+ position: 'absolute',
|
|
|
+ top: '0',
|
|
|
+ left: '0',
|
|
|
+ zIndex: category == 2 ? '100' : '-1',
|
|
|
+ }" enhanced @scrolltolower="onTableScrollToLower">
|
|
|
<view :style="{
|
|
|
width: '1180px',
|
|
|
}">
|
|
|
@@ -114,7 +71,7 @@
|
|
|
<text class="hcell">追溯码抽样</text>
|
|
|
</view>
|
|
|
|
|
|
- <view v-if="!loading && _rows.length > 0" class="grid-body">
|
|
|
+ <view v-if="!_loading && _rows.length > 0" class="grid-body">
|
|
|
<view v-for="(row, idx) in _rows" :key="idx + '-' + (row.produceBatchNo || '')" class="grow">
|
|
|
<view v-if="row.flags.enterpriseName" class="gcell gcol-1 gspan" :class="['sticky-left']"
|
|
|
:style="{ gridRowEnd: 'span ' + row.spans.enterpriseName }">{{ row.enterpriseName }}</view>
|
|
|
@@ -137,7 +94,7 @@
|
|
|
</view>
|
|
|
</view>
|
|
|
</scroll-view>
|
|
|
- <view v-if="loading" class="loading-wrap">
|
|
|
+ <view v-if="isLoading" class="loading-wrap">
|
|
|
<view class="loading-row">
|
|
|
<view class="loading-wrapper">
|
|
|
<image class="loading-icon" src="../../../../static/images/loading.png" />
|
|
|
@@ -161,8 +118,6 @@ export default {
|
|
|
data() {
|
|
|
return {
|
|
|
taskId: "",
|
|
|
- reportType: "",
|
|
|
- isLoading: false,
|
|
|
tableBodyHeight: 0,
|
|
|
baseRowHeight: 76,
|
|
|
tabs: [
|
|
|
@@ -183,6 +138,7 @@ export default {
|
|
|
hasMore: true,
|
|
|
pageNum: 1,
|
|
|
pageSize: 10,
|
|
|
+ _loading: true,
|
|
|
_rows: [],
|
|
|
_totalCount: 0,
|
|
|
_fetchLoading: false,
|
|
|
@@ -194,7 +150,6 @@ export default {
|
|
|
onLoad(options) {
|
|
|
const title =
|
|
|
options && options.title ? decodeURIComponent(options.title) : "报表详情";
|
|
|
- this.reportType = options && options.reportType ? options.reportType : "";
|
|
|
this.taskId = options && options.id ? options.id : "";
|
|
|
uni.setNavigationBarTitle({ title });
|
|
|
this.tableBodyHeight = 14 * 80;
|
|
|
@@ -219,20 +174,18 @@ export default {
|
|
|
// }
|
|
|
// return total >= 12;
|
|
|
// },
|
|
|
+ isLoading() {
|
|
|
+ return this.loading && this.category == 1 || this._loading && this.category == 2;
|
|
|
+ },
|
|
|
showEmptyData() {
|
|
|
- if (this.loading) return false;
|
|
|
- if (this.reportType == 1 && this.rows.length === 0) {
|
|
|
- return true;
|
|
|
- } else {
|
|
|
- if (this.category == 1 && this.rows.length === 0) return true;
|
|
|
- if (this.category == 2 && this._rows.length === 0) return true;
|
|
|
- }
|
|
|
+ if (this.isLoading) return false;
|
|
|
+ if (this.category == 1 && this.rows.length === 0 || this.category == 2 && this._rows.length === 0) return true;
|
|
|
return false;
|
|
|
},
|
|
|
},
|
|
|
methods: {
|
|
|
selectTab(t) {
|
|
|
- if (this.loading) return;
|
|
|
+ if (this.isLoading) return;
|
|
|
this.category = t.value;
|
|
|
this.fetchList();
|
|
|
},
|
|
|
@@ -400,64 +353,8 @@ export default {
|
|
|
});
|
|
|
return res;
|
|
|
},
|
|
|
- computeBlackLeafCount(node) {
|
|
|
- if (!node || !node.dataList || !node.dataList.length) return 1;
|
|
|
- let sum = 0;
|
|
|
- node.dataList.forEach((c) => {
|
|
|
- sum += this.computeBlackLeafCount(c);
|
|
|
- });
|
|
|
- node.leafCount = sum;
|
|
|
- return sum;
|
|
|
- },
|
|
|
- buildBlackRows(data) {
|
|
|
- const res = [];
|
|
|
- (data || []).forEach((companyNode) => {
|
|
|
- const cLeaves = this.computeBlackLeafCount(companyNode);
|
|
|
- let companyStarted = false;
|
|
|
- (companyNode.dataList || []).forEach((expNode) => {
|
|
|
- const eLeaves = this.computeBlackLeafCount(expNode);
|
|
|
- let exporterStarted = false;
|
|
|
- const groups = {};
|
|
|
- (expNode.dataList || []).forEach((item) => {
|
|
|
- const key = item.currentENTName || "";
|
|
|
- if (!groups[key]) groups[key] = [];
|
|
|
- groups[key].push(item);
|
|
|
- });
|
|
|
- Object.keys(groups).forEach((prodName) => {
|
|
|
- const group = groups[prodName];
|
|
|
- let productStarted = false;
|
|
|
- group.forEach((batch) => {
|
|
|
- res.push({
|
|
|
- entName: companyNode.entName,
|
|
|
- orgCode: companyNode.orgCode,
|
|
|
- physicName: expNode.physicName,
|
|
|
- currentENTName: prodName,
|
|
|
- fromRegionName: batch.fromRegionName,
|
|
|
- fromQuantity: batch.fromQuantity,
|
|
|
- produceBatchNo: batch.produceBatchNo,
|
|
|
- tracCode: batch.tracCode,
|
|
|
- toQuantity: batch.toQuantity,
|
|
|
- spans: {
|
|
|
- entName: companyStarted ? 0 : cLeaves,
|
|
|
- physicName: exporterStarted ? 0 : eLeaves,
|
|
|
- currentENTName: productStarted ? 0 : group.length,
|
|
|
- },
|
|
|
- flags: {
|
|
|
- entName: !companyStarted,
|
|
|
- physicName: !exporterStarted,
|
|
|
- currentENTName: !productStarted,
|
|
|
- },
|
|
|
- });
|
|
|
- companyStarted = true;
|
|
|
- exporterStarted = true;
|
|
|
- productStarted = true;
|
|
|
- });
|
|
|
- });
|
|
|
- });
|
|
|
- });
|
|
|
- return res;
|
|
|
- },
|
|
|
- onTableScrollToLower() {
|
|
|
+ onTableScrollToLower(e) {
|
|
|
+ if(e?.detail?.direction === 'right') return
|
|
|
// if (this.isLoading) return;
|
|
|
// if (this.rows.length >= this.totalCount) return;
|
|
|
// this.isLoading = true;
|
|
|
@@ -478,25 +375,24 @@ export default {
|
|
|
hasMore: "hasMore",
|
|
|
fetchLoading: "fetchLoading",
|
|
|
rows: "rows",
|
|
|
+ loading: 'loading'
|
|
|
};
|
|
|
- if (this.reportType == 2 && this.category == 2) {
|
|
|
+ if (this.category == 2) {
|
|
|
obj.pageNum = "_pageNum";
|
|
|
obj.pageSize = "_pageSize";
|
|
|
obj.totalCount = "_totalCount";
|
|
|
obj.hasMore = "_hasMore";
|
|
|
obj.fetchLoading = "_fetchLoading";
|
|
|
obj.rows = "_rows";
|
|
|
+ obj.loading = '_loading'
|
|
|
}
|
|
|
if (this[obj.fetchLoading] || !this[obj.hasMore]) return;
|
|
|
this[obj.fetchLoading] = true;
|
|
|
let url = `/report/getTaskTableData`;
|
|
|
- if (this.reportType == 1) {
|
|
|
- url = `/report/getBlacklistReport`;
|
|
|
- }
|
|
|
try {
|
|
|
request(url, {
|
|
|
id: this.taskId,
|
|
|
- category: this.reportType == 1 ? undefined : this.category,
|
|
|
+ category: this.category,
|
|
|
pageNum: this[obj.pageNum],
|
|
|
pageSize: this[obj.pageSize],
|
|
|
path: '/reportExport/detail/index.vue',
|
|
|
@@ -506,11 +402,7 @@ export default {
|
|
|
this[obj.totalCount] = total || 0;
|
|
|
let _list = [];
|
|
|
if (Array.isArray(list)) {
|
|
|
- if (this.reportType == 1) {
|
|
|
- _list = this.buildBlackRows(list);
|
|
|
- } else {
|
|
|
- _list = this.buildRows(list);
|
|
|
- }
|
|
|
+ _list = this.buildRows(list);
|
|
|
}
|
|
|
this[obj.rows] = [...this[obj.rows], ..._list];
|
|
|
if (this[obj.rows].length < this[obj.totalCount]) {
|
|
|
@@ -520,12 +412,12 @@ export default {
|
|
|
this[obj.hasMore] = false;
|
|
|
}
|
|
|
}
|
|
|
- this.isLoading = false;
|
|
|
- this.loading = false;
|
|
|
+ this[obj.fetchLoading]= false;
|
|
|
+ this[obj.loading] = false;
|
|
|
})
|
|
|
} catch (res) {
|
|
|
- this.isLoading = false;
|
|
|
- this.loading = false;
|
|
|
+ this[obj.fetchLoading] = false;
|
|
|
+ this[obj.loading] = false;
|
|
|
}
|
|
|
// this.rows = [];
|
|
|
// setTimeout(() => {
|