geekai/new-ui/projects/admin/src/views/User/UserForm.vue

114 lines
3.2 KiB
Vue

<template>
<a-form ref="formRef" :model="form" :style="{ width: '600px' }" @submit="handleSubmit">
<a-form-item
field="username"
label="账号"
:rules="[{ required: true, message: '请输入账号' }]"
:validate-trigger="['change', 'input']"
>
<a-input v-model="form.username" placeholder="请输入账号" />
</a-form-item>
<a-form-item
v-if="!props.data.id"
field="password"
label="密码"
:rules="[{ required: true, message: '请输入密码' }]"
:validate-trigger="['change', 'input']"
showable
>
<a-input v-model="form.password" placeholder="请输入密码" />
</a-form-item>
<a-form-item
field="calls"
label="对话次数"
:rules="[{ required: true, message: '请输入对话次数' }]"
>
<a-input-number v-model="form.calls" placeholder="请输入对话次数" />
</a-form-item>
<a-form-item
field="img_calls"
label="绘图次数"
:rules="[{ required: true, message: '请输入绘图次数' }]"
>
<a-input-number v-model="form.img_calls" placeholder="请输入绘图次数" />
</a-form-item>
<a-form-item field="expired_time" label="有效期">
<a-date-picker v-model="form.expired_time" placeholder="请选择有效期" />
</a-form-item>
<a-form-item field="chat_roles" label="聊天角色">
<a-select
:field-names="{ value: 'key', label: 'name' }"
v-model="form.chat_roles"
placeholder="请选择聊天角色"
multiple
:options="roleOption"
:rules="[{ required: true, message: '请选择聊天角色' }]"
>
</a-select>
</a-form-item>
<a-form-item field="chat_models" label="模型角色">
<a-select
:field-names="{ value: 'value', label: 'name' }"
v-model="form.chat_models"
placeholder="请选择模型角色"
multiple
:options="modalOption"
:rules="[{ required: true, message: '请选择模型角色' }]"
>
</a-select>
</a-form-item>
<a-form-item field="status" label="启用状态">
<a-switch v-model="form.status" />
</a-form-item>
<a-form-item field="vip" label="开通VIP">
<a-switch v-model="form.vip" />
</a-form-item>
</a-form>
</template>
<script setup>
import { ref, defineExpose, defineProps } from "vue";
import { dateFormat } from "@chatgpt-plus/packages/utils";
import { getModel, getRole } from "./api";
const props = defineProps({
data: {},
});
const formRef = ref();
const form = ref({
username: "",
password: "",
calls: "",
img_calls: "",
expired_time: "",
chat_roles: [],
chat_models: [],
status: false,
vip: false,
});
if (props.data?.id) {
form.value = Object.assign({}, props.data);
form.value.expired_time = !form.value.expired_time
? undefined
: dateFormat(form.value.expired_time);
}
//拿选项
const modalOption = ref([]);
const roleOption = ref([]);
const getOption = (api, container) => {
api().then(({ code, data }) => {
if (code === 0) {
container.value = data;
}
});
};
getOption(getModel, modalOption);
getOption(getRole, roleOption);
defineExpose({
formRef,
form,
});
</script>