Skip to content

bdc / bdcdj-web

Go to a project
Toggle navigation
Toggle navigation pinning
16cd8026 by tianhaohao@pashanhoo.com
Options

Merge branch 'dev' of http://yun.pashanhoo.com:9090/bdc/bdcdj-web into dev

2 parents 1ea405c0 c58e4a32
Inline Side-by-side
Showing 1 changed file with 157 additions and 143 deletions
<!--
* @Author: yangwei
* @Date: 2023-02-28 15:47:12
* @LastEditors: yangwei
* @LastEditTime: 2023-09-20 17:14:39
* @LastEditors: vers
* @LastEditTime: 2024-02-05 16:06:30
* @FilePath: \bdcdj-web\src\views\lpb\lpbContent\ch.vue
* @Description:
*
......@@ -16,14 +16,16 @@
border="1"
cellspacing="0"
cellpadding="0"
v-show="ch.length">
v-show="ch.length"
>
<tr v-for="(cs, csIndex) in ch" :key="csIndex">
<!-- 显示层数 -->
<td
class="floor"
ref="cBsm"
@contextmenu.prevent="openMenu($event, cs, 'c')"
@click="handleClickC($event, cs)">
@click="handleClickC($event, cs)"
>
{{ cs.sjc }}层
</td>
<!-- 显示户 -->
......@@ -35,15 +37,22 @@
:data-qszt="hs.qszt"
ref="hBsm"
:key="hsIndex"
:style="{'border-color': borderColor}"
:style="{ 'border-color': borderColor }"
:class="hs.select ? 'tdSelect' : ''"
@click="handleClickH($event.target, hs.bsm, hs)"
@dblclick="dbclick(hs.bsm)"
@contextmenu.prevent="openMenu($event, hs, 'h')">
@contextmenu.prevent="openMenu($event, hs, 'h')"
>
{{ hs.shbw }}
<span @click.stop="" class="hqszt lin" v-show="hs.qszt == '0'">临</span>
<span @click.stop="" class="hqszt zheng" v-show="hs.qszt == '1'">正</span>
<span @click.stop="" class="hqszt xian" v-show="hs.qszt == '2'">现</span>
<span @click.stop="" class="hqszt lin" v-show="hs.qszt == '0'"
>临</span
>
<span @click.stop="" class="hqszt zheng" v-show="hs.qszt == '1'"
>正</span
>
<span @click.stop="" class="hqszt xian" v-show="hs.qszt == '2'"
>现</span
>
<ul @click.stop="hDyztClick($event, hs.bsm, hs)" class="dyzt">
<li style="background-color: #6edee1" v-show="hs.qqzt == '1'">
确
......@@ -71,14 +80,16 @@
</template>
<script>
import { set } from "nprogress";
export default {
name: "BdcdjWebCh",
inject: {
openMenu:{value:'openMenu',default:null},
selectAll:{value:'selectAll',default:null},
changeChoosedObj:{value:'changeChoosedObj',default:null},
clearChangeChoosedObj:{value:'clearChangeChoosedObj',default:null},
getBsmList:{value:'getBsmList',default:null}
openMenu: { value: "openMenu", default: null },
selectAll: { value: "selectAll", default: null },
changeChoosedObj: { value: "changeChoosedObj", default: null },
clearChangeChoosedObj: { value: "clearChangeChoosedObj", default: null },
getBsmList: { value: "getBsmList", default: null },
},
props: {
ch: {
......@@ -87,10 +98,10 @@ export default {
return [];
},
},
onlyShow:{
onlyShow: {
type: Boolean,
default: true,
}
},
},
data() {
return {
......@@ -101,26 +112,27 @@ export default {
//区分单双击事件的定时器
time: null,
// 边框颜色
borderColor:'rgb(230, 230, 230)',
borderColor: "rgb(230, 230, 230)",
// 申请单元列表数据
unitIdList:[],
unitIdList: [],
// 组件标识
compFlag:Math.random()
compFlag: Math.random(),
};
},
mounted() {
// 根据申请单元列表数据处理选中户
console.log("window.unitData",window.unitData);
if(window.unitData && window.unitData.length){
window.unitData.forEach(e => {
this.unitIdList.push(e.bdcdyid)
})
console.log("window.unitData", window.unitData);
if (window.unitData && window.unitData.length) {
window.unitData.forEach((e) => {
this.unitIdList.push(e.bdcdyid);
});
console.log(this.unitIdList, "this.unitIdList");
this.ch.forEach((c) => {
c.hs.forEach((h) => {
if (h.dyhbsm.indexOf(this.unitIdList) > -1) {
if (this.unitIdList.indexOf(h.dyhbsm) > -1) {
h.select = true;
// 使用hbsmList时，需要去重
this.hbsmList.push(h.bsm)
this.hbsmList.push(h.bsm);
}
});
});
......@@ -144,7 +156,7 @@ export default {
e.target.className += " tdSelect";
h.select = true;
// 使用hbsmList时，需要去重
this.hbsmList.push(h.bsm)
this.hbsmList.push(h.bsm);
});
} else {
//选中→未选中
......@@ -217,88 +229,90 @@ export default {
* @param {*} flag
* @author: renchao
*/
zdySelectAll(val,flag) {
zdySelectAll(val, flag) {
// 手动点击全部取消选中
!flag && this.clearChangeChoosedObj()
!flag && this.clearChangeChoosedObj();
this.ch.forEach((c) => {
c.hs.forEach((h) => {
if (val) {
h.select = true;
// 使用hbsmList时，需要去重
this.hbsmList.push(h.bsm)
this.hbsmList.push(h.bsm);
} else {
h.select = false;
this.borderColor = 'rgb(230, 230, 230)'
this.hbsmList = []
this.borderColor = "rgb(230, 230, 230)";
this.hbsmList = [];
}
});
});
this.$refs.hBsm && this.$refs.hBsm.forEach((item) => {
// item.style.borderColor = this.borderColor
item.style.backgroundColor = '#fff';
// item.style.border = `1px solid ${this.borderColor}`
});
this.$refs.hBsm &&
this.$refs.hBsm.forEach((item) => {
// item.style.borderColor = this.borderColor
item.style.backgroundColor = "#fff";
// item.style.border = `1px solid ${this.borderColor}`
});
},
//清除选中
clearChoosed(){
clearChoosed() {
//清除选中户
this.zdySelectAll(false)
this.zdySelectAll(false);
//清除选中层
this.cbsmList = [];
this.$refs.cBsm && this.$refs.cBsm.forEach((item)=>{
item.className = 'floor'
})
this.$refs.cBsm &&
this.$refs.cBsm.forEach((item) => {
item.className = "floor";
});
},
},
watch: {
selectAll: {
handler(val) {
this.zdySelectAll(val.selectAll);
val.cancelChoosed && this.clearChoosed()
val.cancelChoosed && this.clearChoosed();
},
immediate: true,
deep: true,
},
hbsmList(val){
let list = []
val.length && val.forEach((i)=>{
this.ch.forEach((c) => {
c.hs.forEach((h) => {
if (i == h.bsm) {
list.push(
{
bdcdyh:h.bdcdyh,
bsm:h.bsm,
dyhbsm:h.dyhbsm,
bdcdyid:h.dyhbsm,
hbsmList(val) {
let list = [];
val.length &&
val.forEach((i) => {
this.ch.forEach((c) => {
c.hs.forEach((h) => {
if (i == h.bsm) {
list.push({
bdcdyh: h.bdcdyh,
bsm: h.bsm,
dyhbsm: h.dyhbsm,
bdcdyid: h.dyhbsm,
zl: h.zl,
bdcdylx:'7',
flag:this.compFlag
}
)
}
bdcdylx: "7",
flag: this.compFlag,
});
}
});
});
});
})
this.getBsmList(list,this.compFlag)
this.getBsmList(list, this.compFlag);
},
changeChoosedObj: {
handler(val) {
this.borderColor = 'rgb(230, 230, 230)';
this.borderColor = "rgb(230, 230, 230)";
if (val.bsms.length) {
//清除选中户
this.zdySelectAll(false,true)
this.zdySelectAll(false, true);
this.$refs.hBsm.forEach((item) => {
val.bsms.forEach((i,ind) => {
val.bsms.forEach((i, ind) => {
if (item.dataset.bsm == i) {
if (ind == 0) {
//定位到第一个户所在位置
window.lpbContent.$refs.lpbContent.scrollTop = item.offsetTop;
window.lpbContent.$refs.lpbContent.scrollLeft = item.offsetLeft;
window.lpbContent.$refs.lpbContent.scrollLeft =
item.offsetLeft;
}
// item.style.border = '1px solid '+ val.color;
// 背景色高亮
item.style.backgroundColor = val.color;
item.style.backgroundColor = val.color;
}
});
});
......@@ -306,95 +320,95 @@ export default {
},
immediate: true,
deep: true,
}
},
},
};
</script>
<style lang="scss" scoped>
.ch-wrap {
display: flex;
flex-direction: column-reverse;
.chTable {
// margin-left: -1px;
border-color: #e4ebf4 !important;
border-collapse: collapse;
border-spacing: 0;
// position: relative;
tr {
.ch-wrap {
display: flex;
flex-direction: column-reverse;
.chTable {
// margin-left: -1px;
border-color: #e4ebf4 !important;
border-collapse: collapse;
border-spacing: 0;
// position: relative;
tr {
.floor {
min-width: 56px;
background: #e8f2ff;
border: 1px solid #acbae8;
}
&:first-child {
.floor {
min-width: 56px;
background: #e8f2ff;
border: 1px solid #acbae8;
border-radius: 4px 0px 0px 1px;
}
&:first-child {
.floor {
border-radius: 4px 0px 0px 1px;
}
}
td {
min-width: 138px;
height: 64px;
line-height: 64px;
text-align: center;
cursor: pointer;
position: relative;
.hqszt {
display: inline-block;
width: 16px;
height: 16px;
font-size: 12px;
line-height: 16px;
position: absolute;
left: 6px;
top: 6px;
border: 1px solid;
border-radius: 3px 0px 3px 0px;
}
.lin {
color: #f7b500;
border-color: #f7b500;
}
.zheng {
color: #1ad6e1;
border-color: #1ad6e1;
}
.xian {
color: #45aefd;
border-color: #45aefd;
}
td {
min-width: 138px;
height: 64px;
line-height: 64px;
text-align: center;
cursor: pointer;
position: relative;
.hqszt {
.dyzt {
user-select: none;
width: 138px;
height: 18px;
position: absolute;
bottom: 28px;
box-sizing: border-box;
padding: 0 6px;
li {
display: inline-block;
width: 16px;
height: 16px;
width: 18px;
height: 18px;
font-size: 12px;
line-height: 16px;
position: absolute;
left: 6px;
top: 6px;
line-height: 18px;
color: #ffffff;
border: 1px solid;
border-radius: 3px 0px 3px 0px;
}
.lin {
color: #f7b500;
border-color: #f7b500;
}
.zheng {
color: #1ad6e1;
border-color: #1ad6e1;
}
.xian {
color: #45aefd;
border-color: #45aefd;
border-radius: 9px;
}
.dyzt {
user-select: none;
width: 138px;
height: 18px;
position: absolute;
bottom: 28px;
box-sizing: border-box;
padding: 0 6px;
li {
display: inline-block;
width: 18px;
height: 18px;
font-size: 12px;
line-height: 18px;
color: #ffffff;
border: 1px solid;
border-radius: 9px;
}
}
}
.tdSelect {
border: 1px solid;
border-color: #5a78de !important;
background-image: url("./images/tdSelect.png");
background-repeat: no-repeat;
background-position: right top;
background-size: 30px;
}
.hasBorder {
border-width: 1px;
border-style: solid;
}
}
.tdSelect {
border: 1px solid;
border-color: #5a78de !important;
background-image: url("./images/tdSelect.png");
background-repeat: no-repeat;
background-position: right top;
background-size: 30px;
}
.hasBorder {
border-width: 1px;
border-style: solid;
}
}
}
}
</style>
......