Files
yusheng-admin/src/views/system/themeManage/form.vue

87 lines
3.0 KiB
Vue
Raw Normal View History

2025-08-11 11:11:49 +08:00
<script setup lang="ts">
import { ref } from "vue";
import { message } from "@/utils/message";
import { getToken } from "@/utils/auth";
const ruleFormRef = ref();
const formRules = ref({
is_active: [
{ required: true, message: "请选择使用状态", trigger: "change" }
],
theme_color: [
{ required: true, message: "请选择主题色", trigger: "change" }
],
auxiliary_color: [
{ required: true, message: "请选择辅助色值", trigger: "change" }
],
2025-08-12 15:57:28 +08:00
file_url: [{ required: true, message: "请输入文件地址", trigger: "blur" }],
times: [
{ required: true, message: "请选择有效期", trigger: "change" }
],
2025-08-11 11:11:49 +08:00
theme_name: [{ required: true, message: "请输入主题名称", trigger: "blur" }],
});
const props = defineProps(["formInline"]);
const newFormInline = ref(
props.formInline
? props.formInline
: {
theme_name: "",
theme_color: "",
auxiliary_color: "",
file_url: "",
2025-08-12 15:57:28 +08:00
is_active: 0,
times: []
2025-08-11 11:11:49 +08:00
}
);
function getRef() {
return ruleFormRef.value;
}
function chanageEditorValue(val) {
newFormInline.value.content = val
}
2025-08-12 15:57:28 +08:00
function onExceed() {
2025-08-11 11:11:49 +08:00
message("最多上传1个文件请先删除在上传");
};
2025-08-12 15:57:28 +08:00
function handleFileSuccess({ data, code }, file, fileList) {
2025-08-11 11:11:49 +08:00
// console.log(file)
// console.log(fileList)
// debugger
if (code) {
fileList.value = fileList.map(ele => { return ele.response.data.url })
// console.log(fileList.value)
newFormInline.value.file_url = fileList.value.join(',')
} else {
fileList.value = []
newFormInline.value.file_url = fileList.value.join(',')
}
}
defineExpose({ getRef });
</script>
<template>
<el-form ref="ruleFormRef" :model="newFormInline" :rules="formRules" label-width="120px">
<el-form-item label="主题名称" prop="theme_name">
<el-input v-model="newFormInline.theme_name" placeholder="请输入主题名称"></el-input>
</el-form-item>
<el-form-item label="主题色色值" prop="theme_color">
<el-color-picker v-model="newFormInline.theme_color"></el-color-picker>
</el-form-item>
<el-form-item label="辅助色值" prop="auxiliary_color">
<el-color-picker v-model="newFormInline.auxiliary_color"></el-color-picker>
</el-form-item>
<el-form-item label="文件地址" prop="file_url">
2025-08-12 15:57:28 +08:00
<el-input v-model="newFormInline.file_url" placeholder="请输入文件地址"></el-input>
</el-form-item>
<el-form-item label="有效期" prop="times">
<el-date-picker format="YYYY-MM-DD" value-format="YYYY-MM-DD" v-model="newFormInline.times" type="daterange"
range-separator="至" start-placeholder="开始日期" end-placeholder="结束日期">
</el-date-picker>
2025-08-11 11:11:49 +08:00
</el-form-item>
<el-form-item label="使用状态" prop="is_active">
<el-radio-group v-model="newFormInline.is_active">
<el-radio label="暂不使用" :value="0" />
<el-radio label="使用" :value="1" />
</el-radio-group>
</el-form-item>
</el-form>
</template>