7 changed files with 175 additions and 4 deletions
@ -0,0 +1,106 @@ |
|||
<template> |
|||
<el-dialog v-model="dialogVisible" title="套餐分配" width="500px" append-to-body> |
|||
<el-form ref="allocateFormRef" :model="formData" :rules="rules" label-width="100px"> |
|||
<el-form-item label="选择代理" prop="agentId"> |
|||
<el-select v-model="formData.agentId" placeholder="请选择代理" style="width: 100%"> |
|||
<el-option v-for="item in agentOptions" :key="item.id" :label="item.agentName" :value="item.id" /> |
|||
</el-select> |
|||
</el-form-item> |
|||
</el-form> |
|||
<template #footer> |
|||
<div class="dialog-footer"> |
|||
<el-button type="primary" @click="submitForm">分配</el-button> |
|||
<el-button @click="cancel">取消</el-button> |
|||
</div> |
|||
</template> |
|||
</el-dialog> |
|||
</template> |
|||
|
|||
<script setup lang="ts"> |
|||
import { getAllAgentNameList, allocatePackages } from '@/api/im/chatPackage'; |
|||
import { nextTick } from 'vue'; |
|||
|
|||
interface Emits { |
|||
(e: 'success'): void; |
|||
(e: 'close'): void; |
|||
} |
|||
|
|||
const { proxy } = getCurrentInstance() as ComponentInternalInstance; |
|||
|
|||
const emit = defineEmits<Emits>(); |
|||
|
|||
interface Props { |
|||
packageId?: number; |
|||
} |
|||
|
|||
const props = withDefaults(defineProps<Props>(), { |
|||
packageId: undefined |
|||
}); |
|||
|
|||
const dialogVisible = ref(false); |
|||
const allocateFormRef = ref(); |
|||
const agentOptions = ref([]); |
|||
const formData = ref({ |
|||
agentId: undefined, |
|||
packageId: undefined |
|||
}); |
|||
const rules = { |
|||
agentId: [{ required: true, message: '请选择代理', trigger: 'change' }] |
|||
}; |
|||
|
|||
const openDialog = async () => { |
|||
dialogVisible.value = true; |
|||
// 等待组件渲染完成后再清空表单 |
|||
await nextTick(); |
|||
resetForm(); |
|||
await loadAgentOptions(); |
|||
}; |
|||
|
|||
const loadAgentOptions = async () => { |
|||
try { |
|||
const res = await getAllAgentNameList(); |
|||
agentOptions.value = res.data || []; |
|||
} catch (error) { |
|||
console.error('加载代理列表失败:', error); |
|||
proxy?.$modal.msgError('加载代理列表失败'); |
|||
} |
|||
}; |
|||
|
|||
const resetForm = () => { |
|||
allocateFormRef.value?.resetFields(); |
|||
formData.value = { |
|||
agentId: undefined, |
|||
packageId: props.packageId |
|||
}; |
|||
}; |
|||
|
|||
const submitForm = async () => { |
|||
allocateFormRef.value?.validate(async (valid: boolean) => { |
|||
if (valid) { |
|||
try { |
|||
const params = { |
|||
agentId: formData.value.agentId, |
|||
packageId: props.packageId |
|||
}; |
|||
|
|||
await allocatePackages(params); |
|||
proxy?.$modal.msgSuccess('分配成功'); |
|||
dialogVisible.value = false; |
|||
emit('success'); |
|||
} catch (error) { |
|||
console.error('分配失败:', error); |
|||
proxy?.$modal.msgError('分配失败'); |
|||
} |
|||
} |
|||
}); |
|||
}; |
|||
|
|||
const cancel = () => { |
|||
dialogVisible.value = false; |
|||
emit('close'); |
|||
}; |
|||
|
|||
defineExpose({ |
|||
openDialog |
|||
}); |
|||
</script> |
|||
Loading…
Reference in new issue