From 5333935ae59999c47653122a669f4326f0173c1c Mon Sep 17 00:00:00 2001
From: zhangwencui <1064582902@qq.com>
Date: 星期四, 08 一月 2026 14:47:02 +0800
Subject: [PATCH] 确认按钮在左边
---
src/views/productionManagement/productStructure/StructureEdit.vue | 465 +++++++++++++++++++++++++++------------------------------
1 files changed, 223 insertions(+), 242 deletions(-)
diff --git a/src/views/productionManagement/productStructure/StructureEdit.vue b/src/views/productionManagement/productStructure/StructureEdit.vue
index fb5784f..679a37c 100644
--- a/src/views/productionManagement/productStructure/StructureEdit.vue
+++ b/src/views/productionManagement/productStructure/StructureEdit.vue
@@ -1,304 +1,285 @@
<template>
- <el-dialog
- v-model="visible"
- title="缁撴瀯"
- width="1200"
- close-on-click-modal
- @close="visible = false"
- >
- <el-button
- v-if="dataValue.isEdit"
- type="primary"
- @click="addItem"
- style="margin-bottom: 10px"
- >娣诲姞
+ <el-dialog v-model="visible"
+ title="缁撴瀯"
+ width="1200"
+ close-on-click-modal
+ @close="visible = false">
+ <el-button v-if="dataValue.isEdit"
+ type="primary"
+ @click="addItem"
+ style="margin-bottom: 10px">娣诲姞
</el-button>
- <el-button
- v-if="!dataValue.isEdit"
- type="primary"
- @click="dataValue.isEdit = true"
- style="margin-bottom: 10px"
- >缂栬緫
+ <el-button v-if="!dataValue.isEdit"
+ type="primary"
+ @click="dataValue.isEdit = true"
+ style="margin-bottom: 10px">缂栬緫
</el-button>
- <el-button
- v-if="dataValue.isEdit"
- type="primary"
- @click="cancelEdit"
- style="margin-bottom: 10px"
- >鍙栨秷
+ <el-button v-if="dataValue.isEdit"
+ type="primary"
+ @click="cancelEdit"
+ style="margin-bottom: 10px">鍙栨秷
</el-button>
- <el-form
- ref="form"
- :model="dataValue"
- >
- <el-table :data="dataValue.dataList" style="width: 100%">
- <el-table-column prop="productName" label="浜у搧" width="150"/>
- <el-table-column prop="model" label="瑙勬牸" width="150">
+ <el-form ref="form"
+ :model="dataValue">
+ <el-table :data="dataValue.dataList"
+ style="width: 100%">
+ <el-table-column prop="productName"
+ label="浜у搧"
+ width="150" />
+ <el-table-column prop="model"
+ label="瑙勬牸"
+ width="150">
<template #default="{ row, $index }">
- <el-form-item
- v-if="dataValue.isEdit"
- :prop="`dataList.${$index}.model`"
- :rules="[{ required: true, message: '璇烽�夋嫨瑙勬牸', trigger: ['blur','change'] }]"
- style="margin: 0"
- >
- <el-select
- v-model="row.model"
- placeholder="璇烽�夋嫨浜у搧"
- clearable
- :disabled="!dataValue.isEdit"
- style="width: 100%"
- @visible-change="(v) => { if (v) openDialog($index) }"
- >
- <el-option v-if="row.model" :label="row.model" :value="row.model" />
+ <el-form-item v-if="dataValue.isEdit"
+ :prop="`dataList.${$index}.model`"
+ :rules="[{ required: true, message: '璇烽�夋嫨瑙勬牸', trigger: ['blur','change'] }]"
+ style="margin: 0">
+ <el-select v-model="row.model"
+ placeholder="璇烽�夋嫨浜у搧"
+ clearable
+ :disabled="!dataValue.isEdit"
+ style="width: 100%"
+ @visible-change="(v) => { if (v) openDialog($index) }">
+ <el-option v-if="row.model"
+ :label="row.model"
+ :value="row.model" />
</el-select>
</el-form-item>
</template>
</el-table-column>
-
- <el-table-column prop="processId" label="娑堣�楀伐搴�" width="150">
+ <el-table-column prop="processId"
+ label="娑堣�楀伐搴�"
+ width="150">
<template #default="{ row, $index }">
- <el-form-item
- :prop="`dataList.${$index}.processId`"
- :rules="[{ required: true, message: '璇烽�夋嫨娑堣�楀伐搴�', trigger: 'change' }]"
- style="margin: 0"
- >
- <el-select
- v-model="row.processId"
- placeholder="璇烽�夋嫨"
- filterable
- clearable
- style="width: 100%"
- :disabled="!dataValue.isEdit"
- >
- <el-option
- v-for="item in dataValue.processOptions"
- :key="item.id"
- :label="item.name"
- :value="item.id"
- />
+ <el-form-item :prop="`dataList.${$index}.processId`"
+ :rules="[{ required: true, message: '璇烽�夋嫨娑堣�楀伐搴�', trigger: 'change' }]"
+ style="margin: 0">
+ <el-select v-model="row.processId"
+ placeholder="璇烽�夋嫨"
+ filterable
+ clearable
+ style="width: 100%"
+ :disabled="!dataValue.isEdit">
+ <el-option v-for="item in dataValue.processOptions"
+ :key="item.id"
+ :label="item.name"
+ :value="item.id" />
</el-select>
</el-form-item>
</template>
</el-table-column>
-
- <el-table-column prop="unitQuantity" label="鍗曚綅浜у嚭鎵�闇�鏁伴噺" width="150">
+ <el-table-column prop="unitQuantity"
+ label="鍗曚綅浜у嚭鎵�闇�鏁伴噺"
+ width="150">
<template #default="{ row, $index }">
- <el-form-item
- :prop="`dataList.${$index}.unitQuantity`"
- :rules="[{ required: true, message: '璇疯緭鍏ュ崟浣嶄骇鍑烘墍闇�鏁伴噺', trigger: ['blur','change'] }]"
- style="margin: 0"
- >
- <el-input-number
- v-model="row.unitQuantity"
- :min="0"
- :precision="2"
- :step="1"
- controls-position="right"
- style="width: 100%"
- :disabled="!dataValue.isEdit"
- />
+ <el-form-item :prop="`dataList.${$index}.unitQuantity`"
+ :rules="[{ required: true, message: '璇疯緭鍏ュ崟浣嶄骇鍑烘墍闇�鏁伴噺', trigger: ['blur','change'] }]"
+ style="margin: 0">
+ <el-input-number v-model="row.unitQuantity"
+ :min="0"
+ :precision="2"
+ :step="1"
+ controls-position="right"
+ style="width: 100%"
+ :disabled="!dataValue.isEdit" />
</el-form-item>
</template>
</el-table-column>
-
- <el-table-column prop="demandedQuantity" label="闇�姹傛�婚噺" width="150">
+ <el-table-column prop="demandedQuantity"
+ label="闇�姹傛�婚噺"
+ width="150">
<template #default="{ row, $index }">
- <el-form-item
- :prop="`dataList.${$index}.demandedQuantity`"
- :rules="[{ required: true, message: '璇疯緭鍏ラ渶姹傛�婚噺', trigger: ['blur','change'] }]"
- style="margin: 0"
- >
- <el-input-number
- v-model="row.demandedQuantity"
- :min="0"
- :precision="2"
- :step="1"
- controls-position="right"
- style="width: 100%"
- :disabled="!dataValue.isEdit"
- />
+ <el-form-item :prop="`dataList.${$index}.demandedQuantity`"
+ :rules="[{ required: true, message: '璇疯緭鍏ラ渶姹傛�婚噺', trigger: ['blur','change'] }]"
+ style="margin: 0">
+ <el-input-number v-model="row.demandedQuantity"
+ :min="0"
+ :precision="2"
+ :step="1"
+ controls-position="right"
+ style="width: 100%"
+ :disabled="!dataValue.isEdit" />
</el-form-item>
</template>
</el-table-column>
-
- <el-table-column prop="unit" label="鍗曚綅" width="150">
+ <el-table-column prop="unit"
+ label="鍗曚綅"
+ width="150">
<template #default="{ row, $index }">
- <el-form-item
- :prop="`dataList.${$index}.unit`"
- :rules="[{ required: true, message: '璇疯緭鍏ュ崟浣�', trigger: ['blur','change'] }]"
- style="margin: 0"
- >
- <el-input
- v-model="row.unit"
- placeholder="璇疯緭鍏ュ崟浣�"
- clearable
- :disabled="!dataValue.isEdit"
- />
+ <el-form-item :prop="`dataList.${$index}.unit`"
+ :rules="[{ required: true, message: '璇疯緭鍏ュ崟浣�', trigger: ['blur','change'] }]"
+ style="margin: 0">
+ <el-input v-model="row.unit"
+ placeholder="璇疯緭鍏ュ崟浣�"
+ clearable
+ :disabled="!dataValue.isEdit" />
</el-form-item>
</template>
</el-table-column>
-
- <el-table-column prop="diskQuantity" label="鐩樻暟锛堢洏锛�" width="150">
+ <el-table-column prop="diskQuantity"
+ label="鐩樻暟锛堢洏锛�"
+ width="150">
<template #default="{ row, $index }">
- <el-form-item
- :prop="`dataList.${$index}.diskQuantity`"
- :rules="[{ required: true, message: '璇疯緭鍏ョ洏鏁�', trigger: ['blur','change'] }]"
- style="margin: 0"
- >
- <el-input-number
- v-model="row.diskQuantity"
- :min="0"
- :precision="0"
- :step="1"
- controls-position="right"
- style="width: 100%"
- :disabled="!dataValue.isEdit"
- />
+ <el-form-item :prop="`dataList.${$index}.diskQuantity`"
+ :rules="[{ required: true, message: '璇疯緭鍏ョ洏鏁�', trigger: ['blur','change'] }]"
+ style="margin: 0">
+ <el-input-number v-model="row.diskQuantity"
+ :min="0"
+ :precision="0"
+ :step="1"
+ controls-position="right"
+ style="width: 100%"
+ :disabled="!dataValue.isEdit" />
</el-form-item>
</template>
</el-table-column>
-
<el-table-column label="鎿嶄綔">
<template #default="{ row, $index }">
- <el-button
- type="danger"
- text
- @click="dataValue.dataList.splice($index, 1)"
- >鍒犻櫎
+ <el-button type="danger"
+ text
+ @click="dataValue.dataList.splice($index, 1)">鍒犻櫎
</el-button>
</template>
</el-table-column>
</el-table>
</el-form>
-
- <product-select-dialog
- v-if="dataValue.showProductDialog"
- v-model:model-value="dataValue.showProductDialog"
- @confirm="handleProduct"/>
+ <product-select-dialog v-if="dataValue.showProductDialog"
+ v-model:model-value="dataValue.showProductDialog"
+ @confirm="handleProduct" />
<template #footer>
<div class="dialog-footer">
- <el-button @click="visible = false">鍙栨秷</el-button>
- <el-button type="primary" :loading="dataValue.loading" @click="submit" :disabled="!dataValue.isEdit">
+ <el-button type="primary"
+ :loading="dataValue.loading"
+ @click="submit"
+ :disabled="!dataValue.isEdit">
纭
</el-button>
+ <el-button @click="visible = false">鍙栨秷</el-button>
</div>
</template>
</el-dialog>
</template>
<script setup lang="ts">
-import {computed, defineAsyncComponent, defineComponent, onMounted, reactive, ref} from "vue";
-import {queryList, add} from '@/api/productionManagement/productStructure.js'
-import {list} from '@/api/productionManagement/productionProcess'
-import {ElMessage} from "element-plus";
+ import {
+ computed,
+ defineAsyncComponent,
+ defineComponent,
+ onMounted,
+ reactive,
+ ref,
+ } from "vue";
+ import { queryList, add } from "@/api/productionManagement/productStructure.js";
+ import { list } from "@/api/productionManagement/productionProcess";
+ import { ElMessage } from "element-plus";
+ defineComponent({
+ name: "StructureEdit",
+ });
-defineComponent({
- name: "StructureEdit",
-})
+ const ProductSelectDialog = defineAsyncComponent(
+ () => import("@/views/basicData/product/ProductSelectDialog.vue")
+ );
+ const form = ref();
-const ProductSelectDialog = defineAsyncComponent(() => import('@/views/basicData/product/ProductSelectDialog.vue'))
-const form = ref()
+ const props = defineProps({
+ showModel: {
+ type: Boolean,
+ default: false,
+ },
+ productModelId: {
+ type: Number,
+ required: true,
+ },
+ });
+ const emits = defineEmits(["update:showModel"]);
+ const visible = computed({
+ get() {
+ return props.showModel;
+ },
+ set(val) {
+ emits("update:showModel", val);
+ },
+ });
+ const dataValue = reactive({
+ dataList: [],
+ productOptions: [],
+ processOptions: [],
+ showProductDialog: false,
+ currentRowIndex: null,
+ loading: false,
+ isEdit: false,
+ });
-const props = defineProps({
- showModel: {
- type: Boolean,
- default: false
- },
- productModelId: {
- type: Number,
- required: true
- }
-})
+ const openDialog = index => {
+ dataValue.currentRowIndex = index;
+ dataValue.showProductDialog = true;
+ };
-const emits = defineEmits(['update:showModel'])
-const visible = computed({
- get() {
- return props.showModel
- },
- set(val) {
- emits('update:showModel', val)
- }
-})
+ const fetchData = async () => {
+ const { data } = await queryList(props.productModelId);
+ dataValue.dataList = data;
+ };
-const dataValue = reactive({
- dataList: [],
- productOptions: [],
- processOptions: [],
- showProductDialog: false,
- currentRowIndex: null,
- loading: false,
- isEdit: false,
-});
+ const fetchProcessOptions = async () => {
+ const { data } = await list(props.productModelId);
+ dataValue.processOptions = data;
+ };
-const openDialog = (index) => {
- dataValue.currentRowIndex = index
- dataValue.showProductDialog = true
-}
-
-const fetchData = async () => {
- const {data} = await queryList(props.productModelId)
- dataValue.dataList = data
-}
-
-const fetchProcessOptions = async () => {
- const {data} = await list(props.productModelId)
- dataValue.processOptions = data
-}
-
-const handleProduct = (row) => {
- if (row?.length > 1) {
- ElMessage.error('鍙兘閫夋嫨涓�涓骇鍝�')
- }
- dataValue.dataList[dataValue.currentRowIndex].productName = row[0].productName
- dataValue.dataList[dataValue.currentRowIndex].model = row[0].model
- dataValue.dataList[dataValue.currentRowIndex].productModelId = row[0].id
- dataValue.showProductDialog = false
-}
-
-const submit = () => {
- form.value.validate(valid => {
- dataValue.loading = true
- if (valid) {
- add({
- parentId: props.productModelId,
- productStructureList: dataValue.dataList || []
- }).then(res => {
- ElMessage.success('淇濆瓨鎴愬姛')
- visible.value = false
- dataValue.loading = false
- })
+ const handleProduct = row => {
+ if (row?.length > 1) {
+ ElMessage.error("鍙兘閫夋嫨涓�涓骇鍝�");
}
- }).finally(() => {
- dataValue.loading = false
- })
-}
+ dataValue.dataList[dataValue.currentRowIndex].productName =
+ row[0].productName;
+ dataValue.dataList[dataValue.currentRowIndex].model = row[0].model;
+ dataValue.dataList[dataValue.currentRowIndex].productModelId = row[0].id;
+ dataValue.showProductDialog = false;
+ };
-const addItem = () => {
- dataValue.dataList.push({
- productName: '',
- productId: '',
- model: undefined,
- productModelId: undefined,
- processId: '',
- unitQuantity: 0,
- demandedQuantity: 0,
- unit: '',
- diskQuantity: 0,
- })
-}
+ const submit = () => {
+ form.value
+ .validate(valid => {
+ dataValue.loading = true;
+ if (valid) {
+ add({
+ parentId: props.productModelId,
+ productStructureList: dataValue.dataList || [],
+ }).then(res => {
+ ElMessage.success("淇濆瓨鎴愬姛");
+ visible.value = false;
+ dataValue.loading = false;
+ });
+ }
+ })
+ .finally(() => {
+ dataValue.loading = false;
+ });
+ };
-const cancelEdit = () => {
- dataValue.isEdit = false
- dataValue.dataList = dataValue.dataList.filter(item => item.id !== undefined)
-}
+ const addItem = () => {
+ dataValue.dataList.push({
+ productName: "",
+ productId: "",
+ model: undefined,
+ productModelId: undefined,
+ processId: "",
+ unitQuantity: 0,
+ demandedQuantity: 0,
+ unit: "",
+ diskQuantity: 0,
+ });
+ };
-onMounted(() => {
- fetchData()
- fetchProcessOptions()
-})
+ const cancelEdit = () => {
+ dataValue.isEdit = false;
+ dataValue.dataList = dataValue.dataList.filter(item => item.id !== undefined);
+ };
-
+ onMounted(() => {
+ fetchData();
+ fetchProcessOptions();
+ });
</script>
\ No newline at end of file
--
Gitblit v1.9.3