mirror of
https://gitee.com/likeadmin/likeadmin_java.git
synced 2026-09-06 23:01:08 +08:00
初始化admin pc端
This commit is contained in:
106
admin/src/views/setting/service/online_service.vue
Normal file
106
admin/src/views/setting/service/online_service.vue
Normal file
@@ -0,0 +1,106 @@
|
||||
<template>
|
||||
<div class="admin">
|
||||
<el-card shadow="never">
|
||||
<el-alert
|
||||
title="* 设置商城客服联系信息;小程序客服在微信小程序后台开通"
|
||||
type="info"
|
||||
:closable="false"
|
||||
></el-alert>
|
||||
</el-card>
|
||||
|
||||
<el-card class="m-t-15" shadow="never">
|
||||
<el-form
|
||||
ref="formRefs"
|
||||
class="ls-form"
|
||||
:model="formData"
|
||||
:rules="rules"
|
||||
label-width="150px"
|
||||
size="small"
|
||||
>
|
||||
<el-form-item label="客服二维码:" prop="qr_code">
|
||||
<material-select v-model="formData.qr_code" :limit="1"></material-select>
|
||||
<div class="muted">建议尺寸:240*200,支持jpg、png格式</div>
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="客服微信号:" prop="wechat">
|
||||
<el-input v-model="formData.wechat" placeholder="请输入微信号"></el-input>
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="客服电话:" prop="phone">
|
||||
<el-input v-model="formData.phone" placeholder="请输入电话"></el-input>
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="服务时间:" prop="service_time">
|
||||
<el-input v-model="formData.service_time" placeholder=""></el-input>
|
||||
<div class="muted">服务时间,例如:周一至周六9:00-19:00</div>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</el-card>
|
||||
|
||||
<footer-btns>
|
||||
<el-button type="primary" size="small" @click="onSubmit(formRefs)">保存</el-button>
|
||||
</footer-btns>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { reactive, ref } from 'vue'
|
||||
import type { ElForm } from 'element-plus'
|
||||
import MaterialSelect from '@/components/material-select/index.vue'
|
||||
import FooterBtns from '@/components/footer-btns/index.vue'
|
||||
import { apiCustomerServiceGetConfig, apiCustomerServiceSetConfig } from '@/api/setting'
|
||||
|
||||
|
||||
type FormInstance = InstanceType<typeof ElForm>
|
||||
const formRefs = ref<FormInstance>()
|
||||
|
||||
// 表单数据
|
||||
const formData = ref({
|
||||
qr_code: '', // 客服二维码
|
||||
wechat: '', // 客服微信号
|
||||
phone: '', // 客服手机号
|
||||
service_time: '', // 服务时间
|
||||
})
|
||||
|
||||
// 表单校验规则
|
||||
const rules = reactive<object>({
|
||||
qr_code: [
|
||||
{
|
||||
required: true,
|
||||
message: '客服二维码不能为空',
|
||||
trigger: ['blur'],
|
||||
},
|
||||
],
|
||||
})
|
||||
|
||||
// 获取客服设置
|
||||
const getCustomerServiceConfig = async (): Promise<void> => {
|
||||
formData.value = await apiCustomerServiceGetConfig()
|
||||
}
|
||||
|
||||
// 设置客服设置
|
||||
const setCustomerServiceConfig = async ():Promise<void> => {
|
||||
await apiCustomerServiceSetConfig({...formData.value})
|
||||
getCustomerServiceConfig()
|
||||
}
|
||||
|
||||
// 提交数据
|
||||
const onSubmit = (formEl: FormInstance | undefined): void => {
|
||||
if(!formEl) return
|
||||
|
||||
formEl.validate((valid): Boolean | undefined => {
|
||||
if(!valid) return false
|
||||
setCustomerServiceConfig()
|
||||
})
|
||||
}
|
||||
|
||||
getCustomerServiceConfig()
|
||||
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.el-alert.el-alert--info {
|
||||
background-color: $color-primary-light-9;
|
||||
color: $color-primary;
|
||||
}
|
||||
</style>
|
||||
90
admin/src/views/setting/system/environment.vue
Normal file
90
admin/src/views/setting/system/environment.vue
Normal file
@@ -0,0 +1,90 @@
|
||||
<!-- 系统环境 -->
|
||||
<template>
|
||||
<div class="system-environment">
|
||||
<el-card shadow="never">
|
||||
<div>服务器信息</div>
|
||||
<div class="m-t-15">
|
||||
<el-table :data="info.server" size="medium">
|
||||
<el-table-column prop="param" label="参数"> </el-table-column>
|
||||
<el-table-column prop="value" label="值"> </el-table-column>
|
||||
</el-table>
|
||||
</div>
|
||||
</el-card>
|
||||
|
||||
<el-card shadow="never" class="m-t-15">
|
||||
<div>PHP环境要求</div>
|
||||
<div class="m-t-15">
|
||||
<el-table :data="info.env" size="medium">
|
||||
<el-table-column prop="option" label="选项"> </el-table-column>
|
||||
<el-table-column prop="require" label="要求"> </el-table-column>
|
||||
<el-table-column prop="status" label="状态">
|
||||
<template #default="scope">
|
||||
<el-icon v-show="scope.row.status" color="#67C23A">
|
||||
<Select />
|
||||
</el-icon>
|
||||
<el-icon v-show="!scope.row.status" color="#DB2828">
|
||||
<close-bold />
|
||||
</el-icon>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="remark" label="说明及帮助"> </el-table-column>
|
||||
</el-table>
|
||||
</div>
|
||||
</el-card>
|
||||
|
||||
<el-card shadow="never" class="m-t-15">
|
||||
<div>目录权限</div>
|
||||
<div class="m-t-15">
|
||||
<el-table :data="info.auth" size="medium">
|
||||
<el-table-column prop="dir" label="选项"> </el-table-column>
|
||||
<el-table-column prop="require" label="要求"> </el-table-column>
|
||||
<el-table-column prop="status" label="状态">
|
||||
<template #default="scope">
|
||||
<el-icon v-show="scope.row.status" color="#67C23A">
|
||||
<Select />
|
||||
</el-icon>
|
||||
<el-icon v-show="!scope.row.status" color="#DB2828">
|
||||
<close-bold />
|
||||
</el-icon>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="remark" label="说明及帮助"> </el-table-column>
|
||||
</el-table>
|
||||
</div>
|
||||
</el-card>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script lang="ts">
|
||||
import { defineComponent, reactive, onMounted } from 'vue'
|
||||
import { apiSystemInfo } from '@/api/setting'
|
||||
export default defineComponent({
|
||||
setup() {
|
||||
const info = reactive({
|
||||
server: [], // 服务器信息
|
||||
env: [], // PHP环境要求
|
||||
auth: [] // 目录权限
|
||||
})
|
||||
|
||||
const getSystemInfo = () => {
|
||||
apiSystemInfo().then((res: any) => {
|
||||
console.log('res', res)
|
||||
info.server = res.server
|
||||
info.env = res.env
|
||||
info.auth = res.auth
|
||||
})
|
||||
}
|
||||
|
||||
onMounted(() => {
|
||||
getSystemInfo()
|
||||
})
|
||||
|
||||
return {
|
||||
info,
|
||||
getSystemInfo
|
||||
}
|
||||
}
|
||||
})
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped></style>
|
||||
59
admin/src/views/setting/user/index.vue
Normal file
59
admin/src/views/setting/user/index.vue
Normal file
@@ -0,0 +1,59 @@
|
||||
<!-- 用户设置 -->
|
||||
<template>
|
||||
<!-- 用户mortar Start -->
|
||||
<el-card shadow="never" class="m-t-16">
|
||||
<template #header>
|
||||
<span> 基本设置 </span>
|
||||
</template>
|
||||
|
||||
<el-form ref="formRef" :model="formData" label-width="100px" size="small">
|
||||
<el-form-item label="用户默认头像" prop="default_avatar">
|
||||
<material-select v-model="formData.default_avatar" :limit="1"></material-select>
|
||||
<div class="muted">建议尺寸:400*400,支持jpg、png格式</div>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</el-card>
|
||||
<!-- 用户mortar End -->
|
||||
|
||||
<!-- Footer Start -->
|
||||
<footer-btns>
|
||||
<el-button type="primary" size="small" @click="onSubmit">保存</el-button>
|
||||
</footer-btns>
|
||||
<!-- Footer End -->
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import { reactive, ref } from 'vue'
|
||||
import { apiUserConfigGet, apiUserConfigSet } from '@/api/setting'
|
||||
import materialSelect from '@/components/material-select/index.vue'
|
||||
import FooterBtns from '@/components/footer-btns/index.vue'
|
||||
|
||||
/** Data Start **/
|
||||
const formData = ref<any>({
|
||||
default_avatar: '', // string 客服二维码
|
||||
wechat: '', // string 客服微信号
|
||||
})
|
||||
/** Data End **/
|
||||
|
||||
/** Methods Start **/
|
||||
// 获取用户设置
|
||||
const getUserConfig = async (): Promise<void> => {
|
||||
formData.value = await apiUserConfigGet()
|
||||
}
|
||||
// 编辑用户设置
|
||||
const handleUserConfigEdit = async (): Promise<void> => {
|
||||
await apiUserConfigSet({ ...formData.value })
|
||||
getUserConfig()
|
||||
}
|
||||
// 提交数据
|
||||
const onSubmit = () => {
|
||||
handleUserConfigEdit()
|
||||
}
|
||||
/** Methods End **/
|
||||
|
||||
/** LifeCycle Start **/
|
||||
getUserConfig()
|
||||
/** LifeCycle End **/
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped></style>
|
||||
237
admin/src/views/setting/user/login.vue
Normal file
237
admin/src/views/setting/user/login.vue
Normal file
@@ -0,0 +1,237 @@
|
||||
<!-- 用户设置 -->
|
||||
<template>
|
||||
<div class="login-register">
|
||||
<el-form ref="formRef" :model="formData" label-width="160px" size="small">
|
||||
<!-- 通用设置 Start -->
|
||||
<el-card shadow="never" class="m-t-15">
|
||||
<template #header>
|
||||
<span>通用设置</span>
|
||||
</template>
|
||||
<el-form-item label="注册方式" required>
|
||||
<el-checkbox-group v-model="formData.register_way">
|
||||
<el-checkbox :label="1">手机号码注册</el-checkbox>
|
||||
</el-checkbox-group>
|
||||
<div class="muted xs">
|
||||
系统通用的注册用户方式,至少勾选一项,微信等渠道有其他授权注册方式,请合理设置
|
||||
</div>
|
||||
</el-form-item>
|
||||
<el-form-item label="手机号码注册需验证码" required>
|
||||
<!-- switch开关 -->
|
||||
<div class="flex col-center">
|
||||
<el-switch v-model="formData.is_mobile_register_code" :active-value="1" :inactive-value="0" />
|
||||
<span class="m-l-16">
|
||||
{{ formData.is_mobile_register_code ? '开启' : '关闭' }}
|
||||
</span>
|
||||
</div>
|
||||
<div class="muted xs">
|
||||
1、用户通过手机号码注册帐号时,是否需要短信验证码验证填写的手机号码,默认关闭
|
||||
</div>
|
||||
<div class="muted xs">2、请开启对应短信验证码功能</div>
|
||||
</el-form-item>
|
||||
<el-form-item label="强制绑定手机">
|
||||
<!-- switch开关 -->
|
||||
<div class="flex col-center">
|
||||
<el-switch v-model="formData.coerce_mobile" :active-value="1" :inactive-value="0" />
|
||||
<span class="m-l-16">{{ formData.coerce_mobile ? '开启' : '关闭' }}</span>
|
||||
</div>
|
||||
<div class="muted xs">
|
||||
用户无论通过何种方式注册用户时,是否需要强制绑定手机。绑定手机需要短信验证,请开启对应短信验证码功能
|
||||
</div>
|
||||
</el-form-item>
|
||||
<el-form-item label="登录方式" required>
|
||||
<!-- 多选框 -->
|
||||
<el-checkbox-group v-model="formData.login_way">
|
||||
<el-checkbox :label="1">手机号密码登录</el-checkbox>
|
||||
<el-checkbox :label="2">手机号验证码登录</el-checkbox>
|
||||
</el-checkbox-group>
|
||||
<div class="muted xs">
|
||||
系统通用的登录方式,至少勾选一项,需要和通用注册方式匹配。
|
||||
微信等渠道有其他授权注册方式,请合理设置
|
||||
</div>
|
||||
</el-form-item>
|
||||
</el-card>
|
||||
<!-- 通用设置 End -->
|
||||
|
||||
<!-- 微信公众号 Start -->
|
||||
<el-card shadow="never" class="m-t-15">
|
||||
<template #header>
|
||||
<span>微信公众号</span>
|
||||
</template>
|
||||
<el-form-item label="微信公众号">
|
||||
<a class="muted xs item-a" href="https://open.weixin.qq.com/">前往微信开放平台</a>
|
||||
<div class="muted xs">
|
||||
1、商城在各渠道使用微信授权登录时,强烈建议配置微信开放平台
|
||||
</div>
|
||||
<div class="muted xs">
|
||||
2、微信开放平台关联公众号、小程序和APP后,可实现各端用户账号统一,识别买家唯一微信身份
|
||||
</div>
|
||||
<div class="muted xs">
|
||||
3、没有配置微信开放平台,同一微信号会生成多个用户,配置微信开放平台后已生成的用户账号无法合并
|
||||
</div>
|
||||
</el-form-item>
|
||||
</el-card>
|
||||
<!-- 微信公众号 End -->
|
||||
|
||||
<!-- 微信开放平台 Start -->
|
||||
<el-card shadow="never" class="m-t-15">
|
||||
<template #header>
|
||||
<span>微信开放平台</span>
|
||||
</template>
|
||||
|
||||
<el-form-item label="微信授权登录">
|
||||
<!-- switch开关 -->
|
||||
<div class="flex col-center">
|
||||
<el-switch v-model="formData.h5_wechat_auth" :active-value="1" :inactive-value="0" />
|
||||
<span class="m-l-16">{{ formData.h5_wechat_auth ? '开启' : '关闭' }}</span>
|
||||
</div>
|
||||
<div class="muted xs">
|
||||
微信公众号是否支持微信授权登录方式。关闭时,使用注册设置里面的配置方法完成用户注册和登录
|
||||
</div>
|
||||
</el-form-item>
|
||||
<el-form-item label="自动微信授权登录">
|
||||
<div class="flex col-center">
|
||||
<el-switch v-model="formData.h5_auto_wechat_auth" :active-value="1" :inactive-value="0" />
|
||||
<span class="m-l-16">{{ formData.h5_auto_wechat_auth ? '开启' : '关闭' }}</span>
|
||||
</div>
|
||||
<div class="muted xs">
|
||||
微信授权登录开启后,可以勾选是否需要自动授权登录,默认开启。
|
||||
</div>
|
||||
</el-form-item>
|
||||
</el-card>
|
||||
<!-- 微信开放平台 End -->
|
||||
|
||||
<!-- 微信小程序 Start -->
|
||||
<el-card shadow="never" class="m-t-15">
|
||||
<template #header>
|
||||
<span>微信小程序</span>
|
||||
</template>
|
||||
|
||||
<el-form-item label="微信授权登录">
|
||||
<!-- switch开关 -->
|
||||
<div class="flex col-center">
|
||||
<el-switch v-model="formData.mnp_wechat_auth" :active-value="1" :inactive-value="0" />
|
||||
<span class="m-l-16">{{ formData.mnp_wechat_auth ? '开启' : '关闭' }}</span>
|
||||
</div>
|
||||
<div class="muted xs">
|
||||
微信小程序是否支持微信授权登录方式。关闭时,使用注册设置里面的配置方法完成用户注册和登录
|
||||
</div>
|
||||
</el-form-item>
|
||||
<el-form-item label="自动微信授权登录">
|
||||
<div class="flex col-center">
|
||||
<el-switch v-model="formData.mnp_auto_wechat_auth" :active-value="1" :inactive-value="0" />
|
||||
<span class="m-l-16">{{
|
||||
formData.mnp_auto_wechat_auth ? '开启' : '关闭'
|
||||
}}</span>
|
||||
</div>
|
||||
<div class="muted xs">
|
||||
微信授权登录开启后,可以勾选是否需要自动授权登录,默认开启
|
||||
</div>
|
||||
</el-form-item>
|
||||
</el-card>
|
||||
<!-- 微信小程序 End -->
|
||||
|
||||
<!-- H5 Start -->
|
||||
<el-card shadow="never" class="m-t-15">
|
||||
<template #header>
|
||||
<span>H5</span>
|
||||
</template>
|
||||
<el-form-item label>
|
||||
<div class="muted xs">
|
||||
用户访问H5商城时,使用注册设置里面的配置方法完成用户注册和登录
|
||||
</div>
|
||||
</el-form-item>
|
||||
</el-card>
|
||||
<!-- H5 End -->
|
||||
|
||||
<!-- APP设置 Start -->
|
||||
<el-card shadow="never" class="m-t-15">
|
||||
<template #header>
|
||||
<span>APP设置</span>
|
||||
</template>
|
||||
|
||||
<el-form-item label="微信授权登录">
|
||||
<div class="flex col-center">
|
||||
<el-switch v-model="formData.app_wechat_auth" :active-value="1" :inactive-value="0" />
|
||||
<span class="m-l-16">{{ formData.app_wechat_auth ? '开启' : '关闭' }}</span>
|
||||
</div>
|
||||
<div class="muted xs">
|
||||
APP是否支持微信授权登录方式。关闭时,使用注册设置里面的配置方法完成用户注册和登录
|
||||
</div>
|
||||
</el-form-item>
|
||||
</el-card>
|
||||
<!-- APP设置 End -->
|
||||
</el-form>
|
||||
|
||||
<!-- Footer Start -->
|
||||
<footer-btns>
|
||||
<el-button type="primary" size="small" @click="onSubmit">保存</el-button>
|
||||
</footer-btns>
|
||||
<!-- Footer End -->
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import {
|
||||
reactive,
|
||||
ref
|
||||
} from 'vue'
|
||||
import {
|
||||
apiLoginConfigGet,
|
||||
apiLoginConfigSet
|
||||
} from '@/api/setting'
|
||||
import FooterBtns from '@/components/footer-btns/index.vue'
|
||||
|
||||
/** Data Start **/
|
||||
const formData = ref < any > ({
|
||||
register_way: [], // 注册方式:1-手机号码注册(注册设置必传)
|
||||
login_way: [], //登录方式:1-账号密码登录;2-手机短信验证码登录
|
||||
is_mobile_register_code: 0, // 手机号码注册需验证码:0-关闭;1-开启
|
||||
coerce_mobile: 0, // 手机号码注册需验证码:0-关闭;1-开启
|
||||
h5_wechat_auth: 0, // 微信公众号-微信授权登录:0-关闭;1-开启
|
||||
h5_auto_wechat_auth: 1, // 微信公众号-自动微信授权登录:0-关闭;1-开启;
|
||||
mnp_wechat_auth: 0, // 小程序-微信授权登录 :0-关闭;1-开启;
|
||||
mnp_auto_wechat_auth: 1, // 小程序-自动微信授权登录:0-关闭;1-开启;
|
||||
app_wechat_auth: 0, // app-微信授权登录:0-关闭;1-开启;
|
||||
scene: '', // 场景:user-用户设置;register-注册设置;withdraw-提现设置
|
||||
toutiao_auth: 0,
|
||||
toutiao_auto_auth: 0,
|
||||
})
|
||||
/** Data End **/
|
||||
|
||||
/** Methods Start **/
|
||||
// 获取登录注册设置
|
||||
const getLoginConfig = async (): Promise < void > => {
|
||||
formData.value = await apiLoginConfigGet()
|
||||
if(!formData.value.register_way) {
|
||||
formData.value.register_way = []
|
||||
}
|
||||
if(!formData.value.login_way) {
|
||||
formData.value.login_way = []
|
||||
}
|
||||
}
|
||||
// 编辑登录注册设置
|
||||
const handleLoginConfigEdit = async (): Promise < void > => {
|
||||
await apiLoginConfigSet({
|
||||
...formData.value
|
||||
})
|
||||
getLoginConfig()
|
||||
}
|
||||
// 提交数据
|
||||
const onSubmit = () => {
|
||||
handleLoginConfigEdit()
|
||||
}
|
||||
/** Methods End **/
|
||||
|
||||
/** LifeCycle Start **/
|
||||
getLoginConfig()
|
||||
/** LifeCycle End **/
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.login-register {
|
||||
.item-a {
|
||||
color: #1684FC;
|
||||
text-decoration: underline;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
138
admin/src/views/setting/website/filing.vue
Normal file
138
admin/src/views/setting/website/filing.vue
Normal file
@@ -0,0 +1,138 @@
|
||||
<!-- 备案信息 -->
|
||||
<template>
|
||||
<div class="website-filing">
|
||||
<el-card shadow="never" class="">
|
||||
<el-form
|
||||
ref="form"
|
||||
:rules="rules"
|
||||
class="ls-form"
|
||||
:model="formData"
|
||||
label-width="150px"
|
||||
size="small"
|
||||
>
|
||||
<!-- 版权信息输入框 -->
|
||||
<el-form-item label="版权信息" prop="info">
|
||||
<el-input v-model="formData.info" placeholder="请输入版权信息"></el-input>
|
||||
<div class="muted xs m-r-16">例如填写,Copyright © 2019-2020 公司名称</div>
|
||||
</el-form-item>
|
||||
|
||||
<!-- ICP备案号输入框 -->
|
||||
<el-form-item label="ICP备案号" prop="icp_number">
|
||||
<el-input
|
||||
v-model="formData.icp_number"
|
||||
placeholder="请输入ICP备案号"
|
||||
></el-input>
|
||||
</el-form-item>
|
||||
|
||||
<!-- ICP备案号链接输入框 -->
|
||||
<el-form-item label="ICP备案号链接" prop="icp_link">
|
||||
<el-input
|
||||
v-model="formData.icp_link"
|
||||
placeholder="请输入ICP备案号链接"
|
||||
></el-input>
|
||||
<div class="muted xs m-r-16">
|
||||
例如填写域名信息备案系统链接,http://beian.miit.gov.cn
|
||||
</div>
|
||||
</el-form-item>
|
||||
|
||||
<!--公安备案号输入框 -->
|
||||
<el-form-item label="公安备案号" prop="public_number">
|
||||
<el-input
|
||||
v-model="formData.public_number"
|
||||
placeholder="请输入公安备案号"
|
||||
></el-input>
|
||||
</el-form-item>
|
||||
|
||||
<!-- 公安备案号链接输入框 -->
|
||||
<el-form-item label="公安备案号链接" prop="public_link">
|
||||
<el-input
|
||||
v-model="formData.public_link"
|
||||
placeholder="请输入公安备案号链接"
|
||||
></el-input>
|
||||
<div class="muted xs m-r-16">
|
||||
例如填写公安信息备案系统链接,http://www.beian.gov.cn
|
||||
</div>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</el-card>
|
||||
|
||||
<footer-btns>
|
||||
<el-button type="primary" size="small" @click="setCopyright">保存</el-button>
|
||||
</footer-btns>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script lang="ts">
|
||||
import { defineComponent, reactive, onMounted } from 'vue'
|
||||
import { apiGetCopyright, apiSetCopyright } from '@/api/setting'
|
||||
import FooterBtns from '@/components/footer-btns/index.vue'
|
||||
export default defineComponent({
|
||||
components: {
|
||||
FooterBtns
|
||||
},
|
||||
setup() {
|
||||
// 表单数据
|
||||
const formData = reactive({
|
||||
info: '', // 版权信息
|
||||
icp_number: '', // icp备案号
|
||||
icp_link: '', // icp备案链接
|
||||
public_number: '', // 公安备案号
|
||||
public_link: '' // 公安备案链接
|
||||
})
|
||||
|
||||
// 表单验证
|
||||
const rules = {
|
||||
// info: [
|
||||
// {
|
||||
// required: true,
|
||||
// message: '请输入版权信息',
|
||||
// trigger: ['blur'],
|
||||
// },
|
||||
// ],
|
||||
}
|
||||
|
||||
// 获取备案信息
|
||||
const getCopyright = () => {
|
||||
apiGetCopyright().then((res: any) => {
|
||||
console.log('res', res)
|
||||
formData.info = res.info
|
||||
formData.icp_number = res.icp_number
|
||||
formData.icp_link = res.icp_link
|
||||
formData.public_number = res.public_number
|
||||
formData.public_link = res.public_link
|
||||
})
|
||||
}
|
||||
|
||||
// 设置备案信息
|
||||
const setCopyright = () => {
|
||||
apiSetCopyright({
|
||||
info: formData.info,
|
||||
icp_number: formData.icp_number,
|
||||
icp_link: formData.icp_link,
|
||||
public_number: formData.public_number,
|
||||
public_link: formData.public_link
|
||||
})
|
||||
.then((res: any) => {
|
||||
console.log('res', res)
|
||||
getCopyright()
|
||||
})
|
||||
.catch((err: any) => {
|
||||
console.log('err', err)
|
||||
})
|
||||
}
|
||||
|
||||
onMounted(() => {
|
||||
getCopyright()
|
||||
})
|
||||
|
||||
return {
|
||||
formData,
|
||||
rules,
|
||||
getCopyright,
|
||||
setCopyright
|
||||
}
|
||||
}
|
||||
})
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped></style>
|
||||
155
admin/src/views/setting/website/information.vue
Normal file
155
admin/src/views/setting/website/information.vue
Normal file
@@ -0,0 +1,155 @@
|
||||
<!-- 网站信息 -->
|
||||
<template>
|
||||
<div class="website-information">
|
||||
<el-card shadow="never" class="m-t-15">
|
||||
<el-form
|
||||
ref="formRef"
|
||||
:rules="rules"
|
||||
class="ls-form"
|
||||
:model="formData"
|
||||
label-width="150px"
|
||||
size="small"
|
||||
>
|
||||
<el-form-item label="网站名称" prop="name">
|
||||
<el-input
|
||||
v-model="formData.name"
|
||||
placeholder="请输入网站名称"
|
||||
maxlength="12"
|
||||
show-word-limit
|
||||
></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="网站图标" prop="web_favicon" required>
|
||||
<material-select v-model="formData.web_favicon" :limit="1" />
|
||||
<div class="flex">
|
||||
<div class="muted xs m-r-16">
|
||||
建议尺寸:100*100像素,支持jpg,jpeg,png格式
|
||||
</div>
|
||||
<el-popover placement="right" width="200" trigger="hover">
|
||||
<el-image
|
||||
src="https://img2.baidu.com/it/u=3357699356,1912406716&fm=26&fmt=auto&gp=0.jpg"
|
||||
/>
|
||||
<el-button slot="reference" type="text">查看示例</el-button>
|
||||
</el-popover>
|
||||
</div>
|
||||
</el-form-item>
|
||||
<el-form-item label="网站LOGO" prop="web_logo" required>
|
||||
<material-select v-model="formData.web_logo" :limit="1" />
|
||||
<div class="flex">
|
||||
<div class="muted xs m-r-16">
|
||||
建议尺寸:100*100像素,支持jpg,jpeg,png格式
|
||||
</div>
|
||||
<el-popover placement="right" width="200" trigger="hover">
|
||||
<el-image
|
||||
src="https://img2.baidu.com/it/u=3357699356,1912406716&fm=26&fmt=auto&gp=0.jpg"
|
||||
/>
|
||||
<el-button slot="reference" type="text">查看示例</el-button>
|
||||
</el-popover>
|
||||
</div>
|
||||
</el-form-item>
|
||||
<el-form-item label="登录页广告图" prop="login_image" required>
|
||||
<material-select v-model="formData.login_image" :limit="1" />
|
||||
<div class="flex">
|
||||
<div class="muted xs m-r-16">
|
||||
建议尺寸:100*100像素,支持jpg,jpeg,png格式
|
||||
</div>
|
||||
<el-popover placement="right" width="200" trigger="hover">
|
||||
<el-image
|
||||
src="https://img2.baidu.com/it/u=3357699356,1912406716&fm=26&fmt=auto&gp=0.jpg"
|
||||
/>
|
||||
<el-button slot="reference" type="text">查看示例</el-button>
|
||||
</el-popover>
|
||||
</div>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</el-card>
|
||||
|
||||
<footer-btns>
|
||||
<el-button type="primary" size="small" @click="setWebsite">保存</el-button>
|
||||
</footer-btns>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script lang="ts">
|
||||
import { defineComponent, reactive, onMounted, Ref, ref } from 'vue'
|
||||
import { ElInput, ElForm } from 'element-plus'
|
||||
import MaterialSelect from '@/components/material-select/index.vue'
|
||||
import FooterBtns from '@/components/footer-btns/index.vue'
|
||||
import { apiGetWebsite, apiSetWebsite } from '@/api/setting'
|
||||
export default defineComponent({
|
||||
components: {
|
||||
MaterialSelect,
|
||||
FooterBtns
|
||||
},
|
||||
setup() {
|
||||
const formRef: Ref<typeof ElForm | null> = ref(null)
|
||||
|
||||
// 表单数据
|
||||
const formData = reactive({
|
||||
name: '', // 网站名称
|
||||
web_favicon: '', // 网站图标
|
||||
web_logo: '', // 网站logo
|
||||
login_image: '' // 登录页广告图
|
||||
})
|
||||
|
||||
// 表单验证
|
||||
const rules = {
|
||||
name: [
|
||||
{
|
||||
required: true,
|
||||
message: '请输入网站名称',
|
||||
trigger: ['blur']
|
||||
}
|
||||
]
|
||||
}
|
||||
|
||||
// 获取备案信息
|
||||
const getWebsite = () => {
|
||||
apiGetWebsite().then((res: any) => {
|
||||
console.log('res', res)
|
||||
formData.name = res.name
|
||||
formData.web_favicon = res.web_favicon
|
||||
formData.web_logo = res.web_logo
|
||||
formData.login_image = res.login_image
|
||||
})
|
||||
}
|
||||
|
||||
// 设置备案信息
|
||||
const setWebsite = () => {
|
||||
formRef.value?.validate((valid: boolean) => {
|
||||
if (!valid) {
|
||||
return
|
||||
}
|
||||
|
||||
console.log('fasdfasd')
|
||||
apiSetWebsite({
|
||||
name: formData.name,
|
||||
web_favicon: formData.web_favicon,
|
||||
web_logo: formData.web_logo,
|
||||
login_image: formData.login_image
|
||||
})
|
||||
.then((res: any) => {
|
||||
console.log('res', res)
|
||||
getWebsite()
|
||||
})
|
||||
.catch((err: any) => {
|
||||
console.log('err', err)
|
||||
})
|
||||
})
|
||||
}
|
||||
|
||||
onMounted(() => {
|
||||
getWebsite()
|
||||
})
|
||||
|
||||
return {
|
||||
formData,
|
||||
rules,
|
||||
getWebsite,
|
||||
setWebsite,
|
||||
formRef
|
||||
}
|
||||
}
|
||||
})
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped></style>
|
||||
94
admin/src/views/setting/website/protocol.vue
Normal file
94
admin/src/views/setting/website/protocol.vue
Normal file
@@ -0,0 +1,94 @@
|
||||
<template>
|
||||
<!-- 服务协议 Start -->
|
||||
<el-card shadow="never">
|
||||
<template #header>
|
||||
<span class="md f-w-600">服务协议</span>
|
||||
</template>
|
||||
<!-- Header Form Start -->
|
||||
<el-form :model="formData" label-width="80px" size="mini" inline>
|
||||
<el-form-item label="协议名称">
|
||||
<el-input class="ls-input" v-model="formData.service_title" />
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<!-- Header Form End -->
|
||||
|
||||
<!-- Main Editor Start -->
|
||||
<editor
|
||||
v-model="formData.service_content"
|
||||
width="1000"
|
||||
height="664"
|
||||
class="m-l-14"
|
||||
></editor>
|
||||
<!-- Main Editor End -->
|
||||
</el-card>
|
||||
<!-- 服务协议 End -->
|
||||
|
||||
<!-- 隐私协议 Start -->
|
||||
<el-card shadow="never" class="m-t-15">
|
||||
<template #header>
|
||||
<span class="md f-w-600">隐私协议</span>
|
||||
</template>
|
||||
<!-- Header Form Start -->
|
||||
<el-form :model="formData" label-width="80px" size="mini" inline>
|
||||
<el-form-item label="协议名称">
|
||||
<el-input class="ls-input" v-model="formData.privacy_title" />
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<!-- Header Form End -->
|
||||
|
||||
<!-- Main Editor Start -->
|
||||
<editor
|
||||
v-model="formData.privacy_content"
|
||||
width="1000"
|
||||
height="664"
|
||||
class="m-l-14"
|
||||
></editor>
|
||||
<!-- Main Editor End -->
|
||||
</el-card>
|
||||
<!-- 政策协议 End -->
|
||||
|
||||
<!-- Footer Start -->
|
||||
<footer-btns>
|
||||
<el-button type="primary" size="small" @click="handleProtocolEdit">保存</el-button>
|
||||
</footer-btns>
|
||||
<!-- Footer End -->
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { ref } from 'vue'
|
||||
import { apiGetProtocol, apiSetProtocol } from '@/api/setting'
|
||||
import Editor from '@/components/editor/index.vue'
|
||||
import FooterBtns from '@/components/footer-btns/index.vue'
|
||||
|
||||
/** Interface Star **/
|
||||
interface formDataObj {
|
||||
service_title: string
|
||||
service_content: string
|
||||
privacy_title: string
|
||||
privacy_content: string
|
||||
}
|
||||
/** Interface End **/
|
||||
|
||||
/** Data Start **/
|
||||
let formData = ref<formDataObj>({
|
||||
service_title: '',
|
||||
service_content: '',
|
||||
privacy_title: '',
|
||||
privacy_content: '',
|
||||
})
|
||||
/** Data End **/
|
||||
|
||||
/** Methods Start **/
|
||||
const protocolGet = async (): Promise<void> => {
|
||||
;(formData.value as object) = await apiGetProtocol()
|
||||
}
|
||||
const handleProtocolEdit = async (): Promise<void> => {
|
||||
await apiSetProtocol({ ...formData.value })
|
||||
protocolGet()
|
||||
}
|
||||
/** Methods End **/
|
||||
|
||||
/** Life Cycle Start **/
|
||||
protocolGet()
|
||||
/** Life Cycle End **/
|
||||
</script>
|
||||
Reference in New Issue
Block a user