|
@@ -1,10 +1,243 @@
|
|
|
<template>
|
|
|
-
|
|
|
+ <div>
|
|
|
+ <el-dialog
|
|
|
+ :title="!id ? '新增': display ? '点检记录' : '修改'"
|
|
|
+ width="70%"
|
|
|
+ :close-on-click-modal="false"
|
|
|
+ :visible.sync="visible">
|
|
|
+ <el-form :model="dataForm" :rules="dataRule" ref="dataForm" label-width="auto">
|
|
|
+ <el-row class="my-row">
|
|
|
+ <el-col :span="8">
|
|
|
+ <el-form-item label="编码" prop="code">
|
|
|
+ <el-input v-model="dataForm.code" :disabled="display || !id" placeholder="系统自动生成,无需填写"></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="8" style="padding-left: 10px">
|
|
|
+ <el-form-item label="名称" prop="name">
|
|
|
+ <el-input v-model="dataForm.name" :disabled="display" placeholder="名称"></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="8" style="padding-left: 10px">
|
|
|
+ <el-form-item label="型号规格" prop="specifications">
|
|
|
+ <el-input v-model="dataForm.specifications" :disabled="display" placeholder="型号规格"></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ <el-row class="my-row">
|
|
|
+ <el-col :span="8">
|
|
|
+ <el-form-item label="制造商" prop="manufacturers">
|
|
|
+ <el-input v-model="dataForm.manufacturers" :disabled="display" placeholder="制造商"></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="8" style="padding-left: 10px">
|
|
|
+ <el-form-item label="检定日期" prop="verificationDate">
|
|
|
+ <el-date-picker
|
|
|
+ :disabled="display"
|
|
|
+ v-model="dataForm.verificationDate"
|
|
|
+ value-format="yyyy-MM-dd"
|
|
|
+ type="date">
|
|
|
+ </el-date-picker>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="8" style="padding-left: 10px">
|
|
|
+ <el-form-item label="检定有效期" prop="validityDate">
|
|
|
+ <el-date-picker
|
|
|
+ :disabled="display"
|
|
|
+ v-model="dataForm.validityDate"
|
|
|
+ value-format="yyyy-MM-dd"
|
|
|
+ type="date">
|
|
|
+ </el-date-picker>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ <el-row class="my-row">
|
|
|
+ <el-col :span="8">
|
|
|
+ <el-form-item label="设备责任人" prop="responsibilityUser">
|
|
|
+ <el-input v-if="display" v-model="dataForm.responsibilityUserName" disabled></el-input>
|
|
|
+ <user-component v-else v-model="dataForm.responsibilityUser"/>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="8" style="padding-left: 20px">
|
|
|
+ <el-form-item label="操作人" prop="userOf">
|
|
|
+ <el-input v-if="display" v-model="dataForm.userOfName" disabled></el-input>
|
|
|
+ <user-component v-else v-model="dataForm.userOf"/>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ <el-row class="my-row">
|
|
|
+ <div class="title"><span style="color: red">*</span> 使用说明书</div>
|
|
|
+ <el-upload
|
|
|
+ class="upload-demo"
|
|
|
+ ref="upload"
|
|
|
+ :multiple="true"
|
|
|
+ action="#"
|
|
|
+ accept="image/jpeg,image/gif,image/png"
|
|
|
+ :on-preview="handlePreview"
|
|
|
+ :on-remove="handleRemove"
|
|
|
+ :on-change="handleChange"
|
|
|
+ :file-list="fileList"
|
|
|
+ :limit="5"
|
|
|
+ :on-exceed="handleExceed"
|
|
|
+ :auto-upload="false">
|
|
|
+ <el-button v-show="!display" slot="trigger" size="small" type="primary">选取文件</el-button>
|
|
|
+ <el-button v-show="!display" style="margin-left: 10px;" size="small" type="success" @click="submitUpload">开始上传</el-button>
|
|
|
+ <div v-show="!display" slot="tip" class="el-upload__tip">只能上传jpg/png文件,最多5张图片,且每张图片不超过10M</div>
|
|
|
+ </el-upload>
|
|
|
+ </el-row>
|
|
|
+ <el-row class="my-row">
|
|
|
+ <el-form-item label="备注" prop="notes">
|
|
|
+ <el-input v-model="dataForm.notes" :disabled="display" placeholder="备注"></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ </el-row>
|
|
|
+ </el-form>
|
|
|
+ <span slot="footer" class="dialog-footer">
|
|
|
+ <el-button @click="visible = false">取消</el-button>
|
|
|
+ <el-button v-if="!display" type="primary" @click="dataFormSubmit()">确定</el-button>
|
|
|
+ </span>
|
|
|
+ </el-dialog>
|
|
|
+ </div>
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
+ import { getEquipmentDetail } from '@/api/production'
|
|
|
+ import UserComponent from '../common/user-component'
|
|
|
+ import { uploadUrl, downloadUrl, uploadFiles } from '@/api/file'
|
|
|
export default {
|
|
|
- name: 'equipment-add-or-update'
|
|
|
+ name: 'equipment-add-or-update',
|
|
|
+ components: {
|
|
|
+ UserComponent
|
|
|
+ },
|
|
|
+ data () {
|
|
|
+ return {
|
|
|
+ visible: false,
|
|
|
+ display: false,
|
|
|
+ dataList: [],
|
|
|
+ fileList: [],
|
|
|
+ id: 0,
|
|
|
+ dataForm: {},
|
|
|
+ optionsType: [],
|
|
|
+ optionsApplier: [],
|
|
|
+ materialDetails: [],
|
|
|
+ addMaterialVisible: false,
|
|
|
+ totalAmount: 0,
|
|
|
+ dataRule: {
|
|
|
+ name: [{ required: true, message: '名称不能为空', trigger: 'blur' }],
|
|
|
+ specifications: [{ required: true, message: '型号规格不能为空', trigger: 'blur' }],
|
|
|
+ manufacturers: [{ required: true, message: '制造商不能为空', trigger: 'blur' }],
|
|
|
+ verificationDate: [{ required: true, message: '检定日期不能为空', trigger: 'change' }],
|
|
|
+ validityDate: [{ required: true, message: '检定有效期不能为空', trigger: 'change' }]
|
|
|
+ },
|
|
|
+ uploadUrl: uploadUrl,
|
|
|
+ previewPath: '',
|
|
|
+ previewName: '',
|
|
|
+ previewVisible: false
|
|
|
+ }
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ async init (id, display) {
|
|
|
+ this.materialDetails = []
|
|
|
+ this.dataForm = {
|
|
|
+ payType: '0'
|
|
|
+ }
|
|
|
+ this.visible = true
|
|
|
+ this.id = id || 0
|
|
|
+ this.display = display
|
|
|
+ if (!id) return
|
|
|
+ await getEquipmentDetail(this.id).then(({data}) => {
|
|
|
+ if (data && data.code === '200') {
|
|
|
+ this.dataForm = data.data
|
|
|
+ // 文件列表
|
|
|
+ this.fileList = []
|
|
|
+ if (data.data.attachList) {
|
|
|
+ data.data.attachList.forEach((item) => {
|
|
|
+ this.fileList.push({
|
|
|
+ name: item.fileName,
|
|
|
+ url: item.url,
|
|
|
+ id: item.url
|
|
|
+ })
|
|
|
+ })
|
|
|
+ }
|
|
|
+ }
|
|
|
+ })
|
|
|
+ },
|
|
|
+ validateField (type) {
|
|
|
+ this.$refs.dataForm.validateField(type)
|
|
|
+ },
|
|
|
+ // 表单提交
|
|
|
+ dataFormSubmit () {
|
|
|
+ this.$refs['dataForm'].validate((valid) => {
|
|
|
+ if (valid) {
|
|
|
+ // 添加附件
|
|
|
+ let fList = this.fileList
|
|
|
+ if (fList.length > 0) {
|
|
|
+ this.dataForm.attachList = []
|
|
|
+ for (let i = 0; i < fList.length; i++) {
|
|
|
+ this.dataForm.attachList.push({
|
|
|
+ fileName: fList[i].name,
|
|
|
+ url: fList[i].url
|
|
|
+ })
|
|
|
+ }
|
|
|
+ }
|
|
|
+ this.$http({
|
|
|
+ url: !this.id ? this.$http.adornUrl(`/biz-service/equipment/save`) : this.$http.adornUrl(`/biz-service/equipment/update`),
|
|
|
+ method: 'post',
|
|
|
+ data: this.$http.adornData(this.dataForm)
|
|
|
+ }).then(({data}) => {
|
|
|
+ if (data && data.code === '200') {
|
|
|
+ this.$message({
|
|
|
+ message: '操作成功',
|
|
|
+ type: 'success',
|
|
|
+ duration: 1500,
|
|
|
+ onClose: () => {
|
|
|
+ this.visible = false
|
|
|
+ this.$emit('refreshDataList')
|
|
|
+ }
|
|
|
+ })
|
|
|
+ } else {
|
|
|
+ this.$message.error(data.msg)
|
|
|
+ }
|
|
|
+ })
|
|
|
+ }
|
|
|
+ })
|
|
|
+ },
|
|
|
+ submitUpload () {
|
|
|
+ if (this.fileList.length === 0) {
|
|
|
+ return this.$message.warning('请选取文件后再上传')
|
|
|
+ }
|
|
|
+ const formData = new FormData()
|
|
|
+ this.fileList.forEach((file) => {
|
|
|
+ formData.append('file', file.raw)
|
|
|
+ })
|
|
|
+ uploadFiles(formData).then(({data}) => {
|
|
|
+ if (data && data.code === '200') {
|
|
|
+ data.data.forEach((item) => {
|
|
|
+ let fileData = this.fileList.find((file) => file.name === item.originFileName)
|
|
|
+ fileData.url = item.fileUrl
|
|
|
+ })
|
|
|
+ this.$message.success('上传成功')
|
|
|
+ } else {
|
|
|
+ this.$message.error('上传失败')
|
|
|
+ }
|
|
|
+ })
|
|
|
+ },
|
|
|
+ handleRemove (file, fileList) {
|
|
|
+ this.fileList = fileList
|
|
|
+ },
|
|
|
+ handlePreview (file) {
|
|
|
+ if (file && file.url) {
|
|
|
+ // 获取文件路径
|
|
|
+ this.previewPath = downloadUrl + file.url
|
|
|
+ this.previewName = file.name
|
|
|
+ this.previewVisible = true
|
|
|
+ }
|
|
|
+ },
|
|
|
+ handleChange (file, fileList) {
|
|
|
+ this.fileList = fileList
|
|
|
+ },
|
|
|
+ handleExceed (files, fileList) {
|
|
|
+ this.$message.warning(`当前限制选择 5 个文件,本次选择了 ${files.length} 个文件,共选择了 ${files.length + fileList.length} 个文件`)
|
|
|
+ }
|
|
|
+ }
|
|
|
}
|
|
|
</script>
|
|
|
|