From 83fe53a6d902de561bf00a19a3c126d570d69a04 Mon Sep 17 00:00:00 2001
From: 17630416519 <qazwsx123>
Date: Thu, 6 Nov 2025 14:12:15 +0800
Subject: [PATCH] =?UTF-8?q?fix:=E5=B7=A5=E6=AD=A5=E6=A0=91=E5=BD=A2?=
 =?UTF-8?q?=E7=BB=93=E6=9E=84?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/api/system/processmodeloperationstep.js |   9 +
 src/views/processSteps/components/tree.vue  |  55 ++
 src/views/processSteps/index.vue            | 651 ++++++++++----------
 3 files changed, 390 insertions(+), 325 deletions(-)
 create mode 100644 src/views/processSteps/components/tree.vue

diff --git a/src/api/system/processmodeloperationstep.js b/src/api/system/processmodeloperationstep.js
index 16f22ef..e3398f9 100644
--- a/src/api/system/processmodeloperationstep.js
+++ b/src/api/system/processmodeloperationstep.js
@@ -89,4 +89,13 @@ export function delProcessmodelOperationStepDetail(id) {
 		url: 'business/ProcessmodelOperationStep/deleteAccount' + id,
 		method: 'delete'
 	})
+}
+
+//左侧树形结构
+export function listProcessmodelOperationStepTree(query) {
+	return request({
+		url: 'business/ProcessmodelOperationStep/modelProcessList',
+		method: 'get',
+		params: query,
+	})
 }
\ No newline at end of file
diff --git a/src/views/processSteps/components/tree.vue b/src/views/processSteps/components/tree.vue
new file mode 100644
index 0000000..af90c09
--- /dev/null
+++ b/src/views/processSteps/components/tree.vue
@@ -0,0 +1,55 @@
+<template>
+	<div>
+		<el-form>
+			<el-input clearable placeholder="请输入工艺名称" v-model="filterText">
+			</el-input>
+		</el-form>
+
+		<el-tree :data="data" :props="treeProps" :expand-on-click-node="false" ref="deptTreeRef" node-key="processCode"
+			highlight-current default-expand-all :filter-node-method="filterNode" :current-node-key="defaultSelected"
+			@node-click="handleNodeClick" />
+	</div>
+</template>
+
+<script setup name="BaseDeviceTypeTree">
+const props = defineProps({
+	data: {
+		type: Array,
+		default: () => []
+	},
+	defaultSelected: {
+		type: String,
+		default: ''
+	}
+})
+
+const emit = defineEmits()
+
+const { proxy } = getCurrentInstance()
+const filterText = ref('')
+const deptTreeRef = ref()
+
+// 定义树节点的显示属性
+const treeProps = {
+	label: (data) => {
+		return data.processName || '暂无数据';
+	}
+}
+
+// 监听过滤文本变化
+watch(filterText, (val) => {
+	deptTreeRef.value.filter(val)
+})
+
+// 树节点过滤方法
+function filterNode(value, data) {
+	if (!value) return true
+	return (data.processName && data.processName.includes(value))
+}
+
+function handleNodeClick(data) {
+	emit('selected', data.processCode)
+}
+</script>
+
+<style lang="scss" scoped></style>
\ No newline at end of file
diff --git a/src/views/processSteps/index.vue b/src/views/processSteps/index.vue
index 7fd233d..78d3dcc 100644
--- a/src/views/processSteps/index.vue
+++ b/src/views/processSteps/index.vue
@@ -1,105 +1,99 @@
 <template>
 	<div>
-		<el-form :model="queryParams" label-position="right" inline ref="queryRef" v-show="showSearch" @submit.prevent>
-			<el-form-item label="工步编码" prop="stepCode">
-				<el-input v-model="queryParams.stepCode" placeholder="请输入工步编码" clearable />
-			</el-form-item>
-			<el-form-item label="工步名称" prop="stepName">
-				<el-input v-model="queryParams.stepName" placeholder="请输入工步名称" clearable />
-			</el-form-item>
-			<el-form-item>
-				<el-button icon="search" type="primary" @click="handleQuery">{{ $t('btn.search') }}</el-button>
-				<el-button icon="refresh" @click="resetQuery">{{ $t('btn.reset') }}</el-button>
-			</el-form-item>
-		</el-form>
 		<el-row>
