From 9412cc46c7d135d29dc6bf9b7ae36a3b6b17347c Mon Sep 17 00:00:00 2001
From: 田源 <lastanimals@163.com>
Date: 星期三, 07 六月 2023 18:11:21 +0800
Subject: [PATCH] 分类树组件封装,联调真实表格数据
---
Source/UBCS-WEB/src/components/Crud/Crud.vue | 101 ++++++++----
Source/UBCS-WEB/src/store/index.js | 4
Source/UBCS-WEB/src/store/modules/master.js | 16 ++
Source/UBCS-WEB/src/main.js | 2
Source/UBCS-WEB/src/views/MasterData/items.vue | 182 +++++-----------------
Source/UBCS-WEB/vue.config.js | 9
Source/UBCS-WEB/src/components/Master/MasterTree.vue | 124 +++++++++++++++
7 files changed, 258 insertions(+), 180 deletions(-)
diff --git a/Source/UBCS-WEB/src/components/Crud/Crud.vue b/Source/UBCS-WEB/src/components/Crud/Crud.vue
index 49edc24..6d66a84 100644
--- a/Source/UBCS-WEB/src/components/Crud/Crud.vue
+++ b/Source/UBCS-WEB/src/components/Crud/Crud.vue
@@ -97,17 +97,22 @@
return {}
}
},
- templateOid:{
- type:String,
- default:""
- },
codeClassifyOid:{
type:String,
default:""
+ },
+ coderuleoid:{
+ type:String,
+ default:""
+ },
+ tableDataArray:{
+ type:Array,
+ default:[]
}
},
data() {
return {
+ templateOid:"",
addvisible:false,
editvisible:false,
findvisible:false,
@@ -135,26 +140,49 @@
},
tableData:[],
tableHeadData:[],
- items:{}
+ items:{},
+ aaa:""
}
},
computed:{
-
},
created() {
this.CrudHeaderRend();
- this.CrudRend()
+ this.$emit('tableData',this.tableData)
+ },
+ mounted() {
+
},
activated() {
this.doLayout()
},
+ watch:{
+ codeClassifyOid:{
+ handler(newval,oldval){
+ this.codeClassifyOid=newval;
+ this.CrudHeaderRend()
+ },
+ deep:true
+ },
+ tableDataArray:{
+ handler(newval,oldval){
+ this.tableData=newval;
+ this.CrudRend()
+ }
+ }
+ },
methods: {
+ rend(){
+ this.tableData=this.tableHeadData
+ },
handleSizeChange(val){
this.page.pageSize=val
+ this.$emit('pageSize',val)
this.CrudRend()
},
handleCurrentChange(val){
this.page.currentPage=val
+ this.$emit('currentPage',val)
this.CrudRend()
},
// 鐩戝惉鍗曞厓鏍肩偣鍑讳簨浠跺苟瀛樺偍姝e湪缂栬緫鐨勮
@@ -178,38 +206,41 @@
},
//琛ㄦ牸澶存覆鏌�
CrudHeaderRend() {
- MasterTable({
- codeClassifyOid: "D9CF223F-317D-71EB-BD11-433A94CAD9F3",
- functionId: 5,
- _: 1685067339479
- }).then(res => {
- this.options=res.data.tableDefineVO.seniorQueryColumns
- this.List = res.data.tableDefineVO.cols[0];
- this.List.forEach(item => {
- let columnItem = {
- label: item.title,
- prop: item.field,
- type: this.columnType[item.type],
- sortable: item.sort,
- width: item.minWidth
- };
- this.option.column.push(columnItem);
- this.option.column=this.tableHeadData;
+ if(this.codeClassifyOid != ""){
+ MasterTable({
+ codeClassifyOid:this.codeClassifyOid,
+ functionId: 5,
+ }).then(res => {
+ this.options=res.data.tableDefineVO.seniorQueryColumns
+ this.List = res.data.tableDefineVO.cols[0];
+ this.List.forEach(item => {
+ let columnItem = {
+ label: item.title,
+ prop: item.field,
+ type: this.columnType[item.type],
+ sortable: item.sort,
+ width: item.minWidth
+ };
+ this.option.column.push(columnItem);
+ this.option.column=this.tableHeadData;
+ this.templateOid=res.data.tableDefineVO.oid
+ this.$emit('templateOid',this.templateOid)
+ })
})
- })
+ }
},
//琛ㄦ牸鏁版嵁
CrudRend() {
- TableData({
- templateOid: this.templateOid,
- codeClassifyOid: this.codeClassifyOid,
- page: this.page.currentPage,
- limit:this.page.pageSize,
- }).then(res => {
- this.page.total = res.data.total;
- this.data = res.data.data;
- this.tableData=res.data.data;
- })
+ TableData({
+ templateOid: this.templateOid,
+ codeClassifyOid: this.codeClassifyOid,
+ page: this.page.currentPage,
+ limit:this.page.pageSize,
+ }).then(res => {
+ this.page.total = res.data.total;
+ this.data = res.data.data;
+ this.tableData=res.data.data;
+ })
},
// 鎺掑簭
sortChange(val) {
diff --git a/Source/UBCS-WEB/src/components/Master/MasterTree.vue b/Source/UBCS-WEB/src/components/Master/MasterTree.vue
new file mode 100644
index 0000000..e6f5bd5
--- /dev/null
+++ b/Source/UBCS-WEB/src/components/Master/MasterTree.vue
@@ -0,0 +1,124 @@
+<template>
+ <avue-tree ref="tree" v-model="CloneTreeAvueform" v-loading="loading" :data="Treedata" :defaultExpandAll="false"
+ :option="Treeoption"
+ style="height: 80.5vh;padding-top: 5px;padding-bottom: 30px"
+ @node-click=" nodeClick"
+ ></avue-tree>
+</template>
+
+<script>
+import {getTreeList} from "@/api/MasterData/master";
+import {mapMutations, mapState} from "vuex";
+import {TableData} from "@/api/GetItem";
+
+export default {
+ name: "MasterTree",
+ props:{
+ pageSize:{
+ type:String,
+ default:"10"
+ },
+ currentPage:{
+ type:String,
+ default:"1"
+ },
+ templateOid:{
+ type:String,
+ default:''
+ },
+ },
+ data(){
+ return{
+ tableDataArray:[],
+ codeClassifyOid:"",
+ coderuleoid:"",
+ CloneTreeAvueform:{},
+ loading:false,
+ Treedata:[],
+ nodeClickList: "",
+ Treeoption: {
+ addBtn: false,
+ editBtn: false,
+ delBtn: false,
+ defaultExpandAll: false,
+ menu: false,
+ lazy: true,
+ // treeLoad:function (node,resolve){
+ // console.log(node)
+ // console.log(resolve)
+ // }
+ treeLoad:function (node, resolve){
+ if(node.data != false){
+ const parentId = (node.level === 0) ? 0 : node.data.oid;
+ const parentBtmName = node.data.attributes.btmname
+ getTreeList({parentOid:parentId,parentBtmName:parentBtmName}).then(res=>{
+ resolve(res.data.map(item=>{
+ return {
+ ...item,
+ label:item.text
+ }
+ }))
+ })
+ }
+ },
+ },
+ }
+ },
+ created() {
+ this.getTreeList()
+
+ },
+ computed:{
+ },
+ methods:{
+ //鑾峰彇鏁版嵁
+ getTreeList(){
+ getTreeList({'conditionMap[id]': 'wupin'}).then(res=>{
+ this.Treedata=res.data
+ this.ModifyProperties(this.Treedata, 'text', 'label');
+ this.codeClassifyOid=res.data[0].oid;
+ this.coderuleoid=res.data[0].attributes.coderuleoid;
+ this.$emit("codeClassifyOid", this.codeClassifyOid )
+ this.$emit("coderuleoid", this.coderuleoid )
+ }).catch(res=>{
+ console.log(res)
+ })
+ },
+
+ //瀹氫箟涓�涓慨鏀规暟鎹睘鎬у悕鐨勬柟娉�
+ ModifyProperties(obj, oldName, newName) {
+ for (let key in obj) {
+ if (key === oldName) {
+ obj[newName] = obj[key];
+ delete obj[key];
+ }
+ if (typeof obj[key] === 'object') {
+ this.ModifyProperties(obj[key], oldName, newName);
+ }
+ }
+ },
+ //鏍戠偣鍑讳簨浠�
+ nodeClick(data){
+ this.nodeClickList = data;
+ console.log(this.currentPage,this.pageSize)
+ TableData({
+ templateOid: this.templateOid,
+ codeClassifyOid: this.codeClassifyOid,
+ page: this.pageSize,
+ limit:this.currentPage,
+ }).then(res => {
+ console.log(res)
+ // this.page.total = res.data.total;
+ // this.data = res.data.data;
+ this.tableDataArray=res.data.data;
+ this.$emit('tableDataArray',this.tableDataArray)
+ console.log(this.tableDataArray)
+ })
+ }
+ }
+}
+</script>
+
+<style scoped>
+
+</style>
diff --git a/Source/UBCS-WEB/src/main.js b/Source/UBCS-WEB/src/main.js
index 082a2cd..297be45 100644
--- a/Source/UBCS-WEB/src/main.js
+++ b/Source/UBCS-WEB/src/main.js
@@ -47,6 +47,7 @@
import originalAdd from "@/views/modeling/originalAdd"
import FormTemplateDialog from "@/components/FormTemplate/index"
import linkTypeAdd from "@/views/modeling/LinkTypeAdd"
+import MasterTree from "@/components/Master/MasterTree";
// 灏嗗伐鍏峰嚱鏁版坊鍔犲埌鍏ㄥ眬
import utilFunc from './util/func'
@@ -95,6 +96,7 @@
Vue.component('referSelectBtmAttrDialog',referSelectBtmAttrDialog)
Vue.component('FormTemplateDialog',FormTemplateDialog)
Vue.component('LinkTypeAdd',linkTypeAdd)
+Vue.component('MasterTree',MasterTree)
// 鍔犺浇鐩稿叧url鍦板潃
Object.keys(urls).forEach(key => {
diff --git a/Source/UBCS-WEB/src/store/index.js b/Source/UBCS-WEB/src/store/index.js
index 805b864..78e2049 100644
--- a/Source/UBCS-WEB/src/store/index.js
+++ b/Source/UBCS-WEB/src/store/index.js
@@ -6,6 +6,7 @@
import logs from './modules/logs'
import dict from './modules/dict'
import getters from './getters'
+import master from "./modules/master"
Vue.use(Vuex)
const store = new Vuex.Store({
@@ -14,7 +15,8 @@
common,
logs,
tags,
- dict
+ dict,
+ master
},
getters,
})
diff --git a/Source/UBCS-WEB/src/store/modules/master.js b/Source/UBCS-WEB/src/store/modules/master.js
new file mode 100644
index 0000000..d5d5467
--- /dev/null
+++ b/Source/UBCS-WEB/src/store/modules/master.js
@@ -0,0 +1,16 @@
+
+const master = {
+ state:{
+ codeClassifyOid:""
+ },
+ actions:{
+
+ },
+ mutations:{
+ codeClassifyOid(state,all){
+ state.codeClassifyOid=all
+ console.log(state.codeClassifyOid)
+ }
+ }
+}
+export default master
diff --git a/Source/UBCS-WEB/src/views/MasterData/items.vue b/Source/UBCS-WEB/src/views/MasterData/items.vue
index a101488..02ff88b 100644
--- a/Source/UBCS-WEB/src/views/MasterData/items.vue
+++ b/Source/UBCS-WEB/src/views/MasterData/items.vue
@@ -2,21 +2,32 @@
<el-container>
<el-aside>
<basic-container style="height: 85vh; max-height: 155vh; overflow-y: scroll;">
- <avue-tree ref="tree" v-model="CloneTreeAvueform" v-loading="loading" :data="Treedata" :defaultExpandAll="false"
- :option="Treeoption"
- style="height: 80.5vh;padding-top: 5px;padding-bottom: 30px"
- @node-click=" nodeClick"
- ></avue-tree>
+<!-- 鏍戠粍浠�-->
+ <master-tree @codeClassifyOid="codeClassifyOidList"
+ @coderuleoid="coderuleoidList"
+ :pageSize="this.pageSize"
+ :currentPage="this.currentPage"
+ :templateOid="this.templateOid"
+ @tableDataArray="tableDataArrays"
+
+ ></master-tree>
</basic-container>
</el-aside>
<el-main>
- <TableCrud :page="this.page" :templateOid="this.templateOid" :codeClassifyOid="this.codeClassifyOid"></TableCrud>
+<!-- 琛ㄦ牸缁勪欢-->
+ <TableCrud :page="this.page"
+ :codeClassifyOid="this.codeClassifyOid"
+ :coderuleoid="this.coderuleoid"
+ @pageSize="pageSizes"
+ @currentPage="currentPages"
+ @templateOid="templateOids"
+ :tableDataArray="tableDataArray"
+ ></TableCrud>
</el-main>
</el-container>
</template>
<script>
-import {getTreeList} from "@/api/MasterData/master"
export default {
name: "items.vue",
data(){
@@ -28,148 +39,35 @@
pageSize: 10,
pageSizes: [10, 30, 50, 100, 200],
},
- templateOid: "A12826E4-2B66-6D56-DE30-92BB1D7F607F",
- codeClassifyOid: "D9CF223F-317D-71EB-BD11-433A94CAD9F3",
- CloneTreeAvueform:{},
- loading:false,
- Treedata:[],
- Treeoption: {
- addBtn: false,
- editBtn: false,
- delBtn: false,
- defaultExpandAll: false,
- menu: false,
- lazy: true,
- // treeLoad:function (node,resolve){
- // console.log(node)
- // console.log(resolve)
- // }
- treeLoad:function (node, resolve){
- if(node.loading){
- const parentId = (node.level === 0) ? 0 : node.data.oid;
- const parentBtmName = node.data.attributes.btmname
- getTreeList({parentOid:parentId,parentBtmName:parentBtmName}).then(res=>{
- console.log(res)
- })
- }
- },
- },
- nodeClickList: "",
+ pageSize:"10",
+ currentPage:"1",
+ codeClassifyOid:"",
+ coderuleoid:"",
+ templateOid:"",
+ tableDataArray:[]
}
},
created() {
- // this.getAttr()
- this.getTreeList()
},
methods:{
- getTreeList(){
- getTreeList({'conditionMap[id]': 'wupin'}).then(res=>{
- this.Treedata=res.data
- this.ModifyProperties(this.Treedata, 'text', 'label');
- console.log(this.Treedata)
- }).catch(res=>{
- console.log(res)
- })
+ codeClassifyOidList(val){
+ this.codeClassifyOid=val;
+ console.log(val)
},
-
- //瀹氫箟涓�涓慨鏀规暟鎹睘鎬у悕鐨勬柟娉�
- ModifyProperties(obj, oldName, newName) {
- for (let key in obj) {
- if (key === oldName) {
- obj[newName] = obj[key];
- delete obj[key];
- }
- if (typeof obj[key] === 'object') {
- this.ModifyProperties(obj[key], oldName, newName);
- }
- }
+ coderuleoidList(val){
+ this.coderuleoid=val;
},
- //鏍戣妭鐐规坊鍔犳寜閽�
- // TreeAdd() {
- // this.TreeAddFormVisible = true;
- // // 鍒ゆ柇褰撳墠鏄惁鏈夌偣鍑诲瓙椤�
- // if (this.nodeClickList !== "") {
- // this.TreeFlag = true
- // }
- // },
- // //鏍戣妭鐐规坊鍔犱簨浠�
- // TreeAddHandler() {
- // const data = this.TreeAddform
- // this.$set(data, "parentCodeClassifyOid", this.nodeClickList.oid)
- // TreeSave(data).then(() => {
- // this.$message({
- // type: 'success',
- // message: '娣诲姞鎴愬姛!'
- // });
- // this.getAttr();
- // this.TreeAddFormVisible = false
- // this.TreeAddform = ""
- // }).catch(res => {
- // this.$message({
- // type: 'warning',
- // message: res
- // });
- // })
- // },
- //鏍戣妭鐐瑰垹闄ゆ寜閽�
- // TreeDel() {
- // this.$confirm('鏄惁鍒犻櫎褰撳墠閫夋嫨鐨勫垎绫伙紝灏嗕細鎶婂瓙鍒嗙被涓�骞跺垹闄わ紝濡傛灉瀛樺湪缂栫爜鏁版嵁灏嗕笉鑳借鍒犻櫎锛屾槸鍚︾户缁紵', '鎻愮ず', {
- // confirmButtonText: '纭畾',
- // cancelButtonText: '鍙栨秷',
- // type: 'warning',
- // customClass: 'my-messagebox',
- // }).then(() => {
- // TreeCheckDel(this.nodeClickList).then(res => {
- // if (res.data.data) {
- // TreeDel(this.nodeClickList).then(() => {
- // this.$message({
- // type: 'success',
- // message: '鍒犻櫎鎴愬姛!'
- // });
- // this.getAttr();
- // }).catch(res => {
- // this.$message({
- // type: 'warning',
- // message: res
- // });
- // })
- // } else {
- // this.$confirm('褰撳墠鏁版嵁鍖呭惈鏈変笅绾ф暟鎹紝瑕佸垹闄ょ殑璇濅細鍜屼笅绾ф暟鎹竴璧峰垹闄わ紝浣犵‘璁ょ户缁�?', '鎻愮ず', {
- // confirmButtonText: '纭畾',
- // cancelButtonText: '鍙栨秷',
- // type: 'warning',
- // customClass: 'my-messageboxs',
- // }).then(() => {
- // TreeDel(this.nodeClickList).then(() => {
- // this.$message({
- // type: 'success',
- // message: '鍒犻櫎鎴愬姛!'
- // });
- // this.getAttr();
- // }).catch(res => {
- // this.$message({
- // type: 'warning',
- // message: res
- // });
- // })
- // }).catch(() => {
- // this.$message({
- // type: 'info',
- // message: '宸插彇娑堝垹闄�'
- // });
- // });
- // }
- // })
- // }).catch(() => {
- // this.$message({
- // type: 'info',
- // message: '宸插彇娑堝垹闄�'
- // });
- // });
- // },
- nodeClick(data){
- this.nodeClickList = data
- console.log(data)
+ pageSizes(val){
+ this.pageSize=val
+ },
+ currentPages(val){
+ this.currentPage=val
+ },
+ templateOids(val){
+ this.templateOid=val
+ },
+ tableDataArrays(val){
+ this.tableDataArray=val
}
}
}
diff --git a/Source/UBCS-WEB/vue.config.js b/Source/UBCS-WEB/vue.config.js
index 9beaffe..f13452f 100644
--- a/Source/UBCS-WEB/vue.config.js
+++ b/Source/UBCS-WEB/vue.config.js
@@ -27,11 +27,16 @@
'/api': {
//鏈湴鏈嶅姟鎺ュ彛鍦板潃
// target: 'http://localhost:37000',
+ // target: 'http://localhost:37000',
+ target: 'http://192.168.1.51:37000',
+ //target: 'http://192.168.3.7:37000',
+ // target: 'http://dev.vci-tech.com:37000',
+ // target: 'http://192.168.1.51:37000/',
+ // target: 'http://localhost:37000',
// target: 'http://192.168.1.63:37000',
//target: 'http://192.168.3.7:37000',
// target: 'http://dev.vci-tech.com:37000',
- target: 'http://dev.vci-tech.com:37000',
- // target: 'http://192.168.1.51:37000/',
+ //target: 'http://192.168.1.51:37000/',
//杩滅▼婕旂ず鏈嶅姟鍦板潃,鍙敤浜庣洿鎺ュ惎鍔ㄩ」鐩�
// target: 'https://saber.bladex.vip/api',
ws: true,
--
Gitblit v1.9.3