<template>
|
<div>
|
<el-dialog
|
:title="!dataForm.id ? '新建' : '编辑'"
|
:close-on-click-modal="false"
|
width="80%"
|
:visible.sync="visible">
|
<!-- 添加内容-->
|
<el-form :model="dataForm" label-width="100px" ref="dataForm">
|
<el-row :gutter="20">
|
<el-col :xs="24":sm="6":md="6":lg="6":xl="6">
|
<el-form-item label="机床名" prop="machineName">
|
<el-select filterable v-model="dataForm.machineName" placeholder="支持模糊查询" clearable>
|
<el-option
|
v-for="item in machineNamelist"
|
:key="item.value"
|
:label="item.label"
|
:value="item.value">
|
</el-option>
|
</el-select>
|
</el-form-item>
|
</el-col>
|
<el-col :xs="24":sm="6":md="6":lg="6":xl="6">
|
<el-form-item label="机床ip" prop="machineIp">
|
<el-input v-model="dataForm.machineIp" placeholder="机床ip" clearable></el-input>
|
</el-form-item>
|
</el-col>
|
<el-col :xs="24":sm="6":md="6":lg="6":xl="6">
|
<el-form-item label="车间名" prop="workshop">
|
<el-select v-model="dataForm.workshop" placeholder="请选择" clearable @change="workshopchange">
|
<el-option
|
v-for="item in workshoplist"
|
:key="item.value"
|
:label="item.label"
|
:value="item.value">
|
</el-option>
|
</el-select>
|
</el-form-item>
|
</el-col>
|
<el-col :xs="24":sm="6":md="6":lg="6":xl="6">
|
<el-form-item label="工段名" prop="section">
|
<el-select v-model="dataForm.section" placeholder="请选择" clearable>
|
<el-option
|
v-for="item in sectionlist"
|
:key="item.value"
|
:label="item.label"
|
:value="item.value">
|
</el-option>
|
</el-select>
|
</el-form-item>
|
</el-col>
|
|
<el-col :xs="24":sm="6":md="6":lg="6":xl="6">
|
<el-form-item label="用户名" prop="userName">
|
<el-select filterable v-model="dataForm.userName">
|
<el-option
|
v-for="item in userNamelist"
|
:key="item.value"
|
:label="item.label"
|
:value="item.value">
|
</el-option>
|
</el-select>
|
</el-form-item>
|
</el-col>
|
<el-col :xs="24":sm="6":md="6":lg="6":xl="6">
|
<el-form-item label="统一编码" prop="uuid">
|
<el-input v-model="dataForm.uuid" placeholder="统一编码" clearable></el-input>
|
</el-form-item>
|
</el-col>
|
|
|
<el-col :xs="24":sm="6":md="6":lg="6":xl="6">
|
<el-form-item label="设备规格" prop="specification">
|
<el-input v-model="dataForm.specification" placeholder="设备规格" clearable></el-input>
|
</el-form-item>
|
</el-col>
|
<el-col :xs="24":sm="6":md="6":lg="6":xl="6">
|
<el-form-item label="设备型号" prop="type">
|
<el-input v-model="dataForm.type" placeholder="设备型号" clearable></el-input>
|
</el-form-item>
|
</el-col>
|
<el-col :xs="24":sm="6":md="6":lg="6":xl="6">
|
<el-form-item label="设备类型" prop="category">
|
<el-select v-model="dataForm.category" placeholder="---请选择---">
|
<el-option
|
v-for="item in deviceType"
|
:key="item.value"
|
:label="item.label"
|
:value="item.value">
|
</el-option>
|
</el-select>
|
</el-form-item>
|
</el-col>
|
|
<el-col :xs="24":sm="6":md="6":lg="6":xl="6">
|
<el-form-item label="账务属性" prop="accountingAttribute">
|
<el-select v-model="dataForm.accountingAttribute" placeholder="---请选择---">
|
<el-option
|
v-for="item in financePro"
|
:key="item.value"
|
:label="item.label"
|
:value="item.value">
|
</el-option>
|
</el-select>
|
</el-form-item>
|
</el-col>
|
<!-- <el-col :xs="24":sm="6":md="6":lg="6":xl="6">
|
<el-form-item label="安装地址" prop="location">
|
<el-input v-model="dataForm.location" placeholder="安装地址" clearable></el-input>
|
</el-form-item>
|
</el-col> -->
|
<el-col :xs="24":sm="6":md="6":lg="6":xl="6">
|
<el-form-item label="使用部门" prop="department">
|
<el-select v-model="dataForm.department">
|
<el-option
|
v-for="item in departmentlist"
|
:key="item.value"
|
:label="item.label"
|
:value="item.value">
|
</el-option>
|
</el-select>
|
</el-form-item>
|
</el-col>
|
<el-col :xs="24":sm="6":md="6":lg="6":xl="6">
|
<el-form-item label="设备状态" prop="state">
|
<el-select v-model="dataForm.state" placeholder="---请选择---">
|
<el-option
|
v-for="item in deviceStatus"
|
:key="item.value"
|
:label="item.label"
|
:value="item.value">
|
</el-option>
|
</el-select>
|
</el-form-item>
|
</el-col>
|
|
<!-- <el-col :xs="24":sm="6":md="6":lg="6":xl="6">
|
<el-form-item label="是否关键设备" prop="isCritical">
|
<el-select v-model="dataForm.isCritical">
|
<el-option
|
v-for="item in isselectlist"
|
:key="item.value"
|
:label="item.label"
|
:value="item.value">
|
</el-option>
|
</el-select>
|
</el-form-item>
|
</el-col>
|
<el-col :xs="24":sm="6":md="6":lg="6":xl="6">
|
<el-form-item label="是否精密设备" prop="isPrecision">
|
<el-select v-model="dataForm.isPrecision">
|
<el-option
|
v-for="item in isselectlist"
|
:key="item.value"
|
:label="item.label"
|
:value="item.value">
|
</el-option>
|
</el-select>
|
</el-form-item>
|
</el-col> -->
|
<el-col :xs="24":sm="6":md="6":lg="6":xl="6">
|
<el-form-item label="电气复杂系数" prop="elecCompFactor">
|
<el-input v-model="dataForm.elecCompFactor" placeholder="电气复杂系数" clearable></el-input>
|
</el-form-item>
|
</el-col>
|
<el-col :xs="24":sm="6":md="6":lg="6":xl="6">
|
<el-form-item label="机械复杂系数" prop="mechCompFactor">
|
<el-input v-model="dataForm.mechCompFactor" placeholder="机械复杂系数" clearable></el-input>
|
</el-form-item>
|
</el-col>
|
|
<el-col :xs="24":sm="6":md="6":lg="6":xl="6">
|
<el-form-item label="国别" prop="country">
|
<el-input v-model="dataForm.country" placeholder="国别" clearable></el-input>
|
</el-form-item>
|
</el-col>
|
<el-col :xs="24":sm="6":md="6":lg="6":xl="6">
|
<el-form-item label="设备管理分类" prop="managType">
|
<el-select v-model="dataForm.managType" placeholder="---请选择---">
|
<el-option value="A">A</el-option>
|
<el-option value="B">B</el-option>
|
<el-option value="C">C</el-option>
|
</el-select>
|
</el-form-item>
|
</el-col>
|
<el-col :xs="24":sm="6":md="6":lg="6":xl="6">
|
<el-form-item label="班次" prop="classes">
|
<el-select v-model="dataForm.classes" placeholder="---请选择---">
|
<el-option value="一班">一班</el-option>
|
<el-option value="二班">二班</el-option>
|
<el-option value="三班">三班</el-option>
|
</el-select>
|
</el-form-item>
|
</el-col>
|
<el-col :xs="24":sm="6":md="6":lg="6":xl="6">
|
<el-form-item label="生产厂家" prop="manufacturer">
|
<el-input v-model="dataForm.manufacturer" placeholder="生产厂家" clearable></el-input>
|
</el-form-item>
|
</el-col>
|
<el-col :xs="24":sm="6":md="6":lg="6":xl="6">
|
<el-form-item label="投产日期" prop="productionDate">
|
<el-date-picker format="yyyy-MM-dd" value-format="yyyy-MM-dd" v-model="dataForm.productionDate" type="date" clearable placeholder="选择日期"></el-date-picker>
|
</el-form-item>
|
</el-col>
|
<el-col :xs="24":sm="6":md="6":lg="6":xl="6">
|
<el-form-item label="设备原值" prop="originalValue">
|
<el-input v-model="dataForm.originalValue" placeholder="设备原值" clearable></el-input>
|
</el-form-item>
|
</el-col>
|
|
<el-col :xs="24":sm="6":md="6":lg="6":xl="6">
|
<el-form-item label="设备净现值" prop="presentValue">
|
<el-input v-model="dataForm.presentValue" placeholder="设备净现值" clearable></el-input>
|
</el-form-item>
|
</el-col>
|
<el-col :xs="24":sm="6":md="6":lg="6":xl="6">
|
<el-form-item label="设备重量" prop="weight">
|
<el-input v-model="dataForm.weight" placeholder="设备重量" clearable></el-input>
|
</el-form-item>
|
</el-col>
|
<el-col :xs="24":sm="6":md="6":lg="6":xl="6">
|
<el-form-item label="备注" prop="remark">
|
<el-input v-model="dataForm.remark" placeholder="备注" clearable></el-input>
|
</el-form-item>
|
</el-col>
|
</el-row>
|
<!-- 上传 -->
|
<!-- <el-row :gutter="20">
|
<el-col :xs="24":sm="12":md="12":lg="12":xl="12">
|
<el-form-item label="上传照片" prop="">
|
<el-upload
|
class="avatar-uploader"
|
action="https://jsonplaceholder.typicode.com/posts/"
|
:show-file-list="false"
|
:on-success="handleAvatarSuccess"
|
:before-upload="beforeAvatarUpload">
|
<img v-if="imageUrl" :src="imageUrl" class="avatar">
|
<i v-else class="el-icon-plus avatar-uploader-icon"></i>
|
</el-upload>
|
</el-form-item>
|
</el-col>
|
<el-col :xs="24":sm="12":md="12":lg="12":xl="12">
|
<el-form-item label="相关文档" prop="">
|
<el-upload
|
class="upload-demo"
|
action="https://jsonplaceholder.typicode.com/posts/"
|
:on-preview="handlePreview"
|
:on-remove="handleRemove"
|
:before-remove="beforeRemove"
|
multiple
|
:limit="9"
|
:on-exceed="handleExceed"
|
:file-list="fileList">
|
<el-button size="small" type="primary">点击上传</el-button>
|
</el-upload>
|
</el-form-item>
|
</el-col>
|
</el-row> -->
|
|
</el-form>
|
<!-- 按钮 -->
|
<span slot="footer" class="dialog-footer">
|
<el-button size="mini" @click="visible = false">取消</el-button>
|
<el-button size="mini" type="primary" @click="dataFormSubmit()">保存</el-button>
|
</span>
|
</el-dialog>
|
</div>
|
</template>
|
|
<script>
|
import { addEquipment, getWorkShopInfo, getMachineList, updateEquipment, queryuserlist, queryworkshoplist } from '@/api/MdcApi'
|
export default {
|
data() {
|
return {
|
visible: false,
|
dataForm: {
|
id: 0, // title显示新增还是修改
|
machineName: '', // 机床名
|
machineIp: '', // 机床ip
|
workshop: '', // 车间名
|
section: '', // 工段名
|
userName: '', // 用户名
|
uuid: '', // 统一编码
|
specification: '', // 设备规格
|
type: '', // 设备型号
|
category: '', // 设备类别
|
accountingAttribute: '', // 财务属性
|
location: '', // 安装地址
|
department: '', // 使用部门
|
state: '', // 设备状态
|
isCritical: '1', // 是否关键设备
|
isPrecision: '1', // 是否精密设备
|
elecCompFactor: '', // 电气复杂系数
|
mechCompFactor: '', // 机械复杂系数
|
country: '', // 国别
|
managType: '', // 设备管理
|
classes: '', // 班次
|
manufacturer: '', // 生产厂家
|
productionDate: '', // 投产日期
|
originalValue: '', // 设备原值
|
presentValue: '', // 设备净现值
|
weight: '', // 设备重量
|
remark: ''// 备注
|
},
|
machineNamelist: [], // 机床下拉
|
workshoplist: [], // 车间list
|
oldworkshoplist: [],
|
sectionlist: [], // 工段
|
departmentlist: [],
|
isselectlist: [
|
{
|
label: '是',
|
value: '1'
|
},
|
{
|
label: '否',
|
value: '0'
|
}
|
],
|
// 设备类型
|
deviceType: [
|
{ value: '立加', label: '立加' },
|
{ value: '卧加', label: '卧加' },
|
{ value: '立卧转换', label: '立卧转换' },
|
{ value: '五轴', label: '五轴' },
|
{ value: '数控车', label: '数控车' },
|
{ value: '复合加工', label: '复合加工' },
|
{ value: '数控磨', label: '数控磨' },
|
{ value: '齿加工', label: '齿加工' },
|
{ value: '电工加', label: '电工加' }
|
],
|
// 设备状态
|
deviceStatus: [
|
{ value: 'STOP', label: '关机' },
|
{ value: 'RUN', label: '运行' },
|
{ value: 'IDLE', label: '空闲' },
|
{ value: 'ALARM', label: '报警' }
|
],
|
// 账务属性
|
financePro: [
|
{ value: '帐内', label: '帐内' },
|
{ value: '帐外', label: '帐外' }
|
],
|
userNamelist: [], // 用户list
|
imageUrl: '', // 图片
|
fileList: []// 文档上传list
|
}
|
},
|
methods: {
|
init(row) {
|
if (this.$refs['dataForm']) {
|
this.$refs['dataForm'].resetFields()
|
}
|
if (row !== undefined) {
|
this.dataForm.id = row.id
|
this.dataForm.machineName = row.machineName
|
this.dataForm.machineIp = row.machineIp
|
this.dataForm.workshop = row.workshop
|
this.dataForm.section = row.section
|
this.dataForm.userName = row.userName
|
this.dataForm.uuid = row.uuid
|
this.dataForm.specification = row.specification
|
this.dataForm.type = row.type
|
this.dataForm.category = row.category
|
this.dataForm.accountingAttribute = row.accountingAttribute
|
this.dataForm.location = row.location
|
this.dataForm.department = row.department
|
this.dataForm.state = row.state
|
this.dataForm.isCritical = row.isCritical
|
this.dataForm.isPrecision = row.isPrecision
|
this.dataForm.elecCompFactor = row.elecCompFactor
|
this.dataForm.mechCompFactor = row.mechCompFactor
|
this.dataForm.country = row.country
|
this.dataForm.manufacturer = row.manufacturer
|
this.dataForm.productionDate = row.productionDate
|
this.dataForm.originalValue = row.originalValue
|
this.dataForm.presentValue = row.presentValue
|
this.dataForm.weight = row.weight
|
this.dataForm.remark = row.remark
|
this.dataForm.managType = row.managType
|
this.dataForm.classes = row.classes
|
} else { this.dataForm.id = 0 }
|
this.visible = true
|
this.getMachineList()
|
this.queryuserlist()
|
this.querydepartmentlist()
|
this.queryworkshoplist()
|
},
|
// 获取机床lists
|
getMachineList() {
|
getMachineList(this.currentPage, this.keyWord).then(res => {
|
this.machineNamelist = []
|
if (res.list.length > 0) {
|
res.list.map(item => {
|
this.machineNamelist.push({
|
value: item.name,
|
label: item.name
|
})
|
})
|
}
|
})
|
},
|
/* 查询部门list*/
|
querydepartmentlist() {
|
getWorkShopInfo().then(res => {
|
this.departmentlist = []
|
if (res.workshopList.length > 0) {
|
res.workshopList.map(item => {
|
this.departmentlist.push({
|
value: item.name,
|
label: item.name
|
})
|
})
|
}
|
})
|
},
|
/* 获取用户list*/
|
queryuserlist() {
|
queryuserlist().then(res => {
|
this.userNamelist = []
|
if (res.list.length > 0) {
|
res.list.map(item => {
|
this.userNamelist.push({
|
value: item.name,
|
label: item.name
|
})
|
})
|
}
|
})
|
},
|
/* 获取车间名list*/
|
queryworkshoplist() {
|
queryworkshoplist().then(res => {
|
this.workshoplist = []
|
if (res.workshopList.length > 0) {
|
this.oldworkshoplist = res.workshopList
|
res.workshopList.map(item => {
|
this.workshoplist.push({
|
value: item.name,
|
label: item.name
|
})
|
})
|
}
|
})
|
},
|
/* 车间名改变 获取工段*/
|
workshopchange() {
|
var cjname = this.dataForm.workshop
|
this.sectionlist = []
|
this.oldworkshoplist.map(item => {
|
if (item.name === cjname) {
|
item.sectionList.map(items => {
|
this.sectionlist.push({
|
value: items.name,
|
label: items.name
|
})
|
})
|
}
|
})
|
},
|
|
/* 图片*/
|
handleAvatarSuccess(res, file) {
|
this.imageUrl = URL.createObjectURL(file.raw)
|
},
|
beforeAvatarUpload(file) {
|
const isJPG = file.type === 'image/jpeg'
|
const isLt2M = file.size / 1024 / 1024 < 2
|
if (!isJPG) {
|
this.$message.error('上传头像图片只能是 JPG 格式!')
|
}
|
if (!isLt2M) {
|
this.$message.error('上传头像图片大小不能超过 2MB!')
|
}
|
return isJPG && isLt2M
|
},
|
/* 文档 */
|
handleRemove(file, fileList) {
|
// console.log(file, fileList)
|
},
|
handlePreview(file) {
|
// console.log(file)
|
},
|
handleExceed(files, fileList) {
|
this.$message.warning(`当前限制选择 3 个文件，本次选择了 ${files.length} 个文件，共选择了 ${files.length + fileList.length} 个文件`)
|
},
|
beforeRemove(file, fileList) {
|
return this.$confirm(`确定移除 ${file.name}？`)
|
},
|
/* 提交*/
|
dataFormSubmit() {
|
if (this.dataForm.id === 0) { // 新增
|
addEquipment(this.dataForm).then(res => {
|
this.$message({
|
message: '新增成功',
|
type: 'success',
|
duration: 1500,
|
onClose: () => {
|
this.$emit('refreshDataList')
|
this.visible = false
|
}
|
})
|
})
|
} else {
|
updateEquipment(this.dataForm).then(res => {
|
this.$message({
|
message: '修改成功',
|
type: 'success',
|
duration: 1500,
|
onClose: () => {
|
this.$emit('refreshDataList')
|
this.visible = false
|
}
|
})
|
})
|
}
|
}
|
}
|
}
|
</script>
|
|
<style>
|
.avatar-uploader .el-upload {
|
border: 1px dashed #d9d9d9;
|
border-radius: 6px;
|
cursor: pointer;
|
position: relative;
|
overflow: hidden;
|
}
|
.avatar-uploader .el-upload:hover {
|
border-color: #409EFF;
|
}
|
.avatar-uploader-icon {
|
font-size: 28px;
|
color: #8c939d;
|
width: 178px;
|
height: 178px;
|
line-height: 178px;
|
text-align: center;
|
}
|
.avatar {
|
width: 178px;
|
height: 178px;
|
display: block;
|
}
|
</style>
|
