382 lines
15 KiB
Vue
382 lines
15 KiB
Vue
<template>
|
||
<el-container>
|
||
<el-main>
|
||
<el-scrollbar>
|
||
<el-form ref="form" :size="size" :rules="rules" label-width="95px" :model="form">
|
||
<div class="boxMain">
|
||
<div class="title">工作时间</div>
|
||
<div class="boxCom">
|
||
<el-row>
|
||
<el-col :span="8" :lg="6">
|
||
<el-form-item label="报修客户" prop="customer">
|
||
<el-select class="input" v-model="form.customer" @visible-change="getCustomerSelect('customer')" placeholder="请选择报修客户">
|
||
<el-option v-for="(item,index) in setMap['customer']" :key="index" :value="item.id" :label="item.customer_name"></el-option>
|
||
</el-select>
|
||
</el-form-item>
|
||
</el-col>
|
||
<el-col :span="8" :lg="6">
|
||
<el-form-item label="标准机型" prop="standard_model">
|
||
<el-input class="input" type="text" v-model="form.standard_model" placeholder="请输入标准机型"></el-input>
|
||
</el-form-item>
|
||
</el-col>
|
||
<el-col :span="8" :lg="6">
|
||
<el-form-item label="报修日期">
|
||
<el-date-picker class="input" type="date" value-format="YYYY-MM-DD" placeholder="请选择报修日期"></el-date-picker>
|
||
</el-form-item>
|
||
</el-col>
|
||
</el-row>
|
||
<el-row>
|
||
<el-col :span="8" :lg="6">
|
||
<el-form-item label="PE确认时间" prop="pe_confirmation_time">
|
||
<el-date-picker class="input" v-model="form.pe_confirmation_time" type="date" value-format="YYYY-MM-DD" placeholder="请选择PE确认时间"></el-date-picker>
|
||
</el-form-item>
|
||
</el-col>
|
||
<el-col :span="8" :lg="6">
|
||
<el-form-item label="过保时间" prop="warranty_end_date">
|
||
<el-date-picker class="input" v-model="form.warranty_end_date" type="date" value-format="YYYY-MM-DD" placeholder="请选择过保时间"></el-date-picker>
|
||
</el-form-item>
|
||
</el-col>
|
||
</el-row>
|
||
</div>
|
||
</div>
|
||
<div class="boxMain">
|
||
<div class="title">维保单号</div>
|
||
<div class="boxCom">
|
||
<el-row>
|
||
<el-col :span="8" :lg="6">
|
||
<el-form-item label="维修单号" prop="repair_order_no">
|
||
<el-input class="input" type="text" v-model="form.repair_order_no" disabled placeholder="请输入维修单号"></el-input>
|
||
</el-form-item>
|
||
</el-col>
|
||
</el-row>
|
||
</div>
|
||
</div>
|
||
<div class="boxMain">
|
||
<div class="title">维保工单信息</div>
|
||
<div class="boxCom">
|
||
<el-row>
|
||
<el-col :span="8" :lg="6">
|
||
<el-form-item label="维修单等级" prop="maintenance_grade">
|
||
<el-input class="input" v-model="form.maintenance_grade" type="text" placeholder="请输入维修等级"></el-input>
|
||
</el-form-item>
|
||
</el-col>
|
||
<el-col :span="8" :lg="6">
|
||
<el-form-item label="维修分类" prop="maintenance_level">
|
||
<el-select class="input" v-model="form.maintenance_level" @visible-change="getSelect('maintenance_level',2)" placeholder="请选择维修分类">
|
||
<el-option v-for="(item,index) in setMap['maintenance_level']" :key="index" :value="item.id" :label="item.item_name"></el-option>
|
||
</el-select>
|
||
</el-form-item>
|
||
</el-col>
|
||
<el-col :span="8" :lg="6">
|
||
<el-form-item label="故障内容" prop="fault_description">
|
||
<el-input class="input" v-model="form.fault_description" type="text" placeholder="请输入维修单号"></el-input>
|
||
</el-form-item>
|
||
</el-col>
|
||
</el-row>
|
||
<el-row>
|
||
<el-col :span="8" :lg="6">
|
||
<el-form-item label="故障类型" prop="fault_type">
|
||
<el-select class="input" v-model="form.fault_type" @visible-change="getSelect('fault_type',1)" placeholder="请选择故障类型">
|
||
<el-option v-for="(item,index) in setMap['fault_type']" :key="index" :value="item.id" :label="item.item_name"></el-option>
|
||
</el-select>
|
||
</el-form-item>
|
||
</el-col>
|
||
<el-col :span="8" :lg="6">
|
||
<el-form-item label="维保等级" prop="maintenance_plan">
|
||
<el-input class="input" v-model="form.maintenance_plan" placeholder="维保等级">
|
||
</el-input>
|
||
</el-form-item>
|
||
</el-col>
|
||
<el-col :span="8" :lg="6">
|
||
<el-form-item label="是否关机" prop="requires_shutdown">
|
||
<el-select class="input" v-model="form.requires_shutdown" placeholder="请选择是否关机">
|
||
<el-option label="是" :value="1"></el-option>
|
||
<el-option label="否" :value="0"></el-option>
|
||
</el-select>
|
||
</el-form-item>
|
||
</el-col>
|
||
</el-row>
|
||
<el-row>
|
||
<el-col :span="8" :lg="6">
|
||
<el-form-item label="机房城市" prop="city">
|
||
<el-input class="input" v-model="form.city" placeholder="机房城市">
|
||
</el-input>
|
||
</el-form-item>
|
||
</el-col>
|
||
<el-col :span="8" :lg="6">
|
||
<el-form-item label="园区" prop="park_name">
|
||
<el-input class="input" v-model="form.park_name" placeholder="园区">
|
||
</el-input>
|
||
</el-form-item>
|
||
</el-col>
|
||
</el-row>
|
||
<el-row>
|
||
<el-col :span="8" :lg="6">
|
||
<el-form-item label="机房/IDC" prop="data_center_name">
|
||
<el-input class="input" v-model="form.data_center_name" placeholder="机房/IDC">
|
||
</el-input>
|
||
</el-form-item>
|
||
</el-col>
|
||
<el-col :span="8" :lg="6">
|
||
<el-form-item label="机架位" prop="rack_position">
|
||
<el-input class="input" v-model="form.rack_position" type="text" placeholder="请输入机架位"></el-input>
|
||
</el-form-item>
|
||
</el-col>
|
||
</el-row>
|
||
<el-row>
|
||
<el-col :span="8" :lg="6">
|
||
<el-form-item label="整机SN/Se" prop="device_sn">
|
||
<el-input class="input" v-model="form.device_sn" placeholder="整机SN/Se">
|
||
</el-input>
|
||
</el-form-item>
|
||
</el-col>
|
||
<el-col :span="8" :lg="6">
|
||
<el-form-item label="整机厂商" prop="device_manufacturer">
|
||
<el-input class="input" v-model="form.device_manufacturer" type="text" placeholder="请输入整机厂商"></el-input>
|
||
</el-form-item>
|
||
</el-col>
|
||
<el-col :span="8" :lg="6">
|
||
<el-form-item label="整机型号" prop="device_model">
|
||
<el-input class="input" v-model="form.device_model" type="text" placeholder="请输入整机型号"></el-input>
|
||
</el-form-item>
|
||
</el-col>
|
||
</el-row>
|
||
</div>
|
||
</div>
|
||
<div class="boxMain">
|
||
<div class="title">维保工单信息</div>
|
||
<div class="boxCom">
|
||
<el-row>
|
||
<el-col :span="25" :lg="24">
|
||
<el-form-item label="验证ERP库存" prop="is_verify_erp_inventory">
|
||
<el-radio-group v-model="form.is_verify_erp_inventory">
|
||
<el-radio :value="true">是</el-radio>
|
||
<el-radio :value="false">否</el-radio>
|
||
</el-radio-group>
|
||
</el-form-item>
|
||
</el-col>
|
||
</el-row>
|
||
<div class="orderView" v-if="!form.is_verify_erp_inventory">
|
||
<el-row>
|
||
<el-col :span="8" :lg="6">
|
||
<el-form-item label="部件SN/Sp" prop="component_serial_no">
|
||
<el-input class="input" v-model="form.component_serial_no" placeholder="部件SN/Se"></el-input>
|
||
</el-form-item>
|
||
</el-col>
|
||
<el-col :span="8" :lg="6">
|
||
<el-form-item label="部件厂商" prop="component_manufacturer">
|
||
<el-input class="input" v-model="form.component_manufacturer" type="text" placeholder="请输入部件厂商"></el-input>
|
||
</el-form-item>
|
||
</el-col>
|
||
<el-col :span="8" :lg="6">
|
||
<el-form-item label="部件型号" prop="component_model">
|
||
<el-input class="input" v-model="form.component_model" type="text" placeholder="请输入部件型号"></el-input>
|
||
</el-form-item>
|
||
</el-col>
|
||
</el-row>
|
||
<el-row>
|
||
<el-col :span="8" :lg="6">
|
||
<el-form-item label="部件PN/Sp" prop="component_pn">
|
||
<el-input class="input" v-model="form.component_pn" type="text" placeholder="请输入部件SN/Sp"></el-input>
|
||
</el-form-item>
|
||
</el-col>
|
||
<el-col :span="8" :lg="6">
|
||
<el-form-item label="SLA截止时间" prop="sla_expiration">
|
||
<el-date-picker class="input" v-model="form.sla_expiration" type="date" value-format="YYYY-MM-DD" placeholder="请选择SLA截止时间"></el-date-picker>
|
||
</el-form-item>
|
||
</el-col>
|
||
<el-col :span="8" :lg="6">
|
||
<el-form-item label="剩余BD数" prop="bd_backup_count">
|
||
<el-input class="input" v-model="form.bd_backup_count" type="text" placeholder="请输入剩余BD数"></el-input>
|
||
</el-form-item>
|
||
</el-col>
|
||
</el-row>
|
||
</div>
|
||
<div v-else>
|
||
<div v-for="(item,index) in form.component_info" :key="index">
|
||
<el-row>
|
||
<el-col :span="8" :lg="6">
|
||
<el-form-item label="部件SN/Sp" :prop="'form.component_info.'+index+'.component_serial_no'">
|
||
<el-input class="input" v-model="item.component_serial_no" placeholder="部件SN/Se"></el-input>
|
||
</el-form-item>
|
||
</el-col>
|
||
<el-col :span="8" :lg="6">
|
||
<el-form-item label="部件厂商" :prop="'form.component_info.'+index+'.component_manufacturer'">
|
||
<el-input class="input" v-model="item.component_manufacturer" type="text" placeholder="请输入部件厂商"></el-input>
|
||
</el-form-item>
|
||
</el-col>
|
||
<el-col :span="8" :lg="6">
|
||
<el-form-item label="部件型号" :prop="'form.component_info.'+index+'.component_model'">
|
||
<el-input class="input" v-model="item.component_model" type="text" placeholder="请输入部件型号"></el-input>
|
||
</el-form-item>
|
||
</el-col>
|
||
</el-row>
|
||
<el-row>
|
||
<el-col :span="8" :lg="6">
|
||
<el-form-item label="部件PN/Sp" :prop="'form.component_info.'+index+'.component_pn'">
|
||
<el-input class="input" v-model="item.component_pn" type="text" placeholder="请输入部件SN/Sp"></el-input>
|
||
</el-form-item>
|
||
</el-col>
|
||
<el-col :span="8" :lg="6">
|
||
<el-form-item label="SLA截止时间" :prop="'form.component_info.'+index+'.sla_expiration'">
|
||
<el-date-picker class="input" v-model="item.sla_expiration" type="date" value-format="YYYY-MM-DD" placeholder="请选择SLA截止时间"></el-date-picker>
|
||
</el-form-item>
|
||
</el-col>
|
||
<el-col :span="8" :lg="6">
|
||
<el-form-item label="剩余BD数" :prop="'form.component_info.'+index+'.bd_backup_count'">
|
||
<el-input class="input" v-model="item.bd_backup_count" type="text" placeholder="请输入剩余BD数"></el-input>
|
||
</el-form-item>
|
||
</el-col>
|
||
</el-row>
|
||
</div>
|
||
</div>
|
||
<el-row v-if="form.is_verify_erp_inventory">
|
||
<div style="padding-left: 105px">
|
||
<el-button type="primary" size="small" icon="el-icon-Plus" @click="addOrder"></el-button>
|
||
<el-button type="danger" size="small" icon="el-icon-Minus" @click="deleteOrder" v-if="form.component_info.length>1"></el-button>
|
||
</div>
|
||
</el-row>
|
||
</div>
|
||
</div>
|
||
<div class="btnBox">
|
||
<el-button type="primary" :size="size" @click="save" :loading="isSave">确认保存</el-button>
|
||
</div>
|
||
</el-form>
|
||
</el-scrollbar>
|
||
</el-main>
|
||
</el-container>
|
||
</template>
|
||
|
||
<script>
|
||
export default {
|
||
name: "create-order",
|
||
data(){
|
||
return{
|
||
size:"small",
|
||
isSave:false,
|
||
setMap:{
|
||
maintenance_level:[],
|
||
fault_type:[],
|
||
},
|
||
form:{
|
||
customer:"", // 客户
|
||
standard_model:"", // 标准机型
|
||
repair_order_no:"",
|
||
maintenance_grade:"", // 维修等级
|
||
maintenance_level: "", // 维修分类
|
||
fault_type: "", // 故障类型
|
||
fault_description: "", // 故障描述
|
||
requires_shutdown: "", // 是否需要关机
|
||
city: "", // 机房城市
|
||
park_name: "", // 园区名称
|
||
data_center_name: "", // 机房/IDC名称
|
||
rack_position: "", // 机架位置
|
||
device_sn: "", // 整机SN
|
||
device_manufacturer: "", // 整机厂商
|
||
device_model: "", // 整机型号
|
||
component_serial_no: "", // 部件序列号
|
||
component_manufacturer: "", // 部件厂商
|
||
component_model: "", // 部件型号
|
||
component_pn: "", // 部件零件PN号
|
||
sla_expiration: "", // SLA到期时间
|
||
bd_backup_count: "", // 剩余BD数
|
||
pe_confirmation_time: "", // PE确认时间
|
||
warranty_end_date: "", // 保修期结束
|
||
maintenance_plan: '', // 维保等级：1-铜牌；常量维护项
|
||
is_verify_erp_inventory:true,
|
||
component_info:[
|
||
{
|
||
component_serial_no:"",
|
||
component_manufacturer:"",
|
||
component_model:"",
|
||
component_pn:""
|
||
}
|
||
]
|
||
},
|
||
rules:{
|
||
fault_description:[{required:true,trigger:"blur",message:"故障描述不能为空"}],
|
||
fault_type:[{required:true,trigger:"change",message:"故障类型不能为空"}],
|
||
city:[{required:true,trigger:"blur",message:"机房城市不能为空"}],
|
||
device_sn:[{required:true,trigger:"blur",message:"整机SN/Se不能为空"}],
|
||
device_manufacturer:[{required:true,trigger:"blur",message:"整机厂商不能为空"}],
|
||
device_model:[{required:true,trigger:"blur",message:"整机型号不能为空"}],
|
||
sla_expiration:[{required:true,trigger:"change",message:"SLA截止时间不能为空"}],
|
||
bd_backup_count:[{required:true,trigger:"blur",message:"剩余BD数不能为空"}],
|
||
},
|
||
}
|
||
},
|
||
mounted() {
|
||
|
||
},
|
||
methods:{
|
||
async getSelect(name,num) {
|
||
const res = await this.$API.orders.order.maintenance.optionList.post({const_type:num});
|
||
if(res.code == 200){
|
||
this.setMap[name] = res.data;
|
||
}
|
||
},
|
||
async getCustomerSelect(name){
|
||
let params = {
|
||
field:"customer_name",
|
||
id:{
|
||
operator:"in",
|
||
value:""
|
||
}
|
||
}
|
||
const res = await this.$API.setup.customer.select.post(params);
|
||
if(res.code == 200){
|
||
this.setMap[name] = res.data;
|
||
}
|
||
},
|
||
addOrder(){
|
||
this.form.component_info.push({
|
||
component_serial_no:"",
|
||
component_manufacturer:"",
|
||
component_model:"",
|
||
component_pn:""
|
||
})
|
||
},
|
||
deleteOrder(){
|
||
this.form.component_info.pop();
|
||
},
|
||
save(){
|
||
this.$refs.form.validate(async (valid) => {
|
||
if (valid) {
|
||
this.isSave = true;
|
||
const res = await this.$API.orders.order.maintenance.add.post(this.form);
|
||
this.isSave = false;
|
||
if(res.code == 200){
|
||
this.$message.success("操作成功");
|
||
}
|
||
}
|
||
})
|
||
}
|
||
}
|
||
}
|
||
</script>
|
||
|
||
<style scoped lang="scss">
|
||
.boxMain{
|
||
border-bottom: 1px solid #f2f2f2;
|
||
padding: 10px 0 5px 0;
|
||
.title{
|
||
margin-bottom: 10px;
|
||
}
|
||
.boxCom{
|
||
.el-row{
|
||
.el-col{
|
||
padding: 0 10px;
|
||
::v-deep .input{
|
||
width: 100%;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
.btnBox{
|
||
margin-top: 15px;
|
||
text-align: left;
|
||
padding: 0 10px;
|
||
}
|
||
</style>
|