-
-		</el-row>
-		<!-- 工具区域 -->
-		<el-row :gutter="15" class="mb10">
-			<el-col :span="1.5">
-				<el-button type="primary" v-hasPermi="['business:processmodeloperationstep:add']" plain icon="plus"
-					@click="handleAdd">
-					{{ $t('btn.add') }}
-				</el-button>
+			<el-col :span="3">
+				<Typetree :data="treeData" :default-selected="defaultSelectedProcessCode"
+					@selected="handlerTreeSelected">
+				</Typetree>
+			</el-col>
+			<el-col :span="21">
+				<el-form :model="queryParams" label-position="right" inline ref="queryRef" v-show="showSearch"
+					@submit.prevent>
+					<el-form-item label="工步编码" prop="stepCode">
+						<el-input v-model="queryParams.stepCode" placeholder="请输入工步编码" clearable />
+					</el-form-item>
+					<el-form-item label="工步名称" prop="stepName">
+						<el-input v-model="queryParams.stepName" placeholder="请输入工步名称" clearable />
+					</el-form-item>
+					<el-form-item>
+						<el-button icon="search" type="primary" @click="handleQuery">{{ $t('btn.search') }}</el-button>
+						<el-button icon="refresh" @click="resetQuery">{{ $t('btn.reset') }}</el-button>
+					</el-form-item>
+				</el-form>
+				<!-- 工具区域 -->
+				<el-row :gutter="15" class="mb10">
+					<el-col :span="1.5">
+						<el-button type="primary" v-hasPermi="['business:processmodeloperationstep:add']" plain
+							icon="plus" @click="handleAdd">
+							{{ $t('btn.add') }}
+						</el-button>
+					</el-col>
+					<right-toolbar v-model:showSearch="showSearch" @queryTable="getList"
+						:columns="columns"></right-toolbar>
+				</el-row>
+
+				<el-table :data="dataList" v-loading="loading" ref="table" border
+					header-cell-class-name="el-table-header-cell" highlight-current-row @sort-change="sortChange">
+					<el-table-column prop="stepCode" label="工步编码" align="center" :show-overflow-tooltip="true"
+						v-if="columns.showColumn('stepCode')" />
+					<el-table-column prop="stepName" label="工步名称" align="center" :show-overflow-tooltip="true"
+						v-if="columns.showColumn('stepName')" />
+					<el-table-column prop="processCode" label="所属工序" align="center" :show-overflow-tooltip="true"
+						v-if="columns.showColumn('operationCode')" />
+					<el-table-column prop="description" label="工步描述" align="center" :show-overflow-tooltip="true"
+						v-if="columns.showColumn('description')" />
+					<el-table-column prop="createTime" label="创建时间" align="center" :show-overflow-tooltip="true" />
+					<el-table-column prop="updateTime" label="更新时间" align="center" :show-overflow-tooltip="true" />
+					<el-table-column prop="isActive" label="是否有效" align="center" v-if="columns.showColumn('isActive')">
+						<template #default="scope">
+							<el-tag v-if="scope.row.isActive == '1'" type="success">有效</el-tag>
+							<el-tag v-if="scope.row.isActive == '0'" type="danger">无效</el-tag>
+						</template>
+					</el-table-column>
+					<el-table-column prop="remark" label="备注" align="center" :show-overflow-tooltip="true"
+						v-if="columns.showColumn('remark')" />
+					<el-table-column label="操作" width="200">
+						<template #default="scope">
+							<el-button type="warning" size="small" title="详情"
+								@click="handleDetails(scope.row)">详情</el-button>
+							<el-button type="success" size="small" title="编辑"
+								v-hasPermi="['business:processmodeloperationstep:edit']"
+								@click="handleUpdate(scope.row)">编辑</el-button>
+							<el-button type="danger" size="small" title="删除"
+								v-hasPermi="['business:processmodeloperationstep:delete']"
+								@click="handleDelete(scope.row)">删除</el-button>
+						</template>
+					</el-table-column>
+				</el-table>
+				<pagination :total="total" v-model:page="queryParams.pageNum" v-model:limit="queryParams.pageSize"
+					@pagination="getList" />
 			</el-col>
-			<right-toolbar v-model:showSearch="showSearch" @queryTable="getList" :columns="columns"></right-toolbar>
 		</el-row>
 
