Files
SPDM/src/views/competenceCenter/condition/components/delPoolModal.vue
2025-11-25 16:52:29 +08:00

95 lines
2.3 KiB
Vue

<template>
<Dialog v-model="visible" :diaTitle="$t('工况库.删除库')" :height="800" @show="onShowFun">
<template #default>
<div v-if="poolList.length > 0">
<div v-for="item in poolList" :key="item.id" class="pool-item">
<div class="name">{{ item.poolName }}</div>
<div class="btn">
<el-popconfirm
:title="$t('知识库.确认删除')"
:cancelButtonText="$t('通用.取消')"
:confirmButtonText="$t('通用.确定')"
@confirm="onDelPoolFun(item)"
>
<template #reference>
<el-link type="danger">{{ $t('工况库.删除') }}</el-link>
</template>
</el-popconfirm>
</div>
</div>
</div>
<el-empty v-else />
</template>
</Dialog>
</template>
<script setup lang="ts">
import { computed, ref, type Ref } from 'vue';
import Dialog from '@/components/common/dialog/index.vue';
import { getAllTaskPoolApi, cleanTaskPoolApi } from '@/api/task/taskpool';
import { ElMessage } from 'element-plus';
import type { Pool } from './types.ts';
interface Props {
modelValue: boolean;
}
const props = withDefaults(defineProps<Props>(), {
modelValue: false,
});
const emits = defineEmits(['update:modelValue', 'confirm']);
const visible = computed({
get: () => props.modelValue,
set: (val) => emits('update:modelValue', val),
});
const onShowFun = () => {
queryListFun();
};
const poolList: Ref<Pool[]> = ref([]);
const queryListFun = async () => {
const res: any = await getAllTaskPoolApi();
if (res.code === 200 && Array.isArray(res.data)) {
poolList.value = res.data.reverse();
} else {
poolList.value = [];
}
};
const onDelPoolFun = async (pool: Pool) => {
const req = {
poolName: pool.poolName,
};
const res: any = await cleanTaskPoolApi(req);
if (res.code === 200) {
ElMessage.success(res.message);
queryListFun();
emits('confirm');
} else {
ElMessage.error(res.message);
}
};
</script>
<style scoped lang="scss">
.pool-item {
width: 100%;
height: 50px;
margin-bottom: 8px;
display: flex;
padding: 0 15px;
line-height: 50px;
border-radius: 5px;
justify-content: space-between;
align-items: center;
}
.name {
flex: 1;
}
.btn {
width: 50px;
}
</style>