作者 xiaoqiu

增加了首页内容

不能预览此文件类型
<template>
<div class="app-container home">首页</div>
<div class="app-container">
<el-form
:model="queryParams"
ref="queryRef"
v-show="showSearch"
:inline="true"
label-width="68px"
>
<el-form-item label="站点名称" prop="name">
<el-input
v-model="queryParams.name"
placeholder="请输入站点名称"
clearable
style="width: 240px"
@keyup.enter="handleQuery"
/>
</el-form-item>
<el-form-item label="域名" prop="domainName">
<el-input
v-model="queryParams.domainName"
placeholder="请输入域名"
clearable
style="width: 240px"
@keyup.enter="handleQuery"
/>
</el-form-item>
<el-form-item label="生成路径" prop="path">
<el-input
v-model="queryParams.path"
placeholder="生成路径"
clearable
style="width: 240px"
@keyup.enter="handleQuery"
/>
</el-form-item>
<el-form-item label="路由地址" prop="pathPrefix">
<el-input
v-model="queryParams.pathPrefix"
placeholder="请输入路由地址"
clearable
style="width: 240px"
@keyup.enter="handleQuery"
/>
</el-form-item>
<el-form-item label="更新频率" prop="changefreq">
<el-input
v-model="queryParams.changefreq"
placeholder="更新频率"
clearable
style="width: 240px"
@keyup.enter="handleQuery"
/>
</el-form-item>
<el-form-item>
<el-button type="primary" icon="Search" @click="handleQuery"
>搜索</el-button
>
<el-button icon="Refresh" @click="resetQuery">重置</el-button>
</el-form-item>
</el-form>
<el-row :gutter="10" class="mb8">
<el-col :span="1.5">
<el-button
type="primary"
plain
icon="Plus"
@click="handleAdd"
v-hasPermi="['system:role:add']"
>新增</el-button
>
</el-col>
<el-col :span="1.5">
<el-button
type="success"
plain
icon="Edit"
:disabled="single"
@click="handleUpdate"
v-hasPermi="['system:role:edit']"
>修改</el-button
>
</el-col>
<el-col :span="1.5">
<el-button
type="danger"
plain
icon="Delete"
:disabled="multiple"
@click="handleDelete"
v-hasPermi="['system:role:remove']"
>删除</el-button
>
</el-col>
<el-col :span="1.5">
<el-button
type="warning"
plain
icon="Download"
@click="handleExport"
v-hasPermi="['system:role:export']"
>导出</el-button
>
</el-col>
<right-toolbar
v-model:showSearch="showSearch"
@queryTable="getList"
></right-toolbar>
</el-row>
<el-table
v-loading="loading"
:data="generatorList"
@selection-change="handleSelectionChange"
>
<el-table-column type="selection" width="55" align="center" />
<el-table-column label="id" align="center" prop="id" />
<el-table-column label="站点名称" align="center" prop="name" />
<el-table-column label="域名" align="center" prop="domainName" />
<el-table-column label="生成路径" align="center" prop="path" />
<el-table-column label="路由地址" align="center" prop="pathPrefix" />
<el-table-column label="更新频率" align="center" prop="changefreq" />
<el-table-column label="是否有子站点" align="center" prop="sonSitemap">
<template slot-scope="scope">
{{ scope.row.sonSitemap }}
</template>
</el-table-column>
<el-table-column
label="子站点地图生成条件"
align="center"
prop="sonSitemapType"
/>
<el-table-column
label="操作"
align="center"
class-name="small-padding fixed-width"
>
<template slot-scope="scope">
<el-button
size="mini"
type="text"
icon="el-icon-edit"
@click="handleUpdate(scope.row)"
v-hasPermi="['system:generator:edit']"
>修改</el-button
>
<el-button
size="mini"
type="text"
icon="el-icon-delete"
@click="handleDelete(scope.row)"
v-hasPermi="['system:generator:remove']"
>删除</el-button
>
</template>
</el-table-column>
</el-table>
<pagination
v-show="total > 0"
:total="total"
:page.sync="queryParams.pageNum"
:limit.sync="queryParams.pageSize"
@pagination="getList"
/>
<!-- 添加或修改【请填写功能名称】对话框 -->
<el-dialog :title="title" :visible.sync="open" width="60%" append-to-body>
<el-form ref="form" :model="form" :rules="rules" label-width="auto">
<el-form-item label="站点名称" prop="name">
<el-input v-model="form.name" placeholder="请输入站点名称" />
</el-form-item>
<el-form-item label="域名" prop="domainName">
<el-input
v-model="form.domainName"
placeholder="请输入域名 例: http://domain.com"
/>
</el-form-item>
<el-form-item label="生成路径" prop="path">
<el-input v-model="form.path" placeholder="请输入生成路径" />
</el-form-item>
<el-form-item label="文章详情路由地址" prop="pathPrefix">
<el-input
v-model="form.pathPrefix"
placeholder="请输入文章详情路由地址,如:'/detail/info/' 或者 '/' 不加引号"
/>
</el-form-item>
<el-form-item label="更新频率" prop="changefreq">
<el-select v-model="form.changefreq" placeholder="请选择更新频率">
<el-option
v-for="item in sitemapUpdateOptions"
:key="item.value"
:label="item.label"
:value="item.value"
>
</el-option>
</el-select>
</el-form-item>
<el-form-item label="是否有子站点" prop="sonSitemap">
<!-- <el-input v-model="form.sonSitemap" placeholder="请输入是否有子站点" /> -->
<el-switch
v-model="form.sonSitemap"
active-color="#13ce66"
inactive-color="#ff4949"
>
</el-switch>
</el-form-item>
<el-form-item label="站点地图生成条件" prop="sonSitemapType">
<el-radio v-model="form.sonSitemapType" :label="1">分类生成</el-radio>
<el-radio v-model="form.sonSitemapType" :label="2">日期生成</el-radio>
<el-radio v-model="form.sonSitemapType" :label="0">生成全部</el-radio>
</el-form-item>
<el-form-item label="站点地图生成日期" prop="date">
<el-date-picker
v-model="form.date"
type="daterange"
value-format="yyyy-MM-dd"
range-separator="至"
start-placeholder="开始日期"
end-placeholder="结束日期"
>
</el-date-picker>
</el-form-item>
<el-form-item label="新增子站点地图">
<el-form-item
v-for="(sitemap, index) in form.otherSitemap"
:label="'子地图 : ' + (index + 1)"
:key="sitemap.key"
:rules="{
required: true,
message: '数据未填写完整',
trigger: 'blur',
}"
label-width="auto"
style="margin-bottom: 10px"
>
<div style="display: flex">
<el-select v-model="sitemap.otherSitemap" placeholder="站点地图">
<el-option
v-for="item in sitemapOptions"
:disabled="isOptionSelected(sitemap, item.value)"
:key="item.value"
:label="item.label"
:value="item.value"
>
</el-option>
</el-select>
<el-input
v-model="sitemap.otherSitemapPrefix"
style="margin: 0 10px"
placeholder="请输入子路由地址,如:'/detail/info/' 或者 '/' 不加引号"
></el-input>
<el-button
@click.prevent="removeOtherSitmap(sitemap)"
type="danger"
>删除</el-button
>
</div>
</el-form-item>
<el-button @click="addOtherSitmap" type="primary">添加</el-button>
</el-form-item>
<el-form-item label="地图生成示例">
<div class="sitemap">
<p style="margin: 0">文章站点地图示例</p>
<div>
{{ form.domainName
}}{{
form.pathPrefix === "/"
? ""
: form.pathPrefix === ""
? ""
: "" + form.pathPrefix
}}/分类/日期/自定义url
</div>
<div>
{{ form.domainName
}}{{
form.pathPrefix === "/"
? ""
: form.pathPrefix === ""
? ""
: "" + form.pathPrefix
}}/sitemap-article-tinmoinhat.xml
</div>
<div>
{{ form.domainName
}}{{
form.pathPrefix === "/"
? ""
: form.pathPrefix === ""
? ""
: "" + form.pathPrefix
}}/sitemap-article-BongDaVietNam.xml
</div>
<!-- 子路由 -->
<p style="margin: 0">其它站点地图示例</p>
<div v-for="sitemap in form.otherSitemap">
{{ form.domainName
}}{{
sitemap.otherSitemapPrefix === "/"
? ""
: sitemap.otherSitemapPrefix === ""
? ""
: "" + sitemap.otherSitemapPrefix
}}/url
</div>
</div>
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button type="primary" @click="submitForm" :loading="sitemapLoading"
>确 定</el-button
>
<el-button @click="cancel">取 消</el-button>
</div>
</el-dialog>
</div>
</template>
<script setup name="Index">
import { getCurrentInstance } from "vue";
<script setup>
import { ref } from "vue";
const queryForm = ref(null);
// 遮罩层
const loading = ref(false);
// 选中数组
const ids = ref([]);
// 非单个禁用
const single = ref([]);
// 非多个禁用
const multiple = ref(false);
// 显示搜索条件
const showSearch = ref(true);
// 总条数
const total = ref(0);
// 【请填写功能名称】表格数据
const generatorList = ref([]);
// 弹出层标题
const title = ref("");
// 是否显示弹出层
const open = ref(false);
// 查询参数
const queryParams = ref({
pageNum: 1,
pageSize: 10,
name: null,
domainName: null,
path: null,
pathPrefix: null,
changefreq: null,
sonSitemap: true,
sonSitemapType: 0,
});
// 表单参数
const form = ref({
otherSitemap: [],
date: [],
});
// 表单校验
const rules = {
name: [{ required: true, message: "请输入站点名称", trigger: "blur" }],
domainName: [
{ required: true, message: "请输入域名", trigger: "blur" },
{
type: "url",
message: "域名格式输入错误 例: http://domain.com",
trigger: "blur",
},
],
path: [{ required: true, message: "请输入站点路径", trigger: "blur" }],
pathPrefix: [
{
required: true,
message: "请输入文章详情路由地址",
trigger: "blur",
},
],
changefreq: [{ required: true, message: "请选择更新频率", trigger: "blur" }],
date: [{ required: true, message: "请选择生成日期", trigger: "blur" }],
};
// 站点地图选项
const sitemapUpdateOptions = [
{
value: "always",
label: "always 页面内容经常变化,搜索引擎会更频繁地重新抓取",
},
{
value: "hourly",
label: "hourly 页面内容每小时都可能有变化",
},
{
value: "daily",
label: "daily 页面内容每天可能有变化",
},
{
value: "weekly",
label: "weekly 页面内容每周可能有变化",
},
{
value: "monthly",
label: "monthly 页面内容每月可能有变化",
},
{
value: "yearly",
label: "yearly 页面内容每年可能有变化",
},
{
value: "never",
label: "never 表示页面内容几乎不会发生变化,搜索引擎会较少地重新抓取",
},
];
const sitemapOptions = [
{
value: "1",
label: "赛事",
},
{
value: "2",
label: "专家",
},
];
const sitemapUpdateValue = ref(null);
const sitemapLoading = ref(false);
function removeOtherSitmap(item) {
let index = form.value.otherSitemap.indexOf(item);
if (index !== -1) {
form.value.otherSitemap.splice(index, 1);
}
}
function addOtherSitmap() {
form.value.otherSitemap.push({});
}
function isOptionSelected(currentSitemap, optionValue) {
return form.value.otherSitemap.some(
(sitemap) =>
sitemap !== currentSitemap && sitemap.otherSitemap === optionValue
);
}
/** 查询【请填写功能名称】列表 */
function getList() {
loading.value = true;
}
// 取消按钮
function cancel() {
open.value = false;
reset();
}
// 表单重置
function reset() {
form.value = {
id: null,
name: null,
domainName: null,
path: null,
pathPrefix: null,
changefreq: null,
sonSitemap: true,
sonSitemapType: 0,
createBy: null,
createTime: null,
updateBy: null,
updateTime: null,
otherSitemap: [],
};
}
/** 搜索按钮操作 */
function handleQuery() {
queryParams.value.pageNum = 1;
getList();
}
/** 重置按钮操作 */
function resetQuery() {
handleQuery();
}
// 多选框选中数据
function handleSelectionChange(selection) {
ids.value = selection.map((item) => item.id);
single.value = selection.length !== 1;
multiple.value = !selection.length;
}
/** 新增按钮操作 */
function handleAdd() {
reset();
open.value = true;
title.value = "添加";
}
/** 修改按钮操作 */
function handleUpdate(row) {
// this.reset();
const id = row.id || ids.value;
const { proxy } = getCurrentInstance();
form.value = {
// Reset the form object
...row, // Use the spread operator to update all properties
date: [row.startDate, row.endDate], // Update the date
};
// function getGenerator(id).then((response) => {
// console.log(response);
// if (this.form.otherSitemap === null) {
// this.form.otherSitemap = [];
// }
// this.open = true;
// this.title = "修改";
// });
}
/** 提交按钮 */
function submitForm() {}
/** 删除按钮操作 */
function handleDelete(row) {
const ids = row.id || this.ids;
this.$modal
.confirm('是否确认删除编号为"' + ids + '"的数据项?')
.then(function () {
return delGenerator(ids);
})
.then(() => {
this.getList();
this.$modal.msgSuccess("删除成功");
})
.catch(() => {});
}
/** 导出按钮操作 */
function handleExport() {
this.download(
"system/generator/export",
{
...this.queryParams,
},
`generator_${new Date().getTime()}.xlsx`
);
}
</script>
<style>
.sitemap {
background-color: #000000d6;
color: #fff;
padding: 20px;
border-radius: 4px;
}
.sitemap div {
font-size: 16px;
color: greenyellow;
}
</style>
... ...
... ... @@ -2,7 +2,7 @@ import { defineConfig, loadEnv } from 'vite'
import path from 'path'
import createVitePlugins from './vite/plugins'
const baseUrl = 'http://aitoolht.crgx.net' // 后端接口
const baseUrl = 'http://htai.toolsai.cc/' // 后端接口
// https://vitejs.dev/config/
export default defineConfig(({ mode, command }) => {
... ...