|
|
@@ -0,0 +1,180 @@
|
|
|
+<script setup lang="ts">
|
|
|
+import type { BasicForm } from '@/types/form'
|
|
|
+import type { TabsPaneContext } from 'element-plus'
|
|
|
+// menu start
|
|
|
+const activeName = ref<string>('login')
|
|
|
+const handleClick = (tab: TabsPaneContext, event: Event) => {
|
|
|
+ console.log(tab, event)
|
|
|
+}
|
|
|
+// menu end
|
|
|
+
|
|
|
+// loginConfig start
|
|
|
+// checkbox
|
|
|
+const isSingleLogin = ref<boolean>(false)
|
|
|
+const handleChange = val => {
|
|
|
+ isSingleLogin.value = val
|
|
|
+}
|
|
|
+// radio
|
|
|
+const singleLoginType = ref<string>('1')
|
|
|
+// loginConfig end
|
|
|
+
|
|
|
+// messageConfig start
|
|
|
+const proFormRef = ref<any>()
|
|
|
+const formData = reactive<any>({})
|
|
|
+const formConfig = reactive<BasicForm>({
|
|
|
+ span: 24,
|
|
|
+ props: {
|
|
|
+ labelPosition: 'right',
|
|
|
+ labelWidth: '120px'
|
|
|
+ },
|
|
|
+ formItems: [
|
|
|
+ {
|
|
|
+ label: 'accessKeyId',
|
|
|
+ value: '',
|
|
|
+ name: 'accessKeyId',
|
|
|
+ type: 'input',
|
|
|
+ rules: [{ required: true, message: '请输入accessKeyId', trigger: 'blur' }]
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: 'accessKeySecret',
|
|
|
+ value: '',
|
|
|
+ name: 'accessKeySecret',
|
|
|
+ type: 'input',
|
|
|
+ rules: [{ required: true, message: '请输入accessKeySecret', trigger: 'blur' }]
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: '短信签名',
|
|
|
+ value: '',
|
|
|
+ name: 'messageSign',
|
|
|
+ type: 'input',
|
|
|
+ rules: [{ required: true, message: '请输入短信签名', trigger: 'blur' }]
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: '短信模版',
|
|
|
+ value: '',
|
|
|
+ name: 'messageTemplate',
|
|
|
+ type: 'input',
|
|
|
+ rules: [{ required: true, message: '请输入短信模版', trigger: 'blur' }]
|
|
|
+ },
|
|
|
+ ]
|
|
|
+})
|
|
|
+const handleSaveMessage = () => {
|
|
|
+ proFormRef.value.submit()
|
|
|
+}
|
|
|
+// messageConfig end
|
|
|
+
|
|
|
+// mailConfig start
|
|
|
+const proFormEmailRef = ref<any>()
|
|
|
+const formEmailData = reactive<any>({})
|
|
|
+const formEmailConfig = reactive<BasicForm>({
|
|
|
+ span: 24,
|
|
|
+ props: {
|
|
|
+ labelPosition: 'right',
|
|
|
+ labelWidth: '120px'
|
|
|
+ },
|
|
|
+ formItems: [
|
|
|
+ {
|
|
|
+ label: '邮箱服务器地址',
|
|
|
+ value: '',
|
|
|
+ name: 'serverAddress',
|
|
|
+ type: 'input',
|
|
|
+ rules: [{ required: true, message: '请输入邮箱服务器地址', trigger: 'blur' }]
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: '邮箱服务器端口',
|
|
|
+ value: '',
|
|
|
+ name: 'serverPort',
|
|
|
+ type: 'input',
|
|
|
+ rules: [{ required: true, message: '请输入邮箱服务器端口', trigger: 'blur' }]
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: '系统邮箱地址',
|
|
|
+ value: '',
|
|
|
+ name: 'mailAddress',
|
|
|
+ type: 'input',
|
|
|
+ rules: [{ required: true, message: '请输入系统邮箱地址', trigger: 'blur' }]
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: '系统邮箱密码',
|
|
|
+ value: '',
|
|
|
+ name: 'mailPassword',
|
|
|
+ type: 'input',
|
|
|
+ rules: [{ required: true, message: '请输入系统邮箱密码', trigger: 'blur' }]
|
|
|
+ },
|
|
|
+ ]
|
|
|
+})
|
|
|
+const handleSaveEmail = () => {
|
|
|
+ proFormEmailRef.value.submit()
|
|
|
+}
|
|
|
+// mailConfig end
|
|
|
+</script>
|
|
|
+
|
|
|
+<template>
|
|
|
+ <div class="configure-container">
|
|
|
+ <el-tabs v-model="activeName" class="demo-tabs" @tab-click="handleClick">
|
|
|
+ <el-tab-pane label="登录" name="login">
|
|
|
+ <el-card class="box-card">
|
|
|
+ <div class="login-container">
|
|
|
+ <div class="title">单一登录配置</div>
|
|
|
+ <div>
|
|
|
+ <el-checkbox v-model="isSingleLogin" @change="handleChange">单一登录</el-checkbox>
|
|
|
+ </div>
|
|
|
+ <div>
|
|
|
+ <el-radio-group v-model="singleLoginType" :disabled="!isSingleLogin">
|
|
|
+ <el-radio label="1" size="large">后登录踢出先登录</el-radio>
|
|
|
+ <el-radio label="2" size="large">已登录禁止再登录</el-radio>
|
|
|
+ </el-radio-group>
|
|
|
+ </div>
|
|
|
+ <div class="btn">
|
|
|
+ <el-button type="primary">保存</el-button>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </el-card>
|
|
|
+ </el-tab-pane>
|
|
|
+ <el-tab-pane label="短信" name="message">
|
|
|
+ <el-card class="box-card">
|
|
|
+ <div class="message-container">
|
|
|
+ <div class="title">短信配置</div>
|
|
|
+ <pro-form :formConfig="formConfig" :formData="formData" ref="proFormRef">
|
|
|
+ </pro-form>
|
|
|
+ <div class="btn">
|
|
|
+ <el-button type="primary" @click="handleSaveMessage">保存</el-button>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </el-card>
|
|
|
+ </el-tab-pane>
|
|
|
+ <el-tab-pane label="邮箱" name="mail">
|
|
|
+ <el-card class="box-card">
|
|
|
+ <div class="mail-container">
|
|
|
+ <div class="title">发件人账户</div>
|
|
|
+ <pro-form :formConfig="formEmailConfig" :formData="formEmailData" ref="proFormEmailRef">
|
|
|
+ </pro-form>
|
|
|
+ <div class="btn">
|
|
|
+ <el-button type="primary" @click="handleSaveEmail">保存</el-button>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </el-card>
|
|
|
+ </el-tab-pane>
|
|
|
+ </el-tabs>
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+
|
|
|
+<style lang="scss" scoped>
|
|
|
+.configure-container {
|
|
|
+ .box-card {
|
|
|
+ margin-top: 10px;
|
|
|
+ .login-container {
|
|
|
+ div:not(:first-child) {
|
|
|
+ margin-top: 20px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .message-container, .mail-container, .login-container {
|
|
|
+ .title {
|
|
|
+ font-size: 17px;
|
|
|
+ font-weight: bold;
|
|
|
+ margin-bottom: 20px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
+</style>
|
zhaojg