12 changed files with 766 additions and 22 deletions
@ -0,0 +1,350 @@ |
|||
<template> |
|||
<div class="carousel-draft-container"> |
|||
<div class="search-panel"> |
|||
<el-form :model="searchForm" inline> |
|||
<el-form-item label="标题:"> |
|||
<el-input |
|||
v-model="searchForm.title" |
|||
placeholder="请输入关键字" |
|||
class="search-input" |
|||
clearable |
|||
@keyup.enter="handleSearch" |
|||
/> |
|||
</el-form-item> |
|||
|
|||
<el-form-item label="保存时间:"> |
|||
<el-date-picker |
|||
v-model="searchForm.timeRange" |
|||
type="datetimerange" |
|||
range-separator="至" |
|||
start-placeholder="开始时间" |
|||
end-placeholder="结束时间" |
|||
class="date-picker publish-time-picker" |
|||
format="YYYY-MM-DD HH:mm:ss" |
|||
value-format="YYYY-MM-DD HH:mm:ss" |
|||
/> |
|||
</el-form-item> |
|||
|
|||
<el-form-item label="内容发布在:"> |
|||
<el-select v-model="searchForm.targetPlatform" placeholder="请选择" class="search-select" clearable> |
|||
<el-option v-for="item in platformOptions" :key="item.value" :label="item.label" :value="item.value" /> |
|||
</el-select> |
|||
</el-form-item> |
|||
|
|||
<el-form-item> |
|||
<el-button type="primary" :icon="Search" @click="handleSearch" :loading="loading">搜索</el-button> |
|||
</el-form-item> |
|||
|
|||
<el-form-item> |
|||
<el-button :icon="Refresh" @click="handleReset">重置</el-button> |
|||
</el-form-item> |
|||
</el-form> |
|||
</div> |
|||
|
|||
<div class="action-bar"> |
|||
<div class="action-left"> |
|||
<el-button type="primary" :icon="Plus" @click="handleAdd">新增</el-button> |
|||
<el-button type="danger" :icon="Delete" @click="handleBatchDelete" :disabled="selectedRows.length === 0"> |
|||
删除 |
|||
</el-button> |
|||
<el-button @click="handleBack">返回</el-button> |
|||
</div> |
|||
</div> |
|||
|
|||
<div class="table-container"> |
|||
<el-table |
|||
v-loading="loading" |
|||
:data="tableData" |
|||
border |
|||
:header-cell-style="{ backgroundColor: '#f5f7fa', fontWeight: 'bold' }" |
|||
@selection-change="handleSelectionChange" |
|||
> |
|||
<el-table-column type="selection" width="55" /> |
|||
<el-table-column prop="title" label="标题" min-width="200" show-overflow-tooltip /> |
|||
<el-table-column label="保存时间" width="180"> |
|||
<template #default="scope"> |
|||
{{ scope.row.createTime || scope.row.updateTime || '-' }} |
|||
</template> |
|||
</el-table-column> |
|||
<el-table-column prop="targetPlatformLabel" label="内容发布在" width="150" show-overflow-tooltip /> |
|||
<el-table-column label="橱窗" width="120"> |
|||
<template #default="scope"> |
|||
{{ formatCarouselPosition(scope.row.carouselPosition) }} |
|||
</template> |
|||
</el-table-column> |
|||
<el-table-column label="操作" width="160" fixed="right"> |
|||
<template #default="scope"> |
|||
<el-button size="small" type="text" @click="handleEdit(scope.row)">编辑</el-button> |
|||
<el-button size="small" type="text" class="delete-btn" @click="handleDelete(scope.row)">删除</el-button> |
|||
</template> |
|||
</el-table-column> |
|||
</el-table> |
|||
</div> |
|||
|
|||
<div class="pagination-container"> |
|||
<span class="total-text">共 {{ total }} 条数据</span> |
|||
<el-pagination |
|||
v-model:current-page="currentPage" |
|||
v-model:page-size="pageSize" |
|||
:total="total" |
|||
:page-sizes="[10, 20, 50, 100]" |
|||
layout="prev, pager, next, jumper, ->, total, sizes" |
|||
@size-change="handleSizeChange" |
|||
@current-change="handleCurrentChange" |
|||
/> |
|||
</div> |
|||
</div> |
|||
</template> |
|||
|
|||
<script setup lang="ts"> |
|||
import { getCurrentInstance, onActivated, onMounted, reactive, ref } from 'vue'; |
|||
import type { ComponentInternalInstance } from 'vue'; |
|||
import { ElMessage, ElMessageBox } from 'element-plus'; |
|||
import { Plus, Delete, Search, Refresh } from '@element-plus/icons-vue'; |
|||
import { useRouter } from 'vue-router'; |
|||
import { listCarouselBanner, removeCarouselBanner, type CarouselBannerVo } from '@/api/supervision/carouselBanner'; |
|||
import { getDicts } from '@/api/system/dict/data'; |
|||
import { useUserStore } from '@/store/modules/user'; |
|||
|
|||
const router = useRouter(); |
|||
const userStore = useUserStore(); |
|||
const { proxy } = getCurrentInstance() as ComponentInternalInstance; |
|||
|
|||
const loading = ref(false); |
|||
const tableData = ref<CarouselBannerVo[]>([]); |
|||
const total = ref(0); |
|||
const currentPage = ref(1); |
|||
const pageSize = ref(10); |
|||
const selectedRows = ref<CarouselBannerVo[]>([]); |
|||
const platformOptions = ref<{ label: string; value: number }[]>([]); |
|||
|
|||
const searchForm = reactive({ |
|||
title: '', |
|||
timeRange: [] as string[], |
|||
targetPlatform: undefined as number | undefined |
|||
}); |
|||
|
|||
const formatCarouselPosition = (value?: number) => { |
|||
if (value === undefined || value === null) return '-'; |
|||
return `橱窗${value}`; |
|||
}; |
|||
|
|||
const getList = async () => { |
|||
loading.value = true; |
|||
try { |
|||
const res: any = await listCarouselBanner({ |
|||
title: searchForm.title || undefined, |
|||
targetPlatform: searchForm.targetPlatform, |
|||
status: 1, |
|||
createBy: userStore.userId ? Number(userStore.userId) : undefined, |
|||
startTime: searchForm.timeRange[0] || undefined, |
|||
endTime: searchForm.timeRange[1] || undefined, |
|||
pageNum: currentPage.value, |
|||
pageSize: pageSize.value |
|||
}); |
|||
if (res.code === 200) { |
|||
tableData.value = res.rows || []; |
|||
total.value = res.total || 0; |
|||
} else { |
|||
ElMessage.error(res.msg || '获取数据失败'); |
|||
} |
|||
} catch (error) { |
|||
console.error('获取草稿列表失败:', error); |
|||
ElMessage.error('获取数据失败,请检查网络连接'); |
|||
} finally { |
|||
loading.value = false; |
|||
} |
|||
}; |
|||
|
|||
const handleSearch = () => { |
|||
currentPage.value = 1; |
|||
getList(); |
|||
}; |
|||
|
|||
const handleReset = () => { |
|||
searchForm.title = ''; |
|||
searchForm.timeRange = []; |
|||
searchForm.targetPlatform = undefined; |
|||
currentPage.value = 1; |
|||
handleSearch(); |
|||
}; |
|||
|
|||
const handleAdd = () => { |
|||
router.push('/supervision/carouselBanner/add'); |
|||
}; |
|||
|
|||
const handleBack = () => { |
|||
proxy?.$tab.closePage(); |
|||
}; |
|||
|
|||
const handleBatchDelete = () => { |
|||
if (selectedRows.value.length === 0) { |
|||
ElMessage.warning('请选择要删除的数据'); |
|||
return; |
|||
} |
|||
ElMessageBox.confirm(`确定要删除选中的 ${selectedRows.value.length} 条草稿吗?`, '提示', { |
|||
confirmButtonText: '确定', |
|||
cancelButtonText: '取消' |
|||
}) |
|||
.then(async () => { |
|||
const ids = selectedRows.value.map((row) => row.id); |
|||
const res: any = await removeCarouselBanner(ids); |
|||
if (res.code === 200) { |
|||
ElMessage.success('批量删除成功'); |
|||
getList(); |
|||
} else { |
|||
ElMessage.error(res.msg || '批量删除失败'); |
|||
} |
|||
}) |
|||
.catch(() => undefined); |
|||
}; |
|||
|
|||
const handleSelectionChange = (selection: CarouselBannerVo[]) => { |
|||
selectedRows.value = selection; |
|||
}; |
|||
|
|||
const handleEdit = (row: CarouselBannerVo) => { |
|||
router.push(`/supervision/carouselBanner/edit/${row.id}`); |
|||
}; |
|||
|
|||
const handleDelete = async (row: CarouselBannerVo) => { |
|||
try { |
|||
await ElMessageBox.confirm('确定要删除这条草稿吗?', '提示', { |
|||
confirmButtonText: '确定', |
|||
cancelButtonText: '取消' |
|||
}); |
|||
const res: any = await removeCarouselBanner([row.id]); |
|||
if (res.code === 200) { |
|||
ElMessage.success('删除成功'); |
|||
getList(); |
|||
} else { |
|||
ElMessage.error(res.msg || '删除失败'); |
|||
} |
|||
} catch (error: any) { |
|||
if (error !== 'cancel') { |
|||
ElMessage.error('删除失败,请重试'); |
|||
} |
|||
} |
|||
}; |
|||
|
|||
const handleSizeChange = (val: number) => { |
|||
pageSize.value = val; |
|||
currentPage.value = 1; |
|||
getList(); |
|||
}; |
|||
|
|||
const handleCurrentChange = (val: number) => { |
|||
currentPage.value = val; |
|||
getList(); |
|||
}; |
|||
|
|||
const loadDictOptions = async () => { |
|||
try { |
|||
const platformRes = await getDicts('web_publishing_platform'); |
|||
const platformDict = (platformRes.data || []) |
|||
.map((item: any) => ({ |
|||
label: item.dictLabel, |
|||
value: Number(item.dictValue) |
|||
})) |
|||
.filter((item) => !Number.isNaN(item.value) && item.value !== 1); |
|||
platformOptions.value = platformDict.length > 0 ? platformDict : [ |
|||
{ label: '公众端', value: 0 }, |
|||
{ label: '执法端', value: 2 }, |
|||
{ label: '企业端', value: 3 } |
|||
]; |
|||
} catch (error) { |
|||
console.error('加载字典失败:', error); |
|||
} |
|||
}; |
|||
|
|||
onMounted(() => { |
|||
loadDictOptions(); |
|||
getList(); |
|||
}); |
|||
|
|||
onActivated(() => { |
|||
getList(); |
|||
}); |
|||
</script> |
|||
|
|||
<style scoped> |
|||
.carousel-draft-container { |
|||
padding: 20px; |
|||
background: #f5f7fa; |
|||
min-height: calc(100vh - 100px); |
|||
} |
|||
|
|||
.search-panel { |
|||
background: #fff; |
|||
padding: 16px 20px; |
|||
border-radius: 8px; |
|||
margin-bottom: 16px; |
|||
box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1); |
|||
} |
|||
|
|||
:deep(.el-form-item__label) { |
|||
white-space: nowrap; |
|||
margin-right: 8px; |
|||
} |
|||
|
|||
.search-input, |
|||
.date-picker, |
|||
.search-select { |
|||
width: 126px; |
|||
} |
|||
|
|||
:deep(.publish-time-picker) { |
|||
width: 200px; |
|||
} |
|||
|
|||
.action-bar { |
|||
display: flex; |
|||
justify-content: space-between; |
|||
align-items: center; |
|||
background: #fff; |
|||
padding: 12px 20px; |
|||
border-radius: 8px; |
|||
margin-bottom: 16px; |
|||
box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1); |
|||
} |
|||
|
|||
.action-left { |
|||
display: flex; |
|||
gap: 8px; |
|||
} |
|||
|
|||
.table-container { |
|||
background: #fff; |
|||
border-radius: 8px; |
|||
padding: 16px; |
|||
box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1); |
|||
margin-bottom: 16px; |
|||
} |
|||
|
|||
.pagination-container { |
|||
display: flex; |
|||
justify-content: space-between; |
|||
align-items: center; |
|||
background: #fff; |
|||
padding: 12px 20px; |
|||
border-radius: 8px; |
|||
box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1); |
|||
} |
|||
|
|||
.total-text { |
|||
color: #909399; |
|||
} |
|||
|
|||
:deep(.el-button--text) { |
|||
padding: 4px 8px; |
|||
} |
|||
|
|||
:deep(.delete-btn) { |
|||
color: #f56c6c; |
|||
} |
|||
|
|||
:deep(.delete-btn:hover) { |
|||
color: #f56c6c; |
|||
background: rgba(245, 108, 108, 0.1); |
|||
} |
|||
</style> |
|||
@ -0,0 +1,325 @@ |
|||
<template> |
|||
<div class="notice-draft-container"> |
|||
<div class="search-panel"> |
|||
<el-form :model="searchForm" inline> |
|||
<el-form-item label="公告内容:"> |
|||
<el-input |
|||
v-model="searchForm.noticeContent" |
|||
placeholder="请输入关键字" |
|||
class="search-input" |
|||
clearable |
|||
@keyup.enter="handleSearch" |
|||
/> |
|||
</el-form-item> |
|||
|
|||
<el-form-item label="保存时间:"> |
|||
<el-date-picker |
|||
v-model="searchForm.timeRange" |
|||
type="datetimerange" |
|||
range-separator="至" |
|||
start-placeholder="开始时间" |
|||
end-placeholder="结束时间" |
|||
class="date-picker publish-time-picker" |
|||
format="YYYY-MM-DD HH:mm:ss" |
|||
value-format="YYYY-MM-DD HH:mm:ss" |
|||
/> |
|||
</el-form-item> |
|||
|
|||
<el-form-item label="内容发布到:"> |
|||
<el-select v-model="searchForm.targetPlatform" placeholder="请选择" class="search-select" clearable> |
|||
<el-option v-for="item in platformOptions" :key="item.value" :label="item.label" :value="item.value" /> |
|||
</el-select> |
|||
</el-form-item> |
|||
|
|||
<el-form-item> |
|||
<el-button type="primary" :icon="Search" @click="handleSearch" :loading="loading">搜索</el-button> |
|||
</el-form-item> |
|||
|
|||
<el-form-item> |
|||
<el-button :icon="Refresh" @click="handleReset">重置</el-button> |
|||
</el-form-item> |
|||
</el-form> |
|||
</div> |
|||
|
|||
<div class="action-bar"> |
|||
<div class="action-left"> |
|||
<el-button type="primary" :icon="Plus" @click="handleAdd">新增</el-button> |
|||
<el-button type="danger" :icon="Delete" @click="handleBatchDelete" :disabled="selectedRows.length === 0"> |
|||
删除 |
|||
</el-button> |
|||
<el-button @click="handleBack">返回</el-button> |
|||
</div> |
|||
</div> |
|||
|
|||
<div class="table-container"> |
|||
<el-table |
|||
v-loading="loading" |
|||
:data="tableData" |
|||
border |
|||
:header-cell-style="{ backgroundColor: '#f5f7fa', fontWeight: 'bold' }" |
|||
@selection-change="handleSelectionChange" |
|||
> |
|||
<el-table-column type="selection" width="55" /> |
|||
<el-table-column prop="noticeContent" label="公告内容" min-width="250" show-overflow-tooltip /> |
|||
<el-table-column label="保存时间" width="180"> |
|||
<template #default="scope"> |
|||
{{ scope.row.createTime || scope.row.updateTime || '-' }} |
|||
</template> |
|||
</el-table-column> |
|||
<el-table-column prop="targetPlatformLabel" label="内容发布到" width="140" show-overflow-tooltip /> |
|||
<el-table-column label="操作" width="160" fixed="right"> |
|||
<template #default="scope"> |
|||
<el-button size="small" type="text" @click="handleEdit(scope.row)">编辑</el-button> |
|||
<el-button size="small" type="text" class="delete-btn" @click="handleDelete(scope.row)">删除</el-button> |
|||
</template> |
|||
</el-table-column> |
|||
</el-table> |
|||
</div> |
|||
|
|||
<div class="pagination-container"> |
|||
<span class="total-text">共 {{ total }} 条数据</span> |
|||
<el-pagination |
|||
v-model:current-page="currentPage" |
|||
v-model:page-size="pageSize" |
|||
:total="total" |
|||
:page-sizes="[10, 20, 50, 100]" |
|||
layout="prev, pager, next, jumper, ->, total, sizes" |
|||
@size-change="handleSizeChange" |
|||
@current-change="handleCurrentChange" |
|||
/> |
|||
</div> |
|||
</div> |
|||
</template> |
|||
|
|||
<script setup lang="ts"> |
|||
import { getCurrentInstance, onActivated, onMounted, reactive, ref } from 'vue'; |
|||
import type { ComponentInternalInstance } from 'vue'; |
|||
import { ElMessage, ElMessageBox } from 'element-plus'; |
|||
import { Plus, Delete, Search, Refresh } from '@element-plus/icons-vue'; |
|||
import { useRouter } from 'vue-router'; |
|||
import { listNoticeInfo, removeNoticeInfo, type NoticeInfoVo } from '@/api/supervision/noticeInfo'; |
|||
import { useUserStore } from '@/store/modules/user'; |
|||
|
|||
const router = useRouter(); |
|||
const userStore = useUserStore(); |
|||
const { proxy } = getCurrentInstance() as ComponentInternalInstance; |
|||
|
|||
const loading = ref(false); |
|||
const tableData = ref<NoticeInfoVo[]>([]); |
|||
const total = ref(0); |
|||
const currentPage = ref(1); |
|||
const pageSize = ref(10); |
|||
const selectedRows = ref<NoticeInfoVo[]>([]); |
|||
|
|||
const platformOptions = [ |
|||
{ label: '企业端+执法端', value: 0 }, |
|||
{ label: '企业端', value: 1 }, |
|||
{ label: '执法端', value: 2 }, |
|||
{ label: '监督端', value: 3 } |
|||
]; |
|||
|
|||
const searchForm = reactive({ |
|||
noticeContent: '', |
|||
timeRange: [] as string[], |
|||
targetPlatform: undefined as number | undefined |
|||
}); |
|||
|
|||
const getList = async () => { |
|||
loading.value = true; |
|||
try { |
|||
const res: any = await listNoticeInfo({ |
|||
noticeContent: searchForm.noticeContent || undefined, |
|||
targetPlatform: searchForm.targetPlatform, |
|||
status: 1, |
|||
createBy: userStore.userId ? Number(userStore.userId) : undefined, |
|||
startTime: searchForm.timeRange[0] || undefined, |
|||
endTime: searchForm.timeRange[1] || undefined, |
|||
pageNum: currentPage.value, |
|||
pageSize: pageSize.value |
|||
}); |
|||
if (res.code === 200) { |
|||
tableData.value = res.rows || []; |
|||
total.value = res.total || 0; |
|||
} else { |
|||
ElMessage.error(res.msg || '获取数据失败'); |
|||
} |
|||
} catch (error) { |
|||
console.error('获取草稿列表失败:', error); |
|||
ElMessage.error('获取数据失败,请检查网络连接'); |
|||
} finally { |
|||
loading.value = false; |
|||
} |
|||
}; |
|||
|
|||
const handleSearch = () => { |
|||
currentPage.value = 1; |
|||
getList(); |
|||
}; |
|||
|
|||
const handleReset = () => { |
|||
searchForm.noticeContent = ''; |
|||
searchForm.timeRange = []; |
|||
searchForm.targetPlatform = undefined; |
|||
currentPage.value = 1; |
|||
handleSearch(); |
|||
}; |
|||
|
|||
const handleAdd = () => { |
|||
router.push('/supervision/noticeInfo/add'); |
|||
}; |
|||
|
|||
const handleBack = () => { |
|||
proxy?.$tab.closePage(); |
|||
}; |
|||
|
|||
const handleBatchDelete = () => { |
|||
if (selectedRows.value.length === 0) { |
|||
ElMessage.warning('请选择要删除的数据'); |
|||
return; |
|||
} |
|||
ElMessageBox.confirm(`确定要删除选中的 ${selectedRows.value.length} 条草稿吗?`, '提示', { |
|||
confirmButtonText: '确定', |
|||
cancelButtonText: '取消' |
|||
}) |
|||
.then(async () => { |
|||
const ids = selectedRows.value.map((row) => row.id); |
|||
const res: any = await removeNoticeInfo(ids); |
|||
if (res.code === 200) { |
|||
ElMessage.success('批量删除成功'); |
|||
getList(); |
|||
} else { |
|||
ElMessage.error(res.msg || '批量删除失败'); |
|||
} |
|||
}) |
|||
.catch(() => undefined); |
|||
}; |
|||
|
|||
const handleSelectionChange = (selection: NoticeInfoVo[]) => { |
|||
selectedRows.value = selection; |
|||
}; |
|||
|
|||
const handleEdit = (row: NoticeInfoVo) => { |
|||
router.push(`/supervision/noticeInfo/edit/${row.id}`); |
|||
}; |
|||
|
|||
const handleDelete = async (row: NoticeInfoVo) => { |
|||
try { |
|||
await ElMessageBox.confirm('确定要删除这条草稿吗?', '提示', { |
|||
confirmButtonText: '确定', |
|||
cancelButtonText: '取消' |
|||
}); |
|||
const res: any = await removeNoticeInfo([row.id]); |
|||
if (res.code === 200) { |
|||
ElMessage.success('删除成功'); |
|||
getList(); |
|||
} else { |
|||
ElMessage.error(res.msg || '删除失败'); |
|||
} |
|||
} catch (error: any) { |
|||
if (error !== 'cancel') { |
|||
ElMessage.error('删除失败,请重试'); |
|||
} |
|||
} |
|||
}; |
|||
|
|||
const handleSizeChange = (val: number) => { |
|||
pageSize.value = val; |
|||
currentPage.value = 1; |
|||
getList(); |
|||
}; |
|||
|
|||
const handleCurrentChange = (val: number) => { |
|||
currentPage.value = val; |
|||
getList(); |
|||
}; |
|||
|
|||
onMounted(() => { |
|||
getList(); |
|||
}); |
|||
|
|||
onActivated(() => { |
|||
getList(); |
|||
}); |
|||
</script> |
|||
|
|||
<style scoped> |
|||
.notice-draft-container { |
|||
padding: 20px; |
|||
background: #f5f7fa; |
|||
min-height: calc(100vh - 100px); |
|||
} |
|||
|
|||
.search-panel { |
|||
background: #fff; |
|||
padding: 16px 20px; |
|||
border-radius: 8px; |
|||
margin-bottom: 16px; |
|||
box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1); |
|||
} |
|||
|
|||
:deep(.el-form-item__label) { |
|||
white-space: nowrap; |
|||
margin-right: 8px; |
|||
} |
|||
|
|||
.search-input, |
|||
.date-picker, |
|||
.search-select { |
|||
width: 126px; |
|||
} |
|||
|
|||
:deep(.publish-time-picker) { |
|||
width: 200px; |
|||
} |
|||
|
|||
.action-bar { |
|||
display: flex; |
|||
justify-content: space-between; |
|||
align-items: center; |
|||
background: #fff; |
|||
padding: 12px 20px; |
|||
border-radius: 8px; |
|||
margin-bottom: 16px; |
|||
box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1); |
|||
} |
|||
|
|||
.action-left { |
|||
display: flex; |
|||
gap: 8px; |
|||
} |
|||
|
|||
.table-container { |
|||
background: #fff; |
|||
border-radius: 8px; |
|||
padding: 16px; |
|||
box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1); |
|||
margin-bottom: 16px; |
|||
} |
|||
|
|||
.pagination-container { |
|||
display: flex; |
|||
justify-content: space-between; |
|||
align-items: center; |
|||
background: #fff; |
|||
padding: 12px 20px; |
|||
border-radius: 8px; |
|||
box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1); |
|||
} |
|||
|
|||
.total-text { |
|||
color: #909399; |
|||
} |
|||
|
|||
:deep(.el-button--text) { |
|||
padding: 4px 8px; |
|||
} |
|||
|
|||
:deep(.delete-btn) { |
|||
color: #f56c6c; |
|||
} |
|||
|
|||
:deep(.delete-btn:hover) { |
|||
color: #f56c6c; |
|||
background: rgba(245, 108, 108, 0.1); |
|||
} |
|||
</style> |
|||
Loading…
Reference in new issue