97 lines
2.8 KiB
Vue
97 lines
2.8 KiB
Vue
<template>
|
|
<section class="introPage">
|
|
<ai-detail :list="!edit">
|
|
<ai-title slot="title" title="引导页配置" isShowBottomBorder isShowBack @onBackClick="$router.push({})">
|
|
<template #rightBtn>
|
|
<ai-edit-btn @edit="edit=true,getConfigs()" @cancel="edit=false" @submit="submit"/>
|
|
</template>
|
|
</ai-title>
|
|
<template #content>
|
|
<el-form v-if="edit" :model="form" ref="IntroForm" size="small" :rules="rules" label-width="120px">
|
|
<ai-card title="基本信息">
|
|
<template #content>
|
|
<el-form-item label="副标题" prop="subtitle">
|
|
<el-input v-model="form.subtitle" clearable placeholder="请输入"/>
|
|
</el-form-item>
|
|
<el-form-item label="操作示例链接" prop="operationExamples">
|
|
<el-input v-model="form.operationExamples" clearable placeholder="请输入"/>
|
|
</el-form-item>
|
|
</template>
|
|
</ai-card>
|
|
<ai-card title="引导内容">
|
|
<template #content>
|
|
<el-form-item label-width="0" prop="guideContent">
|
|
<ai-editor :instance="instance" v-model="form.guideContent" placeholder="请输入" action="/oms/api/file/add" :params="{withoutToken:true}"/>
|
|
</el-form-item>
|
|
</template>
|
|
</ai-card>
|
|
</el-form>
|
|
<ai-intro v-else :id="$route.query.id" v-bind="$props"/>
|
|
</template>
|
|
</ai-detail>
|
|
</section>
|
|
</template>
|
|
|
|
<script>
|
|
import AiEditBtn from "../../components/AiEditBtn";
|
|
|
|
export default {
|
|
name: "introPage",
|
|
components: {AiEditBtn},
|
|
props: {
|
|
instance: Function,
|
|
dict: {default: () => ({})}
|
|
},
|
|
data() {
|
|
return {
|
|
form: {},
|
|
rules: {
|
|
subtitle: {required: true, message: "请输入副标题"},
|
|
guideContent: {required: true, message: "请输入引导内容"},
|
|
},
|
|
edit: false
|
|
}
|
|
},
|
|
methods: {
|
|
getConfigs() {
|
|
const {id} = this.$route.query
|
|
this.instance.post("/admin/sysappguideconfig/queryDetailById", null, {
|
|
params: {id}
|
|
}).then(res => {
|
|
if (res?.data) {
|
|
this.form = res.data
|
|
}
|
|
})
|
|
},
|
|
submit(cb) {
|
|
this.$refs.IntroForm.validate(v => {
|
|
if (v) {
|
|
const {form, $route: {query: {id}}} = this
|
|
this.instance.post("/admin/sysappguideconfig/addOrUpdate", {...form, id}).then(res => {
|
|
if (res?.code == 0) {
|
|
this.$message.success("提交成功!")
|
|
cb()
|
|
this.edit = false
|
|
}
|
|
})
|
|
}
|
|
})
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
.introPage {
|
|
height: 100%;
|
|
|
|
::v-deep.ai-detail__content--wrapper {
|
|
min-height: 100%;
|
|
|
|
&.list {
|
|
padding-top: 0;
|
|
}
|
|
}
|
|
}
|
|
</style>
|