Browse Source

优化:同步site产品的文件

dev
科技小王子 6 months ago
parent
commit
851c986d51
  1. 4
      .env.development
  2. 2
      index.html
  3. 168
      src/views/cms/cmsSetting/index.vue
  4. 6
      src/views/cms/cmsWebsite/components/search.vue
  5. 75
      src/views/cms/cmsWebsite/components/websiteEdit.vue
  6. 72
      src/views/cms/cmsWebsite/index.vue
  7. 279
      src/views/cms/cmsWebsiteSetting/components/cmsWebsiteSettingEdit.vue
  8. 42
      src/views/cms/cmsWebsiteSetting/components/search.vue
  9. 305
      src/views/cms/cmsWebsiteSetting/index.vue

4
.env.development

@ -1,10 +1,10 @@
VITE_APP_NAME=后台管理系统 VITE_APP_NAME=后台管理系统
VITE_SOCKET_URL=wss://server.gxwebsoft.com VITE_SOCKET_URL=wss://server.gxwebsoft.com
VITE_SERVER_URL=https://server.gxwebsoft.com/api VITE_SERVER_URL=https://server.gxwebsoft.com/api
#VITE_API_URL=https://cms-api.websoft.top/api
VITE_API_URL=https://cms-api.websoft.top/api
#VITE_SERVER_URL=http://127.0.0.1:8000/api #VITE_SERVER_URL=http://127.0.0.1:8000/api
VITE_API_URL=http://127.0.0.1:9000/api
#VITE_API_URL=http://127.0.0.1:9000/api
#VITE_THINK_URL=http://127.0.0.1:9099/api #VITE_THINK_URL=http://127.0.0.1:9099/api
#/booking/bookingItem #/booking/bookingItem

2
index.html

@ -2,7 +2,7 @@
<html lang="zh"> <html lang="zh">
<head> <head>
<meta charset="UTF-8" /> <meta charset="UTF-8" />
<link rel="icon" href="/favicon2.ico" />
<link rel="icon" href="/favicon.ico" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>网宿软件</title> <title>网宿软件</title>
<style> <style>

168
src/views/cms/cmsSetting/index.vue

