|
|
@@ -1,145 +1,135 @@
|
|
|
<template>
|
|
|
- <el-dialog title="编辑质检项" v-model="state.dialogVisible" width="769px" draggable @close="close">
|
|
|
- <el-form :model="state.ruleForm" ref="ruleFormRef" label-width="110px">
|
|
|
- <el-row :gutter="10">
|
|
|
- <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12">
|
|
|
- <el-form-item label="质检项名称" prop="name" :rules="[{ required: true, message: '请输入质检项名称', trigger: 'blur' }]">
|
|
|
- <el-input v-model="state.ruleForm.name" placeholder="请输入质检项名称" clearable></el-input>
|
|
|
- </el-form-item>
|
|
|
- </el-col>
|
|
|
- <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12">
|
|
|
- <el-form-item label="质检项分组" prop="groupingName" :rules="[{ required: true, message: '请选择质检项分组', trigger: 'change' }]">
|
|
|
- <el-select v-model="state.ruleForm.groupingName" placeholder="请选择质检项分组" class="w100">
|
|
|
- <el-option v-for="item in props.qualityItemGrouping" :value="item.dicDataValue" :key="item.dicDataValue" :label="item.dicDataName" />
|
|
|
- </el-select>
|
|
|
- </el-form-item>
|
|
|
- </el-col>
|
|
|
- <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12">
|
|
|
- <el-form-item label="质检项分值" prop="grade" :rules="[{ required: true, message: '请输入质检项分值', trigger: 'blur' }]">
|
|
|
- <el-input-number
|
|
|
- v-model="state.ruleForm.grade"
|
|
|
- :precision="0"
|
|
|
- :min="1"
|
|
|
- :max="100"
|
|
|
- placeholder="请输入质检项分值"
|
|
|
- />
|
|
|
- <span class="ml10">分</span>
|
|
|
- </el-form-item>
|
|
|
- </el-col>
|
|
|
- <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12">
|
|
|
- <el-form-item label="是否智能质检" prop="isIntelligent" :rules="[{ required: false, message: '请选择是否智能质检', trigger: 'change' }]">
|
|
|
- <el-switch
|
|
|
- v-model="state.ruleForm.isIntelligent"
|
|
|
- inline-prompt
|
|
|
- active-text="是"
|
|
|
- inactive-text="否"
|
|
|
- :active-value="1"
|
|
|
- :inactive-value="0"
|
|
|
- />
|
|
|
- </el-form-item>
|
|
|
- </el-col>
|
|
|
- <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12">
|
|
|
- <el-form-item label="是否启用" prop="isEnable" :rules="[{ required: false, message: '请选择是否启用性', trigger: 'change' }]">
|
|
|
- <el-switch
|
|
|
- v-model="state.ruleForm.isEnable"
|
|
|
- inline-prompt
|
|
|
- active-text="是"
|
|
|
- inactive-text="否"
|
|
|
- :active-value="1"
|
|
|
- :inactive-value="0"
|
|
|
- />
|
|
|
- </el-form-item>
|
|
|
- </el-col>
|
|
|
- <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24">
|
|
|
- <el-form-item label="质检项描述" prop="describe" :rules="[{ required: false, message: '请输入质检项描述', trigger: 'blur' }]">
|
|
|
- <el-input v-model="state.ruleForm.describe" placeholder="请输入质检项描述" type="textarea" :autosize="{ minRows: 4, maxRows: 8 }"></el-input>
|
|
|
- </el-form-item>
|
|
|
- </el-col>
|
|
|
- </el-row>
|
|
|
- </el-form>
|
|
|
- <template #footer>
|
|
|
- <span class="dialog-footer">
|
|
|
- <el-button @click="closeDialog" class="default-button">取 消</el-button>
|
|
|
- <el-button type="primary" @click="onSubmit(ruleFormRef)" :loading="state.loading">确 定 </el-button>
|
|
|
- </span>
|
|
|
- </template>
|
|
|
- </el-dialog>
|
|
|
+ <el-dialog title="编辑质检项" v-model="state.dialogVisible" width="769px" draggable @close="close">
|
|
|
+ <el-form :model="state.ruleForm" ref="ruleFormRef" label-width="110px">
|
|
|
+ <el-row :gutter="10">
|
|
|
+ <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12">
|
|
|
+ <el-form-item label="质检项名称" prop="name" :rules="[{ required: true, message: '请输入质检项名称', trigger: 'blur' }]">
|
|
|
+ <el-input v-model="state.ruleForm.name" placeholder="请输入质检项名称" clearable></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12">
|
|
|
+ <el-form-item label="质检项分组" prop="groupingName" :rules="[{ required: true, message: '请选择质检项分组', trigger: 'change' }]">
|
|
|
+ <el-select v-model="state.ruleForm.groupingName" placeholder="请选择质检项分组" class="w100">
|
|
|
+ <el-option v-for="item in props.qualityItemGrouping" :value="item.dicDataValue" :key="item.dicDataValue" :label="item.dicDataName" />
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12">
|
|
|
+ <el-form-item label="质检项分值" prop="grade" :rules="[{ required: true, message: '请输入质检项分值', trigger: 'blur' }]">
|
|
|
+ <el-input-number v-model="state.ruleForm.grade" :precision="0" :min="1" :max="100" placeholder="请输入质检项分值" />
|
|
|
+ <span class="ml10">分</span>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12">
|
|
|
+ <el-form-item label="是否智能质检" prop="isIntelligent" :rules="[{ required: false, message: '请选择是否智能质检', trigger: 'change' }]">
|
|
|
+ <el-switch
|
|
|
+ v-model="state.ruleForm.isIntelligent"
|
|
|
+ inline-prompt
|
|
|
+ active-text="是"
|
|
|
+ inactive-text="否"
|
|
|
+ :active-value="1"
|
|
|
+ :inactive-value="0"
|
|
|
+ />
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12">
|
|
|
+ <el-form-item label="是否启用" prop="isEnable" :rules="[{ required: false, message: '请选择是否启用性', trigger: 'change' }]">
|
|
|
+ <el-switch v-model="state.ruleForm.isEnable" inline-prompt active-text="是" inactive-text="否" :active-value="1" :inactive-value="0" />
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24">
|
|
|
+ <el-form-item label="质检项描述" prop="describe" :rules="[{ required: false, message: '请输入质检项描述', trigger: 'blur' }]">
|
|
|
+ <el-input
|
|
|
+ v-model="state.ruleForm.describe"
|
|
|
+ placeholder="请输入质检项描述"
|
|
|
+ type="textarea"
|
|
|
+ :autosize="{ minRows: 4, maxRows: 8 }"
|
|
|
+ ></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ </el-form>
|
|
|
+ <template #footer>
|
|
|
+ <span class="dialog-footer">
|
|
|
+ <el-button @click="closeDialog" class="default-button">取 消</el-button>
|
|
|
+ <el-button type="primary" @click="onSubmit(ruleFormRef)" :loading="state.loading">确 定 </el-button>
|
|
|
+ </span>
|
|
|
+ </template>
|
|
|
+ </el-dialog>
|
|
|
</template>
|
|
|
|
|
|
<script setup lang="ts" name="qualityProjectEdit">
|
|
|
-import {reactive, ref} from 'vue';
|
|
|
-import {ElInput, ElMessage, FormInstance} from 'element-plus';
|
|
|
-import {projectDetail,projectUpdate} from '/@/api/quality/project'
|
|
|
+import { reactive, ref } from 'vue';
|
|
|
+import { ElInput, ElMessage, FormInstance } from 'element-plus';
|
|
|
+import { projectDetail, projectUpdate } from '/@/api/quality/project';
|
|
|
// 定义子组件向父组件传值/事件
|
|
|
const emit = defineEmits(['updateList']);
|
|
|
|
|
|
const props = defineProps({
|
|
|
- qualityItemGrouping: {
|
|
|
- type: Array,
|
|
|
- default: () => [],
|
|
|
- }
|
|
|
-})
|
|
|
-
|
|
|
+ qualityItemGrouping: {
|
|
|
+ type: Array,
|
|
|
+ default: () => [],
|
|
|
+ },
|
|
|
+});
|
|
|
|
|
|
// 定义变量内容
|
|
|
const ruleFormRef = ref<FormInstance>();
|
|
|
const state = reactive<any>({
|
|
|
- dialogVisible: false, // 弹窗显示隐藏
|
|
|
- ruleForm: {
|
|
|
- name: '', // 质检项名称
|
|
|
- groupingName: '', // 质检项分组
|
|
|
- grade: 1, // 质检项分值
|
|
|
- isIntelligent: 0, // 是否智能质检
|
|
|
- isEnable: 1, // 是否启用
|
|
|
- describe: '', // 质检项描述
|
|
|
- },
|
|
|
- loading: false, // 确定按钮loading
|
|
|
+ dialogVisible: false, // 弹窗显示隐藏
|
|
|
+ ruleForm: {
|
|
|
+ name: '', // 质检项名称
|
|
|
+ groupingName: '', // 质检项分组
|
|
|
+ grade: 1, // 质检项分值
|
|
|
+ isIntelligent: 0, // 是否智能质检
|
|
|
+ isEnable: 1, // 是否启用
|
|
|
+ describe: '', // 质检项描述
|
|
|
+ },
|
|
|
+ loading: false, // 确定按钮loading
|
|
|
});
|
|
|
|
|
|
// 打开弹窗
|
|
|
const openDialog = async (row: any) => {
|
|
|
- try {
|
|
|
- const res = await projectDetail(row.id);
|
|
|
- state.ruleForm = res.result ?? {};
|
|
|
- state.dialogVisible = true;
|
|
|
- }catch (e) {
|
|
|
- console.log(e);
|
|
|
- }
|
|
|
-
|
|
|
+ try {
|
|
|
+ const res = await projectDetail(row.id);
|
|
|
+ state.ruleForm = res.result ?? {};
|
|
|
+ state.dialogVisible = true;
|
|
|
+ } catch (e) {
|
|
|
+ console.log(e);
|
|
|
+ }
|
|
|
};
|
|
|
// 关闭弹窗
|
|
|
const closeDialog = () => {
|
|
|
- state.dialogVisible = false;
|
|
|
+ state.dialogVisible = false;
|
|
|
+};
|
|
|
+const close = () => {
|
|
|
+ ruleFormRef.value?.clearValidate();
|
|
|
+ ruleFormRef.value?.resetFields();
|
|
|
};
|
|
|
-const close = ()=>{
|
|
|
- ruleFormRef.value?.clearValidate();
|
|
|
- ruleFormRef.value?.resetFields();
|
|
|
-}
|
|
|
// 保存
|
|
|
const onSubmit = (formEl: FormInstance | undefined) => {
|
|
|
- if (!formEl) return;
|
|
|
- formEl.validate((valid: boolean) => {
|
|
|
- if (!valid) return;
|
|
|
- state.loading = true;
|
|
|
- const request = {
|
|
|
- ...state.ruleForm
|
|
|
- }
|
|
|
- projectUpdate(request)
|
|
|
- .then(() => {
|
|
|
- emit('updateList');
|
|
|
- closeDialog(); // 关闭弹窗
|
|
|
- ElMessage.success('操作成功');
|
|
|
- state.loading = false;
|
|
|
- })
|
|
|
- .catch(() => {
|
|
|
- emit('updateList');
|
|
|
- state.loading = false;
|
|
|
- });
|
|
|
- });
|
|
|
+ if (!formEl) return;
|
|
|
+ formEl.validate((valid: boolean) => {
|
|
|
+ if (!valid) return;
|
|
|
+ state.loading = true;
|
|
|
+ const request = {
|
|
|
+ ...state.ruleForm,
|
|
|
+ };
|
|
|
+ projectUpdate(request)
|
|
|
+ .then(() => {
|
|
|
+ emit('updateList');
|
|
|
+ closeDialog(); // 关闭弹窗
|
|
|
+ ElMessage.success('操作成功');
|
|
|
+ state.loading = false;
|
|
|
+ })
|
|
|
+ .catch(() => {
|
|
|
+ emit('updateList');
|
|
|
+ state.loading = false;
|
|
|
+ });
|
|
|
+ });
|
|
|
};
|
|
|
// 暴露变量
|
|
|
defineExpose({
|
|
|
- openDialog,
|
|
|
- closeDialog,
|
|
|
+ openDialog,
|
|
|
+ closeDialog,
|
|
|
});
|
|
|
</script>
|
zhangchong