重新整理仓库
This commit is contained in:
316
src/views/system/setting/components/basic.vue
Normal file
316
src/views/system/setting/components/basic.vue
Normal file
@@ -0,0 +1,316 @@
|
||||
<template>
|
||||
<a-card :bordered="false">
|
||||
<a-form
|
||||
ref="formRef"
|
||||
:model="form"
|
||||
:rules="rules"
|
||||
:label-col="styleResponsive ? { md: 3, sm: 5, xs: 24 } : { flex: '90px' }"
|
||||
:wrapper-col="styleResponsive ? { md: 9, sm: 19, xs: 24 } : { flex: '1' }"
|
||||
>
|
||||
<a-form-item label="站点名称" name="siteName">
|
||||
<a-input
|
||||
allow-clear
|
||||
:maxlength="30"
|
||||
placeholder="请输入站点名称"
|
||||
v-model:value="form.siteName"
|
||||
/>
|
||||
</a-form-item>
|
||||
<a-form-item label="站点描述" name="remarks">
|
||||
<a-textarea
|
||||
:rows="4"
|
||||
:maxlength="200"
|
||||
placeholder="请输入站点描述"
|
||||
v-model:value="form.remarks"
|
||||
/>
|
||||
</a-form-item>
|
||||
<a-form-item label="SEO" name="keyword">
|
||||
<a-select
|
||||
v-model:value="keyword"
|
||||
mode="tags"
|
||||
style="width: 100%"
|
||||
:token-separators="[',']"
|
||||
placeholder="请输入网站关键字"
|
||||
:options="options"
|
||||
@change="handleKeyword"
|
||||
></a-select>
|
||||
</a-form-item>
|
||||
<a-form-item label="ICP备案" name="icp">
|
||||
<a-input
|
||||
allow-clear
|
||||
:maxlength="18"
|
||||
placeholder="请输入ICP备案号"
|
||||
v-model:value="form.icp"
|
||||
/>
|
||||
</a-form-item>
|
||||
<a-form-item label="版权信息" name="copyright">
|
||||
<a-input
|
||||
allow-clear
|
||||
:maxlength="50"
|
||||
placeholder="请输入版权信息"
|
||||
v-model:value="form.copyright"
|
||||
/>
|
||||
</a-form-item>
|
||||
<a-form-item label="公司名称" name="company">
|
||||
<a-input
|
||||
allow-clear
|
||||
:maxlength="30"
|
||||
placeholder="请输入公司名称"
|
||||
v-model:value="form.company"
|
||||
/>
|
||||
</a-form-item>
|
||||
<a-form-item label="办公地址" name="address">
|
||||
<a-input
|
||||
allow-clear
|
||||
:maxlength="50"
|
||||
placeholder="请输入公司办公地址"
|
||||
v-model:value="form.address"
|
||||
/>
|
||||
</a-form-item>
|
||||
<a-form-item label="服务热线" name="phone">
|
||||
<a-input
|
||||
allow-clear
|
||||
:maxlength="50"
|
||||
placeholder="请输入服务热线电话"
|
||||
v-model:value="form.phone"
|
||||
/>
|
||||
</a-form-item>
|
||||
<a-form-item label="电子邮箱" name="email">
|
||||
<a-input
|
||||
allow-clear
|
||||
:maxlength="50"
|
||||
placeholder="请输入电子邮箱"
|
||||
v-model:value="form.email"
|
||||
/>
|
||||
</a-form-item>
|
||||
<a-form-item label="网站域名" name="domain">
|
||||
<a-input v-model:value="form.domain" placeholder="domain.com">
|
||||
<template #addonBefore>
|
||||
<a-select v-model:value="prefix" style="width: 90px">
|
||||
<a-select-option value="http://">http</a-select-option>
|
||||
<a-select-option value="https://">https</a-select-option>
|
||||
</a-select>
|
||||
</template>
|
||||
</a-input>
|
||||
</a-form-item>
|
||||
<a-form-item label="技术支持" name="support">
|
||||
<a-input
|
||||
allow-clear
|
||||
:maxlength="50"
|
||||
placeholder="请输入技术支持"
|
||||
v-model:value="form.support"
|
||||
/>
|
||||
</a-form-item>
|
||||
<a-form-item label="ico文件" name="logo">
|
||||
<ele-image-upload
|
||||
v-model:value="logo"
|
||||
:accept="'image/x-icon,image/svg'"
|
||||
:item-style="{ width: '40px', height: '40px' }"
|
||||
:limit="1"
|
||||
@upload="onUpload"
|
||||
@remove="onClose"
|
||||
/>
|
||||
<a-space direction="vertical">
|
||||
<a-button
|
||||
type="primary"
|
||||
class="ele-btn-icon"
|
||||
style="margin-top: 10px;"
|
||||
@click="save"
|
||||
>
|
||||
<span>保存</span>
|
||||
</a-button>
|
||||
</a-space>
|
||||
</a-form-item>
|
||||
</a-form>
|
||||
</a-card>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import { reactive, ref, watch } from 'vue';
|
||||
import { message } from 'ant-design-vue';
|
||||
import { Setting } from '@/api/system/setting/model';
|
||||
import { useThemeStore } from '@/store/modules/theme';
|
||||
import { storeToRefs } from 'pinia';
|
||||
import { FormInstance } from 'ant-design-vue/es/form';
|
||||
import useFormData from '@/utils/use-form-data';
|
||||
import { addSetting, listSetting, updateSetting } from "@/api/system/setting";
|
||||
import { ItemType } from "ele-admin-pro/es/ele-image-upload/types";
|
||||
import { uploadFile } from "@/api/system/file";
|
||||
import { FILE_SERVER } from "@/config/setting";
|
||||
|
||||
const props = defineProps<{
|
||||
value?: string;
|
||||
// 修改回显的数据
|
||||
data?: Setting | null;
|
||||
}>();
|
||||
|
||||
const emit = defineEmits<{
|
||||
(e: 'done', value): void;
|
||||
}>();
|
||||
|
||||
// 保存字段信息(设定好key和描述,content里的字段是随意加的会自动转为json保存到数据库)
|
||||
const settingId = ref(null);
|
||||
const settingKey = ref('');
|
||||
// 是否开启响应式布局
|
||||
const themeStore = useThemeStore();
|
||||
const { styleResponsive } = storeToRefs(themeStore);
|
||||
// 编辑器内容，双向绑定
|
||||
const logo = ref<any>([]);
|
||||
const prefix = ref('https://');
|
||||
const suffix = ref('.com');
|
||||
const keyword = ref([]);
|
||||
const tenantId = localStorage.getItem('TenantId');
|
||||
// 提交状态
|
||||
const loading = ref(false);
|
||||
// 是否是修改
|
||||
const isUpdate = ref(false);
|
||||
//
|
||||
const formRef = ref<FormInstance | null>(null);
|
||||
// 表单数据
|
||||
const { form, resetFields, assignFields } = useFormData<Setting>({
|
||||
siteName: '',
|
||||
icp: '',
|
||||
copyright: '',
|
||||
keyword: '',
|
||||
remarks: '',
|
||||
fullName: '',
|
||||
company: '',
|
||||
address: '',
|
||||
domain: '',
|
||||
email: '',
|
||||
phone: '',
|
||||
support: '',
|
||||
logo: '',
|
||||
tenantId: undefined
|
||||
});
|
||||
|
||||
// 表单验证规则
|
||||
const rules = reactive({
|
||||
siteName: [
|
||||
{
|
||||
required: true,
|
||||
message: '请输入系统名称',
|
||||
type: 'string',
|
||||
trigger: 'blur'
|
||||
}
|
||||
],
|
||||
keyword: [
|
||||
{
|
||||
required: true,
|
||||
message: '请输入网站关键词',
|
||||
type: 'string',
|
||||
trigger: 'blur'
|
||||
}
|
||||
],
|
||||
remarks: [
|
||||
{
|
||||
required: true,
|
||||
message: '请输入站点描述',
|
||||
type: 'string',
|
||||
trigger: 'blur'
|
||||
}
|
||||
],
|
||||
icp: [
|
||||
{
|
||||
required: true,
|
||||
message: '请输入ICP备案号',
|
||||
type: 'string',
|
||||
trigger: 'blur'
|
||||
}
|
||||
],
|
||||
copyright: [
|
||||
{
|
||||
required: true,
|
||||
message: '请输入版权信息',
|
||||
type: 'string',
|
||||
trigger: 'blur'
|
||||
}
|
||||
],
|
||||
|
||||
|
||||
});
|
||||
|
||||
const onUpload = (d: ItemType) => {
|
||||
const file = d.file;
|
||||
console.log(file);
|
||||
if(file){
|
||||
if (file.size / 1024 / 1024 > 2) {
|
||||
message.error('大小不能超过 2MB');
|
||||
return;
|
||||
}
|
||||
}
|
||||
uploadFile(<File>d.file)
|
||||
.then((result) => {
|
||||
form.logo = result.url;
|
||||
message.success('上传成功');
|
||||
})
|
||||
.catch((e) => {
|
||||
message.error(e.message);
|
||||
});
|
||||
};
|
||||
|
||||
const handleKeyword = (keyword) => {
|
||||
keyword.value = keyword;
|
||||
form.keyword = JSON.stringify(keyword);
|
||||
}
|
||||
|
||||
const onClose = () => {
|
||||
form.logo = undefined
|
||||
}
|
||||
|
||||
/* 保存编辑 */
|
||||
const save = () => {
|
||||
if (!formRef.value) {
|
||||
return;
|
||||
}
|
||||
formRef.value
|
||||
.validate()
|
||||
.then(() => {
|
||||
loading.value = true;
|
||||
const appForm = {
|
||||
...form,
|
||||
content: JSON.stringify(form),
|
||||
};
|
||||
const saveOrUpdate = isUpdate.value ? updateSetting : addSetting;
|
||||
saveOrUpdate(appForm)
|
||||
.then((msg) => {
|
||||
message.success('保存成功');
|
||||
})
|
||||
.catch((e) => {
|
||||
message.error(e.message);
|
||||
});
|
||||
})
|
||||
.catch(() => {});
|
||||
};
|
||||
|
||||
watch(
|
||||
() => props.data,
|
||||
(data) => {
|
||||
if(data?.settingId){
|
||||
isUpdate.value = true
|
||||
// 表单赋值
|
||||
if(data.content){
|
||||
const jsonData = JSON.parse(data.content);
|
||||
assignFields(jsonData);
|
||||
// 头像赋值
|
||||
logo.value = [];
|
||||
if (jsonData.logo) {
|
||||
logo.value.push({ uid:1, url: jsonData.logo, status: '' });
|
||||
}
|
||||
if(jsonData.keyword){
|
||||
keyword.value = JSON.parse(jsonData.keyword)
|
||||
}
|
||||
}
|
||||
// 其他必要参数
|
||||
form.settingId = data.settingId
|
||||
form.settingKey = data.settingKey
|
||||
|
||||
} else {
|
||||
// 新增
|
||||
isUpdate.value = false
|
||||
resetFields();
|
||||
form.settingKey = props.value
|
||||
}
|
||||
}
|
||||
);
|
||||
|
||||
</script>
|
||||
137
src/views/system/setting/components/clear.vue
Normal file
137
src/views/system/setting/components/clear.vue
Normal file
@@ -0,0 +1,137 @@
|
||||
<template>
|
||||
<a-card :bordered="false">
|
||||
<a-form
|
||||
ref="formRef"
|
||||
:model="form"
|
||||
:rules="rules"
|
||||
:label-col="styleResponsive ? { md: 3, sm: 5, xs: 24 } : { flex: '90px' }"
|
||||
:wrapper-col="styleResponsive ? { md: 9, sm: 19, xs: 24 } : { flex: '1' }"
|
||||
>
|
||||
<!-- <a-form-item label="缓存项目" name="clearCache">-->
|
||||
<!-- <a-checkbox-group v-model:value="form.clearCache">-->
|
||||
<!-- <a-checkbox value="setting">系统设置</a-checkbox>-->
|
||||
<!-- <a-checkbox value="dict">数据字典</a-checkbox>-->
|
||||
<!-- <a-checkbox value="category">商品分类</a-checkbox>-->
|
||||
<!-- <a-checkbox value="temp">临时图片</a-checkbox>-->
|
||||
<!-- </a-checkbox-group>-->
|
||||
<!-- </a-form-item>-->
|
||||
<a-form-item label="操作">
|
||||
<a-button
|
||||
type="primary"
|
||||
class="ele-btn-icon"
|
||||
@click="save"
|
||||
>
|
||||
<span>更新缓存</span>
|
||||
</a-button>
|
||||
</a-form-item>
|
||||
</a-form>
|
||||
</a-card>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import { reactive, ref, watch } from 'vue';
|
||||
import { message } from 'ant-design-vue';
|
||||
import { Setting } from '@/api/system/setting/model';
|
||||
import { useThemeStore } from '@/store/modules/theme';
|
||||
import { storeToRefs } from 'pinia';
|
||||
import { FormInstance } from 'ant-design-vue/es/form';
|
||||
import useFormData from '@/utils/use-form-data';
|
||||
import { ItemType } from "ele-admin-pro/es/ele-image-upload/types";
|
||||
import { uploadFile } from "@/api/system/file";
|
||||
import { FILE_SERVER } from "@/config/setting";
|
||||
import { listDictionaries } from "@/api/system/dict";
|
||||
|
||||
const props = defineProps<{
|
||||
// 当前选项卡
|
||||
value?: string;
|
||||
// 修改回显的数据
|
||||
data?: Setting | null;
|
||||
}>();
|
||||
|
||||
// 保存字段信息(设定好key和描述,content里的字段是随意加的会自动转为json保存到数据库)
|
||||
const settingId = ref(undefined);
|
||||
const settingKey = ref('setting');
|
||||
const comments = ref('系统设置');
|
||||
// 是否开启响应式布局
|
||||
const themeStore = useThemeStore();
|
||||
const { styleResponsive } = storeToRefs(themeStore);
|
||||
// 编辑器内容，双向绑定
|
||||
const logo = ref<any>([]);
|
||||
const value = ref('all')
|
||||
// 是否是修改
|
||||
const isUpdate = ref(false);
|
||||
//
|
||||
const formRef = ref<FormInstance | null>(null);
|
||||
// 表单数据
|
||||
const { form, resetFields, assignFields } = useFormData<Setting>({
|
||||
clearCache: 'setting,dict,category,temp',
|
||||
tenantId: localStorage.getItem('TenantId')
|
||||
});
|
||||
|
||||
// 表单验证规则
|
||||
const rules = reactive({
|
||||
clearCache: [
|
||||
{
|
||||
required: true,
|
||||
message: '请选择要清楚的项',
|
||||
type: 'string',
|
||||
trigger: 'blur'
|
||||
}
|
||||
]
|
||||
});
|
||||
|
||||
const onUpload = (d: ItemType) => {
|
||||
uploadFile(<File>d.file)
|
||||
.then((result) => {
|
||||
form.logo = result.path;
|
||||
message.success('上传成功');
|
||||
})
|
||||
.catch((e) => {
|
||||
message.error(e.message);
|
||||
});
|
||||
};
|
||||
|
||||
const selectAll = (e) => {
|
||||
// if (e.target.value === 'all') {
|
||||
// form.clearCache = '"all","setting","dict","category","temp"'
|
||||
// }
|
||||
}
|
||||
const onClose = () => {
|
||||
form.logo = undefined
|
||||
}
|
||||
|
||||
|
||||
|
||||
/* 保存编辑 */
|
||||
const save = () => {
|
||||
// 清除字典缓存
|
||||
listDictionaries().then(data => {
|
||||
data?.map(d => {
|
||||
localStorage.removeItem("__" + d.dictCode + "__");
|
||||
})
|
||||
})
|
||||
message.success('更新成功');
|
||||
};
|
||||
|
||||
watch(
|
||||
() => props.data,
|
||||
(data) => {
|
||||
if(data?.settingId){
|
||||
isUpdate.value = true
|
||||
// 表单赋值
|
||||
if(data.content){
|
||||
const jsonData = JSON.parse(data.content);
|
||||
assignFields(jsonData);
|
||||
}
|
||||
// 其他必要参数
|
||||
form.settingId = data.settingId
|
||||
form.settingKey = data.settingKey
|
||||
} else {
|
||||
// 新增
|
||||
isUpdate.value = false
|
||||
resetFields();
|
||||
form.settingKey = props.value
|
||||
}
|
||||
}
|
||||
);
|
||||
</script>
|
||||
202
src/views/system/setting/components/developer.vue
Normal file
202
src/views/system/setting/components/developer.vue
Normal file
@@ -0,0 +1,202 @@
|
||||
<template>
|
||||
<a-card :bordered="false">
|
||||
<a-form
|
||||
ref="formRef"
|
||||
:model="form"
|
||||
:rules="rules"
|
||||
:label-col="styleResponsive ? { md: 3, sm: 5, xs: 24 } : { flex: '90px' }"
|
||||
:wrapper-col="styleResponsive ? { md: 9, sm: 19, xs: 24 } : { flex: '1' }"
|
||||
>
|
||||
<a-form-item label="租户ID" name="tenantId">
|
||||
<span class="ele-text-heading">{{ tenantId }}</span>
|
||||
</a-form-item>
|
||||
<a-form-item label="应用编码" name="tenantCode">
|
||||
<span class="ele-text-heading">{{ tenantCode }}</span>
|
||||
</a-form-item>
|
||||
</a-form>
|
||||
</a-card>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import { reactive, ref, watch } from 'vue';
|
||||
import { message } from 'ant-design-vue';
|
||||
import { Setting } from '@/api/system/setting/model';
|
||||
import { useThemeStore } from '@/store/modules/theme';
|
||||
import { storeToRefs } from 'pinia';
|
||||
import { FormInstance } from 'ant-design-vue/es/form';
|
||||
import useFormData from '@/utils/use-form-data';
|
||||
import { addSetting, listSetting, updateSetting } from "@/api/system/setting";
|
||||
import { ItemType } from "ele-admin-pro/es/ele-image-upload/types";
|
||||
import { uploadFile } from "@/api/system/file";
|
||||
import { FILE_SERVER } from "@/config/setting";
|
||||
|
||||
const props = defineProps<{
|
||||
value?: string;
|
||||
// 修改回显的数据
|
||||
data?: Setting | null;
|
||||
}>();
|
||||
|
||||
const emit = defineEmits<{
|
||||
(e: 'done', value): void;
|
||||
}>();
|
||||
|
||||
// 保存字段信息(设定好key和描述,content里的字段是随意加的会自动转为json保存到数据库)
|
||||
const settingId = ref(null);
|
||||
const settingKey = ref('developer');
|
||||
// 是否开启响应式布局
|
||||
const themeStore = useThemeStore();
|
||||
const { styleResponsive } = storeToRefs(themeStore);
|
||||
// 编辑器内容，双向绑定
|
||||
const logo = ref<any>([]);
|
||||
const prefix = ref('https://');
|
||||
const suffix = ref('.com');
|
||||
const keyword = ref([]);
|
||||
const tenantId = localStorage.getItem('TenantId');
|
||||
const tenantCode = 'YKVBG4nwnHFXh9pe';
|
||||
// 提交状态
|
||||
const loading = ref(false);
|
||||
// 是否是修改
|
||||
const isUpdate = ref(false);
|
||||
//
|
||||
const formRef = ref<FormInstance | null>(null);
|
||||
// 表单数据
|
||||
const { form, resetFields, assignFields } = useFormData<Setting>({
|
||||
siteName: '',
|
||||
icp: '',
|
||||
copyright: '',
|
||||
keyword: '',
|
||||
remarks: '',
|
||||
fullName: '',
|
||||
company: '',
|
||||
address: '',
|
||||
domain: '',
|
||||
email: '',
|
||||
phone: '',
|
||||
support: '',
|
||||
logo: '',
|
||||
tenantId: undefined
|
||||
});
|
||||
|
||||
// 表单验证规则
|
||||
const rules = reactive({
|
||||
siteName: [
|
||||
{
|
||||
required: true,
|
||||
message: '请输入系统名称',
|
||||
type: 'string',
|
||||
trigger: 'blur'
|
||||
}
|
||||
],
|
||||
keyword: [
|
||||
{
|
||||
required: true,
|
||||
message: '请输入网站关键词',
|
||||
type: 'string',
|
||||
trigger: 'blur'
|
||||
}
|
||||
],
|
||||
remarks: [
|
||||
{
|
||||
required: true,
|
||||
message: '请输入站点描述',
|
||||
type: 'string',
|
||||
trigger: 'blur'
|
||||
}
|
||||
],
|
||||
icp: [
|
||||
{
|
||||
required: true,
|
||||
message: '请输入ICP备案号',
|
||||
type: 'string',
|
||||
trigger: 'blur'
|
||||
}
|
||||
],
|
||||
copyright: [
|
||||
{
|
||||
required: true,
|
||||
message: '请输入版权信息',
|
||||
type: 'string',
|
||||
trigger: 'blur'
|
||||
}
|
||||
],
|
||||
|
||||
|
||||
});
|
||||
|
||||
const onUpload = (d: ItemType) => {
|
||||
uploadFile(<File>d.file)
|
||||
.then((result) => {
|
||||
form.logo = result.path;
|
||||
message.success('上传成功');
|
||||
})
|
||||
.catch((e) => {
|
||||
message.error(e.message);
|
||||
});
|
||||
};
|
||||
|
||||
const handleKeyword = (keyword) => {
|
||||
keyword.value = keyword;
|
||||
form.keyword = JSON.stringify(keyword);
|
||||
}
|
||||
|
||||
const onClose = () => {
|
||||
form.logo = undefined
|
||||
}
|
||||
|
||||
/* 保存编辑 */
|
||||
const save = () => {
|
||||
if (!formRef.value) {
|
||||
return;
|
||||
}
|
||||
formRef.value
|
||||
.validate()
|
||||
.then(() => {
|
||||
loading.value = true;
|
||||
const appForm = {
|
||||
...form,
|
||||
content: JSON.stringify(form),
|
||||
};
|
||||
const saveOrUpdate = isUpdate.value ? updateSetting : addSetting;
|
||||
saveOrUpdate(appForm)
|
||||
.then((msg) => {
|
||||
message.success('保存成功');
|
||||
})
|
||||
.catch((e) => {
|
||||
message.error(e.message);
|
||||
});
|
||||
})
|
||||
.catch(() => {});
|
||||
};
|
||||
|
||||
watch(
|
||||
() => props.data,
|
||||
(data) => {
|
||||
if(data?.settingId){
|
||||
isUpdate.value = true
|
||||
// 表单赋值
|
||||
if(data.content){
|
||||
const jsonData = JSON.parse(data.content);
|
||||
assignFields(jsonData);
|
||||
// 头像赋值
|
||||
logo.value = [];
|
||||
if (jsonData.logo) {
|
||||
logo.value.push({ uid:1, url: FILE_SERVER + jsonData.logo, status: '' });
|
||||
}
|
||||
if(jsonData.keyword){
|
||||
keyword.value = JSON.parse(jsonData.keyword)
|
||||
}
|
||||
}
|
||||
// 其他必要参数
|
||||
form.settingId = data.settingId
|
||||
form.settingKey = data.settingKey
|
||||
|
||||
} else {
|
||||
// 新增
|
||||
isUpdate.value = false
|
||||
resetFields();
|
||||
form.settingKey = props.value
|
||||
}
|
||||
}
|
||||
);
|
||||
|
||||
</script>
|
||||
217
src/views/system/setting/components/mp-weixin.vue
Normal file
217
src/views/system/setting/components/mp-weixin.vue
Normal file
@@ -0,0 +1,217 @@
|
||||
<template>
|
||||
<a-card :bordered="false">
|
||||
<a-form
|
||||
ref="formRef"
|
||||
:model="form"
|
||||
:rules="rules"
|
||||
:label-col="styleResponsive ? { md: 3, sm: 5, xs: 24 } : { flex: '90px' }"
|
||||
:wrapper-col="styleResponsive ? { md: 9, sm: 19, xs: 24 } : { flex: '1' }"
|
||||
>
|
||||
<a-form-item label="小程序 AppID" name="appId" extra="登录小程序平台，开发 - 开发管理 - 开发设置，记录AppID(小程序ID)">
|
||||
<a-input
|
||||
allow-clear
|
||||
:maxlength="20"
|
||||
placeholder="请输入小程序AppID"
|
||||
v-model:value="form.appId"
|
||||
/>
|
||||
</a-form-item>
|
||||
<a-form-item label="小程序 AppSecret" name="appSecret" extra="登录小程序平台，开发 - 开发管理 - 开发设置，记录AppSecret(小程序密钥)">
|
||||
<a-input-password
|
||||
:maxlength="50"
|
||||
placeholder="请输入小程序AppSecret"
|
||||
v-model:value="form.appSecret"
|
||||
/>
|
||||
</a-form-item>
|
||||
<div style="margin-bottom: 22px; width: 750px;">
|
||||
<a-divider>授权域名设置</a-divider>
|
||||
</div>
|
||||
<a-form-item label="request合法域名" name="request">
|
||||
<a-input-group compact>
|
||||
<a-input :value="`https://server.gxwebsoft.com;https://cms-api.websoft.top;`" placeholder="请输入小程序AppSecret" style="width: calc(100% - 50px)" />
|
||||
<a-tooltip title="复制">
|
||||
<a-button @click="onCopyText(`https://server.gxwebsoft.com;https://cms-api.websoft.top;`)">
|
||||
<template #icon><CopyOutlined /></template>
|
||||
</a-button>
|
||||
</a-tooltip>
|
||||
</a-input-group>
|
||||
</a-form-item>
|
||||
<a-form-item label="socket合法域名" name="socket">
|
||||
<a-input-group compact>
|
||||
<a-input :value="`wss://server.gxwebsoft.com`" placeholder="请输入小程序AppSecret" style="width: calc(100% - 50px)" />
|
||||
<a-tooltip title="复制">
|
||||
<a-button @click="onCopyText(`wss://server.gxwebsoft.com`)">
|
||||
<template #icon><CopyOutlined /></template>
|
||||
</a-button>
|
||||
</a-tooltip>
|
||||
</a-input-group>
|
||||
</a-form-item>
|
||||
<a-form-item label="uploadFile合法域名" name="uploadFile">
|
||||
<a-input-group compact>
|
||||
<a-input :value="`https://oss.wsdns.cn;`" style="width: calc(100% - 50px)" />
|
||||
<a-tooltip title="复制">
|
||||
<a-button @click="onCopyText(`https://oss.wsdns.cn;`)">
|
||||
<template #icon><CopyOutlined /></template>
|
||||
</a-button>
|
||||
</a-tooltip>
|
||||
</a-input-group>
|
||||
</a-form-item>
|
||||
<a-form-item label="downloadFile合法域名" name="downloadFile">
|
||||
<a-input-group compact>
|
||||
<a-input :value="`https://oss.wsdns.cn;`" style="width: calc(100% - 50px)" />
|
||||
<a-tooltip title="复制">
|
||||
<a-button @click="onCopyText(`https://oss.wsdns.cn;`)">
|
||||
<template #icon><CopyOutlined /></template>
|
||||
</a-button>
|
||||
</a-tooltip>
|
||||
</a-input-group>
|
||||
<a-button
|
||||
type="primary"
|
||||
class="ele-btn-icon"
|
||||
style="margin-top: 10px"
|
||||
@click="save"
|
||||
>
|
||||
<span>保存</span>
|
||||
</a-button>
|
||||
</a-form-item>
|
||||
</a-form>
|
||||
</a-card>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import { reactive, ref, watch } from 'vue';
|
||||
import { copyText } from '@/utils/common';
|
||||
import { message } from 'ant-design-vue';
|
||||
import { Setting } from '@/api/system/setting/model';
|
||||
import { useThemeStore } from '@/store/modules/theme';
|
||||
import { storeToRefs } from 'pinia';
|
||||
import { FormInstance } from 'ant-design-vue/es/form';
|
||||
import useFormData from '@/utils/use-form-data';
|
||||
import { addSetting, updateSetting } from "@/api/system/setting";
|
||||
import { ItemType } from "ele-admin-pro/es/ele-image-upload/types";
|
||||
import { uploadFile } from "@/api/system/file";
|
||||
import { FILE_SERVER } from "@/config/setting";
|
||||
import {
|
||||
CopyOutlined
|
||||
} from '@ant-design/icons-vue';
|
||||
|
||||
const props = defineProps<{
|
||||
value?: string;
|
||||
// 修改回显的数据
|
||||
data?: Setting | null;
|
||||
}>();
|
||||
|
||||
// 保存字段信息(设定好key和描述,content里的字段是随意加的会自动转为json保存到数据库)
|
||||
const settingId = ref(undefined);
|
||||
const settingKey = ref('mp-weixin');
|
||||
// 是否开启响应式布局
|
||||
const themeStore = useThemeStore();
|
||||
const { styleResponsive } = storeToRefs(themeStore);
|
||||
// 编辑器内容，双向绑定
|
||||
const logo = ref<any>([]);
|
||||
// 提交状态
|
||||
const loading = ref(false);
|
||||
// 是否是修改
|
||||
const isUpdate = ref(false);
|
||||
//
|
||||
const formRef = ref<FormInstance | null>(null);
|
||||
// 表单数据
|
||||
const { form, resetFields, assignFields } = useFormData<Setting>({
|
||||
appId: '',
|
||||
appSecret: '',
|
||||
tenantId: localStorage.getItem('TenantId')
|
||||
});
|
||||
|
||||
// 表单验证规则
|
||||
const rules = reactive({
|
||||
appId: [
|
||||
{
|
||||
required: true,
|
||||
message: '请输入appId',
|
||||
type: 'string',
|
||||
trigger: 'blur'
|
||||
}
|
||||
],
|
||||
appSecret: [
|
||||
{
|
||||
required: true,
|
||||
message: '请输入appSecret',
|
||||
type: 'string',
|
||||
trigger: 'blur'
|
||||
}
|
||||
]
|
||||
});
|
||||
|
||||
const onCopyText = (text) => {
|
||||
copyText(text);
|
||||
}
|
||||
|
||||
const onUpload = (d: ItemType) => {
|
||||
uploadFile(<File>d.file)
|
||||
.then((result) => {
|
||||
form.logo = result.path;
|
||||
message.success('上传成功');
|
||||
})
|
||||
.catch((e) => {
|
||||
message.error(e.message);
|
||||
});
|
||||
};
|
||||
|
||||
const onClose = () => {
|
||||
form.logo = undefined
|
||||
}
|
||||
|
||||
/* 保存编辑 */
|
||||
const save = () => {
|
||||
if (!formRef.value) {
|
||||
return;
|
||||
}
|
||||
formRef.value
|
||||
.validate()
|
||||
.then(() => {
|
||||
loading.value = true;
|
||||
const appForm = {
|
||||
...form,
|
||||
content: JSON.stringify(form)
|
||||
};
|
||||
const saveOrUpdate = isUpdate.value ? updateSetting : addSetting;
|
||||
saveOrUpdate(appForm)
|
||||
.then((msg) => {
|
||||
message.success('保存成功');
|
||||
})
|
||||
.catch((e) => {
|
||||
message.error(e.message);
|
||||
});
|
||||
})
|
||||
.catch(() => {});
|
||||
};
|
||||
|
||||
|
||||
watch(
|
||||
() => props.data,
|
||||
(data) => {
|
||||
if(data?.settingId){
|
||||
isUpdate.value = true
|
||||
// 表单赋值
|
||||
if(data.content){
|
||||
const jsonData = JSON.parse(data.content);
|
||||
assignFields(jsonData);
|
||||
}
|
||||
// 其他必要参数
|
||||
form.settingId = data.settingId
|
||||
form.settingKey = data.settingKey
|
||||
} else {
|
||||
// 新增
|
||||
isUpdate.value = false
|
||||
resetFields();
|
||||
form.settingKey = props.value
|
||||
}
|
||||
}
|
||||
);
|
||||
</script>
|
||||
|
||||
<style lang="less">
|
||||
.small{
|
||||
color: var(--text-color-secondary);
|
||||
font-size: 14px;
|
||||
}
|
||||
</style>
|
||||
526
src/views/system/setting/components/payment.vue
Normal file
526
src/views/system/setting/components/payment.vue
Normal file
@@ -0,0 +1,526 @@
|
||||
<template>
|
||||
<a-card :bordered="false">
|
||||
<a-form
|
||||
ref="formRef"
|
||||
:model="form"
|
||||
:rules="rules"
|
||||
:label-col="styleResponsive ? { md: 3, sm: 5, xs: 24 } : { flex: '90px' }"
|
||||
:wrapper-col="styleResponsive ? { md: 9, sm: 19, xs: 24 } : { flex: '1' }"
|
||||
>
|
||||
<a-form-item label="支付方式" name="payMethod">
|
||||
<PayMethod
|
||||
dict-code="payMethod"
|
||||
v-model:value="form.payMethod"
|
||||
:placeholder="`选择支付方式`"
|
||||
/>
|
||||
</a-form-item>
|
||||
<!-- 余额支付 -->
|
||||
<a-form-item label="是否启用" name="balanceIsEnable" v-if="form.payMethod === '10'">
|
||||
<a-switch v-model:checked="form.balanceIsEnable" />
|
||||
</a-form-item>
|
||||
<!-- 微信支付开始 -->
|
||||
<template v-if="form.payMethod === '20'">
|
||||
<a-form-item label="是否启用" name="wechatIsEnable">
|
||||
<a-switch v-model:checked="form.wechatIsEnable" />
|
||||
</a-form-item>
|
||||
<a-form-item label="微信商户号类型" name="wechatType">
|
||||
<a-radio-group v-model:value="form.wechatType">
|
||||
<a-radio value="1">
|
||||
<text>普通商户</text>
|
||||
</a-radio>
|
||||
<a-radio value="2">子商户 (服务商模式)</a-radio>
|
||||
</a-radio-group>
|
||||
</a-form-item>
|
||||
<template v-if="form.wechatType === '1'">
|
||||
<a-form-item
|
||||
label="应用ID (AppID)"
|
||||
name="wechatAppId"
|
||||
>
|
||||
<a-input
|
||||
allow-clear
|
||||
placeholder="微信小程序或者微信公众号的APPID，APP支付需要填写开放平台的应用APPID"
|
||||
v-model:value="form.wechatAppId"
|
||||
/>
|
||||
</a-form-item>
|
||||
<a-form-item label="微信商户号 (MchId)" name="mchId">
|
||||
<a-input
|
||||
allow-clear
|
||||
placeholder="微信支付的商户号"
|
||||
v-model:value="form.mchId"
|
||||
/>
|
||||
</a-form-item>
|
||||
<a-form-item label="支付密钥 (APIv3密钥)" name="wechatApiKey">
|
||||
<a-input-password
|
||||
allow-clear
|
||||
placeholder="设置APIv3密钥"
|
||||
v-model:value="form.wechatApiKey"
|
||||
/>
|
||||
</a-form-item>
|
||||
<a-form-item
|
||||
label="证书文件 (CERT)"
|
||||
name="apiclientCert"
|
||||
extra='请上传 "apiclient_cert.pem" 文件'
|
||||
>
|
||||
<Upload accept=".crt" v-model:value="form.apiclientCert" />
|
||||
{{ form.apiclientCert }}
|
||||
</a-form-item>
|
||||
<a-form-item
|
||||
label="证书文件 (KEY)"
|
||||
name="apiclientKey"
|
||||
extra='请上传 "apiclient_key.pem" 文件'
|
||||
>
|
||||
<Upload accept=".crt" v-model:value="form.apiclientKey" />
|
||||
{{ form.apiclientKey }}
|
||||
</a-form-item>
|
||||
<a-form-item label="商户证书序列号" name="merchantSerialNumber">
|
||||
<a-input
|
||||
allow-clear
|
||||
placeholder="商户证书序列号"
|
||||
v-model:value="form.merchantSerialNumber"
|
||||
/>
|
||||
</a-form-item>
|
||||
</template>
|
||||
<template v-if="form.wechatType === '2'">
|
||||
<a-form-item
|
||||
label="服务商应用ID (AppID)"
|
||||
name="spAppId"
|
||||
>
|
||||
<a-input
|
||||
allow-clear
|
||||
placeholder="请填写微信支付服务商的AppID"
|
||||
v-model:value="form.spAppId"
|
||||
/>
|
||||
</a-form-item>
|
||||
<a-form-item label="服务商户号 (MchId)" name="spMchId">
|
||||
<a-input
|
||||
allow-clear
|
||||
placeholder="微信支付服务商的商户号"
|
||||
v-model:value="form.spMchId"
|
||||
/>
|
||||
</a-form-item>
|
||||
<a-form-item label="服务商密钥 (APIKEY)" name="spApiKey">
|
||||
<a-input
|
||||
allow-clear
|
||||
placeholder="微信支付服务商的商户号"
|
||||
v-model:value="form.spApiKey"
|
||||
/>
|
||||
</a-form-item>
|
||||
<a-form-item label="子商户应用ID (AppID)" name="spSubAppId">
|
||||
<a-input
|
||||
allow-clear
|
||||
placeholder="微信小程序或者微信公众号的APPID，APP支付需要填写开放平台的应用APPID"
|
||||
v-model:value="form.spSubAppId"
|
||||
/>
|
||||
</a-form-item>
|
||||
<a-form-item label="子商户号 (MchId)" name="spSubMchId">
|
||||
<a-input
|
||||
allow-clear
|
||||
placeholder="微信支付的商户号"
|
||||
v-model:value="form.spSubMchId"
|
||||
/>
|
||||
</a-form-item>
|
||||
<a-form-item
|
||||
label="服务商证书文件 (CERT)"
|
||||
name="spApiclientCert"
|
||||
extra='请上传 "apiclient_cert.pem" 文件'
|
||||
>
|
||||
<Upload accept=".crt" v-model:value="form.spApiclientCert" />
|
||||
{{ form.spApiclientCert }}
|
||||
</a-form-item>
|
||||
<a-form-item
|
||||
label="服务商证书文件 (KEY)"
|
||||
name="spApiclientKey"
|
||||
extra='请上传 "apiclient_key.pem" 文件'
|
||||
>
|
||||
<Upload accept=".crt" v-model:value="form.spApiclientKey" />
|
||||
{{ form.spApiclientKey }}
|
||||
</a-form-item>
|
||||
</template>
|
||||
</template>
|
||||
<!-- 支付宝支付开始 -->
|
||||
<template v-if="form.payMethod === '30'">
|
||||
<a-form-item label="是否启用" name="alipayIsEnable">
|
||||
<a-switch v-model:checked="form.alipayIsEnable" />
|
||||
</a-form-item>
|
||||
<a-form-item
|
||||
label="支付宝应用"
|
||||
name="alipayAppId"
|
||||
>
|
||||
<a-input
|
||||
allow-clear
|
||||
placeholder="支付宝分配给开发者的应用ID"
|
||||
v-model:value="form.alipayAppId"
|
||||
/>
|
||||
</a-form-item>
|
||||
<a-form-item
|
||||
label="签名算法 (signType)"
|
||||
name="signType"
|
||||
>
|
||||
<a-radio-group v-model:value="form.signType">
|
||||
<a-radio value="RSA2">RSA2</a-radio>
|
||||
<a-radio value="RSA">RSA</a-radio>
|
||||
</a-radio-group>
|
||||
</a-form-item>
|
||||
<a-form-item
|
||||
label="加签模式"
|
||||
name="signMode"
|
||||
extra="如需使用资金支出类的接口，则必须使用公钥证书模式，配置指南 https://opendocs.alipay.com/open/200/105310"
|
||||
>
|
||||
<a-radio-group v-model:value="form.signMode">
|
||||
<a-radio value="公钥证书">
|
||||
<text>公钥证书</text>
|
||||
<a-tag class="ml-5" color="green">推荐</a-tag>
|
||||
</a-radio>
|
||||
<a-radio value="公钥">公钥</a-radio>
|
||||
</a-radio-group>
|
||||
</a-form-item>
|
||||
<a-form-item
|
||||
label="应用公钥证书"
|
||||
name="appCertPublicKey"
|
||||
v-if="form.signMode === '公钥证书'"
|
||||
extra='请上传 "appCertPublicKey.crt" 文件'
|
||||
>
|
||||
<Upload accept=".crt" v-model:value="form.appCertPublicKey" />
|
||||
{{ form.appCertPublicKey }}
|
||||
</a-form-item>
|
||||
<a-form-item
|
||||
label="支付宝公钥证书"
|
||||
name="alipayCertPublicKey"
|
||||
v-if="form.signMode === '公钥证书'"
|
||||
extra='请上传 "alipayCertPublicKey_RSA2.crt" 文件'
|
||||
>
|
||||
<Upload accept=".crt" v-model:value="form.alipayCertPublicKey" />
|
||||
{{ form.alipayCertPublicKey }}
|
||||
</a-form-item>
|
||||
<a-form-item
|
||||
label="支付宝根证书"
|
||||
name="alipayRootCert"
|
||||
v-if="form.signMode === '公钥证书'"
|
||||
extra='请上传 "alipayRootCert.crt" 文件'
|
||||
>
|
||||
<Upload accept=".crt" v-model:value="form.alipayRootCert" />
|
||||
{{ form.alipayRootCert }}
|
||||
</a-form-item>
|
||||
<a-form-item
|
||||
label="支付宝公钥"
|
||||
name="alipayPublicKey"
|
||||
v-if="form.signMode === '公钥'"
|
||||
>
|
||||
<a-textarea
|
||||
:rows="6"
|
||||
placeholder="请输入alipayPublicKey"
|
||||
v-model:value="form.alipayPublicKey"
|
||||
/>
|
||||
</a-form-item>
|
||||
<a-form-item
|
||||
label="应用私钥"
|
||||
name="privateKey"
|
||||
extra='查看 "应用私钥_RSA2_PKCS8.txt" 文件，将全部内容复制到此处'
|
||||
>
|
||||
<a-textarea
|
||||
:rows="6"
|
||||
placeholder="请输入privateKey"
|
||||
v-model:value="form.privateKey"
|
||||
/>
|
||||
</a-form-item>
|
||||
<a-form-item
|
||||
label="接口内容加密方式"
|
||||
name="decryptKey"
|
||||
>
|
||||
<a-input
|
||||
allow-clear
|
||||
placeholder="请输入decryptKey"
|
||||
v-model:value="form.decryptKey"
|
||||
/>
|
||||
</a-form-item>
|
||||
</template>
|
||||
<a-form-item label="操作">
|
||||
<a-button
|
||||
type="primary"
|
||||
class="ele-btn-icon"
|
||||
@click="save"
|
||||
>
|
||||
<span>保存</span>
|
||||
</a-button>
|
||||
</a-form-item>
|
||||
</a-form>
|
||||
</a-card>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import { reactive, ref, watch } from "vue";
|
||||
import { copyText } from "@/utils/common";
|
||||
import { message } from "ant-design-vue";
|
||||
import { Setting } from "@/api/system/setting/model";
|
||||
import { useThemeStore } from "@/store/modules/theme";
|
||||
import { storeToRefs } from "pinia";
|
||||
import { UploadOutlined } from '@ant-design/icons-vue';
|
||||
import { FormInstance } from "ant-design-vue/es/form";
|
||||
import useFormData from "@/utils/use-form-data";
|
||||
import { addSetting, updateSetting } from "@/api/system/setting";
|
||||
import { ItemType } from "ele-admin-pro/es/ele-image-upload/types";
|
||||
import { uploadFile } from "@/api/system/file";
|
||||
import Upload from "@/components/UploadCert/index.vue";
|
||||
import { FILE_SERVER, TOKEN_STORE_NAME } from "@/config/setting";
|
||||
|
||||
const props = defineProps<{
|
||||
value?: string;
|
||||
// 修改回显的数据
|
||||
data?: Setting | null;
|
||||
}>();
|
||||
|
||||
// 保存字段信息(设定好key和描述,content里的字段是随意加的会自动转为json保存到数据库)
|
||||
const settingId = ref(undefined);
|
||||
const settingKey = ref("payment");
|
||||
// 是否开启响应式布局
|
||||
const themeStore = useThemeStore();
|
||||
const { styleResponsive } = storeToRefs(themeStore);
|
||||
// 编辑器内容，双向绑定
|
||||
const logo = ref<any>([]);
|
||||
// 提交状态
|
||||
const loading = ref(false);
|
||||
// 是否是修改
|
||||
const isUpdate = ref(false);
|
||||
// token
|
||||
const token = localStorage.getItem(TOKEN_STORE_NAME);
|
||||
//
|
||||
const formRef = ref<FormInstance | null>(null);
|
||||
// 表单数据
|
||||
const { form, resetFields, assignFields } = useFormData<Setting>({
|
||||
payMethod: 10,
|
||||
signMode: "公钥证书",
|
||||
appId: "",
|
||||
signType: "RSA2",
|
||||
alipayAppId: "",
|
||||
appCertPublicKey: "",
|
||||
alipayCertPublicKey: "",
|
||||
alipayRootCert: "",
|
||||
alipayPublicKey: "",
|
||||
privateKey: "",
|
||||
decryptKey: "",
|
||||
balanceIsEnable: true,
|
||||
wechatIsEnable: false,
|
||||
alipayIsEnable: false,
|
||||
wechatType: '1',
|
||||
wechatAppId: '',
|
||||
wechatApiKey: '',
|
||||
apiclientCert: '',
|
||||
apiclientKey: '',
|
||||
mchId: undefined,
|
||||
spAppId: '',
|
||||
spMchId: '',
|
||||
spApiKey: '',
|
||||
spSubAppId: '',
|
||||
spSubMchId: '',
|
||||
spApiclientCert: '',
|
||||
spApiclientKey: '',
|
||||
merchantSerialNumber: '',
|
||||
tenantId: localStorage.getItem('TenantId')
|
||||
});
|
||||
|
||||
// 表单验证规则
|
||||
const rules = reactive({
|
||||
payMethod: [
|
||||
{
|
||||
required: true,
|
||||
message: "请选择支付方式",
|
||||
type: "string",
|
||||
trigger: "blur"
|
||||
}
|
||||
],
|
||||
signType: [
|
||||
{
|
||||
required: true,
|
||||
type: "string",
|
||||
message: "请填写签名算法",
|
||||
trigger: "blur"
|
||||
}
|
||||
],
|
||||
appCertPublicKey: [
|
||||
{
|
||||
required: true,
|
||||
type: "string",
|
||||
message: "请上传应用公钥证书",
|
||||
trigger: "blur"
|
||||
}
|
||||
],
|
||||
alipayCertPublicKey: [
|
||||
{
|
||||
required: true,
|
||||
type: "string",
|
||||
message: "请上传支付宝公钥证书",
|
||||
trigger: "blur"
|
||||
}
|
||||
],
|
||||
alipayRootCert: [
|
||||
{
|
||||
required: true,
|
||||
type: "string",
|
||||
message: "请上传支付宝根证书",
|
||||
trigger: "blur"
|
||||
}
|
||||
],
|
||||
signMode: [
|
||||
{
|
||||
required: true,
|
||||
type: "string",
|
||||
message: "请选择加签模式",
|
||||
trigger: "blur"
|
||||
}
|
||||
],
|
||||
balanceIsEnable: [
|
||||
{
|
||||
required: true,
|
||||
type: "boolean",
|
||||
message: "请设置是否启用余额支付",
|
||||
trigger: "blur"
|
||||
}
|
||||
],
|
||||
wechatIsEnable: [
|
||||
{
|
||||
required: true,
|
||||
type: "boolean",
|
||||
message: "请设置是否启用微信支付",
|
||||
trigger: "blur"
|
||||
}
|
||||
],
|
||||
alipayIsEnable: [
|
||||
{
|
||||
required: true,
|
||||
type: "boolean",
|
||||
message: "请设置是否启用支付宝支付",
|
||||
trigger: "blur"
|
||||
}
|
||||
],
|
||||
comments: [
|
||||
{
|
||||
required: true,
|
||||
type: "string",
|
||||
message: "请填写支付方式简介",
|
||||
trigger: "blur"
|
||||
}
|
||||
],
|
||||
status: [
|
||||
{
|
||||
required: true,
|
||||
type: "number",
|
||||
message: "请选择支付方式状态",
|
||||
trigger: "blur"
|
||||
}
|
||||
],
|
||||
sortNumber: [
|
||||
{
|
||||
required: true,
|
||||
type: "number",
|
||||
message: "请输入排序号",
|
||||
trigger: "blur"
|
||||
}
|
||||
],
|
||||
alipayAppId: [
|
||||
{
|
||||
required: true,
|
||||
type: "string",
|
||||
message: "请填写应用ID",
|
||||
trigger: "blur"
|
||||
}
|
||||
],
|
||||
alipayPublicKey: [
|
||||
{
|
||||
required: true,
|
||||
type: "string",
|
||||
message: "请填写支付宝公钥",
|
||||
trigger: "blur"
|
||||
}
|
||||
],
|
||||
privateKey: [
|
||||
{
|
||||
required: true,
|
||||
type: "string",
|
||||
message: "请填写应用私钥",
|
||||
trigger: "blur"
|
||||
}
|
||||
]
|
||||
});
|
||||
|
||||
const onCopyText = (text) => {
|
||||
copyText(text);
|
||||
};
|
||||
|
||||
const onApiclientKey = (e) => {
|
||||
const response = e.file.response
|
||||
const parse = JSON.parse(response);
|
||||
console.log(parse);
|
||||
form.apiclientKey = e.file.response
|
||||
}
|
||||
|
||||
const onUpload = (d: ItemType) => {
|
||||
uploadFile(<File>d.file)
|
||||
.then((result) => {
|
||||
form.logo = result.path;
|
||||
message.success("上传成功");
|
||||
})
|
||||
.catch((e) => {
|
||||
message.error(e.message);
|
||||
});
|
||||
};
|
||||
|
||||
const onClose = () => {
|
||||
form.logo = undefined;
|
||||
};
|
||||
|
||||
/* 保存编辑 */
|
||||
const save = () => {
|
||||
if (!formRef.value) {
|
||||
return;
|
||||
}
|
||||
formRef.value
|
||||
.validate()
|
||||
.then(() => {
|
||||
loading.value = true;
|
||||
const appForm = {
|
||||
...form,
|
||||
content: JSON.stringify(form)
|
||||
};
|
||||
const saveOrUpdate = isUpdate.value ? updateSetting : addSetting;
|
||||
saveOrUpdate(appForm)
|
||||
.then((msg) => {
|
||||
message.success("保存成功");
|
||||
})
|
||||
.catch((e) => {
|
||||
message.error(e.message);
|
||||
});
|
||||
})
|
||||
.catch(() => {
|
||||
});
|
||||
};
|
||||
|
||||
|
||||
watch(
|
||||
() => props.data,
|
||||
(data) => {
|
||||
if (data?.settingId) {
|
||||
isUpdate.value = true;
|
||||
// 表单赋值
|
||||
if (data.content) {
|
||||
const jsonData = JSON.parse(data.content);
|
||||
assignFields(jsonData);
|
||||
}
|
||||
// 其他必要参数
|
||||
form.settingId = data.settingId;
|
||||
form.settingKey = data.settingKey;
|
||||
} else {
|
||||
// 新增
|
||||
isUpdate.value = false;
|
||||
resetFields();
|
||||
form.settingKey = props.value;
|
||||
}
|
||||
}
|
||||
);
|
||||
</script>
|
||||
|
||||
<style lang="less">
|
||||
.small {
|
||||
color: var(--text-color-secondary);
|
||||
font-size: 14px !important;
|
||||
}
|
||||
</style>
|
||||
214
src/views/system/setting/components/printer.vue
Normal file
214
src/views/system/setting/components/printer.vue
Normal file
@@ -0,0 +1,214 @@
|
||||
<template>
|
||||
<a-card :bordered="false">
|
||||
<a-form
|
||||
ref="formRef"
|
||||
:model="form"
|
||||
:rules="rules"
|
||||
:label-col="styleResponsive ? { md: 3, sm: 7, xs: 24 } : { flex: '90px' }"
|
||||
:wrapper-col="styleResponsive ? { md: 9, sm: 19, xs: 24 } : { flex: '1' }"
|
||||
>
|
||||
<a-form-item label="是否开启小票打印" name="isOpenPrinter">
|
||||
<a-radio-group v-model:value="form.isOpenPrinter">
|
||||
<a-radio value="1">开启</a-radio>
|
||||
<a-radio value="0">关闭</a-radio>
|
||||
</a-radio-group>
|
||||
</a-form-item>
|
||||
<template v-if="form.isOpenPrinter === '1'">
|
||||
<a-form-item label="打印机类型" name="printerType">
|
||||
<a-radio-group v-model:value="form.printerType">
|
||||
<a-radio value="1">飞鹅打印机</a-radio>
|
||||
<a-radio value="2">365云打印</a-radio>
|
||||
</a-radio-group>
|
||||
</a-form-item>
|
||||
<a-form-item label="USER" name="printerUser" v-if="form.printerType === '1'" extra="飞鹅云后台注册用户名">
|
||||
<a-input
|
||||
allow-clear
|
||||
:maxlength="20"
|
||||
placeholder="请输入飞鹅云后台注册用户名"
|
||||
v-model:value="form.printerUser"
|
||||
/>
|
||||
</a-form-item>
|
||||
<a-form-item label="UKEY" name="printerUserKey" v-if="form.printerType === '1'" extra="飞鹅云后台登录生成的UKEY">
|
||||
<a-input
|
||||
allow-clear
|
||||
:maxlength="20"
|
||||
placeholder="请输入飞鹅云后台登录生成的UKEY"
|
||||
v-model:value="form.printerUserKey"
|
||||
/>
|
||||
</a-form-item>
|
||||
<a-form-item label="打印机编号" name="printerCode" extra="打印机编号为9位数字">
|
||||
<a-input
|
||||
allow-clear
|
||||
:maxlength="20"
|
||||
placeholder="请输入打印机编号"
|
||||
v-model:value="form.printerCode"
|
||||
/>
|
||||
</a-form-item>
|
||||
<a-form-item label="打印机秘钥" name="printerKey" v-if="form.printerType === '2'">
|
||||
<a-input
|
||||
allow-clear
|
||||
:maxlength="20"
|
||||
placeholder="请输入打印机编号"
|
||||
v-model:value="form.printerKey"
|
||||
/>
|
||||
<small class="small" v-if="form.printerType === '1'">打印机编号为9位数字，查看飞鹅打印机底部贴纸上面的编号</small>
|
||||
</a-form-item>
|
||||
<a-form-item label="打印联数" name="printerTimes" extra="同一订单，打印的次数">
|
||||
<a-input-number
|
||||
:min="0"
|
||||
style="width: 180px"
|
||||
placeholder="请输入打印联数"
|
||||
v-model:value="form.printerTimes"
|
||||
/>
|
||||
</a-form-item>
|
||||
<a-form-item label="订单打印方式" name="printerStatus">
|
||||
<a-checkbox-group v-model:value="form.printerStatus">
|
||||
<a-checkbox value="20">订单付款时</a-checkbox>
|
||||
</a-checkbox-group>
|
||||
</a-form-item>
|
||||
</template>
|
||||
<a-form-item label="操作">
|
||||
<a-button
|
||||
type="primary"
|
||||
class="ele-btn-icon"
|
||||
@click="save"
|
||||
>
|
||||
<span>保存</span>
|
||||
</a-button>
|
||||
</a-form-item>
|
||||
</a-form>
|
||||
</a-card>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import { reactive, ref, watch } from 'vue';
|
||||
import { message } from 'ant-design-vue';
|
||||
import { Setting } from '@/api/system/setting/model';
|
||||
import { useThemeStore } from '@/store/modules/theme';
|
||||
import { storeToRefs } from 'pinia';
|
||||
import { FormInstance } from 'ant-design-vue/es/form';
|
||||
import useFormData from '@/utils/use-form-data';
|
||||
import { addSetting, updateSetting } from "@/api/system/setting";
|
||||
import { ItemType } from "ele-admin-pro/es/ele-image-upload/types";
|
||||
import { uploadFile } from "@/api/system/file";
|
||||
import { FILE_SERVER } from "@/config/setting";
|
||||
|
||||
const props = defineProps<{
|
||||
// 当前选项卡
|
||||
value?: string;
|
||||
// 修改回显的数据
|
||||
data?: Setting | null;
|
||||
}>();
|
||||
|
||||
// 保存字段信息(设定好key和描述,content里的字段是随意加的会自动转为json保存到数据库)
|
||||
const settingId = ref(undefined);
|
||||
const settingKey = ref('printer');
|
||||
const comments = ref('打印设置');
|
||||
// 是否开启响应式布局
|
||||
const themeStore = useThemeStore();
|
||||
const { styleResponsive } = storeToRefs(themeStore);
|
||||
// 编辑器内容，双向绑定
|
||||
const logo = ref<any>([]);
|
||||
// 提交状态
|
||||
const loading = ref(false);
|
||||
// 是否是修改
|
||||
const isUpdate = ref(false);
|
||||
//
|
||||
const formRef = ref<FormInstance | null>(null);
|
||||
// 表单数据
|
||||
const { form, resetFields, assignFields } = useFormData<Setting>({
|
||||
isOpenPrinter: '0',
|
||||
printerType: '1',
|
||||
printerStatus: '20',
|
||||
printerUser: '',
|
||||
printerUserKey: '',
|
||||
printerCode: '',
|
||||
printerKey: '',
|
||||
printerTimes: '',
|
||||
tenantId: localStorage.getItem('TenantId')
|
||||
});
|
||||
|
||||
// 表单验证规则
|
||||
const rules = reactive({
|
||||
siteName: [
|
||||
{
|
||||
required: true,
|
||||
message: '请输入系统名称',
|
||||
type: 'string',
|
||||
trigger: 'blur'
|
||||
}
|
||||
],
|
||||
comments: [
|
||||
{
|
||||
required: true,
|
||||
message: '请输入站点描述',
|
||||
type: 'string',
|
||||
trigger: 'blur'
|
||||
}
|
||||
]
|
||||
});
|
||||
|
||||
const onUpload = (d: ItemType) => {
|
||||
uploadFile(<File>d.file)
|
||||
.then((result) => {
|
||||
form.logo = result.path;
|
||||
message.success('上传成功');
|
||||
})
|
||||
.catch((e) => {
|
||||
message.error(e.message);
|
||||
});
|
||||
};
|
||||
|
||||
const onClose = () => {
|
||||
form.logo = undefined
|
||||
}
|
||||
|
||||
|
||||
|
||||
/* 保存编辑 */
|
||||
const save = () => {
|
||||
if (!formRef.value) {
|
||||
return;
|
||||
}
|
||||
formRef.value
|
||||
.validate()
|
||||
.then(() => {
|
||||
loading.value = true;
|
||||
const appForm = {
|
||||
...form,
|
||||
content: JSON.stringify(form)
|
||||
};
|
||||
const saveOrUpdate = isUpdate.value ? updateSetting : addSetting;
|
||||
saveOrUpdate(appForm)
|
||||
.then((msg) => {
|
||||
message.success('保存成功');
|
||||
})
|
||||
.catch((e) => {
|
||||
message.error(e.message);
|
||||
});
|
||||
})
|
||||
.catch(() => {});
|
||||
};
|
||||
|
||||
watch(
|
||||
() => props.data,
|
||||
(data) => {
|
||||
if(data?.settingId){
|
||||
isUpdate.value = true
|
||||
// 表单赋值
|
||||
if(data.content){
|
||||
const jsonData = JSON.parse(data.content);
|
||||
assignFields(jsonData);
|
||||
}
|
||||
// 其他必要参数
|
||||
form.settingId = data.settingId
|
||||
form.settingKey = data.settingKey
|
||||
} else {
|
||||
// 新增
|
||||
isUpdate.value = false
|
||||
resetFields();
|
||||
form.settingKey = props.value
|
||||
}
|
||||
}
|
||||
);
|
||||
</script>
|
||||
102
src/views/system/setting/components/privacy.vue
Normal file
102
src/views/system/setting/components/privacy.vue
Normal file
@@ -0,0 +1,102 @@
|
||||
<template>
|
||||
<a-card :bordered="false">
|
||||
<a-form
|
||||
ref="formRef"
|
||||
:model="form"
|
||||
:label-col="styleResponsive ? { md: 3, sm: 5, xs: 24 } : { flex: '90px' }"
|
||||
:wrapper-col="styleResponsive ? { md: 9, sm: 19, xs: 24 } : { flex: '1' }"
|
||||
>
|
||||
<a-form-item label="允许被搜索" name="name" extra="关闭后，用户无法通过名称搜索到此网站">
|
||||
<a-switch v-model:checked="form.searched" 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-form-item label="隐藏底部版权信息" name="showAdminCopyright">
|
||||
<a-switch v-model:checked="form.showAdminCopyright" checked-children="显示" un-checked-children="隐藏" @change="save" />
|
||||
</a-form-item>
|
||||
</a-form>
|
||||
</a-card>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import {ref, watch} from 'vue';
|
||||
import {message} from 'ant-design-vue';
|
||||
import {useThemeStore} from '@/store/modules/theme';
|
||||
import {storeToRefs} from 'pinia';
|
||||
import {FormInstance} from 'ant-design-vue/es/form';
|
||||
import useFormData from '@/utils/use-form-data';
|
||||
import {addSetting, updateSettingByKey} from "@/api/system/setting";
|
||||
import {useWebsiteSettingStore} from "@/store/modules/setting";
|
||||
|
||||
const props = defineProps<{
|
||||
value?: string;
|
||||
// 修改回显的数据
|
||||
data?: any | null;
|
||||
}>();
|
||||
|
||||
// 是否开启响应式布局
|
||||
const themeStore = useThemeStore();
|
||||
const settingStore = useWebsiteSettingStore();
|
||||
const {styleResponsive} = storeToRefs(themeStore);
|
||||
// 提交状态
|
||||
const loading = ref(false);
|
||||
// 是否是修改
|
||||
const isUpdate = ref(false);
|
||||
//
|
||||
const formRef = ref<FormInstance | null>(null);
|
||||
// 表单数据
|
||||
const {form, resetFields, assignFields} = useFormData<any>({
|
||||
settingId: undefined,
|
||||
settingKey: 'privacy',
|
||||
searched: undefined,
|
||||
showAdminCopyright: ''
|
||||
});
|
||||
|
||||
/* 保存编辑 */
|
||||
const save = () => {
|
||||
if (!formRef.value) {
|
||||
return;
|
||||
}
|
||||
formRef.value
|
||||
.validate()
|
||||
.then(() => {
|
||||
loading.value = true;
|
||||
// 更新状态
|
||||
settingStore.setSetting(form)
|
||||
const appForm = {
|
||||
...form,
|
||||
content: JSON.stringify(form)
|
||||
};
|
||||
const saveOrUpdate = isUpdate.value ? updateSettingByKey : addSetting;
|
||||
saveOrUpdate(appForm)
|
||||
.then(() => {
|
||||
message.success('保存成功');
|
||||
})
|
||||
.catch((e) => {
|
||||
message.error(e.message);
|
||||
});
|
||||
})
|
||||
.catch(() => {
|
||||
});
|
||||
};
|
||||
|
||||
watch(
|
||||
() => props.data,
|
||||
(data) => {
|
||||
console.log(data,'propss')
|
||||
if (data?.settingKey) {
|
||||
isUpdate.value = true
|
||||
// 表单赋值
|
||||
assignFields(data);
|
||||
} else {
|
||||
// 新增
|
||||
isUpdate.value = false
|
||||
resetFields();
|
||||
}
|
||||
}
|
||||
);
|
||||
</script>
|
||||
236
src/views/system/setting/components/register.vue
Normal file
236
src/views/system/setting/components/register.vue
Normal file
@@ -0,0 +1,236 @@
|
||||
<template>
|
||||
<a-card :bordered="false">
|
||||
<a-form
|
||||
ref="formRef"
|
||||
:model="form"
|
||||
:rules="rules"
|
||||
:label-col="styleResponsive ? { md: 3, sm: 5, xs: 24 } : { flex: '90px' }"
|
||||
:wrapper-col="styleResponsive ? { md: 9, sm: 19, xs: 24 } : { flex: '1' }"
|
||||
>
|
||||
<a-form-item label="默认登录/注册方式" name="type">
|
||||
<a-radio-group v-model:value="form.type">
|
||||
<a-radio :value="1">手机号+短信验证码</a-radio>
|
||||
</a-radio-group>
|
||||
</a-form-item>
|
||||
<a-form-item label="请选择默认角色" name="roleId">
|
||||
<role-select v-model:value="form.roleId" />
|
||||
</a-form-item>
|
||||
<div style="margin-bottom: 22px; width: 750px;">
|
||||
<a-divider>微信小程序授权登录</a-divider>
|
||||
</div>
|
||||
<a-form-item label="一键授权登录/注册" name="openWxAuth">
|
||||
<a-radio-group v-model:value="form.openWxAuth">
|
||||
<a-radio :value="1">开启</a-radio>
|
||||
<a-radio :value="0">关闭</a-radio>
|
||||
</a-radio-group>
|
||||
</a-form-item>
|
||||
<a-form-item label="注册时绑定手机号" name="openWxBindPhone">
|
||||
<a-radio-group v-model:value="form.openWxBindPhone">
|
||||
<a-radio :value="1">强制绑定</a-radio>
|
||||
<a-radio :value="0">不绑定</a-radio>
|
||||
</a-radio-group>
|
||||
</a-form-item>
|
||||
<div style="margin-bottom: 22px; width: 750px;">
|
||||
<a-divider>微信公众号授权登录</a-divider>
|
||||
</div>
|
||||
<a-form-item label="一键授权登录/注册" name="openWxofficialAuth">
|
||||
<a-radio-group v-model:value="form.openWxofficialAuth">
|
||||
<a-radio :value="1">开启</a-radio>
|
||||
<a-radio :value="0">关闭</a-radio>
|
||||
</a-radio-group>
|
||||
</a-form-item>
|
||||
<a-form-item label="注册时绑定手机号" name="openBindPhone">
|
||||
<a-space direction="vertical">
|
||||
<a-radio-group v-model:value="form.openWxofficialBindPhone"
|
||||
style="margin-top: 5px">
|
||||
<a-radio :value="1">强制绑定</a-radio>
|
||||
<a-radio :value="0">不绑定</a-radio>
|
||||
</a-radio-group>
|
||||
</a-space>
|
||||
</a-form-item>
|
||||
<a-form-item label="登录超时时间" name="tokenExpireTime">
|
||||
<a-space direction="vertical">
|
||||
<a-input
|
||||
allow-clear
|
||||
:maxlength="30"
|
||||
placeholder="请输入登录超时时间"
|
||||
v-model:value="form.tokenExpireTime"
|
||||
/>
|
||||
<a-button
|
||||
type="primary"
|
||||
class="ele-btn-icon"
|
||||
style="margin-top: 10px"
|
||||
@click="save"
|
||||
>
|
||||
<span>保存</span>
|
||||
</a-button>
|
||||
</a-space>
|
||||
</a-form-item>
|
||||
</a-form>
|
||||
</a-card>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import { reactive, ref, watch } from 'vue';
|
||||
import { message } from 'ant-design-vue';
|
||||
import { Setting } from '@/api/system/setting/model';
|
||||
import { useThemeStore } from '@/store/modules/theme';
|
||||
import { storeToRefs } from 'pinia';
|
||||
import { FormInstance } from 'ant-design-vue/es/form';
|
||||
import useFormData from '@/utils/use-form-data';
|
||||
import { addSetting, updateSetting } from "@/api/system/setting";
|
||||
import { ItemType } from "ele-admin-pro/es/ele-image-upload/types";
|
||||
import { uploadFile } from "@/api/system/file";
|
||||
import RoleSelect from './role-select.vue';
|
||||
import { FILE_SERVER } from "@/config/setting";
|
||||
import { Role } from "@/api/system/role/model";
|
||||
|
||||
const props = defineProps<{
|
||||
value?: string;
|
||||
// 修改回显的数据
|
||||
data?: Setting | null;
|
||||
}>();
|
||||
|
||||
// 保存字段信息(设定好key和描述,content里的字段是随意加的会自动转为json保存到数据库)
|
||||
const settingId = ref(undefined);
|
||||
const settingKey = ref('register');
|
||||
|
||||
// 是否开启响应式布局
|
||||
const themeStore = useThemeStore();
|
||||
const { styleResponsive } = storeToRefs(themeStore);
|
||||
// 编辑器内容，双向绑定
|
||||
const logo = ref<any>([]);
|
||||
// 提交状态
|
||||
const loading = ref(false);
|
||||
// 是否是修改
|
||||
const isUpdate = ref(false);
|
||||
//
|
||||
const formRef = ref<FormInstance | null>(null);
|
||||
// 表单数据
|
||||
const { form, resetFields, assignFields } = useFormData<Setting>({
|
||||
settingKey: '',
|
||||
type: 1,
|
||||
roleId: undefined,
|
||||
openWxAuth: 1,
|
||||
openWxBindPhone: 1,
|
||||
openWxofficialAuth: 1,
|
||||
openWxofficialBindPhone: 1,
|
||||
tokenExpireTime: 86400,
|
||||
comments: '',
|
||||
tenantId: localStorage.getItem('TenantId')
|
||||
});
|
||||
|
||||
// 表单验证规则
|
||||
const rules = reactive({
|
||||
type: [
|
||||
{
|
||||
required: true,
|
||||
message: '请选择默认注册方式',
|
||||
type: 'number',
|
||||
trigger: 'blur'
|
||||
}
|
||||
],
|
||||
roleId: [
|
||||
{
|
||||
required: true,
|
||||
message: '请选择默认角色',
|
||||
type: 'number',
|
||||
trigger: 'blur'
|
||||
}
|
||||
],
|
||||
openWxAuth: [
|
||||
{
|
||||
required: true,
|
||||
message: '请输入系统名称',
|
||||
type: 'number',
|
||||
trigger: 'blur'
|
||||
}
|
||||
],
|
||||
openWxBindPhone: [
|
||||
{
|
||||
required: true,
|
||||
message: '请输入系统名称',
|
||||
type: 'number',
|
||||
trigger: 'blur'
|
||||
}
|
||||
],
|
||||
openWxofficialAuth: [
|
||||
{
|
||||
required: true,
|
||||
message: '请输入系统名称',
|
||||
type: 'number',
|
||||
trigger: 'blur'
|
||||
}
|
||||
],
|
||||
openWxofficialBindPhone: [
|
||||
{
|
||||
required: true,
|
||||
message: '请输入系统名称',
|
||||
type: 'number',
|
||||
trigger: 'blur'
|
||||
}
|
||||
]
|
||||
});
|
||||
|
||||
const onUpload = (d: ItemType) => {
|
||||
uploadFile(<File>d.file)
|
||||
.then((result) => {
|
||||
form.logo = result.path;
|
||||
message.success('上传成功');
|
||||
})
|
||||
.catch((e) => {
|
||||
message.error(e.message);
|
||||
});
|
||||
};
|
||||
|
||||
const onClose = () => {
|
||||
form.logo = undefined
|
||||
}
|
||||
|
||||
/* 保存编辑 */
|
||||
const save = () => {
|
||||
if (!formRef.value) {
|
||||
return;
|
||||
}
|
||||
formRef.value
|
||||
.validate()
|
||||
.then(() => {
|
||||
loading.value = true;
|
||||
const appForm = {
|
||||
...form,
|
||||
content: JSON.stringify(form)
|
||||
};
|
||||
const saveOrUpdate = isUpdate.value ? updateSetting : addSetting;
|
||||
saveOrUpdate(appForm)
|
||||
.then((msg) => {
|
||||
message.success('保存成功');
|
||||
})
|
||||
.catch((e) => {
|
||||
message.error(e.message);
|
||||
});
|
||||
})
|
||||
.catch(() => {});
|
||||
};
|
||||
|
||||
watch(
|
||||
() => props.data,
|
||||
(data) => {
|
||||
if(data?.settingId){
|
||||
isUpdate.value = true
|
||||
// 表单赋值
|
||||
if(data.content){
|
||||
const jsonData = JSON.parse(data.content);
|
||||
assignFields(jsonData);
|
||||
}
|
||||
// 其他必要参数
|
||||
form.settingId = data.settingId
|
||||
form.settingKey = data.settingKey
|
||||
} else {
|
||||
// 新增
|
||||
isUpdate.value = false
|
||||
resetFields();
|
||||
form.settingKey = settingKey.value
|
||||
}
|
||||
}
|
||||
);
|
||||
</script>
|
||||
64
src/views/system/setting/components/role-select.vue
Normal file
64
src/views/system/setting/components/role-select.vue
Normal file
@@ -0,0 +1,64 @@
|
||||
<!-- 角色选择下拉框 -->
|
||||
<template>
|
||||
<a-select
|
||||
allow-clear
|
||||
:value="value"
|
||||
:placeholder="placeholder"
|
||||
@update:value="updateValue"
|
||||
@blur="onBlur"
|
||||
>
|
||||
<a-select-option
|
||||
v-for="item in data"
|
||||
:key="item.roleId"
|
||||
:value="item.roleId"
|
||||
>
|
||||
{{ item.roleName }}
|
||||
</a-select-option>
|
||||
</a-select>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import { ref } from 'vue';
|
||||
import { message } from 'ant-design-vue/es';
|
||||
import { listRoles } from '@/api/system/role';
|
||||
import type { Role } from '@/api/system/role/model';
|
||||
|
||||
const emit = defineEmits<{
|
||||
(e: 'update:value', value): void;
|
||||
(e: 'blur'): void;
|
||||
}>();
|
||||
|
||||
withDefaults(
|
||||
defineProps<{
|
||||
// 选中的角色
|
||||
value?: Role[];
|
||||
//
|
||||
placeholder?: string;
|
||||
}>(),
|
||||
{
|
||||
placeholder: '请选择角色'
|
||||
}
|
||||
);
|
||||
|
||||
// 角色数据
|
||||
const data = ref<Role[]>([]);
|
||||
|
||||
/* 更新选中数据 */
|
||||
const updateValue = (value) => {
|
||||
emit('update:value', value);
|
||||
};
|
||||
|
||||
/* 获取角色数据 */
|
||||
listRoles()
|
||||
.then((list) => {
|
||||
data.value = list;
|
||||
})
|
||||
.catch((e) => {
|
||||
message.error(e.message);
|
||||
});
|
||||
|
||||
/* 失去焦点 */
|
||||
const onBlur = () => {
|
||||
emit('blur');
|
||||
};
|
||||
</script>
|
||||
246
src/views/system/setting/components/sms.vue
Normal file
246
src/views/system/setting/components/sms.vue
Normal file
@@ -0,0 +1,246 @@
|
||||
<template>
|
||||
<a-card :bordered="false">
|
||||
<a-form
|
||||
ref="formRef"
|
||||
:model="form"
|
||||
:rules="rules"
|
||||
:label-col="styleResponsive ? { md: 3, sm: 5, xs: 24 } : { flex: '90px' }"
|
||||
:wrapper-col="styleResponsive ? { md: 9, sm: 19, xs: 24 } : { flex: '1' }"
|
||||
>
|
||||
<a-form-item label="短信平台" name="type">
|
||||
<a-radio-group v-model:value="form.type">
|
||||
<a-radio :value="1">阿里云</a-radio>
|
||||
<a-radio :value="2">腾讯云</a-radio>
|
||||
<a-radio :value="3">七牛元</a-radio>
|
||||
</a-radio-group>
|
||||
</a-form-item>
|
||||
<a-form-item label="AccessKeyId" name="accessKeyId">
|
||||
<a-input
|
||||
allow-clear
|
||||
:maxlength="20"
|
||||
placeholder="请输入AccessKeyId"
|
||||
v-model:value="form.accessKeyId"
|
||||
/>
|
||||
</a-form-item>
|
||||
<a-form-item label="AccessKeySecret" name="accessKeySecret">
|
||||
<a-input
|
||||
allow-clear
|
||||
:maxlength="20"
|
||||
placeholder="请输入AccessKeySecret"
|
||||
v-model:value="form.accessKeySecret"
|
||||
/>
|
||||
</a-form-item>
|
||||
<a-form-item label="短信签名" name="sign">
|
||||
<a-input
|
||||
allow-clear
|
||||
:maxlength="20"
|
||||
placeholder="请输入短信签名"
|
||||
v-model:value="form.sign"
|
||||
/>
|
||||
</a-form-item>
|
||||
<div style="margin-bottom: 22px; width: 750px;">
|
||||
<a-divider>短信验证码 (通知用户)</a-divider>
|
||||
</div>
|
||||
<a-form-item label="是否开启" name="isOpenNotice">
|
||||
<a-radio-group v-model:value="form.isNoticeUser">
|
||||
<a-radio value="1">开启</a-radio>
|
||||
<a-radio value="0">关闭</a-radio>
|
||||
</a-radio-group>
|
||||
</a-form-item>
|
||||
<a-form-item label="模板内容" name="isContent">
|
||||
验证码${code}，您正在进行身份验证，打死不要告诉别人哦！
|
||||
</a-form-item>
|
||||
<a-form-item label="模板ID" name="userTemplateId">
|
||||
<a-input
|
||||
allow-clear
|
||||
:maxlength="20"
|
||||
placeholder="请输入模板ID"
|
||||
v-model:value="form.userTemplateId"
|
||||
/>
|
||||
</a-form-item>
|
||||
|
||||
<div style="margin-bottom: 22px; width: 750px;">
|
||||
<a-divider>新付款订单 (通知商家)</a-divider>
|
||||
</div>
|
||||
|
||||
<a-form-item label="是否开启" name="isNoticeMerchant">
|
||||
<a-radio-group v-model:value="form.isNoticeMerchant">
|
||||
<a-radio value="1">开启</a-radio>
|
||||
<a-radio value="0">关闭</a-radio>
|
||||
</a-radio-group>
|
||||
</a-form-item>
|
||||
<a-form-item label="模板内容" name="isContent">
|
||||
验证码${code}，您正在进行身份验证，打死不要告诉别人哦！
|
||||
</a-form-item>
|
||||
<a-form-item label="模板ID" name="merchantTemplateId">
|
||||
<a-input
|
||||
allow-clear
|
||||
:maxlength="20"
|
||||
placeholder="请输入模板ID"
|
||||
v-model:value="form.merchantTemplateId"
|
||||
/>
|
||||
</a-form-item>
|
||||
<a-form-item label="接收手机号" name="mobile">
|
||||
<a-input
|
||||
allow-clear
|
||||
:maxlength="20"
|
||||
placeholder="请输入接收手机号"
|
||||
v-model:value="form.merchantMobiles"
|
||||
/>
|
||||
<a-button
|
||||
type="primary"
|
||||
class="ele-btn-icon"
|
||||
style="margin-top: 10px"
|
||||
@click="save"
|
||||
>
|
||||
<span>保存</span>
|
||||
</a-button>
|
||||
</a-form-item>
|
||||
|
||||
</a-form>
|
||||
</a-card>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import { reactive, ref, watch } from 'vue';
|
||||
import { message } from 'ant-design-vue';
|
||||
import { Setting } from '@/api/system/setting/model';
|
||||
import { useThemeStore } from '@/store/modules/theme';
|
||||
import { storeToRefs } from 'pinia';
|
||||
import { FormInstance } from 'ant-design-vue/es/form';
|
||||
import useFormData from '@/utils/use-form-data';
|
||||
import { addSetting, listSetting, updateSetting } from "@/api/system/setting";
|
||||
import { ItemType } from "ele-admin-pro/es/ele-image-upload/types";
|
||||
import { uploadFile } from "@/api/system/file";
|
||||
import { FILE_SERVER } from "@/config/setting";
|
||||
|
||||
const props = defineProps<{
|
||||
// 当前选项卡
|
||||
value?: string;
|
||||
// 修改回显的数据
|
||||
data?: Setting | null;
|
||||
}>();
|
||||
|
||||
const emit = defineEmits<{
|
||||
(e: 'done', value): void;
|
||||
}>();
|
||||
|
||||
// 保存字段信息(设定好key和描述,content里的字段是随意加的会自动转为json保存到数据库)
|
||||
const settingId = ref<number>();
|
||||
const settingKey = ref('');
|
||||
// 是否开启响应式布局
|
||||
const themeStore = useThemeStore();
|
||||
const { styleResponsive } = storeToRefs(themeStore);
|
||||
// 编辑器内容，双向绑定
|
||||
const logo = ref<any>([]);
|
||||
// 提交状态
|
||||
const loading = ref(false);
|
||||
// 是否是修改
|
||||
const isUpdate = ref(false);
|
||||
//
|
||||
const formRef = ref<FormInstance | null>(null);
|
||||
// 表单数据
|
||||
const { form, resetFields, assignFields } = useFormData<Setting>({
|
||||
settingKey: '',
|
||||
type: 1,
|
||||
accessKeyId: '',
|
||||
accessKeySecret: '',
|
||||
sign: '',
|
||||
isNoticeUser: '1',
|
||||
userTemplateId: '',
|
||||
merchantTemplateId: '',
|
||||
isNoticeMerchant: '1',
|
||||
merchantMobiles: '',
|
||||
tenantId: localStorage.getItem('TenantId')
|
||||
});
|
||||
|
||||
// 表单验证规则
|
||||
const rules = reactive({
|
||||
accessKeyId: [
|
||||
{
|
||||
required: true,
|
||||
message: '请输入accessKeyId',
|
||||
type: 'string',
|
||||
trigger: 'blur'
|
||||
}
|
||||
],
|
||||
accessKeySecret: [
|
||||
{
|
||||
required: true,
|
||||
message: '请输入accessKeySecret',
|
||||
type: 'string',
|
||||
trigger: 'blur'
|
||||
}
|
||||
],
|
||||
sign: [
|
||||
{
|
||||
required: true,
|
||||
message: '请输入短信签名',
|
||||
type: 'string',
|
||||
trigger: 'blur'
|
||||
}
|
||||
]
|
||||
});
|
||||
|
||||
const onUpload = (d: ItemType) => {
|
||||
uploadFile(<File>d.file)
|
||||
.then((result) => {
|
||||
form.logo = result.path;
|
||||
message.success('上传成功');
|
||||
})
|
||||
.catch((e) => {
|
||||
message.error(e.message);
|
||||
});
|
||||
};
|
||||
|
||||
const onClose = () => {
|
||||
form.logo = undefined
|
||||
}
|
||||
|
||||
/* 保存编辑 */
|
||||
const save = () => {
|
||||
if (!formRef.value) {
|
||||
return;
|
||||
}
|
||||
formRef.value
|
||||
.validate()
|
||||
.then(() => {
|
||||
loading.value = true;
|
||||
const appForm = {
|
||||
...form,
|
||||
content: JSON.stringify(form)
|
||||
};
|
||||
const saveOrUpdate = isUpdate.value ? updateSetting : addSetting;
|
||||
saveOrUpdate(appForm)
|
||||
.then((msg) => {
|
||||
message.success('保存成功');
|
||||
})
|
||||
.catch((e) => {
|
||||
message.error(e.message);
|
||||
});
|
||||
})
|
||||
.catch(() => {});
|
||||
};
|
||||
|
||||
watch(
|
||||
() => props.data,
|
||||
(data) => {
|
||||
if(data?.settingId){
|
||||
isUpdate.value = true
|
||||
// 表单赋值
|
||||
if(data.content){
|
||||
const jsonData = JSON.parse(data.content);
|
||||
assignFields(jsonData);
|
||||
}
|
||||
// 其他必要参数
|
||||
form.settingId = data.settingId
|
||||
form.settingKey = data.settingKey
|
||||
} else {
|
||||
// 新增
|
||||
isUpdate.value = false
|
||||
resetFields();
|
||||
form.settingKey = props.value
|
||||
}
|
||||
}
|
||||
);
|
||||
</script>
|
||||
313
src/views/system/setting/components/upload.vue
Normal file
313
src/views/system/setting/components/upload.vue
Normal file
@@ -0,0 +1,313 @@
|
||||
<template>
|
||||
<a-card :bordered="false">
|
||||
<a-form
|
||||
ref="formRef"
|
||||
:model="form"
|
||||
:rules="rules"
|
||||
:label-col="styleResponsive ? { md: 3, sm: 5, xs: 24 } : { flex: '90px' }"
|
||||
:wrapper-col="styleResponsive ? { md: 9, sm: 19, xs: 24 } : { flex: '1' }"
|
||||
>
|
||||
<a-form-item label="默认上传方式" name="uploadMethod">
|
||||
<a-radio-group v-model:value="form.uploadMethod" @click="onMethod">
|
||||
<a-radio-button disabled value="file">本地</a-radio-button>
|
||||
<a-radio-button value="oss">阿里云</a-radio-button>
|
||||
<a-radio-button disabled value="cos">腾讯云</a-radio-button>
|
||||
<a-radio-button disabled value="kodo">七牛云</a-radio-button>
|
||||
</a-radio-group>
|
||||
</a-form-item>
|
||||
<template v-if="form.uploadMethod !== 'file'">
|
||||
<a-form-item
|
||||
label="存储空间名称"
|
||||
name="bucketName"
|
||||
>
|
||||
<a-input
|
||||
v-model:value="form.bucketName"
|
||||
placeholder="存储空间名称"
|
||||
/>
|
||||
</a-form-item>
|
||||
<a-form-item
|
||||
label="Region域名"
|
||||
name="endpoint"
|
||||
>
|
||||
<a-input
|
||||
v-model:value="form.bucketEndpoint"
|
||||
placeholder="https://oss-cn-shenzhen.aliyuncs.com"
|
||||
/>
|
||||
</a-form-item>
|
||||
<a-form-item
|
||||
label="accessKeyId"
|
||||
name="accessKeyId"
|
||||
>
|
||||
<a-input
|
||||
v-model:value="form.accessKeyId"
|
||||
placeholder="accessKeyId"
|
||||
/>
|
||||
</a-form-item>
|
||||
<a-form-item
|
||||
label="accessKeySecret"
|
||||
name="accessKeySecret"
|
||||
>
|
||||
<a-input
|
||||
v-model:value="form.accessKeySecret"
|
||||
placeholder="accessKeySecret"
|
||||
/>
|
||||
</a-form-item>
|
||||
<a-form-item
|
||||
label="空间域名"
|
||||
name="bucketDomain"
|
||||
>
|
||||
<a-input
|
||||
v-model:value="form.bucketDomain"
|
||||
placeholder="https://oss-gxwebsoft.oss-cn-shenzhen.aliyuncs.com"
|
||||
/>
|
||||
</a-form-item>
|
||||
</template>
|
||||
<!-- 私有云 -->
|
||||
<template v-if="form.uploadMethod === 'file'">
|
||||
<a-form-item
|
||||
label="域名"
|
||||
name="fileUrl"
|
||||
>
|
||||
<a-input-group compact>
|
||||
<a-input
|
||||
v-model:value="form.fileUrl"
|
||||
placeholder="请输入文件服务器域名"
|
||||
style="width: calc(100% - 50px)"
|
||||
/>
|
||||
<a-tooltip title="复制">
|
||||
<a-button @click="onCopyText(`https://file.wsdns.cn`)">
|
||||
<template #icon><CopyOutlined /></template>
|
||||
</a-button>
|
||||
</a-tooltip>
|
||||
</a-input-group>
|
||||
</a-form-item>
|
||||
</template>
|
||||
<!-- 阿里云 -->
|
||||
<template v-if="form.uploadMethod === 'oss'">
|
||||
<a-form-item label="去申请">
|
||||
<a href="https://oss.console.aliyun.com" target="_blank">https://oss.console.aliyun.com</a>
|
||||
</a-form-item>
|
||||
</template>
|
||||
<!-- 腾讯云 -->
|
||||
<template v-if="form.uploadMethod === 'cos'">
|
||||
<a-form-item label="去申请">
|
||||
<a href="https://cloud.tencent.com/product/cos" target="_blank">https://cloud.tencent.com/product/cos</a>
|
||||
</a-form-item>
|
||||
</template>
|
||||
<!-- 七牛云 -->
|
||||
<template v-if="form.uploadMethod === 'kodo'">
|
||||
<a-form-item label="去申请">
|
||||
<a href="https://www.qiniu.com/products/kodo" target="_blank">https://www.qiniu.com/products/kodo</a>
|
||||
</a-form-item>
|
||||
</template>
|
||||
<a-form-item label="使用临时存储" v-if="form.uploadMethod === 'oss'">
|
||||
<div style="margin-top: 6px">
|
||||
<a class="" @click="onDemoOss">立即填入</a>
|
||||
<div class="ele-text-secondary">仅供体验及测试使用，空间大小和有流量有一定限制不推荐使用，正式使用请单独申请独立的云存储</div>
|
||||
</div>
|
||||
</a-form-item>
|
||||
<a-form-item label="操作">
|
||||
<a-button
|
||||
type="primary"
|
||||
class="ele-btn-icon"
|
||||
@click="save"
|
||||
>
|
||||
<span>保存</span>
|
||||
</a-button>
|
||||
</a-form-item>
|
||||
</a-form>
|
||||
</a-card>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import { reactive, ref, watch } from "vue";
|
||||
import { copyText } from "@/utils/common";
|
||||
import { message } from "ant-design-vue";
|
||||
import { CopyOutlined } from '@ant-design/icons-vue';
|
||||
import { Setting } from "@/api/system/setting/model";
|
||||
import { useThemeStore } from "@/store/modules/theme";
|
||||
import { storeToRefs } from "pinia";
|
||||
import { UploadOutlined } from '@ant-design/icons-vue';
|
||||
import { FormInstance } from "ant-design-vue/es/form";
|
||||
import useFormData from "@/utils/use-form-data";
|
||||
import { addSetting, updateSetting } from "@/api/system/setting";
|
||||
import { ItemType } from "ele-admin-pro/es/ele-image-upload/types";
|
||||
import { uploadFile } from "@/api/system/file";
|
||||
import Upload from "@/components/UploadCert/index.vue";
|
||||
import { FILE_SERVER, TOKEN_STORE_NAME } from "@/config/setting";
|
||||
|
||||
const props = defineProps<{
|
||||
value?: string;
|
||||
// 修改回显的数据
|
||||
data?: Setting | null;
|
||||
}>();
|
||||
|
||||
// 保存字段信息(设定好key和描述,content里的字段是随意加的会自动转为json保存到数据库)
|
||||
const settingId = ref(undefined);
|
||||
const settingKey = ref("upload");
|
||||
// 是否开启响应式布局
|
||||
const themeStore = useThemeStore();
|
||||
const { styleResponsive } = storeToRefs(themeStore);
|
||||
// 编辑器内容，双向绑定
|
||||
const logo = ref<any>([]);
|
||||
// 提交状态
|
||||
const loading = ref(false);
|
||||
// 是否是修改
|
||||
const isUpdate = ref(false);
|
||||
// token
|
||||
const token = localStorage.getItem(TOKEN_STORE_NAME);
|
||||
//
|
||||
const formRef = ref<FormInstance | null>(null);
|
||||
// 表单数据
|
||||
const { form, resetFields, assignFields } = useFormData<Setting>({
|
||||
uploadMethod: 'oss',
|
||||
fileUrl: 'https://file.wsdns.cn',
|
||||
bucketName: '',
|
||||
bucketEndpoint: '',
|
||||
accessKeyId: '',
|
||||
accessKeySecret: '',
|
||||
bucketDomain: '',
|
||||
tenantId: localStorage.getItem('TenantId')
|
||||
});
|
||||
|
||||
// 表单验证规则
|
||||
const rules = reactive({
|
||||
uploadMethod: [
|
||||
{
|
||||
required: true,
|
||||
type: "string",
|
||||
message: "请设置上传方式",
|
||||
trigger: "blur"
|
||||
}
|
||||
],
|
||||
bucketName: [
|
||||
{
|
||||
required: true,
|
||||
type: "string",
|
||||
message: "请填写存储空间名称",
|
||||
trigger: "blur"
|
||||
}
|
||||
],
|
||||
accessKeyId: [
|
||||
{
|
||||
required: true,
|
||||
type: "string",
|
||||
message: "请填写accessKeyId",
|
||||
trigger: "blur"
|
||||
}
|
||||
],
|
||||
accessKeySecret: [
|
||||
{
|
||||
required: true,
|
||||
type: "string",
|
||||
message: "请填写accessKeySecret",
|
||||
trigger: "blur"
|
||||
}
|
||||
],
|
||||
bucketDomain: [
|
||||
{
|
||||
required: true,
|
||||
type: "string",
|
||||
message: "请填写存储空间域名",
|
||||
trigger: "blur"
|
||||
}
|
||||
]
|
||||
});
|
||||
|
||||
const onCopyText = (text) => {
|
||||
copyText(text);
|
||||
};
|
||||
|
||||
const onMethod = (e) => {
|
||||
resetFields();
|
||||
}
|
||||
|
||||
const onDemoOss = () => {
|
||||
form.uploadMethod == 'oss'
|
||||
form.bucketName = 'oss-gxwebsoft'
|
||||
form.bucketEndpoint = 'https://oss-cn-shenzhen.aliyuncs.com'
|
||||
form.accessKeyId = 'LTAI4GKGZ9Z2Z8JZ77c3GNZP'
|
||||
form.accessKeySecret = 'BiDkpS7UXj72HWwDWaFZxiXjNFBNCM'
|
||||
form.bucketDomain = 'https://oss.wsdns.cn'
|
||||
form.settingKey = 'upload';
|
||||
}
|
||||
|
||||
const onApiclientKey = (e) => {
|
||||
const response = e.file.response
|
||||
const parse = JSON.parse(response);
|
||||
console.log(parse);
|
||||
form.apiclientKey = e.file.response
|
||||
}
|
||||
|
||||
const onUpload = (d: ItemType) => {
|
||||
uploadFile(<File>d.file)
|
||||
.then((result) => {
|
||||
form.logo = result.path;
|
||||
message.success("上传成功");
|
||||
})
|
||||
.catch((e) => {
|
||||
message.error(e.message);
|
||||
});
|
||||
};
|
||||
|
||||
const onClose = () => {
|
||||
form.logo = undefined;
|
||||
};
|
||||
|
||||
/* 保存编辑 */
|
||||
const save = () => {
|
||||
console.log(form);
|
||||
if (!formRef.value) {
|
||||
return;
|
||||
}
|
||||
formRef.value
|
||||
.validate()
|
||||
.then(() => {
|
||||
loading.value = true;
|
||||
const appForm = {
|
||||
...form,
|
||||
content: JSON.stringify(form)
|
||||
};
|
||||
const saveOrUpdate = isUpdate.value ? updateSetting : addSetting;
|
||||
saveOrUpdate(appForm)
|
||||
.then((msg) => {
|
||||
message.success("保存成功");
|
||||
})
|
||||
.catch((e) => {
|
||||
message.error(e.message);
|
||||
});
|
||||
})
|
||||
.catch(() => {
|
||||
});
|
||||
};
|
||||
|
||||
|
||||
watch(
|
||||
() => props.data,
|
||||
(data) => {
|
||||
if (data?.settingId) {
|
||||
isUpdate.value = true;
|
||||
// 表单赋值
|
||||
if (data.content) {
|
||||
const jsonData = JSON.parse(data.content);
|
||||
assignFields(jsonData);
|
||||
}
|
||||
// 其他必要参数
|
||||
form.settingId = data.settingId;
|
||||
form.settingKey = data.settingKey;
|
||||
} else {
|
||||
// 新增
|
||||
isUpdate.value = false;
|
||||
resetFields();
|
||||
form.settingKey = props.value;
|
||||
}
|
||||
}
|
||||
);
|
||||
</script>
|
||||
|
||||
<style lang="less">
|
||||
.small {
|
||||
color: var(--text-color-secondary);
|
||||
font-size: 14px !important;
|
||||
}
|
||||
</style>
|
||||
187
src/views/system/setting/components/website.vue
Normal file
187
src/views/system/setting/components/website.vue
Normal file
@@ -0,0 +1,187 @@
|
||||
<template>
|
||||
<a-card :bordered="false">
|
||||
<a-form
|
||||
ref="formRef"
|
||||
:model="form"
|
||||
:rules="rules"
|
||||
:label-col="styleResponsive ? { md: 3, sm: 5, xs: 24 } : { flex: '90px' }"
|
||||
:wrapper-col="styleResponsive ? { md: 9, sm: 19, xs: 24 } : { flex: '1' }"
|
||||
>
|
||||
<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-form>
|
||||
</a-card>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import {reactive, ref, watch} from 'vue';
|
||||
import {message} from 'ant-design-vue';
|
||||
import {Setting} from '@/api/system/setting/model';
|
||||
import {useThemeStore} from '@/store/modules/theme';
|
||||
import {storeToRefs} from 'pinia';
|
||||
import {FormInstance} from 'ant-design-vue/es/form';
|
||||
import useFormData from '@/utils/use-form-data';
|
||||
import {addSetting, updateSetting} from "@/api/system/setting";
|
||||
import {ItemType} from "ele-admin-pro/es/ele-image-upload/types";
|
||||
import {uploadFile} from "@/api/system/file";
|
||||
|
||||
const props = defineProps<{
|
||||
value?: string;
|
||||
// 修改回显的数据
|
||||
data?: Setting | null;
|
||||
}>();
|
||||
|
||||
// 保存字段信息(设定好key和描述,content里的字段是随意加的会自动转为json保存到数据库)
|
||||
const settingKey = ref('website');
|
||||
|
||||
// 是否开启响应式布局
|
||||
const themeStore = useThemeStore();
|
||||
const {styleResponsive} = storeToRefs(themeStore);
|
||||
// 提交状态
|
||||
const loading = ref(false);
|
||||
// 是否是修改
|
||||
const isUpdate = ref(false);
|
||||
//
|
||||
const formRef = ref<FormInstance | null>(null);
|
||||
// 表单数据
|
||||
const {form, resetFields, assignFields} = useFormData<Setting>({
|
||||
settingKey: 'website',
|
||||
type: 1,
|
||||
roleId: undefined,
|
||||
openWxAuth: 1,
|
||||
openWxBindPhone: 1,
|
||||
openWxofficialAuth: 1,
|
||||
openWxofficialBindPhone: 1,
|
||||
tokenExpireTime: 86400,
|
||||
comments: '',
|
||||
tenantId: localStorage.getItem('TenantId')
|
||||
});
|
||||
|
||||
// 表单验证规则
|
||||
const rules = reactive({
|
||||
type: [
|
||||
{
|
||||
required: true,
|
||||
message: '请选择默认注册方式',
|
||||
type: 'number',
|
||||
trigger: 'blur'
|
||||
}
|
||||
],
|
||||
roleId: [
|
||||
{
|
||||
required: true,
|
||||
message: '请选择默认角色',
|
||||
type: 'number',
|
||||
trigger: 'blur'
|
||||
}
|
||||
],
|
||||
openWxAuth: [
|
||||
{
|
||||
required: true,
|
||||
message: '请输入系统名称',
|
||||
type: 'number',
|
||||
trigger: 'blur'
|
||||
}
|
||||
],
|
||||
openWxBindPhone: [
|
||||
{
|
||||
required: true,
|
||||
message: '请输入系统名称',
|
||||
type: 'number',
|
||||
trigger: 'blur'
|
||||
}
|
||||
],
|
||||
openWxofficialAuth: [
|
||||
{
|
||||
required: true,
|
||||
message: '请输入系统名称',
|
||||
type: 'number',
|
||||
trigger: 'blur'
|
||||
}
|
||||
],
|
||||
openWxofficialBindPhone: [
|
||||
{
|
||||
required: true,
|
||||
message: '请输入系统名称',
|
||||
type: 'number',
|
||||
trigger: 'blur'
|
||||
}
|
||||
]
|
||||
});
|
||||
|
||||
const onUpload = (d: ItemType) => {
|
||||
uploadFile(<File>d.file)
|
||||
.then((result) => {
|
||||
form.logo = result.path;
|
||||
message.success('上传成功');
|
||||
})
|
||||
.catch((e) => {
|
||||
message.error(e.message);
|
||||
});
|
||||
};
|
||||
|
||||
const onClose = () => {
|
||||
form.logo = undefined
|
||||
}
|
||||
|
||||
/* 保存编辑 */
|
||||
const save = () => {
|
||||
if (!formRef.value) {
|
||||
return;
|
||||
}
|
||||
formRef.value
|
||||
.validate()
|
||||
.then(() => {
|
||||
loading.value = true;
|
||||
const appForm = {
|
||||
...form,
|
||||
content: JSON.stringify(form)
|
||||
};
|
||||
const saveOrUpdate = isUpdate.value ? updateSetting : addSetting;
|
||||
saveOrUpdate(appForm)
|
||||
.then((msg) => {
|
||||
message.success('保存成功');
|
||||
})
|
||||
.catch((e) => {
|
||||
message.error(e.message);
|
||||
});
|
||||
})
|
||||
.catch(() => {
|
||||
});
|
||||
};
|
||||
|
||||
watch(
|
||||
() => props.data,
|
||||
(data) => {
|
||||
if (data?.settingId) {
|
||||
isUpdate.value = true
|
||||
// 表单赋值
|
||||
if (data.content) {
|
||||
const jsonData = JSON.parse(data.content);
|
||||
assignFields(jsonData);
|
||||
}
|
||||
// 其他必要参数
|
||||
form.settingId = data.settingId
|
||||
form.settingKey = data.settingKey
|
||||
} else {
|
||||
// 新增
|
||||
isUpdate.value = false
|
||||
resetFields();
|
||||
form.settingKey = settingKey.value
|
||||
}
|
||||
}
|
||||
);
|
||||
</script>
|
||||
176
src/views/system/setting/components/wx-official.vue
Normal file
176
src/views/system/setting/components/wx-official.vue
Normal file
@@ -0,0 +1,176 @@
|
||||
<template>
|
||||
<a-card :bordered="false">
|
||||
<a-form
|
||||
ref="formRef"
|
||||
:model="form"
|
||||
:rules="rules"
|
||||
:label-col="styleResponsive ? { md: 3, sm: 5, xs: 24 } : { flex: '90px' }"
|
||||
:wrapper-col="styleResponsive ? { md: 9, sm: 19, xs: 24 } : { flex: '1' }"
|
||||
>
|
||||
<a-form-item label="开发者ID(AppID)" name="appId">
|
||||
<a-input
|
||||
allow-clear
|
||||
:maxlength="50"
|
||||
placeholder="请输入开发者ID"
|
||||
v-model:value="form.appId"
|
||||
/>
|
||||
</a-form-item>
|
||||
<a-form-item label="开发者秘钥(AppSecret)" name="appSecret">
|
||||
<a-input-password
|
||||
:maxlength="100"
|
||||
placeholder="请输入开发者秘钥AppSecret"
|
||||
v-model:value="form.appSecret"
|
||||
/>
|
||||
</a-form-item>
|
||||
<a-form-item label="原始ID" name="originalId">
|
||||
<a-input
|
||||
allow-clear
|
||||
:maxlength="20"
|
||||
placeholder="请输入原始ID"
|
||||
v-model:value="form.originalId"
|
||||
/>
|
||||
</a-form-item>
|
||||
<a-form-item label="微信号" name="wxOfficialAccount">
|
||||
<a-input
|
||||
allow-clear
|
||||
:maxlength="20"
|
||||
placeholder="请输入微信号"
|
||||
v-model:value="form.wxOfficialAccount"
|
||||
/>
|
||||
</a-form-item>
|
||||
<div style="margin-bottom: 22px; width: 750px">
|
||||
<a-divider>网页授权域名</a-divider>
|
||||
</div>
|
||||
<a-form-item label="网页授权域名" name="authorize">
|
||||
<a-input-group compact>
|
||||
<a-input
|
||||
:value="`https://server.gxwebsoft.com`"
|
||||
placeholder="请输入网页授权域名"
|
||||
style="width: calc(100% - 50px)"
|
||||
/>
|
||||
<a-tooltip title="复制">
|
||||
<a-button @click="onCopyText(`https://server.gxwebsoft.com`)">
|
||||
<template #icon><CopyOutlined /></template>
|
||||
</a-button>
|
||||
</a-tooltip>
|
||||
</a-input-group>
|
||||
|
||||
<a-button
|
||||
type="primary"
|
||||
class="ele-btn-icon"
|
||||
style="margin-top: 10px"
|
||||
@click="save"
|
||||
>
|
||||
<span>保存</span>
|
||||
</a-button>
|
||||
</a-form-item>
|
||||
</a-form>
|
||||
</a-card>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import { reactive, ref, watch } from 'vue';
|
||||
import { message } from 'ant-design-vue';
|
||||
import { Setting } from '@/api/system/setting/model';
|
||||
import { useThemeStore } from '@/store/modules/theme';
|
||||
import { storeToRefs } from 'pinia';
|
||||
import { FormInstance } from 'ant-design-vue/es/form';
|
||||
import useFormData from '@/utils/use-form-data';
|
||||
import { addSetting, updateSetting } from '@/api/system/setting';
|
||||
import { copyText } from '@/utils/common';
|
||||
import { CopyOutlined } from '@ant-design/icons-vue';
|
||||
|
||||
const props = defineProps<{
|
||||
value?: string;
|
||||
// 修改回显的数据
|
||||
data?: Setting | null;
|
||||
}>();
|
||||
|
||||
// const emit = defineEmits<{
|
||||
// (e: 'done', value): void;
|
||||
// }>();
|
||||
|
||||
// 保存字段信息(设定好key和描述,content里的字段是随意加的会自动转为json保存到数据库)
|
||||
// const settingId = ref(null);
|
||||
// const settingKey = ref('');
|
||||
// 是否开启响应式布局
|
||||
const themeStore = useThemeStore();
|
||||
const { styleResponsive } = storeToRefs(themeStore);
|
||||
// 提交状态
|
||||
const loading = ref(false);
|
||||
// 是否是修改
|
||||
const isUpdate = ref(false);
|
||||
//
|
||||
const formRef = ref<FormInstance | null>(null);
|
||||
// 表单数据
|
||||
const { form, resetFields, assignFields } = useFormData<Setting>({
|
||||
appId: '',
|
||||
appSecret: '',
|
||||
wxOfficialAccount: '',
|
||||
originalId: '',
|
||||
tenantId: localStorage.getItem('TenantId')
|
||||
});
|
||||
|
||||
// 表单验证规则
|
||||
const rules = reactive({
|
||||
chatKey: [
|
||||
{
|
||||
required: true,
|
||||
message: '请输入KEY',
|
||||
type: 'string',
|
||||
trigger: 'blur'
|
||||
}
|
||||
]
|
||||
});
|
||||
|
||||
/* 保存编辑 */
|
||||
const save = () => {
|
||||
if (!formRef.value) {
|
||||
return;
|
||||
}
|
||||
formRef.value
|
||||
.validate()
|
||||
.then(() => {
|
||||
loading.value = true;
|
||||
const appForm = {
|
||||
...form,
|
||||
content: JSON.stringify(form)
|
||||
};
|
||||
const saveOrUpdate = isUpdate.value ? updateSetting : addSetting;
|
||||
saveOrUpdate(appForm)
|
||||
.then(() => {
|
||||
message.success('保存成功');
|
||||
})
|
||||
.catch((e) => {
|
||||
message.error(e.message);
|
||||
});
|
||||
})
|
||||
.catch(() => {});
|
||||
};
|
||||
|
||||
const onCopyText = (text) => {
|
||||
copyText(text);
|
||||
};
|
||||
|
||||
watch(
|
||||
() => props.data,
|
||||
(data) => {
|
||||
if (data?.settingId) {
|
||||
isUpdate.value = true;
|
||||
// 表单赋值
|
||||
if (data.content) {
|
||||
const jsonData = JSON.parse(data.content);
|
||||
assignFields(jsonData);
|
||||
}
|
||||
// 其他必要参数
|
||||
form.settingId = data.settingId;
|
||||
form.settingKey = data.settingKey;
|
||||
} else {
|
||||
// 新增
|
||||
isUpdate.value = false;
|
||||
resetFields();
|
||||
form.settingKey = props.value;
|
||||
}
|
||||
}
|
||||
);
|
||||
</script>
|
||||
210
src/views/system/setting/components/wx-work.vue
Normal file
210
src/views/system/setting/components/wx-work.vue
Normal file
@@ -0,0 +1,210 @@
|
||||
<template>
|
||||
<a-card :bordered="false">
|
||||
<a-form
|
||||
ref="formRef"
|
||||
:model="form"
|
||||
:rules="rules"
|
||||
:label-col="styleResponsive ? { md: 3, sm: 5, xs: 24 } : { flex: '90px' }"
|
||||
:wrapper-col="styleResponsive ? { md: 9, sm: 19, xs: 24 } : { flex: '1' }"
|
||||
>
|
||||
<a-form-item label="SuiteID" name="suiteId">
|
||||
<a-input
|
||||
allow-clear
|
||||
:maxlength="50"
|
||||
placeholder="请输入SuiteID"
|
||||
v-model:value="form.suiteId"
|
||||
/>
|
||||
</a-form-item>
|
||||
<a-form-item label="Secret" name="secret">
|
||||
<a-input
|
||||
allow-clear
|
||||
:maxlength="50"
|
||||
placeholder="请输入Secret"
|
||||
v-model:value="form.secret"
|
||||
/>
|
||||
</a-form-item>
|
||||
<a-form-item label="CorpId" name="corpId">
|
||||
<a-input
|
||||
allow-clear
|
||||
:maxlength="50"
|
||||
placeholder="请输入CorpId"
|
||||
v-model:value="form.corpId"
|
||||
/>
|
||||
</a-form-item>
|
||||
<a-form-item label="Token" name="token">
|
||||
<a-input
|
||||
allow-clear
|
||||
:maxlength="50"
|
||||
placeholder="请输入Token"
|
||||
v-model:value="form.token"
|
||||
/>
|
||||
</a-form-item>
|
||||
<a-form-item label="EncodingAESKey" name="encodingAESKey">
|
||||
<a-input
|
||||
allow-clear
|
||||
:maxlength="50"
|
||||
placeholder="请输入EncodingAESKey"
|
||||
v-model:value="form.encodingAESKey"
|
||||
/>
|
||||
</a-form-item>
|
||||
|
||||
<!-- <a-form-item label="开发者秘钥(AppSecret)" name="appSecret">-->
|
||||
<!-- <a-input-password-->
|
||||
<!-- :maxlength="100"-->
|
||||
<!-- placeholder="请输入开发者秘钥AppSecret"-->
|
||||
<!-- v-model:value="form.appSecret"-->
|
||||
<!-- />-->
|
||||
<!-- </a-form-item>-->
|
||||
<!-- <a-form-item label="原始ID" name="originalId">-->
|
||||
<!-- <a-input-->
|
||||
<!-- allow-clear-->
|
||||
<!-- :maxlength="20"-->
|
||||
<!-- placeholder="请输入原始ID"-->
|
||||
<!-- v-model:value="form.originalId"-->
|
||||
<!-- />-->
|
||||
<!-- </a-form-item>-->
|
||||
<!-- <a-form-item label="微信号" name="wxOfficialAccount">-->
|
||||
<!-- <a-input-->
|
||||
<!-- allow-clear-->
|
||||
<!-- :maxlength="20"-->
|
||||
<!-- placeholder="请输入微信号"-->
|
||||
<!-- v-model:value="form.wxOfficialAccount"-->
|
||||
<!-- />-->
|
||||
<!-- </a-form-item>-->
|
||||
<!-- <div style="margin-bottom: 22px; width: 750px">-->
|
||||
<!-- <a-divider>网页授权域名</a-divider>-->
|
||||
<!-- </div>-->
|
||||
<a-form-item label="指令回调地址" name="authorize">
|
||||
<a-input-group compact>
|
||||
<a-input
|
||||
:value="`https://admin.gxwebsoft.com/api/open/wx-work`"
|
||||
placeholder="请输入网页授权域名"
|
||||
style="width: calc(100% - 50px)"
|
||||
/>
|
||||
<a-tooltip title="复制">
|
||||
<a-button @click="onCopyText(`https://admin.gxwebsoft.com/api/open/wx-work`)">
|
||||
<template #icon><CopyOutlined /></template>
|
||||
</a-button>
|
||||
</a-tooltip>
|
||||
</a-input-group>
|
||||
|
||||
<a-button
|
||||
type="primary"
|
||||
class="ele-btn-icon"
|
||||
style="margin-top: 10px"
|
||||
@click="save"
|
||||
>
|
||||
<span>保存</span>
|
||||
</a-button>
|
||||
</a-form-item>
|
||||
</a-form>
|
||||
</a-card>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import { reactive, ref, watch } from 'vue';
|
||||
import { message } from 'ant-design-vue';
|
||||
import { Setting } from '@/api/system/setting/model';
|
||||
import { useThemeStore } from '@/store/modules/theme';
|
||||
import { storeToRefs } from 'pinia';
|
||||
import { FormInstance } from 'ant-design-vue/es/form';
|
||||
import useFormData from '@/utils/use-form-data';
|
||||
import { addSetting, updateSetting } from '@/api/system/setting';
|
||||
import { copyText } from '@/utils/common';
|
||||
import { CopyOutlined } from '@ant-design/icons-vue';
|
||||
|
||||
const props = defineProps<{
|
||||
value?: string;
|
||||
// 修改回显的数据
|
||||
data?: Setting | null;
|
||||
}>();
|
||||
|
||||
// const emit = defineEmits<{
|
||||
// (e: 'done', value): void;
|
||||
// }>();
|
||||
|
||||
// 保存字段信息(设定好key和描述,content里的字段是随意加的会自动转为json保存到数据库)
|
||||
// const settingId = ref(null);
|
||||
// const settingKey = ref('');
|
||||
// 是否开启响应式布局
|
||||
const themeStore = useThemeStore();
|
||||
const { styleResponsive } = storeToRefs(themeStore);
|
||||
// 提交状态
|
||||
const loading = ref(false);
|
||||
// 是否是修改
|
||||
const isUpdate = ref(false);
|
||||
//
|
||||
const formRef = ref<FormInstance | null>(null);
|
||||
// 表单数据
|
||||
const { form, resetFields, assignFields } = useFormData<Setting>({
|
||||
suiteId: '',
|
||||
secret: '',
|
||||
corpId: '',
|
||||
token: '',
|
||||
encodingAESKey: '',
|
||||
tenantId: localStorage.getItem('TenantId')
|
||||
});
|
||||
|
||||
// 表单验证规则
|
||||
const rules = reactive({
|
||||
chatKey: [
|
||||
{
|
||||
required: true,
|
||||
message: '请输入KEY',
|
||||
type: 'string',
|
||||
trigger: 'blur'
|
||||
}
|
||||
]
|
||||
});
|
||||
|
||||
/* 保存编辑 */
|
||||
const save = () => {
|
||||
if (!formRef.value) {
|
||||
return;
|
||||
}
|
||||
formRef.value
|
||||
.validate()
|
||||
.then(() => {
|
||||
loading.value = true;
|
||||
const appForm = {
|
||||
...form,
|
||||
content: JSON.stringify(form)
|
||||
};
|
||||
const saveOrUpdate = isUpdate.value ? updateSetting : addSetting;
|
||||
saveOrUpdate(appForm)
|
||||
.then(() => {
|
||||
message.success('保存成功');
|
||||
})
|
||||
.catch((e) => {
|
||||
message.error(e.message);
|
||||
});
|
||||
})
|
||||
.catch(() => {});
|
||||
};
|
||||
|
||||
const onCopyText = (text) => {
|
||||
copyText(text);
|
||||
};
|
||||
|
||||
watch(
|
||||
() => props.data,
|
||||
(data) => {
|
||||
if (data?.settingId) {
|
||||
isUpdate.value = true;
|
||||
// 表单赋值
|
||||
if (data.content) {
|
||||
const jsonData = JSON.parse(data.content);
|
||||
assignFields(jsonData);
|
||||
}
|
||||
// 其他必要参数
|
||||
form.settingId = data.settingId;
|
||||
form.settingKey = data.settingKey;
|
||||
} else {
|
||||
// 新增
|
||||
isUpdate.value = false;
|
||||
resetFields();
|
||||
form.settingKey = props.value;
|
||||
}
|
||||
}
|
||||
);
|
||||
</script>
|
||||
Reference in New Issue
Block a user