修改测试bug，优化页面
This commit is contained in:
guanj
@@ -13,32 +13,16 @@
|
||||
<el-input v-model="form.name" placeholder="请输入组件名称"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item class="top" label="父组件节点" prop="system">
|
||||
<!-- <el-cascader
|
||||
<el-cascader
|
||||
v-model="form.system"
|
||||
:options="customDeptOption"
|
||||
:props="props"
|
||||
placeholder="请选择父组件节点"
|
||||
style="width: 100%"
|
||||
/> -->
|
||||
<el-select v-model="form.systemType" placeholder="请选择父组件节点">
|
||||
<el-option
|
||||
v-for="item in customDeptOption"
|
||||
:key="item.id"
|
||||
:label="item.name"
|
||||
:value="item.id"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item class="top" label="组件绑定系统" prop="systemIds">
|
||||
<el-select
|
||||
v-model="form.systemIds"
|
||||
multiple
|
||||
collapse-tags
|
||||
collapse-tags-tooltip
|
||||
placeholder="请选择组件绑定系统"
|
||||
>
|
||||
<el-option v-for="item in systemList" :key="item.id" :label="item.name" :value="item.id" />
|
||||
</el-select>
|
||||
clearable
|
||||
placeholder="请选择父组件节点"
|
||||
style="width: 100%"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item label="组件图标" prop="icon">
|
||||
<IconSelector v-model="form.icon" placeholder="请选择图标" />
|
||||
@@ -58,7 +42,17 @@
|
||||
<el-checkbox-button value="5">日</el-checkbox-button>
|
||||
</el-checkbox-group>
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item class="top" label="组件绑定系统" prop="systemIds">
|
||||
<el-select
|
||||
v-model="form.systemIds"
|
||||
multiple
|
||||
collapse-tags
|
||||
collapse-tags-tooltip
|
||||
placeholder="请选择组件绑定系统"
|
||||
>
|
||||
<el-option v-for="item in systemList" :key="item.id" :label="item.name" :value="item.id" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item class="top" label="组件排序" prop="sort">
|
||||
<el-input v-model.number="form.sort" placeholder="请输入组件排序"></el-input>
|
||||
</el-form-item>
|
||||
@@ -112,7 +106,7 @@ const form = ref<anyObj>({
|
||||
systemIds: [],
|
||||
path: ''
|
||||
})
|
||||
const props = { label: 'name', value: 'id' }
|
||||
const props = { label: 'name', value: 'id', multiple: true }
|
||||
const rules = {
|
||||
code: [{ required: true, message: '请输入组件标识', trigger: 'blur' }],
|
||||
name: [{ required: true, message: '请输输入组件名称', trigger: 'blur' }],
|
||||
@@ -128,11 +122,11 @@ const systemList = dictData.getBasicData('System_Type')
|
||||
onMounted(() => {
|
||||
customDeptOption.value = dictData.getBasicData('Component_Type')
|
||||
|
||||
// customDeptOption.value.forEach((item: any) => {
|
||||
// getFatherComponent({ systemType: item.id }).then(res => {
|
||||
// item.children = res.data.filter(item => item.name != '无')
|
||||
// })
|
||||
// })
|
||||
customDeptOption.value.forEach((item: any) => {
|
||||
getFatherComponent({ systemType: item.id }).then(res => {
|
||||
item.children = res.data.filter(item => item.name != '无')
|
||||
})
|
||||
})
|
||||
})
|
||||
|
||||
const open = (text: string, data?: anyObj) => {
|
||||
@@ -142,12 +136,14 @@ const open = (text: string, data?: anyObj) => {
|
||||
if (data) {
|
||||
let Data = JSON.parse(JSON.stringify(data))
|
||||
form.value = Data
|
||||
form.value.system = [Data.systemType]
|
||||
form.value.system = [Data.systemType, Data.pid]
|
||||
// form.value.timeKeys = Data.timeKeys.split(',').map(Number)
|
||||
form.value.timeKeys = Data.timeKeys || []
|
||||
}
|
||||
}
|
||||
const submit = () => {
|
||||
console.log('🚀 ~ submit ~ form.value:', form.value)
|
||||
|
||||
formRef.value.validate(async (valid: boolean) => {
|
||||
if (valid) {
|
||||
let url = ''
|
||||
@@ -172,8 +168,11 @@ const submit = () => {
|
||||
if (title.value == '新增组件') {
|
||||
await componentAdd({
|
||||
...form.value,
|
||||
systemType: form.value.system
|
||||
.map(subArr => (subArr.length > 1 ? subArr.at(-1) : null))
|
||||
.filter(item => item !== null),
|
||||
// systemType: form.value.system[0],
|
||||
pid: '',
|
||||
pid: form.value.system[1],
|
||||
image: url
|
||||
}).then(res => {
|
||||
ElMessage.success('新增成功!')
|
||||
@@ -184,7 +183,10 @@ const submit = () => {
|
||||
await componentEdit({
|
||||
...form.value,
|
||||
// systemType: form.value.system[0],
|
||||
pid: '',
|
||||
systemType: form.value.system
|
||||
.map(subArr => (subArr.length > 1 ? subArr.at(-1) : null))
|
||||
.filter(item => item !== null),
|
||||
pid: form.value.system[1],
|
||||
image: url
|
||||
}).then(res => {
|
||||
ElMessage.success('修改成功!')
|
||||
|
||||
@@ -1,11 +1,12 @@
|
||||
<template>
|
||||
<div class="default-main">
|
||||
<TableHeader :showSearch="false">
|
||||
<template v-slot:operation>
|
||||
<!-- <el-button type="primary" @click="addTree" icon="el-icon-Plus">新增树</el-button> -->
|
||||
<el-button type="primary" @click="add" icon="el-icon-Plus">新增组件</el-button>
|
||||
</template>
|
||||
</TableHeader>
|
||||
<div class="default-main pd10">
|
||||
<div class="elButton">
|
||||
<el-button type="primary" @click="addTree" icon="el-icon-Plus">新增树</el-button>
|
||||
<el-button type="primary" @click="add" icon="el-icon-Plus">新增组件</el-button>
|
||||
</div>
|
||||
<!-- <TableHeader :showSearch="false">
|
||||
|
||||
</TableHeader> -->
|
||||
<!-- <Table
|
||||
ref="tableRef"
|
||||
:tree-config="{ transform: true, parentField: 'uPid', rowField: 'uId' }"
|
||||
@@ -13,14 +14,14 @@
|
||||
/> -->
|
||||
<el-tabs v-model="tableName" type="border-card" @tab-change="changeTab">
|
||||
<el-tab-pane v-for="item in tableStore.table.data" :key="item.name" :label="item.name" :name="item.name">
|
||||
<el-tabs v-model="tableName1" tab-position="left" class="componentList">
|
||||
<el-tabs v-model="tableName1" tab-position="left" class="componentList">
|
||||
<el-tab-pane v-for="k in item?.children" :key="k.name" :label="k.name" :name="k.name">
|
||||
<template #label>
|
||||
<span class="custom-tabs-label">
|
||||
<p>{{ k.name }}</p>
|
||||
|
||||
<!-- <el-icon><Edit /></el-icon> -->
|
||||
<!-- <el-button
|
||||
<el-button
|
||||
type="primary"
|
||||
icon="el-icon-Edit"
|
||||
link
|
||||
@@ -33,13 +34,13 @@
|
||||
link
|
||||
class="ml0"
|
||||
@click.stop="del(k)"
|
||||
></el-button> -->
|
||||
></el-button>
|
||||
</span>
|
||||
</template>
|
||||
<div :style="height" style="overflow-y: auto; overflow-x: hidden">
|
||||
<el-row :gutter="10" class="pl5 pr5 pt5">
|
||||
<el-col :span="6" v-for="component in k.children" :key="component.id" class="mb10">
|
||||
<el-card class="box-card" shadow="hover">
|
||||
<el-card class="box-card" shadow="hover">
|
||||
<div slot="header" class="clearfix">
|
||||
<span style="display: flex; align-items: center">
|
||||
{{ component.name }}
|
||||
@@ -104,7 +105,7 @@ defineOptions({
|
||||
const addRef = ref()
|
||||
const addFlag = ref(false)
|
||||
const tableRef = ref()
|
||||
const height = ref(mainHeight(140))
|
||||
const height = ref(mainHeight(100))
|
||||
const treeRef = ref()
|
||||
const tableName = ref('')
|
||||
const tableName1 = ref('')
|
||||
@@ -356,9 +357,15 @@ span {
|
||||
min-width: 128px;
|
||||
}
|
||||
}
|
||||
:deep(.componentList){
|
||||
.el-tabs__header{
|
||||
height: calc(100vh - 250px)!important;
|
||||
:deep(.componentList) {
|
||||
.el-tabs__header {
|
||||
height: calc(100vh - 210px) !important;
|
||||
}
|
||||
}
|
||||
.elButton{
|
||||
position: absolute;
|
||||
top: 13px;
|
||||
right: 10px;
|
||||
z-index: 1;
|
||||
}
|
||||
</style>
|
||||
|
||||
Reference in New Issue
Block a user