<template>
|
<el-row gutter="20">
|
<el-col :span="16">
|
<div>
|
<el-text>监管场景</el-text>
|
</div>
|
<el-divider />
|
<CompSubTaskSelect
|
v-model="seletedSceneList"
|
:dayTask="dayTask"
|
@submit="createSubtasks"
|
></CompSubTaskSelect>
|
<div>
|
<!-- <el-scrollbar height="50vh"> -->
|
<CompMonitorObj :data="curMonitorObjList" height="50vh">
|
<template #default="{ item }">
|
<el-button
|
v-if="item.select"
|
size="small"
|
type="info"
|
plain
|
disabled
|
icon="select"
|
>选择</el-button
|
>
|
<el-button
|
v-else
|
size="small"
|
type="primary"
|
plain
|
@click="selectScene(item)"
|
>选择</el-button
|
>
|
</template>
|
</CompMonitorObj>
|
<!-- </el-scrollbar> -->
|
</div>
|
</el-col>
|
<el-col :span="8">
|
<CompSubTaskList
|
v-model="curSubTaskList"
|
:height="height"
|
:date="dayTask.date"
|
@submit="deleteSubtasks"
|
></CompSubTaskList>
|
</el-col>
|
</el-row>
|
</template>
|
<script setup>
|
import { ref, watch, onMounted, inject } from 'vue';
|
import { useCloned } from '@vueuse/core';
|
import { useRoute, useRouter } from 'vue-router';
|
import { ElMessage, ElNotification, ElMessageBox } from 'element-plus';
|
import taskApi from '@/api/fysp/taskApi';
|
import subtaskApi from '@/api/fysp/subtaskApi';
|
import TaskProxy from '../TaskProxy';
|
|
import CompMonitorObj from './CompMonitorObj.vue';
|
import CompSubTaskSelect from './CompSubTaskSelect.vue';
|
import CompSubTaskList from './CompSubTaskList.vue';
|
import dayjs from 'dayjs';
|
|
const route = useRoute();
|
|
const props = defineProps({
|
// 日任务
|
dayTask: Object,
|
mObjList: Array
|
});
|
|
const emit = defineEmits(['submit']);
|
|
/*************************** 数据初始化 ************************************/
|
// 巡查子任务集合
|
const curMonitorObjList = ref([]);
|
const curSubTaskList = ref([]);
|
const height = ref('70vh');
|
|
// 监听日任务变化
|
watch(
|
() => props.dayTask,
|
(nV) => {
|
onDayTaskChange(nV);
|
},
|
{ immediate: true }
|
);
|
|
// 监听监管场景变化
|
watch(
|
() => props.mObjList,
|
(nV, oV) => {
|
if (nV != oV) {
|
curMonitorObjList.value = useCloned(nV).cloned.value;
|
}
|
},
|
{ immediate: true }
|
);
|
|
// 根据日任务获取对应子任务
|
function onDayTaskChange(dayTask) {
|
if (dayTask) {
|
fetchSubTask(dayTask.guid);
|
} else {
|
curSubTaskList.value = [];
|
}
|
}
|
|
// 获取巡查子任务
|
function fetchSubTask(dayTaskId) {
|
taskApi.fetchSubtaskByDayTask(dayTaskId).then((res) => {
|
curSubTaskList.value = res;
|
});
|
}
|
|
/*************************** 添加子任务 ************************************/
|
|
// 所选场景
|
const seletedSceneList = ref([]);
|
// 选择任务场景
|
function selectScene(item) {
|
item.select = true;
|
seletedSceneList.value.push(item);
|
}
|
// 移除任务场景
|
// function deleteScene(item) {
|
// item.select = false;
|
// const index = seletedSceneList.value.indexOf(item);
|
// seletedSceneList.value.splice(index, 1);
|
// }
|
|
function createSubtasks() {
|
seletedSceneList.value = [];
|
fetchSubTask(props.dayTask.guid);
|
ElMessage({
|
message: '巡查任务添加成功',
|
type: 'success'
|
});
|
emit('submit');
|
}
|
|
function deleteSubtasks() {
|
emit('submit');
|
}
|
</script>
|
<style scoped></style>
|
