Skip to content

bdc / bdcdj-web

Go to a project
Toggle navigation
Toggle navigation pinning
378199b5 by “miaofang
Options

--no commit message

1 parent 0a3c79ce
Inline Side-by-side
Showing 3 changed files with 194 additions and 177 deletions
......@@ -14,7 +14,8 @@
:default-expand-all="true"
:expand-on-click-node="false"
node-key="id"
:default-checked-keys="[showTab]">
:default-checked-keys="[showTab]"
>
</el-tree>
<el-collapse v-model="activeName" accordion>
<el-collapse-item
......@@ -22,22 +23,27 @@
ref="sfq"
v-for="(item, index) in sfqdata"
:key="index"
:name="index">
:name="index"
>
<template slot="title">
<span class="text" @click="addlist(item)">
<span>
{{ item.label }}
</span>
<span class="text" @click="tap(item, index)">
<span> {{ item.label }}</span>
</span>
</template>
<el-button
<p
v-for="(item, index) in item.children"
:re='item'
:re="item"
:key="index"
class="sfqcontent"
@click="addlist(item, index)">
:class="[isActive == index ? activeCls : '', errorCls]"
@click="taplist(item, index)"
>
<span>
{{ item.label }}
</el-button>
</span>
<span>
{{ item.zt }}
</span>
</p>
</el-collapse-item>
</el-collapse>
</div>
......@@ -45,15 +51,16 @@
<component
:is="componentTag"
@getBdcdyh="getBdcdyh"
v-bind="currentSelectProps" />
v-bind="currentSelectProps"
/>
</div>
</div>
</template>
<script>
import { getBdcqljqtsx } from "@/api/djbDetail.js";
import { loadTreeData, loadsfqData, getNode } from "./djbFrameData.js";
export default {
data () {
import { getBdcqljqtsx } from "@/api/djbDetail.js";
import { loadTreeData, loadsfqData, getNode } from "./djbFrameData.js";
export default {
data() {
return {
activeName: 0,
//接收参数
......@@ -70,6 +77,9 @@
keyy: "",
iskey: "",
defaultNode: "",
isActive: "",
activeCls: "select",
errorCls: "unselected",
defaultProps: {
value: "id",
children: "children",
......@@ -79,7 +89,7 @@
};
},
props: ["formData"],
mounted () {
mounted() {
this.loadData(this.formData.bdcdyh);
},
methods: {
......@@ -88,14 +98,14 @@
* @author: miaofang
* 点击不动产单元号事件
*/
getBdcdyh (val) {
getBdcdyh(val) {
this.addloadData(val);
},
/**
* @description: addloadData
* @author: miaofang
*/
addloadData (val) {
addloadData(val) {
getBdcqljqtsx({
bdcdyid: val.bdcdyid,
bdcdyh: val.bdcdyh,
......@@ -105,14 +115,15 @@
let index = this.sfqdata.findIndex((item) => {
return item.bdcdyid == val.bdcdyid;
});
this.activeName = index
this.setstyle(index, 0, this.iskey);
this.activeName = index;
// this.setstyle(index, 0, this.iskey);
} else {
this.sfqdata.push(loadsfqData(res.result, val.bdcdyh, val.bdcdyid));
this.activeName = this.sfqdata.length - 1;
this.$nextTick(() => {
this.setstyle(this.sfqdata.length - 1, 0, this.iskey);
})
// this.$nextTick(() => {
// this.setstyle(this.sfqdata.length - 1, 0, this.iskey);
// })
}
}
});
......@@ -121,13 +132,13 @@
bdcdyh: val.bdcdyh,
qllx: this.formData.qllx,
bsmQlxx: this.formData.bsmQlxx,
}
};
},
/**
* @description: loadData
* @author: renchao
*/
loadData (val) {
loadData(val) {
getBdcqljqtsx({
bdcdyid: this.formData.bdcdyid,
bdcdyh: val,
......@@ -145,87 +156,80 @@
);
this.sfqdata[0].children.forEach((item, index) => {
if (item.id == this.defaultNode.id) {
this.iskey = index
this.loadComponent(item.form);
this.isActive = index;
}
})
this.setstyle(0, 0, this.iskey);
})
});
// this.setstyle(0, 0, this.iskey);
});
}
})
});
this.currentSelectProps = {
bdcdyid: this.formData.bdcdyid,
bdcdyh: val,
qllx: this.formData.qllx,
bsmQlxx: this.formData.bsmQlxx,
}
};
},
/**
* @description: handleNodeClick
* @param {*} data
* @author: renchao
*/
handleNodeClick (data) {
handleNodeClick(data) {
this.loadComponent(data.form);
},
setstyle (newindex, index, key) {
if (key != undefined || this.keyy == index) {
if (key != undefined) {
this.keyy = key
}
this.loadComponent(this.$refs.sfq[newindex].$children[this.keyy].$attrs.re.form);
let dpme = this.$refs.sfq[newindex].$children[this.keyy].$el
dpme.style.backgroundColor = "#f5f5f5";
dpme.style.color = "#0079fe";
dpme.style.borderRight = "4px solid #0079fe";
} else {
let dpme = this.$refs.sfq[newindex].$children[this.keyy].$el
dpme.style.backgroundColor = "#ffffff";
dpme.style.color = "black";
dpme.style.border = "none";
}
},
// setstyle(newindex, index, key) {
// if (key != undefined || this.keyy == index) {
// if (key != undefined) {
// this.keyy = key;
// }
// this.loadComponent(
// this.$refs.sfq[newindex].$children[this.keyy].$attrs.re.form
// );
// let dpme = this.$refs.sfq[newindex].$children[this.keyy].$el;
// dpme.style.backgroundColor = "#f5f5f5";
// dpme.style.color = "#0079fe";
// dpme.style.borderRight = "4px solid #0079fe";
// } else {
// let dpme = this.$refs.sfq[newindex].$children[this.keyy].$el;
// dpme.style.backgroundColor = "#ffffff";
// dpme.style.color = "black";
// dpme.style.border = "none";
// }
// },
/**
* @description: addlist
* @param {*} data
* @author: renchao
* 新增列表功能
*/
addlist (data, index) {
if (index != undefined) {
let newindex = this.sfqdata.findIndex((item) => {
return item.bdcdyid == data.bdcdyid;
});
this.setstyle(newindex, index);
this.currentSelectProps.bdcdyid = data.bdcdyid;
tap(data, index) {
this.loadComponent(data.form);
} else {
},
taplist(data, index) {
this.loadComponent(data.form);
let newindex = this.sfqdata.findIndex((item) => {
return item.bdcdyid == data.bdcdyid;
});
this.setstyle(newindex, index);
}
this.isActive = index;
},
/**
* @description: loadComponent
* @param {*} form
* @author: renchao
*/
loadComponent (form) {
console.log(form, 'form');
loadComponent(form) {
console.log(form, "form");
this.componentTag = (r) =>
require.ensure([], () => r(require("@/views/registerBook/" + form)));
}
}
}
},
},
};
</script>
<style scoped lang="scss">
/deep/.rollTable {
/deep/.rollTable {
height: calc(100vh - 300px) !important;
}
}
.content {
.content {
width: 100%;
height: 100%;
display: flex;
......@@ -247,35 +251,35 @@
background-color: #f5f5f5;
border: 1px solid rgb(228, 228, 228);
}
}
}
/deep/ .expanded.el-tree-node__expand-icon,
/deep/ .el-tree-node__expand-icon {
/deep/ .expanded.el-tree-node__expand-icon,
/deep/ .el-tree-node__expand-icon {
visibility: hidden;
}
}
/deep/ .el-tree-node__content {
/deep/ .el-tree-node__content {
border: 1px solid rgb(228, 228, 228);
height: 45px;
}
}
/deep/ .el-tree-node:focus > .el-tree-node__content {
/deep/ .el-tree-node:focus > .el-tree-node__content {
// background-color: #f5f5f5;
// color: #0079fe;
// border-right: 4px solid #0079fe;
}
}
/deep/.el-tree-node {
/deep/.el-tree-node {
white-space: pre-wrap;
}
}
/deep/ .is-current > .el-tree-node__content {
/deep/ .is-current > .el-tree-node__content {
// background-color: #f5f5f5;
// color: #0079fe;
// border-right: 4px solid #0079fe;
}
}
/deep/.el-collapse-item__header {
/deep/.el-collapse-item__header {
width: 100%;
cursor: pointer;
position: relative;
......@@ -300,37 +304,45 @@
display: inline-block;
line-height: 45px;
border: 1px solid rgb(228, 228, 228);
}
/deep/.el-collapse-item__content {
}
/deep/.el-collapse-item__content {
padding-bottom: 5px;
}
/deep/.sfqcontent {
white-space: wrap;
}
/deep/.unselected {
// white-space: wrap;
border: none;
padding: 0;
margin: 0;
cursor: pointer;
width: 100%;
height: 100px;
word-break: break-word;
display: inline;
span {
font-size: 13px;
display: block;
line-height: 15px;
margin-left: 70px;
}
width: 250px;
height: 45px;
border: 1px solid rgb(228, 228, 228);
border-right: 4px solid #f5f5f5;
margin: auto;
text-align: center;
align-items: center;
span {
width: 100%;
display: inline-block;
justify-content: center;
align-items: center;
}
.sfqcontent:hover {
background-color: #f5f5f5;
color: black;
}
.sfqcontent:focus {
}
.select {
border: none;
cursor: pointer;
width: 250px;
height: 45px;
background-color: #f5f5f5;
color: #0079fe;
border-right: 4px solid #0079fe;
margin: auto;
text-align: center;
align-items: center;
span {
width: 100%;
display: inline-block;
justify-content: center;
align-items: center;
}
}
</style>
......
......@@ -89,12 +89,12 @@ export function getNode (qllx, qlxx, bdcdylx, bdcdyid) {
if (qlxxPage[i].qllx == qllx) {
if (qllx == "A04" || qllx == "A06" || qllx == "A08") {
if (bdcdylx == "4") {
node = { bdcdyid: bdcdyid, id: "fdcq1", form: "fdcq1.vue", label: qlxxPage[i].label + "(临:" + qlxx.linShi + "，现:" + qlxx.xianShi + "，历:" + qlxx.liShi + ")" };
node = { bdcdyid: bdcdyid, id: "fdcq1", form: "fdcq1.vue", label: qlxxPage[i].label ,zt: "(临:" + qlxx.linShi + "，现:" + qlxx.xianShi + "，历:" + qlxx.liShi + ")" };
} else {
node = { bdcdyid: bdcdyid, id: "fdcq2", form: "fdcq2.vue", label: qlxxPage[i].label + "(临:" + qlxx.linShi + "，现:" + qlxx.xianShi + "，历:" + qlxx.liShi + ")" };
node = { bdcdyid: bdcdyid, id: "fdcq2", form: "fdcq2.vue", label: qlxxPage[i].label ,zt: "(临:" + qlxx.linShi + "，现:" + qlxx.xianShi + "，历:" + qlxx.liShi + ")" };
}
} else {
node = { bdcdyid: bdcdyid, id: qlxxPage[i].id, form: qlxxPage[i].form, label: qlxxPage[i].label + "(临:" + qlxx.linShi + "，现:" + qlxx.xianShi + "，历:" + qlxx.liShi + ")" };
node = { bdcdyid: bdcdyid, id: qlxxPage[i].id, form: qlxxPage[i].form, label: qlxxPage[i].label ,zt: "(临:" + qlxx.linShi + "，现:" + qlxx.xianShi + "，历:" + qlxx.liShi + ")" };
}
break;
}
......
......@@ -26,21 +26,26 @@
:name="index"
>
<template slot="title">
<span class="text" @click="addlist(item)">
<span class="text" @click="tap(item)">
<span>
{{ item.label }}
</span>
</span>
</template>
<el-button
<p
v-for="(item, index) in item.children"
:re='item'
:re="item"
:key="index"
class="sfqcontent"
@click="addlist(item, index)"
:class="[isActive == index ? activeCls : '', errorCls]"
@click="taplist(item, index)"
>
<span>
{{ item.label }}
</el-button>
</span>
<span>
{{ item.zt }}
</span>
</p>
</el-collapse-item>
</el-collapse>
</div>
......@@ -79,6 +84,9 @@ export default {
queryForm: {},
defaultNode: "",
isActive: "",
activeCls: "select",
errorCls: "unselected",
defaultProps: {
value: "id",
children: "children",
......@@ -176,13 +184,9 @@ export default {
return item.bdcdyid == val.bdcdyid;
});
this.activeName = index
this.setstyle(index, 0, this.iskey);
} else {
this.sfqdata.push(loadsfqData(res.result, val.bdcdyh, val.bdcdyid));
this.activeName = this.sfqdata.length - 1;
this.$nextTick(() => {
this.setstyle(this.sfqdata.length - 1, 0, this.iskey);
})
}
}
});
......@@ -215,13 +219,14 @@ export default {
);
this.sfqdata[0].children.forEach((item, index) => {
if (item.id == this.defaultNode.id) {
this.iskey = index
this.loadComponent(item.form);
this.isActive = index;
}
})
// this.$refs.tree.setCurrentKey(this.defaultNode.id); //data[0].id为默认选中的节点
// this.loadComponent(this.defaultNode.form);
this.setstyle(0, 0, this.iskey);
// this.setstyle(0, 0, this.iskey);
});
......@@ -252,49 +257,41 @@ export default {
* @author: renchao
* 设置样式和点击定位到当前功能
*/
setstyle (newindex, index, key) {
if (key != undefined || this.keyy == index) {
if (key != undefined) {
this.keyy = key
}
this.loadComponent(this.$refs.sfq[newindex].$children[this.keyy].$attrs.re.form);
let dpme = this.$refs.sfq[newindex].$children[this.keyy].$el
dpme.style.backgroundColor = "#f5f5f5";
dpme.style.color = "#0079fe";
dpme.style.borderRight = "4px solid #0079fe";
} else {
let dpme = this.$refs.sfq[newindex].$children[this.keyy].$el
dpme.style.backgroundColor = "#ffffff";
dpme.style.color = "black";
dpme.style.border = "none";
}
// setstyle (newindex, index, key) {
// if (key != undefined || this.keyy == index) {
// if (key != undefined) {
// this.keyy = key
// }
// this.loadComponent(this.$refs.sfq[newindex].$children[this.keyy].$attrs.re.form);
// let dpme = this.$refs.sfq[newindex].$children[this.keyy].$el
// dpme.style.backgroundColor = "#f5f5f5";
// dpme.style.color = "#0079fe";
// dpme.style.borderRight = "4px solid #0079fe";
// } else {
// let dpme = this.$refs.sfq[newindex].$children[this.keyy].$el
// dpme.style.backgroundColor = "#ffffff";
// dpme.style.color = "black";
// dpme.style.border = "none";
// }
// },
/**
* @description: tap
* @param {*} data
* @author: renchao
* 新增列表功能
*/
tap(data, index) {
this.loadComponent(data.form);
},
/**
* @description: addlist
* @description: taplist
* @param {*} data
* @author: renchao
* 新增列表功能
*/
addlist (data, index) {
if (index != undefined) {
let newindex = this.sfqdata.findIndex((item) => {
return item.bdcdyid == data.bdcdyid;
});
this.setstyle(newindex, index);
this.currentSelectProps.bdcdyid = data.bdcdyid;
taplist(data, index) {
this.loadComponent(data.form);
} else {
let newindex = this.sfqdata.findIndex((item) => {
return item.bdcdyid == data.bdcdyid;
});
this.setstyle(newindex, index, this.iskey);
this.currentSelectProps.bdcdyid = data.bdcdyid;
}
this.isActive = index;
},
/**
* @description: loadComponent
......@@ -390,33 +387,41 @@ export default {
/deep/.el-collapse-item__content {
padding-bottom: 5px;
}
/deep/.sfqcontent {
white-space: wrap;
/deep/.unselected {
// white-space: wrap;
border: none;
padding: 0;
margin: 0;
cursor: pointer;
width: 100%;
height: 100px;
word-break: break-word;
display: inline;
span {
font-size: 13px;
display: block;
line-height: 15px;
margin-left: 70px;
}
width: 250px;
height: 45px;
border: 1px solid rgb(228, 228, 228);
border-right: 4px solid #f5f5f5;
margin: auto;
text-align: center;
align-items: center;
span {
width: 100%;
display: inline-block;
justify-content: center;
align-items: center;
}
}
.sfqcontent:hover {
background-color: #f5f5f5;
color: black;
}
.sfqcontent:focus {
.select {
border: none;
cursor: pointer;
width: 250px;
height: 45px;
background-color: #f5f5f5;
color: #0079fe;
border-right: 4px solid #0079fe;
margin: auto;
text-align: center;
align-items: center;
span {
width: 100%;
display: inline-block;
justify-content: center;
align-items: center;
}
}
</style>
......