@ -0,0 +1,168 @@
<template>
<a-page-header :title="getPageTitle()" @back="() => $router.go(-1)">
<template #extra>
<CmsWebsiteSearch />
</template>
<a-card class="ele-body" :bordered="false" :body-style="{ padding: '16px' }">
<a-form
ref="formRef"
:model="form"
:rules="rules"
:label-col="styleResponsive ? { md: 2, sm: 5, xs: 24 } : { flex: '120px' }"
:wrapper-col="
styleResponsive ? { md: 14, sm: 19, xs: 24 } : { flex: '1' }
"
>
<a-tabs v-model:activeKey="activeKey" type="card">
<a-tab-pane key="setting" tab="网站设置" class="mt-5">
<a-form-item label="悬浮工具栏" name="floatTool" extra="显示网站悬浮客服工具栏">
<a-switch v-model:checked="form.floatTool" checked-children="显示" un-checked-children="隐藏" @change="save" />
</a-form-item>
<a-form-item label="显示站内搜索" name="searchBtn">
<a-switch v-model:checked="form.searchBtn" checked-children="显示" un-checked-children="隐藏" @change="save" />
</a-form-item>
<a-form-item label="启用登录注册" name="loginBtn">
<a-switch v-model:checked="form.loginBtn" checked-children="启用" un-checked-children="不启用" @change="save" />
</a-form-item>
<a-form-item label="默认编辑器" name="editor" extra="设置默认编辑器">
<a-select v-model:value="form.editor" placeholder="请选择编辑器" class="max-w-xs" @change="save">
<a-select-option :value="1">富文本编辑器</a-select-option>
<a-select-option :value="2">Markdown编辑器</a-select-option>
</a-select>
</a-form-item>
</a-tab-pane>
<a-tab-pane key="privacy" tab="隐私与安全" class="mt-5">
<a-form-item label="允许被搜索" name="name" extra="关闭后,用户无法通过名称搜索到此网站">
<a-switch v-model:checked="form.market" checked-children="允许" un-checked-children="不允许" @change="save" />
</a-form-item>
<a-form-item label="文章发布审核" name="articleReview" extra="开启需要审核后发布,关闭则直接发布">
<a-switch v-model:checked="form.articleReview" checked-children="需要" un-checked-children="不需要" @change="save" />
</a-form-item>
<a-form-item label="开发者模式" name="plugin" extra="开启开发者模式">
<a-switch v-model:checked="form.plugin" checked-children="启用" un-checked-children="禁用" @change="save" />
</a-form-item>
</a-tab-pane>
</a-tabs>
</a-form>
</a-card>
</a-page-header>
</template>
<script lang="ts" setup>
import { ref, reactive, watch } from 'vue';
import { Form, message } from 'ant-design-vue';
import { FormInstance } from 'ant-design-vue/es/form';
import {getPageTitle} from "@/utils/common";
import { storeToRefs } from 'pinia';
import { assignObject } from 'ele-admin-pro';
import { ItemType } from 'ele-admin-pro/es/ele-image-upload/types';
import CmsWebsiteSearch from "@/views/cms/cmsWebsite/components/search.vue";
import {useThemeStore} from "@/store/modules/theme";
import router from "@/router";
import {CmsWebsiteSetting} from "@/api/cms/cmsWebsiteSetting/model";
import {getCmsWebsiteSetting, updateCmsWebsiteSetting} from "@/api/cms/cmsWebsiteSetting";
const useForm = Form.useForm;
//
const themeStore = useThemeStore();
const { styleResponsive } = storeToRefs(themeStore);
//
const formRef = ref<FormInstance | null>(null);
//
const loading = ref(true);
const logo = ref<ItemType[]>([]);
const activeKey = ref('setting');
//
const form = reactive<CmsWebsiteSetting>({
id: undefined,
websiteId: undefined,
official: undefined,
market: undefined,
search: undefined,
share: undefined,
articleReview: undefined,
plugin: undefined,
editor: undefined,
searchBtn: undefined,
loginBtn: undefined,
floatTool: undefined,
copyrightLink: undefined,
maxMenuNum: undefined,
deleted: undefined,
tenantId: undefined,
createTime: undefined,
updateTime: undefined,
sortNumber: 100
});
//
const rules = reactive({
websiteName: [
{
required: true,
type: 'string',
message: '请填写网站信息名称',
trigger: 'blur'
}
]
});
/* 查询 */
const query = () => {
loading.value = true;
getCmsWebsiteSetting(Number(localStorage.getItem('WebsiteId'))).then(data => {
assignObject(form, data);
if(data){
assignObject(form,data)
}else {
resetFields()
}
}).catch((msg) => {
console.log(msg)
})
};
const { resetFields } = useForm(form, rules);
/* 保存编辑 */
const save = () => {
if (!formRef.value) {
return;
}
formRef.value
.validate()
.then(() => {
loading.value = true;
const formData = {
...form
};
updateCmsWebsiteSetting(formData)
.then((msg) => {
loading.value = false;
message.success(msg);
})
.catch((e) => {
loading.value = false;
message.error(e.message);
});
})
.catch(() => {});
};
watch(
() => router,
() => {
query()
},
{ immediate: true }
);
</script>
<script lang="ts">
export default {
name: 'CmsWebsiteSetting'
};
</script>
<style lang="less" scoped></style>

6
src/views/cms/cmsWebsite/components/search.vue

@ -35,6 +35,12 @@
>国际化 >国际化
</a-button </a-button
> >
<a-button
type="text"
@click="openUrl('/website/setting')"
>网站设置
</a-button
>
<a-button <a-button
type="text" type="text"
class="ele-btn-icon" class="ele-btn-icon"

75
src/views/cms/cmsWebsite/components/websiteEdit.vue

