冀北项目添加表格导出功能 技术监督添加下载模版上传功能
This commit is contained in:
238
src/views/pqs/supervise_hn/retire/monitorQuitPopup.vue
Normal file
238
src/views/pqs/supervise_hn/retire/monitorQuitPopup.vue
Normal file
@@ -0,0 +1,238 @@
|
||||
<template>
|
||||
<el-dialog draggable v-model="dialogVisible" :title="title" width="450px" top="20vh">
|
||||
<el-scrollbar>
|
||||
<el-form :inline="false" :model="form" label-width="120px" :rules="rules" ref="formRef">
|
||||
<!-- <el-form-item label="终端类型" prop="deviceType">
|
||||
<el-radio-group v-model="form.deviceType" :disabled="title == '监测点退运'" @change="changeType">
|
||||
<el-radio border label="1">监测终端</el-radio>
|
||||
<el-radio border label="2">监测点</el-radio>
|
||||
</el-radio-group>
|
||||
</el-form-item> -->
|
||||
<el-form-item label="监测点" prop="deviceId">
|
||||
<el-tree-select
|
||||
v-model="form.deviceId"
|
||||
:data="data"
|
||||
filterable
|
||||
:default-expand-all="true"
|
||||
style="width: 100%"
|
||||
@change="changeDevStatus"
|
||||
clearable
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item label="监测点当前状态:">
|
||||
<el-select v-model="runFlag" disabled placeholder="请选择监测点" clearable class="select">
|
||||
<el-option
|
||||
v-for="item in runFlagList"
|
||||
:key="item.id"
|
||||
:label="item.name"
|
||||
:value="item.id"
|
||||
></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="变更状态:" prop="devStatus">
|
||||
<el-select v-model="form.devStatus" placeholder="请选择监测点变更状态" clearable class="select">
|
||||
<el-option
|
||||
v-for="item in runFlagData"
|
||||
:key="item.id"
|
||||
:label="item.name"
|
||||
:value="item.id"
|
||||
></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="退运原因" prop="propertyNo">
|
||||
<!-- <el-input
|
||||
v-model='form.propertyNo'
|
||||
clearable
|
||||
placeholder='请输入退役原因'
|
||||
/> -->
|
||||
<el-input
|
||||
type="textarea"
|
||||
clearable
|
||||
:autosize="{ minRows: 2, maxRows: 4 }"
|
||||
placeholder="请输入退运原因"
|
||||
v-model="form.propertyNo"
|
||||
></el-input>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</el-scrollbar>
|
||||
|
||||
<template #footer>
|
||||
<span class="dialog-footer">
|
||||
<el-button @click="dialogVisible = false">取消</el-button>
|
||||
<!-- <el-button type="primary" @click="submit">确认</el-button> -->
|
||||
<el-button type="primary" @click="submit(true)" :loading="loading" >保存</el-button>
|
||||
<el-button type="primary" @click="submit(false)" :loading="loading" >提交审批</el-button>
|
||||
</span>
|
||||
</template>
|
||||
</el-dialog>
|
||||
</template>
|
||||
<script lang="ts" setup>
|
||||
import { ref, inject } from 'vue'
|
||||
import { ElMessage } from 'element-plus'
|
||||
import TableStore from '@/utils/tableStore' // 若不是列表页面弹框可删除
|
||||
import { getTerminalSelectTree } from '@/api/device-boot/Business'
|
||||
import { addRunningDevice, quitRunningDeviceUpdate } from '@/api/supervision-boot/device/quitRunningDev'
|
||||
import { getLineDetailData } from '@/api/device-boot/line'
|
||||
|
||||
//下拉数据源
|
||||
const sourceData = ref()
|
||||
const lineList = ref()
|
||||
const data = ref()
|
||||
const title = ref('')
|
||||
const loading = ref(false)
|
||||
const tableStore = inject('tableStore') as TableStore
|
||||
const formRef = ref()
|
||||
const runFlag = ref('')
|
||||
|
||||
const runFlagData: any = ref([])
|
||||
const dialogVisible = ref(false)
|
||||
// 注意不要和表单ref的命名冲突
|
||||
const form = ref({
|
||||
id: '',
|
||||
deviceId: '',
|
||||
deviceType: '2',
|
||||
devOriginalStatus: '0',
|
||||
devStatus: '',
|
||||
saveOrCheckflag: '',
|
||||
propertyNo: ''
|
||||
})
|
||||
const runFlagList = [
|
||||
{ id: '0', name: '投运' },
|
||||
{ id: '1', name: '检修' },
|
||||
{ id: '2', name: '停运' },
|
||||
{ id: '3', name: '调试' },
|
||||
{ id: '4', name: '退运' }
|
||||
]
|
||||
|
||||
//form表单校验规则
|
||||
const rules = {
|
||||
deviceId: [{ required: true, message: '终端不能为空', trigger: 'change' }],
|
||||
propertyNo: [{ required: true, message: '请输入退役原因', trigger: 'blur' }],
|
||||
devStatus: [{ required: true, message: '请选择变更状态', trigger: 'blur' }]
|
||||
}
|
||||
const resetForm = () => {
|
||||
if (formRef.value) {
|
||||
formRef.value.resetFields()
|
||||
}
|
||||
}
|
||||
|
||||
const open = async (text: string, tempData?: any) => {
|
||||
title.value = text
|
||||
//监测点
|
||||
await getTerminalSelectTree(6).then(res => {
|
||||
lineList.value = res.data
|
||||
})
|
||||
|
||||
sourceData.value = lineList.value
|
||||
data.value = lineList.value
|
||||
if (tempData) {
|
||||
// 表单赋值
|
||||
for (let key in form.value) {
|
||||
form.value[key] = tempData[key]
|
||||
}
|
||||
form.value.deviceType = form.value.deviceType + ''
|
||||
changeDevStatus(form.value.deviceId, true)
|
||||
form.value.devStatus = tempData.devStatus != null ? tempData.devStatus + '' : ''
|
||||
} else {
|
||||
resetForm()
|
||||
// 在此处恢复默认表单
|
||||
for (let key in form.value) {
|
||||
form.value[key] = ''
|
||||
}
|
||||
form.value.deviceType = '1'
|
||||
runFlag.value = ''
|
||||
}
|
||||
form.value.deviceType = '2'
|
||||
dialogVisible.value = true
|
||||
}
|
||||
|
||||
/**
|
||||
* 提交用户表单数据
|
||||
*/
|
||||
const submit = async (flag: boolean) => {
|
||||
loading.value = true
|
||||
if (flag) {
|
||||
form.value.saveOrCheckflag = '1'
|
||||
|
||||
await addRunningDevice(form.value).then(res => {
|
||||
ElMessage.success('保存成功!')
|
||||
tableStore.index()
|
||||
dialogVisible.value = false
|
||||
})
|
||||
} else {
|
||||
formRef.value.validate(async (valid: any) => {
|
||||
if (valid) {
|
||||
form.value.saveOrCheckflag = '2'
|
||||
{
|
||||
if (form.value.id) {
|
||||
await quitRunningDeviceUpdate(form.value)
|
||||
ElMessage.success('重新发起成功')
|
||||
tableStore.index()
|
||||
dialogVisible.value = false
|
||||
} else {
|
||||
await addRunningDevice(form.value)
|
||||
//查询进线数据，避免一直处于loading状态
|
||||
ElMessage.success('申请成功')
|
||||
tableStore.index()
|
||||
dialogVisible.value = false
|
||||
}
|
||||
}
|
||||
}
|
||||
})
|
||||
}
|
||||
await setTimeout(() => {
|
||||
loading.value = false
|
||||
}, 0)
|
||||
}
|
||||
|
||||
/**
|
||||
* 终端类型切换
|
||||
*/
|
||||
|
||||
const changeType = (event: any) => {
|
||||
sourceData.value = lineList.value
|
||||
form.value.deviceId = ''
|
||||
data.value = sourceData.value
|
||||
}
|
||||
const changeDevStatus = async (event: any, flag?: any) => {
|
||||
await getLineDetailData(event).then(res => {
|
||||
//给当前终端赋值初始投运状态
|
||||
// switch (res.data.runFlag) {
|
||||
|
||||
// case '投运':
|
||||
// form.value.devOriginalStatus = '0'
|
||||
// break
|
||||
// case '检修':
|
||||
// form.value.devOriginalStatus = '1'
|
||||
// break
|
||||
// case '停运':
|
||||
// form.value.devOriginalStatus = '2'
|
||||
// break
|
||||
// case '调试':
|
||||
// form.value.devOriginalStatus = '3'
|
||||
// break
|
||||
// default:
|
||||
// form.value.devOriginalStatus = '4'
|
||||
// break
|
||||
// }
|
||||
runFlag.value = runFlagList.filter(item => item.name == res.data.runFlag)[0].id
|
||||
form.value.devOriginalStatus = runFlag.value
|
||||
if (!flag) {
|
||||
form.value.devStatus = ''
|
||||
}
|
||||
runFlagData.value = runFlagList.filter(item => item.name != res.data.runFlag)
|
||||
})
|
||||
}
|
||||
|
||||
defineExpose({ open })
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.el-upload-list__item {
|
||||
transition: none !important;
|
||||
}
|
||||
|
||||
.el-select {
|
||||
min-width: 180px;
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user