From 559c928585704f2eb0737b41bcbf470ceb01c6c5 Mon Sep 17 00:00:00 2001
From: qb <1191961160@qq.com>
Date: Wed, 20 Nov 2024 19:17:25 +0800
Subject: [PATCH] =?UTF-8?q?=E6=96=B0=E5=A2=9E=E9=A6=96=E9=A1=B5=E8=AF=A6?=
=?UTF-8?q?=E6=83=85?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
---
src/api/wel/index.js | 13 ++
src/components/tablecmt/tablecmt.vue | 41 +---
src/option/distribution/TripartiteTransfer.js | 2 +-
src/option/wel/index.js | 94 +++++++++
src/views/wel/Tip.vue | 72 +++++++
src/views/wel/index.vue | 192 +++++++++++++++++-
6 files changed, 381 insertions(+), 33 deletions(-)
create mode 100644 src/option/wel/index.js
create mode 100644 src/views/wel/Tip.vue
diff --git a/src/api/wel/index.js b/src/api/wel/index.js
index d4112e05..7c26ff01 100644
--- a/src/api/wel/index.js
+++ b/src/api/wel/index.js
@@ -13,6 +13,19 @@ export const postAllocationData = data => {
});
};
+/**
+ * 库位数据 -- 对比数据
+ * @param {Object} data
+ * @returns
+ */
+export const postOpenOrderDataByWarehouseId = data => {
+ return request({
+ url: '/api/logpm-report/warehouseIndex/openOrderDataByWarehouseId',
+ method: 'post',
+ data,
+ });
+};
+
/**
* 当前在库数据
* @param {Object} data
diff --git a/src/components/tablecmt/tablecmt.vue b/src/components/tablecmt/tablecmt.vue
index 11487f0a..5c44edf7 100644
--- a/src/components/tablecmt/tablecmt.vue
+++ b/src/components/tablecmt/tablecmt.vue
@@ -381,6 +381,8 @@ const isHaveSelection = ref(false);
let selectarr = ref([]);
/** 设置每行颜色 */
const tableRowClassName = ({ row, rowIndex }: { row: TableDataType; rowIndex: number }) => {
+ if (props.tableData.length === selectarr.value.length) return 'table-SelectedRow-bgcolor';
+
for (let i = 0; i < selectarr.value.length; i++) {
if (selectarr.value[i] === row) return 'table-SelectedRow-bgcolor';
}
@@ -527,10 +529,10 @@ const handleSelectionChange = (param: TableDataType[]) => {
selectCount.value[i].value = 0;
}
- if (selectarr.value.length === 0) return;
+ if (param.length === 0) return;
- for (let index = 0; index < selectarr.value.length; index++) {
- const val = selectarr.value[index];
+ for (let index = 0; index < param.length; index++) {
+ const val = param[index];
for (let j = 0; j < selectCount.value.length; j++) {
const item = selectCount.value[j];
@@ -714,10 +716,10 @@ const handleWidthChange = (newWidth, oldWidth, column, event) => {
if (props.isSave) return;
- postSaveTableSeting({
- tableKey: $route.path + props.columnListName,
- tableSetCongig: JSON.stringify(props.columnList),
- });
+ // postSaveTableSeting({
+ // tableKey: $route.path + props.columnListName,
+ // tableSetCongig: JSON.stringify(props.columnList),
+ // });
};
let watchTimer;
@@ -725,7 +727,6 @@ watch(
() => props.columnList,
() => {
if (watchTimer) clearTimeout(watchTimer);
-
watchTimer = setTimeout(() => {
for (let i = 0; i < props.columnList.length; i++) {
const val = props.columnList[i];
@@ -830,21 +831,6 @@ defineExpose({ handleCheckSelect, handleClearSelect });
.el-table .el-input__inner {
height: 23px !important;
}
-// .el-checkbox__input.is-checked .el-checkbox__inner{
-// background-color: #D3832A !important;
-// border-color: #D3832A !important;
-// }
-// .is .el-checkbox__input.is-checked .el-checkbox__inner{
-// background-color: #D3832A !important;
-// border-color: #D3832A !important;
-// }
-// .is-checked .el-checkbox__inner:hover{
-// border-color: #D3832A !important;
-// }
-// .el-checkbox__input.is-indeterminate .el-checkbox__inner{
-// background-color: #D3832A !important;
-// border-color: #D3832A !important;
-// }
.el-table .el-table__cell {
padding: 0px !important;
}
@@ -864,10 +850,8 @@ defineExpose({ handleCheckSelect, handleClearSelect });
border-color: #d3832a !important;
font-size: 12px !important;
}
-.table-SelectedRow-bgcolor {
- > td {
- background-color: #f7e8d7 !important;
- }
+.el-table .table-SelectedRow-bgcolor {
+ background-color: #f7e8d7 !important;
}
.colors {
color: #409eff !important;
@@ -902,9 +886,6 @@ defineExpose({ handleCheckSelect, handleClearSelect });
.el-table .el-popper {
max-width: 20% !important;
}
-.el-input {
- // width: 200px !important;
-}
.el-table__footer {
tr {
diff --git a/src/option/distribution/TripartiteTransfer.js b/src/option/distribution/TripartiteTransfer.js
index 6659366a..334238bc 100644
--- a/src/option/distribution/TripartiteTransfer.js
+++ b/src/option/distribution/TripartiteTransfer.js
@@ -251,7 +251,7 @@ export const columnList = [
label: '操作',
type: 6,
values: '',
- width: '200',
+ width: '300',
checkarr: [],
fixed: 'right',
sortable: false,
diff --git a/src/option/wel/index.js b/src/option/wel/index.js
new file mode 100644
index 00000000..cfd23a59
--- /dev/null
+++ b/src/option/wel/index.js
@@ -0,0 +1,94 @@
+/** 开单数据 */
+export const openOrderColumn = [
+ {
+ prop: '',
+ label: '复选框',
+ type: 0,
+ width: 55,
+ fixed: false,
+ },
+ {
+ prop: '',
+ label: '序号',
+ type: 12,
+ values: '',
+ width: 55,
+ fixed: false,
+ },
+ {
+ prop: 'warehouseName',
+ label: '仓库',
+ type: 2,
+ values: '',
+ width: '150',
+ fixed: false,
+ sortable: true,
+ head: false,
+ },
+ {
+ prop: 'totalNum',
+ label: '总单数',
+ type: 2,
+ values: '',
+ width: '150',
+ fixed: false,
+ sortable: true,
+ head: false,
+ isshowSummary: true,
+ },
+ {
+ prop: 'totalCount',
+ label: '总件数',
+ type: 2,
+ values: '',
+ width: '150',
+ fixed: false,
+ sortable: true,
+ head: false,
+ isshowSummary: true,
+ },
+ {
+ prop: 'monthNum',
+ label: '月单数',
+ type: 2,
+ values: '',
+ width: '150',
+ fixed: false,
+ sortable: true,
+ head: false,
+ isshowSummary: true,
+ },
+ {
+ prop: 'monthCount',
+ label: '月件数',
+ type: 2,
+ values: '',
+ width: '150',
+ fixed: false,
+ sortable: true,
+ head: false,
+ isshowSummary: true,
+ },
+ {
+ prop: 'dayNum',
+ label: '日单数',
+ type: 2,
+ values: '',
+ width: '150',
+ fixed: false,
+ sortable: true,
+ head: false,
+ isshowSummary: true,
+ },
+ {
+ prop: 'dayCount',
+ label: '日件数',
+ type: 2,
+ values: '',
+ width: '150',
+ fixed: false,
+ sortable: true,
+ head: false,
+ isshowSummary: true,
+ },
+];
diff --git a/src/views/wel/Tip.vue b/src/views/wel/Tip.vue
new file mode 100644
index 00000000..2ece9bc6
--- /dev/null
+++ b/src/views/wel/Tip.vue
@@ -0,0 +1,72 @@
+<template>
+ <div class="tip_container">
+ <slot></slot>
+
+ <div class="mask" v-if="isShow">
+ <tablecmt
+ style="max-height: 500px"
+ :columnList="columnList"
+ :tableData="tableData"
+ :loading="loading"
+ :isInitHeigt="false"
+ ></tablecmt>
+ </div>
+ </div>
+</template>
+
+<script setup lang="ts">
+import { reactive } from 'vue';
+
+const props = defineProps({
+ /** 是否显示 */
+ isShow: {
+ type: Boolean,
+ default: true,
+ },
+
+ /** 是否在消失后保留dom */
+ isDistory: {
+ type: Boolean,
+ required: false,
+ default: true,
+ },
+
+ /** 表格表头 */
+ columnList: {
+ type: Array,
+ required: true,
+ },
+
+ /** 表格数据 */
+ tableData: {
+ type: Array,
+ required: true,
+ },
+
+ /** 请求loading */
+ loading: {
+ type: Boolean,
+ required: false,
+ default: false,
+ },
+});
+
+const details = reactive({});
+</script>
+
+<style lang="scss" scoped>
+.tip_container {
+ position: relative;
+}
+
+.mask {
+ position: absolute;
+ top: calc(100% + 10px);
+ width: 50vw;
+ background-color: #fff;
+ padding: 10px;
+ box-shadow: 5px 5px 5px 5px #172e6080;
+ border-radius: 5px;
+ // border: 1px solid var(--el-color-primary);
+}
+</style>
diff --git a/src/views/wel/index.vue b/src/views/wel/index.vue
index d8381959..a87db5ba 100644
--- a/src/views/wel/index.vue
+++ b/src/views/wel/index.vue
@@ -7,12 +7,27 @@
<!-- 开单数据 && 开单收入 -->
<div class="flex mb10 row_first">
<!-- 开单数据 -->
+
<div class="mr10 box1 view_box" v-loading="details.loadingObj.openOrderData">
<!-- 标题 -->
<div class="align_center mb20">
<img class="mr10 img_13pt" src="@/static/icon_data.png" alt="" />
<div class="title">开单数据</div>
+
+ <!-- 详情 -->
+ <div class="flex-c-c detailsBtn ml20">
+ <el-icon>
+ <DataAnalysis />
+ </el-icon>
+
+ <span
+ style="margin-left: 5px"
+ @click="() => handleDetails('openOrderColumn', '开单数据详情')"
+ >
+ 详情
+ </span>
+ </div>
</div>
<!-- 数据 -->
@@ -263,6 +278,20 @@
<img class="mr10 img_13pt" src="@/static/icon_data.png" alt="" />
<div class="title">当前在库数据</div>
+
+ <!-- 详情 -->
+ <!-- <div class="flex-c-c detailsBtn ml20">
+ <el-icon>
+ <DataAnalysis />
+ </el-icon>
+
+ <span
+ style="margin-left: 5px"
+ @click="() => handleDetails('openOrderColumn', '开单数据详情')"
+ >
+ 详情
+ </span>
+ </div> -->
</div>
<!-- 数据 -->
@@ -355,6 +384,20 @@
<img class="mr10 img_13pt" src="@/static/icon_money.png" alt="" />
<div class="title">库位数据</div>
+
+ <!-- 详情 -->
+ <!-- <div class="flex-c-c detailsBtn ml20">
+ <el-icon>
+ <DataAnalysis />
+ </el-icon>
+
+ <span
+ style="margin-left: 5px"
+ @click="() => handleDetails('openOrderColumn', '开单数据详情')"
+ >
+ 详情
+ </span>
+ </div> -->
</div>
<div class="border data_container pd10 flex">
@@ -979,6 +1022,46 @@
</div>
</div>
</div>
+
+ <!-- 开单数据 -->
+ <el-dialog
+ title="开单数据"
+ v-model="details.popUpShow.isShow"
+ width="80%"
+ :append-to-body="false"
+ :destroy-on-close="false"
+ draggable
+ >
+ <!-- 导出 -->
+ <div class="flex-c-sb mb10">
+ <div></div>
+ <el-button icon="Download" type="primary" @click="handleExport"> 导出 </el-button>
+ </div>
+
+ <!-- 表格 -->
+ <tablecmt
+ style="height: 500px"
+ :columnList="details.columnList"
+ :tableData="details.renderData"
+ :loading="details.loadingObj.loading"
+ @inputTxt="
+ (value, col) => {
+ handleInputQuery(value, col, details.query.inputQuery, true);
+ details.renderData = handleFilterData(details.tableData, [], details.query);
+ }
+ "
+ :isInitHeigt="false"
+ ></tablecmt>
+
+ <tablecmt
+ ref="exportColumnListNode"
+ v-show="false"
+ style="height: 500px"
+ :columnList="details.exportColumnList"
+ :tableData="details.tableData"
+ :isInitHeigt="false"
+ ></tablecmt>
+ </el-dialog>
</div>
</template>
@@ -998,9 +1081,16 @@
</template>
</template>
<script setup lang="ts">
-import { ref, onMounted, computed, reactive } from 'vue';
-import { computeNumber } from '@/utils/util.js';
+import { ref, onMounted, computed, reactive, defineComponent, toRefs, toRef } from 'vue';
+import {
+ computeNumber,
+ deepClone,
+ getObjType,
+ handleFilterData,
+ handleInputQuery,
+} from '@/utils/util.js';
import { getStore } from '@/utils/store';
+import { dateNow } from '@/utils/date';
import {
postAllocationData,
@@ -1012,9 +1102,22 @@ import {
postUnloadAbnormalData,
postDeliveryData,
postSignforData,
+ postOpenOrderDataByWarehouseId,
} from '@/api/wel/index';
+import { exportExcelByDom } from '@/utils/export';
+
+import { openOrderColumn } from '@/option/wel/index';
+
+// 弹窗组件
+import Tip from './Tip.vue';
+
+// 注册组件
+defineComponent([Tip]);
+
+const exportColumnListNode = ref();
const details = reactive({
+ title: '',
/** 开单数据 */
openOrderDataInfo: {
/** 开单 -- 当日 -- 单 */
@@ -1112,11 +1215,31 @@ const details = reactive({
deliveryData: false,
/** 签收数据 */
signforData: false,
+ /** 弹窗loading */
+ loading: false,
},
/** 1 -- 公司首页, 2 -- 数据看板 */
pageType: 1,
+ /** 表头 */
+ detailOption: {
+ // 开单数据
+ openOrderColumn: deepClone(openOrderColumn),
+ },
+ columnList: [],
+ exportColumnList: [],
+ tableData: [],
+ renderData: [],
+ /** 搜索 */
+ query: {
+ inputQuery: {},
+ },
+ popUpShow: {
+ isShow: false,
+ },
});
+const { detailOption } = toRefs(details);
+
const info = localStorage.getItem('TWMS-userInfo');
const _userInfo = info ? JSON.parse(info) : {};
@@ -1419,6 +1542,49 @@ const billSignforData = computed(() => {
return _obj;
});
+
+/** 请求详情 */
+const handleDetails = async (type, title) => {
+ details.popUpShow.isShow = true;
+ details.loadingObj.loading = true;
+ details.title = title;
+ details.columnList = details.detailOption[type];
+ const _arr = [];
+ const _whiteArr = ['操作', '序号', '复选框'];
+ for (let i = 0; i < details.columnList.length; i++) {
+ const val = { ...details.columnList[i] };
+ if (_whiteArr.includes(val.label)) continue;
+ val.type = 30;
+ _arr.push(val);
+ }
+ details.exportColumnList = _arr;
+
+ try {
+ let res: any = { data: {} };
+ switch (type) {
+ // 开单数据
+ case 'openOrderColumn':
+ res = await postOpenOrderDataByWarehouseId({});
+ break;
+
+ default:
+ break;
+ }
+ const { code, data } = res.data;
+ if (code !== 200 || getObjType(data) !== 'array') return;
+ details.tableData = data;
+ details.renderData = data;
+ } catch (error) {
+ console.log('error :>> ', error);
+ } finally {
+ details.loadingObj.loading = false;
+ }
+};
+
+/** 导出 */
+const handleExport = () => {
+ exportExcelByDom(exportColumnListNode.value.$el, `${details.title} - ${dateNow()}.xlsx`);
+};
</script>
<style scoped lang="scss">
@@ -1426,6 +1592,16 @@ const billSignforData = computed(() => {
font-size: 14px;
background: #f5f5f6;
padding: 0 5px;
+ position: relative;
+
+ // 弹窗
+ :deep(.el-overlay) {
+ position: absolute;
+ }
+
+ :deep(.el-overlay-dialog) {
+ position: absolute;
+ }
}
.view_box {
@@ -1454,6 +1630,18 @@ const billSignforData = computed(() => {
padding: 0 10px;
}
+.detailsBtn {
+ font-size: 0.9rem;
+ color: var(--el-color-primary);
+ font-weight: bold;
+ cursor: pointer;
+ transition: all 0.3s;
+
+ &:hover {
+ color: #2693ff;
+ }
+}
+
.align_center {
display: flex;
align-items: center;