boyue2025/dbd-meeting-html
3
0
Fork 0
mirror of https://gitee.com/elegant_wings/dbd-meeting-html.git synced 2025-06-21 10:19:36 +08:00
Code Issues Packages Projects Releases Wiki Activity

修改了新增工单问题

Browse Source
This commit is contained in:
chenze 2024-08-29 17:39:35 +08:00
parent 31fa901fe5
commit a4b31a2c67
1 changed files with 97 additions and 102 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

199
src/views/admin/modules/RepairModal.vue
View File

@ -1,122 +1,122 @@
<template> <template>
<a-modal <a-modal
title='指派维修员' title="指派维修员"
style='top: 20px;' style="top: 20px;"
:width='1200' :width="1200"
v-model='visible' v-model="visible"
:confirmLoading='confirmLoading' :confirmLoading="confirmLoading"
@ok='handleSubmit' @ok="handleSubmit"
> >
<a-form :form='form'> <a-form :form="form">
<a-form-item style='display:none'> <a-form-item style="display:none">
<a-input v-decorator="['id']" /> <a-input v-decorator="['id']" />
</a-form-item> </a-form-item>
<a-row> <a-row>
<a-col :span='10'> <a-col :span="10">
<a-form-item :labelCol='labelCol' :wrapperCol='wrapperCol' label='所属分类'> <a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="所属分类">
<a-select v-decorator="['typeId', {rules: [{ required: true, message: '请选择所属分类' }]}]" <a-select v-decorator="['typeId', {rules: [{ required: true, message: '请选择所属分类' }]}]"
@change='selectDevice'> @change="selectDevice">
<a-select-option v-for='item in typeList' :key='item.id' :value='item.id'>{{ item.name }} <a-select-option v-for="item in typeList" :key="item.id" :value="item.id">{{ item.name }}
</a-select-option> </a-select-option>
</a-select> </a-select>
</a-form-item> </a-form-item>
</a-col> </a-col>
<a-col :span='10'> <a-col :span="10">
<a-form-item :labelCol='labelCol' :wrapperCol='wrapperCol' label='报修设备'> <a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="报修设备">
<a-select v-decorator="['deviceId', {rules: [{ required: true, message: '请选择所属设备' }]}]" <a-select v-decorator="['deviceId', {rules: [{ required: true, message: '请选择所属设备' }]}]"
@change='getDeviceName'> @change="getDeviceName">
<a-select-option v-for='item in deviceList' :key='item.id' :value='item.id'>{{ item.name }} <a-select-option v-for="item in deviceList" :key="item.id" :value="item.id">{{ item.name }}
</a-select-option> </a-select-option>
</a-select> </a-select>
</a-form-item> </a-form-item>
</a-col> </a-col>
</a-row> </a-row>
<a-row> <a-row>
<a-col :span='10'> <a-col :span="10">
<a-form-item :labelCol='labelCol' :wrapperCol='wrapperCol' label='报修人'> <a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="报修人">
<a-input placeholder='报修人' <a-input placeholder="报修人"
v-decorator="['name', {rules: [{ required: true, message: '请选择报修人' }]}]" /> v-decorator="['name', {rules: [{ required: true, message: '请选择报修人' }]}]" />
</a-form-item> </a-form-item>
</a-col> </a-col>
<a-col :span='10'> <a-col :span="10">
<a-form-item :labelCol='labelCol' :wrapperCol='wrapperCol' label='联系电话'> <a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="联系电话">
<a-input placeholder='联系电话' <a-input placeholder="联系电话"
v-decorator="['phone', {rules: [{ required: true, message: '请输入联系电话' }]}]" /> v-decorator="['phone', {rules: [{ required: true, message: '请输入联系电话' }]}]" />
</a-form-item> </a-form-item>
</a-col> </a-col>
</a-row> </a-row>
<a-row> <a-row>
<a-col :span='10'> <a-col :span="10">
<a-form-item :labelCol='labelCol' :wrapperCol='wrapperCol' label='维修负责人'> <a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="维修负责人">
<a-select v-decorator="['repairUserId']" <a-select v-decorator="['repairUserId']"
@change='selectUser'> @change="selectUser">
<a-select-option v-for='item in userList' :key='item.userId'>{{ item.userName }}</a-select-option> <a-select-option v-for="item in userList" :key="item.userId">{{ item.userName }}</a-select-option>
</a-select> </a-select>
</a-form-item> </a-form-item>
</a-col> </a-col>
<a-col :span='10'> <a-col :span="10">
<a-form-item :labelCol='labelCol' :wrapperCol='wrapperCol' label='报修地点'> <a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="报修地点">
<a-select v-decorator="['addressId', {rules: [{ required: true, message: '请选择报修地点' }]}]" <a-select v-decorator="['addressId', {rules: [{ required: true, message: '请选择报修地点' }]}]"
@change='selectRoomList'> @change="selectRoomList">
<a-select-option v-for='item in addressList' :key='item.id' :value='item.id'>{{ item.name }} <a-select-option v-for="item in addressList" :key="item.id" :value="item.id">{{ item.name }}
</a-select-option> </a-select-option>
</a-select> </a-select>
</a-form-item> </a-form-item>
</a-col> </a-col>
</a-row> </a-row>
<a-row> <a-row>
<a-col :span='10'> <a-col :span="10">
<a-form-item :labelCol='labelCol' :wrapperCol='wrapperCol' label='楼层'> <a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="楼层">
<a-select v-decorator="['floorId', {rules: [{ required: true, message: '请选择详细地址' }]}]" <a-select v-decorator="['floorId', {rules: [{ required: true, message: '请选择详细地址' }]}]"
@change='selectFloorName'> @change="selectFloorName">
<a-select-option v-for='item in roomList' :key='item.id' :value='item.id'>{{ item.name }} <a-select-option v-for="item in roomList" :key="item.id" :value="item.id">{{ item.name }}
</a-select-option> </a-select-option>
</a-select> </a-select>
</a-form-item> </a-form-item>
</a-col> </a-col>
<a-col :span='10'> <a-col :span="10">
<a-form-item :labelCol='labelCol' :wrapperCol='wrapperCol' label='门牌号(地点)'> <a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="门牌号(地点)">
<a-input placeholder='门牌号' <a-input placeholder="门牌号"
v-decorator="['room' ]" /> v-decorator="['room' ]" />
</a-form-item> </a-form-item>
</a-col> </a-col>
</a-row> </a-row>
<a-row> <a-row>
<a-col :span='10'> <a-col :span="10">
<a-form-item :labelCol='labelCol' :wrapperCol='wrapperCol' label='故障类型'> <a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="故障类型">
<a-select v-decorator="['failureTypeId' ]" <a-select v-decorator="['failureTypeId' ]"
> >
<a-select-option v-for='item in failureTypeList' :key='item.id'>{{ item.name }}</a-select-option> <a-select-option v-for="item in failureTypeList" :key="item.id">{{ item.name }}</a-select-option>
</a-select> </a-select>
</a-form-item> </a-form-item>
</a-col> </a-col>
<a-col :span='10'> <a-col :span="10">
<a-form-item :labelCol='labelCol' :wrapperCol='wrapperCol' label='故障描述'> <a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="故障描述">
<a-textarea placeholder='故障描述' v-decorator="['explain']" /> <a-textarea placeholder="故障描述" v-decorator="['explain']" />
</a-form-item> </a-form-item>
</a-col> </a-col>
</a-row> </a-row>
<a-row> <a-row>
<a-col :span='10'> <a-col :span="10">
<a-form-item :labelCol='labelCol' :wrapperCol='wrapperCol' label='报修图片'> <a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="报修图片">
<a-upload <a-upload
v-decorator="['repairImages']" v-decorator="['repairImages']"
list-type='picture-card' list-type="picture-card"
class='avatar-uploader' class="avatar-uploader"
:file-list='fileList' :file-list="fileList"
:action='uploadUrl' :action="uploadUrl"
:headers='headers' :headers="headers"
@preview='handlePreview' @preview="handlePreview"
@change='handleChangeFileList' @change="handleChangeFileList"
> >
<div v-if='fileList.length < 4'> <div v-if="fileList.length < 4">
<a-icon type='plus' /> <a-icon type="plus" />
<div class='ant-upload-text'> 上传</div> <div class="ant-upload-text"> 上传</div>
</div> </div>
</a-upload> </a-upload>
<a-modal :visible='previewVisible' :footer='null' @cancel='handleCancel'> <a-modal :visible="previewVisible" :footer="null" @cancel="handleCancel">
<img style='width: 100%' :src='previewImage' /> <img style="width: 100%" :src="previewImage" />
</a-modal> </a-modal>
</a-form-item> </a-form-item>
</a-col> </a-col>
@ -145,7 +145,7 @@ export default {
name: 'RepairModal', name: 'RepairModal',
props: {}, props: {},
components: {}, components: {},
data() { data () {
return { return {
visible: false, visible: false,
labelCol: { labelCol: {
@ -190,28 +190,27 @@ export default {
files: [] files: []
} }
}, },
beforeCreate() { beforeCreate () {
}, },
created() { created () {
this.selectType() this.selectType()
this.selectFailureType() this.selectFailureType()
this.getRepairAddressList() this.getRepairAddressList()
}, },
methods: { methods: {
moment, moment,
selectType() { selectType () {
getRepairTypeList().then(res => { getRepairTypeList().then(res => {
this.typeList = res.rows this.typeList = res.rows
}) })
}, },
selectUser(id) { selectUser (id) {
}, },
// 根据分类id 查询对应设备 // 根据分类id 查询对应设备
selectDevice(typeId) { selectDevice (typeId) {
let type = this.typeList.find(item => item.id == typeId) let type = this.typeList.find(item => item.id == typeId)
this.typeId = type.id this.typeId = type.id
this.typeName = type.name this.typeName = type.name
console.log('selectDevice', type)
getRepairDeviceList({ getRepairDeviceList({
typeId typeId
}).then(res => { }).then(res => {
@ -219,49 +218,57 @@ export default {
}) })
selectWorkerIdByTypeId({ typeId }).then(res => { selectWorkerIdByTypeId({ typeId }).then(res => {
this.userList = res.data this.userList = res.data
this.userList = this.userList.map(item => {
item.repairUserId = item.userId
return item
})
}) })
}, },
getDeviceName(item) { getDeviceName (deviceId) {
console.log(item) let device = this.deviceList.find(item => item.id == deviceId)
this.deviceName = item.label console.log(device)
this.deviceId = item.key this.deviceName = device.label
this.deviceId = device.key
}, },
selectFailureType() { selectFailureType () {
getRepairFailureTypeList().then(res => { getRepairFailureTypeList().then(res => {
this.failureTypeList = res.rows this.failureTypeList = res.rows
}) })
}, },
getRepairAddressList() { getRepairAddressList () {
getRepairAddressList().then(res => { getRepairAddressList().then(res => {
this.addressList = res.rows this.addressList = res.rows
}) })
}, },
selectRoomList(item) { selectRoomList (roomId) {
console.log(item) console.log('selectRoomList', roomId)
getRepairRoomList({ 'addressId': item.key }).then(res => { let room = this.addressList.find(item => item.id == roomId)
getRepairRoomList({ 'addressId': roomId }).then(res => {
this.roomList = res.rows this.roomList = res.rows
}) })
this.address = item.label this.address = room.label
this.addressId = item.key this.addressId = room.key
}, },
selectFloorName(item) { selectFloorName (floorId) {
this.floor = item.label let floor = this.roomList.find(item => item.id == floorId)
this.floorId = item.key
this.floor = floor.label
this.floorId = floor.key
}, },
async handlePreview(file) { async handlePreview (file) {
if (!file.url && !file.preview) { if (!file.url && !file.preview) {
file.preview = await getBase64FileList(file.originFileObj) file.preview = await getBase64FileList(file.originFileObj)
} }
this.previewImage = file.url || file.preview this.previewImage = file.url || file.preview
this.previewVisible = true this.previewVisible = true
}, },
handleCancel() { handleCancel () {
this.previewVisible = false this.previewVisible = false
}, },
// 上传banner // 上传banner
handleChangeFileList({ fileList }) { handleChangeFileList ({ fileList }) {
fileList.forEach(item => { fileList.forEach(item => {
if (item.response !== undefined) { if (item.response !== undefined) {
this.files.push(item.response.id) this.files.push(item.response.id)
@ -269,43 +276,31 @@ export default {
}) })
this.fileList = fileList this.fileList = fileList
}, },
add() { add () {
this.form.resetFields() this.form.resetFields()
this.mdl.repairImages = null this.mdl.repairImages = null
this.edit({ id: 0 }) this.edit({ id: 0 })
}, },
edit(record) { edit (record) {
console.log(this.typeList) this.selectDevice(record.typeId)
this.selectRoomList(record.addressId)
this.mdl = Object.assign(record) this.mdl = Object.assign(record)
this.mdl.typeList = this.typeList this.mdl.typeList = this.typeList
this.visible = true this.visible = true
this.$nextTick(() => { this.$nextTick(() => {
this.form.setFieldsValue(pick(this.mdl, 'id', 'sn', 'repairName', 'typeList', 'repairLevel', 'typeId', 'typeName', 'deviceId', 'deviceName', this.form.setFieldsValue(pick(this.mdl, 'id', 'sn', 'repairName', 'typeList', 'repairLevel', 'typeId', 'typeName', 'deviceId', 'deviceName',
'name', 'phone', 'addressId', 'address', 'floorId', 'floor', 'room', 'explain', 'perUserId', 'perUserName', 'preDate', 'cause', 'name', 'phone', 'addressId', 'address', 'floorId', 'floor', 'repairUserId', 'room', 'explain', 'perUserId', 'perUserName', 'preDate', 'cause',
'solution', 'failureTypeId', 'failureTypeName')) 'solution', 'failureTypeId', 'failureTypeName'))
}) })
// 处理日期
if (this.mdl.beginDate !== null && this.mdl.beginDate !== undefined && this.mdl.endDate !== null && this.mdl.endDate !== undefined) {
this.dateValue = [moment(this.mdl.beginDate, dateFormat), moment(this.mdl.endDate, dateFormat)]
}
// 图片
if (this.mdl.repairImages) {
this.mdl.repairImages = JSON.parse(this.mdl.repairImages)
this.mdl.repairImages.forEach((item, i) => {
item.url = process.env.VUE_APP_API_BASE_URL + item.url
})
this.fileList = this.mdl.repairImages
} else {
this.fileList = []
}
}, },
onChange(dates, dateStrings) { onChange (dates, dateStrings) {
console.log('From: ', dateStrings[0], ', to: ', dateStrings[1]) console.log('From: ', dateStrings[0], ', to: ', dateStrings[1])
this.beginDate = dateStrings[0] this.beginDate = dateStrings[0]
this.endDate = dateStrings[1] this.endDate = dateStrings[1]
this.dateValue = [moment(this.beginDate, dateFormat), moment(this.endDate, dateFormat)] this.dateValue = [moment(this.beginDate, dateFormat), moment(this.endDate, dateFormat)]
}, },
handleSubmit(e) { handleSubmit (e) {
e.preventDefault() e.preventDefault()
console.log(this.files) console.log(this.files)
@ -360,7 +355,7 @@ export default {
watch: {} watch: {}
} }
function getBase64(img, callback) { function getBase64 (img, callback) {
const reader = new FileReader() const reader = new FileReader()
reader.addEventListener('load', () => callback(reader.result)) reader.addEventListener('load', () => callback(reader.result))
reader.readAsDataURL(img) reader.readAsDataURL(img)