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>
|