java-mall-admin/src/views/settings/config/seo.vue
2024-11-01 16:24:11 +08:00

1160 lines
36 KiB
Vue
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<template>
<div>
<el-row gutter="24">
<el-col :span="24">
<el-card class="box-card">
<p class="description">
插入的变量必需包括花括号{}当应用范围不支持该变量时该变量将不会在前台显示(变量后边的分隔符也不会显示)留空为系统默认设置SEO自定义支持手写以下是可用SEO变量:
<br />
站点名称 {site_name}站点关键词 {site_meta_keyword}站点描述
{site_meta_description}应用范围全站
<br />
分类名称 {category_name}应用范围文章分类页,
商品或者商品分类页
<br />
{{ __('名称') }}
{name}应用范围团购名称商品名称品牌名称文章标题分类名称,
店铺名称
<br />
关键词 {keyword}应用范围商品关键词文章关键词店铺关键词
<br />
简单描述
{description}应用范围商品描述文章摘要店铺关键词....
</p>
</el-card>
</el-col>
</el-row>
<el-row gutter="24">
<el-col :span="12">
<el-card class="box-card">
<div slot="header" class="clearfix">
<span>{{ __('首页') }}</span>
</div>
<div>
<el-form
ref="homeForm"
label-position="top"
label-width="100px"
:model="homeForm"
:rules="homeRules"
size="medium"
>
<el-form-item label="title" prop="site_title">
<el-input
v-model="homeForm.site_title"
clearable
:placeholder="__('请输入 title')"
:style="{ width: '100%' }"
/>
</el-form-item>
<el-form-item label="keywords" prop="site_keywords">
<el-input
v-model="homeForm.site_keywords"
clearable
:placeholder="__('请输入 keywords')"
:style="{ width: '100%' }"
/>
</el-form-item>
<el-form-item label="description" prop="site_description">
<el-input
v-model="homeForm.site_description"
clearable
:placeholder="__('请输入 description')"
:style="{ width: '100%' }"
/>
</el-form-item>
</el-form>
</div>
<div>
<el-button icon="el-icon-s-tools" type="primary" @click="homeEdit">
{{ __('修改') }}
</el-button>
</div>
</el-card>
</el-col>
<el-col :span="12">
<el-card class="box-card">
<div slot="header" class="clearfix">
<span>{{ __('店铺') }}</span>
</div>
<div>
<el-form
ref="storeForm"
label-position="top"
label-width="100px"
:model="storeForm"
:rules="storeRules"
size="medium"
>
<el-form-item label="title" prop="store_title">
<el-input
v-model="storeForm.store_title"
clearable
:placeholder="__('请输入 title')"
:style="{ width: '100%' }"
/>
</el-form-item>
<el-form-item label="keywords" prop="store_keywords">
<el-input
v-model="storeForm.store_keywords"
clearable
:placeholder="__('请输入 keywords')"
:style="{ width: '100%' }"
/>
</el-form-item>
<el-form-item label="description" prop="store_description">
<el-input
v-model="storeForm.store_description"
clearable
:placeholder="__('请输入 description')"
:style="{ width: '100%' }"
/>
</el-form-item>
</el-form>
</div>
<div>
<el-button icon="el-icon-s-tools" type="primary" @click="storeEdit">
{{ __('修改') }}
</el-button>
</div>
</el-card>
</el-col>
</el-row>
<el-row gutter="24">
<el-col :span="12">
<el-card class="box-card">
<div slot="header" class="clearfix">
<span>{{ __('商品') }}</span>
</div>
<div>
<el-form
ref="productForm"
label-position="top"
label-width="100px"
:model="productForm"
:rules="productRules"
size="medium"
>
<el-form-item label="title" prop="product_title">
<el-input
v-model="productForm.product_title"
clearable
:placeholder="__('请输入 title')"
:style="{ width: '100%' }"
/>
</el-form-item>
<el-form-item label="keywords" prop="product_keywords">
<el-input
v-model="productForm.product_keywords"
clearable
:placeholder="__('请输入 keywords')"
:style="{ width: '100%' }"
/>
</el-form-item>
<el-form-item label="description" prop="product_description">
<el-input
v-model="productForm.product_description"
clearable
:placeholder="__('请输入 description')"
:style="{ width: '100%' }"
/>
</el-form-item>
</el-form>
</div>
<div>
<el-button
icon="el-icon-s-tools"
type="primary"
@click="productEdit"
>
{{ __('修改') }}
</el-button>
</div>
</el-card>
</el-col>
<el-col :span="12">
<el-card class="box-card">
<div slot="header" class="clearfix">
<span>{{ __('分类') }}</span>
</div>
<div>
<el-form
ref="categoryForm"
label-position="top"
label-width="100px"
:model="categoryForm"
:rules="categoryRules"
size="medium"
>
<el-form-item label="title" prop="category_title">
<el-input
v-model="categoryForm.category_title"
clearable
:placeholder="__('请输入 title')"
:style="{ width: '100%' }"
/>
</el-form-item>
<el-form-item label="keywords" prop="category_keywords">
<el-input
v-model="categoryForm.category_keywords"
clearable
:placeholder="__('请输入 keywords')"
:style="{ width: '100%' }"
/>
</el-form-item>
<el-form-item label="description" prop="category_description">
<el-input
v-model="categoryForm.category_description"
clearable
:placeholder="__('请输入 description')"
:style="{ width: '100%' }"
/>
</el-form-item>
</el-form>
</div>
<div>
<el-button
icon="el-icon-s-tools"
type="primary"
@click="categoryEdit"
>
{{ __('修改') }}
</el-button>
</div>
</el-card>
</el-col>
</el-row>
<el-row gutter="24">
<el-col :span="12">
<el-card class="box-card">
<div slot="header" class="clearfix">
<span>{{ __('品牌') }}</span>
</div>
<div>
<el-form
ref="brandForm"
label-position="top"
label-width="100px"
:model="brandForm"
:rules="brandRules"
size="medium"
>
<el-form-item label="title" prop="brand_title">
<el-input
v-model="brandForm.brand_title"
clearable
:placeholder="__('请输入 title')"
:style="{ width: '100%' }"
/>
</el-form-item>
<el-form-item label="keywords" prop="brand_keywords">
<el-input
v-model="brandForm.brand_keywords"
clearable
:placeholder="__('请输入 keywords')"
:style="{ width: '100%' }"
/>
</el-form-item>
<el-form-item label="description" prop="brand_description">
<el-input
v-model="brandForm.brand_description"
clearable
:placeholder="__('请输入 description')"
:style="{ width: '100%' }"
/>
</el-form-item>
</el-form>
</div>
<div>
<el-button icon="el-icon-s-tools" type="primary" @click="brandEdit">
{{ __('修改') }}
</el-button>
</div>
</el-card>
</el-col>
<el-col :span="12">
<el-card class="box-card">
<div slot="header" class="clearfix">
<span>SNS</span>
</div>
<div>
<el-form
ref="snsForm"
label-position="top"
label-width="100px"
:model="snsForm"
:rules="snsRules"
size="medium"
>
<el-form-item label="title" prop="sns_title">
<el-input
v-model="snsForm.sns_title"
clearable
:placeholder="__('请输入 title')"
:style="{ width: '100%' }"
/>
</el-form-item>
<el-form-item label="keywords" prop="sns_keywords">
<el-input
v-model="snsForm.sns_keywords"
clearable
:placeholder="__('请输入 keywords')"
:style="{ width: '100%' }"
/>
</el-form-item>
<el-form-item label="description" prop="sns_description">
<el-input
v-model="snsForm.sns_description"
clearable
:placeholder="__('请输入 description')"
:style="{ width: '100%' }"
/>
</el-form-item>
</el-form>
</div>
<div>
<el-button icon="el-icon-s-tools" type="primary" @click="snsEdit">
{{ __('修改') }}
</el-button>
</div>
</el-card>
</el-col>
</el-row>
<el-row gutter="24">
<el-col :span="12">
<el-card class="box-card">
<div slot="header" class="clearfix">
<span>{{ __('文章') }}</span>
</div>
<div>
<el-form
ref="articleForm"
label-position="top"
label-width="100px"
:model="articleForm"
:rules="articleRules"
size="medium"
>
<el-form-item label="title" prop="article_title">
<el-input
v-model="articleForm.article_title"
clearable
:placeholder="__('请输入 title')"
:style="{ width: '100%' }"
/>
</el-form-item>
<el-form-item label="keywords" prop="article_keywords">
<el-input
v-model="articleForm.article_keywords"
clearable
:placeholder="__('请输入 keywords')"
:style="{ width: '100%' }"
/>
</el-form-item>
<el-form-item label="description" prop="article_description">
<el-input
v-model="articleForm.article_description"
clearable
:placeholder="__('请输入 description')"
:style="{ width: '100%' }"
/>
</el-form-item>
<el-form-item
:label="__('文章内容 title')"
prop="article_content_title"
>
<el-input
v-model="articleForm.article_content_title"
clearable
:placeholder="__('请输入文章内容 title')"
:style="{ width: '100%' }"
/>
</el-form-item>
<el-form-item
:label="__('文章内容 keywords')"
prop="article_content_keywords"
>
<el-input
v-model="articleForm.article_content_keywords"
clearable
:placeholder="__('请输入文章内容 keywords')"
:style="{ width: '100%' }"
/>
</el-form-item>
<el-form-item
:label="__('文章内容 description')"
prop="article_content_description"
>
<el-input
v-model="articleForm.article_content_description"
clearable
:placeholder="__('请输入文章内容 description')"
:style="{ width: '100%' }"
/>
</el-form-item>
</el-form>
</div>
<div>
<el-button
icon="el-icon-s-tools"
type="primary"
@click="articleEdit"
>
{{ __('修改') }}
</el-button>
</div>
</el-card>
</el-col>
<el-col :span="12">
<el-card class="box-card">
<div slot="header" class="clearfix">
<span>{{ __('团购') }}</span>
</div>
<div>
<el-form
ref="gbForm"
label-position="top"
label-width="100px"
:model="gbForm"
:rules="gbRules"
size="medium"
>
<el-form-item label="title" prop="gb_title">
<el-input
v-model="gbForm.gb_title"
clearable
:placeholder="__('请输入 title')"
:style="{ width: '100%' }"
/>
</el-form-item>
<el-form-item label="keywords" prop="gb_keywords">
<el-input
v-model="gbForm.gb_keywords"
clearable
:placeholder="__('请输入 keywords')"
:style="{ width: '100%' }"
/>
</el-form-item>
<el-form-item label="description" prop="gb_description">
<el-input
v-model="gbForm.gb_description"
clearable
:placeholder="__('请输入 description')"
:style="{ width: '100%' }"
/>
</el-form-item>
<el-form-item
:label="__('团购内容 title')"
prop="gb_content_title"
>
<el-input
v-model="gbForm.gb_content_title"
clearable
:placeholder="__('请输入团购内容 title')"
:style="{ width: '100%' }"
/>
</el-form-item>
<el-form-item
:label="__('团购内容 keywords')"
prop="gb_content_keywords"
>
<el-input
v-model="gbForm.gb_content_keywords"
clearable
:placeholder="__('请输入团购内容 keywords')"
:style="{ width: '100%' }"
/>
</el-form-item>
<el-form-item
:label="__('团购内容 description')"
prop="gb_content_description"
>
<el-input
v-model="gbForm.gb_content_description"
clearable
:placeholder="__('请输入团购内容 description')"
:style="{ width: '100%' }"
/>
</el-form-item>
</el-form>
</div>
<div>
<el-button icon="el-icon-s-tools" type="primary" @click="gbEdit">
{{ __('修改') }}
</el-button>
</div>
</el-card>
</el-col>
</el-row>
<el-row gutter="24">
<el-col :span="24">
<div>
<el-card class="box-card">
<div slot="header" class="clearfix">
<span>{{ __('积分') }}</span>
</div>
<div>
<el-form
ref="pointForm"
label-position="top"
label-width="100px"
:model="pointForm"
:rules="pointRules"
size="medium"
>
<el-form-item label="title" prop="point_title">
<el-input
v-model="pointForm.point_title"
clearable
:placeholder="__('请输入 title')"
:style="{ width: '100%' }"
/>
</el-form-item>
<el-form-item label="keywords" prop="point_keywords">
<el-input
v-model="pointForm.point_keywords"
clearable
:placeholder="__('请输入 keywords')"
:style="{ width: '100%' }"
/>
</el-form-item>
<el-form-item label="description" prop="point_description">
<el-input
v-model="pointForm.point_description"
clearable
:placeholder="__('请输入 description')"
:style="{ width: '100%' }"
/>
</el-form-item>
<el-form-item
:label="__('积分中心内容 title')"
prop="point_content_title"
>
<el-input
v-model="pointForm.point_content_title"
clearable
:placeholder="__('请输入积分中心内容 title')"
:style="{ width: '100%' }"
/>
</el-form-item>
<el-form-item
:label="__('积分中心内容 keywords')"
prop="point_content_keywords"
>
<el-input
v-model="pointForm.point_content_keywords"
clearable
:placeholder="__('请输入积分中心内容 keywords')"
:style="{ width: '100%' }"
/>
</el-form-item>
<el-form-item
:label="__('积分中心内容 description')"
prop="point_content_description"
>
<el-input
v-model="pointForm.point_content_description"
clearable
:placeholder="__('请输入积分中心内容 description')"
:style="{ width: '100%' }"
/>
</el-form-item>
</el-form>
</div>
<div>
<el-button
icon="el-icon-s-tools"
type="primary"
@click="pointEdit"
>
修改
</el-button>
</div>
</el-card>
</div>
</el-col>
</el-row>
</div>
</template>
<script>
import { translateTitle as __ } from '@/utils/i18n'
import { getList, doEdit } from '@/api/base/config'
export default {
name: 'Seo',
components: {},
data() {
return {
homeForm: {
site_title: undefined,
site_keywords: undefined,
site_description: undefined,
},
homeRules: {
site_title: [
{
required: true,
message: '请输入 title',
trigger: 'blur',
},
],
site_keywords: [
{
required: true,
message: '请输入 keywords',
trigger: 'blur',
},
],
site_description: [
{
required: true,
message: '请输入 description',
trigger: 'blur',
},
],
},
storeForm: {
store_title: undefined,
store_keywords: undefined,
store_description: undefined,
},
storeRules: {
store_title: [
{
required: true,
message: '请输入 title',
trigger: 'blur',
},
],
store_keywords: [
{
required: true,
message: '请输入 keywords',
trigger: 'blur',
},
],
store_description: [
{
required: true,
message: '请输入 description',
trigger: 'blur',
},
],
},
productForm: {
product_title: undefined,
product_keywords: undefined,
product_description: undefined,
},
productRules: {
product_title: [
{
required: true,
message: '请输入 title',
trigger: 'blur',
},
],
product_keywords: [
{
required: true,
message: '请输入 keywords',
trigger: 'blur',
},
],
product_description: [
{
required: true,
message: '请输入 description',
trigger: 'blur',
},
],
},
categoryForm: {
category_title: undefined,
category_keywords: undefined,
category_description: undefined,
},
categoryRules: {
category_title: [
{
required: true,
message: '请输入 title',
trigger: 'blur',
},
],
category_keywords: [
{
required: true,
message: '请输入 keywords',
trigger: 'blur',
},
],
category_description: [
{
required: true,
message: '请输入 description',
trigger: 'blur',
},
],
},
brandForm: {
brand_title: undefined,
brand_keywords: undefined,
brand_description: undefined,
},
brandRules: {
brand_title: [
{
required: true,
message: '请输入 title',
trigger: 'blur',
},
],
brand_keywords: [
{
required: true,
message: '请输入 keywords',
trigger: 'blur',
},
],
brand_description: [
{
required: true,
message: '请输入 description',
trigger: 'blur',
},
],
},
snsForm: {
sns_title: undefined,
sns_keywords: undefined,
sns_description: undefined,
},
snsRules: {
sns_title: [
{
required: true,
message: '请输入 title',
trigger: 'blur',
},
],
sns_keywords: [
{
required: true,
message: '请输入 keywords',
trigger: 'blur',
},
],
sns_description: [
{
required: true,
message: '请输入 description',
trigger: 'blur',
},
],
},
articleForm: {
article_title: undefined,
article_keywords: undefined,
article_description: undefined,
article_content_title: undefined,
article_content_keywords: undefined,
article_content_description: undefined,
},
articleRules: {
article_title: [
{
required: true,
message: '请输入 title',
trigger: 'blur',
},
],
article_keywords: [
{
required: true,
message: '请输入 keywords',
trigger: 'blur',
},
],
article_description: [
{
required: true,
message: '请输入 description',
trigger: 'blur',
},
],
article_content_title: [
{
required: true,
message: '请输入文章内容 title',
trigger: 'blur',
},
],
article_content_keywords: [
{
required: true,
message: '请输入文章内容 keywords',
trigger: 'blur',
},
],
article_content_description: [
{
required: true,
message: '请输入文章内容 description',
trigger: 'blur',
},
],
},
gbForm: {
gb_title: undefined,
gb_keywords: undefined,
gb_description: undefined,
gb_content_title: undefined,
gb_content_keywords: undefined,
gb_content_description: undefined,
},
gbRules: {
gb_title: [
{
required: true,
message: '请输入 title',
trigger: 'blur',
},
],
gb_keywords: [
{
required: true,
message: '请输入 keywords',
trigger: 'blur',
},
],
gb_description: [
{
required: true,
message: '请输入 description',
trigger: 'blur',
},
],
gb_content_title: [
{
required: true,
message: '请输入团购内容 title',
trigger: 'blur',
},
],
gb_content_keywords: [
{
required: true,
message: '请输入团购内容 keywords',
trigger: 'blur',
},
],
gb_content_description: [
{
required: true,
message: '请输入团购内容 description',
trigger: 'blur',
},
],
},
pointForm: {
point_title: undefined,
point_keywords: undefined,
point_description: undefined,
point_content_title: undefined,
point_content_keywords: undefined,
point_content_description: undefined,
},
pointRules: {
point_title: [
{
required: true,
message: '请输入 title',
trigger: 'blur',
},
],
point_keywords: [
{
required: true,
message: '请输入 keywords',
trigger: 'blur',
},
],
point_description: [
{
required: true,
message: '请输入 description',
trigger: 'blur',
},
],
point_content_title: [
{
required: true,
message: '请输入积分中心内容 title',
trigger: 'blur',
},
],
point_content_keywords: [
{
required: true,
message: '请输入积分中心内容 keywords',
trigger: 'blur',
},
],
point_content_description: [
{
required: true,
message: '请输入积分中心内容 description',
trigger: 'blur',
},
],
},
}
},
created() {
this.fetchData()
},
methods: {
__,
async fetchData() {
const { data } = await getList()
this.homeFormInit(data)
this.storeFormInit(data)
this.productFormInit(data)
this.categoryFormInit(data)
this.brandFormInit(data)
this.snsFormInit(data)
this.articleFormInit(data)
this.gbFormInit(data)
this.pointFormInit(data)
},
homeFormInit(data) {
this.homeForm = {
site_title: data.site_title,
site_keywords: data.site_keywords,
site_description: data.site_description,
}
},
storeFormInit(data) {
this.storeForm = {
store_title: data.store_title,
store_keywords: data.store_keywords,
store_description: data.store_description,
}
},
productFormInit(data) {
this.productForm = {
product_title: data.product_title,
product_keywords: data.product_keywords,
product_description: data.product_description,
}
},
categoryFormInit(data) {
this.categoryForm = {
category_title: data.category_title,
category_keywords: data.category_keywords,
category_description: data.category_description,
}
},
brandFormInit(data) {
this.brandForm = {
brand_title: data.brand_title,
brand_keywords: data.brand_keywords,
brand_description: data.brand_description,
}
},
snsFormInit(data) {
this.snsForm = {
sns_title: data.sns_title,
sns_keywords: data.sns_keywords,
sns_description: data.sns_description,
}
},
gbFormInit(data) {
this.gbForm = {
gb_title: data.gb_title,
gb_keywords: data.gb_keywords,
gb_description: data.gb_description,
gb_content_title: data.gb_content_title,
gb_content_keywords: data.gb_content_keywords,
gb_content_description: data.gb_content_description,
}
},
articleFormInit(data) {
this.articleForm = {
article_title: data.article_title,
article_keywords: data.article_keywords,
article_description: data.article_description,
article_content_title: data.article_content_title,
article_content_keywords: data.article_content_keywords,
article_content_description: data.article_content_description,
}
},
pointFormInit(data) {
this.pointForm = {
point_title: data.point_title,
point_keywords: data.point_keywords,
point_description: data.point_description,
point_content_title: data.point_content_title,
point_content_keywords: data.point_content_keywords,
point_content_description: data.point_content_description,
}
},
homeEdit() {
this.$refs['homeForm'].validate(async (valid) => {
if (valid) {
const { msg, status } = await doEdit({
param: JSON.stringify(this.homeForm),
})
if (status == 200) {
this.$baseMessage(msg, 'success')
} else {
this.$baseMessage(msg, 'error')
}
} else {
return false
}
})
},
storeEdit() {
this.$refs['storeForm'].validate(async (valid) => {
if (valid) {
const { msg, status } = await doEdit({
param: JSON.stringify(this.storeForm),
})
if (status == 200) {
this.$baseMessage(msg, 'success')
} else {
this.$baseMessage(msg, 'error')
}
} else {
return false
}
})
},
productEdit() {
this.$refs['productForm'].validate(async (valid) => {
if (valid) {
const { msg, status } = await doEdit({
param: JSON.stringify(this.productForm),
})
if (status == 200) {
this.$baseMessage(msg, 'success')
} else {
this.$baseMessage(msg, 'error')
}
} else {
return false
}
})
},
categoryEdit() {
this.$refs['categoryForm'].validate(async (valid) => {
if (valid) {
const { msg, status } = await doEdit({
param: JSON.stringify(this.categoryForm),
})
if (status == 200) {
this.$baseMessage(msg, 'success')
} else {
this.$baseMessage(msg, 'error')
}
} else {
return false
}
})
},
brandEdit() {
this.$refs['brandForm'].validate(async (valid) => {
if (valid) {
const { msg, status } = await doEdit({
param: JSON.stringify(this.brandForm),
})
if (status == 200) {
this.$baseMessage(msg, 'success')
} else {
this.$baseMessage(msg, 'error')
}
} else {
return false
}
})
},
snsEdit() {
this.$refs['snsForm'].validate(async (valid) => {
if (valid) {
const { msg, status } = await doEdit({
param: JSON.stringify(this.snsForm),
})
if (status == 200) {
this.$baseMessage(msg, 'success')
} else {
this.$baseMessage(msg, 'error')
}
} else {
return false
}
})
},
articleEdit() {
this.$refs['articleForm'].validate(async (valid) => {
if (valid) {
const { msg, status } = await doEdit({
param: JSON.stringify(this.articleForm),
})
if (status == 200) {
this.$baseMessage(msg, 'success')
} else {
this.$baseMessage(msg, 'error')
}
} else {
return false
}
})
},
gbEdit() {
this.$refs['gbForm'].validate(async (valid) => {
if (valid) {
const { msg, status } = await doEdit({
param: JSON.stringify(this.gbForm),
})
if (status == 200) {
this.$baseMessage(msg, 'success')
} else {
this.$baseMessage(msg, 'error')
}
} else {
return false
}
})
},
pointEdit() {
this.$refs['pointForm'].validate(async (valid) => {
if (valid) {
const { msg, status } = await doEdit({
param: JSON.stringify(this.pointForm),
})
if (status == 200) {
this.$baseMessage(msg, 'success')
} else {
this.$baseMessage(msg, 'error')
}
} else {
return false
}
})
},
},
}
</script>