feat: UserEdit拆分成General和MAA两个文件,方便后期维护
This commit is contained in:
@@ -53,7 +53,9 @@ export function setupLogger() {
|
||||
log.transports.file.maxSize = 50 * 1024 * 1024
|
||||
|
||||
// 禁用自动归档,因为我们按日期分文件
|
||||
log.transports.file.archiveLog = null
|
||||
log.transports.file.archiveLog = () => {
|
||||
/* do nothing */
|
||||
};
|
||||
|
||||
// 捕获未处理的异常和Promise拒绝
|
||||
log.catchErrors({
|
||||
|
||||
@@ -46,6 +46,30 @@ const routes: RouteRecordRaw[] = [
|
||||
component: () => import('../views/UserEdit.vue'),
|
||||
meta: { title: '编辑用户' },
|
||||
},
|
||||
{
|
||||
path: '/scripts/:scriptId/users/add/maa',
|
||||
name: 'MAAUserAdd',
|
||||
component: () => import('../views/MAAUserEdit.vue'),
|
||||
meta: { title: '添加MAA用户' },
|
||||
},
|
||||
{
|
||||
path: '/scripts/:scriptId/users/:userId/edit/maa',
|
||||
name: 'MAAUserEdit',
|
||||
component: () => import('../views/MAAUserEdit.vue'),
|
||||
meta: { title: '编辑MAA用户' },
|
||||
},
|
||||
{
|
||||
path: '/scripts/:scriptId/users/add/general',
|
||||
name: 'GeneralUserAdd',
|
||||
component: () => import('../views/GeneralUserEdit.vue'),
|
||||
meta: { title: '添加通用用户' },
|
||||
},
|
||||
{
|
||||
path: '/scripts/:scriptId/users/:userId/edit/general',
|
||||
name: 'GeneralUserEdit',
|
||||
component: () => import('../views/GeneralUserEdit.vue'),
|
||||
meta: { title: '编辑通用用户' },
|
||||
},
|
||||
{
|
||||
path: '/plans',
|
||||
name: 'Plans',
|
||||
|
||||
758
frontend/src/views/GeneralUserEdit.vue
Normal file
758
frontend/src/views/GeneralUserEdit.vue
Normal file
@@ -0,0 +1,758 @@
|
||||
<template>
|
||||
<div class="user-edit-header">
|
||||
<div class="header-nav">
|
||||
<a-breadcrumb class="breadcrumb">
|
||||
<a-breadcrumb-item>
|
||||
<router-link to="/scripts">脚本管理</router-link>
|
||||
</a-breadcrumb-item>
|
||||
<a-breadcrumb-item>
|
||||
<router-link :to="`/scripts/${scriptId}/edit`" class="breadcrumb-link">
|
||||
{{ scriptName }}
|
||||
</router-link>
|
||||
</a-breadcrumb-item>
|
||||
<a-breadcrumb-item>
|
||||
{{ isEdit ? '编辑用户' : '添加用户' }}
|
||||
</a-breadcrumb-item>
|
||||
</a-breadcrumb>
|
||||
</div>
|
||||
|
||||
<a-space size="middle">
|
||||
<a-button
|
||||
type="primary"
|
||||
ghost
|
||||
size="large"
|
||||
@click="handleGeneralConfig"
|
||||
:loading="generalConfigLoading"
|
||||
>
|
||||
<template #icon>
|
||||
<SettingOutlined />
|
||||
</template>
|
||||
通用配置
|
||||
</a-button>
|
||||
<a-button size="large" @click="handleCancel" class="cancel-button">
|
||||
<template #icon>
|
||||
<ArrowLeftOutlined />
|
||||
</template>
|
||||
返回
|
||||
</a-button>
|
||||
<a-button
|
||||
type="primary"
|
||||
size="large"
|
||||
@click="handleSubmit"
|
||||
:loading="loading"
|
||||
class="save-button"
|
||||
>
|
||||
<template #icon>
|
||||
<SaveOutlined />
|
||||
</template>
|
||||
{{ isEdit ? '保存修改' : '创建用户' }}
|
||||
</a-button>
|
||||
</a-space>
|
||||
</div>
|
||||
|
||||
<div class="user-edit-content">
|
||||
<a-form ref="formRef" :model="formData" :rules="rules" layout="vertical" class="user-form">
|
||||
<a-card title="基本信息" class="form-card">
|
||||
<a-row :gutter="24">
|
||||
<a-col :span="12">
|
||||
<a-form-item name="userName" required>
|
||||
<template #label>
|
||||
<a-tooltip title="用于识别用户的显示名称">
|
||||
<span class="form-label">
|
||||
用户名
|
||||
<QuestionCircleOutlined class="help-icon" />
|
||||
</span>
|
||||
</a-tooltip>
|
||||
</template>
|
||||
<a-input
|
||||
v-model:value="formData.userName"
|
||||
placeholder="请输入用户名"
|
||||
:disabled="loading"
|
||||
size="large"
|
||||
/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :span="12">
|
||||
<a-form-item name="status">
|
||||
<template #label>
|
||||
<a-tooltip title="是否启用该用户">
|
||||
<span class="form-label">
|
||||
启用状态
|
||||
<QuestionCircleOutlined class="help-icon" />
|
||||
</span>
|
||||
</a-tooltip>
|
||||
</template>
|
||||
<a-select v-model:value="formData.Info.Status" size="large">
|
||||
<a-select-option :value="true">是</a-select-option>
|
||||
<a-select-option :value="false">否</a-select-option>
|
||||
</a-select>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
</a-row>
|
||||
|
||||
<a-row :gutter="24">
|
||||
<a-col :span="12">
|
||||
<a-form-item name="remainedDay">
|
||||
<template #label>
|
||||
<a-tooltip title="账号剩余的有效天数,「-1」表示无限">
|
||||
<span class="form-label">
|
||||
剩余天数
|
||||
<QuestionCircleOutlined class="help-icon" />
|
||||
</span>
|
||||
</a-tooltip>
|
||||
</template>
|
||||
<a-input-number
|
||||
v-model:value="formData.Info.RemainedDay"
|
||||
:min="-1"
|
||||
:max="9999"
|
||||
placeholder="-1"
|
||||
:disabled="loading"
|
||||
size="large"
|
||||
style="width: 100%"
|
||||
/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :span="12">
|
||||
<!-- 占位列 -->
|
||||
</a-col>
|
||||
</a-row>
|
||||
|
||||
<a-form-item name="notes">
|
||||
<template #label>
|
||||
<a-tooltip title="为用户添加备注信息">
|
||||
<span class="form-label">
|
||||
备注
|
||||
<QuestionCircleOutlined class="help-icon" />
|
||||
</span>
|
||||
</a-tooltip>
|
||||
</template>
|
||||
<a-textarea
|
||||
v-model:value="formData.Info.Notes"
|
||||
placeholder="请输入备注信息"
|
||||
:rows="4"
|
||||
:disabled="loading"
|
||||
/>
|
||||
</a-form-item>
|
||||
</a-card>
|
||||
|
||||
<a-card title="脚本配置" class="form-card">
|
||||
<a-row :gutter="24">
|
||||
<a-col :span="12">
|
||||
<a-form-item name="ifScriptBeforeTask">
|
||||
<template #label>
|
||||
<a-tooltip title="是否在任务执行前运行自定义脚本">
|
||||
<span class="form-label">
|
||||
任务前执行脚本
|
||||
<QuestionCircleOutlined class="help-icon" />
|
||||
</span>
|
||||
</a-tooltip>
|
||||
</template>
|
||||
<a-switch
|
||||
v-model:checked="formData.Info.IfScriptBeforeTask"
|
||||
:disabled="loading"
|
||||
size="default"
|
||||
/>
|
||||
<span class="switch-description">启用后将在任务执行前运行指定脚本</span>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :span="12">
|
||||
<a-form-item name="ifScriptAfterTask">
|
||||
<template #label>
|
||||
<a-tooltip title="是否在任务执行后运行自定义脚本">
|
||||
<span class="form-label">
|
||||
任务后执行脚本
|
||||
<QuestionCircleOutlined class="help-icon" />
|
||||
</span>
|
||||
</a-tooltip>
|
||||
</template>
|
||||
<a-switch
|
||||
v-model:checked="formData.Info.IfScriptAfterTask"
|
||||
:disabled="loading"
|
||||
size="default"
|
||||
/>
|
||||
<span class="switch-description">启用后将在任务执行后运行指定脚本</span>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
</a-row>
|
||||
|
||||
<a-row :gutter="24">
|
||||
<a-col :span="12">
|
||||
<a-form-item name="scriptBeforeTask">
|
||||
<template #label>
|
||||
<a-tooltip title="任务执行前要运行的脚本路径">
|
||||
<span class="form-label">
|
||||
任务前脚本
|
||||
<QuestionCircleOutlined class="help-icon" />
|
||||
</span>
|
||||
</a-tooltip>
|
||||
</template>
|
||||
<a-input
|
||||
v-model:value="formData.Info.ScriptBeforeTask"
|
||||
placeholder="请输入脚本路径"
|
||||
:disabled="loading || !formData.Info.IfScriptBeforeTask"
|
||||
size="large"
|
||||
/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :span="12">
|
||||
<a-form-item name="scriptAfterTask">
|
||||
<template #label>
|
||||
<a-tooltip title="任务执行后要运行的脚本路径">
|
||||
<span class="form-label">
|
||||
任务后脚本
|
||||
<QuestionCircleOutlined class="help-icon" />
|
||||
</span>
|
||||
</a-tooltip>
|
||||
</template>
|
||||
<a-input
|
||||
v-model:value="formData.Info.ScriptAfterTask"
|
||||
placeholder="请输入脚本路径"
|
||||
:disabled="loading || !formData.Info.IfScriptAfterTask"
|
||||
size="large"
|
||||
/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
</a-row>
|
||||
</a-card>
|
||||
|
||||
<a-card title="通知配置" class="form-card">
|
||||
<a-row :gutter="24" align="middle">
|
||||
<a-col :span="6">
|
||||
<span style="font-weight: 500">启用通知</span>
|
||||
</a-col>
|
||||
<a-col :span="18">
|
||||
<a-switch v-model:checked="formData.Notify.Enabled" :disabled="loading" />
|
||||
<span class="switch-description">启用后将发送任务通知</span>
|
||||
</a-col>
|
||||
</a-row>
|
||||
|
||||
<!-- 发送统计 -->
|
||||
<a-row :gutter="24" style="margin-top: 16px">
|
||||
<a-col :span="6">
|
||||
<span style="font-weight: 500">通知内容</span>
|
||||
</a-col>
|
||||
<a-col :span="18">
|
||||
<a-checkbox
|
||||
v-model:checked="formData.Notify.IfSendStatistic"
|
||||
:disabled="loading || !formData.Notify.Enabled"
|
||||
>统计信息
|
||||
</a-checkbox>
|
||||
</a-col>
|
||||
</a-row>
|
||||
|
||||
<!-- 邮件通知 -->
|
||||
<a-row :gutter="24" style="margin-top: 16px">
|
||||
<a-col :span="6">
|
||||
<a-checkbox
|
||||
v-model:checked="formData.Notify.IfSendMail"
|
||||
:disabled="loading || !formData.Notify.Enabled"
|
||||
>邮件通知
|
||||
</a-checkbox>
|
||||
</a-col>
|
||||
<a-col :span="18">
|
||||
<a-input
|
||||
v-model:value="formData.Notify.ToAddress"
|
||||
placeholder="请输入收件人邮箱地址"
|
||||
:disabled="loading || !formData.Notify.Enabled || !formData.Notify.IfSendMail"
|
||||
size="large"
|
||||
style="width: 100%"
|
||||
/>
|
||||
</a-col>
|
||||
</a-row>
|
||||
|
||||
<!-- Server酱通知 -->
|
||||
<a-row :gutter="24" style="margin-top: 16px">
|
||||
<a-col :span="6">
|
||||
<a-checkbox
|
||||
v-model:checked="formData.Notify.IfServerChan"
|
||||
:disabled="loading || !formData.Notify.Enabled"
|
||||
>Server酱
|
||||
</a-checkbox>
|
||||
</a-col>
|
||||
<a-col :span="18">
|
||||
<a-input
|
||||
v-model:value="formData.Notify.ServerChanKey"
|
||||
placeholder="请输入SENDKEY"
|
||||
:disabled="loading || !formData.Notify.Enabled || !formData.Notify.IfServerChan"
|
||||
size="large"
|
||||
style="width: 100%"
|
||||
/>
|
||||
</a-col>
|
||||
</a-row>
|
||||
|
||||
<!-- 企业微信群机器人通知 -->
|
||||
<a-row :gutter="24" style="margin-top: 16px">
|
||||
<a-col :span="6">
|
||||
<a-checkbox
|
||||
v-model:checked="formData.Notify.IfCompanyWebHookBot"
|
||||
:disabled="loading || !formData.Notify.Enabled"
|
||||
>企业微信群机器人
|
||||
</a-checkbox>
|
||||
</a-col>
|
||||
<a-col :span="18">
|
||||
<a-input
|
||||
v-model:value="formData.Notify.CompanyWebHookBotUrl"
|
||||
placeholder="请输入机器人Webhook地址"
|
||||
:disabled="
|
||||
loading || !formData.Notify.Enabled || !formData.Notify.IfCompanyWebHookBot
|
||||
"
|
||||
size="large"
|
||||
style="width: 100%"
|
||||
/>
|
||||
</a-col>
|
||||
</a-row>
|
||||
</a-card>
|
||||
</a-form>
|
||||
</div>
|
||||
|
||||
<a-float-button
|
||||
type="primary"
|
||||
@click="handleSubmit"
|
||||
class="float-button"
|
||||
:style="{
|
||||
right: '24px',
|
||||
}"
|
||||
>
|
||||
<template #icon>
|
||||
<SaveOutlined />
|
||||
</template>
|
||||
</a-float-button>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { computed, nextTick, onMounted, reactive, ref, watch } from 'vue'
|
||||
import { useRoute, useRouter } from 'vue-router'
|
||||
import { message } from 'ant-design-vue'
|
||||
import {
|
||||
ArrowLeftOutlined,
|
||||
QuestionCircleOutlined,
|
||||
SaveOutlined,
|
||||
SettingOutlined,
|
||||
} from '@ant-design/icons-vue'
|
||||
import type { FormInstance, Rule } from 'ant-design-vue/es/form'
|
||||
import { useUserApi } from '@/composables/useUserApi'
|
||||
import { useScriptApi } from '@/composables/useScriptApi'
|
||||
import { useWebSocket } from '@/composables/useWebSocket'
|
||||
|
||||
const router = useRouter()
|
||||
const route = useRoute()
|
||||
const { addUser, updateUser, getUsers, loading: userLoading } = useUserApi()
|
||||
const { getScript } = useScriptApi()
|
||||
const { connect, disconnect } = useWebSocket()
|
||||
|
||||
const formRef = ref<FormInstance>()
|
||||
const loading = computed(() => userLoading.value)
|
||||
|
||||
// 路由参数
|
||||
const scriptId = route.params.scriptId as string
|
||||
const userId = route.params.userId as string
|
||||
const isEdit = computed(() => !!userId)
|
||||
|
||||
// 脚本信息
|
||||
const scriptName = ref('')
|
||||
|
||||
// 通用配置相关
|
||||
const generalConfigLoading = ref(false)
|
||||
const generalWebsocketId = ref<string | null>(null)
|
||||
|
||||
// 通用脚本默认用户数据
|
||||
const getDefaultGeneralUserData = () => ({
|
||||
Info: {
|
||||
Name: '',
|
||||
Notes: '',
|
||||
Status: true,
|
||||
RemainedDay: -1,
|
||||
IfScriptBeforeTask: false,
|
||||
IfScriptAfterTask: false,
|
||||
ScriptBeforeTask: '',
|
||||
ScriptAfterTask: '',
|
||||
},
|
||||
Notify: {
|
||||
Enabled: false,
|
||||
ToAddress: '',
|
||||
IfSendMail: false,
|
||||
IfSendStatistic: false,
|
||||
IfServerChan: false,
|
||||
IfCompanyWebHookBot: false,
|
||||
ServerChanKey: '',
|
||||
ServerChanChannel: '',
|
||||
ServerChanTag: '',
|
||||
CompanyWebHookBotUrl: '',
|
||||
},
|
||||
Data: {
|
||||
LastProxyDate: '2000-01-01',
|
||||
ProxyTimes: 0,
|
||||
},
|
||||
})
|
||||
|
||||
// 创建扁平化的表单数据,用于表单验证
|
||||
const formData = reactive({
|
||||
// 扁平化的验证字段
|
||||
userName: '',
|
||||
// 嵌套的实际数据
|
||||
...getDefaultGeneralUserData(),
|
||||
})
|
||||
|
||||
// 表单验证规则
|
||||
const rules = computed(() => {
|
||||
const baseRules: Record<string, Rule[]> = {
|
||||
userName: [
|
||||
{ required: true, message: '请输入用户名', trigger: 'blur' },
|
||||
{ min: 1, max: 50, message: '用户名长度应在1-50个字符之间', trigger: 'blur' },
|
||||
],
|
||||
}
|
||||
return baseRules
|
||||
})
|
||||
|
||||
// 同步扁平化字段与嵌套数据
|
||||
watch(
|
||||
() => formData.Info.Name,
|
||||
newVal => {
|
||||
if (formData.userName !== newVal) {
|
||||
formData.userName = newVal || ''
|
||||
}
|
||||
},
|
||||
{ immediate: true }
|
||||
)
|
||||
|
||||
watch(
|
||||
() => formData.userName,
|
||||
newVal => {
|
||||
if (formData.Info.Name !== newVal) {
|
||||
formData.Info.Name = newVal || ''
|
||||
}
|
||||
}
|
||||
)
|
||||
|
||||
// 加载脚本信息
|
||||
const loadScriptInfo = async () => {
|
||||
try {
|
||||
const script = await getScript(scriptId)
|
||||
if (script) {
|
||||
scriptName.value = script.name
|
||||
|
||||
// 如果是编辑模式,加载用户数据
|
||||
if (isEdit.value) {
|
||||
await loadUserData()
|
||||
}
|
||||
} else {
|
||||
message.error('脚本不存在')
|
||||
handleCancel()
|
||||
}
|
||||
} catch (error) {
|
||||
console.error('加载脚本信息失败:', error)
|
||||
message.error('加载脚本信息失败')
|
||||
}
|
||||
}
|
||||
|
||||
// 加载用户数据
|
||||
const loadUserData = async () => {
|
||||
try {
|
||||
const userResponse = await getUsers(scriptId, userId)
|
||||
|
||||
if (userResponse && userResponse.code === 200) {
|
||||
// 查找指定的用户数据
|
||||
const userIndex = userResponse.index.find(index => index.uid === userId)
|
||||
if (userIndex && userResponse.data[userId]) {
|
||||
const userData = userResponse.data[userId] as any
|
||||
|
||||
// 填充通用用户数据
|
||||
if (userIndex.type === 'GeneralUserConfig') {
|
||||
Object.assign(formData, {
|
||||
Info: { ...getDefaultGeneralUserData().Info, ...userData.Info },
|
||||
Notify: { ...getDefaultGeneralUserData().Notify, ...userData.Notify },
|
||||
Data: { ...getDefaultGeneralUserData().Data, ...userData.Data },
|
||||
})
|
||||
}
|
||||
|
||||
// 同步扁平化字段 - 使用nextTick确保数据更新完成后再同步
|
||||
await nextTick()
|
||||
formData.userName = formData.Info.Name || ''
|
||||
|
||||
console.log('用户数据加载成功:', {
|
||||
userName: formData.userName,
|
||||
InfoName: formData.Info.Name,
|
||||
fullData: formData,
|
||||
})
|
||||
} else {
|
||||
message.error('用户不存在')
|
||||
handleCancel()
|
||||
}
|
||||
} else {
|
||||
message.error('获取用户数据失败')
|
||||
handleCancel()
|
||||
}
|
||||
} catch (error) {
|
||||
console.error('加载用户数据失败:', error)
|
||||
message.error('加载用户数据失败')
|
||||
}
|
||||
}
|
||||
|
||||
const handleSubmit = async () => {
|
||||
try {
|
||||
await formRef.value?.validate()
|
||||
|
||||
// 确保扁平化字段同步到嵌套数据
|
||||
formData.Info.Name = formData.userName
|
||||
|
||||
console.log('提交前的表单数据:', {
|
||||
userName: formData.userName,
|
||||
InfoName: formData.Info.Name,
|
||||
isEdit: isEdit.value,
|
||||
})
|
||||
|
||||
// 构建提交数据,移除通用脚本不需要的MAA专用字段
|
||||
const { IfSendSixStar, ...generalNotify } = formData.Notify
|
||||
|
||||
const userData = {
|
||||
Info: { ...formData.Info },
|
||||
Notify: generalNotify,
|
||||
Data: { ...formData.Data },
|
||||
}
|
||||
|
||||
if (isEdit.value) {
|
||||
// 编辑模式
|
||||
const result = await updateUser(scriptId, userId, userData)
|
||||
if (result) {
|
||||
message.success('用户更新成功')
|
||||
handleCancel()
|
||||
}
|
||||
} else {
|
||||
// 添加模式
|
||||
const result = await addUser(scriptId)
|
||||
if (result) {
|
||||
// 创建成功后立即更新用户数据
|
||||
try {
|
||||
const updateResult = await updateUser(scriptId, result.userId, userData)
|
||||
console.log('用户数据更新结果:', updateResult)
|
||||
|
||||
if (updateResult) {
|
||||
message.success('用户创建成功')
|
||||
handleCancel()
|
||||
} else {
|
||||
message.error('用户创建成功,但数据更新失败,请手动编辑用户信息')
|
||||
// 不跳转,让用户可以重新保存
|
||||
}
|
||||
} catch (updateError) {
|
||||
console.error('更新用户数据时发生错误:', updateError)
|
||||
message.error('用户创建成功,但数据更新失败,请手动编辑用户信息')
|
||||
}
|
||||
}
|
||||
}
|
||||
} catch (error) {
|
||||
console.error('表单验证失败:', error)
|
||||
}
|
||||
}
|
||||
|
||||
const handleGeneralConfig = async () => {
|
||||
if (!isEdit.value) {
|
||||
message.warning('请先保存用户后再进行通用配置')
|
||||
return
|
||||
}
|
||||
|
||||
try {
|
||||
generalConfigLoading.value = true
|
||||
|
||||
// 如果已有连接,先断开
|
||||
if (generalWebsocketId.value) {
|
||||
disconnect(generalWebsocketId.value)
|
||||
generalWebsocketId.value = null
|
||||
}
|
||||
|
||||
// 建立WebSocket连接进行通用配置
|
||||
const websocketId = await connect({
|
||||
taskId: userId, // 使用用户ID进行配置
|
||||
mode: '设置脚本',
|
||||
showNotifications: true,
|
||||
onStatusChange: status => {
|
||||
console.log(`用户 ${formData.userName} 通用配置状态: ${status}`)
|
||||
},
|
||||
onMessage: data => {
|
||||
console.log(`用户 ${formData.userName} 通用配置消息:`, data)
|
||||
// 这里可以根据需要处理特定的消息
|
||||
},
|
||||
onError: error => {
|
||||
console.error(`用户 ${formData.userName} 通用配置错误:`, error)
|
||||
message.error(`通用配置连接失败: ${error}`)
|
||||
generalWebsocketId.value = null
|
||||
},
|
||||
})
|
||||
|
||||
if (websocketId) {
|
||||
generalWebsocketId.value = websocketId
|
||||
message.success(`已开始配置用户 ${formData.userName} 的通用设置`)
|
||||
}
|
||||
} catch (error) {
|
||||
console.error('通用配置失败:', error)
|
||||
message.error('通用配置失败')
|
||||
} finally {
|
||||
generalConfigLoading.value = false
|
||||
}
|
||||
}
|
||||
|
||||
const handleCancel = () => {
|
||||
// 清理WebSocket连接
|
||||
if (generalWebsocketId.value) {
|
||||
disconnect(generalWebsocketId.value)
|
||||
generalWebsocketId.value = null
|
||||
}
|
||||
router.push('/scripts')
|
||||
}
|
||||
|
||||
onMounted(() => {
|
||||
if (!scriptId) {
|
||||
message.error('缺少脚本ID参数')
|
||||
handleCancel()
|
||||
return
|
||||
}
|
||||
|
||||
loadScriptInfo()
|
||||
})
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.user-edit-container {
|
||||
padding: 32px;
|
||||
min-height: 100vh;
|
||||
background: var(--ant-color-bg-layout);
|
||||
}
|
||||
|
||||
.user-edit-header {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
margin-bottom: 32px;
|
||||
padding: 0 8px;
|
||||
}
|
||||
|
||||
.header-nav {
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
.breadcrumb {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.header-title h1 {
|
||||
margin: 0;
|
||||
font-size: 32px;
|
||||
font-weight: 700;
|
||||
color: var(--ant-color-text);
|
||||
background: linear-gradient(135deg, var(--ant-color-primary), var(--ant-color-primary-hover));
|
||||
-webkit-background-clip: text;
|
||||
-webkit-text-fill-color: transparent;
|
||||
background-clip: text;
|
||||
}
|
||||
|
||||
.subtitle {
|
||||
margin: 4px 0 0 0;
|
||||
font-size: 16px;
|
||||
color: var(--ant-color-text-secondary);
|
||||
}
|
||||
|
||||
.user-edit-content {
|
||||
max-width: 1200px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
.form-card {
|
||||
margin-bottom: 24px;
|
||||
border-radius: 12px;
|
||||
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
|
||||
}
|
||||
|
||||
.form-card :deep(.ant-card-head) {
|
||||
border-bottom: 2px solid var(--ant-color-border-secondary);
|
||||
}
|
||||
|
||||
.form-card :deep(.ant-card-head-title) {
|
||||
font-size: 18px;
|
||||
font-weight: 600;
|
||||
color: var(--ant-color-text);
|
||||
}
|
||||
|
||||
.user-form :deep(.ant-form-item-label > label) {
|
||||
font-weight: 500;
|
||||
color: var(--ant-color-text);
|
||||
}
|
||||
|
||||
.switch-description,
|
||||
.task-description {
|
||||
margin-left: 12px;
|
||||
font-size: 13px;
|
||||
color: var(--ant-color-text-secondary);
|
||||
}
|
||||
|
||||
.task-description {
|
||||
display: block;
|
||||
margin-top: 4px;
|
||||
margin-left: 0;
|
||||
}
|
||||
|
||||
.cancel-button {
|
||||
border: 1px solid var(--ant-color-border);
|
||||
background: var(--ant-color-bg-container);
|
||||
color: var(--ant-color-text);
|
||||
}
|
||||
|
||||
.cancel-button:hover {
|
||||
border-color: var(--ant-color-primary);
|
||||
color: var(--ant-color-primary);
|
||||
}
|
||||
|
||||
.save-button {
|
||||
background: var(--ant-color-primary);
|
||||
border-color: var(--ant-color-primary);
|
||||
}
|
||||
|
||||
.save-button:hover {
|
||||
background: var(--ant-color-primary-hover);
|
||||
border-color: var(--ant-color-primary-hover);
|
||||
}
|
||||
|
||||
/* 表单标签样式 */
|
||||
.form-label {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 6px;
|
||||
font-weight: 500;
|
||||
color: var(--ant-color-text);
|
||||
}
|
||||
|
||||
.help-icon {
|
||||
font-size: 14px;
|
||||
color: var(--ant-color-text-tertiary);
|
||||
cursor: help;
|
||||
transition: color 0.3s ease;
|
||||
}
|
||||
|
||||
.help-icon:hover {
|
||||
color: var(--ant-color-primary);
|
||||
}
|
||||
|
||||
/* 响应式设计 */
|
||||
@media (max-width: 768px) {
|
||||
.user-edit-container {
|
||||
padding: 16px;
|
||||
}
|
||||
|
||||
.user-edit-header {
|
||||
flex-direction: column;
|
||||
gap: 16px;
|
||||
align-items: stretch;
|
||||
}
|
||||
|
||||
.header-title h1 {
|
||||
font-size: 24px;
|
||||
}
|
||||
|
||||
.user-edit-content {
|
||||
max-width: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
.float-button {
|
||||
width: 60px;
|
||||
height: 60px;
|
||||
}
|
||||
</style>
|
||||
1344
frontend/src/views/MAAUserEdit.vue
Normal file
1344
frontend/src/views/MAAUserEdit.vue
Normal file
File diff suppressed because it is too large
Load Diff
@@ -1266,6 +1266,24 @@ const loadScriptInfo = async () => {
|
||||
scriptName.value = script.name
|
||||
scriptType.value = script.type // 设置脚本类型
|
||||
|
||||
// 根据脚本类型重定向到对应的专用页面
|
||||
if (script.type === 'MAA') {
|
||||
if (isEdit.value) {
|
||||
router.replace(`/scripts/${scriptId}/users/${userId}/edit/maa`)
|
||||
} else {
|
||||
router.replace(`/scripts/${scriptId}/users/add/maa`)
|
||||
}
|
||||
return
|
||||
} else if (script.type === 'General') {
|
||||
if (isEdit.value) {
|
||||
router.replace(`/scripts/${scriptId}/users/${userId}/edit/general`)
|
||||
} else {
|
||||
router.replace(`/scripts/${scriptId}/users/add/general`)
|
||||
}
|
||||
return
|
||||
}
|
||||
|
||||
// 如果脚本类型未知,继续使用原有逻辑(向后兼容)
|
||||
// 重新初始化表单数据(根据脚本类型)
|
||||
const defaultData =
|
||||
scriptType.value === 'MAA' ? getDefaultMAAUserData() : getDefaultGeneralUserData()
|
||||
|
||||
Reference in New Issue
Block a user