-		<el-table :data="dataList" v-loading="loading" ref="table" border header-cell-class-name="el-table-header-cell"
-			highlight-current-row @sort-change="sortChange">
-			<el-table-column prop="stepCode" label="工步编码" align="center" :show-overflow-tooltip="true"
-				v-if="columns.showColumn('stepCode')" />
-			<el-table-column prop="stepName" label="工步名称" align="center" :show-overflow-tooltip="true"
-				v-if="columns.showColumn('stepName')" />
-			<el-table-column prop="processCode" label="所属工序" align="center" :show-overflow-tooltip="true"
-				v-if="columns.showColumn('operationCode')" />
-			<el-table-column prop="description" label="工步描述" align="center" :show-overflow-tooltip="true"
-				v-if="columns.showColumn('description')" />
-			<el-table-column prop="createTime" label="创建时间" align="center" :show-overflow-tooltip="true" />
-			<el-table-column prop="updateTime" label="更新时间" align="center" :show-overflow-tooltip="true" />
-			<el-table-column prop="isActive" label="是否有效" align="center" v-if="columns.showColumn('isActive')">
-				<template #default="scope">
-					<!-- <dict-tag :options="options.isActiveOptions" :value="scope.row.isActive" /> -->
-					<el-tag v-if="scope.row.isActive == '1'" type="success">有效</el-tag>
-					<el-tag v-if="scope.row.isActive == '0'" type="danger">无效</el-tag>
-				</template>
-			</el-table-column>
-			<el-table-column prop="remark" label="备注" align="center" :show-overflow-tooltip="true"
-				v-if="columns.showColumn('remark')" />
-			<el-table-column label="操作" width="200">
-				<template #default="scope">
-					<el-button type="warning" size="small" title="详情" @click="handleDetails(scope.row)">详情</el-button>
-					<el-button type="success" size="small" title="编辑"
-						v-hasPermi="['business:processmodeloperationstep:edit']"
-						@click="handleUpdate(scope.row)">编辑</el-button>
-					<el-button type="danger" size="small" title="删除"
-						v-hasPermi="['business:processmodeloperationstep:delete']"
-						@click="handleDelete(scope.row)">删除</el-button>
-				</template>
-			</el-table-column>
-		</el-table>
-		<pagination :total="total" v-model:page="queryParams.pageNum" v-model:limit="queryParams.pageSize"
-			@pagination="getList" />
-
-
 		<!-- 添加或修改对话框 -->
 		<el-dialog :title="title" :lock-scroll="false" v-model="open">
 			<el-form ref="formRef" :model="form" :rules="rules" label-width="120px">
 				<el-row :gutter="20">
-
 					<el-col :lg="12">
 						<el-form-item label="工步编码" prop="stepCode">
 							<el-input v-model="form.stepCode" placeholder="请输入工步编码" />
 						</el-form-item>
 					</el-col>
-
 					<el-col :lg="12">
 						<el-form-item label="工步名称" prop="stepName">
 							<el-input v-model="form.stepName" placeholder="请输入工步名称" />
 						</el-form-item>
 					</el-col>
-
 					<el-col :lg="12">
 						<el-form-item label="所属工序" prop="processCode">
 							<el-input v-model="form.processCode" placeholder="请输入所属工序" />
 						</el-form-item>
 					</el-col>
-
 					<el-col :lg="12">
 						<el-form-item label="工步描述" prop="description">
 							<el-input v-model="form.description" placeholder="请输入工步描述" />
 						</el-form-item>
 					</el-col>
-					<!-- <el-col :lg="12">
-						<el-form-item label="绑定设备" prop="bindDeviceValue">
-							<el-select v-model="form.bindDeviceValue" placeholder="请选择">
-								<el-option v-for="item in bindDeviceOptions" :key="item.value" :label="item.label"
-									:value="item.value">
-								</el-option>
-							</el-select>
-						</el-form-item>
-					</el-col> -->
 					<el-col :lg="12">
 						<el-form-item label="是否有效" prop="isActive">
 							<el-select v-model="form.isActive" placeholder="请选择">
@@ -109,7 +103,6 @@
 							</el-select>
 						</el-form-item>
 					</el-col>
-
 					<el-col :lg="12">
 						<el-form-item label="备注" prop="remark">
 							<el-input v-model="form.remark" placeholder="请输入备注" />
@@ -126,27 +119,28 @@
 		<!-- 详情 -->
 		<el-dialog v-model="dialogTableVisible" title="详情" width="1200">
 			<el-descriptions :column="2" border>
-				<el-descriptions-item label="工步编码">{{ detailForm.stepCode }}</el-descriptions-item>
-				<el-descriptions-item label="工步名称">{{ detailForm.stepName }}</el-descriptions-item>
-				<el-descriptions-item label="所属工序">{{ detailForm.processCode }}</el-descriptions-item>
-				<el-descriptions-item label="工步描述">{{ detailForm.description }}</el-descriptions-item>
+				<el-descriptions-item label="工步编码">{{ detailForm.stepCode || '-' }}</el-descriptions-item>
+				<el-descriptions-item label="工步名称">{{ detailForm.stepName || '-' }}</el-descriptions-item>
+				<el-descriptions-item label="所属工序">{{ detailForm.processCode || '-' }}</el-descriptions-item>
+				<el-descriptions-item label="工步描述">{{ detailForm.description || '-' }}</el-descriptions-item>
 				<el-descriptions-item label="是否有效">
 					<el-tag v-if="detailForm.isActive == '1'" type="success">有效</el-tag>
 					<el-tag v-if="detailForm.isActive == '0'" type="danger">无效</el-tag>
+					<span v-else>-</span>
 				</el-descriptions-item>
-				<el-descriptions-item label="备注">{{ detailForm.remark }}</el-descriptions-item>
-				<el-descriptions-item label="创建时间">{{ detailForm.createTime }}</el-descriptions-item>
-				<el-descriptions-item label="更新时间">{{ detailForm.updateTime }}</el-descriptions-item>
+				<el-descriptions-item label="备注">{{ detailForm.remark || '-' }}</el-descriptions-item>
+				<el-descriptions-item label="创建时间">{{ detailForm.createTime || '-' }}</el-descriptions-item>
+				<el-descriptions-item label="更新时间">{{ detailForm.updateTime || '-' }}</el-descriptions-item>
 			</el-descriptions>
 
 			<el-divider>关联信息</el-divider>
 
 			<el-form :inline="true" class="mt10" ref="detailQueryRef">
 				<el-form-item label="设备名称">
