1Panel/frontend/src/views/app-store/installed/delete/index.vue at e9a97c65fdec7812bc53557fb9b2c24359feca59 · 1Panel-dev/1Panel · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
<template>
    <DialogPro v-model="open" :title="$t('commons.button.uninstall') + ' - ' + appInstallName" @close="handleClose">
        <el-form ref="deleteForm" label-position="left" v-loading="loading">
            <el-form-item>
                <el-checkbox v-model="deleteReq.forceDelete" :label="$t('app.forceUninstall')" />
                <span class="input-help">
                    {{ $t('app.forceDeleteHelper') }}
                </span>
            </el-form-item>
            <el-form-item>
                <el-checkbox v-model="deleteReq.deleteBackup" :label="$t('app.deleteBackup')" />
                <span class="input-help">
                    {{ $t('app.deleteBackupHelper') }}
                </span>
            </el-form-item>
            <el-form-item>
                <el-checkbox v-model="deleteReq.deleteImage" :label="$t('app.deleteImage')" />
                <span class="input-help">
                    {{ $t('app.deleteImageHelper') }}
                </span>
            </el-form-item>
            <el-form-item v-if="appType === 'website'">
                <el-checkbox v-model="deleteReq.deleteDB" :label="$t('app.deleteDB')" />
                <span class="input-help">
                    {{ $t('app.deleteDBHelper') }}
                </span>
            </el-form-item>
            <el-form-item>
                <span v-html="deleteHelper"></span>
                <el-input v-model="deleteInfo" :placeholder="appInstallName" />
            </el-form-item>
        </el-form>
        <template #footer>
            <span class="dialog-footer">
                <el-button @click="handleClose" :disabled="loading">
                    {{ $t('commons.button.cancel') }}
                </el-button>
                <el-button type="primary" @click="submit" :disabled="loading || deleteInfo !== appInstallName">
                    {{ $t('commons.button.confirm') }}
                </el-button>
            </span>
        </template>
    </DialogPro>
    <TaskLog ref="taskLogRef" @close="handleClose" />
</template>
<script lang="ts" setup>
import { FormInstance } from 'element-plus';
import { onBeforeUnmount, ref } from 'vue';
import { App } from '@/api/interface/app';
import { installedOp } from '@/api/modules/app';
import i18n from '@/lang';
import bus from '@/global/bus';
import TaskLog from '@/components/log/task/index.vue';
import { v4 as uuidv4 } from 'uuid';

const deleteReq = ref({
    operate: 'delete',
    installId: 0,
    deleteBackup: false,
    forceDelete: false,
    deleteDB: true,
    deleteImage: false,
    taskID: '',
});
const open = ref(false);
const loading = ref(false);
const deleteHelper = ref('');
const deleteInfo = ref('');
const appInstallName = ref('');
const appType = ref('');
const taskLogRef = ref();

const deleteForm = ref<FormInstance>();
const em = defineEmits(['close']);

const handleClose = () => {
    open.value = false;
    em('close', open);
};

const acceptParams = async (app: App.AppInstallDto) => {
    deleteReq.value = {
        operate: 'delete',
        installId: 0,
        deleteBackup: false,
        forceDelete: false,
        deleteDB: true,
        deleteImage: false,
        taskID: uuidv4(),
    };
    deleteInfo.value = '';
    deleteReq.value.installId = app.id;
    appType.value = app.appType;
    deleteHelper.value = i18n.global.t('website.deleteConfirmHelper', [app.name]);
    appInstallName.value = app.name;
    open.value = true;
};

const submit = async () => {
    installedOp(deleteReq.value).then(() => {
        handleClose();
        taskLogRef.value.openWithTaskID(deleteReq.value.taskID);
        bus.emit('update', true);
    });
};

onBeforeUnmount(() => {
    bus.off('update');
});

defineExpose({
    acceptParams,
});
</script>