合并
This commit is contained in:
184
src/views/machinery/component/edit.vue
Normal file
184
src/views/machinery/component/edit.vue
Normal file
@ -0,0 +1,184 @@
|
||||
<template>
|
||||
<div class="system-busMachinery-edit">
|
||||
<!-- 添加或修改机械对话框 -->
|
||||
<el-dialog v-model="isShowDialog" width="600px" :close-on-click-modal="false" :destroy-on-close="true" custom-class="busMachinery_edit">
|
||||
<template #header>
|
||||
<div v-drag="['.system-busMachinery-edit .el-dialog', '.system-busMachinery-edit .el-dialog__header']">
|
||||
{{ (!formData.id || formData.id == 0 ? '添加' : '修改') + '机械' }}
|
||||
</div>
|
||||
</template>
|
||||
<el-form ref="formRef" :model="formData" :rules="rules" label-width="110px">
|
||||
<el-row>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="机械名称" prop="machineryName">
|
||||
<el-input v-model="formData.machineryName" placeholder="请输入机械名称" /> </el-form-item
|
||||
></el-col>
|
||||
<el-col :span="12"
|
||||
><el-form-item label="型号" prop="machineryNumber">
|
||||
<el-input v-model="formData.machineryNumber" placeholder="请输入型号" /> </el-form-item
|
||||
></el-col>
|
||||
<el-col :span="12"
|
||||
><el-form-item label="负责人" prop="principal">
|
||||
<el-input v-model="formData.principal" :rows="5" placeholder="请输入负责人" /> </el-form-item
|
||||
></el-col>
|
||||
<el-col :span="24"
|
||||
><el-form-item label="备注" prop="remark">
|
||||
<el-input v-model="formData.remark" :rows="5" type="textarea" placeholder="请输入备注" /> </el-form-item
|
||||
></el-col>
|
||||
</el-row>
|
||||
</el-form>
|
||||
<template #footer>
|
||||
<div class="dialog-footer">
|
||||
<el-button type="primary" @click="onSubmit">确 定</el-button>
|
||||
<el-button @click="onCancel">取 消</el-button>
|
||||
</div>
|
||||
</template>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
<script lang="ts">
|
||||
import { reactive, toRefs, defineComponent, ref, unref, getCurrentInstance } from 'vue';
|
||||
import { ElMessage, ElLoading } from 'element-plus';
|
||||
import { getBusMachinery, addBusMachinery, updateBusMachinery } from '@/api/machinery/machinery';
|
||||
import { BusMachineryInfoData, BusMachineryEditState } from './model';
|
||||
export default defineComponent({
|
||||
name: 'index',
|
||||
props: {
|
||||
statusOptions: {
|
||||
type: Array,
|
||||
default: () => []
|
||||
}
|
||||
},
|
||||
setup(props, { emit }) {
|
||||
const { proxy } = <any>getCurrentInstance();
|
||||
const formRef = ref<HTMLElement | null>(null);
|
||||
const menuRef = ref();
|
||||
const state = reactive<BusMachineryEditState>({
|
||||
loading: false,
|
||||
isShowDialog: false,
|
||||
formData: {
|
||||
id: undefined,
|
||||
machineryName: undefined,
|
||||
machineryNumber: undefined,
|
||||
projectId: undefined,
|
||||
checkoutNumber: undefined,
|
||||
checkoutUnit: undefined,
|
||||
checkoutDate: undefined,
|
||||
status: false,
|
||||
createBy: undefined,
|
||||
updateBy: undefined,
|
||||
createdAt: undefined,
|
||||
updatedAt: undefined,
|
||||
deletedAt: undefined,
|
||||
entryTime: undefined,
|
||||
principal: undefined,
|
||||
remark: undefined
|
||||
},
|
||||
// 表单校验
|
||||
rules: {
|
||||
id: [{ required: true, message: '序号不能为空', trigger: 'blur' }],
|
||||
machineryName: [{ required: true, message: '机械名称不能为空', trigger: 'blur' }],
|
||||
principal: [{ required: true, message: '负责人不能为空', trigger: 'blur' }],
|
||||
status: [{ required: true, message: '施工类型状态不能为空', trigger: 'blur' }]
|
||||
}
|
||||
});
|
||||
// 打开弹窗
|
||||
const openDialog = (row?: BusMachineryInfoData) => {
|
||||
resetForm();
|
||||
if (row) {
|
||||
nextTick(() => {
|
||||
const loading = ElLoading.service({
|
||||
lock: true,
|
||||
text: '正在加载中……',
|
||||
background: 'rgba(0, 0, 0, 0.7)',
|
||||
target: '.busMachinery_edit'
|
||||
});
|
||||
getBusMachinery(row.id!).then((res: any) => {
|
||||
loading.close();
|
||||
const data = res.data;
|
||||
data.status = '' + data.status;
|
||||
state.formData = data;
|
||||
});
|
||||
});
|
||||
}
|
||||
state.isShowDialog = true;
|
||||
};
|
||||
// 关闭弹窗
|
||||
const closeDialog = () => {
|
||||
state.isShowDialog = false;
|
||||
};
|
||||
// 取消
|
||||
const onCancel = () => {
|
||||
closeDialog();
|
||||
};
|
||||
// 提交
|
||||
const onSubmit = () => {
|
||||
const formWrap = unref(formRef) as any;
|
||||
if (!formWrap) return;
|
||||
formWrap.validate((valid: boolean) => {
|
||||
if (valid) {
|
||||
state.loading = true;
|
||||
if (!state.formData.id || state.formData.id === 0) {
|
||||
//添加
|
||||
addBusMachinery(state.formData)
|
||||
.then(() => {
|
||||
ElMessage.success('添加成功');
|
||||
closeDialog(); // 关闭弹窗
|
||||
emit('busMachineryList');
|
||||
})
|
||||
.finally(() => {
|
||||
state.loading = false;
|
||||
});
|
||||
} else {
|
||||
//修改
|
||||
updateBusMachinery(state.formData)
|
||||
.then(() => {
|
||||
ElMessage.success('修改成功');
|
||||
closeDialog(); // 关闭弹窗
|
||||
emit('busMachineryList');
|
||||
})
|
||||
.finally(() => {
|
||||
state.loading = false;
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
};
|
||||
const resetForm = () => {
|
||||
state.formData = {
|
||||
id: undefined,
|
||||
machineryName: undefined,
|
||||
machineryNumber: undefined,
|
||||
projectId: undefined,
|
||||
checkoutNumber: undefined,
|
||||
checkoutUnit: undefined,
|
||||
checkoutDate: undefined,
|
||||
status: false,
|
||||
createBy: undefined,
|
||||
updateBy: undefined,
|
||||
createdAt: undefined,
|
||||
updatedAt: undefined,
|
||||
deletedAt: undefined,
|
||||
entryTime: undefined,
|
||||
principal: undefined,
|
||||
remark: undefined
|
||||
};
|
||||
};
|
||||
return {
|
||||
proxy,
|
||||
openDialog,
|
||||
closeDialog,
|
||||
onCancel,
|
||||
onSubmit,
|
||||
menuRef,
|
||||
formRef,
|
||||
...toRefs(state)
|
||||
};
|
||||
}
|
||||
});
|
||||
</script>
|
||||
<style scoped>
|
||||
.el-col {
|
||||
margin: 10px 0 !important;
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user