xmCenter/tapi
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

up.

Browse Source
This commit is contained in:
u2nyakim 2025-08-25 11:23:05 +08:00
parent 41600443ed
commit bd0a450345
5 changed files with 218 additions and 33 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

32
z_ele/src/utils/sys-config.ts
View File

@ -12,7 +12,8 @@ export function strToValue(type: string, value: string): any {
case 'json':
return JSON.parse(value);
case 'int':
return parseInt(value)
case 'number':
return value ? parseInt(value) : 0;
case 'switch':
return value == '1'
case 'checkbox':
@ -21,7 +22,18 @@ export function strToValue(type: string, value: string): any {
case 'textarea':
case 'date':
case 'datetime':
case 'time':
return null;
case 'date_range':
case 'time_range':
case 'datetime_range':
return [null, null];
case 'alert':
// 提示
return '-';
case '-':
// 分割线
return '-';
default:
return value
}
@ -48,7 +60,13 @@ export function strToOption(type: string, option: string): any {
return {};
}
export function strToBind(type: string, option: string): any {
export function strToBind(type: string, bindStr: string): any {
let bind: any;
try {
bind = bindStr ? JSON.parse(bindStr) : {};
} catch (e) {
bind = {}
}
try {
switch (type) {
case 'json':
@ -58,13 +76,13 @@ export function strToBind(type: string, option: string): any {
case 'textarea':
case 'checkbox':
case 'date':
return {format: 'YYYY-MM-DD'}
return {format: 'YYYY-MM-DD', ...bind}
case 'datetime':
return {format: 'YYYY-MM-DD HH:mm:ss'}
return {format: 'YYYY-MM-DD HH:mm:ss', ...bind}
case 'alert':
return {type: "success", ...bind};
default:
if (option) {
return JSON.parse(option);
}
return bind;
}
} catch (e) {
console.error(e);

48
z_ele/src/views/system/config-set/components/config-form-item.vue
View File

@ -1,13 +1,13 @@
<template>
<el-form-item :label="props.title" :prop="props.name">
<template v-if="props.type === 'text'">
<el-input v-model="dataValue" :placeholder="'请输入' + props.title" v-bind="dataBind"/>
<el-input v-model="dataValue" :placeholder="'请输入' + props.title" v-bind="itemBind"/>
</template>
<template v-else-if="props.type === 'textarea'">
<el-input type="textarea"
v-model="dataValue"
:placeholder="'请输入' + props.title"
v-bind="dataBind"
v-bind="itemBind"
/>
</template>
<template v-else-if="props.type === 'password'">
@ -16,7 +16,7 @@
type="password"
v-model="dataValue"
:placeholder="'请输入' + props.title"
v-bind="dataBind"
v-bind="itemBind"
/>
</template>
<template v-else-if="props.type === 'switch'">
@ -24,27 +24,51 @@
size="small"
:model-value="dataValue"
@update:modelValue="(val) => updatedataValue(val)"
v-bind="dataBind"
v-bind="itemBind"
/>
</template>
<template v-else-if="props.type === 'number'">
<el-input-number v-model="dataValue" :placeholder="'请输入' + props.title" v-bind="dataBind"/>
<el-input-number v-model="dataValue" :placeholder="'请输入' + props.title" v-bind="itemBind"/>
</template>
<template v-else-if="props.type === 'checkbox'">
<el-checkbox-group v-model="dataValue" v-bind="dataBind">
<el-checkbox-group v-model="dataValue" v-bind="itemBind">
<el-checkbox v-for="item in (dataOptions || [])" :label="item.label" :value="item.value" />
</el-checkbox-group>
</template>
<template v-else-if="props.type === 'radio'">
<el-radio-group v-model="dataValue" v-bind="dataBind">
<el-radio-group v-model="dataValue" v-bind="itemBind">
<el-radio v-for="item in (dataOptions || [])" :label="item.label" :value="item.value" />
</el-radio-group>
</template>
<template v-else-if="props.type === 'date'">
<el-date-picker v-model="dataValue" type="date" :placeholder="'请选择' + props.title" v-bind="dataBind"/>
<el-date-picker v-model="dataValue" type="date" :placeholder="'请选择' + props.title" v-bind="itemBind"/>
</template>
<template v-else-if="props.type === 'datetime'">
<el-date-picker v-model="dataValue" type="datetime" :placeholder="'请选择' + props.title" v-bind="dataBind"/>
<el-date-picker v-model="dataValue" type="datetime" :placeholder="'请选择' + props.title" v-bind="itemBind"/>
</template>
<template v-else-if="props.type === 'time'">
<el-time-picker v-model="dataValue" :placeholder="'请选择' + props.title" v-bind="itemBind" />
</template>
<template v-else-if="props.type === 'date_range'">
<el-date-picker
v-model="dataValue"
type="daterange"
v-bind="itemBind"
/>
</template>
<template v-else-if="props.type === 'datetime_range'">
<el-date-picker
v-model="dataValue"
type="datetimerange"
v-bind="itemBind"
/>
</template>
<template v-else-if="props.type === 'time_range'">
<el-time-picker
v-model="dataValue"
is-range
v-bind="itemBind"
/>
</template>
</el-form-item>
</template>
@ -59,17 +83,15 @@ const props = defineProps<{
type: string;
value: string;
options: string;
itemBind: any
}>();
const dataValue = ref<any>();
const dataOptions = ref<any>()
const dataBind = ref<any>({})
onMounted(() => {
dataBind.value = props.vBind ? strToBind(props.type, props.vBind) : {};
dataValue.value = strToValue(props.type, props.value);
dataOptions.value = strToOption(props.type, props.options);
console.log("渲染完成", props, dataValue.value, dataOptions.value);
// console.log("渲染完成", props, dataValue.value, dataOptions.value);
});
const updatedataValue = (val) => {
console.log("更新val", val);

31
z_ele/src/views/system/config-set/components/config-form-list.vue Normal file
View File

@ -0,0 +1,31 @@
<template>
<template v-for="config in configList">
<template v-if="config.type === '-'">
<el-divider v-bind="config.bind">{{config.title}}</el-divider>
</template>
<template v-else-if="config.type === 'alert'">
<el-alert :title="config.title" v-bind="config.bind" />
</template>
<template v-else-if="config.type === 'card'">
<ele-card shadow="always" :header="config.title" v-bind="config.bind">
<config-form-list :config-list="config.children" v-if="config.children && config.children.length > 0" />
</ele-card>
</template>
<template v-else>
<config-form-item :name="config.name" :title="config.title" :type="config.type" :value="config.value"
:options="config.options" :item-bind="config.bind"/>
<el-form-item v-if="config.tips">
<ele-text type="placeholder" style="line-height: 1.6">
{{ config.tips }}
</ele-text>
</el-form-item>
</template>
</template>
</template>
<script setup lang="ts">
import ConfigFormItem from "../components/config-form-item.vue";
const props = defineProps<{
configList: any;
}>();
</script>

133
z_ele/src/views/system/config-set/index.vue
View File

@ -29,18 +29,10 @@
<el-form
ref="formRef"
:model="form"
label-width="80px"
label-position="top"
@submit.prevent=""
>
<template v-for="config in configList">
<config-form-item :name="config.name" :title="config.title" :type="config.type" :value="config.value"
:options="config.options"/>
<el-form-item v-if="config.tips">
<ele-text type="placeholder" style="line-height: 1.6">
{{ config.tips }}
</ele-text>
</el-form-item>
</template>
<config-form-list :config-list="configList" v-if="configList.length > 0" />
</el-form>
</ele-card>
</ele-page>
@ -50,10 +42,10 @@
import {onMounted, ref} from 'vue';
import {Refresh} from "@element-plus/icons-vue"
import {listConfig} from "@/api/system/config";
import {getSysConfig} from "@/utils/sys-config";
import {getSysConfig, strToBind} from "@/utils/sys-config";
import {useFormData} from "@/utils/use-form-data";
import type {Config} from "@/api/system/config/model";
import ConfigFormItem from "./components/config-form-item.vue";
import ConfigFormList from "./components/config-form-list.vue";
defineOptions({name: 'SystemConfigSet'});
@ -65,7 +57,122 @@ const configLoading = ref(false);
const reload = () => {
configLoading.value = true;
listConfig({group: configGroup.value, limit: 999}).then((data) => {
configList.value = data.filter(d=>d.type !== 'hidden');
const configs = data.filter(d => d.type !== 'hidden');
configList.value = configs.map(d=>{
// 解析vBind属性到item
d.bind = strToBind(d.type, d.vBind);
if(d.type =='card'){
d.children = [
{
"id": 18,
"pid": 0,
"name": "-",
"title": "卧槽，不能这样的哇",
"group": "base",
"type": "alert",
"value": "",
"options": "",
"tips": "",
"sort": 100,
"status": 1,
"vBind": null,
"createTime": "2025-08-25 10:26:29",
"updateTime": "2025-08-25 10:26:29",
"deleteTime": null
},
{
"id": 17,
"pid": 0,
"name": "-",
"title": "这是一个分割线",
"group": "base",
"type": "-",
"value": "",
"options": "",
"tips": "",
"sort": 100,
"status": 1,
"vBind": null,
"createTime": "2025-08-25 10:14:13",
"updateTime": "2025-08-25 10:14:34",
"deleteTime": null
},
{
"id": 6,
"pid": 0,
"name": "test_password",
"title": "系统密码",
"group": "base",
"type": "password",
"value": "123456",
"options": "",
"tips": "",
"sort": 100,
"status": 1,
"vBind": null,
"createTime": "2025-08-22 16:50:23",
"updateTime": "2025-08-22 16:50:23",
"deleteTime": null
},
{
"id": 5,
"pid": 0,
"name": "debug",
"title": "调试模式",
"group": "base",
"type": "switch",
"value": "1",
"options": "",
"tips": "",
"sort": 100,
"status": 1,
"vBind": null,
"createTime": "2025-08-22 16:40:07",
"updateTime": "2025-08-22 16:40:07",
"deleteTime": null
},
{
"id": 4,
"pid": 0,
"name": "test_textarea",
"title": "测试配置",
"group": "base",
"type": "textarea",
"value": "测试配置",
"options": "",
"tips": "",
"sort": 100,
"status": 1,
"vBind": null,
"createTime": "2025-08-22 15:40:19",
"updateTime": "2025-08-22 16:40:31",
"deleteTime": null
},
{
"id": 3,
"pid": 0,
"name": "test_text",
"title": "站点名称",
"group": "base",
"type": "text",
"value": "Ele Admin Plus",
"options": "",
"tips": "站点名称显示在<header>的title上",
"sort": 100,
"status": 1,
"vBind": null,
"createTime": "2025-08-22 14:11:22",
"updateTime": "2025-08-22 16:50:32",
"deleteTime": null
}
];
for(let a in d.children){
d.children[a].bind = strToBind(d.type, d.vBind);
}
}
return d;
});
configLoading.value = false;
});
};

7
z_ele/src/views/system/config/components/config-edit.vue
View File

@ -40,6 +40,9 @@
placeholder="请选择配置类型"
v-model="form.type"
>
<el-option value="-" label="分割线" />
<el-option value="alert" label="提示" />
<el-option value="card" label="卡片" />
<el-option value="text" label="单行文本" />
<el-option value="textarea" label="多行文本" />
<el-option value="password" label="密码" />
@ -47,10 +50,14 @@
<el-option value="radio" label="单选按钮" />
<el-option value="date" label="日期" />
<el-option value="datetime" label="日期+时间" />
<el-option value="time" label="时间" />
<el-option value="switch" label="开关" />
<el-option value="hidden" label="隐藏" />
<el-option value="time" label="时间" />
<el-option value="range" label="范围" />
<el-option value="date_range" label="日期范围" />
<el-option value="datetime_range" label="日期时间范围" />
<el-option value="time_range" label="时间范围" />
<el-option value="number" label="数字" />
</el-select>
</el-form-item>