factory_web/src/views/wpm_gx/mlog_form.vue

323 lines
7.1 KiB
Vue

<template>
<el-dialog
:title="titleMap[mode]"
v-model="visible"
:size="1000"
destroy-on-close
@closed="$emit('closed')"
>
<el-container v-loading="loading">
<el-main style="padding: 0 20px 20px 20px">
<el-form
ref="dialogForm"
:model="form"
:rules="rules"
label-position="right"
label-width="80px"
style="padding: 0 10px"
>
<el-row>
<el-col :md="12" :sm="24">
<el-form-item
label="开始时间"
prop="work_start_time"
>
<el-date-picker
:disabled="mode == 'edit'"
v-model="form.work_start_time"
type="datetime"
value-format="YYYY-MM-DD HH:mm:ss"
/>
</el-form-item>
</el-col>
<el-col :md="12" :sm="24">
<el-form-item label="结束时间" prop="work_end_time">
<el-date-picker
v-model="form.work_end_time"
type="datetime"
value-format="YYYY-MM-DD HH:mm:ss"
/>
</el-form-item>
</el-col>
<el-col :span="24">
<el-form-item label="间隔提醒">
<el-input-number
v-model="form.reminder_interval_list[0]"
:min="1"
:disabled="mode == 'edit'"
style="width: 25%"
controls-position="right"
/>
<el-input-number
v-model="form.reminder_interval_list[1]"
:min="1"
:disabled="mode == 'edit'"
style="width: 25%"
controls-position="right"
/>
<el-input-number
v-model="form.reminder_interval_list[2]"
:min="1"
:disabled="mode == 'edit'"
style="width: 25%"
controls-position="right"
/>
<el-input-number
v-model="form.reminder_interval_list[3]"
:min="1"
:disabled="mode == 'edit'"
style="width: 25%"
controls-position="right"
/>
</el-form-item>
</el-col>
<el-col :md="12" :sm="24">
<el-form-item label="生产路线" prop="route">
<el-select
v-model="form.route"
placeholder="生产路线"
clearable
style="width: 100%"
:disabled="mode == 'edit'"
>
<el-option
v-for="item in routeOptions"
:key="item.id"
:label="item.process_name"
:value="item.id"
>
<span
>{{ item.routepack_name }}-{{
item.process_name
}}</span
>
</el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :md="12" :sm="24">
<el-form-item label="生产设备">
<el-select
v-model="form.equipment"
placeholder="生产设备"
clearable
:disabled="mode == 'edit'"
style="width: 100%"
>
<el-option
v-for="item in options"
:key="item.id"
:label="item.name"
:value="item.id"
></el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :md="12" :sm="24">
<el-form-item label="操作人">
<el-select
v-model="form.handle_user"
placeholder="操作人"
clearable
style="width: 100%"
>
<el-option
v-for="item in userOptions"
:key="item.id"
:label="item.name"
:value="item.id"
></el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :md="12" :sm="24">
<el-form-item label="生产类型" prop="mtype">
<el-select
v-model="form.mtype"
placeholder="生产类型"
clearable
:disabled="mode == 'edit'"
style="width: 100%"
>
<el-option
label="自产"
value="10"
></el-option>
<el-option
label="外协"
value="20"
></el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :md="12" :sm="24">
<el-form-item label="备注">
<el-input
v-model="form.note"
clearable
></el-input>
</el-form-item>
</el-col>
</el-row>
</el-form>
</el-main>
<el-footer>
<el-button type="primary" :loading="isSaveing" @click="submit"
>保存</el-button
>
<el-button @click="visible = false">取消</el-button>
</el-footer>
</el-container>
</el-dialog>
</template>
<script>
const defaultForm = {
note: "",
route: "",
equipment: "",
handle_user: "",
work_start_time: "",
reminder_interval_list: [],
};
export default {
props: {
process: {
type: String,
default: "",
},
mgroup: {
type: String,
default: "",
},
},
emits: ["success", "closed"],
data() {
return {
loading: false,
mode: "add",
titleMap: {
add: "新增",
edit: "编辑",
show: "查看",
},
//表单数据
form: defaultForm,
//验证规则
rules: {
work_start_time: [
{
required: true,
message: "请选择生产开始时间",
trigger: "blur",
},
],
route: [
{
required: true,
message: "请选择生产路线",
trigger: "blur",
},
],
mtype: [
{
required: true,
message: "请选择生产类型",
trigger: "blur",
},
],
},
visible: false,
isSaveing: false,
options: [],
routeOptions: [],
userOptions: [],
setFiltersVisible: false,
};
},
mounted() {
this.getRoute();
this.getUser();
this.getEquipment();
},
methods: {
//获取
getUser() {
this.$API.system.user.list.req().then((res) => {
this.userOptions = res.results;
});
},
getEquipment() {
this.$API.em.equipment.list
.req({ page: 0, type: 10 })
.then((res) => {
this.options = res;
});
},
getRoute(id) {
let that = this;
that.$API.mtm.route.list
.req({ process: that.process, page: 0 })
.then((res) => {
that.routeOptions = res;
});
},
//显示
open(mode = "add") {
this.mode = mode;
this.visible = true;
return this;
},
//表单注入数据
setData(data) {
console.log("data", data);
Object.assign(this.form, data);
this.getRoute(data.id);
},
setMgroup(id) {
this.form.mgroup = id;
},
//表单提交方法
submit() {
let that = this;
that.$refs.dialogForm.validate(async (valid) => {
if (valid) {
that.isSaveing = true;
that.form.mgroup = that.mgroup;
if (that.mode === "add") {
that.$API.wpm.mlog.init.req(that.form).then((res) => {
that.isSaveing = false;
that.$emit("success");
that.visible = false;
that.$message.success("操作成功");
});
} else {
let obj = {};
obj.work_end_time = that.form.work_end_time;
obj.handle_user = that.form.handle_user;
obj.note = that.form.note;
that.$API.wpm.mlog.change
.req(that.form.id, that.form)
.then((res) => {
that.isSaveing = false;
that.$emit("success");
that.visible = false;
that.$message.success("操作成功");
});
}
}
});
},
//设置过滤项
setFilters(filters) {
this.selectionFilters = filters;
this.setFiltersVisible = true;
},
},
};
</script>
<style></style>