| | |
| | | <template> |
| | | <el-dialog |
| | | class="command-page-view-dialog" |
| | | v-model="visible" |
| | | :title="titleEnum[dialogMode]" |
| | | destroy-on-close |
| | | :close-on-click-modal="false" |
| | | @closed="handleClosed" |
| | | > |
| | | <el-dialog class="command-page-view-dialog" v-model="visible" :title="titleEnum[dialogMode]" destroy-on-close |
| | | :close-on-click-modal="false" @closed="handleClosed"> |
| | | <div v-if="readonly" class="detail-container"> |
| | | <el-row> |
| | | <el-col :span="12"> |
| | |
| | | </el-col> |
| | | </el-row> |
| | | </div> |
| | | <el-form |
| | | v-else |
| | | ref="formRef" |
| | | :model="formData" |
| | | :rules="rules" |
| | | :disabled="readonly" |
| | | label-width="100px" |
| | | class="dialog-form" |
| | | > |
| | | <el-form v-else ref="formRef" :model="formData" :rules="rules" :disabled="readonly" label-width="100px" |
| | | class="dialog-form"> |
| | | <el-row> |
| | | <el-col :span="12"> |
| | | <el-form-item label="设备" prop="deviceId"> |
| | | <el-select |
| | | class="command-select" |
| | | popper-class="command-select-popper" |
| | | v-model="formData.deviceId" |
| | | placeholder="请选择" |
| | | clearable |
| | | @change="handleDeviceChange" |
| | | > |
| | | <el-option v-for="item in deviceList" :key="item.id" :label="item.deviceName" :value="item.id" /> |
| | | <el-select class="command-select" popper-class="command-select-popper" |
| | | v-model="formData.deviceId" placeholder="请选择" clearable @change="handleDeviceChange"> |
| | | <el-option v-for="item in deviceList" :key="item.id" :label="item.deviceName" |
| | | :value="item.id" /> |
| | | </el-select> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="12"> |
| | | <el-form-item label="设备编码" prop="deviceSn"> |
| | | <el-input |
| | | class="command-input" |
| | | v-model="formData.deviceSn" |
| | | disabled |
| | | placeholder="选择设备后自动带出" |
| | | /> |
| | | <el-input class="command-input" v-model="formData.deviceSn" disabled placeholder="选择设备后自动带出" /> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="12"> |
| | | <el-form-item label="设备状态"> |
| | | <el-select class="command-select" popper-class="command-select-popper" |
| | | v-model="deviceStatus" disabled placeholder="选择设备后自动带出"> |
| | | <el-option v-for="item in dictObj.deviceStatus" :key="item.dictKey" :label="item.dictValue" |
| | | :value="item.dictKey" /> |
| | | </el-select> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="12"> |
| | | <el-form-item label="场景" prop="defenseSceneId"> |
| | | <el-select |
| | | class="command-select" |
| | | popper-class="command-select-popper" |
| | | v-model="formData.defenseSceneId" |
| | | placeholder="请选择" |
| | | clearable |
| | | @change="handleSceneChange" |
| | | > |
| | | <el-option v-for="item in sceneList" :key="item.id" :label="item.sceneName" :value="item.id" /> |
| | | <el-select class="command-select" popper-class="command-select-popper" |
| | | v-model="formData.defenseSceneId" placeholder="请选择" clearable @change="handleSceneChange"> |
| | | <el-option v-for="item in sceneList" :key="item.id" :label="item.sceneName" |
| | | :value="item.id" /> |
| | | </el-select> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="12"> |
| | | <el-form-item label="区域" prop="areaDivideId"> |
| | | <el-select |
| | | class="command-select" |
| | | popper-class="command-select-popper" |
| | | v-model="formData.areaDivideId" |
| | | placeholder="请先选择场景" |
| | | clearable |
| | | :disabled="!formData.defenseSceneId" |
| | | @change="handleAreaChange" |
| | | > |
| | | <el-option v-for="item in areaList" :key="item.id" :label="item.areaName" :value="item.id" /> |
| | | <el-select class="command-select" popper-class="command-select-popper" |
| | | v-model="formData.areaDivideId" placeholder="请先选择场景" clearable |
| | | :disabled="!formData.defenseSceneId" @change="handleAreaChange"> |
| | | <el-option v-for="item in areaList" :key="item.id" :label="item.areaName" |
| | | :value="item.id" /> |
| | | </el-select> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="12"> |
| | | <el-form-item label="调度人员" prop="dispatchUser"> |
| | | <el-input |
| | | class="command-input" |
| | | v-model="formData.dispatchUser" |
| | | maxlength="50" |
| | | placeholder="请输入" |
| | | clearable |
| | | /> |
| | | <el-input class="command-input" v-model="formData.dispatchUser" maxlength="50" placeholder="请输入" |
| | | clearable /> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="12"> |
| | | <el-form-item label="调度日期" prop="dispatchDateRange"> |
| | | <el-date-picker |
| | | class="command-date-picker" |
| | | popper-class="command-date-picker-popper" |
| | | v-model="formData.dispatchDateRange" |
| | | type="datetimerange" |
| | | range-separator="至" |
| | | start-placeholder="开始日期" |
| | | end-placeholder="结束日期" |
| | | value-format="YYYY-MM-DD HH:mm:ss" |
| | | /> |
| | | <el-date-picker class="command-date-picker" popper-class="command-date-picker-popper" |
| | | v-model="formData.dispatchDateRange" type="datetimerange" range-separator="至" |
| | | start-placeholder="开始日期" end-placeholder="结束日期" value-format="YYYY-MM-DD HH:mm:ss" /> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="24"> |
| | |
| | | <!-- <el-button @click="selectLocation" style="width: 100%">--> |
| | | <el-button style="width: 100%"> |
| | | {{ |
| | | formData.longitude && formData.latitude ? `${formData.longitude}, ${formData.latitude}` : '选择区域后自动带出' |
| | | formData.longitude && formData.latitude ? `${formData.longitude}, ${formData.latitude}` : |
| | | '选择区域后自动带出' |
| | | }} |
| | | </el-button> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="24"> |
| | | <el-form-item label="调度内容" prop="dispatchContent"> |
| | | <el-input |
| | | class="command-input" |
| | | v-model="formData.dispatchContent" |
| | | type="textarea" |
| | | :rows="3" |
| | | maxlength="500" |
| | | placeholder="请输入" |
| | | clearable |
| | | /> |
| | | <el-input class="command-input" v-model="formData.dispatchContent" type="textarea" :rows="3" |
| | | maxlength="500" placeholder="请输入" clearable /> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="24"> |
| | | <el-form-item label="调度结果" prop="dispatchResult"> |
| | | <el-input |
| | | class="command-input" |
| | | v-model="formData.dispatchResult" |
| | | type="textarea" |
| | | :rows="3" |
| | | maxlength="500" |
| | | placeholder="请输入" |
| | | clearable |
| | | /> |
| | | <el-input class="command-input" v-model="formData.dispatchResult" type="textarea" :rows="3" |
| | | maxlength="500" placeholder="请输入" clearable /> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="24"> |
| | | <el-form-item label="处理措施" prop="disposeMeasure"> |
| | | <el-input |
| | | class="command-input" |
| | | v-model="formData.disposeMeasure" |
| | | type="textarea" |
| | | :rows="3" |
| | | maxlength="500" |
| | | placeholder="请输入" |
| | | clearable |
| | | /> |
| | | <el-input class="command-input" v-model="formData.disposeMeasure" type="textarea" :rows="3" |
| | | maxlength="500" placeholder="请输入" clearable /> |
| | | </el-form-item> |
| | | </el-col> |
| | | </el-row> |
| | |
| | | |
| | | <template #footer> |
| | | <el-button color="#2B2B4C" @click="handleCancel">{{ readonly ? '关闭' : '取消' }}</el-button> |
| | | <el-button |
| | | color="#284FE3" |
| | | v-if="!readonly" |
| | | type="primary" |
| | | :loading="submitting" |
| | | :disabled="submitting" |
| | | @click="handleSubmit" |
| | | > |
| | | <el-button color="#284FE3" v-if="!readonly" type="primary" :loading="submitting" :disabled="submitting" |
| | | @click="handleSubmit"> |
| | | 保存 |
| | | </el-button> |
| | | </template> |
| | |
| | | deviceList: { type: Array, default: () => [] }, |
| | | }) |
| | | |
| | | const dictObj = inject('dictObj') |
| | | |
| | | const emit = defineEmits(['success']) |
| | | const formRef = ref(null) // 表单实例 |
| | | const formData = ref(initForm()) // 表单数据 |
| | |
| | | const titleEnum = ref({ edit: '编辑', view: '查看', add: '新增' }) |
| | | const tempLocation = ref({ longitude: null, latitude: null }) |
| | | const areaList = ref([]) // 区域列表 |
| | | const deviceStatus = ref('') |
| | | |
| | | const rules = { |
| | | deviceId: fieldRules(true), |
| | |
| | | } |
| | | |
| | | // 设备选择变化处理 |
| | | function handleDeviceChange(deviceId) { |
| | | function handleDeviceChange (deviceId) { |
| | | const device = props.deviceList.find(item => item.id === deviceId) |
| | | if (device) { |
| | | formData.value.deviceName = device.deviceName |
| | | formData.value.deviceSn = device.deviceSn |
| | | formData.value.deviceStatus = device.deviceStatus |
| | | deviceStatus.value = String(device.status) |
| | | } else { |
| | | formData.value.deviceName = '' |
| | | formData.value.deviceSn = '' |
| | | formData.value.deviceStatus = '' |
| | | deviceStatus.value = '' |
| | | } |
| | | } |
| | | |
| | | // 场景选择变化处理 |
| | | async function handleSceneChange(sceneId) { |
| | | async function handleSceneChange (sceneId) { |
| | | formData.value.areaDivideId = '' |
| | | if (sceneId) { |
| | | await loadAreaList(sceneId) |
| | |
| | | } |
| | | } |
| | | |
| | | function handleAreaChange(areaId) { |
| | | function handleAreaChange (areaId) { |
| | | const find = areaList.value.find(item => item.id === areaId) |
| | | formData.value.longitude = find?.longitude |
| | | formData.value.latitude = find?.latitude |
| | | } |
| | | |
| | | // 加载区域列表 |
| | | async function loadAreaList(sceneId) { |
| | | async function loadAreaList (sceneId) { |
| | | const res = await fwAreaDivideListApi({ sceneId }) |
| | | areaList.value = res?.data?.data ?? [] |
| | | } |
| | | |
| | | // 关闭弹框 |
| | | function handleCancel() { |
| | | function handleCancel () { |
| | | visible.value = false |
| | | } |
| | | |
| | | function handleClosed() { |
| | | function handleClosed () { |
| | | formData.value = initForm() |
| | | } |
| | | |
| | | // 提交新增/编辑 |
| | | async function handleSubmit() { |
| | | async function handleSubmit () { |
| | | const isValid = await formRef.value?.validate().catch(() => false) |
| | | if (!isValid) return |
| | | submitting.value = true |
| | |
| | | } |
| | | |
| | | // 加载详情 |
| | | async function loadDetail() { |
| | | async function loadDetail () { |
| | | if (!formData.value.id) return |
| | | const res = await fwTaskScheduleDetailApi({ id: formData.value.id }) |
| | | const data = res?.data?.data ?? {} |
| | |
| | | } |
| | | |
| | | // 左键点击事件处理 |
| | | function LeftClickEvent(click) { |
| | | function LeftClickEvent (click) { |
| | | const pos = click.position |
| | | const cartesian3 = viewer.camera.pickEllipsoid(pos, viewer.scene.globe.ellipsoid) |
| | | if (!cartesian3) { |
| | |
| | | } |
| | | |
| | | // 地图弹框关闭处理 |
| | | function positionClosed() { |
| | | function positionClosed () { |
| | | redPointEntity = null |
| | | } |
| | | |
| | |
| | | let redPointEntity |
| | | |
| | | // 选择位置 |
| | | async function selectLocation() { |
| | | async function selectLocation () { |
| | | visible1.value = true |
| | | await nextTick() |
| | | const publicCesiumInstance = new PublicCesium({ |
| | |
| | | } |
| | | |
| | | // 地图取消 |
| | | function handleMapCancel() { |
| | | function handleMapCancel () { |
| | | tempLocation.value = { longitude: null, latitude: null } |
| | | visible1.value = false |
| | | } |
| | | |
| | | // 地图确认 |
| | | function handleMapConfirm() { |
| | | function handleMapConfirm () { |
| | | if (tempLocation.value.longitude != null && tempLocation.value.latitude != null) { |
| | | formData.value.longitude = _.round(tempLocation.value.longitude, 6) |
| | | formData.value.latitude = _.round(tempLocation.value.latitude, 6) |
| | |
| | | } |
| | | |
| | | // 打开弹框 |
| | | async function open({ mode, row } = {}) { |
| | | async function open ({ mode, row } = {}) { |
| | | dialogMode.value = mode || 'add' |
| | | formData.value = dialogMode.value === 'add' ? initForm() : { ...row } |
| | | if (dialogMode.value !== 'add') { |