<template>
|
<view class="process-params">
|
<PageHeader :title="processName + ' - 参数配置'"
|
@back="goBack" />
|
<view class="ledger-list">
|
<view v-if="paramList.length > 0">
|
<view v-for="item in paramList"
|
:key="item.id"
|
class="ledger-item">
|
<view class="item-header">
|
<view class="item-left">
|
<view class="document-icon">
|
<up-icon name="setting-fill"
|
size="16"
|
color="#ffffff"></up-icon>
|
</view>
|
<text class="item-id">{{ item.paramName || "-" }}</text>
|
</view>
|
</view>
|
<up-divider></up-divider>
|
<view class="item-details">
|
<view class="detail-row">
|
<text class="detail-label">标准值</text>
|
<text class="detail-value highlight">{{ item.standardValue || "-" }}</text>
|
</view>
|
<view class="detail-row">
|
<text class="detail-label">单位</text>
|
<text class="detail-value">{{ item.unit || "-" }}</text>
|
</view>
|
<view class="detail-row">
|
<text class="detail-label">参数类型</text>
|
<up-tag :text="getParamTypeText(item.paramType)"
|
:type="getParamTypeTag(item.paramType)"
|
size="mini" />
|
</view>
|
<view class="detail-row">
|
<text class="detail-label">取值格式</text>
|
<text class="detail-value">{{ item.paramFormat || "-" }}</text>
|
</view>
|
</view>
|
<view class="action-buttons">
|
<up-button class="action-btn"
|
size="small"
|
type="primary"
|
@click="handleEditParam(item)">编辑</up-button>
|
<up-button class="action-btn"
|
size="small"
|
type="error"
|
@click="handleDeleteParam(item)">删除</up-button>
|
</view>
|
</view>
|
</view>
|
<view v-else
|
class="no-data">
|
<up-empty text="暂无参数配置"
|
icon="account"
|
iconSize="60"></up-empty>
|
</view>
|
</view>
|
<!-- 浮动新增按钮 -->
|
<view class="fab-button"
|
@click="openSelectModal">
|
<up-icon name="plus"
|
size="28"
|
color="#ffffff"></up-icon>
|
</view>
|
<!-- 选择参数弹窗 -->
|
<up-modal :show="selectModalVisible"
|
title="选择参数"
|
width="650rpx"
|
@confirm="handleSelectSubmit"
|
@cancel="selectModalVisible = false"
|
:closeOnClickOverlay="false"
|
showCancelButton>
|
<view class="modal-content">
|
<view class="search-box">
|
<up-input v-model="searchKeyword"
|
placeholder="搜索基础参数名称"
|
clearable
|
@confirm="handleSearch"
|
@change="handleSearch" />
|
</view>
|
<scroll-view scroll-y
|
class="param-scroll-list"
|
@scrolltolower="loadMoreParams">
|
<view v-for="param in availableParams"
|
:key="param.id"
|
class="param-select-item"
|
:class="{ active: selectedBaseParam?.id === param.id }"
|
@click="selectParam(param)">
|
<view class="param-main">
|
<text class="param-name">{{ param.paramName }}</text>
|
<up-tag :text="getParamTypeText(param.paramType)"
|
:type="getParamTypeTag(param.paramType)"
|
size="mini" />
|
</view>
|
<text class="param-code">{{ param.paramCode }}</text>
|
</view>
|
<up-loadmore :status="availablePageStatus" />
|
</scroll-view>
|
<view v-if="selectedBaseParam"
|
class="standard-input-box">
|
<text class="label">标准值：</text>
|
<up-input v-model="selectedStandardValue"
|
placeholder="请输入该工序的标准值" />
|
</view>
|
</view>
|
</up-modal>
|
<!-- 编辑参数标准值弹窗 -->
|
<up-modal :show="editModalVisible"
|
title="编辑标准值"
|
width="500rpx"
|
@confirm="handleEditSubmit"
|
@cancel="editModalVisible = false"
|
:closeOnClickOverlay="false"
|
showCancelButton>
|
<view class="modal-content">
|
<view class="edit-info">
|
<text class="edit-label">参数：{{ currentEditParam?.paramName }}</text>
|
<up-input v-model="currentEditValue"
|
placeholder="请输入新的标准值" />
|
</view>
|
</view>
|
</up-modal>
|
</view>
|
</template>
|
|
<script setup>
|
import { reactive, ref, onMounted } from "vue";
|
import { onLoad } from "@dcloudio/uni-app";
|
import {
|
getProcessParamList,
|
addProcessParam,
|
editProcessParam,
|
deleteProcessParam,
|
getBaseParamList,
|
} from "@/api/productionManagement/processManagement";
|
|
const processId = ref(null);
|
const processName = ref("");
|
const paramList = ref([]);
|
const loading = ref(false);
|
|
// 选择参数相关
|
const selectModalVisible = ref(false);
|
const availableParams = ref([]);
|
const searchKeyword = ref("");
|
const selectedBaseParam = ref(null);
|
const selectedStandardValue = ref("");
|
const availablePage = reactive({ current: 1, size: 20, total: 0 });
|
const availablePageStatus = ref("loadmore");
|
|
// 编辑参数相关
|
const editModalVisible = ref(false);
|
const currentEditParam = ref(null);
|
const currentEditValue = ref("");
|
|
const goBack = () => {
|
uni.navigateBack();
|
};
|
|
const getParamList = () => {
|
loading.value = true;
|
getProcessParamList({ technologyOperationId: processId.value })
|
.then(res => {
|
paramList.value = res?.data || [];
|
})
|
.catch(() => {
|
uni.showToast({ title: "获取列表失败", icon: "none" });
|
})
|
.finally(() => {
|
loading.value = false;
|
});
|
};
|
|
const openSelectModal = () => {
|
searchKeyword.value = "";
|
selectedBaseParam.value = null;
|
selectedStandardValue.value = "";
|
availableParams.value = [];
|
availablePage.current = 1;
|
availablePageStatus.value = "loadmore";
|
selectModalVisible.value = true;
|
loadAvailableParams(true);
|
};
|
|
const handleSearch = () => {
|
availablePage.current = 1;
|
availableParams.value = [];
|
availablePageStatus.value = "loadmore";
|
loadAvailableParams(true);
|
};
|
|
const loadMoreParams = () => {
|
if (
|
availablePageStatus.value === "nomore" ||
|
availablePageStatus.value === "loading"
|
)
|
return;
|
loadAvailableParams(false);
|
};
|
|
const loadAvailableParams = (isReset = false) => {
|
if (availablePageStatus.value === "loading") return;
|
if (isReset) {
|
availablePage.current = 1;
|
availableParams.value = [];
|
availablePageStatus.value = "loading";
|
} else if (availablePageStatus.value === "nomore") {
|
return;
|
} else {
|
availablePageStatus.value = "loading";
|
}
|
getBaseParamList({
|
paramName: searchKeyword.value,
|
current: availablePage.current,
|
size: availablePage.size,
|
})
|
.then(res => {
|
const records = res?.data?.records || res?.records || [];
|
const total = res?.data?.total || res?.total || 0;
|
|
if (isReset || availablePage.current === 1) {
|
availableParams.value = records;
|
} else {
|
availableParams.value = [...availableParams.value, ...records];
|
}
|
|
availablePage.total = total;
|
if (availableParams.value.length >= total) {
|
availablePageStatus.value = "nomore";
|
} else {
|
availablePageStatus.value = "loadmore";
|
availablePage.current++;
|
}
|
})
|
.catch(() => {
|
availablePageStatus.value = "loadmore";
|
});
|
};
|
|
const selectParam = param => {
|
selectedBaseParam.value = param;
|
selectedStandardValue.value = param.standardValue || "";
|
};
|
|
const handleSelectSubmit = () => {
|
if (!selectedBaseParam.value) {
|
uni.showToast({ title: "请选择一个基础参数", icon: "none" });
|
return;
|
}
|
if (!selectedStandardValue.value) {
|
uni.showToast({ title: "请输入标准值", icon: "none" });
|
return;
|
}
|
addProcessParam({
|
technologyOperationId: processId.value,
|
technologyParamId: selectedBaseParam.value.id,
|
standardValue: selectedStandardValue.value,
|
})
|
.then(() => {
|
uni.showToast({ title: "添加成功" });
|
selectModalVisible.value = false;
|
getParamList();
|
})
|
.catch(err => {
|
uni.showToast({ title: err.msg || "添加失败", icon: "error" });
|
});
|
};
|
|
const handleEditParam = item => {
|
currentEditParam.value = item;
|
currentEditValue.value = item.standardValue;
|
editModalVisible.value = true;
|
};
|
|
const handleEditSubmit = () => {
|
if (!currentEditValue.value) {
|
uni.showToast({ title: "请输入标准值", icon: "none" });
|
return;
|
}
|
editProcessParam({
|
id: currentEditParam.value.id,
|
technologyOperationId: processId.value,
|
technologyParamId: currentEditParam.value.technologyParamId,
|
standardValue: currentEditValue.value,
|
})
|
.then(() => {
|
uni.showToast({ title: "修改成功" });
|
editModalVisible.value = false;
|
getParamList();
|
})
|
.catch(err => {
|
uni.showToast({ title: err.msg || "修改失败", icon: "error" });
|
});
|
};
|
|
const handleDeleteParam = item => {
|
uni.showModal({
|
title: "提示",
|
content: "确定要删除该参数配置吗？",
|
success: res => {
|
if (res.confirm) {
|
deleteProcessParam(item.id).then(() => {
|
uni.showToast({ title: "删除成功" });
|
getParamList();
|
});
|
}
|
},
|
});
|
};
|
|
const getParamTypeText = type => {
|
const typeMap = { 1: "数值", 2: "文本", 3: "下拉", 4: "时间" };
|
return typeMap[type] || "未知";
|
};
|
|
const getParamTypeTag = type => {
|
const typeMap = { 1: "primary", 2: "info", 3: "warning", 4: "success" };
|
return typeMap[type] || "default";
|
};
|
|
onLoad(option => {
|
if (option.id) {
|
processId.value = option.id;
|
processName.value = decodeURIComponent(option.name || "");
|
getParamList();
|
}
|
});
|
</script>
|
|
<style scoped lang="scss">
|
@import "@/styles/procurement-common.scss";
|
|
.process-params {
|
min-height: 100vh;
|
background: #f5f5f5;
|
}
|
|
.modal-content {
|
padding: 20rpx 0;
|
width: 100%;
|
}
|
|
.param-scroll-list {
|
height: 500rpx;
|
margin-top: 20rpx;
|
border: 1px solid #eee;
|
border-radius: 8rpx;
|
}
|
|
.param-select-item {
|
padding: 20rpx;
|
border-bottom: 1px solid #f5f5f5;
|
width: 100%;
|
&.active {
|
background-color: #e3f2fd;
|
}
|
}
|
|
.param-main {
|
display: flex;
|
justify-content: space-between;
|
align-items: center;
|
margin-bottom: 8rpx;
|
}
|
|
.param-name {
|
font-size: 28rpx;
|
font-weight: bold;
|
color: #333;
|
}
|
|
.param-code {
|
font-size: 24rpx;
|
color: #999;
|
}
|
|
.standard-input-box {
|
margin-top: 30rpx;
|
display: flex;
|
align-items: center;
|
.label {
|
width: 120rpx;
|
font-size: 28rpx;
|
color: #333;
|
}
|
}
|
|
.edit-info {
|
.edit-label {
|
display: block;
|
margin-bottom: 20rpx;
|
font-size: 28rpx;
|
color: #666;
|
}
|
}
|
|
.fab-button {
|
position: fixed;
|
right: 40rpx;
|
bottom: 60rpx;
|
width: 100rpx;
|
height: 100rpx;
|
background: #2979ff;
|
border-radius: 50%;
|
display: flex;
|
align-items: center;
|
justify-content: center;
|
box-shadow: 0 4rpx 12rpx rgba(41, 121, 255, 0.4);
|
z-index: 100;
|
}
|
</style>
|