@ -36,21 +36,21 @@
v-model:value="form.websiteName" v-model:value="form.websiteName"
/> />
</a-form-item> </a-form-item>
<a-form-item label="赠送域名" name="websiteCode">
<a-form-item label="二级域名" name="websiteCode">
<a-input <a-input
v-model:value="form.websiteCode" v-model:value="form.websiteCode"
placeholder="huawei"
placeholder="yourname"
addon-before="https://" addon-before="https://"
addon-after=".wsdns.cn" addon-after=".wsdns.cn"
/> />
</a-form-item> </a-form-item>
<a-form-item label="顶级域名" name="domain">
<a-input
v-model:value="form.domain"
placeholder="huawei.com"
addon-before="https://"
/>
</a-form-item>
<!-- <a-form-item label="顶级域名" name="domain">-->
<!-- <a-input-->
<!-- v-model:value="form.domain"-->
<!-- placeholder="huawei.com"-->
<!-- addon-before="https://"-->
<!-- />-->
<!-- </a-form-item>-->
<a-form-item label="网站描述" name="comments"> <a-form-item label="网站描述" name="comments">
<a-textarea <a-textarea
:rows="4" :rows="4"
@ -59,22 +59,31 @@
v-model:value="form.comments" v-model:value="form.comments"
/> />
</a-form-item> </a-form-item>
<!-- <a-form-item label="SEO关键词" name="keywords">-->
<!-- <a-textarea-->
<!-- :rows="4"-->
<!-- :maxlength="200"-->
<!-- placeholder="请输入SEO关键词"-->
<!-- v-model:value="form.keywords"-->
<!-- />-->
<!-- </a-form-item>-->
<a-form-item label="全局样式" name="style">
<a-form-item label="SEO关键词" name="keywords">
<a-textarea <a-textarea
:rows="4" :rows="4"
:maxlength="200" :maxlength="200"
placeholder="全局样式"
v-model:value="form.style"
placeholder="请输入SEO关键词"
v-model:value="form.keywords"
/> />
</a-form-item> </a-form-item>
<!-- <a-form-item label="全局样式" name="style">-->
<!-- <a-textarea-->
<!-- :rows="4"-->
<!-- :maxlength="200"-->
<!-- placeholder="全局样式"-->
<!-- v-model:value="form.style"-->
<!-- />-->
<!-- </a-form-item>-->
<!-- <a-form-item :label="`网站截图`" name="files">-->
<!-- <SelectFile-->
<!-- :placeholder="`请上传网站预览图`"-->
<!-- :limit="6"-->
<!-- :data="files"-->
<!-- @done="chooseFile"-->
<!-- @del="onDeleteFile"-->
<!-- />-->
<!-- </a-form-item>-->
<!-- <a-form-item label="网站类型" name="websiteType">--> <!-- <a-form-item label="网站类型" name="websiteType">-->
<!-- <a-select--> <!-- <a-select-->
<!-- :options="websiteType"--> <!-- :options="websiteType"-->
@ -153,6 +162,7 @@
const images = ref<ItemType[]>([]); const images = ref<ItemType[]>([]);
const websiteQrcode = ref<ItemType[]>([]); const websiteQrcode = ref<ItemType[]>([]);
const oldDomain = ref(); const oldDomain = ref();
const files = ref<ItemType[]>([]);
// //
const form = reactive<CmsWebsite>({ const form = reactive<CmsWebsite>({
@ -160,6 +170,7 @@
websiteLogo: undefined, websiteLogo: undefined,
websiteName: undefined, websiteName: undefined,
websiteCode: undefined, websiteCode: undefined,
files: undefined,
keywords: '', keywords: '',
prefix: '', prefix: '',
domain: '', domain: '',
@ -289,6 +300,18 @@
form.websiteLogo = ''; form.websiteLogo = '';
}; };
const chooseFile = (data: FileRecord) => {
files.value.push({
uid: data.id,
url: data.url,
status: 'done'
});
};
const onDeleteFile = (index: number) => {
files.value.splice(index, 1);
};
// const onWebsiteType = (text: string) => { // const onWebsiteType = (text: string) => {
// form.websiteType = text; // form.websiteType = text;
// }; // };
@ -309,13 +332,17 @@
updateVisible(false); updateVisible(false);
message.loading('创建过程中请勿刷新页面!',0) message.loading('创建过程中请勿刷新页面!',0)
} }
saveOrUpdate(form)
const formData = {
...form,
files: JSON.stringify(files.value),
};
saveOrUpdate(formData)
.then((msg) => { .then((msg) => {
loading.value = false; loading.value = false;
updateVisible(false); updateVisible(false);
updateCmsDomain({ updateCmsDomain({
websiteId: form.websiteId, websiteId: form.websiteId,
domain: `${form.websiteCode}.wsdns.cn`
domain: `${localStorage.getItem('TenantId')}.wsdns.cn`
}); });
localStorage.setItem('Domain', `${form.websiteCode}.wsdns.cn`); localStorage.setItem('Domain', `${form.websiteCode}.wsdns.cn`);
localStorage.setItem('WebsiteId', `${form.websiteId}`); localStorage.setItem('WebsiteId', `${form.websiteId}`);
@ -338,6 +365,7 @@
(visible) => { (visible) => {
if (visible) { if (visible) {
images.value = []; images.value = [];
files.value = [];
websiteQrcode.value = []; websiteQrcode.value = [];
if (props.data?.websiteId) { if (props.data?.websiteId) {
assignObject(form, props.data); assignObject(form, props.data);
@ -348,6 +376,9 @@
status: 'done' status: 'done'
}); });
} }
if (props.data.files) {
files.value = JSON.parse(props.data.files);
}
if (props.data.websiteCode) { if (props.data.websiteCode) {
oldDomain.value = props.data.websiteCode; oldDomain.value = props.data.websiteCode;
} }

72
src/views/cms/cmsWebsite/index.vue

@ -28,26 +28,24 @@
<span v-if="record.type === 40">其他</span> <span v-if="record.type === 40">其他</span>
</template> </template>
<template v-if="column.key === 'domain'"> <template v-if="column.key === 'domain'">
<a-button
v-if="record.domain"
type="link"
@click="openSpmUrl(`https://${record.domain}`, record)"
<a-space direction="vertical">
<a
v-if="domain"
:href="`https://${domain}`"
class="text-gray-500 hover:text-blue-500"
target="_blank"
> >
{{ record.domain }}
</a-button>
<a-button
type="link"
v-if="!record.domain"
@click="
openSpmUrl(
`https://${record.websiteCode}.wsdns.cn`,
record,
record.websiteId
)
"
{{ domain }}
</a>
<a
v-if="record.websiteCode"
:href="`https://${record.websiteCode}.wsdns.cn`"
class="text-gray-500 hover:text-blue-500"
target="_blank"
> >
{{ record.websiteCode ? `${record.websiteCode}.wsdns.cn` : '' }}
</a-button>
{{ `${record.websiteCode}.wsdns.cn` }}
</a>
</a-space>
</template> </template>
<template v-if="column.key === 'type'"> <template v-if="column.key === 'type'">
<a-tag v-if="record.type === 1" color="green"></a-tag> <a-tag v-if="record.type === 1" color="green"></a-tag>
@ -60,7 +58,7 @@
> >
</template> </template>
<template v-if="column.key === 'version'"> <template v-if="column.key === 'version'">
<span v-if="record.version === 10">标准</span>
<span v-if="record.version === 10">基础</span>
<span v-if="record.version === 20">专业版</span> <span v-if="record.version === 20">专业版</span>
<span v-if="record.version === 30">永久授权</span> <span v-if="record.version === 30">永久授权</span>
</template> </template>
@ -82,15 +80,13 @@
<a-tag v-if="record.status > 0 && record.soon < 0" color="orange">即将过期</a-tag> <a-tag v-if="record.status > 0 && record.soon < 0" color="orange">即将过期</a-tag>
</template> </template>
<template v-if="column.key === 'action'"> <template v-if="column.key === 'action'">
<a-space>
<a @click="onShare(record)"> <a @click="onShare(record)">
<QrcodeOutlined/>
<MobileOutlined/> 手机版
</a> </a>
<a-divider type="vertical"/> <a-divider type="vertical"/>
<a @click="openEdit(record)"> <a @click="openEdit(record)">
<EditOutlined/>
编辑
</a> </a>
</a-space>
</template> </template>
</template> </template>
<template #emptyText> <template #emptyText>
@ -125,7 +121,7 @@
<script lang="ts" setup> <script lang="ts" setup>
import {createVNode, ref} from 'vue'; import {createVNode, ref} from 'vue';
import {message, Modal} from 'ant-design-vue'; import {message, Modal} from 'ant-design-vue';
import {ExclamationCircleOutlined, QrcodeOutlined, EditOutlined} from '@ant-design/icons-vue';
import {ExclamationCircleOutlined, QrcodeOutlined,MobileOutlined, EditOutlined} from '@ant-design/icons-vue';
import type {EleProTable} from 'ele-admin-pro'; import type {EleProTable} from 'ele-admin-pro';
import {toDateString} from 'ele-admin-pro'; import {toDateString} from 'ele-admin-pro';
import type { import type {
@ -141,11 +137,12 @@ import {
updateCmsWebsite updateCmsWebsite
} from '@/api/cms/cmsWebsite'; } from '@/api/cms/cmsWebsite';
import type {CmsWebsite, CmsWebsiteParam} from '@/api/cms/cmsWebsite/model'; import type {CmsWebsite, CmsWebsiteParam} from '@/api/cms/cmsWebsite/model';
import {getPageTitle, openSpmUrl} from '@/utils/common';
import {getPageTitle} from '@/utils/common';
import {PageResult} from '@/api'; import {PageResult} from '@/api';
import {pageOrderGoods} from "@/api/system/orderGoods"; import {pageOrderGoods} from "@/api/system/orderGoods";
import {OrderGoods} from "@/api/system/orderGoods/model"; import {OrderGoods} from "@/api/system/orderGoods/model";
import CmsWebsiteSearch from "@/views/cms/cmsWebsite/components/search.vue"; import CmsWebsiteSearch from "@/views/cms/cmsWebsite/components/search.vue";
import {getAuthorizedDomain} from "@/api/cms/cmsDomain";
// //
const tableRef = ref<InstanceType<typeof EleProTable> | null>(null); const tableRef = ref<InstanceType<typeof EleProTable> | null>(null);
@ -166,8 +163,10 @@ const qrcode = ref();
const loading = ref(true); const loading = ref(true);
// //
const website = ref<CmsWebsite>(); const website = ref<CmsWebsite>();
//
//
const orderGoods = ref<OrderGoods>(); const orderGoods = ref<OrderGoods>();
//
const domain = ref<string>();
// //
const datasource: DatasourceFunction = ({ const datasource: DatasourceFunction = ({
@ -188,12 +187,12 @@ const datasource: DatasourceFunction = ({
const columns = ref<ColumnItem[]>([ const columns = ref<ColumnItem[]>([
{ {
title: 'ID', title: 'ID',
dataIndex: 'tenantId',
key: 'tenantId',
dataIndex: 'websiteId',
key: 'websiteId',
width: 90 width: 90
}, },
{ {
title: '应用名称',
title: '网站名称',
dataIndex: 'websiteName', dataIndex: 'websiteName',
key: 'websiteName' key: 'websiteName'
}, },
@ -204,13 +203,13 @@ const columns = ref<ColumnItem[]>([
align: 'center' align: 'center'
}, },
{ {
title: '应用描述',
title: '网站描述',
dataIndex: 'comments', dataIndex: 'comments',
key: 'comments', key: 'comments',
hideInTable: true hideInTable: true
}, },
{ {
title: '访问地址',
title: '访问域名',
dataIndex: 'domain', dataIndex: 'domain',
key: 'domain', key: 'domain',
align: 'center' align: 'center'
@ -281,6 +280,9 @@ const updateType = (row: CmsWebsite) => {
const onShare = (row?: CmsWebsite) => { const onShare = (row?: CmsWebsite) => {
qrcode.value = `https://${row?.websiteCode}.wsdns.cn` qrcode.value = `https://${row?.websiteCode}.wsdns.cn`
if(localStorage.getItem('Domain')){
qrcode.value = `https://${localStorage.getItem('Domain')}`
}
showQrcode.value = true; showQrcode.value = true;
} }
@ -339,6 +341,14 @@ const query = () => {
orderGoods.value = res?.list[0]; orderGoods.value = res?.list[0];
} }
}) })
//
if(localStorage.getItem('Domain')){
getAuthorizedDomain().then((data) => {
if(data){
domain.value = data.domain;
}
})
}
}; };
/* 自定义行属性 */ /* 自定义行属性 */

279
src/views/cms/cmsWebsiteSetting/components/cmsWebsiteSettingEdit.vue

@ -0,0 +1,279 @@
<!-- 编辑弹窗 -->
<template>
<ele-modal
:width="800"
:visible="visible"
:maskClosable="false"
:maxable="maxable"
:title="isUpdate ? '编辑网站设置' : '添加网站设置'"
:body-style="{ paddingBottom: '28px' }"
@update:visible="updateVisible"
@ok="save"
>
<a-form
ref="formRef"
:model="form"
:rules="rules"
:label-col="styleResponsive ? { md: 4, sm: 5, xs: 24 } : { flex: '90px' }"
:wrapper-col="
styleResponsive ? { md: 19, sm: 19, xs: 24 } : { flex: '1' }
"
>
<a-form-item label="关联网站ID" name="websiteId">
<a-input
allow-clear
placeholder="请输入关联网站ID"
v-model:value="form.websiteId"
/>
</a-form-item>
<a-form-item label="是否官方插件" name="official">
<a-input
allow-clear
placeholder="请输入是否官方插件"
v-model:value="form.official"
/>
</a-form-item>
<a-form-item label="是否展示在插件市场" name="market">
<a-input
allow-clear
placeholder="请输入是否展示在插件市场"
v-model:value="form.market"
/>
</a-form-item>
<a-form-item label="是否允许被搜索" name="search">
<a-input
allow-clear
placeholder="请输入是否允许被搜索"
v-model:value="form.search"
/>
</a-form-item>
<a-form-item label="是否共享" name="share">
<a-input
allow-clear
placeholder="请输入是否共享"
v-model:value="form.share"
/>
</a-form-item>
<a-form-item label="是否插件 0应用1 插件 " name="plugin">
<a-input
allow-clear
placeholder="请输入是否插件 0应用1 插件 "
v-model:value="form.plugin"
/>
</a-form-item>
<a-form-item label="编辑器类型 1 md-editor-v3, 2 tinymce-editor" name="editor">
<a-input
allow-clear
placeholder="请输入编辑器类型 1 md-editor-v3, 2 tinymce-editor"
v-model:value="form.editor"
/>
</a-form-item>
<a-form-item label="显示站内搜索" name="searchBtn">
<a-input
allow-clear
placeholder="请输入显示站内搜索"
v-model:value="form.searchBtn"
/>
</a-form-item>
<a-form-item label="显示登录注册功能" name="loginBtn">
<a-input
allow-clear
placeholder="请输入显示登录注册功能"
v-model:value="form.loginBtn"
/>
</a-form-item>
<a-form-item label="显示悬浮客服工具" name="kefuTool">
<a-input
allow-clear
placeholder="请输入显示悬浮客服工具"
v-model:value="form.floatTool"
/>
</a-form-item>
<a-form-item label="显示版权链接" name="copyrightLink">
<a-input
allow-clear
placeholder="请输入显示版权链接"
v-model:value="form.copyrightLink"
/>
</a-form-item>
<a-form-item label="导航栏最多显示数量" name="maxMenuNum">
<a-input
allow-clear
placeholder="请输入导航栏最多显示数量"
v-model:value="form.maxMenuNum"
/>
</a-form-item>
<a-form-item label="排序号" name="sortNumber">
<a-input-number
:min="0"
:max="9999"
class="ele-fluid"
placeholder="请输入排序号"
v-model:value="form.sortNumber"
/>
</a-form-item>
<a-form-item label="是否删除, 0否, 1是" name="deleted">
<a-input
allow-clear
placeholder="请输入是否删除, 0否, 1是"
v-model:value="form.deleted"
/>
</a-form-item>
<a-form-item label="修改时间" name="updateTime">
<a-input
allow-clear
placeholder="请输入修改时间"
v-model:value="form.updateTime"
/>
</a-form-item>
</a-form>
</ele-modal>
</template>
<script lang="ts" setup>
import { ref, reactive, watch } from 'vue';
import { Form, message } from 'ant-design-vue';
import { assignObject, uuid } from 'ele-admin-pro';
import { addCmsWebsiteSetting, updateCmsWebsiteSetting } from '@/api/cms/cmsWebsiteSetting';
import { CmsWebsiteSetting } from '@/api/cms/cmsWebsiteSetting/model';
import { useThemeStore } from '@/store/modules/theme';
import { storeToRefs } from 'pinia';
import { ItemType } from 'ele-admin-pro/es/ele-image-upload/types';
import { FormInstance } from 'ant-design-vue/es/form';
import { FileRecord } from '@/api/system/file/model';
//
const isUpdate = ref(false);
const useForm = Form.useForm;
//
const themeStore = useThemeStore();
const { styleResponsive } = storeToRefs(themeStore);
const props = defineProps<{
//
visible: boolean;
//
data?: CmsWebsiteSetting | null;
}>();
const emit = defineEmits<{
(e: 'done'): void;
(e: 'update:visible', visible: boolean): void;
}>();
//
const loading = ref(false);
//
const maxable = ref(true);
//
const formRef = ref<FormInstance | null>(null);
const images = ref<ItemType[]>([]);
//
const form = reactive<CmsWebsiteSetting>({
id: undefined,
websiteId: undefined,
official: undefined,
market: undefined,
search: undefined,
share: undefined,
plugin: undefined,
editor: undefined,
searchBtn: undefined,
loginBtn: undefined,
floatTool: undefined,
copyrightLink: undefined,
maxMenuNum: undefined,
deleted: undefined,
tenantId: undefined,
createTime: undefined,
updateTime: undefined,
sortNumber: 100
});
/* 更新visible */
const updateVisible = (value: boolean) => {
emit('update:visible', value);
};
//
const rules = reactive({
cmsWebsiteSettingName: [
{
required: true,
type: 'string',
message: '请填写网站设置名称',
trigger: 'blur'
}
]
});
const chooseImage = (data: FileRecord) => {
images.value.push({
uid: data.id,
url: data.path,
status: 'done'
});
form.image = data.path;
};
const onDeleteItem = (index: number) => {
images.value.splice(index, 1);
form.image = '';
};
const { resetFields } = useForm(form, rules);
/* 保存编辑 */
const save = () => {
if (!formRef.value) {
return;
}
formRef.value
.validate()
.then(() => {
loading.value = true;
const formData = {
...form
};
const saveOrUpdate = isUpdate.value ? updateCmsWebsiteSetting : addCmsWebsiteSetting;
saveOrUpdate(formData)
.then((msg) => {
loading.value = false;
message.success(msg);
updateVisible(false);
emit('done');
})
.catch((e) => {
loading.value = false;
message.error(e.message);
});
})
.catch(() => {});
};
watch(
() => props.visible,
(visible) => {
if (visible) {
images.value = [];
if (props.data) {
assignObject(form, props.data);
if(props.data.image){
images.value.push({
uid: uuid(),
url: props.data.image,
status: 'done'
})
}
isUpdate.value = true;
} else {
isUpdate.value = false;
}
} else {
resetFields();
}
},
{ immediate: true }
);
</script>

42
src/views/cms/cmsWebsiteSetting/components/search.vue

@ -0,0 +1,42 @@
<!-- 搜索表单 -->
<template>
<a-space :size="10" style="flex-wrap: wrap">
<a-button type="primary" class="ele-btn-icon" @click="add">
<template #icon>
<PlusOutlined />
</template>
<span>添加</span>
</a-button>
</a-space>
</template>
<script lang="ts" setup>
import { PlusOutlined } from '@ant-design/icons-vue';
import type { GradeParam } from '@/api/user/grade/model';
import { watch } from 'vue';
const props = withDefaults(
defineProps<{
//
selection?: [];
}>(),
{}
);
const emit = defineEmits<{
(e: 'search', where?: GradeParam): void;
(e: 'add'): void;
(e: 'remove'): void;
(e: 'batchMove'): void;
}>();
//
const add = () => {
emit('add');
};
watch(
() => props.selection,
() => {}
);
</script>

305
src/views/cms/cmsWebsiteSetting/index.vue

@ -0,0 +1,305 @@
<template>
<div class="page">
<div class="ele-body">
<a-card :bordered="false" :body-style="{ padding: '16px' }">
<ele-pro-table
ref="tableRef"
row-key="cmsWebsiteSettingId"
:columns="columns"
:datasource="datasource"
:customRow="customRow"
tool-class="ele-toolbar-form"
class="sys-org-table"
>
<template #toolbar>
<search
@search="reload"
:selection="selection"
@add="openEdit"
@remove="removeBatch"
@batchMove="openMove"
/>
</template>
<template #bodyCell="{ column, record }">
<template v-if="column.key === 'image'">
<a-image :src="record.image" :width="50" />
</template>
<template v-if="column.key === 'status'">
<a-tag v-if="record.status === 0" color="green">显示</a-tag>
<a-tag v-if="record.status === 1" color="red">隐藏</a-tag>
</template>
<template v-if="column.key === 'action'">
<a-space>
<a @click="openEdit(record)">修改</a>
<a-divider type="vertical" />
<a-popconfirm
title="确定要删除此记录吗?"
@confirm="remove(record)"
>
<a class="ele-text-danger">删除</a>
</a-popconfirm>
</a-space>
</template>
</template>
</ele-pro-table>
</a-card>
<!-- 编辑弹窗 -->
<CmsWebsiteSettingEdit v-model:visible="showEdit" :data="current" @done="reload" />
</div>
</div>
</template>
<script lang="ts" setup>
import { createVNode, ref } from 'vue';
import { message, Modal } from 'ant-design-vue';
import { ExclamationCircleOutlined } from '@ant-design/icons-vue';
import type { EleProTable } from 'ele-admin-pro';
import { toDateString } from 'ele-admin-pro';
import type {
DatasourceFunction,
ColumnItem
} from 'ele-admin-pro/es/ele-pro-table/types';
import Search from './components/search.vue';
import CmsWebsiteSettingEdit from './components/cmsWebsiteSettingEdit.vue';
import { pageCmsWebsiteSetting, removeCmsWebsiteSetting, removeBatchCmsWebsiteSetting } from '@/api/cms/cmsWebsiteSetting';
import type { CmsWebsiteSetting, CmsWebsiteSettingParam } from '@/api/cms/cmsWebsiteSetting/model';
//
const tableRef = ref<InstanceType<typeof EleProTable> | null>(null);
//
const selection = ref<CmsWebsiteSetting[]>([]);
//
const current = ref<CmsWebsiteSetting | null>(null);
//
const showEdit = ref(false);
//
const showMove = ref(false);
//
const loading = ref(true);
//
const datasource: DatasourceFunction = ({
page,
limit,
where,
orders,
filters
}) => {
if (filters) {
where.status = filters.status;
}
return pageCmsWebsiteSetting({
...where,
...orders,
page,
limit
});
};
//
const columns = ref<ColumnItem[]>([
{
title: '自增ID',
dataIndex: 'id',
key: 'id',
align: 'center',
width: 90,
},
{
title: '关联网站ID',
dataIndex: 'websiteId',
key: 'websiteId',
align: 'center',
},
{
title: '是否官方插件',
dataIndex: 'official',
key: 'official',
align: 'center',
},
{
title: '是否展示在插件市场',
dataIndex: 'market',
key: 'market',
align: 'center',
},
{
title: '是否允许被搜索',
dataIndex: 'search',
key: 'search',
align: 'center',
},
{
title: '是否共享',
dataIndex: 'share',
key: 'share',
align: 'center',
},
{
title: '是否插件 0应用1 插件 ',
dataIndex: 'plugin',
key: 'plugin',
align: 'center',
},
{
title: '编辑器类型 1 md-editor-v3, 2 tinymce-editor',
dataIndex: 'editor',
key: 'editor',
align: 'center',
},
{
title: '显示站内搜索',
dataIndex: 'searchBtn',
key: 'searchBtn',
align: 'center',
},
{
title: '显示登录注册功能',
dataIndex: 'loginBtn',
key: 'loginBtn',
align: 'center',
},
{
title: '显示悬浮客服工具',
dataIndex: 'kefuTool',
key: 'kefuTool',
align: 'center',
},
{
title: '显示版权链接',
dataIndex: 'copyrightLink',
key: 'copyrightLink',
align: 'center',
},
{
title: '导航栏最多显示数量',
dataIndex: 'maxMenuNum',
key: 'maxMenuNum',
align: 'center',
},
{
title: '排序号',
dataIndex: 'sortNumber',
key: 'sortNumber',
align: 'center',
},
{
title: '是否删除, 0否, 1是',
dataIndex: 'deleted',
key: 'deleted',
align: 'center',
},
{
title: '创建时间',
dataIndex: 'createTime',
key: 'createTime',
align: 'center',
sorter: true,
ellipsis: true,
customRender: ({ text }) => toDateString(text, 'yyyy-MM-dd')
},
{
title: '修改时间',
dataIndex: 'updateTime',
key: 'updateTime',
align: 'center',
},
{
title: '操作',
key: 'action',
width: 180,
fixed: 'right',
align: 'center',
hideInSetting: true
}
]);
/* 搜索 */
const reload = (where?: CmsWebsiteSettingParam) => {
selection.value = [];
tableRef?.value?.reload({ where: where });
};
/* 打开编辑弹窗 */
const openEdit = (row?: CmsWebsiteSetting) => {
current.value = row ?? null;
showEdit.value = true;
};
/* 打开批量移动弹窗 */
const openMove = () => {
showMove.value = true;
};
/* 删除单个 */
const remove = (row: CmsWebsiteSetting) => {
const hide = message.loading('请求中..', 0);
removeCmsWebsiteSetting(row.cmsWebsiteSettingId)
.then((msg) => {
hide();
message.success(msg);
reload();
})
.catch((e) => {
hide();
message.error(e.message);
});
};
/* 批量删除 */
const removeBatch = () => {
if (!selection.value.length) {
message.error('请至少选择一条数据');
return;
}
Modal.confirm({
title: '提示',
content: '确定要删除选中的记录吗?',
icon: createVNode(ExclamationCircleOutlined),
maskClosable: true,
onOk: () => {
const hide = message.loading('请求中..', 0);
removeBatchCmsWebsiteSetting(selection.value.map((d) => d.cmsWebsiteSettingId))
.then((msg) => {
hide();
message.success(msg);
reload();
})
.catch((e) => {
hide();
message.error(e.message);
});
}
});
};
/* 查询 */
const query = () => {
loading.value = true;
};
/* 自定义行属性 */
const customRow = (record: CmsWebsiteSetting) => {
return {
//
onClick: () => {
// console.log(record);
},
//
onDblclick: () => {
openEdit(record);
}
};
};
query();
</script>
<script lang="ts">
export default {
name: 'CmsWebsiteSetting'
};
</script>
<style lang="less" scoped></style>
Loading…
Cancel
Save