45 lines
1.2 KiB
Vue
45 lines
1.2 KiB
Vue
|
<template>
|
||
|
|
<el-switch v-bind="$attrs" :active-text="activeText"
|
||
|
|
:inactive-text="inactiveText" inline-prompt :loading="loading" :before-change="handleBeforeChange" />
|
||
|
|
</template>
|
||
|
|
<script setup>
|
||
|
|
const { proxy } = getCurrentInstance();
|
||
|
|
const props = defineProps({
|
||
|
|
beforeChange: {
|
||
|
|
type: Function,
|
||
|
|
required: true
|
||
|
|
},
|
||
|
|
tipText: {
|
||
|
|
type: String,
|
||
|
|
default: ''
|
||
|
|
},
|
||
|
|
activeText: {
|
||
|
|
type: String,
|
||
|
|
default: ''
|
||
|
|
},
|
||
|
|
inactiveText: {
|
||
|
|
type: String,
|
||
|
|
default: ''
|
||
|
|
}
|
||
|
|
});
|
||
|
|
const emits = defineEmits(['change']);
|
||
|
|
const loading = ref(false);
|
||
|
|
const handleBeforeChange = async () => {
|
||
|
|
loading.value = true;
|
||
|
|
try {
|
||
|
|
await proxy.$modal.confirm(props.tipText || proxy.t('请确认此操作，是否继续？')).then(() => {
|
||
|
|
// 调用父组件传递的 beforeChange 方法
|
||
|
|
return props.beforeChange()
|
||
|
|
}).catch(() => {
|
||
|
|
loading.value = false;
|
||
|
|
return false;
|
||
|
|
});
|
||
|
|
} catch (error) {
|
||
|
|
console.error('接口调用失败', error);
|
||
|
|
return false; // 阻止开关状态改变
|
||
|
|
} finally {
|
||
|
|
loading.value = false;
|
||
|
|
}
|
||
|
|
};
|
||
|
|
</script>
|
||
|
|
<style scoped lang="scss"></style>
|