You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
396 lines
9.3 KiB
396 lines
9.3 KiB
<template>
|
|
<!-- 添加设备报修 -->
|
|
<view class="add-form-container">
|
|
<u-form :model="form" ref="form1" label-width="160rpx">
|
|
<u-form-item label="故障描述" prop="describes" required>
|
|
<u-input v-model="form.describes" placeholder="请输入故障描述" />
|
|
</u-form-item>
|
|
<u-form-item :label="`${type=='DEVICE'?'设备' : '模具'}编码`" prop="deviceNumber" required>
|
|
<u-input v-model="form.deviceNumber" @blur="blur()"
|
|
:placeholder="`请输入${type=='DEVICE'?'设备' : '模具'}编码`" />
|
|
<view class="right-button" @click="chickRightButton">
|
|
扫描
|
|
</view>
|
|
</u-form-item>
|
|
<u-form-item :label="`${type=='DEVICE'?'设备' : '模具'}名称`" prop="deviceName" required class="disabled">
|
|
<u-input v-model="form.deviceName" :placeholder="`请输入${type=='DEVICE'?'设备' : '模具'}名称`" disabled />
|
|
</u-form-item>
|
|
<u-form-item label="所属厂区" prop="factoryAreaName" required class="disabled">
|
|
<u-input v-model="form.factoryAreaName" placeholder="请输入所属厂区" disabled />
|
|
</u-form-item>
|
|
<u-form-item label="类型" prop="receiverType" required>
|
|
<view class="select" @click="openSingleColumn('receiverType',form.receiverType,appDeviceMoldType)">
|
|
<view class="input" v-if='form.receiverType'>
|
|
{{selectFormat(form.receiverType,appDeviceMoldType)}}
|
|
</view>
|
|
<view class="placeholder" v-else>
|
|
{{`请选择类型`}}
|
|
</view>
|
|
<u-icon name="arrow-right" color="#aaaaaa" size="28"></u-icon>
|
|
</view>
|
|
</u-form-item>
|
|
<view class="image">
|
|
<view class="image-list" v-if='imgList.length>0'>
|
|
<view class="image-item" v-for="(item,index) in imgList" :key="index">
|
|
<image :src="item" mode=""></image>
|
|
<u-icon name="close-circle-fill" color="red" class="close" size="36" @click="delImage(index)">
|
|
</u-icon>
|
|
</view>
|
|
</view>
|
|
<view class="image-item image-item1" @click="chooseImage" v-if='imgList.length<3'>
|
|
<image src="../../static/images/photo.png" mode=""></image>
|
|
</view>
|
|
</view>
|
|
</u-form>
|
|
<view class="footer">
|
|
<view class="btns">
|
|
<button class="reset" @click="reset">重置</button>
|
|
<button class="sure" @click="submit" :loading='loading' :disabled='loading'>确定</button>
|
|
</view>
|
|
<view style="height: constant(safe-area-inset-bottom); height: env(safe-area-inset-bottom);"></view>
|
|
</view>
|
|
<u-select v-model="singleColumnShow" mode="single-column" :default-value='singleColumnDefaultValue'
|
|
:list="singleColumnList" @confirm="chooseSingleColumn"></u-select>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
import * as deviceApi from "@/api/device.js"
|
|
import * as moldApi from "@/api/mold.js"
|
|
import * as dictApi from "@/api/dict.js"
|
|
import * as uploadApi from "@/api/upload.js"
|
|
|
|
export default {
|
|
data() {
|
|
return {
|
|
loading: false,
|
|
type: "",
|
|
appDeviceMoldType: [],
|
|
form: {
|
|
describes: "",
|
|
deviceNumber: '',
|
|
deviceName: '',
|
|
factoryAreaName: '',
|
|
factoryAreaNumber: '',
|
|
receiverType: ''
|
|
},
|
|
singleColumnShow: false,
|
|
singleColumnDefaultValue: [],
|
|
singleColumnList: [],
|
|
imgList: []
|
|
}
|
|
},
|
|
methods: {
|
|
// 扫描设备条码
|
|
chickRightButton(field) {
|
|
uni.scanCode({
|
|
success: function(res) {
|
|
this.form.deviceNumber = res.result
|
|
this.getDetailsByNumber()
|
|
}
|
|
});
|
|
},
|
|
blur() {
|
|
if (this.form.deviceNumber) {
|
|
this.getDetailsByNumber()
|
|
}
|
|
},
|
|
// 根据设备/模具号查询信息
|
|
getDetailsByNumber() {
|
|
const data = {
|
|
number: this.form.deviceNumber,
|
|
id: ''
|
|
}
|
|
if (this.type == 'DEVICE') {
|
|
deviceApi.getDeviceDetailsByNumber(data).then((res) => {
|
|
if (res.data) {
|
|
this.form.deviceName = res.data.name
|
|
this.form.factoryAreaName = res.data.factoryAreaName
|
|
this.form.factoryAreaNumber = res.data.factoryAreaNumber
|
|
} else {
|
|
this.$modal.showToast(`找不到该${this.type=='DEVICE'?'设备' : '模具'}`)
|
|
}
|
|
})
|
|
} else if (this.type == 'MOLD') {
|
|
moldApi.getMoldDetailsByNumber(data).then((res) => {
|
|
if (res.data) {
|
|
this.form.deviceName = res.data.name
|
|
this.form.factoryAreaName = res.data.factoryAreaName
|
|
this.form.factoryAreaNumber = res.data.factoryAreaNumber
|
|
} else {
|
|
this.$modal.showToast(`找不到该${this.type=='DEVICE'?'设备' : '模具'}`)
|
|
}
|
|
})
|
|
}
|
|
},
|
|
// 触发提交表单
|
|
submit() {
|
|
// 校验
|
|
if (!this.form.describes) {
|
|
this.$modal.showToast('请输入故障描述')
|
|
return;
|
|
}
|
|
if (!this.form.deviceNumber) {
|
|
this.$modal.showToast(`请输入${this.type=='DEVICE'?'设备' : '模具'}编码`)
|
|
return;
|
|
}
|
|
if (!this.form.deviceName) {
|
|
this.$modal.showToast(`请输入${this.type=='DEVICE'?'设备' : '模具'}名称`)
|
|
return;
|
|
}
|
|
if (!this.form.factoryAreaName) {
|
|
this.$modal.showToast('请输入所属厂区')
|
|
return;
|
|
}
|
|
const data = {
|
|
describes: this.form.describes,
|
|
deviceNumber: this.form.deviceNumber,
|
|
factoryAreaNumber: this.form.factoryAreaNumber,
|
|
type: this.type
|
|
}
|
|
this.$modal.confirm('是否添加报修').then(() => {
|
|
this.$modal.loading('加载中')
|
|
this.loading = true
|
|
deviceApi.deviceRepairCreate(data).then((res) => {
|
|
this.$modal.closeLoading()
|
|
if (res.data) {
|
|
this.$modal.showToast('添加成功')
|
|
setTimeout(() => {
|
|
this.$tab.navigateBack()
|
|
this.loading = false
|
|
}, 1500)
|
|
} else {
|
|
this.$modal.showToast('添加失败')
|
|
this.loading = false
|
|
}
|
|
}).catch(() => {
|
|
this.$modal.closeLoading()
|
|
this.loading = false
|
|
})
|
|
})
|
|
|
|
},
|
|
// 重置
|
|
reset() {
|
|
this.form = {}
|
|
},
|
|
selectFormat(val, array) {
|
|
let str = array.filter(item => item.value == val)[0].label
|
|
return str
|
|
},
|
|
// 单列模式
|
|
openSingleColumn(field, val, list) {
|
|
this.singleColumnList = list
|
|
this.field = field
|
|
if (val) {
|
|
this.singleColumnDefaultValue = [list.findIndex(item => item.value == val)]
|
|
} else {
|
|
this.singleColumnDefaultValue = []
|
|
}
|
|
this.singleColumnShow = true
|
|
},
|
|
// 单列模式点击确定之后
|
|
chooseSingleColumn(e) {
|
|
this.form[this.field] = e[0].value
|
|
this.singleColumnShow = false
|
|
this.$emit('singleColumn', this.field, this.form[this.field])
|
|
this.$forceUpdate()
|
|
},
|
|
chooseImage() {
|
|
uni.chooseImage({
|
|
count: 1, // 默认9
|
|
sizeType: ['compressed'], // 可以指定是原图还是压缩图，默认二者都有
|
|
sourceType: ['album', 'camera'], // 可以指定来源是相册还是相机，默认二者都有
|
|
success: (res) => {
|
|
let filePath = res.tempFilePaths[0]
|
|
this.$modal.loading()
|
|
uploadApi.uploadFile({
|
|
filePath: filePath,
|
|
name: 'file',
|
|
formData: {
|
|
'user': 'test'
|
|
},
|
|
}).then(ret => {
|
|
this.$modal.closeLoading()
|
|
this.imgList.push(ret.data)
|
|
console.log(ret)
|
|
}).catch((err) => {
|
|
this.$modal.closeLoading()
|
|
});
|
|
},
|
|
});
|
|
},
|
|
// 删除图片
|
|
delImage(index) {
|
|
this.imgList.splice(index, 1)
|
|
}
|
|
},
|
|
async onLoad(option) {
|
|
if (option.type) this.type = option.type;
|
|
this.appDeviceMoldType = await dictApi.getDict('app_device_mold_type')
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
.add-form-container {
|
|
min-height: calc(100vh - 140rpx);
|
|
background: white;
|
|
padding: 0px 0rpx 140rpx;
|
|
}
|
|
|
|
.u-form-item {
|
|
padding: 20rpx 30rpx;
|
|
}
|
|
|
|
.disabled {
|
|
background: #f5f5f5;
|
|
}
|
|
|
|
.list {
|
|
padding-bottom: 20rpx;
|
|
|
|
.item {
|
|
margin-top: 20rpx;
|
|
background: white;
|
|
padding: 30rpx;
|
|
display: flex;
|
|
align-items: center;
|
|
|
|
image {
|
|
width: 160rpx;
|
|
height: 160rpx;
|
|
margin-right: 20rpx;
|
|
}
|
|
|
|
.title {
|
|
font-size: 32rpx;
|
|
font-weight: bold;
|
|
}
|
|
|
|
.dec1 {
|
|
font-size: 28rpx;
|
|
margin-top: 16rpx;
|
|
color: #acacac;
|
|
}
|
|
|
|
.dec2 {
|
|
font-size: 28rpx;
|
|
margin-top: 6rpx;
|
|
color: #acacac;
|
|
}
|
|
}
|
|
}
|
|
|
|
.select {
|
|
display: flex;
|
|
align-items: center;
|
|
height: 72rpx;
|
|
width: 100%;
|
|
|
|
.input {
|
|
flex: 1;
|
|
font-size: 28rpx;
|
|
color: #000000;
|
|
}
|
|
|
|
.placeholder {
|
|
flex: 1;
|
|
font-size: 28rpx;
|
|
color: rgb(192, 196, 204);
|
|
|
|
}
|
|
}
|
|
|
|
.footer {
|
|
position: fixed;
|
|
bottom: 0px;
|
|
left: 0px;
|
|
width: 100%;
|
|
}
|
|
|
|
.btns {
|
|
display: flex;
|
|
|
|
|
|
button {
|
|
flex: 1;
|
|
}
|
|
|
|
.sure {
|
|
background: #409eff;
|
|
color: white;
|
|
border-radius: 0px;
|
|
|
|
&::after {
|
|
border: 1px solid #409eff;
|
|
border-radius: 0px;
|
|
}
|
|
}
|
|
|
|
.reset {
|
|
background: #F5F5F5;
|
|
border-radius: 0px;
|
|
|
|
&::after {
|
|
border-radius: 0px;
|
|
}
|
|
}
|
|
}
|
|
|
|
.right-button {
|
|
background: #409eff;
|
|
color: white;
|
|
padding: 0rpx 30rpx;
|
|
border-radius: 16rpx;
|
|
text-align: center;
|
|
font-size: 28rpx;
|
|
}
|
|
|
|
.image {
|
|
padding: 0px 30rpx;
|
|
padding-bottom: 30rpx;
|
|
display: flex;
|
|
align-items: center;
|
|
|
|
flex-wrap: wrap;
|
|
|
|
.image-list {
|
|
display: flex;
|
|
align-items: center;
|
|
flex-wrap: wrap;
|
|
}
|
|
}
|
|
|
|
.image-item {
|
|
width: 210rpx;
|
|
height: 210rpx;
|
|
margin-right: 20rpx;
|
|
position: relative;
|
|
border: 1px solid rgba(230, 230, 230, 0.5);
|
|
margin-bottom: 20rpx;
|
|
border-radius: 20rpx;
|
|
overflow: hidden;
|
|
|
|
image {
|
|
width: 100%;
|
|
height: 100%;
|
|
}
|
|
|
|
.close {
|
|
position: absolute;
|
|
right: 0px;
|
|
top: 0px;
|
|
}
|
|
}
|
|
|
|
.image-item1 {
|
|
border: none;
|
|
margin-right: 0px;
|
|
|
|
image {
|
|
width: 100%;
|
|
height: 100%;
|
|
}
|
|
}
|
|
</style>
|