于阔
9 months ago
parent
88a1f1f060
commit
cec1bed947
@ -0,0 +1,105 @@
|
||||
<script setup lang="tsx">
|
||||
import { Form, FormSchema } from '@/components/Form'
|
||||
import { useForm } from '@/hooks/web/useForm'
|
||||
import { PropType,ref,reactive, watch } from 'vue'
|
||||
import { useValidator } from '@/hooks/web/useValidator'
|
||||
import { ElDialog } from 'element-plus';
|
||||
import {vue3CronPlus} from '@/views/vue3-cron-plus/index'
|
||||
const { required } = useValidator()
|
||||
|
||||
const props = defineProps({
|
||||
currentRow: {
|
||||
type: Object as PropType<any>,
|
||||
default: () => null
|
||||
}
|
||||
})
|
||||
let showCron = ref(false);
|
||||
let NewCornData = "";//当前最新的corn语句的定义
|
||||
|
||||
const formSchema = reactive<FormSchema[]>([
|
||||
{
|
||||
field: 'cron',
|
||||
label: '定时器信息',
|
||||
component: 'Input',
|
||||
colProps: {
|
||||
span: 24
|
||||
},
|
||||
componentProps:{
|
||||
value:"",
|
||||
on:{
|
||||
click:()=>{
|
||||
NewCornData = formSchema[0].value;
|
||||
showCron.value = true;
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
])
|
||||
|
||||
const rules = reactive({
|
||||
cron:[required()],
|
||||
})
|
||||
|
||||
const { formRegister, formMethods } = useForm()
|
||||
const { setValues,getFormData, getElFormExpose } = formMethods
|
||||
|
||||
const submit = async () => {
|
||||
const elForm = await getElFormExpose()
|
||||
const valid = await elForm?.validate().catch((err) => {
|
||||
console.log(err)
|
||||
})
|
||||
if (valid) {
|
||||
const formData = await getFormData();
|
||||
formData.cron = formSchema[0].value;
|
||||
return formData
|
||||
}
|
||||
}
|
||||
|
||||
watch(
|
||||
() => props.currentRow,
|
||||
(currentRow) => {
|
||||
if (!currentRow) return
|
||||
setValues(currentRow)
|
||||
},
|
||||
{
|
||||
deep: true,
|
||||
immediate: true
|
||||
}
|
||||
)
|
||||
//修改定时器的信息
|
||||
const changeCron = (corn)=>{
|
||||
formSchema[0].value = corn.toString();
|
||||
formSchema[0].componentProps.value = corn.toString();
|
||||
if(formSchema[0].value != '[object Event]'){
|
||||
NewCornData = formSchema[0].value
|
||||
}
|
||||
}
|
||||
const closeDialog = ()=>{
|
||||
if(NewCornData != formSchema[0].value){
|
||||
formSchema[0].value = NewCornData;
|
||||
formSchema[0].componentProps.value = NewCornData;
|
||||
}
|
||||
showCron.value = false;
|
||||
}
|
||||
defineExpose({
|
||||
submit
|
||||
})
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<Form :rules="rules" @register="formRegister" :schema="formSchema" />
|
||||
<ElDialog v-model="showCron">
|
||||
<vue3CronPlus
|
||||
i18n="cn"
|
||||
@change="changeCron"
|
||||
@close="closeDialog"
|
||||
max-height="300px"
|
||||
/>
|
||||
</ElDialog>
|
||||
</template>
|
||||
<style scoped>
|
||||
.vue3-cron-plus-container>>>.language{
|
||||
top:40px !important;
|
||||
}
|
||||
</style>
|
||||
@ -0,0 +1,105 @@
|
||||
<script setup lang="tsx">
|
||||
import { Form, FormSchema } from '@/components/Form'
|
||||
import { useForm } from '@/hooks/web/useForm'
|
||||
import { PropType,ref,reactive, watch } from 'vue'
|
||||
import { useValidator } from '@/hooks/web/useValidator'
|
||||
import { ElDialog } from 'element-plus';
|
||||
import {vue3CronPlus} from '@/views/vue3-cron-plus/index'
|
||||
const { required } = useValidator()
|
||||
|
||||
const props = defineProps({
|
||||
currentRow: {
|
||||
type: Object as PropType<any>,
|
||||
default: () => null
|
||||
}
|
||||
})
|
||||
let showCron = ref(false);
|
||||
let NewCornData = "";//当前最新的corn语句的定义
|
||||
|
||||
const formSchema = reactive<FormSchema[]>([
|
||||
{
|
||||
field: 'cron',
|
||||
label: '定时器信息',
|
||||
component: 'Input',
|
||||
colProps: {
|
||||
span: 24
|
||||
},
|
||||
componentProps:{
|
||||
value:"",
|
||||
on:{
|
||||
click:()=>{
|
||||
NewCornData = formSchema[0].value;
|
||||
showCron.value = true;
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
])
|
||||
|
||||
const rules = reactive({
|
||||
cron:[required()],
|
||||
})
|
||||
|
||||
const { formRegister, formMethods } = useForm()
|
||||
const { setValues,getFormData, getElFormExpose } = formMethods
|
||||
|
||||
const submit = async () => {
|
||||
const elForm = await getElFormExpose()
|
||||
const valid = await elForm?.validate().catch((err) => {
|
||||
console.log(err)
|
||||
})
|
||||
if (valid) {
|
||||
const formData = await getFormData();
|
||||
formData.cron = formSchema[0].value;
|
||||
return formData
|
||||
}
|
||||
}
|
||||
|
||||
watch(
|
||||
() => props.currentRow,
|
||||
(currentRow) => {
|
||||
if (!currentRow) return
|
||||
setValues(currentRow)
|
||||
},
|
||||
{
|
||||
deep: true,
|
||||
immediate: true
|
||||
}
|
||||
)
|
||||
//修改定时器的信息
|
||||
const changeCron = (corn)=>{
|
||||
formSchema[0].value = corn.toString();
|
||||
formSchema[0].componentProps.value = corn.toString();
|
||||
if(formSchema[0].value != '[object Event]'){
|
||||
NewCornData = formSchema[0].value
|
||||
}
|
||||
}
|
||||
const closeDialog = ()=>{
|
||||
if(NewCornData != formSchema[0].value){
|
||||
formSchema[0].value = NewCornData;
|
||||
formSchema[0].componentProps.value = NewCornData;
|
||||
}
|
||||
showCron.value = false;
|
||||
}
|
||||
defineExpose({
|
||||
submit
|
||||
})
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<Form :rules="rules" @register="formRegister" :schema="formSchema" />
|
||||
<ElDialog v-model="showCron">
|
||||
<vue3CronPlus
|
||||
i18n="cn"
|
||||
@change="changeCron"
|
||||
@close="closeDialog"
|
||||
max-height="300px"
|
||||
/>
|
||||
</ElDialog>
|
||||
</template>
|
||||
<style scoped>
|
||||
.vue3-cron-plus-container>>>.language{
|
||||
top:40px !important;
|
||||
}
|
||||
</style>
|
||||
@ -0,0 +1,65 @@
|
||||
<script setup lang="tsx">
|
||||
import { ElContainer,ElTreeSelect,ElTree } from 'element-plus';
|
||||
import { ref, reactive, toRefs, watch, onMounted, nextTick } from 'vue';
|
||||
|
||||
let databaseList = reactive([]);//数据库信息
|
||||
let database = ref("");//当前选择的数据库名称
|
||||
let datatable = reactive([]);//当前选择的数据库表
|
||||
let datatableList = reactive([]);
|
||||
const datatableProps = {
|
||||
children: 'children',
|
||||
label: 'label',
|
||||
}
|
||||
|
||||
// 过滤表格数据
|
||||
const filterDataTableList = (value: string, data: Tree) => {
|
||||
if (!value) return true
|
||||
return data.label.includes(value)
|
||||
}
|
||||
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<!-- 左侧选择数据库表 -->
|
||||
<!-- 右侧显示筛选信息什么的信息 -->
|
||||
<div class="common-layout">
|
||||
<ElContainer>
|
||||
<ElAside width="250px" height="100%">
|
||||
<ElTabs type="border-card">
|
||||
<ElTabPane label="数据表" name="dataTable">
|
||||
<ElTreeSelect
|
||||
v-model="database"
|
||||
:data="databaseList"
|
||||
placeholder="请选择数据库"
|
||||
filterable
|
||||
style="width: 230px"
|
||||
/>
|
||||
<ElTree
|
||||
ref="treeRef"
|
||||
style="max-width: 230px"
|
||||
class="filter-tree"
|
||||
:data="datatableList"
|
||||
:props="datatableProps"
|
||||
default-expand-all
|
||||
:filter-node-method="filterDataTableList"
|
||||
/>
|
||||
</ElTabPane>
|
||||
<ElTabPane label="指标加工规则" name="IndexProcessRule" />
|
||||
</ElTabs>
|
||||
</ElAside>
|
||||
<ElMain>
|
||||
<ElTabs tab-position="right">
|
||||
<ElTabPane label="查询结构图" name="struTreePane" />
|
||||
<ElTabPane label="过滤条件" name="filterPane" />
|
||||
</ElTabs>
|
||||
<ElDivider>关联关系</ElDivider>
|
||||
|
||||
</ElMain>
|
||||
</ElContainer>
|
||||
</div>
|
||||
</template>
|
||||
<style scoped>
|
||||
.vue3-cron-plus-container>>>.language{
|
||||
top:40px !important;
|
||||
}
|
||||
</style>
|
||||
@ -0,0 +1,42 @@
|
||||
<!-- 关联关系 -->
|
||||
<script setup lang="tsx">
|
||||
import { PropType,ref,reactive, watch } from 'vue'
|
||||
import { useValidator } from '@/hooks/web/useValidator'
|
||||
import { ElForm,ElFormItem, ElRadioGroup,ElRadio } from 'element-plus'
|
||||
|
||||
const { required } = useValidator()
|
||||
|
||||
const props = defineProps({
|
||||
currentRow: {
|
||||
type: Object as PropType<any>,
|
||||
default: () => null
|
||||
}
|
||||
})
|
||||
|
||||
const rules = reactive({
|
||||
|
||||
})
|
||||
|
||||
let structerRelation = reactive({
|
||||
parentTable: '',//主表
|
||||
relationship: 'LEFT',//关联关系
|
||||
})
|
||||
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<ElForm :model="structerRelation" label-width="auto" style="max-width: 600px">
|
||||
<ElFormItem label="主表">
|
||||
<ElInput v-model="structerRelation.parentTable" />
|
||||
</ElFormItem>
|
||||
<ElFormItem label="关联关系">
|
||||
<ElRadioGroup v-model="structerRelation.relationship">
|
||||
<ElRadio value="LEFT">左关联</ElRadio>
|
||||
<ElRadio value="INNER">等值关联</ElRadio>
|
||||
</ElRadioGroup>
|
||||
</ElFormItem>
|
||||
</ElForm>
|
||||
</template>
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
@ -0,0 +1,105 @@
|
||||
<script setup lang="tsx">
|
||||
import { Form, FormSchema } from '@/components/Form'
|
||||
import { useForm } from '@/hooks/web/useForm'
|
||||
import { PropType,ref,reactive, watch } from 'vue'
|
||||
import { useValidator } from '@/hooks/web/useValidator'
|
||||
import { ElDialog } from 'element-plus';
|
||||
import {vue3CronPlus} from '@/views/vue3-cron-plus/index'
|
||||
const { required } = useValidator()
|
||||
|
||||
const props = defineProps({
|
||||
currentRow: {
|
||||
type: Object as PropType<any>,
|
||||
default: () => null
|
||||
}
|
||||
})
|
||||
let showCron = ref(false);
|
||||
let NewCornData = "";//当前最新的corn语句的定义
|
||||
|
||||
const formSchema = reactive<FormSchema[]>([
|
||||
{
|
||||
field: 'cron',
|
||||
label: '定时器信息',
|
||||
component: 'Input',
|
||||
colProps: {
|
||||
span: 24
|
||||
},
|
||||
componentProps:{
|
||||
value:"",
|
||||
on:{
|
||||
click:()=>{
|
||||
NewCornData = formSchema[0].value;
|
||||
showCron.value = true;
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
])
|
||||
|
||||
const rules = reactive({
|
||||
cron:[required()],
|
||||
})
|
||||
|
||||
const { formRegister, formMethods } = useForm()
|
||||
const { setValues,getFormData, getElFormExpose } = formMethods
|
||||
|
||||
const submit = async () => {
|
||||
const elForm = await getElFormExpose()
|
||||
const valid = await elForm?.validate().catch((err) => {
|
||||
console.log(err)
|
||||
})
|
||||
if (valid) {
|
||||
const formData = await getFormData();
|
||||
formData.cron = formSchema[0].value;
|
||||
return formData
|
||||
}
|
||||
}
|
||||
|
||||
watch(
|
||||
() => props.currentRow,
|
||||
(currentRow) => {
|
||||
if (!currentRow) return
|
||||
setValues(currentRow)
|
||||
},
|
||||
{
|
||||
deep: true,
|
||||
immediate: true
|
||||
}
|
||||
)
|
||||
//修改定时器的信息
|
||||
const changeCron = (corn)=>{
|
||||
formSchema[0].value = corn.toString();
|
||||
formSchema[0].componentProps.value = corn.toString();
|
||||
if(formSchema[0].value != '[object Event]'){
|
||||
NewCornData = formSchema[0].value
|
||||
}
|
||||
}
|
||||
const closeDialog = ()=>{
|
||||
if(NewCornData != formSchema[0].value){
|
||||
formSchema[0].value = NewCornData;
|
||||
formSchema[0].componentProps.value = NewCornData;
|
||||
}
|
||||
showCron.value = false;
|
||||
}
|
||||
defineExpose({
|
||||
submit
|
||||
})
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<Form :rules="rules" @register="formRegister" :schema="formSchema" />
|
||||
<ElDialog v-model="showCron">
|
||||
<vue3CronPlus
|
||||
i18n="cn"
|
||||
@change="changeCron"
|
||||
@close="closeDialog"
|
||||
max-height="300px"
|
||||
/>
|
||||
</ElDialog>
|
||||
</template>
|
||||
<style scoped>
|
||||
.vue3-cron-plus-container>>>.language{
|
||||
top:40px !important;
|
||||
}
|
||||
</style>
|
||||
@ -0,0 +1,137 @@
|
||||
<!-- 参数配置界面 -->
|
||||
<script setup lang="tsx">
|
||||
import { Form, FormSchema } from '@/components/Form'
|
||||
import { useForm } from '@/hooks/web/useForm'
|
||||
import { PropType,ref,reactive, watch,unref } from 'vue'
|
||||
import { useValidator } from '@/hooks/web/useValidator'
|
||||
const { required } = useValidator()
|
||||
|
||||
const props = defineProps({
|
||||
currentRow: {
|
||||
type: Object as PropType<any>,
|
||||
default: () => null
|
||||
}
|
||||
})
|
||||
|
||||
const tableColumns = reactive<ElTableColumn[]>([
|
||||
{
|
||||
field: 'selection',
|
||||
type: 'selection',
|
||||
width: 50,
|
||||
},
|
||||
{
|
||||
field: 'index',
|
||||
label: '序号',
|
||||
fixed:"left",
|
||||
width: 120,
|
||||
},
|
||||
{
|
||||
field: 'jId',
|
||||
label: '参数名称',
|
||||
},
|
||||
{
|
||||
field: 'jId',
|
||||
label: '参数注释',
|
||||
},
|
||||
{
|
||||
field: 'jId',
|
||||
label: '参数默认值',
|
||||
},
|
||||
{
|
||||
field: 'jId',
|
||||
label: '测试运行默认值',
|
||||
},
|
||||
{
|
||||
field: 'jId',
|
||||
label: '字段类型'
|
||||
}
|
||||
])
|
||||
|
||||
const formSchema = reactive<FormSchema[]>([
|
||||
|
||||
])
|
||||
|
||||
const rules = reactive({
|
||||
|
||||
})
|
||||
|
||||
const { formRegister, formMethods } = useForm()
|
||||
const { setValues,getFormData, getElFormExpose } = formMethods
|
||||
watch(
|
||||
() => props.currentRow,
|
||||
(currentRow) => {
|
||||
if (!currentRow) return
|
||||
setValues(currentRow)
|
||||
},
|
||||
{
|
||||
deep: true,
|
||||
immediate: true
|
||||
}
|
||||
)
|
||||
|
||||
let searchParam = reactive({
|
||||
paramsType:"",//参数类型
|
||||
searchText:"",//参数名称
|
||||
})
|
||||
let filterList = reactive([]);//当前表格的列项
|
||||
//表格的信息多选
|
||||
const onSelectionChange = (ids)=>{
|
||||
|
||||
}
|
||||
//添加参数
|
||||
const handleAddParams = ()=>{
|
||||
|
||||
}
|
||||
|
||||
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<ElContainer>
|
||||
<ElContainer>
|
||||
<ElHeader>
|
||||
<ElButton type="success" @click="handleAddParams">添加参数</ElButton>
|
||||
<ElButton type="danger">批量删除</ElButton>
|
||||
<ElInput
|
||||
v-model="searchParam.searchText"
|
||||
placeholder="按参数名称或注释搜索"
|
||||
clearable
|
||||
>
|
||||
<template #prepend>
|
||||
<el-select v-model="searchParam.paramsType" placeholder="Select" style="width: 115px">
|
||||
<el-option label="参数名称" value="code" />
|
||||
<el-option label="参数注释" value="name" />
|
||||
</el-select>
|
||||
</template>
|
||||
</ElInput>
|
||||
</ElHeader>
|
||||
<ElMain>
|
||||
<!-- 参数配置字段信息的表格 -->
|
||||
<ElTable
|
||||
align="center"
|
||||
headerAlign="center"
|
||||
:data="filterList"
|
||||
@selection-change="onSelectionChange"
|
||||
style="width:100%;"
|
||||
height="calc(100% - 50px)"
|
||||
>
|
||||
<ElTableColumn fixed type="selection" width="55" />
|
||||
<ElTableColumn width="{60}" fixed label="序号" align="center" />
|
||||
<ElTableColumn prop="filedName" label="参数名称" />
|
||||
<ElTableColumn prop="label" label="参数注释" />
|
||||
<ElTableColumn prop="defaultVal" label="参数默认值" />
|
||||
<ElTableColumn prop="testVal" label="测试运行默认值" />
|
||||
<ElTableColumn prop="fieldType" label="字段类型" />
|
||||
</ElTable>
|
||||
</ElMain>
|
||||
</ElContainer>
|
||||
<ElAside width="200px">
|
||||
<Form :rules="rules" @register="formRegister" :schema="formSchema" />
|
||||
</ElAside>
|
||||
</ElContainer>
|
||||
</template>
|
||||
<style scoped>
|
||||
.vue3-cron-plus-container>>>.language{
|
||||
top:40px !important;
|
||||
}
|
||||
</style>
|
||||
Loading…
Reference in new issue