-					<el-input v-model="detailQuery.deviceName" placeholder="请输入工步名称" />
+					<el-input v-model="detailQuery.deviceName" placeholder="请输入设备名称" />
 				</el-form-item>
 				<el-form-item label="设备编号">
-					<el-input v-model="detailQuery.deviceCode" placeholder="请输入工步编码" />
+					<el-input v-model="detailQuery.deviceCode" placeholder="请输入设备编号" />
 				</el-form-item>
 				<el-form-item>
 					<el-button icon="search" type="primary" @click="handleDetailQuery">{{ $t('btn.search')
@@ -170,18 +164,10 @@
 				<el-table-column prop="workshop" label="所属车间" align="center" />
 				<el-table-column prop="workline" label="所属产线" align="center" />
 				<el-table-column prop="status" label="设备状态" align="center" />
-				<!-- <el-table-column prop="isActive" label="是否有效" align="center">
-					<template #default="scope">
-						<el-tag v-if="scope.row.isActive == 'True'" type="success">有效</el-tag>
-						<el-tag v-if="scope.row.isActive == 'False'" type="danger">无效</el-tag>
-					</template>
-				</el-table-column> -->
 				<el-table-column prop="deviceSpecification" label="设备规格" align="center" />
 				<el-table-column prop="responsiblePerson" label="设备负责人" align="center" />
-				<!-- <el-table-column prop="remark" label="备注" align="center" /> -->
 				<el-table-column label="操作" width="150" align="center">
 					<template #default="scope">
-						<el-button type="primary" size="small" @click="handleEditDetail(scope.row)">编辑</el-button>
 						<el-button type="danger" size="small" @click="handleDeleteDetail(scope.row)">删除</el-button>
 					</template>
 				</el-table-column>
@@ -189,10 +175,6 @@
 
 			<pagination :total="detailFilteredTotal" v-model:page="detailQuery.pageNum"
 				v-model:limit="detailQuery.pageSize" @pagination="handleDetailQuery" class="mt10" />
-
-			<!-- <template #footer>
-				<el-button @click="dialogTableVisible = false">{{ $t('btn.close') }}</el-button>
-			</template> -->
 		</el-dialog>
 
 		<!-- 详情中的新增或修改对话框 -->
@@ -218,10 +200,13 @@ import {
 	addProcessmodelOperationStep, delProcessmodelOperationStep,
 	updateProcessmodelOperationStep, getProcessmodelOperationStep,
 	listProcessmodelOperationStepDetail, addProcessmodelOperationStepDetail,
-	listProcessmodelOperationStepCascade, delProcessmodelOperationStepDetail
-}
-	from '@/api/system/processmodeloperationstep.js'
-import { dayjs, stepProps, ElMessage } from 'element-plus'
+	listProcessmodelOperationStepCascade, delProcessmodelOperationStepDetail,
+	listProcessmodelOperationStepTree
+} from '@/api/system/processmodeloperationstep.js'
+import { ElMessage } from 'element-plus'
+import { default as Typetree } from './components/tree.vue'
+import { nextTick, getCurrentInstance } from "vue"
+
 const { proxy } = getCurrentInstance()
 const ids = ref([])
 const loading = ref(false)
@@ -230,11 +215,19 @@ const dialogTableVisible = ref(false)
 const queryParams = reactive({
 	pageNum: 1,
 	pageSize: 10,
+	ProcessCode: '',
 	sort: '',
 	sortType: 'asc',
 })
+// 级联选择器值（确保始终是数组）
 const cascadePullDownValue = ref([])
+// 级联选择器数据源（确保始终是数组）
 const cascadePullDown = ref([])
+
+// 树相关数据
+const treeData = ref([])
+const defaultSelectedProcessCode = ref('')
+
 // 详情相关数据
 const detailForm = ref({})
 const detailGridData = ref([])
@@ -275,20 +268,57 @@ const dataList = ref([])
 const queryRef = ref()
 const defaultTime = ref([new Date(2000, 1, 1, 0, 0, 0), new Date(2000, 2, 1, 23, 59, 59)])
 
+// 获取树数据
+function getTreeList() {
+	const treeParams = {
+		status: 1
+	}
 
-var dictParams = [
-]
+	return listProcessmodelOperationStepTree(treeParams).then((res) => {
+		// 确保treeData始终是数组
+		if (res.code === 200 && Array.isArray(res.data)) {
+			const dataWithTreeStructure = res.data.map((item) => ({
+				...item,
+				id: item.processCode,
+				parentId: item.parentId ?? null
+			}));
+			treeData.value = proxy.handleTree(dataWithTreeStructure, 'id', 'parentId', 'children') || [];
+		} else {
+			treeData.value = [];
+			console.error('树形数据格式异常，已重置为空数组');
+		}
 
+		// 默认选中第一个元素
+		if (treeData.value.length > 0) {
+			defaultSelectedProcessCode.value = treeData.value[0].processCode;
+			queryParams.ProcessCode = treeData.value[0].processCode;
+			return getList();
+		}
+	}).catch(err => {
+		console.error('树形数据请求异常', err);
+		treeData.value = []; // 异常时兜底为空数组
+	})
+}
 
 function getList() {
 	loading.value = true
 	listProcessmodelOperationStep(queryParams).then(res => {
-		const { code, data } = res
-		if (code == 200) {
-			dataList.value = data.result
-			total.value = data.totalNum
-			loading.value = false
+		loading.value = false;
+		// 确保列表数据始终是数组
+		if (res.code === 200 && res.data) {
+			dataList.value = Array.isArray(res.data.result) ? res.data.result : [];
+			total.value = Number(res.data.totalNum) || 0;
+		} else {
+			dataList.value = [];
+			total.value = 0;
+			ElMessage.error('数据加载失败');
 		}
+	}).catch(err => {
+		loading.value = false;
+		dataList.value = [];
+		total.value = 0;
+		console.error('列表数据请求异常', err);
+		ElMessage.error('数据加载异常');
 	})
 }
 
@@ -301,50 +331,28 @@ function handleQuery() {
 // 重置查询操作
 function resetQuery() {
 	proxy.resetForm("queryRef")
+	queryParams.ProcessCode = ''
 	handleQuery()
 }
+
 // 自定义排序
 function sortChange(column) {
-	var sort = undefined
-	var sortType = undefined
-
-	if (column.prop != null && column.order != null) {
-		sort = column.prop
-		sortType = column.order
-
-	}
-	queryParams.sort = sort
-	queryParams.sortType = sortType
+	queryParams.sort = column.prop || '';
+	queryParams.sortType = column.order || 'asc';
 	handleQuery()
 }
-const value = ref('')
+
 const options = [
-	{
-		value: '1',
-		label: '有效',
-	},
-	{
-		value: '0',
-		label: '无效',
-	},
-
+	{ value: '1', label: '有效' },
+	{ value: '0', label: '无效' },
 ]
 
-// 当前可选的线别选项
-const lineOptions = ref([])
-
-// 当前可选的设备选项
-const deviceOptions = ref([])
-
 /*************** form操作 ***************/
 const formRef = ref()
 const title = ref('')
-// 操作类型 1、add 2、edit 3、view
 const opertype = ref(0)
 const open = ref(false)
 const state = reactive({
-	single: true,
-	multiple: true,
 	form: {},
 	rules: {
 		stepCode: [{ required: true, message: "工步编码不能为空", trigger: "blur" }],
@@ -352,10 +360,9 @@ const state = reactive({
 		processCode: [{ required: true, message: "所属工序不能为空", trigger: "blur" }],
 		isActive: [{ required: true, message: "是否有效不能为空", trigger: "blur" }],
 	},
-
 })
 
-const { form, rules, single, multiple } = toRefs(state)
+const { form, rules } = toRefs(state)
 
 // 关闭dialog
 function cancel() {
@@ -380,6 +387,7 @@ function reset() {
 	};
 	proxy.resetForm("formRef")
 }
+
 // 添加按钮操作
 function handleAdd() {
 	reset();
@@ -387,46 +395,66 @@ function handleAdd() {
 	title.value = '添加工步'
 	opertype.value = 1
 }
+
 // 修改按钮操作
 function handleUpdate(row) {
 	reset()
 	const id = row.id || ids.value
 	getProcessmodelOperationStep(id).then((res) => {
-		const { code, data } = res
-		if (code == 200) {
+		if (res.code === 200 && res.data) {
 			open.value = true
 			title.value = '修改工步'
 			opertype.value = 2
-
 			form.value = {
-				...data,
-				isActive: data.isActive === 'True' ? '1' : (data.isActive === 'False' ? '0' : data.isActive),
+				...res.data,
+				isActive: res.data.isActive === 'True' ? '1' : (res.data.isActive === 'False' ? '0' : res.data.isActive),
 			}
+		} else {
+			ElMessage.error('数据获取失败');
 		}
+	}).catch(err => {
+		console.error('详情数据请求异常', err);
+		ElMessage.error('数据获取异常');
 	})
 }
 
+// 树形结构选中事件
+function handlerTreeSelected(val) {
+	queryParams.ProcessCode = val;
+	getList()
+}
+
 // 添加&修改 表单提交
 function submitForm() {
 	proxy.$refs["formRef"].validate((valid) => {
 		if (valid) {
-			// 确保时间格式正确
-			const submitForm = {
-				...form.value,
-				// isActive: form.value.isActive === '1' ? 'True' : 'False'
-			}
+			const submitForm = { ...form.value }
 
 			if (form.value.id != undefined && opertype.value === 2) {
 				updateProcessmodelOperationStep(submitForm).then((res) => {
-					proxy.$modal.msgSuccess("修改成功")
-					open.value = false
-					getList()
+					if (res.code === 200) {
+						proxy.$modal.msgSuccess("修改成功")
+						open.value = false
+						getList()
+					} else {
+						ElMessage.error(res.msg || '修改失败');
+					}
+				}).catch(err => {
+					console.error('修改请求异常', err);
+					ElMessage.error('修改异常');
 				})
 			} else {
 				addProcessmodelOperationStep(submitForm).then((res) => {
-					proxy.$modal.msgSuccess("新增成功")
-					open.value = false
-					getList()
+					if (res.code === 200) {
+						proxy.$modal.msgSuccess("新增成功")
+						open.value = false
+						getList()
+					} else {
+						ElMessage.error(res.msg || '新增失败');
+					}
+				}).catch(err => {
+					console.error('新增请求异常', err);
+					ElMessage.error('新增异常');
 				})
 			}
 		}
@@ -436,72 +464,92 @@ function submitForm() {
 // 删除按钮操作
 function handleDelete(row) {
 	const Ids = row.id || ids.value
-	proxy
-		.$confirm('是否确认删除参数编号为"' + Ids + '"的数据项？')
+	proxy.$confirm('是否确认删除参数编号为"' + Ids + '"的数据项？')
 		.then(function () {
 			return delProcessmodelOperationStep(Ids)
 		})
-		.then(() => {
-			getList()
-			proxy.$modal.msgSuccess("删除成功")
+		.then(res => {
+			if (res.code === 200) {
+				proxy.$modal.msgSuccess("删除成功")
+				getList()
+			} else {
+				ElMessage.error(res.msg || '删除失败');
+			}
+		})
+		.catch(err => {
+			if (err !== 'cancel') {
+				console.error('删除请求异常', err);
+				ElMessage.error('删除异常');
+			}
 		})
 }
+
+// 详情相关
 const detailId = ref(null)
 const detailFilteredTotal = ref(0)
-// 详情相关函数
+const stepCode = ref('')
+const processCode = ref('')
+
 function handleDetails(row) {
 	dialogTableVisible.value = true
 	detailId.value = row.id
 	processCode.value = row.processCode
 	stepCode.value = row.stepCode
 	detailQuery.stepCode = row.stepCode
-	// 设置详情表单数据
 	detailForm.value = { ...row }
+
+	// 加载详情列表数据（确保数组）
 	listProcessmodelOperationStepDetail(detailQuery).then(res => {
-		console.log(res, '详情数据123');
-		if (res.code == 200) {
-			detailGridData.value = res.data
-			detailFilteredTotal.value = res.totalNum
-			nextTick(() => {
-				listProcessmodelOperationStepCascade().then(res => {
-					console.log(res, '下拉数据');
-					if (res.code == 200) {
-						// 转换数据为级联选择器所需格式
-						cascadePullDown.value = transformCascadeData(res.data)
-					}
-				})
-			})
+		if (res.code === 200) {
+			detailGridData.value = Array.isArray(res.data) ? res.data : [];
+			detailFilteredTotal.value = Number(res.totalNum) || 0;
+		} else {
+			detailGridData.value = [];
+			detailFilteredTotal.value = 0;
+			console.error('详情列表数据格式异常，已重置为空数组');
 		}
+
+		// 加载级联选择器数据（核心修复点）
+		listProcessmodelOperationStepCascade().then(res => {
+			// 无论接口返回什么，确保cascadePullDown是数组
+			cascadePullDown.value = transformCascadeData(res.code === 200 ? res.data : null);
+			console.log('级联数据最终格式:', cascadePullDown.value, '是否为数组:', Array.isArray(cascadePullDown.value));
+		}).catch(err => {
+			console.error('级联数据请求异常', err);
+			cascadePullDown.value = []; // 异常时强制为空数组
+		});
+	}).catch(err => {
+		detailGridData.value = [];
+		detailFilteredTotal.value = 0;
+		console.error('详情列表请求异常', err);
 	})
 }
 
-// 将接口返回的数据转换为 cascader 组件所需的数据格式
+// 转换级联数据格式（确保返回值一定是数组）
 function transformCascadeData(data) {
-	return data.map(workshopItem => {
-		return {
-			value: workshopItem.workshop,
-			label: workshopItem.workshop,
-			children: workshopItem.worklines?.map(lineItem => {
-				return {
-					value: lineItem.workline,
-					label: lineItem.workline,
-					children: lineItem.devices?.map(deviceItem => {
-						return {
-							value: deviceItem.deviceCode,
-							label: deviceItem.deviceName,
-							deviceCode: deviceItem.deviceCode,
-							deviceName: deviceItem.deviceName
-						}
-					}) || []
-				}
-			}) || []
-		}
-	})
-}
-
-// 获取详情列表
-function getDetailList() {
+	// 第一层校验：如果不是数组，直接返回空数组
+	if (!data || !Array.isArray(data)) {
+		console.warn('级联原始数据不是数组，返回空数组');
+		return [];
+	}
 
+	// 第二层校验：处理每个层级，确保children是数组
+	return data.map(workshopItem => ({
+		value: workshopItem.workshop || '',
+		label: workshopItem.workshop || '',
+		// 确保worklines是数组
+		children: Array.isArray(workshopItem.worklines) ? workshopItem.worklines.map(lineItem => ({
+			value: lineItem.workline || '',
+			label: lineItem.workline || '',
+			// 确保devices是数组
+			children: Array.isArray(lineItem.devices) ? lineItem.devices.map(deviceItem => ({
+				value: deviceItem.deviceCode || '',
+				label: deviceItem.deviceName || '',
+				deviceCode: deviceItem.deviceCode || '',
+				deviceName: deviceItem.deviceName || ''
+			})) : [] // 非数组则返回空数组
+		})) : [] // 非数组则返回空数组
+	}));
 }
 
 // 详情查询
@@ -515,74 +563,53 @@ function resetDetailQuery() {
 	detailQuery.pageNum = 1
 	detailQuery.deviceName = ''
 	detailQuery.deviceCode = ''
-	detailQuery.stepName = null
 	getDetailList1()
 }
 
 // 添加详情项
 function handleAddDetail() {
 	detailFormModel.value = {
-		id: undefined,
-		stepCode: null,
-		stepName: null,
-		processCode: null,
-		description: null,
-		workshop: null,
-		lineCode: null,
-		bindDevice: null,
-		isActive: null,
-		remark: null,
-	}
+		stepCode: stepCode.value,
+		processCode: processCode.value
+	};
+	cascadePullDownValue.value = []; // 重置为数组
 	detailTitle.value = '绑定设备'
 	detailOpen.value = true
 }
-const stepCode = ref('')
-const processCode = ref('')
-const deviceCode = ref('')
-// 编辑详情项
-function handleEditDetail(row) {
-	console.log(row, 'row');
-	detailFormModel.value = { ...row }
-	// 转换 isActive 值以匹配下拉选项
-	if (row.isActive === 'True') {
-		detailFormModel.value.isActive = '1'
-	} else if (row.isActive === 'False') {
-		detailFormModel.value.isActive = '0'
-	}
 
-	// 初始化级联选项
-	if (row.workshop) {
-		handleWorkshopChange(row.workshop, false);
-	}
-
-	if (row.lineCode) {
-		handleLineChange(row.lineCode, false);
-	}
-
-	detailTitle.value = '修改工步'
-	detailOpen.value = true
-}
+// 获取详情列表
 function getDetailList1() {
 	listProcessmodelOperationStepDetail(detailQuery).then(res => {
-		if (res.code == 200) {
-			detailGridData.value = res.data
-			detailFilteredTotal.value = res.totalNum
+		if (res.code === 200) {
+			detailGridData.value = Array.isArray(res.data) ? res.data : [];
+			detailFilteredTotal.value = Number(res.totalNum) || 0;
+		} else {
+			detailGridData.value = [];
+			detailFilteredTotal.value = 0;
+			ElMessage.error('关联数据加载失败');
 		}
+	}).catch(err => {
+		detailGridData.value = [];
+		detailFilteredTotal.value = 0;
+		console.error('关联数据请求异常', err);
+		ElMessage.error('关联数据加载异常');
 	})
 }
 
 // 删除详情项
 function handleDeleteDetail(row) {
-	proxy.$modal.confirm(`是否确认删除工步"${row.id}"?`).then(() => {
-		// 模拟删除操作
+	proxy.$modal.confirm(`是否确认删除该关联记录?`).then(() => {
 		delProcessmodelOperationStepDetail(row.id).then(res => {
 			if (res.code === 200) {
 				proxy.$modal.msgSuccess("删除成功")
 				getDetailList1()
+			} else {
+				ElMessage.error(res.msg || '删除失败');
 			}
+		}).catch(err => {
+			console.error('删除关联记录异常', err);
+			ElMessage.error('删除异常');
 		})
-
-
 	}).catch(() => { })
 }
 
@@ -590,113 +617,87 @@ function handleDeleteDetail(row) {
 function detailCancel() {
 	detailOpen.value = false
 	detailFormModel.value = {}
+	cascadePullDownValue.value = []; // 强制为空数组
 }
 
-/**
- * 车间选择变化时触发
- */
-function handleWorkshopChange(workshopValue, needReset = true) {
-	// 清空线别和设备的选择
-	if (needReset) {
-		detailFormModel.value.lineCode = ''
-		detailFormModel.value.bindDevice = ''
-	}
-
-	// 根据选中的车间筛选线别选项
-	lineOptions.value = allLineOptions.value.filter(item => item.workshop === workshopValue)
-
-	// 清空设备选项
-	deviceOptions.value = []
-}
-
-/**
- * 线别选择变化时触发
- */
-function handleLineChange(lineValue, needReset = true) {
-	// 清空设备的选择
-	if (needReset) {
-		detailFormModel.value.bindDevice = ''
-	}
-
-	// 根据选中的车间和线别筛选设备选项
-	deviceOptions.value = allDeviceOptions.value.filter(
-		item => item.workshop === detailFormModel.value.workshop && item.line === lineValue
-	)
-}
-
-// 处理级联选择器值变化
+// 处理级联选择器变化
 function handleChange(value) {
-	// 获取完整的路径信息
-	const path = getCascaderPath(cascadePullDown.value, value)
-
-	if (path && path.length >= 3) {
-		detailFormModel.value.workshop = path[0]   // 车间
-		detailFormModel.value.lineCode = path[1]   // 产线
-		detailFormModel.value.bindDevice = path[2] // 设备编码
-
-		// 查找设备详细信息
-		const deviceInfo = findDeviceInfo(cascadePullDown.value, path)
-		if (deviceInfo) {
-			detailFormModel.value.deviceName = deviceInfo.deviceName
-			detailFormModel.value.deviceCode = deviceInfo.deviceCode
-		}
+	// 确保value是数组
+	if (!Array.isArray(value) || value.length === 0) {
+		detailFormModel.workshop = '';
+		detailFormModel.lineCode = '';
+		detailFormModel.bindDevice = '';
+		return;
 	}
+
+	const path = getCascaderPath(cascadePullDown.value, value[value.length - 1]);
+	if (!path || path.length < 3) {
+		detailFormModel.workshop = '';
+		detailFormModel.lineCode = '';
+		detailFormModel.bindDevice = '';
+		return;
+	}
+
+	detailFormModel.workshop = path[0];
+	detailFormModel.lineCode = path[1];
+	detailFormModel.bindDevice = path[2];
 }
 
-// 根据选中的值获取完整路径
+// 获取级联选择器完整路径
 function getCascaderPath(options, value) {
-	for (let i = 0; i < options.length; i++) {
-		const option = options[i]
-		if (option.children && option.children.length > 0) {
-			const result = getCascaderPath(option.children, value)
+	// 确保options是数组
+	if (!Array.isArray(options)) return null;
+
+	for (const option of options) {
+		if (option.children && Array.isArray(option.children) && option.children.length > 0) {
+			const result = getCascaderPath(option.children, value);
 			if (result) {
-				return [option.value, ...result]
+				return [option.value, ...result];
 			}
 		} else if (option.value === value) {
-			return [option.value]
+			return [option.value];
 		}
 	}
-	return null
-}
-
-// 根据路径查找设备信息
-function findDeviceInfo(options, path) {
-	if (path.length !== 3) return null
-
-	const [workshopValue, lineValue, deviceValue] = path
-
-	const workshop = options.find(w => w.value === workshopValue)
-	if (!workshop || !workshop.children) return null
-
-	const line = workshop.children.find(l => l.value === lineValue)
-	if (!line || !line.children) return null
-
-	const device = line.children.find(d => d.value === deviceValue)
-	return device || null
+	return null;
 }
 
 // 提交详情表单
 function submitDetailForm() {
-	console.log(cascadePullDownValue.value, '下拉去的值');
-	let data = {
+	// 确保级联值是数组且有选中项
+	// if (!Array.isArray(cascadePullDownValue.value) || cascadePullDownValue.value.length === 0) {
+	// 	ElMessage.error('请选择设备');
+	// 	return;
+	// }
+	// 取最后一级作为设备编码
+	const deviceCode = cascadePullDownValue.value
+	// if (!deviceCode) {
+	// 	ElMessage.error('请选择完整的设备信息');
+	// 	return;
+	// }
+
+	const data = {
 		ProcessCode: processCode.value,
 		StepCode: stepCode.value,
-		DeviceCode: cascadePullDownValue.value,
-	}
-	console.log(data, 'data123');
-	addProcessmodelOperationStepDetail(data).then((res) => {
-		if (res.code == 200) {
-			detailOpen.value = false
-			nextTick(() => {
-				ElMessage.success('绑定成功');
-				getDetailList1()
-			})
+		DeviceCode: deviceCode
+	};
 
+	addProcessmodelOperationStepDetail(data).then(res => {
+		if (res.code === 200) {
+			detailOpen.value = false;
+			ElMessage.success('绑定成功');
+			getDetailList1();
+		} else {
+			ElMessage.error(res.msg || '绑定失败');
 		}
+	}).catch(err => {
+		console.error('设备绑定请求异常', err);
+		ElMessage.error('绑定异常');
 	})
 }
 
-handleQuery()
+onMounted(() => {
+	getTreeList();
+})
 </script>
 
 <style scoped>