From 2ee312d3c399ddc62a06189367fa3879fca7daef Mon Sep 17 00:00:00 2001
From: wangting <675591594@qq.com>
Date: 星期五, 10 五月 2024 15:35:24 +0800
Subject: [PATCH] UI展示
---
Source/ProjectWeb/src/components/dynamic-components/dynamic-TreeTable.vue | 274 +++++++++++++++++++++++++++++++++++++++---------------
1 files changed, 197 insertions(+), 77 deletions(-)
diff --git a/Source/ProjectWeb/src/components/dynamic-components/dynamic-TreeTable.vue b/Source/ProjectWeb/src/components/dynamic-components/dynamic-TreeTable.vue
index a545bd7..2e4dc1f 100644
--- a/Source/ProjectWeb/src/components/dynamic-components/dynamic-TreeTable.vue
+++ b/Source/ProjectWeb/src/components/dynamic-components/dynamic-TreeTable.vue
@@ -5,6 +5,7 @@
:data="TreeData"
:option="option"
:page.sync="pageType"
+ @row-click="rowClickChange"
@selection-change="TreeSelectChange">
<template #icon="scope">
<i :class="scope.row.icon"
@@ -12,14 +13,14 @@
</template>
<!--top鍖哄煙鎸夐挳-->
<template slot="menuLeft" slot-scope="scope">
- <dynamic-button :butttonList="componentVO.buttons" :selectList="selectList" LocationType="top"
- type="table"></dynamic-button>
+ <dynamic-button :componentVO="componentVO" :butttonList="componentVO.buttons" :dataStore="TreeSelectList" :sourceData="sourceData" LocationType="top"
+ type="TreeTable"></dynamic-button>
</template>
<!--menu鍖哄煙鎸夐挳-->
<template slot="menu" slot-scope="scope">
- <dynamic-button :butttonList="componentVO.buttons" :scope="scope" :selectList="selectList" LocationType="menu"
- type="table"></dynamic-button>
+ <dynamic-button :componentVO="componentVO" :butttonList="componentVO.buttons" :scope="scope" :dataStore="TreeSelectList" :sourceData="sourceData" LocationType="menu" default="default"
+ type="TreeTable"></dynamic-button>
</template>
</avue-crud>
</div>
@@ -29,6 +30,14 @@
export default {
name: "dynamic-TreeTable",
props: {
+ //ui涓婁笅鏂囩殑涓氬姟绫诲瀷锛堟垨閾炬帴绫诲瀷锛�
+ uiBtmType: {
+ type: String
+ },
+ //ui涓婁笅鏂�
+ uiContext:{
+ type: String
+ },
componentVO: {
type: Object,
default: {}
@@ -72,11 +81,11 @@
currentPage: 1,
total: 50,
},
- simplePage:{
+ simplePage: {
currentPage: 1,
total: 100,
- pagerCount:4,
- layout:"prev, pager, next"
+ pagerCount: 4,
+ layout: "prev, pager, next"
},
//琛ㄦ牸鏍�
form: {},
@@ -86,7 +95,7 @@
editBtn: false,
delBtn: false,
selection: true,
- tip:false,
+ tip: false,
calcHeight: 15,
indexFixed: false,
menuFixed: false,
@@ -106,90 +115,183 @@
prop: 'comment'
}
],
- rowKey: 'id',
- rowParentKey: 'parentId',
-
+ rowKey: this.componentVO.treeTableDefineVO.treeCurrentField || 'oid',
+ rowParentKey: this.componentVO.treeTableDefineVO.treeParentField || 'parentOid',
},
- TreeData: [
+ TreeData: [],
+ TreeSelectList: [],
+ // 琛ㄥ崟鏁版嵁
+ formList: [
{
- id: 10,
- event: '浜嬩欢1',
- timeLine: 50,
- comment: '鏃�'
+ comboxKey: null,
+ customClass: null,
+ data: null,
+ dateFormate: null,
+ defaultValue: "",
+ displayExtension: "",
+ extendAttrMap: null,
+ extendAttrString: null,
+ field: "name",
+ hidden: false,
+ keyAttr: true,
+ prefix: null,
+ readOnly: false,
+ referConfig: null,
+ required: true,
+ selectLibFlag: null,
+ showField: null,
+ suffix: '$',
+ text: "鍚嶇О",
+ tooltips: '鍚嶇О',
+ type: "text",
+ unique: false,
+ verify: ""
},
{
- id: 1,
- event: '浜嬩欢1',
- timeLine: 100,
- comment: '鏃�',
- children: [
- {
- parentId: 1,
- id: 2,
- event: '浜嬩欢2',
- timeLine: 10,
- comment: '鏃�'
- },
- {
- parentId: 1,
- id: 3,
- event: '浜嬩欢3',
- timeLine: 90,
- comment: '鏃�',
- children: [
- {
- parentId: 3,
- id: 4,
- event: '浜嬩欢4',
- timeLine: 5,
- comment: '鏃�'
- },
- {
- parentId: 3,
- id: 5,
- event: '浜嬩欢5',
- timeLine: 10,
- comment: '鏃�'
- }
- ]
- }
- ]
+ comboxKey: null,
+ customClass: null,
+ data: null,
+ dateFormate: null,
+ defaultValue: "",
+ displayExtension: "",
+ extendAttrMap: null,
+ extendAttrString: null,
+ field: "code",
+ hidden: false,
+ keyAttr: false,
+ prefix: null,
+ readOnly: false,
+ referConfig: null,
+ required: false,
+ selectLibFlag: null,
+ showField: null,
+ suffix: null,
+ disabled: true,
+ text: "缂栫爜",
+ tooltips: null,
+ type: "text",
+ unique: false,
+ verify: ""
},
{
- id: 10,
- event: '浜嬩欢3',
- timeLine: 50,
- comment: '鏃�'
+ comboxKey: "EnumReviewType",
+ customClass: null,
+ data: null,
+ dateFormate: null,
+ defaultValue: "department",
+ displayExtension: "",
+ extendAttrMap: null,
+ extendAttrString: null,
+ field: "reviewtype",
+ hidden: false,
+ keyAttr: false,
+ prefix: null,
+ readOnly: false,
+ referConfig: null,
+ required: false,
+ selectLibFlag: null,
+ showField: null,
+ suffix: null,
+ text: "绫诲瀷",
+ tooltips: null,
+ type: "combox",
+ unique: false,
+ verify: "",
+ dicData: [{
+ label: '娴嬭瘯1',
+ value: 'department'
+ }, {
+ label: '娴嬭瘯2',
+ value: 'departments'
+ }]
},
{
- id: 10,
- event: '浜嬩欢4',
- timeLine: 50,
- comment: '鏃�'
+ comboxKey: null,
+ customClass: null,
+ data: null,
+ dateFormate: null,
+ defaultValue: "",
+ displayExtension: "",
+ extendAttrMap: null,
+ extendAttrString: null,
+ field: "creator",
+ hidden: true,
+ keyAttr: false,
+ prefix: null,
+ readOnly: true,
+ referConfig: null,
+ required: false,
+ selectLibFlag: null,
+ showField: null,
+ suffix: null,
+ text: "鍒涘缓浜�",
+ tooltips: null,
+ type: "text",
+ unique: false,
+ verify: ""
},
{
- id: 10,
- event: '浜嬩欢5',
- timeLine: 50,
- comment: '鏃�'
+ comboxKey: null,
+ customClass: null,
+ data: null,
+ dateFormate: "yyyy-MM-dd HH:mm:ss",
+ defaultValue: "",
+ displayExtension: "",
+ extendAttrMap: null,
+ extendAttrString: null,
+ field: "createtime",
+ hidden: true,
+ keyAttr: false,
+ prefix: null,
+ readOnly: false,
+ referConfig: null,
+ required: false,
+ selectLibFlag: null,
+ showField: null,
+ suffix: null,
+ text: "鍒涘缓鏃堕棿",
+ tooltips: null,
+ type: "datetime",
+ unique: false,
+ verify: ""
},
{
- id: 10,
- event: '浜嬩欢6',
- timeLine: 50,
- comment: '鏃�'
+ comboxKey: null,
+ customClass: null,
+ data: null,
+ dateFormate: null,
+ defaultValue: "",
+ displayExtension: "",
+ extendAttrMap: null,
+ extendAttrString: null,
+ field: "content",
+ hidden: false,
+ keyAttr: false,
+ prefix: null,
+ readOnly: false,
+ referConfig: null,
+ required: false,
+ selectLibFlag: null,
+ showField: null,
+ suffix: null,
+ text: "澶囨敞",
+ tooltips: null,
+ type: "textarea",
+ unique: false,
+ verify: ""
},
],
- TreeSelectList: []
+ formName: '',
+ visible:false
}
},
- watch:{
- parentHeight:{
+ watch: {
+ parentHeight: {
handler(newval) {
- if(newval >50){
- this.option.height=newval;
+ if (newval > 50) {
+ this.option.height = newval;
//doLayout涓嶇敓鏁堬紝鎵嬪姩璁剧疆琛ㄦ牸楂樺害
- this.$children[0].$children[1].$children[1].$children[0].$el.style.height=newval+'px';
+ this.$children[0].$children[1].$children[1].$children[0].$el.style.height = newval + 'px';
/*this.$nextTick(() => {
if (this.$refs.dataTable && this.$refs.dataTable.doLayout) {
this.$refs.dataTable.doLayout();
@@ -198,11 +300,18 @@
}
}
},
- isShow:{
+ isShow: {
handler(newval) {
- if(newval && this.$el.clientHeight>50) {
+ if (newval && this.$el.clientHeight > 50) {
this.parentHeight = this.$el.clientHeight - this.$children[0].$children[1].$children[0].$el.clientHeight - this.$children[0].$children[2].$el.clientHeight - 5;
}
+ }
+ },
+ sourceData:{
+ handler(newval) {
+ //婧愭暟鎹湁鍙樺寲鏃跺彉鏇村綋鍓嶅尯鍩熸暟鎹�
+ console.log(this.areasName);
+ console.log(newval);
}
}
},
@@ -214,12 +323,23 @@
},
computed: {
pageType() {
- return this.areasName === 'westArea' ? this.simplePage : this.page;
+ return this.areasName.indexOf('westArea') == 0 ? this.simplePage : this.page;
}
},
methods: {
+ rowClickChange(row){
+ this.$refs.treeTable.toggleRowSelection(row);
+ },
TreeSelectChange(row) {
this.TreeSelectList = row;
+ this.$emit("setDataStore", {
+ area: this.areasName,
+ type:this.componentVO.uiComponentType,
+ dataStore:row
+ });
+ },
+ handleRefresh(){
+ this.$refs.treeTable.refreshTable();
}
}
}
--
Gitblit v1.9.3