index.vue
3.1 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
<template>
<div class="basicSetup">
<el-card>
<template #header>
<div class="card-header">
<span>基本设置</span>
</div>
</template>
<el-form
ref="basicFormRef"
:model="basicForm"
style="max-width: 500px"
:rules="rules"
label-width="auto"
>
<el-form-item label="站点名称" prop="webname">
<el-input v-model="basicForm.webname" placeholder="请输入站点名称" />
</el-form-item>
<el-form-item label="网站首页" prop="webtitle">
<el-input v-model="basicForm.webtitle" placeholder="请输入网站首页" />
</el-form-item>
<el-form-item label="网站域名" prop="webkeywords">
<el-input
v-model="basicForm.webkeywords"
placeholder="请输入网站域名"
/>
</el-form-item>
<el-form-item label="网站简介" prop="webdescription">
<el-input
v-model="basicForm.webdescription"
placeholder="请输入网站简介"
/>
</el-form-item>
<el-form-item label="滚动公告" prop="rollingAnnouncements">
<el-input
v-model="basicForm.rollingAnnouncements"
placeholder="请输入滚动公告"
/>
</el-form-item>
<el-form-item label="底部公告" prop="bottomAnnouncement">
<el-input
v-model="basicForm.bottomAnnouncement"
placeholder="请输入底部公告"
/>
</el-form-item>
</el-form>
<template #footer
><el-button type="primary" @click="submitForm"
>保存</el-button
></template
>
</el-card>
</div>
</template>
<script setup>
import { ref, getCurrentInstance, onMounted } from "vue";
import {
getBasicInfo,
updateBasicInfo,
addBasicInfo,
} from "@/api/system/basicSetup";
const { proxy } = getCurrentInstance();
const basicFormRef = ref(null);
const basicForm = ref({
bottomAnnouncement: "",
rollingAnnouncements: "",
webdescription: "",
webkeywords: "",
webname: "",
webtitle: "",
});
const rules = {
webname: [
{ required: true, message: "请输入站点名称", trigger: "blur" },
{ min: 2, max: 20, message: "长度在 2 到 20 个字符", trigger: "blur" },
],
webtitle: [
{ required: true, message: "请输入网站首页", trigger: "blur" },
{ min: 2, max: 20, message: "长度在 2 到 20 个 " },
],
};
function submitForm() {
basicFormRef.value.validate(async (valid) => {
if (valid) {
if (basicForm.value.id) {
await updateBasicInfo(basicForm.value);
getBasicInfo();
proxy.$modal.msgSuccess("修改成功");
} else {
await addBasicInfo(basicForm.value);
getBasicInfo();
proxy.$modal.msgSuccess("新增成功");
}
} else {
proxy.$modal.msgSuccess("请填写必填项");
}
});
}
function getInfo() {
getBasicInfo().then((response) => {
if (response.data) {
basicForm.value = response.data;
}
});
}
onMounted(() => {
getInfo();
});
</script>
<style lang="scss" scoped>
.basicSetup {
padding: 30px;
}
</style>