<template>
|
<el-row justify="space-between">
|
<el-text>单日计划</el-text>
|
<el-button
|
v-show="create && modelValue && modelValue.length > 0"
|
type="success"
|
size="small"
|
@click="add"
|
>任务调整</el-button
|
>
|
</el-row>
|
<el-divider />
|
<div>
|
<el-scrollbar v-loading="loading" :height="height">
|
<el-space
|
v-if="modelValue && modelValue.length > 0"
|
fill
|
:fill-ratio="100"
|
direction="vertical"
|
style="width: 100%"
|
>
|
<ItemSubTask v-for="s in modelValue" :key="s.guid" :item="s">
|
<template #default="{ item }">
|
<el-space direction="vertical">
|
<el-button plain type="primary" size="small" @click="edit(item)"
|
>编辑</el-button
|
>
|
<el-button
|
:disabled="item.status != '未执行'"
|
type="default"
|
size="small"
|
@click="remove(item)"
|
>移除</el-button
|
>
|
</el-space>
|
</template>
|
</ItemSubTask>
|
</el-space>
|
<div v-else>
|
<el-empty description="无任务记录" />
|
<el-row justify="center">
|
<el-button type="success" size="small" @click="add"
|
>添加任务</el-button
|
>
|
</el-row>
|
</div>
|
</el-scrollbar>
|
</div>
|
<el-dialog
|
v-model="dialogVisible"
|
width="600"
|
title="一键创建总任务"
|
destroy-on-close
|
:close-on-click-modal="false"
|
:close-on-press-escape="false"
|
:show-close="false"
|
>
|
<CompSubTaskEdit
|
v-model="activeItem"
|
@submit="dialogVisible = false"
|
@cancel="dialogVisible = false"
|
></CompSubTaskEdit>
|
</el-dialog>
|
</template>
|
<script setup>
|
import { ref, computed, watch, onMounted, onUnmounted } from 'vue';
|
import { ElMessageBox, ElNotification, ElMessage } from 'element-plus';
|
import CompSubTaskEdit from './CompSubTaskEdit.vue';
|
|
const props = defineProps({
|
modelValue: Array,
|
height: {
|
type: String,
|
default: '70vh'
|
},
|
// 是否显示添加任务按钮
|
create: Boolean,
|
loading: Boolean
|
});
|
|
const dialogVisible = ref(false)
|
const activeItem = ref(null)
|
const data = computed(() => props.modelValue);
|
|
const emit = defineEmits(['edit', 'add', 'remove', 'update:modelValue']);
|
|
function remove(item) {
|
if (item.status == '未执行') {
|
ElMessageBox.confirm('是否移除监管任务', `移除确认`, {
|
confirmButtonText: '确认',
|
cancelButtonText: '取消',
|
type: 'warning'
|
}).then(() => {
|
const index = data.value.indexOf(item);
|
data.value.splice(index, 1);
|
|
emit('update:modelValue', data.value);
|
emit('remove', item);
|
});
|
}
|
}
|
|
function edit(item) {
|
activeItem.value = item
|
dialogVisible.value = true
|
emit('edit');
|
}
|
|
function add() {
|
emit('add');
|
}
|
|
onUnmounted(()=>{
|
dialogVisible.value = false
|
})
|
</script>
|