From 46ec48beb42de969c2e83968ee1696a709b99f33 Mon Sep 17 00:00:00 2001
From: spring <2396852758@qq.com>
Date: 星期五, 16 一月 2026 09:26:36 +0800
Subject: [PATCH] fix: 生产订单-导出接口重新对接
---
/dev/null | 555 -------------------------------------------------------
src/views/productionManagement/productionOrder/index.vue | 9
2 files changed, 1 insertions(+), 563 deletions(-)
diff --git a/src/views/productionManagement/productionOrder/ProcessRouteItemForm.vue b/src/views/productionManagement/productionOrder/ProcessRouteItemForm.vue
deleted file mode 100644
index d202536..0000000
--- a/src/views/productionManagement/productionOrder/ProcessRouteItemForm.vue
+++ /dev/null
@@ -1,555 +0,0 @@
-<template>
- <div>
- <el-dialog v-model="isShow"
- title="宸ヨ壓璺嚎椤圭洰"
- width="800px"
- @close="closeModal">
- <div class="operate-button">
- <el-button type="primary"
- @click="isShowProductSelectDialog = true"
- class="mb5"
- style="margin-bottom: 10px;">
- 閫夋嫨浜у搧
- </el-button>
- <el-switch v-model="isTable"
- inline-prompt
- active-text="琛ㄦ牸"
- inactive-text="鍒楄〃"
- @change="handleViewChange" />
- </div>
- <el-table v-if="isTable"
- ref="multipleTable"
- v-loading="tableLoading"
- border
- :data="routeItems"
- :header-cell-style="{ background: '#F0F1F5', color: '#333333' }"
- row-key="id"
- tooltip-effect="dark"
- class="lims-table"
- style="cursor: move;">
- <el-table-column align="center"
- label="搴忓彿"
- width="60">
- <template #default="scope">
- {{ scope.$index + 1 }}
- </template>
- </el-table-column>
- <el-table-column v-for="(item, index) in tableColumn"
- :key="index"
- :label="item.label"
- :width="item.width"
- show-overflow-tooltip>
- <template #default="scope"
- v-if="item.dataType === 'action'">
- <el-button v-for="(op, opIndex) in item.operation"
- :key="opIndex"
- :type="op.type"
- :link="op.link"
- size="small"
- @click.stop="op.clickFun(scope.row)">
- {{ op.name }}
- </el-button>
- </template>
- <template #default="scope"
- v-else>
- <template v-if="item.prop === 'processId'">
- <el-select v-model="scope.row[item.prop]"
- style="width: 100%;"
- @mousedown.stop>
- <el-option v-for="process in processOptions"
- :key="process.id"
- :label="process.name"
- :value="process.id" />
- </el-select>
- </template>
- <template v-else>
- {{ scope.row[item.prop] || '-' }}
- </template>
- </template>
- </el-table-column>
- </el-table>
- <!-- 浣跨敤鏅�歞iv鏇夸唬el-steps -->
- <div v-else
- ref="stepsContainer"
- class="mb5 custom-steps"
- style="padding: 10px 0; display: flex; flex-wrap: nowrap; gap: 20px; align-items: flex-start;">
- <div v-for="(item, index) in routeItems"
- :key="item.id"
- class="custom-step draggable-step"
- :data-id="item.id"
- style="cursor: move; flex: 0 0 auto; min-width: 220px;">
- <div class="step-content">
- <div class="step-number">{{ index + 1 }}</div>
- <el-card :header="item.productName"
- class="step-card"
- style="cursor: move;">
- <div class="step-card-content">
- <p>{{ item.model }}</p>
- <p>{{ item.unit }}</p>
- <el-select v-model="item.processId"
- style="width: 100%;"
- @mousedown.stop>
- <el-option v-for="process in processOptions"
- :key="process.id"
- :label="process.name"
- :value="process.id" />
- </el-select>
- </div>
- <template #footer>
- <div class="step-card-footer">
- <el-button type="danger"
- link
- size="small"
- @click.stop="removeItemByID(item.id)">鍒犻櫎</el-button>
- </div>
- </template>
- </el-card>
- </div>
- </div>
- </div>
- <template #footer>
- <div class="dialog-footer">
- <el-button type="primary"
- @click="handleSubmit">纭</el-button>
- <el-button @click="closeModal">鍙栨秷</el-button>
- </div>
- </template>
- </el-dialog>
- <ProductSelectDialog v-model="isShowProductSelectDialog"
- @confirm="handelSelectProducts" />
- </div>
-</template>
-
-<script setup>
- import {
- ref,
- computed,
- getCurrentInstance,
- onMounted,
- onUnmounted,
- nextTick,
- } from "vue";
- import ProductSelectDialog from "@/views/basicData/product/ProductSelectDialog.vue";
- import {
- findProductProcessRouteItemList,
- addOrUpdateProductProcessRouteItem,
- deleteRouteItem,
- } from "@/api/productionManagement/productProcessRoute.js";
- import { processList } from "@/api/productionManagement/productionProcess.js";
- import Sortable from "sortablejs";
-
- const props = defineProps({
- visible: {
- type: Boolean,
- required: true,
- default: false,
- },
- record: {
- type: Object,
- required: true,
- default: () => ({}),
- },
- });
-
- const emit = defineEmits(["update:visible", "completed"]);
-
- const processOptions = ref([]);
- const tableLoading = ref(false);
- const isShowProductSelectDialog = ref(false);
- const routeItems = ref([]);
- let tableSortable = null;
- let stepsSortable = null;
- const multipleTable = ref(null);
- const stepsContainer = ref(null);
- const isTable = ref(true);
-
- const isShow = computed({
- get() {
- return props.visible;
- },
- set(val) {
- emit("update:visible", val);
- },
- });
-
- const tableColumn = ref([
- { label: "浜у搧鍚嶇О", prop: "productName", width: 180 },
- { label: "瑙勬牸鍚嶇О", prop: "model", width: 150 },
- { label: "鍗曚綅", prop: "unit", width: 80 },
- { label: "宸ュ簭鍚嶇О", prop: "processId", width: 180 },
- {
- dataType: "action",
- label: "鎿嶄綔",
- align: "center",
- fixed: "right",
- width: 100,
- operation: [
- {
- name: "鍒犻櫎",
- type: "danger",
- link: true,
- clickFun: row => {
- console.log(row.id, "鍒犻櫎");
-
- const dragSortx = routeItems.value.findIndex(
- item => item.dragSort === row.dragSort
- );
- const idx = routeItems.value.findIndex(item => item.id === row.id);
- console.log(idx, "idx");
- if (row.id) {
- deleteRouteItemByIds(row.id, idx);
- } else {
- removeItem(dragSortx);
- }
- },
- },
- ],
- },
- ]);
-
- const removeItem = index => {
- console.log("杞垹闄�", index);
-
- routeItems.value.splice(index, 1);
- updateDragSort();
- nextTick(() => initSortable());
- };
-
- const removeItemByID = id => {
- const idx = routeItems.value.findIndex(item => item.id === id);
- if (idx > -1) {
- routeItems.value.splice(idx, 1);
- updateDragSort();
- nextTick(() => initSortable());
- }
- };
-
- const deleteRouteItemByIds = (id, index) => {
- deleteRouteItem(id).then(res => {
- routeItems.value.splice(index, 1);
- updateDragSort();
- nextTick(() => initSortable());
- });
- };
-
- const closeModal = () => {
- isShow.value = false;
- };
-
- const updateDragSort = () => {
- routeItems.value.forEach((item, index) => {
- item.dragSort = index + 1;
- });
- routeItems.value = [...routeItems.value];
- console.log("鏇存柊鍚庣殑鏁扮粍:", routeItems.value);
- };
-
- const handelSelectProducts = products => {
- destroySortable();
-
- // 璁＄畻鏂扮殑dragSort鍊艰捣濮嬬偣
- const maxDragSort =
- routeItems.value.length > 0
- ? Math.max(...routeItems.value.map(item => item.dragSort || 0))
- : 0;
-
- const newData = products.map(({ id, ...product }, index) => ({
- ...product,
- productModelId: id,
- routeId: props.record.id,
- // id: `${Date.now()}-${Math.random().toString(36).slice(2)}`,
- processId: undefined,
- dragSort: maxDragSort + index + 1,
- }));
-
- console.log("閫夋嫨浜у搧鍓嶆暟缁�:", routeItems.value);
- routeItems.value.push(...newData);
- updateDragSort();
- console.log("閫夋嫨浜у搧鍚庢暟缁�:", routeItems.value);
-
- // 寤惰繜鍒濆鍖栵紝纭繚DOM瀹屽叏娓叉煋
- nextTick(() => {
- // 寮哄埗閲嶆柊娓叉煋缁勪欢
- if (proxy?.$forceUpdate) {
- proxy.$forceUpdate();
- }
-
- const temp = [...routeItems.value];
- routeItems.value = [];
- nextTick(() => {
- routeItems.value = temp;
- initSortable();
- });
- });
- };
-
- const findProcessRouteItems = () => {
- tableLoading.value = true;
- findProductProcessRouteItemList({ orderId: props.record.id })
- .then(res => {
- tableLoading.value = false;
- routeItems.value = res.data.map(item => ({
- ...item,
- processId: item.processId === 0 ? undefined : item.processId,
- }));
- // 寤惰繜鍒濆鍖栵紝纭繚DOM瀹屽叏娓叉煋
- nextTick(() => {
- setTimeout(() => initSortable(), 100);
- });
- })
- .catch(err => {
- tableLoading.value = false;
- console.error("鑾峰彇鍒楄〃澶辫触锛�", err);
- });
- };
-
- const findProcessList = () => {
- processList({})
- .then(res => {
- processOptions.value = res.data;
- })
- .catch(err => {
- console.error("鑾峰彇宸ュ簭澶辫触锛�", err);
- });
- };
-
- const { proxy } = getCurrentInstance() || {};
-
- const handleSubmit = () => {
- const hasEmptyProcess = routeItems.value.some(item => !item.processId);
- if (hasEmptyProcess) {
- proxy?.$modal?.msgError("璇蜂负鎵�鏈夐」鐩�夋嫨宸ュ簭");
- return;
- }
-
- addOrUpdateProductProcessRouteItem({
- routeId: props.record.id,
- processRouteItem: routeItems.value,
- })
- .then(res => {
- isShow.value = false;
- emit("completed");
- proxy?.$modal?.msgSuccess("鎻愪氦鎴愬姛");
- })
- .catch(err => {
- proxy?.$modal?.msgError(`鎻愪氦澶辫触锛�${err.msg || "缃戠粶寮傚父"}`);
- });
- };
-
- const destroySortable = () => {
- if (tableSortable) {
- tableSortable.destroy();
- tableSortable = null;
- }
- if (stepsSortable) {
- stepsSortable.destroy();
- stepsSortable = null;
- }
- };
-
- const initSortable = () => {
- destroySortable();
-
- if (isTable.value) {
- if (!multipleTable.value) return;
- const tbody =
- multipleTable.value.$el.querySelector(".el-table__body tbody") ||
- multipleTable.value.$el.querySelector(
- ".el-table__body-wrapper > table > tbody"
- );
- if (!tbody) return;
-
- tableSortable = new Sortable(tbody, {
- animation: 150,
- ghostClass: "sortable-ghost",
- handle: ".el-table__row",
- filter: ".el-button, .el-select",
- onEnd: evt => {
- if (evt.oldIndex === evt.newIndex || !routeItems.value[evt.oldIndex])
- return;
-
- // 浣跨敤鏁扮粍 splice 鏂规硶閲嶆柊鎺掑簭锛屼笌琛ㄦ牸妯″紡淇濇寔涓�鑷�
- const moveItem = routeItems.value.splice(evt.oldIndex, 1)[0];
- routeItems.value.splice(evt.newIndex, 0, moveItem);
- updateDragSort();
- console.log("鎺掑簭鍚庢暟缁�:", routeItems.value);
- },
- });
- } else {
- if (!stepsContainer.value) return;
-
- // 淇敼锛氱洿鎺ヤ娇鐢╯tepsContainer.value浣滀负鎷栨嫿瀹瑰櫒
- const stepsList = stepsContainer.value;
- if (!stepsList) {
- console.warn("鏈壘鍒版楠ゆ潯鎷栨嫿瀹瑰櫒");
- return;
- }
-
- // 淇敼锛氱畝鍖栨嫋鎷介厤缃�
- stepsSortable = new Sortable(stepsList, {
- animation: 150,
- ghostClass: "sortable-ghost",
- draggable: ".draggable-step", // 鍙嫋鎷藉厓绱�
- handle: ".draggable-step, .step-card", // 鎷栨嫿鎵嬫焺
- filter: ".el-button, .el-select, .el-input", // 杩囨护鎸夐挳/閫夋嫨鍣�
- forceFallback: true,
- fallbackClass: "sortable-fallback",
- preventOnFilter: true,
- scroll: true,
- scrollSensitivity: 30,
- scrollSpeed: 10,
- bubbleScroll: true,
- onEnd: evt => {
- if (evt.oldIndex === evt.newIndex || !routeItems.value[evt.oldIndex])
- return;
-
- // 浣跨敤鏁扮粍 splice 鏂规硶閲嶆柊鎺掑簭
- const moveItem = routeItems.value.splice(evt.oldIndex, 1)[0];
- routeItems.value.splice(evt.newIndex, 0, moveItem);
- updateDragSort();
- },
- });
-
- // 璋冭瘯锛氭墦鍗板鍣ㄥ拰瀹炰緥锛岀‘璁ょ粦瀹氭垚鍔�
- console.log("姝ラ鏉℃嫋鎷藉鍣�:", stepsList);
- console.log("Sortable瀹炰緥:", stepsSortable);
- }
- };
-
- const handleViewChange = () => {
- destroySortable();
- // 寤惰繜鍒濆鍖栵紝纭繚瑙嗗浘鍒囨崲鍚嶥OM瀹屽叏娓叉煋
- nextTick(() => {
- setTimeout(() => initSortable(), 100);
- });
- };
-
- onMounted(() => {
- findProcessRouteItems();
- findProcessList();
- });
-
- onUnmounted(() => {
- destroySortable();
- });
-
- defineExpose({
- closeModal,
- handleSubmit,
- isShow,
- });
-</script>
-
-<style scoped>
- :deep(.sortable-ghost) {
- opacity: 0.6;
- background-color: #f5f7fa !important;
- }
-
- :deep(.el-table__row) {
- transition: background-color 0.2s;
- }
-
- :deep(.el-table__row:hover) {
- background-color: #f9fafc !important;
- }
-
- :deep(.el-card__footer) {
- padding: 0 !important;
- }
-
- .operate-button {
- display: flex;
- align-items: center;
- justify-content: space-between;
- }
-
- /* 淇敼锛氳嚜瀹氫箟姝ラ鏉″鍣ㄦ牱寮� */
- .custom-steps {
- display: flex;
- flex-wrap: wrap;
- align-items: flex-start;
- gap: 20px;
- min-height: 100px;
- }
-
- /* 淇敼锛氳嚜瀹氫箟姝ラ椤规牱寮� */
- .custom-step {
- cursor: move !important;
- padding: 8px;
- position: relative;
- transition: all 0.2s ease;
- flex: 0 0 auto;
- min-width: 220px;
- touch-action: none;
- }
-
- /* 鎷栨嫿鎮诞鏍峰紡锛屾彁绀哄彲鎷栨嫿 */
- .custom-step:hover {
- background-color: rgba(64, 158, 255, 0.05);
- transform: translateY(-2px);
- }
-
- .sortable-ghost {
- opacity: 0.4;
- background-color: #f5f7fa !important;
- border: 2px dashed #409eff;
- margin: 10px;
- transform: scale(1.02);
- }
-
- .sortable-fallback {
- opacity: 0.9;
- background-color: #f5f7fa;
- border: 1px solid #409eff;
- box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
- transform: rotate(2deg);
- margin: 10px;
- }
-
- .step-card {
- cursor: move !important;
- transition: box-shadow 0.2s ease;
- user-select: none;
- -webkit-user-select: none;
- pointer-events: auto;
- margin: 10px;
- height: 240px;
- }
-
- .step-card:hover {
- box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
- }
-
- .step-content {
- width: 220px;
- user-select: none;
- }
-
- .step-card-content {
- display: flex;
- flex-direction: column;
- align-items: center;
- }
-
- .step-card-footer {
- display: flex;
- justify-content: flex-end;
- align-items: center;
- padding: 10px;
- }
-
- /* 鑷畾涔夊簭鍙锋牱寮忎紭鍖� */
- .step-number {
- font-weight: bold;
- text-align: center;
- width: 36px;
- height: 36px;
- line-height: 36px;
- margin: 0 auto 10px;
- background: #409eff;
- color: #fff;
- border-radius: 50%;
- font-size: 14px;
- }
-</style>
diff --git a/src/views/productionManagement/productionOrder/index.vue b/src/views/productionManagement/productionOrder/index.vue
index f6a5d08..9a13a40 100644
--- a/src/views/productionManagement/productionOrder/index.vue
+++ b/src/views/productionManagement/productionOrder/index.vue
@@ -60,10 +60,6 @@
</template>
</PIMTable>
</div>
- <process-route-item-form v-if="isShowItemModal"
- v-model:visible="isShowItemModal"
- :record="record"
- @completed="getList" />
<el-dialog v-model="bindRouteDialogVisible"
title="缁戝畾宸ヨ壓璺嚎"
width="500px">
@@ -104,7 +100,6 @@
} from "@/api/productionManagement/productionOrder.js";
import { listMain as getOrderProcessRouteMain } from "@/api/productionManagement/productProcessRoute.js";
const { proxy } = getCurrentInstance();
- import ProcessRouteItemForm from "@/views/productionManagement/productionOrder/ProcessRouteItemForm.vue";
const router = useRouter();
@@ -318,8 +313,6 @@
});
};
- const isShowItemModal = ref(false);
- const record = ref({});
const showRouteItemModal = async row => {
const orderId = row.id;
try {
@@ -356,7 +349,7 @@
type: "warning",
})
.then(() => {
- proxy.download("/salesLedger/scheduling/export", {}, "鐢熶骇璁㈠崟.xlsx");
+ proxy.download("/productOrder/export", {...searchForm.value}, "鐢熶骇璁㈠崟.xlsx");
})
.catch(() => {
proxy.$modal.msg("宸插彇娑�");
--
Gitblit v1.9.3